body,html{
    -webkit-filter: grayscale(45%);
}
h1{
    font-family: 'AngsanaNew';
    font-size: 75px;
    line-height: 40px;
    text-transform: uppercase;
}
h2{
    font-family: 'AngsanaNew';
    font-size: 48px;
    line-height: 42px;
    text-transform: uppercase;
}
h4{
    font-family: 'db_helvethaica_x35';
    font-size: 29px;
    line-height: 14px;
}
.remark{
    font-family: 'db_helvethaica_x35';
    font-size: 16px;
    line-height: 18px;
}
.require{
    background-color: #ffcccc;
    border: 1px #ff9999 solid;

}
input[type=file]{
    display: none;
}
.tmp_require{
    color: #ff6666;
    display: none;
}
.top-company-name{
    font-size: 24px;
    font-family: 'db_helvethaica_x55';
    border-right: 1px #ffffff solid;
    padding-right: 15px;
}
.bg-about{
    background-color: #ffffff;
    background-image: url(../img/bg/about.png);
    background-position: right -50px;
    background-repeat: no-repeat;
    background-size: auto 75%;
}
.btn-inputfile{
    border-radius: 3px !important;
    width: 100% !important;
}
.btn-inputfile i{
    font-size: 14px;
}
.btn-cart{
    background: #b82409; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(-23deg, #f49276, #b82409); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(-23deg, #f49276, #b82409); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(-23deg, #f49276, #b82409); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to -23deg, #f49276 , #b82409); /* Standard syntax */
}
.btn-cart:hover{
    background: #b82409; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(-23deg, #b82409, #b82409); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(-23deg, #b82409, #b82409); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(-23deg, #b82409, #b82409); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to -23deg, #b82409 , #b82409); /* Standard syntax */
}

.f-green{
    color: #00cc66 !important;
}
.f-oreng{
    color: #ffcc33 !important;
}
.f-red{
    color: #ff3333 !important;
}

.about-slogan{
    margin-top: 85px;
    margin-bottom: 85px;
}
.about-slogan h1,.about-slogan h4{
    color: #876357;
    margin: 0;
}
.about-slogan h1{
    background-image: url(../img/line/pink.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    padding-bottom: 23px;
    margin-bottom: 23px;
}
.about-slogan-text{
    font-size: 24px;
    line-height: 26px;
    font-family: 'db_helvethaica_x35';
    max-width: 450px;
    color: #876357;

}
.about{
    position: relative;
    overflow: hidden;
    background: none;
    height: 650px;
    width: 100%;
}
.about-bg-box{
    position: absolute;
    background-color: #876357;
    width: 100%;
    margin: 0;
    /*    -webkit-transform: skew(-20deg);
        -moz-transform: skew(-20deg);
        -o-transform: skew(-20deg);
        -ms-transform: skew(-20deg);
        transform: skew(-20deg);*/

}
.about-bg-box.box-01{
    height: 575px;
    background: #2196f3; /* For browsers that do not support gradients */
    z-index: 1;
    right: 35%;

}
.about-bg-box.box-01 .bg-box-01{
    background-image: url(../img/bg/about_1.png);
    background-position: 100% 36%;
    background-repeat: no-repeat;
    background-size: 80%;
    width: 100%;
    height: 100%;
    /*    -webkit-transform: skew(20deg);
        -moz-transform: skew(20deg);
        -o-transform: skew(20deg);
        -ms-transform: skew(20deg);
        transform: skew(20deg);*/
}
.about-bg-box.box-02{
    height: 434px;
    background-color: #f3c8ff; /* For browsers that do not support gradients */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 2;
    right: -50%;
    bottom: 0;
    overflow: hidden;
}
.about-bg-box.box-02 .bg-box-02{
    background-image: url(../img/bg/about_2.png);
    background-position: -10% center;
    background-repeat: no-repeat;
    background-size: auto;
    width: 100%;
    height: 100%;
    margin-left: -20%;
    /*    -webkit-transform: skew(20deg);
        -moz-transform: skew(20deg);
        -o-transform: skew(20deg);
        -ms-transform: skew(20deg);
        transform: skew(20deg);*/
}
.about-bg-box.box-03{
    height: 180px;
    width: 280px;
    opacity: 0.5;
    z-index: 3;
    background-color: #e9b5a0;
    left: 40%;
    top: 88px;
}
.about-hr{
    position: absolute;
    width: 100%;
    z-index: 4;
    background-image: url(../img/line/white.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-top: 175px;
}
.about-content{
    position: absolute;
    width: 100%;
    z-index: 5;
    margin-top: 60px;
}

.about-content-desc{
    position: relative;
    overflow: hidden;
    font-family: 'db_helvethaica_x35';
    font-size: 24px;
    line-height: 24px;
    color: #ffffff;
}
.about-content-desc h1{
    font-family: 'db_helvethaica_x55';
    font-size: 34px;
    color: #ffffff;
    background-image: url(../img/line/white-bold.png);
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: auto;
    padding-bottom: 10px;
    margin-bottom: 20px;
}
.about-content-desc-foot{
    margin-top: 30px;
    margin-bottom: 30px;
}
.about-pic{
    position: absolute;
    background-color: #876357;
    margin: 0;
    /*    -webkit-transform: skew(-20deg);
        -moz-transform: skew(-20deg);
        -o-transform: skew(-20deg);
        -ms-transform: skew(-20deg);
        transform: skew(-20deg);*/
    overflow: hidden;
}
.about-pic.pic-01{
    height: 380px;
    width: 80%;
    max-width: 580px;
    margin: 0 auto;
    border-radius: 15px;
    -moz-box-shadow:    0 0 20px rgba(0,0,0,0.15);
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.15);
    box-shadow:         0 0 20px rgba(0,0,0,0.15);
}
.about-pic.pic-01 .about-pic-box-01{
    width: 106%;
    height: 100%;
    background-image: url(../img/about/ab_03.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-left: -30px;
}
.about-pic.pic-02{
    height: 250px;
    width: 80%;
    max-width: 393px;
    margin: 0 auto;
    bottom: -480px;
    right: 0;
    border-radius: 15px;
    -moz-box-shadow:    0 0 20px rgba(0,0,0,0.15);
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.15);
    box-shadow:         0 0 20px rgba(0,0,0,0.15);
}
.about-pic.pic-02 .about-pic-box-02{
    width: 100%;
    height: 100%;
    background-image: url(../img/about/ab_05.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /*    -webkit-transform: skew(20deg);
        -moz-transform: skew(20deg);
        -o-transform: skew(20deg);
        -ms-transform: skew(20deg);
        transform: skew(20deg);*/
    /*margin-left: -60px;*/
}

/************* Product **************/
/****************************/
/****************************/
/****************************/
.bg-promotion{
    background-color: #fcfcfc;
}
.promotion{
    position: relative;
    overflow: hidden;
    background: none;
    height: 567px;
    width: 100%;
}
.promotion .header-content{
    padding-bottom: 60px;
}
.promotion-hr{
    position: absolute;
    width: 100%;
    z-index: 1;
    background-image: url(../img/line/brown.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-top: 150px;
}
.promotion-content{
    position: absolute;
    width: 100%;
    z-index: 5;
    margin-top: 60px;
}
.promotion-slide-left{
    position: relative;
    width: 50%;
    float: left;
}
.promotion-slide-left-box{
    position: relative;
    height: 100%;
    padding-right: 10px;
    padding-left: 30px;
}
.promotion-slide-right{
    position: relative;
    width: 50%;
    float: right;
}
.promotion-slide-right-box{
    position: relative;
    height: 100%;
    padding-left: 10px;
    padding-right: 30px;
}
.promotion-slide-left .img-intro, .promotion-slide-right .img-intro{
    border-radius: 15px;
    overflow: hidden;
}
.promotion .slider-boxed {
    margin-top: 0;
}

.promotion .flex-control-nav {
    bottom: -45px;
}

.promotion .flex-control-nav li a {
    background-color: #e9bba8;
}
.promotion .flex-control-nav li:hover a, .promotion .flex-control-nav li a.flex-active {
    background-color: #70544c;
}
.promotion-slide-left .flex-control-nav {
    left: 25px;
}
.promotion-slide-right .flex-control-nav {
    left: 5px;
}
.promotion-slide-pic-box{
    width: 100%;
    height: 295px;
    overflow: hidden;
    background-color: #fff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 15px;
    text-align: center;
    position: relative;
}
.promotion-slide-pic{
    height: 100%;
    width: 100%;
    position: absolute;
    overflow: hidden;
    z-index: 2;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.promotion-slide-pic img{
    height: 100%;
    width: auto;
}
.promotion-slide-pic-bg{
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter        : blur(7px);
    -moz-filter   : blur(7px);
    -webkit-filter: blur(7px);
    -o-filter     : blur(7px);
    position: absolute;
    z-index: 1;
}

/************* News **************/
/****************************/
/****************************/
/****************************/
.parallax-inner{
    padding: 0;
}
.banner-para1 {
    background-image: url("../img/parallax/para_news.jpg") !important;
}
.news{
    position: relative;
    background: none;
    width: 100%;
}
.news-hr{
    position: absolute;
    width: 100%;
    z-index: 1;
    background-image: url(../img/line/white.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-top: 100px;
}
.news-content{
    width: 100%;
    z-index: 5;
    margin-top: 50px;
    margin-bottom: 50px;
}
.news-box{
    position: relative;
    overflow: hidden;
    float: left;
    width: 50%;
    height: 179px;
}
.news-box:first-child{
    height: 358px;
}
.news-box .news-inner-box{
    height: 100%;
    padding: 0 0 20px 10px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    overflow: hidden;
    position: relative;
}

.news-box:first-child .news-inner-box, .news-box:nth-child(4) .news-inner-box{
    padding: 0 10px 20px 0;
}

.news-slide{
    height: 100%;
}
.news-slide .flex-control-nav {
    left: 10px;
    bottom: 30px;
}
.news-slide .flex-viewport {
    height: 100%;
}
.news-slide .slides {
    height: 100%;
}
.news-slide .slides li, .news-slide .carousel.slide .carousel-inner {
    height: 100%;
}
.news-slide .flex-control-nav li a {
    background-color: #e9bba8;
}
.news-slide .flex-control-nav li:hover a, .news-slide .flex-control-nav li a.flex-active {
    background-color: #70544c;
}
.news-box-content{
        width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #fff;
    border-radius: 15px;
}

.news-pic{
    width: 159px;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    float: left;
    margin-right: 10px;
    position: relative;
    overflow: hidden;
}
.news-pic.news-pic-slide{width: 50%;}

.news-pic-box{
    height: 100%;
    width: 100%;
    position: absolute;
    overflow: hidden;
    z-index: 2;
    margin: 0;
    padding: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.news-pic-box img{
    height: auto;
    width: 100%;
}
.news-pic-bg{
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter        : blur(7px);
    -moz-filter   : blur(7px);
    -webkit-filter: blur(7px);
    -o-filter     : blur(7px);
    position: absolute;
    z-index: 1;
}

.news-detail{
    position: relative;
    overflow: hidden;
    height: 100%;
}
.news-detail .news-subject{
    color: #775950;
    font-family: 'db_helvethaica_x55';
    font-size: 24px;
    line-height: 22px;
    margin-top: 17px;
    margin-bottom: 10px;
    padding-right: 20px;
    height: 44px;
    overflow: hidden;
}
.news-detail-slide .news-subject{
    margin-top: 40px;
}
.news-detail .news-desc{
    padding-right: 20px;
    font-size: 12px;
    height: 53px;
    overflow: hidden;
}
.news-detail-slide .news-desc{
    height: 178px;
}
.news-detail .news-readmore{
    color: #775950;
    position: absolute;
    bottom: 5px;
    right: 20px;
    font-family: 'db_helvethaica_x55';
    font-size: 24px;
}
.news-detail-slide .news-readmore{
    bottom: 30px;
}

/************* News **************/
/****************************/
/****************************/
/****************************/
.bg-product{
    background-color: #ffffff;
}
.product{
    position: relative;
    background: none;
    width: 100%;
}
.product-hr{
    position: absolute;
    width: 100%;
    z-index: 1;
    background-image: url(../img/line/brown.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-top: 100px;
}
.product-content{
    width: 100%;
    z-index: 5;
    margin-top: 50px;
    margin-bottom: 50px;
}

.widget-product-headbtn{text-align: center; margin-bottom: 20px;}
.widget-product .owl-carousel .owl-stage-outer{}
.widget-product-item{background-color: #fff; margin: 60px 0 40px 0;
                     -moz-box-shadow:    0 0 20px rgba(0,0,0,0.15);
                     -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.15);
                     box-shadow:         0 0 20px rgba(0,0,0,0.15);
                     border-radius: 15px;
                     position: relative;
}
.widget-product-thumb{
    width: 65%;
    margin: 20px auto 0;
}
.widget-product-item,
.widget-product-item > div,
.widget-product-thumb{
    -webkit-transition:All 0.4s ease;
    -moz-transition:All 0.4s ease;
    -o-transition:All 0.4s ease;
    -webkit-transition-delay:0s;
    -moz-transition-delay:0s;
    -o-transition-delay:0s;
}
.widget-product-item > div{
    opacity: 0.8;
    filter: alpha(opacity=80);
}
.widget-product .center .widget-product-item{position: relative; z-index: 20; margin: 20px -20px 0 -20px;border-radius: 15px;}
.widget-product .center .widget-product-item > div{
    opacity: 1.0;
    filter: alpha(opacity=100);
}
.widget-product .center .widget-product-thumb{
    /*padding-bottom: 112%;*/
    height: 280px;
}
.widget-product .center .widget-product-item,
.widget-product .center .widget-product-item > div,
.widget-product .center .widget-product-thumb{
    -webkit-transition-delay:0.2s;
    -moz-transition-delay:0.2s;
    -o-transition-delay:0.2s;
}
.widget-product-name{
    text-align: center;
    padding: 40px 20px 0;
    height: 86px;
    overflow: hidden;

}
.widget-product-name a h4{
    color: #775950;
    font-size: 24px;
    line-height: 24px;
    font-family: 'db_helvethaica_x55';
    -webkit-transition: All 0.4s ease;
    -moz-transition: All 0.4s ease;
    -o-transition: All 0.4s ease;
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
    max-width: 200px;
    margin: 0 auto;
}
/*.center .widget-product-name a h4{
    color: #775950;
        font-size: 26px;
        line-height: 26px;
    font-family: 'db_helvethaica_x55';
    -webkit-transition: All 0.4s ease;
    -moz-transition: All 0.4s ease;
    -o-transition: All 0.4s ease;
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
}*/
.widget-product-thumb{
    /*padding-bottom: 106%;*/
    position: relative;
    height: 200px;
}
.widget-product-info{padding: 20px; display: inline-block; width: 100%;}
.widget-product-info a.link-wrap h4{margin: 0; font-weight: 100; color: #1a2949; font-size: 30px; line-height: 1em; text-align: center;}
.widget-product-info .widget-product-desc{
    text-align: center;
    font-family: 'db_helvethaica_x35';
    font-size: 24px;
    color: #666666;
    margin: 5px auto 20px;
    max-width: 250px;
    height: 60px;
    overflow: hidden;
}
.widget-product-btn{
    position: absolute;
    width: 100%;
    text-align: center;
    margin-left: -20px;
    display: none;
    -webkit-transition: All 0.4s ease;
    -moz-transition: All 0.4s ease;
    -o-transition: All 0.4s ease;
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
}
.center .widget-product-btn{
    display: block;
    -webkit-transition: All 0.4s ease;
    -moz-transition: All 0.4s ease;
    -o-transition: All 0.4s ease;
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
}
.widget-product-btn .btn-wrap{padding: 0 10px; width: 50%; float: left;}
.widget-product-btn a{width: 100%; font-size: 24px; padding: 0 10px;}
.widget-product-btn a .btn-arrow{margin-left: 5px;}
.widget-product .owl-carousel .owl-nav > div{position: absolute; width: 36px; height: 64px; top: 50%; margin-top: -32px;
                                             -webkit-transition:All 0.2s ease;
                                             -moz-transition:All 0.2s ease;
                                             -o-transition:All 0.2s ease;
}
.widget-product .owl-carousel .owl-prev{
    background-image: url('../img/icon/arrow-left.png');
    background-position: center;
    background-repeat: no-repeat;
    font-size: 0;
    right: 100%;
    margin-right: 20px;
}
.widget-product .owl-carousel .owl-next{
    background-image: url('../img/icon/arrow-right.png');
    background-position: center;
    background-repeat: no-repeat;
    font-size: 0;
    left: 100%;
    margin-left: 20px;
}
.widget-product .owl-carousel .owl-prev:hover{margin-right: 25px;}
.widget-product .owl-carousel .owl-next:hover{margin-left: 25px;}
[off-canvas*="nav-bottom"]{height: 100vh;}
.product-head{height: 100px; padding-top: 28px; background: url('../images/backgrounds/header-producthead.jpg'); text-align: center; margin-bottom: 30px;}
.product-head h2{margin: 0; font-weight: normal; font-size: 36px; color: #24356d; line-height: 0.8em; background: url('../images/backgrounds/shadow-green-2.png') bottom center no-repeat; padding-bottom: 8px;}
.product .filter{margin-bottom: 30px;}
.product .filter .select-default{margin-right: 0; width: 218px;}
.product .filter-search{width: 100%;}
.product .sidebar-menu-mobile{display: none; margin-bottom: 30px;}
.product .sidebar-menu-mobile a{border:2px solid #eeeff4; height: 44px; text-align: center; color: #24356d; font-size: 24px; line-height: 40px; display: block;
                                -webkit-border-radius: 8px;
                                -moz-border-radius: 8px;
                                border-radius: 8px;
}
.product .sidebar-menu-mobile a:hover{background-color: #24356d; border-color: #24356d; color: #fff;}
.product .sidebar-menu li.sidebar-menu-group{padding-top: 0;}
.product .sidebar{padding-right: 10px;}
.product .sidebar-menu li{border-bottom: 1px solid #eeeff4; padding: 15px 0 15px 20px; width: 100%;}
.product .sidebar-menu li a{font-size: 24px; color: #24356d; display: table; width: 100%; line-height: 1.0em;}
.product .sidebar-menu li a:hover{color: #71bb71;}
.product .sidebar-menu li a > div{display: table-cell; vertical-align: top;}
.product .sidebar-menu-number{width: 32px; text-align: left;}
.product .sidebar-menu li.sidebar-menu-group a{font-size: 24px; font-weight: 300;}
.product .sidebar-menu li.sidebar-menu-group{border-bottom: 3px solid #eeeff4;}
.product .sidebar-box{border: 1px solid #24356D;}
.product .sidebar-box-head{background-color: #24356D; height: 40px; line-height: 40px; color: #fff; font-weight: 300; font-size: 24px; padding: 0 20px;}
.product .sidebar-box-wrapper{padding: 10px;}
.product .sidebar-box{margin-bottom: 20px;}
.product .sidebar-box-list{padding: 10px 0 0 0; display: inline-block; width: 100%;}
.product .sidebar-box-list li{display: table; width: 100%; margin-bottom: 10px; padding-left: 10px;}
.product .sidebar-box-list li > div{display: table-cell;vertical-align: top;}
.product .sidebar-box-icon{width: 20px;}
.product .sidebar-box-icon a{display: block; width: 20px; height: 20px; border: 1px solid #24356D; background: url('../images/icons/icon-close-green.png') center no-repeat; background-size: 10px;
                             -webkit-border-radius: 10px;
                             -moz-border-radius: 10px;
                             border-radius: 10px;
}
.product .sidebar-box-icon a:hover{background-color: #24356D;}
.product .sidebar-box-text{color: #24356D; padding-left: 8px; font-size: 24px; font-weight: 100; line-height: 20px;}
.product .sidebar-box-btn{border-top: 1px solid #eeeff4; padding-top: 10px; display: inline-block; width: 100%; text-align: right;}
.product .sidebar-box-btn .btn-green{width: auto; height: 24px; font-size: 16px; line-height: 24px;
                                     -webkit-transition:All 0.2s ease;
                                     -moz-transition:All 0.2s ease;
                                     -o-transition:All 0.2s ease;
}
.product-list-item{border:1px solid #f6f6f6; background-color: #f6f6f6; margin-bottom: 14px; cursor: pointer; position: relative;}
.product-list-thumb{padding-bottom: 86%; position: relative; margin-bottom: 60px;}
.product-list-info{background-color: #fff; text-align: center; padding: 14px 10px; position: absolute; left: 0; right: 0; bottom: 0;}
.product-list-info h4{margin: 0; font-weight: 300; font-size: 25px; color: #1a2949; line-height: 0.8em;}
.product-list-info p{margin: 0; font-weight: normal; font-size: 16px; color: #7f8185; line-height: 0.8em;}
.product-list-btn{position: absolute; width: 100%; left: 0; padding: 0 20px;}
.product-list-btn a{width: 100%; height: 36px; line-height: 34px; font-size: 24px; margin-bottom: 10px; position: relative;}
.product-list-btn a .btn-arrow{position: absolute; right: 10px; top: 10px;}
.product-list-btn .btn-green{background-color: #71bb71; color: #fff;}
.product-list-btn .btn-green:hover{background-color: #1a2949; border-color: #1a2949;}
.product-list-btn .btn-green .btn-arrow{border-left-color: #fff;}
.product-list-info{height: 60px;}
.product-list-btn{bottom: 0;
                  opacity: 0.0;
                  filter: alpha(opacity=0);
}
.product-list-info,
.product-list-info h4,
.product-list-btn{
    -webkit-transition:All 0.4s ease;
    -moz-transition:All 0.4s ease;
    -o-transition:All 0.4s ease;
}
.product-list-item:hover .product-list-info{height: 100%; background-color: rgba(255,255,255,0.9);}
.product-list-item:hover .product-list-info h4{margin-top: 40%;}
.product-list-item:hover .product-list-btn{bottom: 10px;
                                           opacity: 1.0;
                                           filter: alpha(opacity=100);
                                           -webkit-transition-delay:0.4s;
                                           -moz-transition-delay:0.4s;
                                           -o-transition-delay:0.4s;
}
.prodetail{}
.prodetail-wrapper{display: table; width: 100%;}
.prodetail-wrapper > div{display: table-cell; vertical-align: top;}
.prodetail-wrapper-image{width: 660px;}
.prodetail-image{width: 660px;}
.prodetail-image .owl-thumbs{margin: 0 -10px; margin-top: 20px;}
.prodetail-image .owl-thumb-item{float: left; border: none; margin: 0; padding: 0 10px; width: 25%;}
.prodetail-image .owl-thumb-item .wrapper{border: 1px solid #f9f9f9; cursor: pointer;
                                          -webkit-transition:All 0.2s ease;
                                          -moz-transition:All 0.2s ease;
                                          -o-transition:All 0.2s ease;
}
.prodetail-image .owl-thumb-item .wrapper:hover{border-color: #d3d3d3;}
.prodetail-image .owl-thumb-item.active .wrapper{border-color: #24356d;}

.prodetail-wrapper-info{padding-left: 30px;}
.prodetail-tab{margin-top: 40px;}
.prodetail-tab .nav-tabs{border-color: #24356d; margin-bottom: 30px;}
.prodetail-tab .nav > li > a{font-size: 30px; color: #24356d; width: 200px; text-align: center; padding: 4px 15px;}
.prodetail-tab .nav-tabs > li{margin-bottom: 0;}
.prodetail-tab .nav-tabs > li > a{border-color: #d3d3d3; border-bottom: none !important; color: #666; margin-right: 10px;}
.prodetail-tab .nav-tabs > li > a:hover{border-color: #d3d3d3; background-color: transparent; color: #24356d;}
.prodetail-tab .nav-tabs > li.active > a,
.prodetail-tab .nav-tabs > li.active > a:hover,
.prodetail-tab .nav-tabs > li.active > a:focus{border-color: #24356d; border-bottom: none !important; color: #24356d;}
.prodetail-tab .nav-tabs > li.active > a:after{content: ''; position: absolute; width: 100%; height: 2px; background-color: #fff; bottom: -1px; left: 0;}
.product-detail-vdo .wrapper{max-width: 720px; margin: 0 auto;}
.prodetail-relate{margin-top: 50px;}
.prodetail-relate-head{background-color: #f5f5f5; padding: 30px;}
.prodetail-relate-head h3{margin: 0; font-size: 38px; font-weight: 100; color: #24356d; line-height: 1em; padding-top: 7px;}
.prodetail-relate-btn{text-align: right;}
.prodetail-relate-list{padding: 30px 30px 20px 30px; background-color: #ececec;}
.prodetail-relate-list .owl-nav{display: none;}
.prodetail-relate-list .owl-dots,
.prodetail-relate-list .owl-controls{display: inline-block; width: 100%; text-align: center;}
.prodetail-relate-list .owl-controls{margin-top: 10px;}
.prodetail-relate-list .owl-dot{float: none; display: inline-block; margin: 0 5px;}
.prodetail-relate-list .owl-dot span{display: block; width: 20px; height: 20px; background-color: #fff; border:2px solid #71bb71;
                                     -webkit-border-radius: 10px;
                                     -moz-border-radius: 10px;
                                     border-radius: 10px;
                                     -moz-box-shadow:    0 0 2px rgba(0,0,0,0.2);
                                     -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.2);
                                     box-shadow:         0 0 2px rgba(0,0,0,0.2);
}
.prodetail-relate-list .owl-dot span:hover{background-color: #ececec;}
.prodetail-relate-list .owl-dot.active span{background-color: #71bb71;}
.prodetail-des .info-spec ul{padding-left: 0;}
.prodetail-des .info-spec li{display: table; width: 100%; font-size: 24px; font-weight: normal; color: #26356e; line-height: 1.2em; margin: 0;}
.prodetail-des .info-spec li > div{display: table-cell; vertical-align: top;}
.prodetail-des .info-spec-label{width: 110px;}
.prodetail-des .info-spec-dot{width: 10px; text-align: center;}
.prodetail-des .info-spec-text{padding-left: 20px;}
.prodetail-des .info-spec li.cate{font-weight: 300;}
.prodetail-des .info-spec li.cate .info-spec-label{font-size: 24px;}
.prodetail .detail-head{margin-bottom: 20px;}
.prodetail .detail-info-head{margin-bottom: 28px;}
.prodetail .detail-title h2{color: #24356d; font-size: 34px; font-weight: 300; padding-bottom: 10px; margin-bottom: 10px;}
.prodetail .detail-date{font-size: 24px; line-height: 20px;}
.prodetail .detail-date .icon-date{background-size: 14px; width: 14px; height: 14px; margin-bottom: -1px;}
.prodetail .detail-head .detail-info{top: -4px;}
.prodetail .detail-info-social{text-align: center;}
.prodetail .detail-info-social label{font-size: 24px; margin-top: 8px; margin-left: 0; text-align: center;}
.prodetail .detail-info{position: relative; right: auto;}
.prodetail .detail-info li{margin: 0 10px 0 0;}
.prodetail .detail-info-social .info-social{border-top: 1px solid #ececec; padding-top: 10px; margin-top: 6px;}
.prodetail .detail-info-social .info-social a{width: 20px; height: 20px; margin-right: 10px;}
.prodetail .detail-info-request a{width: 100%; height: 64px; padding: 0 15px; text-align: center; color: #24356d; font-weight: normal; font-size: 22px; border: 2px solid #24356d; display: block; line-height: 60px;
                                  -webkit-border-radius: 7px;
                                  -moz-border-radius: 7px;
                                  border-radius: 7px;
}
.prodetail .detail-info-request a:hover{border-color: #71bb71; background-color: #f9f9f9;}
.prodetail .detail-info-request i{display: inline-block; width: 30px; height: 30px; margin-bottom: -9px; margin-right: 4px;}
.thumb-image{background-repeat: no-repeat !important; background-size: contain !important; position: absolute; width: 100%; height: 100%; display: block;
             -webkit-transition:All 0.0s ease;
             -moz-transition:All 0.0s ease;
             -o-transition:All 0.0s ease;
}

/************* Hall of frame **************/
/****************************/
/****************************/
/****************************/
.bg-hallofframe{
    background: #ce9686; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(-9deg, #975e53 , #eab9ab); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(-9deg, #975e53, #eab9ab); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(-9deg, #975e53, #eab9ab); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to -9deg, #975e53 , #eab9ab); /* Standard syntax */
    border-radius: 3px;
    margin-top: -150px;
    padding-top: 150px;
}
.hallofframe{
    min-height: 668px;
    overflow: hidden;
    position: relative;
}
.hallofframe .header-content{
    padding-bottom: 38px;
}
.hallofframe-hr{
    position: absolute;
    width: 100%;
    z-index: 1;
    background-image: url(../img/line/white.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-top: 100px;
}
.hallofframe-content{
    position: absolute;
    width: 100%;
}

.hallofframe .owl-carousel .owl-controls {
    display: none !important;
}
.hallofframe .owl-carousel .owl-item {
    padding: 0px 0px 40px;
}
.hallofframe-box{
    height: 550px;
    position: relative;
    overflow: hidden;
    background-image: url(../img/hallofframe/shadow.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    max-width: 260px;
    margin: 0 auto;
}
.hallofframe-pic-bg{
    position: relative;
    overflow: hidden;
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    margin: 0 5px;
}
.hallofframe-box-1 .hallofframe-pic-bg{
    background-image: url(../img/hallofframe/bg-1.png);
}
.hallofframe-box-2 .hallofframe-pic-bg{
    background-image: url(../img/hallofframe/bg-2.png);
}
.hallofframe-box-3 .hallofframe-pic-bg{
    background-image: url(../img/hallofframe/bg-3.png);
}
.hallofframe-box-4 .hallofframe-pic-bg{
    background-image: url(../img/hallofframe/bg-4.png);
}

.hallofframe-pic{
    height: 330px;
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: contain;
}
.hallofframe-desc{
    padding: 20px;
    background-color: #ffffff;
    font-family: 'db_helvethaica_x55';
    text-align: center;
    -moz-box-shadow:    0 2px 5px rgba(0,0,0,0.15);
    -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    box-shadow:         0 2px 5px rgba(0,0,0,0.15);
    margin: 0 5px;
}
.hallofframe-desc .hallofframe-desc-name{
    color: #775950;
    font-size: 24px;
    height: 36px;
    overflow: hidden;
}
.hallofframe-desc .hallofframe-desc-reward{
    color: #666666;
    font-size: 24px;
    height: 30px;
    overflow: hidden;
}

.hallofframe-bg-bottom{
    background-color: #fcfcfc;
    height: 236px;
    width: 100%;
    position: absolute;
    bottom: 0;
}

.brand{
    overflow: hidden;
    position: relative;
}
.brand .owl-carousel .owl-controls {
    display: none !important;
}
.brand .owl-carousel .owl-item {
    padding: 0 40px;
}
.brand-box{
    width: 100%;
    max-width: 142px;
    margin: 0 auto;
    height: 171px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-filter: grayscale(100%);
    filter: #cccccc;
}
.brand-box:hover{-webkit-filter: grayscale(0%);}


.bg-contact{
    background-color: #fbfafa;
    background-image: url(../img/bg/contact.png);
    background-position: center bottom;
    background-repeat: no-repeat;
}
.contact{
    overflow: hidden;
    position: relative;
}
.contact-hr{
    position: absolute;
    width: 100%;
    z-index: 1;
    background-image: url(../img/line/brown.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-top: 150px;
}
.contact-content {
    width: 100%;
    z-index: 5;
    padding-top: 60px;
    padding-bottom: 50px;
}
.contact .header-content{
    padding-bottom: 5px;
}
.contact-box{
    margin-top: 50px;
    font-family: 'db_helvethaica_x55';
}
.contact-box .contact-box-engname{
    color: #775950;
    font-size: 36px;
    line-height: 30px;
    text-transform: uppercase;
}
.contact-box .contact-box-name{
    color: #2f2f2f;
    font-size: 26px;
    line-height: 20px;
    margin-bottom: 27px;
}
.contact-box .contact-box-address{
    color: #2f2f2f;
    font-size: 24px;
    line-height: 20px;
    margin-bottom: 14px;
    font-family: 'db_helvethaica_x35';
}
.contact-box .contact-box-hotline{
    font-size: 25px;
    line-height: 24px;
    margin-bottom: 30px;
    text-transform: uppercase;
}
.contact-box .contact-box-hotline span{color: #ff6464;font-size: 24px;}
.contact-box .contact-box-social{
    color: #775950;
    font-size: 24px;
}
.contact-box .contact-box-social ul{
    padding: 0;
    margin: 0;
    list-style: none;
    overflow: hidden;
}
.contact-box .contact-box-social ul li{
    float: left;
    width: 30px;
    height: 35px;
    color: #ffffff;
    background: none;
    /*border-radius: 50%;*/
    overflow: hidden;
    text-align: center;
    /*padding-top: 8px;*/
    margin-right: 10px;

}
.contact-box .contact-box-social ul li:last-child{margin: 0;}
.contact-box .contact-box-social ul li.fb{
    background-color: #3d579f;
}
.contact-box .contact-box-social ul li.tw{
    background-color: #2d8cd5;
}
.contact-box .contact-box-social ul li.gg{
    background-color: #b32c18;
}
.contact-box .contact-box-social ul li.in{
    background-color: #7e4e39;
}
.contact-box .contact-box-social ul li a, .contact-box .contact-box-social ul li a:hover,.contact-box .contact-box-social ul li a:active, .contact-box .contact-box-social ul li a:visited{
    color: #ffffff;
}
.contact-map{
    position: relative;
}
.contact-bg{
    position: absolute;
    height: 180px;
    width: 280px;
    opacity: 0.5;
    z-index: 1;
    background-color: #e9b5a0;
    left: 0;
    top: 50px;
    /*    -webkit-transform: skew(-20deg);
        -moz-transform: skew(-20deg);
        -o-transform: skew(-20deg);
        -ms-transform: skew(-20deg);
        transform: skew(-20deg);*/
    margin-left: 32px;
}
.contact-map-box{
        position: absolute;
    height: 290px;
    width: 500px;
    z-index: 2;
    background-color: #e9b5a0;
    left: 30px;
    top: 25px;
    margin-left: 32px;
    overflow: hidden;
    border-radius: 15px;
    border: 3px #e9b5a0 solid;
}
.contact-map-box-inner{
    /*    -webkit-transform: skew(20deg);
        -moz-transform: skew(20deg);
        -o-transform: skew(20deg);
        -ms-transform: skew(20deg);
        transform: skew(20deg);*/
    margin-left: -55px;
    height: 100%;
    width: 130%;
}

#footer .primary-footer {
    padding: 10px 0;
    background: #555555;
    background: -webkit-linear-gradient(34deg, #555555 , #7c7c7c); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(34deg, #555555, #7c7c7c); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(34deg, #555555, #7c7c7c); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to 34deg, #555555 , #7c7c7c); /* Standard syntax */
}
.footer-menu{
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}
.footer-menu li{
    float: left;
    margin-right: 30px;
    font-family: 'db_helvethaica_x55';
    font-size: 24px;
}
.footer-menu li a{color: #e9b5a0;transition: all .3s;}
.footer-menu li a:hover{color: #ffffff;transition: all .3s;}
.footer-menu li.active a{color: #ffffff;transition: all .3s;}
.footer-menu li.active a:hover{color: #e9b5a0;transition: all .3s;}


#footer .secondary-footer {
    background-color: #f8f8f8;
    padding: 20px 0 100px;
}
.footer-logo{
    float: left;
    overflow: hidden;
    margin-right: 20px;
    height: 100%;
}
.footer-logo img{
    width: 80%;
}
.footer-right{
    font-family: 'db_helvethaica_x55';
    float: left;
}
.footer-right-name{
    color: #2f2f2f;
    font-size: 24px;
    line-height: 20px;
    text-transform: uppercase;
}
.footer-right-address, .footer-right-sitemap{
    font-size: 24px;
    line-height: 18px;
}
.footer-right-dbd {
    position: relative;
    overflow: hidden;
    float: right;
}
.footer-right-dbd img{
    height: 50px;
}

.mfp-wrap {
    z-index: 100000;
}
#popup{
    font-family: 'db_helvethaica_x35';
    background-color: #fff;
    max-width: 1024px;
    margin: 30px auto;
    height: 80%;
    position: relative;
    overflow: hidden;
    padding: 20px;
    color: #666666;
}
#popup_close{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 25px;
    height: 25px;
    background-color: #ffffff;
    background-image: url(../img/icon/close.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}
#popup .logo{
    text-align: center;
    margin-bottom: 10px;
}
#popup .logo img{
    height: 35px;
}
#popup h1{
    text-align: center;
    font-size: 24px;
    line-height: 20px;
    margin-bottom: 0;
    color: #666666;
}
#popup h2{
    text-align: center;
    font-size: 30px;
    line-height: 30px;
    margin-bottom: 20px;
    color: #666666;
}
#popup h3{
    font-family: 'db_helvethaica_x55';
    font-size: 16px;
    line-height: 18px;
    margin-bottom: 10px;
    color: #666666;
}
#popup p{
    font-family: 'db_helvethaica_x35';
    font-size: 16px;
    line-height: 18px;
    margin-bottom: 10px;
    color: #666666;
}

.fix-cart{
    font-family: 'db_helvethaica_x35';
    position: fixed;
    top: 25%;
    right: 0;
    z-index: 999999;
    background: none;
}
.fix-cart .fix-cart-btn{
    background-color: #b32c18;
    color: #ffffff;
    position: absolute;
    right: 0;
    top: 0;
    padding: 5px 6px;
    overflow: hidden;
    z-index: 2;
    cursor: pointer;
}
.fix-cart .fix-cart-contain{
    background-color: #ffffff;
    min-height: 100px;
    width: 300px;
    position: relative;
    overflow: hidden;
    padding: 10px;
    -moz-box-shadow:    0 0 20px rgba(0,0,0,0.15);
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.15);
    box-shadow:         0 0 20px rgba(0,0,0,0.15);
    display: none;
}
.fix-cart-contain .fix-cart-head{
    color: #775950;
    font-size: 24px;
    line-height: 24px;
}
.fix-cart-contain .fix-cart-list{
    width: 100%;
    height: 210px;
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    list-style: none;
    margin: 0;
    padding: 0;
    border-bottom: 1px #7c7c7c solid;
}
.fix-cart-contain .fix-cart-list li{
    position: relative;
    overflow: hidden;
    float: left;
    width: 100%;
    padding: 10px 0;
}
.fix-cart-contain .fix-cart-list li > .fix-cart-pic-box{
    float: left;
    width: 20%;
    height: 50px;
    position: relative;
    overflow: hidden;
}
.fix-cart-contain .fix-cart-list li > .fix-cart-pic-box .fix-cart-pic{
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 2;
}
.fix-cart-contain .fix-cart-list li > .fix-cart-pic-box .fix-cart-pic-bg{
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter        : blur(7px);
    -moz-filter   : blur(7px);
    -webkit-filter: blur(7px);
    -o-filter     : blur(7px);
    position: absolute;
    z-index: 1;
}

.fix-cart-contain .fix-cart-pic-data{
    float: left;
    position: relative;
    overflow: hidden;
    width: 80%;
    padding-left: 20px;
}
.fix-cart-contain .fix-cart-pic-data .fix-cart-name{
    width: 100%;
    height: 21px;
    position: relative;
    overflow: hidden;
}
.fix-cart-contain .fix-cart-pic-data .fix-cart-unit,.fix-cart-contain .fix-cart-pic-data .fix-cart-price{
    float: left;
    margin-right: 20px;
    color: #775950;
}
.fix-cart-total{
    text-align: left;
    color: #70544c;
    font-size: 24px;
    text-align: right;
    font-weight: bold;
}

.order-row{
    position: relative;
    overflow: hidden;
    margin-bottom: 5px;
    padding: 15px;
    border-bottom: 1px #eab9ab dotted;
}
.order-row:hover{
    background-color: #fff6f2;
}
.order-code{
    float: left;
    color: #775950;
    font-size: 30px;
    line-height: 20px;
    border-right: 1px #cccccc solid;
    padding-right: 20px;
}
.order-status{
    float: left;
    font-size: 24px;
    color: #999999;
}
.order-status span{
    font-weight: bold;
}

.order-control{
    float: right;
}
.order-btn{
    float: right;
    background-color: #cccccc;
    color: #ffffff;
    margin-left: 20px;
    font-size: 14px;
    padding: 0 10px;
    border-radius: 3px;
    cursor: pointer;
}
.order-btn.payment{
    background-color: #2d8cd5;
}
.order-btn.status{
    background-color: #71bb71;
}
.order-total{
    float: right;
}

.maintenance-banner {
    background: #fff;
}
.maintenance-banner img{
    max-width: 500px;
}

.sound-contain{
    position: fixed;
    bottom: 120px;
    z-index: 999;
    height: 50px;
    width: 50px;
}
.sound-contain .sound-control{
    padding: 11px;
    font-size: 22px;
    -moz-box-shadow:    0 0 20px rgba(0,0,0,0.15);
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.15);
    box-shadow:         0 0 20px rgba(0,0,0,0.15);
    background: #000;
    background: -webkit-linear-gradient(34deg, #555555 , #7c7c7c); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(34deg, #555555, #7c7c7c); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(34deg, #555555, #7c7c7c); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to 34deg, #555555 , #7c7c7c); /* Standard syntax */
    border-top-right-radius: 50%;
    width: 100%;
    height: 100%;
    border-bottom-right-radius: 50%;
}
.sound-contain .sound-control>a{
    color: #fff;
}
.sound-contain .sound-control>a:hover{
    color: #cdcdcd;
}
.sound-contain .sound-control .track{
    display: none;
}
.sound-name{
    width: 300px;
    position: absolute;
    font-size: 16px;
    /*margin-left: 54px;*/
    color: #fff;
    background-color: rgba(0, 0, 0, 0.54);
    margin-top: 10px;
    font-size: 14px;
    padding: 5px 0 5px 50px;
    z-index: -10;
    border-top-right-radius: 3px;
    border-bottom-right-radius:3px;
}
.sound-name .sound-name-slide{
    float: right;
    padding: 0 15px;
    cursor: pointer;
}

#mn-download{
    display: none;
}

.tab-king{
    position: relative;
    overflow: hidden;
    text-align: center;
    background: #fff;
    background-image: url("../img/black-laithai.png");
/*    background: -webkit-linear-gradient(bottom, #c1ac50 , #f5eeac);  For Safari 5.1 to 6.0 
    background: -o-linear-gradient(bottom, #c1ac50, #f5eeac);  For Opera 11.1 to 12.0 
    background: -moz-linear-gradient(bottom, #c1ac50, #f5eeac);  For Firefox 3.6 to 15 
    background: linear-gradient(to bottom, #c1ac50 , #f5eeac);  Standard syntax */
}
.tab-king img{
    width: auto;
}

@media (max-width: 768px) {
    .wrapper {
        margin-top: 100px;
    }
    .tab-king{
        position: absolute;
        z-index: 99999999;
        margin-top: -100px;
    }
}

.news-cate{
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 0;
    list-style: none;
    font-family: 'db_helvethaica_x55';
}
.news-cate li{
    float: left;
}
.news-cate li a{
    display: block;
    padding: 10px 20px;
}
.news-cate li.active a{
    background-color: #9a6458;
    color: #fff;
}

.gallery {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-width: 33%;
    -moz-column-width: 33%;
    column-width: 33%; }
.gallery .pics {
    -webkit-transition: all 350ms ease;
    transition: all 350ms ease; }
.gallery .animation {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1); }
.mb-3{
    margin-bottom: 1.8rem !important;
}

@media (min-width: 768px){
    .modal-dialog {
        width: 1200px;
        margin: 165px auto;
    }
}


@media (max-width: 450px) {
    .gallery {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
        -webkit-column-width: 100%;
        -moz-column-width: 100%;
        column-width: 100%;
    }
}

@media (max-width: 400px) {
    .btn.filter {
        padding-left: 1.1rem;
        padding-right: 1.1rem;
    }
}
#gallerymodal .modal-dialog{
    margin: 30px auto;
}
#gallerymodal .modal-content {
    -webkit-box-shadow: none;
    box-shadow: none;
    background: none;
    border: none;
}
#gallerymodal .modal-content .modal-body{
    padding: 0;
}