﻿

.field-validation-error {
    color: #b94a48;
    font-size : 1em;
}

.field-validation-valid {
    display: none;
}

input[type="text"].input-validation-error,
input[type="number"].input-validation-error,
input[type="password"].input-validation-error,
textarea.input-validation-error,
input[type="text"].custom-error,
select.input-validation-error,
select.custom-error {
    border: 3px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 3px solid #b94a48;
}

.validation-summary-errors {
    color: #b94a48;
    font-size : 1em;
}

/*.validation-summary-valid {
    display: none;
}*/

/* START : ===== Font Declaration ===== */

/*@font-face {
    font-family: BaseFont;
    src: url('../../../fonts/PSL240pro.otf');
    src: url('../../../fonts/PSL240pro.eot');
    src: url('../../../fonts/PSL240pro.eot') format('embedded-opentype'),
         url('../../../fonts/PSL240pro.woff') format('woff'),
         url('../../../fonts/DB Sathorn X.ttf') format('truetype'),
         url('../../../fonts/PSL240pro.svg') format('svg');
}*/

/*@font-face {
    font-family: BaseFont;
    src: url('../../../fonts/DB Sathorn X.ttf') format('truetype');
}*/

@font-face {
    font-family: BaseFont;
    src: url('../../../fonts/DBHelvethaicaXv32.otf');
    src: url('../../../fonts/DBHelvethaicaXv32.eot');
    src: url('../../../fonts/DBHelvethaicaXv32.eot') format('embedded-opentype'),
         url('../../../fonts/DBHelvethaicaXv32.woff') format('woff'),
         url('../../../fonts/DBHelvethaicaXv32.woff2') format('woff2'),
         url('../../../fonts/DBHelvethaicaXv32.ttf') format('truetype'),
         url('../../../fonts/DBHelvethaicaXv32.svg') format('svg');
}
/* END : ===== Font Declaration ===== */



/* START : ===== HTML tag ===== */
@media (min-width: 768px) {
    html, body, #wrapper, #body,
    #body > .container-fluid,
    #body > .container-fluid > .row,
    #body > .container-fluid > .row > div
    /*#body > .container-fluid > .row > div > .nav-side-menu*/
    {
        height : 100%;
    }
}

@media screen and (orientation:landscape) and (min-width: 1025px){
    body
      {
		width : 99.8%;
    }
}

@media screen and (orientation:landscape) and (max-width: 1024px){
    body
      {
		width : 99.0% !important;
    }
}

@media screen and (orientation:portrait) {
    body
      {
		width : 98.56% !important;
    }
}

html {
    font-size: 62.5%;
    background-color : #f4f4f4;
}

body {
    font-family : 'BaseFont';
    /*font-family : 'PSL Kittithada';*/
    font-size : 2em;      
}

.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

ul, ul > li {
    list-style-type : none;
}

hr{
    border-color : #ddd;
}

h1, h2, h3, h4{
    font-weight : bold;
}

h1 {font-size : 2em;}
h2 {font-size : 1.6em;}
h3 {font-size : 1.4em;}
h4 {font-size : 1.2em;}

a, a:hover {
    color : #fff;
    cursor : pointer;
}

.image img{
    display: block;
    margin: 0 auto;
}

/* Set width on the form input elements since they're 100% wide by default */
input[type="text"], input[type="password"], input[type="number"], select, textarea {
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
    height: 34px;
    line-height: 1.42857;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width : 300px;
    max-width : 100%;
}

input[type="text"].calendar,
input[type="text"].calendar-future,
input[type="text"].calendar-shipping-future,
input[type="text"].calendar-past {
    width : 120px;
    border-top-right-radius : 0;
    border-bottom-right-radius : 0;
    cursor : pointer;
}

.form-group input[type="text"],
.form-group input[type="password"],
.form-group input[type="number"],
.form-group select,
textarea
{
    width : 100%;
}

select.cal-day,
select.cal-month,
select.cal-year{
    width : auto;
}

textarea
{
    width : 100%;
    max-width : 400px;
    height : 100px;
}

@media (max-width: 767px) {
    input[type="text"], input[type="password"], select, textarea{
        width : 100%;
    }
}

table td select,
table td input[type="text"],
table td input[type="password"],
table td input[type="number"]{
    width: auto;
}

select:not([disabled]){
    cursor : pointer;
}
/* END : ===== HTML tag ===== */



/* START : ===== Base Theme ===== */
#topbar{
    /*color : #D52C2B;*/
    /*background-color : #fff;*/
    background-color : #ca1515;
    /*position : fixed;*/
    height : 60px;
    width : 100%;
    z-index : 100;
}

#wrapper {
    /*background-color : #F2F2F2;*/
    margin-top : 60px;
    z-index : 0;
}

    #wrapper .under-wrapper {
        background-color : #fff;
        padding : 0 15px 3em;
        margin : auto -15px;
    }

    #wrapper > div{
        
    }

    #wrapper hr{
        margin : 0;
    }

#body{
    background-color : #f4f4f4;
}

#body .page
{
    padding : 20px 30px;
}

#main-banner {
    margin : 0 auto;
    /*width : 1000px;
    height : 350px;*/
}

#footer {
    background-color : #343434;
    color : #fff;
    padding : 4em 2em 1em 2em;
}

    #footer ul {
        margin-bottom : 0;
        padding-left : 0;
    }

        #footer ul li {
            margin-bottom : 0.8em;
            color : #EAEAEA;
            font-weight : bold;
            list-style : outside;
        }

         #footer ul li a{
             font-weight: normal;
         }        
/* EBD : ===== Base Theme ===== */


/* START : ===== Base Matgin Padding Utilities ===== */
.m0 { margin : 0; }

.ma { margin : 0.5em; }
.mt { margin-top : 0.5em; }
.mr { margin-right : 0.5em; }
.mb { margin-bottom : 0.5em; }
.ml { margin-left : 0.5em; }

.ma2x { margin : 1em; }
.mt2x { margin-top : 1em; }
.mr2x { margin-right : 1em; }
.mb2x { margin-bottom : 1em; }
.ml2x { margin-left : 1em; }

.ma3x { margin : 1.5em; }
.mt3x { margin-top : 1.5em; }
.mr3x { margin-right : 1.5em; }
.mb3x { margin-bottom : 1.5em; }
.ml3x { margin-left : 1.5em; }

.p0 { padding : 0; }

.pa { padding : 0.5em; }
.pt { padding-top : 0.5em; }
.pr { padding-right : 0.5em; }
.pb { padding-bottom : 0.5em; }
.pl { padding-left : 0.5em; }

.pa2x { padding : 1em; }
.pt2x { padding-top : 1em; }
.pr2x { padding-right : 1em; }
.pb2x { padding-bottom : 1em; }
.pl2x { padding-left : 1em; }

.pa3x { padding : 1.5em; }
.pt3x { padding-top : 1.5em; }
.pr3x { padding-right : 1.5em; }
.pb3x { padding-bottom : 1.5em; }
.pl3x { padding-left : 1.5em; }
/* END : ===== Base Matgin Padding Utilities ===== */



/* START : ===== Custom CSS ===== */
.round-circle {
    border-radius : 50%;
}
.header-underline{
    border-bottom : 2px solid #f00;
}

 i.fa-facebook-square { color : #465EA6;}
 i.fa-google-plus-square { color : #DC4735;}
 i.fa-shopping-bag {color:#7098D0;}

 .btn-danger i{
     color : #fff;
 }

 .scg-heading-color{
     color : red;
 }

 .dropdown > button {
     background-color : initial;
     border-top : none;
     border-left : none;
     border-right : none;
     text-align: left;
     width: 100%;
     border-radius : 0;
     padding-left : 0;
     padding-top : 0;
 }

.dropdown > button:active{
     background-color : initial;
     box-shadow : none;
     color : #999;
 }

  .dropdown > button span.caret{
      position:absolute;
      right:3px;
      top:45%;
      display:inline-block;
  }

  .calendargroup
  {
      display : inline-block;
  }

  .calendargroup select {
      float : left;
      width : auto;
      margin-right : 5px;
  }

  .calendargroup select:after {
      clear : both;
  }

  #divUserAction .scg-label{
      margin-bottom : 5px;
      margin-right : 3px;
  }

  #divUserAction a.btn{
      font-size : 1em;
      padding-left : 15px;
      padding-right : 15px;
      margin-bottom : 5px;
  }

/* do not group these rules */
input::-webkit-input-placeholder {color: #bbb !important;}
input:-moz-placeholder { /* Firefox 18- */ color: #bbb !important;}
input::-moz-placeholder {  /* Firefox 19+ */color: #bbb !important;}
input:-ms-input-placeholder {  color: #bbb !important;  }
input.calendar::-webkit-input-placeholder, input.calendar-future::-webkit-input-placeholder, input.calendar-past::-webkit-input-placeholder {color: #555 !important;}
input.calendar:-moz-placeholder, input.calendar-future:-moz-placeholder, input.calendar-past:-moz-placeholder { /* Firefox 18- */ color: #555 !important;}
input.calendar::-moz-placeholder, input.calendar-future::-moz-placeholder, input.calendar-past::-moz-placeholder {  /* Firefox 19+ */color: #555 !important;}
input.calendar:-ms-input-placeholder, input.calendar-future:-ms-input-placeholder, input.calendar-past:-ms-input-placeholder {  color: #555 !important;  }

button.btn-red i {
    color :#fff ;
}


/* END : ===== Custom CSS ===== */



/* START : ===== Control ===== */
.dropdown-description {
    font-size : 0.8em;
    color : #ccc;
    padding : 0;
}

.btn-secondary {
    color: #373a3c;
    background-color: #fff;
    border-color: #ccc;
}

.input-block-level {
    width : 100%;
}

.field-label {
    font-size : 0.85em;
    color : #999;
}

.field-data {
}

.social-tag {
    display : flex;
}

.social-tag > * {
    margin-right : 5px !important;
    /*margin-bottom : 5px !important;
    float : right;*/
}

.social-tag > a > img{
    vertical-align : top !important;
}

.fb_iframe_widget{
    display : inherit !important;
}

.print-button{
    background-color: #fff;
    border: 1px solid #ccc;
    color: #000;
    display: table;
    padding: 6px;
    width: 60px;
    font-size : 13px;
    line-height : 1;
    border-radius : 3px;
}

.print-button *{
    float : left;
}

.print-button a:hover{
    color : #000;
}

#accordion .panel-white > .panel-heading
{
    color : #333;
}

.calendargroup option:disabled
{
    /*text-decoration : line-through;*/
    display : none;
}

label
{
    color : #999;
    line-height : 1;
}

label.space
{
    width : 100%;
    margin-bottom : 5px;
    height : 15px;
}

/*label[for]:hover
{
    cursor : pointer;
}*/

.succeed,
.succeed i
{
    color : #36d134;
}

.failed,
.failed i
{
    color : red;
}

.pending,
.pending i
{
    color : darkorange;
}

.processing,
.processing i
{
    color : blue;
}

/* END : ===== Control ===== */



/* START : ===== Partial ===== */
#partial_topbar{
    /*background-color : #fff;*/
    background-color : #ca1515;
    padding-top : 5px;
}

    #partial_topbar .shop-name {
        font-weight : bold;
        font-size : 1.2em;
        color: #ffffff;
    }

    #partial_topbar .profile-box {
        margin-top : 15px;
        float : right;
    }

        #partial_topbar .profile-box > div {
            float : left;
        }

        #partial_topbar .profile-box .img-circle {
            margin-right : 10px;
            margin-top : -3px;
        }

        #partial_topbar .profile-box .name {
            font-weight : bold;
            text-align : center;
            line-height : 1;
            color: #ffffff;
        }

        #partial_topbar .profile-box .info {
            font-size : 0.9em;
            text-align : center;
            line-height : 1;
        }

        #partial_topbar .profile-box i.fa-cog {
            padding: 0 0 0 20px;
        }
        

    #partial_topbar .link-menu {
    }

        #partial_topbar .link-menu div {
            float : left;
            margin-right : 10px;
        }

#partial_footer{
    padding-left : 50px;
    padding-right : 50px;
}

 .partial-pagination-box{
    background-color : #fff;
    border-radius : 5px;
    width : 100%;
 }

     .partial-pagination-box .scg-pagination {
        display : inline-block;
        /*background-color : #fff;
        border-radius : 3px;*/
        color : #999;
     }

         .partial-pagination-box .scg-pagination i {
             color : #bbb;
         }

        .partial-pagination-box .scg-pagination .prev-icon,
        .partial-pagination-box .scg-pagination .next-icon,
        .partial-pagination-box .scg-pagination .items {
            float : left;
            margin : 20px 0 5px;
        }

        .partial-pagination-box .scg-pagination .prev-icon,
        .partial-pagination-box .scg-pagination .next-icon{
            width : 30px;
            height : 30px;
            text-align : center;
            cursor : pointer;
        }

        .partial-pagination-box .scg-pagination .page{
            float : left;
            width : 30px;
            height : 30px;
            text-align : center;
            border-radius : 3px;
            line-height: 1.2em;
            cursor : pointer;
         }

            .partial-pagination-box .scg-pagination .page.selected{
                background-color : #EE6D73;
                color : #fff;
                cursor : default;
            }


.form-group button
{
    height : 34px;
}


/*partial product box*/
.partial-product-box
{
    border : 1px solid #eee;
    background-color : #fff;
    color : #555;
}

.partial-product-box:hover
{
    /*background-color : #eee;*/
}

.partial-product-box .image { padding : 15px 15px 10px 15px; height : 250px; }
.partial-product-box .name { margin-bottom : 5px; padding : 0 15px; font-size : 1.1em; height : 3.8em; overflow : hidden; }
.partial-product-box .name a { color : #555 !important; }
.partial-product-box .name a:hover { text-decoration : none; }
.partial-product-box .amount { padding : 0 15px; font-size : 1.1em; font-weight : bold; }
.partial-product-box .footer { padding : 0 15px; display : inline-block; width : 100%; font-size : 0.9em; }
.partial-product-box .price { font-size : 1.1em; font-weight : bold; padding-top : 10px; }
.partial-product-box .btnQueue,
.partial-product-box .btnRequest {
    /*float : right;*/
    /*background-color : #f00;*/
    /*border-radius : 3px;*/
    /*padding : 5px;*/
    cursor : pointer;
    padding : 3px 4px;
    color : #D9534F;
    font-weight : bold;
}

.partial-product-box img.add-to-cart{
    cursor : pointer;
}

.partial-product-box.inactive
{
    background-color : #eee;
    color : #888;
}

.partial-product-box.inactive img
{
    /*-webkit-filter: grayscale(100%);
    filter: grayscale(100%);*/
    opacity : 0.3;
}

.partial-product-box.available .button i{
    color : #f00;
}

.partial-product-box.inactive .button i{
    color : #63a3e8;
}

.partial-product-box.outofstock .button i{
    color : #999;
}

.partial-product-box .reject-price
{
    text-decoration: line-through;
    color :#D9534F;
}

.partial-product-detail{
    background-color : #fff;
    padding : 1em;
    border-radius : 5px;
    border : 1px solid #ddd;
}

.partial-product-detail label {
    color : #999;
}

.partial-product-detail .reject-price
{
    text-decoration: line-through;
    color :#D9534F;
}

/*.partial-product-detail .product-image
{
    height : 400px;
    margin: 0 auto;
}*/

.partial-related-product
{
    width : 100%;
}

.partial-product-detail div.product-image-container,
.partial-related-product a.link-related-product
{
    text-align : center !important;
}

/*.partial-product-detail img.product-image,*/
.partial-related-product img.image-related-product
{
    width : auto !important;
    left : auto !important;
    position : relative !important;
    max-width : 100% !important;
    height : auto !important;
    max-height : 100% !important;
}

.partial-product-detail .product-image-container img.product-image
{
    width : auto !important;
    max-width: 100% !important;
    height : auto !important;
    max-height : 100% !important;
    position : relative !important;
}

.partial-order-detail .product-container .product-item div.image img
{
    max-height : 175px;
}

.partial-update-delivery-postcode .total-scg-delivery-cost
{
    color : red;
    font-weight : bold;
}

/* partial paging */
.box-header .pagination-box
{
    display : inline-table;
}

.searching-box {
    padding : 10px 0;
    font-weight : bold;
    font-size : 1.2em;
    color : #68A8DD;
}


/* END : ===== Partial ===== */


/* START : ===== Home Page ===== */

#home-page .fa-check {
    color: red;
}

#home-page .activity-list > div{
    margin-bottom : 1em;
    padding-bottom : 1em;
    border-bottom : 2px dashed #ccc;
}

#home-page .header h3{
    font-weight : bold;
}

#home-page .header h3.over-line {
  display: table;
  white-space: nowrap;
}
#home-page .header h3.over-line:before,
#home-page .header h3.over-line:after {
  border-top: 2px solid red;
  content: '';
  display: table-cell;
  position: relative;
  top: 0.5em;
  width: 45%;
}
#home-page .header h3.over-line:before {
  right: 1.5%;
}
#home-page .header h3.over-line:after {
  left: 1.5%;
}

#home-page{
    
}

.red-bold{
    font-family : DBHelvethaica;
    font-size : 2em;
    font-weight : bold;
    color : #f00;
}

#home-page .info{
    margin-bottom : 5px;
}

#home-page .info img {
    display : block;
    margin : auto;
}

#home-page .info > div {
    text-align : center;
}

/* END : ===== Home Page Page ===== */

/* BEGIN : ===== Product Page ===== */
#product-page{

}

#product-page .partial-product-box .status-icon{
    /*position : absolute;
    margin : 15px;*/
    position : absolute; top:0px; left 0px;
    margin : 15px;
    display: inline-flex;
    float: left;
}

#product-detail-page .promotion-box .panel
{
    border : 2px solid #D9534F;
    font-size : 1.2em;
}

#product-detail-page .promotion-box .panel-heading
{
    background-color : #D9534F;
    color : #fff;
    font-weight : bold;
    padding: 5px 15px
}

#product-detail-page .promotion-box .panel-heading i
{
    color : #fff;
}

#product-detail-page .promotion-box .panel-body
{
    background-color : #fff3cc;
}

#product-detail-page .partial-product-detail .status-icon{
    /*position : absolute;*/
    z-index : 1;
    position : absolute; top:0px; left 0px;
    margin-top : 15px;
    margin-left : 5px;
    display: inline-flex;
    float: left;
}

.text-highlight {
    font-size : 1.3em;
    font-weight : bold;
}

.price-highlight
{
    font-size : 1.2em;
    font-weight : bold;
    color : #e2231f;
}

a.external-link,
a.external-link:hover
{
    color : #D9534F;
}

/* END : ===== Product Page ===== */

/* START : ===== Login Page ===== */
#login-page {
}

    #login-page .header {
        font-weight : bold;
        border-bottom : 3px solid #f00;
    }

        #login-page .body > form > div {
            margin-bottom : 2em;
        }

    #login-page .label-checkbox {
        color: #b7b7b7;
        font-weight : normal;
        font-size : 0.9em;
    }

    #login-page .field-label {
        margin-bottom : 1em;
    }

    #login-page .body input[type="text"],
    #login-page .body input[type="password"]{
        max-width: 100%;
    }

    #login-page a.forgot-link
    {
        color : #888;
    }
/* END : ===== Login Page ===== */

/* START : ===== Product Detail Page ===== */

#product-detail-page
{

}

#product-detail-page #btnRequest
{
    color : #D9534F;
    font-weight : bold;
    font-size : 1.1em;
}

/* END : ===== Product Detail Page ===== */

/* START : ===== Edit Info Page ===== */
#edit-info-page {
}

    #edit-info-page .header {
        font-weight : bold;
        border-bottom : 3px solid #f00;
    }

    #edit-info-page .body {
        background-color : #fff;
    }

        #edit-info-page .body > form > div.row > div
        ,#edit-info-page .body > form > div.attribute-box > div.row > div {
            margin-bottom : 3em;
        }

    #edit-info-page .label-over {
        color : #a7a7a7;
        font-size : 0.9em;
        line-height: 0.9em;
        margin-bottom: 0.3em;
        margin-top: -1em;
    }

    #edit-info-page .label-checkbox {
        font-weight : normal;
        cursor : pointer;
    }
/* END : ===== Edit Info Page ===== */


/* START : ===== Change Password Page ===== */
#changepassword-page {
}

    #changepassword-page .header {
        font-weight : bold;
        border-bottom : 3px solid #f00;
    }

    #changepassword-page .body {
        background-color : #fff;
    }

        #changepassword-page .body > form > div.row > div {
            margin-bottom : 2em;
        }

    #changepassword-page .label-checkbox {
        font-weight : normal;
        cursor : pointer;
    }
/* END : ===== Change Password Page ===== */


/* BEGIN : ===== Forgot Password Page */
#forgotpassword-page .body
{
    background-color : #fff;
    padding : 40px 20px;
}

#forgotpassword-page .body .row > div
{
    margin : 10px auto;
}

/* END : ===== Forgot Password Page */


/* BEGIN : ===== Order Product Page */

#order-product-in-cart{
}

    #order-product-in-cart .product-container,
    #order-product-in-cart .product-summary,
    #order-product-in-cart .scg-deliver-box
    {
        background-color : #fff;
        border : 1px solid #ddd;
        border-radius : 5px;
    }

        #order-product-in-cart .product-container #ddlProductShipmentType
        {
            width : 200px;
            max-width : 100%;
        }

        #order-product-in-cart .calendar-icon
        {
            cursor : pointer;
        }

        #order-product-in-cart .product-container div.image img
        {
            max-height : 175px;
        }

    #order-product-in-cart .product-item
    {
        padding-bottom : 15px;
        margin-bottom : 15px;
        border-bottom : 1px solid #ddd;
    }

    #order-product-in-cart .product-item .fa-trash-o
    {
        color : #f00;
    }

    #order-product-in-cart .product-item:last-child
    {
        border : none;
    }

    #order-product-in-cart .product-item .item-name
    {
        font-size : 1.6em;
        font-weight: bold;
    }

    #order-product-in-cart i.product-promo-info 
    {
        margin-left: 5px;
        color: #aaa;
        cursor: pointer;
    }

    #order-product-in-cart div.product-promo-info 
    {
        background-image: url('../../Content/Image/cart_pro.png');
        display:inline-block;
        width: 64px;
        height: 27px; 
        margin-left: 5px;
        cursor: pointer;
    }

    #order-product-in-cart .product-item .lblItemPrice,
    #order-product-in-cart .product-item .lblItemPrice-freegoods,
    #order-product-in-cart .product-item .lblItemNetPrice,
    #order-product-in-cart .product-item .lblPromotionDiscount,
    #order-product-in-cart .product-item .lblTotalNetItemPrice,
    #order-product-in-cart .product-item .lblTotalItemDiscount,
    #order-product-in-cart #lblTotalIncVat
    {
        font-size : 1.1em;
        font-weight : bold;
    }

    #order-product-in-cart .product-item .lblPromotionDiscount,
    #order-product-in-cart .product-item .lblTotalNetItemPrice,
    #order-product-in-cart .product-item .lblTotalItemDiscount
    {
        color : #f00;
    }

    #order-product-in-cart .product-item .freegoodsText
    {
        font-size: 1.6em;
        font-weight : bold;
        color : #f00;
    }

    #order-product-in-cart #btnRemoveProducts i
    {
        color : #e2231f;
    }

/* END : ===== Order Product Page */

/* BEGIN : ===== Confirm Order */
#confirm-order-page{
}

    #confirm-order-page .product-container,
    #confirm-order-page .product-summary,
    #confirm-order-page .customer-info-container,
    #confirm-order-page .shipment-container
    {
        background-color : #fff;
        border : 1px solid #ddd;
        border-radius : 5px;
    }

    #confirm-order-page .shipment-container .image-item
    {
        float : left;
        margin-right : 15px;
        /*height : 100px;*/
        width : 150px;
    }

    #confirm-order-page .product-item
    {
        padding-bottom : 15px;
        margin-bottom : 15px;
        border-bottom : 1px solid #ddd;
    }

    #confirm-order-page .product-item:last-child
    {
        border : none;
    }

    #confirm-order-page .product-item div.image img
    {
        max-height : 175px;
    }

    #confirm-order-page .product-item .item-name
    {
        font-size : 1.6em;
        font-weight: bold;
    }

    #confirm-order-page .product-item .lblItemPrice,
    #confirm-order-page .product-item .lblItemNetPrice
    {
        font-size : 1.2em;
        font-weight : bold;
        color : #e2231f;
    }

    #confirm-order-page .product-item .freegoodsText
    {
        font-size: 1.6em;
        font-weight : bold;
        color : #f00;
    }

    #confirm-order-page #upload-container .image-item
    {
        width : 100px;
        height : 100px;
        float : left;
        margin-right : 15px;
    }

    #confirm-order-page #upload-container .image-item img
    {
        max-height : 100%;
        margin : 0 auto;
        cursor : pointer;
    }

/* END : ===== Confirm Order */

/* BEGIN : ===== Customer In Cart */
#customer-in-cart .customer-info-container .scg-box i.fa-check-circle-o
{
    color : green;
}

#customer-in-cart .customer-info-container .scg-box i.fa-times-circle-o
{
    color : red;

}
#customer-in-cart .customer-info-container,
#customer-in-cart .address-container
{
    background-color : #fff;
    border: 1px solid #ddd;
    border-radius : 5px;
}

    #customer-in-cart .address-container .address-list
    {
        max-height : 300px;
        overflow-y : auto;
    }

    #customer-in-cart .address-short-box
    {
        padding : 10px;
        border : 1px solid #ccc;
        border-radius : 5px;
        margin-bottom : 10px;
    }

        #customer-in-cart .address-short-box input[type=radio]
        {
            color : red;
        }

        #customer-in-cart .address-short-box label
        {
            color : #555;
            cursor : pointer;
        }

#customer-in-cart #upload-container
{

}

#customer-in-cart #upload-container .image-item
{
    float : left;
    margin-right : 15px;
    height : 100px;
    width : 100px;
}

#customer-in-cart #upload-container .image-item img
{
    margin : 0 auto;
    cursor : pointer;
    max-height : 100%;
}

/* search customer dialog */ 
.partial-search-customer-result-dialog table tr.selected
{
    background-color : #f5f5f5;
}

.partial-search-customer-result-dialog table tr td
{
    line-height : 1;
}

.partial-search-customer-result-dialog table tr td:hover
{
    cursor : pointer;
}

.partial-search-customer-result-dialog table tr td.display-radio
{
    width : 40px;
    text-align : center;
}

.partial-search-customer-result-dialog table tr td.display-radio i
{
    padding-top : 8px;
    color : #d9534f;
}

.partial-search-customer-result-dialog table span.name
{
    font-weight : bold;
}

.partial-search-customer-result-dialog table span.code,
.partial-search-customer-result-dialog table span.description
{
    font-size : 0.9em;   
    color : #888;
}

.partial-search-customer-result-dialog table tr td.action-button button
{
    margin-top : 3px;
}

/* END : ===== Customer In Cart */

#login-mobile{
    border-top : 1px solid #ccc;
    border-bottom : 1px solid #ccc;
    text-align : center;
    margin-top : 10px;
    padding-top : 10px;
    padding-bottom : 10px;
}


/* Order Complete */
#order-complete-page #box-result
{
    padding : 20px 0;
    background-color : #fff;
    border : 1px solid #ccc;
    text-align : center;
}

    #order-complete-page #box-result > div
    {
        margin-bottom : 10px;
    }

    #order-complete-page #box-result .order-id
    {
        font-weight : bold;
        font-size : 1.5em;
    }


/* BEGIN : ===== user-view-page */
#user-view-page {
}

#user-view-page #info-box {
    background-color : #fff;
    border : 1px solid #bbb;
    padding : 1em;
    border-radius : 5px;
}
/* END : ===== user-view-page */

/* BEGIN : ===== edit-user-page */
#edit-user-page {
}

#edit-user-page #info-box {
    background-color : #fff;
    border : 1px solid #bbb;
    padding : 1em;
    border-radius : 5px;
}
/* END : ===== edit-user-page */

/* BEGIN : ===== change-password-page */
#change-password-page {
}

#change-password-page #info-box {
    background-color : #fff;
    border : 1px solid #bbb;
    padding : 1em;
    border-radius : 5px;
}
/* END : ===== change-password-page */


/* for king */
.black-ribbon {
  position: fixed;
  z-index: 9999;
  width: 90px;
}
.black-ribbon.stick-top.stick-left {
    display:none;
 }
@media only all and (max-width: 767px) {
  .black-ribbon.stick-top.stick-right {
    display:none;
  }
  .black-ribbon.stick-top.stick-left {
    display:block;
 }
}
@media (min-width: 1360px) and (max-width: 1399px) {
    .black-ribbon {
        width: 110px;
     }
}
@media (min-width: 1400px) {
  .black-ribbon {
    width: auto;
  }
}

.stick-left { left: 0; }
.stick-right { right: 0; }
.stick-top { top: 0; }
.stick-bottom { bottom: 0; }





.nav-side-menu {
  overflow: auto;
  font-weight: 200;
  background-color: #2e353d;
  height: 100%;
  color: #e1ffff;
  /*padding-bottom : 30px;*/
  position : fixed;
  width : inherit;
}
.nav-side-menu .brand {
  background-color: #23282e;
  line-height: 50px;
  display: block;
  text-align: center;
}
.nav-side-menu .toggle-btn {
  display: none;
}
.nav-side-menu ul,
.nav-side-menu li {
  list-style: none;
  padding: 0px;
  margin: 0px;
  line-height: 35px;
  cursor: pointer;
  /*    
    .collapsed{
       .arrow:before{
                 font-family: FontAwesome;
                 content: "\f053";
                 display: inline-block;
                 padding-left:10px;
                 padding-right: 10px;
                 vertical-align: middle;
                 float:right;
            }
     }
*/
}
.nav-side-menu ul :not(collapsed) .arrow:before,
.nav-side-menu li :not(collapsed) .arrow:before {
  font-family: FontAwesome;
  content: "\f078";
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
  float: right;
}
.nav-side-menu ul .active,
.nav-side-menu li .active {
  border-left: 3px solid #d19b3d;
  background-color: #4f5b69;
}

.nav-side-menu ul .disable,
.nav-side-menu li .disable {
  border-left: 3px solid #f00;
  background-color: #4f5b69;
}

.nav-side-menu ul .sub-menu li.active,
.nav-side-menu li .sub-menu li.active {
  color: #d19b3d;
}
.nav-side-menu ul .sub-menu li.active a,
.nav-side-menu li .sub-menu li.active a {
  color: #d19b3d;
}
.nav-side-menu ul .sub-menu li,
.nav-side-menu li .sub-menu li {
  background-color: #181c20;
  border: none;
  line-height: 28px;
  border-bottom: 1px solid #23282e;
  margin-left: 0px;
}
.nav-side-menu ul .sub-menu li:hover,
.nav-side-menu li .sub-menu li:hover {
  background-color: #020203;
}
.nav-side-menu ul .sub-menu li:before,
.nav-side-menu li .sub-menu li:before {
  font-family: FontAwesome;
  content: "\f105";
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
}
.nav-side-menu li {
  padding-left: 0px;
  border-left: 3px solid #2e353d;
  border-bottom: 1px solid #23282e;
}
.nav-side-menu li a {
  text-decoration: none;
  color: #bbb;
  display : block;
  padding : 10px 5px;
}
.nav-side-menu li.disable a{
  text-decoration: none;
  color: #bbb;
  display : block;
  padding : 10px 5px;
  cursor: default;
}
.nav-side-menu li a i {
  padding-left: 10px;
  width: 20px;
  padding-right: 20px;
}
.nav-side-menu li:not(.disable):hover {
  border-left: 3px solid #d19b3d;
  background-color: #4f5b69;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
@media (max-width: 767px) {
  .nav-side-menu {
    position: relative;
    width: 100%;
    margin-bottom: 10px;
  }
  .nav-side-menu .toggle-btn {
    display: block;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 10 !important;
    padding: 3px;
    background-color: #ffffff;
    color: #000;
    width: 40px;
    text-align: center;
  }
  .brand {
    text-align: left !important;
    font-size: 22px;
    padding-left: 20px;
    line-height: 50px !important;
  }
  #newMenu {
    position: absolute;
    z-index: 20 !important;
    top: 54px;
    left: 1%;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    width: 100%;
    transition: all 0.3s ease-in;
  }
  .LMenuCustom{
    position:absolute;
    z-index:500;
    height:auto;
    width:100%;
    top:0;
    left:0;
  }
  .customMobile{
      /*width: 150px !important;
      height: 150px !important;*/
      width: 300px !important;
      height: 170px !important; 
      max-width: 100% !important;  
      max-height: 100% !important;

  }

  .divFixHeaderForMobile{
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 60;
  }
  /*.container-fluid{
    padding-right: 0px !important;
  }*/

}

@media (min-width: 767px) and (max-width: 1280px) {
  
  .nav-side-menu .menu-list .menu-content {
    display: block;
  }

  .customMobile{
        width: 300px !important;
        height: 170px !important; 
        max-width: 100% !important;  
        max-height: 100% !important;      
      
  }

}


@media (min-width: 1280px) {
  .nav-side-menu .menu-list .menu-content {
    display: block;
  }


  .customMobile{
        width: 500px !important;
        height: 200px !important; 
        max-width: 100% !important;  
        max-height: 100% !important;
  }

}

/* table */
.box-body {
    background-color : #fff;
    padding : 20px;
}


#product-category-detail-page .partial-product-box .status-icon .discount-tag {
    color: #fff;
    background-image: url('../../Content/Image/ribbon_pro_dis.png');
    /*background-image: url('../../Content/Image/ic_ribbon_discount.png');*/
    padding: 0px 0;
    width: 47px;
    height: 40px;
    margin-top: 5px;
    margin-left: 5px;
    position: relative;
    left: 0px;
    text-align: center;
    font-weight: 600;
}

#product-category-detail-page .partial-product-box .status-icon .promotion-tag {
    color: #fff;
    background-image: url('../../Content/Image/ribbon_pro2.png');
    padding: 0px 0;
    position: relative;
    left: -13px;
    margin-top: 5px;
    width: 70px;
    height: 41px;
}

#product-detail-page .partial-product-detail .status-icon .promotion-tag {
    color: #fff;
    background-image: url('../../Content/Image/ribbon_pro2.png');
    padding: 0px 0;
    position: relative;
    left: -33px;
    margin-top: 15px;
    width: 70px;
    height: 41px;
}

#product-detail-page .partial-product-detail .status-icon .discount-tag {
    color: #fff;
    background-image: url('../../Content/Image/ribbon_pro_dis.png');
    /*background-image: url('../../Content/Image/ic_ribbon_discount.png');*/
    padding: 0px 0;
    width: 47px;
    height: 40px;
    margin-top: 15px;
    margin-left: 15px;
    position: relative;
    left: -25px;
    text-align: center;
    font-weight: 600;
}

#product-detail-page .breadcrumb
{
    margin-top : 5px;
}

#product-detail-page .breadcrumb i
{
    color : #bbb;
    font-weight : lighter;
}

#product-detail-page .breadcrumb .categoryLabel a
{
    color : #D9534F;
}

/*  prompt plust */

.nav-side-menu .non-click
{
    cursor : default;
}

.nav-side-menu .dealer-label
{
    color : #bbb;
    font-size: 0.85em;
    padding: 10px 12px 5px 12px;
    line-height : 1;
}

.nav-side-menu .dealer-name
{
    color : #eee;
    padding : 0px 12px 5px 12px;
    font-size : 1.1em;
    line-height : 1;
    font-weight : bold;
}

.nav-side-menu hr{
    border-color : #999;
    border-width : 2px;
}

.nav-side-menu .product-count
{
    margin-left : 10px;
    background-color : #f00;
    color : #fff;
    border-radius : 3px;
    padding : 4px 10px 4px 8px;
    text-align : center !important;
    font-weight : bold;
}


/* region dealer page */

#dealer-page .dealer-container
{
    background-color : #fff;
}

#dealer-page table tr td.display-radio i
{
    padding-top : 8px;
    color : #d9534f;
    /* #2e6da4 */
}

#dealer-page table tr span.name
{
    padding-top : 5px;
    font-size : 1.2em;
}


/* product category */

#product-category-detail-page{

}

#product-category-detail-page .breadcrumb
{
    margin-top : 5px;
}

#product-category-detail-page .breadcrumb i
{
    color : #bbb;
    font-weight : lighter;
}

#product-category-detail-page .breadcrumb .categoryLabel
{
    color : #D9534F;
}

#product-category-detail-page #search-box {
    background-color : #fff;
    border : 1px solid #bbb;
    border-radius : 4px;
    padding : 5px 10px;
}

#product-category-detail-page .partial-product-box .status-icon{
    position : absolute; top:0px; left 0px;
    margin-top : 15px;
    margin-left : 5px;
    display:inline-flex;
    float:left;
}

#product-category-page #search-box {
    /*background-color : #fff;
    border : 1px solid #bbb;
    border-radius : 4px;
    padding : 5px 10px;*/
}

.partial-product-category-box
{
    text-align : center;
}

.partial-product-category-box .image
{
    display : inline-block;
}

.partial-product-category-box .name
{
    color : #222;
    background-color : #fff;
    font-weight : bold;
    font-size : 1.1em;
    line-height : 1;
    height: 2.8em;
    padding : 10px 20px;
}

.partial-product-category-box:hover .name
{
    background-color : #ddd;
}

.partial-product-category-box:hover a
{
    text-decoration : none;
}

/* */

#AttachedImage.image-item
{
        /*height : 100px;*/
        width : 150px;
        cursor : pointer;
}
.bageCart{
    position:absolute;
    top: -5px;
    right: -13px;
    cursor: pointer;
    background: #e6dbdb;
    display: inline-block;
    font-size: 15px;
    color: #ec4e4e;
    font-weight: 700;
    padding: 2px 4px 3px;
    text-align: center;
    line-height: normal;
    border-radius: 10px;
}
.initBtnHide{
    display:none;
}
.sale-order-dialog .modal-dialog{
    width: 90%;
}

.bootStrapDialogCenter
{
    display:block;

}

/* 5 Column Style*/
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
position: relative;
left:-5px;
min-height: 1px;
padding-right: 10px;
padding-left: 10px;
}
.col-xs-5ths {
width: 20%;
float: left;
}
@media (min-width: 768px) {
.col-sm-5ths {
width: 20%;
float: left;
}
.widthAutoCustom{
    width: 700px;
}
}
@media (min-width: 992px) {
.col-md-5ths {
width: 20%;
float: left;
}
.widthAutoCustom{
    width: 900px;
}
}
@media (min-width: 1200px) {
.col-lg-5ths {
width: 20%;
float: left;
}
.widthAutoCustom{
    width: 900px;
}
}

#product-category-page .partial-product-box .status-icon .discount-tag {
    color: #fff;
    background-image: url('../../Content/Image/ribbon_pro_dis.png');
    /*background-image: url('../../Content/Image/ic_ribbon_discount.png');*/
    padding: 0px 0;
    width: 47px;
    height: 40px;
    margin-top: 5px;
    margin-left: 5px;
    position: relative;
    left: 0px;
    text-align: center;
    font-weight: 600;
}

#product-category-page .partial-product-box .status-icon .promotion-tag {
    color: #fff;
    background-image: url('../../Content/Image/ribbon_pro2.png');
    padding: 0px 0;
    position: relative;
    left: -13px;
    margin-top: 5px;
    width: 70px;
    height: 41px;
}
#product-category-page .partial-product-box .status-icon{
    position : absolute; top:0px; left 0px;
    margin-top : 15px;
    margin-left : 5px;
    display:inline-flex;
    float:left;
}

.changFamily-tag {
    color: #fff;
    /*background-image: url('../../Content/Image/ChangFamilyIcon.png');*/
    padding: 0px 0;
    position: absolute;
    right: 0;
    bottom:0;
    width: 70px;
}

@media (max-width: 767px) {
.dealer-confirm-dialog {
        position: absolute !important; 
        min-width: 100% !important;
        left: 0 !important;
        top: 25% !important;      
    }
}

@media (max-width: 767px) {
    .webViewHeight{
        height: 250px;
        overflow: auto;
    }
}
@media (min-width: 768px) {
    .webViewHeight{
        height: 300px;
        overflow: auto;
    }
}
@media (min-width: 992px) {
    .webViewHeight{
        height: 300px;
        overflow: auto;
    }
}
@media (min-width: 1200px) {
    .webViewHeight{
        height: 300px;
        overflow: auto;
    }
}

