/********************************************************************/
/*                                                                  */
/*                        Checkout Page                             */
/*                                                                  */
/********************************************************************/

#updpanCheckOutWrapper {
    background: #fff;
    padding: 1em;
    box-shadow: 0 38px 20px -31px rgba(0,0,0,0.2);
}

#panCheckOutHeader {
    font-size: 2.5em;
    font-weight: 800;
    padding: .5em 0 .5em 0;
}

#panCheckOutInformationWrapper {
    width: 100%;
    position: relative;
}

.checkOutFieldValidators {
    color: red;
}

/********************************************************************/
/*                                                                  */
/*                            Left table                            */
/*                                                                  */
/********************************************************************/


#panCheckOutDeliveryInformation {
    display: table-cell;
    width: 62%;
}



.checkOutHeaderTexts {
    font-size: 1.5em;
    background: #3b3b3b;
    padding: .6em .5em .4em .5em;
    display: block;
    color: #eee;
    border-bottom: solid 4px #222;
    box-shadow: 0 8px 5px -2px rgba(0,0,0,0.2);
}

    .checkOutHeaderTexts:before {
        font-family: FontAwesome;
        margin-right: .6em;
        font-size: 1em;
        color: #eee;
    }

/********************************************************************/
/*                                                                  */
/*                           Kunde info                             */
/*                                                                  */
/********************************************************************/


#labCheckOutLoggedInPurchaseHeader:before {
    content: "\f007";
}



#panProceedWithoutLogin span {
    padding-top: 1em;
    display: block;
    height: 2.5em;
    border-top: solid 1px #CCC;
    border-bottom: solid 1px #CCC;
}

#panCheckOutLoggedInPurchaseBox label, #panCheckOutLoggedInPurchaseBox input {
    vertical-align: middle;
    margin-left: .2em;
}

#panProceedWithLogin span {
    padding-top: 10px;
    vertical-align: middle;
    display: block;
    height: 2.5em;
    border-bottom: solid 1px #CCC;
}

#panLoginBox {
    margin: 1em 0 1em 0;
}

#panCheckOutUserNameLine {
    margin-bottom: .2em;
}

#labCheckOutUserName, #labCheckOutPassword {
    width: 7em;
    display: inline-block;
}

#txtCheckOutUserName, #txtCheckOutPassword {
    color: #888;
    padding: 0px 0px 0px 5px;
    border: 1px solid #BBB;
    background: none repeat scroll 0% 0% #FBFBFB;
    outline: 0px none;
    box-shadow: 0px 1px 6px #ECF3F5 inset;
    font: 200 12px/15px Arial,Helvetica,sans-serif;
    height: 2em;
    width: 25em;
    border-radius: 2px;
}

#btnCheckOutLogin {
    display: block;
    font-size: 1em;
    height: 1.8em;
    width: 12em;
    cursor: pointer;
    border: solid 1px #0e8e00;
    color: #FFF;
    font-weight: 800;
    font-family: Calibri;
    margin: 1em 0 0 0;
    background-color: #11aa00;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#11aa00), to(#0e8e00));
    background: -webkit-linear-gradient(top, #11aa00, #0e8e00);
    background: -moz-linear-gradient(top, #11aa00, #0e8e00);
    background: -ms-linear-gradient(top, #11aa00, #0e8e00);
    background: -o-linear-gradient(top, #11aa00, #0e8e00);
}

/********************************************************************/
/*                                                                  */
/*                      Faktura oplysninger                         */
/*                                                                  */
/********************************************************************/

#labCheckOutShipmentHeader:before {
    content: "\f0d1";
}

#panCheckoutAddressInformation {
    padding: .8em 0 1.5em 0;
}

#labCheckOutAsteriskInformation {
    width: auto;
}

.checkOutInputWrapper {
    margin-bottom: .2em;
}

.checkOutInputLabels {
    width: 7em;
    display: inline-block;
}

.checkOutTextBoxes {
    color: #888;
    padding: 0px 0px 0px 5px;
    border: 1px solid #BBB;
    background: none repeat scroll 0% 0% #FBFBFB;
    outline: 0px none;
    box-shadow: 0px 1px 6px #ECF3F5 inset;
    font: 200 12px/15px Arial,Helvetica,sans-serif;
    height: 2em;
    width: 25em;
    border-radius: 2px;
}

#txtCheckOutPostalCode, #txtCheckOutAlternativePostalCode {
    width: 4em;
}

#labCheckOutCity, #labCheckOutAlternativeCity {
    width: 2.5em;
}

#txtCheckOutCity, #txtCheckOutAlternativeCity {
    width: 17.2em;
}

#panCheckOutRequestAlternativeDelivery {
    padding: .5em 0 1em 0;
}

    #panCheckOutRequestAlternativeDelivery input {
        vertical-align: middle;
        margin: 0 .1em 0 .5em;
    }

/********************************************************************/
/*                                                                  */
/*                             Levering                             */
/*                                                                  */
/********************************************************************/

#labCheckOutAddressInformationHeader:before {
    content: "\f015 ";
}

#panCheckOutShipmentBox {
    padding: .8em 0 1.5em 0;
}

#panCheckOutShipmentBox div {
    margin: .3em 0 .2em 0;

}

    #panCheckOutShipmentBox input {
        vertical-align: middle;
        margin:-.1em .1em 0 .2em;
    }

/********************************************************************/
/*                                                                  */
/*                           Kommentar                              */
/*                                                                  */
/********************************************************************/

#labCheckOutCommentHeader:before {
    content: "\f0e5 ";
}

#panCheckOutCommentBox {
    padding: .8em 0 1.5em 0;
}

    #panCheckOutCommentBox input {
        vertical-align: middle;
        margin: 0 .1em 0 .2em;
    }

#txtCheckOutComment {
    display: block;
    margin-top: .2em;
}

#txtCheckOutComment {
    width: 500px;
    height: 120px;
    color: #888;
    padding: 0px 0px 0px 5px;
    border: 1px solid #BBB;
    background: none repeat scroll 0% 0% #FBFBFB;
    outline: 0px none;
    box-shadow: 0px 1px 6px #ECF3F5 inset;
    font: 200 12px/15px Arial,Helvetica,sans-serif;
    resize: none;
}


/********************************************************************/
/*                                                                  */
/*                        Betalingsmetode                           */
/*                                                                  */
/********************************************************************/

#labCheckOutPaymentHeader:before {
    content: "\f09d ";
}



#panCheckOutPaymentBox {
    padding: .8em 0 1.5em 0;
}

#panCheckOutPaymentBox div {
    margin: 0 0 .5em 0;
}

    #panCheckOutPaymentBox input {
        vertical-align: middle;
        margin: 0 .1em 0 .2em;
    }

    .PaymentMethodImages {
        vertical-align: middle;
        margin: 0 0 0 1em;

    }


/********************************************************************/
/*                                                                  */
/*                        Accepter og køb                           */
/*                                                                  */
/********************************************************************/


#panConfirmationApprovalBox span {
    display: inline-block;
    width: auto;
}

    #panConfirmationApprovalBox span input {
        vertical-align: middle;
        margin: 0 .1em 0 .2em;
    }

#btnPayment {
    font-size: 1.5em;
    height: 1.8em;
    width: 12em;
    cursor: pointer;
    border: solid 1px #0e8e00;
    color: #FFF;
    font-weight: 800;
    font-family: Calibri;
    margin: .5em 0 0 0;
    background-color: #11aa00;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#11aa00), to(#0e8e00));
    background: -webkit-linear-gradient(top, #11aa00, #0e8e00);
    background: -moz-linear-gradient(top, #11aa00, #0e8e00);
    background: -ms-linear-gradient(top, #11aa00, #0e8e00);
    background: -o-linear-gradient(top, #11aa00, #0e8e00);
}

    #btnPayment:hover {
        -moz-box-shadow: 0px 0px 1px 1px #808080;
        -webkit-box-shadow: 0px 0px 1px 1px #808080;
        box-shadow: 0px 0px 1px 1px #808080;
    }


/********************************************************************/
/*                                                                  */
/*                             Right table                          */
/*                                                                  */
/********************************************************************/


#panCheckOutOrder {
    display: table-cell;
    padding: 0 0 0 5em;
    width: 40%;
}

#labCheckOutOrderHeadline:before {
    content: "\f07a ";
    font-family: FontAwesome;
    margin-right: .6em;
    font-size: 1em;
    color: #eee;
}

#labCheckOutOrderHeadline {
    margin-top: 10px;
    display: block;
    font-size: 1.5em;
    background: #3b3b3b;
    padding: .6em .5em .4em .5em;
    display: block;
    color: #eee;
    border-bottom: solid 4px #222;
}

/********************************************************************/
/*                                                                  */
/*                         Product table                            */
/*                                                                  */
/********************************************************************/


#panCheckOutGridView table {
    border: none;
    width: 422px;
    box-shadow: 0 8px 5px -2px rgba(0,0,0,0.2);
    margin: 0 0 1em 0;
}

#panCheckOutGridView td {
    border: none;
    border-bottom: solid 1px #efefef;
    font-size: 1.4em;
    background: #ffffff;
    padding: 0 .5em 0 0;
}

.panGridViewImageColumn {
    display: table-cell;
    width: 100px;
    height: 60px;
    vertical-align: middle;
    padding: 5px;
}

.checkOutGridImages {
    max-height: 60px;
    max-width: 100px;
    display: block;
    margin: auto;
}

#panCheckOutTotals {
    padding: .2em;
    font-size: 1.2em;
}

#labCheckOutPurchaseOrderTotal, #labCheckOutPurchaseOrderTotalValue {
    font-weight: bold;
}

#labCheckOutPurchaseOrderSubTotalValue, #labCheckOutPurchaseOrderFreightValue, #labCheckOutPurchaseOrderTotalValue, #labCheckOutPurchaseOrderTaxValue {
    float: right;
}

#labCheckOutPurchaseOrderTax, #labCheckOutPurchaseOrderTaxValue {
    font-size: .9em;
}

#btnEditPurchaseOrder {
    font-size: 1.25em;
    height: 1.8em;
    width: 12em;
    cursor: pointer;
    margin: .5em 0 0 0;
    border: solid 1px #2b2b2b;
    color: #FFF;
    font-weight: 800;
    font-family: Calibri;
    float: right;
    background-color: #3b3b3b;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#3b3b3b), to(#2b2b2b));
    background: -webkit-linear-gradient(top, #3b3b3b, #2b2b2b);
    background: -moz-linear-gradient(top, #3b3b3b, #2b2b2b);
    background: -ms-linear-gradient(top, #3b3b3b, #2b2b2b);
    background: -o-linear-gradient(top, #3b3b3b, #2b2b2b);
}

    #btnEditPurchaseOrder:hover {
        -moz-box-shadow: 0px 0px 1px 1px #808080;
        -webkit-box-shadow: 0px 0px 1px 1px #808080;
        box-shadow: 0px 0px 1px 1px #808080;
    }


/********************************************************************/
/*                                                                  */
/*                            Responsive                            */
/*                                                                  */
/********************************************************************/

@media all and (max-width : 1000px) {


    #updpanCheckOutWrapper {
        padding: 0;
    }

    #panCheckOutHeader {
        padding-left: 1%;
    }

    #panCheckoutAddressInformation {
        padding-left: 1%;
    }

    #panCheckOutCommentBox {
        padding-left: 1%;
    }

    #panCheckOutDeliveryInformation {
        display: block;
        width: auto;
    }


    #panCheckOutOrder {
        display: block;
        width: auto;
        padding: 0;
    }



    #panCheckOutGridView table {
        width: 100%;
        font-size: .75em;
    }

    #panCheckOutGridView td:nth-child(1) {
        width: 80px;
    }

    .panGridViewImageColumn {
        padding: 0 0 0 1em;
    }

    .checkOutGridImages {
        max-height: 40px;
    }


    #panCheckOutTotals {
        margin-bottom: 5em;
        padding: 1% 1% 7em 1%;
        font-size: 1em;
    }

    #panCheckOutShoppingAmountLine {
        position: relative;
    }

    #btnEditPurchaseOrder {
        float: none;
        margin-top: 2em;
        position: absolute;
        right: 0;
    }

    #panGoToPayment {
        position: absolute;
        bottom: 1em;
        padding: 0 0 0 1%;
    }

    #btnPayment, #btnEditPurchaseOrder {
        font-size: 1em;
    }

    #btnEditPurchaseOrder {
        margin-top: 4em;
        margin-right: 1%;
        font-size: 1em;
    }


    #txtCheckOutComment {
        width: 25em;
    }
}
/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */
