﻿
/* ===============================================
DOCUMENT /////////////////////////////////////////////////////////// */

body {
}

.layout {
    margin: 0 auto;
}


.title {
    background: none repeat scroll 0 0 #222;
    padding: 20px 0;
    border: 1px solid #000;
    font: normal 24px OpenSansRegular;
    color: #fff;
    text-align: center;
    text-shadow: 0 2px 0 #222;
}

/* ===============================================
HEADER /////////////////////////////////////////////////////////// */


/* ===============================================
CONTENT /////////////////////////////////////////////////////////// */


/* Driver Login Page */

#driverLoginPage {
    background-image: url("../resources/images/backgrounds/light_noise_diagonal.png");
    color: #343434;
}

#driverLoginPage #frmLogin {
    margin: 50px auto 30px;
    width: 700px;
}

#driverLoginPage #frmLogin > .title {
    background: none repeat scroll 0 0 #222;
    padding: 20px 0;
    border: 1px solid #000;
    font: normal 24px OpenSansRegular;
    color: #fff;
    text-align: center;
    text-shadow: 0 2px 0 #000;
    border-radius: 5px 5px 0 0;
	margin-top: 15px;
}

/*
#driverLoginPage #frmLogin > .title {
    background: none repeat scroll 0 0 #222;
    padding: 20px 0;
    border: 1px solid #000;
    font: normal 24px OpenSansRegular;
    color: #fff;
    text-align: center;
    text-shadow: 0 2px 0 #b84a06;
    border-radius: 5px 5px 0 0;
}*/



#driverLoginPage #frmLogin > .message {
    background: none repeat scroll 0 0 #dee8ff;
    padding: 20px 0;
    border: 1px solid #bbc4d9;
    font: normal 24px OpenSansRegular;
    color: #222;
    text-align: center;
    text-shadow: 0 1px 0 #000;
}


#driverLoginPage #frmLogin > .content {
    background: none repeat scroll 0 0 #FFF;
    padding: 10px 50px 30px;
    border-radius: 0 0 5px 5px;
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.1);
}

#driverLoginPage input.remember_me {
    -ms-transform: scale(2.5);
    -moz-transform: scale(2.5);
    -webkit-transform: scale(2.5);
    -o-transform: scale(2.5);
}


/* Driver Menu Page */

#driverMenuPage {
    background-image: url("../resources/images/backgrounds/light_noise_diagonal.png");
    color: #343434;
}

#driverMenuPage #logoMain {
    display: block;
    margin-top: 30px;
}

#driverMenuPage #driverMenu {
    margin: 20px auto 30px;
    background: #E8EAEA;
    padding: 4px 4px 8px;
}

#driverMenuPage #driverMenu > .title {
    background: none repeat scroll 0 0 #222;
    padding: 10px 0;
    border: 1px solid #042dc3;
    font: normal 20px OpenSansRegular;
    color: #fff;
    text-align: center;
    text-shadow: 0 2px 0 #000;
    border-radius: 5px 5px 0 0;
}

#driverMenuPage #driverMenu > .content {
    background: none repeat scroll 0 0 #FFF;
    padding: 15px 20px;
    border-radius: 0 0 5px 5px;
}

#driverMenuPage #listDriver > li {
    width: 33.33%;
    height: 170px;
    padding: 15px;
}

#driverMenuPage .menu {
        /*width: 100px;
        display: block;*/
    }

    #driverMenuPage .icon-pre-sell {
        background: url('../resources/images/icons/pre-sell.png') scroll no-repeat 0 0 / 100% 100% transparent;
    }

    #driverMenuPage .icon-record-route {
        background: url('../resources/images/icons/record-route.png') scroll no-repeat 0 0 / 100% 100% transparent;
    }

    #driverMenuPage .icon-view-print-order-date {
        background: url('../resources/images/icons/view-print-order-date.png') scroll no-repeat 0 0 / 100% 100% transparent;
    }

    #driverMenuPage .icon-view-print-order-customer {
        background: url('../resources/images/icons/view-print-order-customer.png') scroll no-repeat 0 0 / 100% 100% transparent;
    }

    #driverMenuPage .icon-take-truck-inventory {
        background: url('../resources/images/icons/take-truck-inventory.png') scroll no-repeat 0 0 / 100% 100% transparent;
    }

    #driverMenuPage .icon-view-truck-inventory {
        background: url('../resources/images/icons/view-truck-inventory.png') scroll no-repeat 0 0 / 100% 100% transparent;
    }

    #driverMenuPage .icon-load-truck {
        background: url('../resources/images/icons/load-truck.png') scroll no-repeat 0 0 / 100% 100% transparent;
    }

    #driverMenuPage .icon-logout {
        background: url('../resources/images/icons/logout.png') scroll no-repeat 0 0 / 100% 100% transparent;
    }

    #driverMenuPage #listDriver > li.disabled > a i {
        opacity: .5;
    }

    #driverMenuPage #listDriver #dateDriverMenu .input-parent {
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
    }

    #driverMenuPage #listDriver #dateDriverMenu .input-parent #inputDateDriverMenu {
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
        opacity: 0;
    }

    #driverMenuPage .ui-dialog {
        overflow: inherit !important;
    }

    #driverMenuPage .ui-dialog .ui-dialog-buttonpane {
        padding: 5px 0;
    }

    #selectCustomerDiv {
        display: none;
    }



    .checkedorder {
        background: url("../resources/images/check.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
        display: inline-block;
        height: 16px;
        width: 16px;
    }

    .receivedorderitem {
        background: url("../resources/images/check.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
        display: inline-block;
        height: 16px;
        width: 16px;
    }


    /* Main Page */
    #mainPage {
    }

    #mainPage #logoAndMenuArea {
        display: table;
        table-layout: fixed;
        width: 100%;
        padding: 20px 0;
    }

    #mainPage #logoHead {
        display: table-cell;
        width: 40%;
        vertical-align: top;
    }

    #mainPage #linkNavHeadArea {
        display: table-cell;
        width: 60%;
        padding-top: 2%;
        padding-left: 40px;
        vertical-align: top;
    }

    #mainPage #UserAccountAndOrderNoteArea > .col {
        width: 33.33%;
        height: 350px;
        float: left;
        padding: 5px;
    }

    #mainPage #UserAccountAndOrderNoteArea > .col .box-1 {
        height: 100%;
    }


    #mainPage #orderSummaryLineArea > .col {
        width: 50%;
        float: left;
        padding: 5px;
    }

    #mainPage #orderSummaryLineArea #numLinesArea label {
        display: inline-block;
        width: 180px;
    }

    #mainPage #orderSummaryLineArea #subtotalDivArea label {
        display: inline-block;
        width: 180px;
    }

    #mainPage #orderSummaryLineArea #depositDivArea label {
        display: inline-block;
        width: 180px;
    }

    #mainPage #orderSummaryLineArea #taxDivArea label {
        display: inline-block;
        width: 180px;
    }

    #mainPage #orderSummaryLineArea #subtotalDivArea label {
        display: inline-block;
        width: 180px;
    }

    #mainPage #orderSummaryLineArea #totalDivArea label {
        display: inline-block;
        width: 180px;
    }










    #mainPage #orderSummaryLineArea #numLinesArea span {
        color: #13953e;
    }

    #mainPage #orderSummaryLineArea #subtotalDivArea span {
        color: #13953e;
    }

    #mainPage #orderSummaryLineArea #depositDivArea span {
        color: #13953e;
    }

    #mainPage #orderSummaryLineArea #depositDivArea #returnsDiv {
        color: #13953e;
    }

    #mainPage #orderSummaryLineArea #taxDivArea span {
        color: #13953e;
    }

    #mainPage #orderSummaryLineArea #totalDivArea span {
        color: #13953e;
    }


    #mainPage #txtaddresscust,
    #mainPage #txtaddinfouser {
        line-height: 20px;
        margin-top: 5px;
    }


    #mainPage #linkNavHead a .icon-menu-r {
        display: inline-block;
        /*width: 37px;
        height: 37px;
        background: url('../resources/images/icons/menu-r.png');
        position: relative;
        top: 1px;
        background-size: 100%;
        background-repeat: no-repeat;*/
    }

    #mainPage #linkNavHead a .icon-menu-r {
        display: inline-block;
        /*width: 37px;
        height: 37px;
        background: url('../resources/images/icons/menu-r.png');
        position: relative;
        top: 1px;
        background-size: 100%;
        background-repeat: no-repeat;*/
    }

    #mainPage #linkNavHead a:hover .icon-menu-r {
        /*background: url('../resources/images/icons/menu-r-focus.png') scroll no-repeat 0 0 / 100% 100% transparent;*/
    }


    /*For View Cart*/
    #mainPage #viewCart .row .item-no .row-respondsive {
        display: none;
    }

    #mainPage #viewCart .row .item-no {
        width: 200px;
    }

    #mainPage #viewCart .row .unitprice {
        width: 220px;
    }

    #mainPage #viewCart .row .qty {
        width: 100px;
    }

    #mainPage #viewCart .row .qty input[type=number] {
        width: 65px;
    }

    #mainPage #viewCart .row .shortdesc {
        width: 70%;
        padding-left:40px;
    }


    #mainPage #viewCart .row .line-total {
        width: 150px;
    }

    #mainPage #viewCart .row .item-total {
        width: 150px;
    }

    #mainPage #viewCart .row .tax-total {
        width: 100px;
    }

   #mainPage #viewCart .row .deposit-total {
        width: 100px;
    }
	
    #mainPage #viewCart .row .remove {
        width: 50px;
    }

    #mainPage #viewCart .table-description-1 {
        display: none;
        border-top: 1px solid #dcdcdc;
    }

    #mainPage #viewCart .table-description-1 .row label {
        width: 125px;
    }

    #mainPage #viewCart .table-description-1 .exqty input[type=number] {
        width: 65px;
    }

    #mainPage #viewCart .table-description-1 .exunitprice,
    #mainPage #viewCart .table-description-1 .exqty,
    #mainPage #viewCart .table-description-1 .exline-total,
    #mainPage #viewCart .table-description-1 .exitem-total,
	#mainPage #viewCart .table-description-1 .exdeposit-total,
    #mainPage #viewCart .table-description-1 .extax-total {
        display: none;
    }






    /*for standard*/
    #mainPage #standardOrder_length {
        display: inline-block;
    }

    #mainPage #standardOrder .row span .icon-button-1 {
        margin: 3px 7px 3px 3px;
    }

    #mainPage #standardOrder .caption .row span {
        padding-left: 20px;
    }

    #mainPage #standardOrder .caption .row span:first-of-type {
        padding-left: 10px;
    }

    #mainPage #standardOrder .content .row span:first-of-type {
        padding-left: 0;
    }

    #mainPage #standardOrder .row .sku {
        /*width: 110px;*/
        width: 190px;
    }


    #mainPage #standardOrder .row .category {
        width: 15%;
    }

    #mainPage #standardOrder .row .product {
        width: 50%;
    }

    #mainPage #standardOrder .row .product.link-2 {
        /*width: 100%;*/
        text-decoration: underline;
        color: #2fb0d7;
    }

    #mainPage #standardOrder .row .unitprice {
        /*width: 300px;*/
		width: 10%;
    }

    #mainPage #standardOrder .row .par {
        width: 10%;
    }

    #mainPage #standardOrder .row .qty {
        width: 90px;
    }

    #mainPage #standardOrder .row .qty > input[type=number] {
        width: 65px;
    }

    #mainPage #standardOrder .table-description-1 {
        display: none;
        border-top: 1px solid #dcdcdc;
    }

    #mainPage #standardOrder .table-description-1 .row label {
        width: 150px;
    }

    #mainPage #standardOrder .table-description-1 .excategory {
        display: none;
    }

    #mainPage #standardOrder .table-description-1 .exproduct {
        display: none;
    }

    #mainPage #standardOrder .table-description-1 .exunitprice {
        display: none;
    }

    #mainPage #standardOrder .table-description-1 .expar {
        display: none;
    }

    #mainPage #standardOrder .table-description-1 .exqty {
        /*display: none;*/
    }

    #mainPage #standardOrder .table-description-1 .exqty input[type=number] {
        width: 65px;
    }






    /*for All Products*/
    #mainPage #allProductsOrder_length {
        display: inline-block;
    }

    #mainPage #allProductsOrder .row span .icon-button-1 {
        margin: 3px 7px 3px 3px;
    }

    #mainPage #allProductsOrder .caption .row span {
        padding-left: 20px;
    }

    #mainPage #allProductsOrder .caption .row span:first-of-type {
        padding-left: 10px;
    }

    #mainPage #allProductsOrder .content .row span:first-of-type {
        padding-left: 0;
    }

    #mainPage #allProductsOrder .row .sku {
        /*width: 110px;*/
        width: 190px;
    }


    #mainPage #allProductsOrder .row .category {
        width: 15%;
    }

    #mainPage #allProductsOrder .row .product {
        width: 50%;
    }

    #mainPage #allProductsOrder .row .product.link-2 {
        /*width: 100%;*/
        text-decoration: underline;
        color: #2fb0d7;
    }

    #mainPage #allProductsOrder .row .unitprice {
        /*width: 300px;*/
    }

    #mainPage #allProductsOrder .row .par {
        /*width: 150px;*/
        width: 10%
    }

    #mainPage #allProductsOrder .row .qty {
        width: 90px;
    }

    #mainPage #allProductsOrder .row .qty > input[type=number] {
        width: 65px;
    }

    #mainPage #allProductsOrder .table-description-1 {
        display: none;
        border-top: 1px solid #dcdcdc;
    }

    #mainPage #allProductsOrder .table-description-1 .row label {
        width: 150px;
    }

    #mainPage #allProductsOrder .table-description-1 .exqty input[type=number] {
        width: 65px;
    }

    #mainPage #allProductsOrder .table-description-1 .excategory,
    #mainPage #allProductsOrder .table-description-1 .exproduct,
    #mainPage #allProductsOrder .table-description-1 .exunitprice,
    #mainPage #allProductsOrder .table-description-1 .expar,
    #mainPage #allProductsOrder .table-description-1 .exqty {
        display: none;
    }


    /*for Receiving Order*/
    #mainPage #receiveProductsOrder_length {
        display: inline-block;
    }

    #mainPage #receiveProductsOrder .row span .icon-button-1 {
        margin: 3px 7px 3px 3px;
    }

    #mainPage #receiveProductsOrder .caption .row span {
        /*padding-left: 20px;*/
    }

    #mainPage #receiveProductsOrder .caption .row span:first-of-type {
        padding-left: 10px;
    }

    #mainPage #receiveProductsOrder .content .row span:first-of-type {
        padding-left: 0;
    }

    #mainPage #receiveProductsOrder .row .sku {
        /*width: 110px;*/
        width: 190px;
    }


    #mainPage #receiveProductsOrder .row .category {
        width: 20%;
    }

    #mainPage #receiveProductsOrder .row .product {
        width: 50%;
    }
 
    #mainPage #receiveProductsOrder .row .receiving {
        width: 50%;
        white-space: pre-wrap !important;
    }
   
    

    #mainPage #receiveProductsOrder .row .product.link-2 {
        /*width: 100%;*/
        text-decoration: underline;
        color: #2fb0d7;
    }

    #mainPage #receiveProductsOrder .row .unitprice {
        /*width: 300px;*/
    }

    #mainPage #receiveProductsOrder .row .par {
        /*width: 150px;*/
        width: 10%
    }

    #mainPage #receiveProductsOrder .row .qty {
        width: 90px;
    }

    #mainPage #receiveProductsOrder .row .qty-received > input[type=number] {
        width: 65px;
    }

    #mainPage #receiveProductsOrder .table-description-1 {
        display: none;
        border-top: 1px solid #dcdcdc;
    }

    #mainPage #receiveProductsOrder .table-description-1 .row label {
        width: 150px;
    }

    #mainPage #receiveProductsOrder .table-description-1 .exqty input[type=number] {
        width: 65px;
    }

    #mainPage #receiveProductsOrder .table-description-1 .excategory,
    #mainPage #receiveProductsOrder .table-description-1 .exproduct,
    #mainPage #receiveProductsOrder .table-description-1 .exunitprice,
    #mainPage #receiveProductsOrder .table-description-1 .expar,
    #mainPage #receiveProductsOrder .table-description-1 .exqty {
        display: none;
    }









    /*for history*/
    #mainPage #historyOrder_length {
        display: inline-block;
        float:left;
    }

    #mainPage #historyOrder .row span .icon-button-1 {
        margin: 3px 7px 3px 3px;
    }

    #mainPage #historyOrder .caption .row span {
        padding-left: 20px;
    }

    #mainPage #historyOrder .caption .row span:first-of-type {
        padding-left: 10px;
    }

    #mainPage #historyOrder .content .row span:first-of-type {
        padding-left: 0;
    }
    
    #mainPage #historyOrder .row .history {
        width: 50%;
        white-space: pre-wrap !important;
    }
  
    #mainPage #historyOrder .row .sku {
        width: 190px;
    }

    #mainPage #historyOrder .row .category {
        width: 20%;
    }

    #mainPage #historyOrder .row .product {
        width: 50%;
    }
    #mainPage #historyOrder .row .qty-ordered {
        width: 15%;
        text-align:center;
    }

    #mainPage #standardOrder .row .product.link-2 {
        /*width: 100%;*/
        text-decoration: underline;
        color: #2fb0d7;
    }

    #mainPage #historyOrder .row .unitprice {
        /*width: 300px;*/
    }

    #mainPage #historyOrder .row .par {
        /*width: 150px;*/
        width: 10%;
    }

    #mainPage #historyOrder .row .qty {
        /*width: 90px;*/
        width: 15%;
        text-align:center;
    }

    #mainPage #historyOrder .row .qty > input[type=number] {
        width: 65px;
    }

    #mainPage #historyOrder .table-description-1 {
        display: none;
        border-top: 1px solid #dcdcdc;
    }

    #mainPage #historyOrder .table-description-1 .row label {
        width: 150px;
    }

    #mainPage #historyOrder .table-description-1 .excategory {
        display: none;
    }

    #mainPage #historyOrder .table-description-1 .exproduct {
        display: none;
    }

    #mainPage #historyOrder .table-description-1 .exunitprice {
        display: none;
    }

    #mainPage #historyOrder .table-description-1 .expar {
        display: none;
    }

    #mainPage #historyOrder .table-description-1 .exqty {
        /*display: none;*/
    }

    #mainPage #historyOrder .table-description-1 .exqty input[type=number] {
        width: 65px;
    }


   /*for frequently purchased */
    #mainPage #frequentlyPurchasedOrder_length {
        display: inline-block;
    }

    #mainPage #frequentlyPurchasedOrder .row span .icon-button-1 {
        margin: 3px 7px 3px 3px;
    }

    #mainPage #frequentlyPurchasedOrder .caption .row span {
        padding-left: 20px;
    }

    #mainPage #frequentlyPurchasedOrder .caption .row span:first-of-type {
        padding-left: 10px;
    }

    #mainPage #frequentlyPurchasedOrder .content .row span:first-of-type {
        padding-left: 0;
    }

    #mainPage #frequentlyPurchasedOrder .row .sku {
        width: 190px;
    }

    #mainPage #frequentlyPurchasedOrder .row .category {
        width: 15%;
    }

    #mainPage #frequentlyPurchasedOrder .row .product {
        width: 50%;
    }

    #mainPage #standardOrder .row .product.link-2 {
        /*width: 100%;*/
        text-decoration: underline;
        color: #2fb0d7;
    }

    #mainPage #frequentlyPurchasedOrder .row .unitprice {
        /*width: 300px;*/
    }

    #mainPage #frequentlyPurchasedOrder .row .par {
        /*width: 150px;*/
        width: 10%;
    }

    #mainPage #frequentlyPurchasedOrder .row .qty {
        width: 90px;
    }

    #mainPage #frequentlyPurchasedOrder .row .qty > input[type=number] {
        width: 65px;
    }

    #mainPage #frequentlyPurchasedOrder .table-description-1 {
        display: none;
        border-top: 1px solid #dcdcdc;
    }

    #mainPage #frequentlyPurchasedOrder .table-description-1 .row label {
        width: 150px;
    }

    #mainPage #frequentlyPurchasedOrder .table-description-1 .excategory {
        display: none;
    }

    #mainPage #frequentlyPurchasedOrder .table-description-1 .exproduct {
        display: none;
    }

    #mainPage #frequentlyPurchasedOrder .table-description-1 .exunitprice {
        display: none;
    }

    #mainPage #frequentlyPurchasedOrder .table-description-1 .expar {
        display: none;
    }

    #mainPage #frequentlyPurchasedOrder .table-description-1 .exqty {
        /*display: none;*/
    }

    #mainPage #frequentlyPurchasedOrder .table-description-1 .exqty input[type=number] {
        width: 65px;
    }


    /* ===  SUBMIT ORDER Page ===============================/ */

    #submitOrderPage {
        padding: 20px 0;
    }

    #submitOrderPage #logoAndMenuArea {
        border-bottom: 2px solid #000;
        display: table;
        padding: 0 0 10px;
        table-layout: fixed;
        width: 100%;
    }

    #submitOrderPage #logoHead {
        display: table-cell;
        width: 40%;
        vertical-align: baseline;
    }

    #submitOrderPage #orderTitle {
        display: table-cell;
        padding-left: 100px;
        font: bold 28px Arial;
        color: var(--mainaccentcolor);
        text-transform: uppercase;
        vertical-align: baseline;
		float:right;
    }


    #submitOrderPage #orderInfor #ocsInfor {
        float: left;
    }

    #submitOrderPage #orderInfor #customerInfor {
        width: 300px;
        float: right;
    }

    #submitOrderPage #tableCustomerInfor .row label {
        width: 125px;
    }


    #submitOrderPage #tableUserOrder {
        width: 800px;
    }

    #submitOrderPage #tableUserOrder .caption .row {
        background: #faefb0;
    }

    #submitOrderPage #tableUserOrder .row .po {
        width: 175px;
    }

    #submitOrderPage #tableUserOrder .row .delivery {
        width: 200px;
    }

    #submitOrderPage #tableUserOrder .row .user {
        width: 100%;
    }


    /*#submitOrderPage #tableProductOrder .row .sku .row-respondsive {
        display: none;
    }*/

    #submitOrderPage #tableProductOrder .row .sku {
        width: 150px;
    }

    #submitOrderPage #tableProductOrder .row .qty {
        text-align: center;
        width: 75px;
    }

    #submitOrderPage #tableProductOrder .row .description {
        text-align: left;
        width: 70%;
    }

    #submitOrderPage #tableProductOrder .row .unit {
        width: 150px;
    }

    #submitOrderPage #tableProductOrder .row .price {
        text-align: right;
        width: 125px;
    }

    #submitOrderPage #tableProductOrder .row .item-total {
        text-align: right;
        width: 125px;
    }
    #submitOrderPage #tableProductOrder .row .deposit {
        text-align: right;
        width: 100px;
    }
    #submitOrderPage #tableProductOrder .row .tax {
        text-align: right;
        width: 100px;
    }

    #submitOrderPage #tableProductOrder .row .linetotal {
        width: 20%;
        text-align: right;
    }

    #submitOrderPage #tableProductOrder .table-description-1 {
        display: none;
        border-top: 1px solid #dcdcdc;
    }

    #submitOrderPage #tableProductOrder .table-description-1 .row label {
        width: 150px;
    }

    /*#submitOrderPage #tableProductOrder .table-description-1 .exdescription,*/
    #submitOrderPage #tableProductOrder .table-description-1 .exqty,
    #submitOrderPage #tableProductOrder .table-description-1 .exunit,
    #submitOrderPage #tableProductOrder .table-description-1 .exprice,
    #submitOrderPage #tableProductOrder .table-description-1 .extax,
	#submitOrderPage #tableProductOrder .table-description-1 .extdeposit,
    #submitOrderPage #tableProductOrder .table-description-1 .exitem-total,
    #submitOrderPage #tableProductOrder .table-description-1 .exlinetotal {
        display: none;
    }



    #submitOrderPage #tableProductOrderTotal {
        width: 400px;
    }

    #submitOrderPage #tableProductOrderTotal .row label {
        width: 250px;
    }


    #submitOrderPage #signatureUser {
        background: var(--mainaccentcolor);
        padding: 10px;
    }

    #submitOrderPage #signatureUser .title {
    }

    #submitOrderPage #signatureUser #signature {
        background: #d6d6d6;
        border: 1px solid #DDD;
    }

    #submitOrderPage #signatureUser #signature input[type=button] {
        background: none repeat scroll 0 0 #eee;
        border-radius: 10px;
        padding: 4px 10px;
        bottom: -5px;
    }



    /* ===  View Order History By Customer Page  ===============================/ */
    #viewOrderHistoryByCustomerPage {
        background-image: url("../resources/images/backgrounds/light_noise_diagonal.png");
        color: #343434;
    }




    /* ===  PRINT ORDER Page ===============================/ */

    #printOrderPage {
        padding: 20px 0;
    }

    #printOrderPage #logoAndMenuArea {
        border-bottom: 2px solid #000;
        display: table;
        padding: 0 0 10px;
        table-layout: fixed;
        width: 100%;
    }

    #printOrderPage #logoHead {
        display: table-cell;
        width: 40%;
        vertical-align: baseline;
    }

    #printOrderPage #orderTitle {
        display: table-cell;
        width: 60%;
        padding-left: 100px;
        font: bold 28px Arial;
        color: var(--mainaccentcolor);
        text-transform: uppercase;
        vertical-align: baseline;
    }


    #printOrderPage #orderInfor #ocsInfor {
        float: left;
    }

    #printOrderPage #orderInfor #customerInfor {
        width: 300px;
        float: right;
    }

    #printOrderPage #buildAndShipInfor #buildInfor {
        padding-right: 20px;
    }

    #printOrderPage #tableCustomerInfor .row label {
        width: 125px;
    }


    #printOrderPage #tableUserOrder {
        width: 800px;
    }

    #printOrderPage #tableUserOrder .caption .row {
        background: #faefb0;
    }

    #printOrderPage #tableUserOrder .row .po {
        width: 175px;
    }

    #printOrderPage #tableUserOrder .row .delivery {
        width: 200px;
    }

    #printOrderPage #tableUserOrder .row .user {
        width: 100%;
    }



    #printOrderPage #tableProductOrder .row .sku .row-respondsive {
        display: none;
    }

    #printOrderPage #tableProductOrder .row .sku {
        width: 150px;
    }

    #printOrderPage #tableProductOrder .row .qty {
        text-align: center;
        width: 75px;
    }

    #printOrderPage #tableProductOrder .row .description {
        width: 100%;
    }

    #printOrderPage #tableProductOrder .row .unit {
        width: 150px;
    }

    #printOrderPage #tableProductOrder .row .price {
        text-align: right;
        width: 125px;
    }

    #printOrderPage #tableProductOrder .row .item-total {
        text-align: right;
        width: 125px;
    }

    #printOrderPage #tableProductOrder .row .deposit {
        text-align: right;
        width: 100px;
    }

    #printOrderPage #tableProductOrder .row .tax {
        text-align: right;
        width: 100px;
    }

    #printOrderPage #tableProductOrder .row .linetotal {
        width: 125px;
        text-align: right;
    }

    #printOrderPage #tableProductOrder .table-description-1 {
        display: none;
        border-top: 1px solid #dcdcdc;
    }

    #printOrderPage #tableProductOrder .table-description-1 .row label {
        width: 150px;
    }

    #printOrderPage #tableProductOrder .table-description-1 .exdescription,
    #printOrderPage #tableProductOrder .table-description-1 .exqty,
    #printOrderPage #tableProductOrder .table-description-1 .exunit,
    #printOrderPage #tableProductOrder .table-description-1 .exprice,
    #printOrderPage #tableProductOrder .table-description-1 .extax,
	#printOrderPage #tableProductOrder .table-description-1 .exdeposit,
    #printOrderPage #tableProductOrder .table-description-1 .exitem-total,
    #printOrderPage #tableProductOrder .table-description-1 .exlinetotal {
        display: none;
    }



    #printOrderPage #tableProductOrderTotal {
        width: 400px;
    }

    #printOrderPage #tableProductOrderTotal .row label {
        width: 250px;
    }






    #modalPopup {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 9999999;
    }

    #modalPopup .overlay {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: #000;
        opacity: .8;
    }

    #modalPopup .content {
        position: absolute;
        padding: 5px;
        background: none repeat scroll 0 0 #FFF;
    }

    #modalPopup .content .title {
        background: none repeat scroll 0 0 #000;
        color: #fff;
        font-size: 18px;
        font-weight: bold;
        padding: 10px;
        margin-bottom: 10px;
    }

    #modalPopup .content .close {
        background: url("../resources/images/icons/remove-2.png") no-repeat scroll 0 0 / 100% 100% transparent;
        border-radius: 50%;
        cursor: pointer;
        display: block;
        height: 20px;
        position: absolute;
        right: 11px;
        top: 16px;
        width: 20px;
    }

    #modalPopup .content .close-b {
        background: none repeat scroll 0 0 #fff;
        border-top: 1px solid #ddd;
        bottom: 0;
        left: 0;
        padding: 5px;
        position: absolute;
        width: 100%;
        text-align: right;
    }

    #modalPopup .content .close-b .close-button {
        background: none repeat scroll 0 0 #000;
        color: #fff;
        font-size: 13px;
        font-weight: bold;
        padding: 5px 10px;
    }

    #modalPopup .content .ct {
        overflow: auto;
        padding: 10px;
    }


    textarea {
        border: 1px solid #d1d1d1;
        resize: none;
        padding: 10px;
    }


/* 08/12/2015*/
.pgoto{
    height: 32px; width: 50px; 
    text-align: center; 
    background: rgb(47, 176, 215) none repeat scroll 0% 0%; 
    color: white; font-weight: bold;
}

/* ===============================================
FOOTER /////////////////////////////////////////////////////////// */
