/* General style */
@font-face {
    font-family: "Font Awesome";
    src: url("../fonts/fontawesome-webfont.ttf");
}

* {
    padding: 0;
    margin: 0;
}

body {
    font-family: Roboto, sans-serif !important;
    font-size: 14px;
    background-color: #f6f7f7 !important;
}

body a {
    color: #222222;
    transition: all 150ms ease-in-out;
}

body a.active {
    color: #f86b47;
}

body a:hover {
    color: #f86b47;
    text-decoration: none;
}

body .single-product {
    float: left;
    background-color: #fff;
    position: relative;
    width: 25%;    border: 1px solid #fff;
     border-right: 1px solid #f6f7f7;
}
body .single-product:hover{
    border:1px solid #f86b47;
}
body .single-product .pro-img {
    width: 98%;
    margin: 0 auto;
    overflow: hidden;
}

body .single-product .pro-img a {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

body .single-product .pro-img img {
    width: 100%;
    transform: translateZ(0);
    max-height: 100%;
    transition-duration: 500ms;
    transition-property: transform;
}

body .single-product .pro-img img:hover {
    transform: scale(1.11);
}

body .single-product .pro-info {
    text-align: center;
    height: 90px;
    padding-top: 10px;
}

body .single-product .pro-info .pro-name {
    text-overflow: ellipsis;
    color: #222222;
    margin: 0 0;
    white-space: nowrap;
    overflow: hidden;
    font-size: 14px;
    padding: 0 15px;
}

body .single-product .pro-info .pro-price {
    margin-top: 17px;
    margin-bottom: 0px;
    font-family: "Noto Serif", sans-serif;
}

body .single-product .pro-info .pro-price .ins-price {
    font-size: 15px;
    color: #000;
    font-weight: bold;
} 

body .single-product .pro-info .pro-price .line {
    border-left: 1px solid #b8b8b8;
    border-right: 1px solid #ebebeb;
    margin: 0 10px;
}

body .single-product .pro-info .pro-price .del-price {
    font-size: 12px;
    color: #b2b2b2;
    text-decoration: line-through;
}

body .single-product .pro-action {
    height: 66px;
    padding: 9px 7.5%;
}

body .single-product .pro-action .add-cart {
    display: inline-block;
    width: 79%;
    float: left;
}

body .single-product .pro-action .add-cart .add-btn {
    padding: 8px 13px;
    float: right;
    margin-right: 2px;
    width: 100%;
    height: 38px;
    background-color: #f5f6f6;
    border: 1px solid #e1e1e1;
    color: #707070;
    text-align: center;
}

body .single-product .pro-action .view {
    width: 21%;
    float: right;
}

body .single-product .pro-action .view .search-btn {
    background-color: #f5f6f6;
    border: 1px solid #e1e1e1;
    color: #707070;
    text-align: center;
    float: left;
    margin-left: 2px;
    width: 100%;
    height: 38px;
    line-height: 35px;
}
/* End general style */

/* Header */
/* Top bar*/
.top-bar {
    background: url("../img/topbar.png") center center;
    height: 95px;
}
/*End topbar */

/* Main header */
.main-header {
    background: url("../img/background-header.png") center center;
    margin-bottom: 4px;
}

.header-top .logo img {
    margin: 15px 0;
}
.main-nav{
    clear: both;
}
.cus-info{
    color: #fff;
}
.header-top nav.header-action {
    margin-top: 22px;
    margin-bottom: 6px; 
}

nav.header-action .header-action-item {
    margin-right: 21px;
}

nav.header-action .header-action-item i {
    margin-right: 4px;
}

.header-top .searchbox {
    position: relative;    margin-top: 35px;
}

.searchbox input {
    height: 40px;
    width: 100%;
    padding-left: 21px;
}

.searchbox button {
    position: absolute;
    width: 45px;
    height: 40px;
    box-shadow: none;
    border: none;
    right: 0;
    color: #fff;
    top: 0;
}

.shop-info {
    height: 40px;
    border-right: 1px solid #e1e1e1;
    width: 285px;
    text-align: right;
    margin-top: 45px;
    padding-right: 12px;
    position: relative;
}

.shop-info p {
    margin: 0;
}

.shop-info p.hotline {
    font-size: 20px;
    font-weight: bold;
    font-family: "Noto Serif", sans-serif;
    margin: 0;
}

.cart {
    display: inline-block;
}

.cart .icon-cart {
    color: #a0cb00;
    font-size: 30px !important;
    right: 26px;
    top: 50px;
    position: absolute;
}

.cart span.qty {
    width: 18px;
    height: 18px;
    background-color: #f86b47;
    border-radius: 50%;
    position: absolute;
    right: 18px;
    font-size: 10px;
    color: #fff;
    line-height: 18px;
    text-align: center;
    bottom: 45px;
}
/* End top header */

/* Main nav */
.categories{
    position: relative;
}
.categories .dmsp{
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    z-index: 999;display: none;
}
.categories .dmsp.open{
    display: block;
}
.categories .dmsp li{
        list-style: none;
    padding: 8px 15px;
    font-size: 15px;
}
.main-header .main-nav .categories .catmenu-opener {
    height: 58px;
    padding: 13px 24px 19px 20px;
    text-transform: uppercase;
    font-size: 21px;
    color: #fff;
}

.categories .catmenu-opener>i.fa-bars {
    margin-right: 5px;
}

.categories .catmenu-opener>i.fa-angle-down , .searchbox button{
    float: right;
    line-height: 28px;
}

.main-nav .menus ul {
    padding-top: 7px;
    margin-bottom: 0 !important;
    list-style: none;
}

.main-nav .menus ul li {
    display: inline-block;
    position: relative;
    float: left;
}

.menus ul li a {
    padding: 13px 15px;
    font-size: 16px;
    display: inline-block;
}
.menus ul li.current-menu-item a{
	    color: #f86b47;
}
.menus ul li.current-menu-item::after {
    border-color: transparent transparent #a0cb00;
    border-style: solid;
    border-width: 6px;
    content: "";
    height: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    bottom: -9px;
    transform: translateY(-50%);
    width: 0;
    left: 0;
    margin-left: auto;
    margin-right: auto;
}

nav.social {
    text-align: right;
    font-size: 18px;
    margin-top: 19px;
}

nav.social a {
    margin-left: 21px;
}
/* End main nav*/
/*End header*/

/* Section 1*/
#section1 .slide-banner {
    width: 70%;
    float: left;
    position: relative;
}

.slide-banner .slide img {
    width: 100%;
    height: auto;
    display: block;
}

.slide .owl-pagination,
.slide .owl-buttons {
    display: none;
}

.home-banner {
    width: 29.6%;
    float: right;
    overflow: hidden;
}

.home-banner img {
    max-width: 100%;
    height: auto;
}
/* End Section 1 */

/* Section 2*/
#section2 {
    margin-bottom: 0;
}

.group-tabs {
    margin-top: 45px;
}

.group-tabs .tab-content {
    float: left;
    width: 100%;
    border: 1px solid #e1e1e1;
    background: #fff;
}

.group-tabs .single-product {
    width: 100% !important;
}

.nav-tabs {
    border: none !important;
    margin-bottom: 18px !important;
}

.nav-tabs li {
    text-transform: uppercase;
    font-family: 'Noto Serif';
    font-size: 21px;
    background: transparent !important;
    width: unset;
    padding: 0px 16px;
    height: unset;
    line-height: 26px;
    border-left: 2px solid #f86b47;
}

.nav-tabs li:first-child {
    border-left: none;
    padding-left: 0;
}

.nav-tabs li>a {
    color: #a1a1a1;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.nav-tabs li>a:hover {
    border: none !important;
    background: none !important;
}

.nav-tabs li.active>a {
    background: transparent !important;
    border: none !important;
    color: #f86b47 !important;
    
}

.group-tabs .owl-pagination {
    display: none !important;
}
/* End section 2*/

/* Section 3 */
#section3 {
    margin-bottom: 15px;
}

.widget_home-produc-one {
    margin: 15px 0;     float: left;
    width: 100%;
}
.slimScrollBar{
    width: 2px !important;
}
.xemtatcar{
        padding: 0 0 10px 18px;
    font-weight: 600;
    font-size: 13px;
}
.xemtatcar a{
    color: #e95b00;
}
.pro-left {
    width: 20%;
    float: left;
}

.categories .cat-header {
    height: 50px;
    font-family: 'Noto Serif';
    font-size: 16px;
    color: #fff;
    padding-left: 19px;
    line-height: 50px;
    text-transform: uppercase;
    position: relative;
}

.cat-header .list-btn {
    border: none;
    box-shadow: none;
    background-color: transparent;
    position: absolute;
    right: 15px;
    color: #fff;
    top: 0;
    outline: none;
    padding: 0 5px;
}

.cat-header .list-btn::after {
    font-family: 'Font Awesome';
    content: "\f067";
    float: right;
    margin-left: 0;
    font-size: 20px;
}

.categories .block-2 {
    background: #fea400;
}

.categories .block-3 {
    background: #f86b47;
}

.categories .cat-header h2 {
    font-family: 'Noto Serif';
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
    line-height: 50px;
    margin-top: 0;
    margin-bottom: 0;
}

.list-info {
    height: 169px;
    background: #fff;
    border: 1px solid #e1e1e1;
    border-top: unset;
    overflow: hidden;
}

.list-info ul {
    list-style-type: none;
    padding-left: 18px;
    margin-top: 14px;
}

.list-info ul li {
    line-height: 27px;
}

.list-info ul li i {
    margin-right: 3px;
    vertical-align: 1px;
}

.pro-right {
    width: 80%;
    float: right;
}

.pro-right .pro-header-img {
    height: 219px;
    border-bottom: 1px solid #e1e1e1;
}

.pro-right .pro-header-img img {
    width: 100%;
    height: auto;
}

.pro-container .top-sale {
    border-left: 1px solid #e1e1e1;
}

.top-sale .ts-header {
    height: 58px;
    color: #e95b00;
    text-transform: uppercase;
    font-size: 16px;
    font-family: 'Noto Serif';
    border-bottom: 1px solid #e1e1e1;
    background-color: #fff;
    padding-left: 19px;
    line-height: 50px;
}

.top-sale .ts-info {
    background: #fff;
}

.ts-item {
    border-bottom: 1px solid #e1e1e1;
    padding: 5px 0;
}

.ts-item .ts-img {
    float: left;
max-width: 71px;
    height: auto;}

.ts-item .ts-img img {
    max-width: 100%;
    max-height: 100%;
}

.ts-item .ts-detail {
    padding-left: 104px;
}

.ts-detail .pro-name {
    margin-top: 12px;
    margin-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ts-detail .pro-price {
    font-weight: bold;
    font-family: 'Noto Serif';
    margin-top: 5px;
    margin-bottom: 0;
}

.list-pro {
    width: 100%;
    float: left;
    border-left: 1px solid #e1e1e1;
}
.owl-controls{
    margin-top: 0 !important;
}
/* End section 3 */

/* Section 4 */
#section4 {
    width: 100%;
}

.brand {
    margin-top: 18px;
    padding-top: 13px;
    margin-bottom: 40px;
}

.brand img {
    max-width: 100%;
    height: auto;
}
/* End section 4 */

/* Section 5*/
#section5 {
    background-color: #222222;
    padding-top: 47px;
    padding-bottom: 35px;
}

.cus-left .cus-img {
    float: left;
}

.cus-right {
    margin-right: 78px;
    margin-left: 65px;
}

.cus-right .cus-info {
    margin-left: 10px;
    margin-right: 78px;
    width: 85%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 50px;
    word-wrap: break-word;
}

.cus-right .cus-info p.cus-name {
    color: #fff;
    font-size: 15px;
    margin-top: 2px;
    font-weight: bold;
    line-height: 18px;
    margin-bottom: 5px;
}

.cus-right .cus-info p.comment {
    color: #707070;
    height: 90px;
    line-height: 24px;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    max-height: 3.67em;
    overflow: hidden;
    text-overflow: ellipsis;
}

.owl-pagination {
    text-align: left !important;
    position: absolute !important;
    top: 80% !important;
    left: 20px !important;
}

.owl-pagination .owl-page span {
    width: 7px !important;
    height: 7px !important;
    margin: 8px 3px !important;
    background: #fff !important;
}

.owl-pagination .owl-page.active span {
    background: #a0cb00 !important;
}

.reg-email p.title {
    font-size: 15px;
    color: #fff;
    margin-top: 2px;
}

.reg-email .input-mail {
    position: relative;
}

.reg-email input {
    width: 100%;
    height: 50px;
    padding-left: 23px;
    padding-right: 136px;
}

.reg-email button {
    position: absolute;
    width: 110px;
    height: 46px;
    box-shadow: none;
    border: none;
    right: 2px;
    top: 2px;
    color: #fff;
}
/* End section 5*/

/* Footer */
footer {
    background: #f8f8f8;
    position: relative;
    overflow: hidden;
}

/* Footer top */
.footer-top {
    margin-top: 45px;
    padding-bottom: 29px;
    border-bottom: 1px solid #e5e5e5;
}

.footer-top h4 {
    color: #252525;
    text-transform: uppercase;
    margin-bottom: 26px;
    font-size: 16px;
    margin-top: 0;
}

.footer-top ul {
    padding-left: 0;
    list-style-type: none;
}

ul.about>li {
    line-height: 23px;
    margin-bottom: 17px;
    position: relative;
    padding-left: 25px;
}

ul.about>li:first-child {
    padding-left: 0;
}

ul.about li i {
    width: 15px;
    margin-right: 6px;
    position: absolute;
    left: 0;
    top: 5px;
}

ul.blogpost li:first-child {
    border-bottom: 1px solid #e1e1e1;
}

ul.blogpost li:last-child {
    margin-top: 20px;
}

ul.blogpost .blog {
    height: 80px;
}

ul.blogpost .blog .blog-img {
    width: 80px;
    float: left;
    height: 80px;
    overflow: hidden;
}

ul.blogpost .blog .blog-img img {
    width: 100%;
}

.blog-info {
    width: calc(100% - 80px);
    float: right;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 50px;
    word-wrap: break-word;
}

.blog-info h3.blog-name {
    color: #252525;
    position: relative;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 0;
    font-weight: normal;
    line-height: 20px;
}

.blog-info .date {
    color: #999999;
}

ul.support li {
    line-height: 23px;
    margin-bottom: 12px;
}

ul.support li i {
    margin-right: 3px;
}
/* end footer top */

/* Footer bottom */
.footer-bottom {
    padding: 40px 0;
}

.footer-bottom .copyright {
    float: left;
    color: #565656;
}

.footer-bottom p {
    color: #252525;
}

.footer-bottom p.mobile-visible {
    display: none;
}

.footer-bottom .to-top {
    text-align: right;
}
/* End footer bottom */
/* End footer */

/* Responsive */
@media (max-width :991px) {

    .header-top .logo-mobile {
        text-align: center;
    }
    
    .logo-mobile img {
        margin-top: 10px;
        width: auto;
        margin: auto;
        padding: 10px;
    }
    
    .header-top .menu-mobile {
        height: 40px;
        width: 40px;
        background-color: #a0cb00;
        padding: 9px 0;
        font-size: 17px;
        color: #fff;
        text-align: center;
        margin-top: 23px;
    }
    
    .header-top .menu-mobile>a {
        color: #fff;
    }
    
    .header-top .icon-cart-mb {
        color: #a0cb00;
        font-size: 30px !important;
        position: absolute;
        right: 15px;
        top: 26px;
    }
    
    .header-top .qty {
        width: 18px;
        height: 18px;
        background-color: #e95b00;
        border-radius: 50%;
        position: absolute;
        right: 5px;
        font-size: 10px;
        color: #fff;
        line-height: 18px;
        text-align: center;
        top: 18px;
    }
    
    .slide-banner {
        width: 100% !important;
    } 
    
    .pro-action .add-cart {
        width: 100% !important;
    }
    
    .pro-header .pro-left {
        width: 100% !important;
    }
    
    .pro-container .pro-right {
        width: 100% !important;
    }
    
    .add-cart .add-btn {
        font-size: 12px;
    }
    
}
.pro-left .ts-detail span.del-price {
    font-size: 12px;
    color: #b2b2b2;
    text-decoration: line-through;
}
@media (max-width :992px) {
    .cus-right{
        margin-right: 10px;
    }
    .cus-right .cus-info{
        width: 100%;
    }
       .item_news{
        margin-bottom: 20px;
    }
    .hamburger {
    box-sizing: border-box;
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 20px;
    left: 20px;    background: #a0cb00;
    z-index: 2;
}
.hamburger:before, .hamburger:after, .hamburger span {
background: #fff;
    content: '';
    display: block;
    width: 24px;
    height: 3px;
    position: absolute;
    left: 8px;
}
.hamburger span {
top:18px;
}
.hamburger:before {
    top: 10px;
}
.hamburger:after {
    top: 27px;
}
.sidebar-menu {
    
    position: fixed;
    z-index: 9998;
    top: 0;
    left: 0;
    bottom:0;
    width: 100%;
    height: 100%;
    max-width: 320px;
    padding-right: 40px;
    transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    transition: all linear .2s;
    -webkit-transition: all linear .2s;
}
.opacity_menu.open_opacity{
        content: " ";
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    position: fixed;
    top: 0px !important;
    left: 0px;
    z-index: 999;
}
.header-main{
}
body .single-product{
    width: 50% !important;
}
.sidebar-menu.intro{
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
}
.sidebar-menu .sidebar-container {
    width: 100%;
    height: 100%;
    padding-bottom: 50px;
    overflow-x: hidden;
    overflow-y: scroll;
    background-color: #fff;
    box-shadow: 1px 0 3px rgba(0,0,0,0.25);
    -webkit-overflow-scrolling: touch;
}
.side {
    position: relative;
    overflow: hidden;
    background: #fff;
}
.hamburger-close:before, .hamburger-close:after {
    background: #000;
    content: '';
    display: block;
    width: 28px;
    height: 3px;
    position: absolute;
    left: 5px;
}
.hamburger-close:before{
        transform: rotate(45deg);
        top: 26px;
}
.hamburger-close:after{
    transform: rotate(-45deg);top: 26px;
}
.hamburger-close {
    box-sizing: border-box;
    display: block;
    width: 28px;
    height: 21px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    padding: 30px 20px;
    background: #e35125;
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;

}
.form-mobile{
    width: 85%;
    margin: auto;
    padding: 10px 0;
}
.form-mobile form{
    position: relative;
    width: 100%;
}
.form-mobile input{
        background: #e35125;
    color: #fff;
    border: none;
    height: 40px;
    border-radius: 50px;
    padding: 0 10px;
    width: 100%;
}
.form-mobile button{
    color: #fff;
    position: absolute;
    top:0;
    height:40px;
    border:none;
    right:0;
    padding: 0 10px;
    background: none !important
}
.cart-item{
    position: absolute;
    right: 20px;
    top:13px;
}
.sidebar-menu  ul > li{
list-style: none;
padding: 10px 10px;
border-bottom: 1px solid #eee
}
.sidebar-menu ul li a{
        color: #737272;
    text-decoration: none;
}
.sidebar-menu ul li:hover{
    background: #e35125;
}
.sidebar-menu ul li:hover a{
        color: #fff !important;
}
.sidebar-menu  ul  li.menu-item-has-children{
    position: relative;
}
.sidebar-menu  ul  li   ul.sub-menu {
    border:0;display: none;
}
.sidebar-menu  ul  li   ul.sub-menu li{
    padding: 10px 0 10px 0px;
}
.sidebar-menu  ul  li.menu-item-has-children > a.loan{
position: absolute;
    right: 10px;
    font-size: 21px;
    top: 10px;
    width: 20px;
    text-align: center;
    z-index: 99999;
}
.sidebar-menu  ul  li.menu-item-has-children > a.loan{
    right: 0;
}
.sidebar-menu  ul ul li{
    border-bottom: 0 !important;
}.logo{
    width: 70%;
    margin: auto;
    padding: 10px 0;    text-align: center;
}
.logo img{
        width: 50%;
}
.cart-item i{
        color: #a0cb00;
    font-size: 30px !important;
    position: absolute;
    right: 15px;
    top: 6px;
}
.cart-item .qty{
        width: 18px;
    height: 18px;
    background-color: #e95b00;
    border-radius: 50%;
    position: absolute;
    right: 5px;
    font-size: 10px;
    color: #fff;
    line-height: 18px;
    text-align: center;
    top: 0px;
}
.header-center{
        background: #a0cb00;
    color: #fff;
    padding: 5px 0;
}
.header-center a{
    color: #fff;
}
.header-center p{
    margin-bottom: 0;
}
    .header-top .logo-mobile {
        height: 78px;
    }
    
    .logo-mobile img {
        width: 100%;
        margin-top: 10px;
    }
    
    .list-pro>.single-product {
        width: 50%;
    }
    
    .footer-top {
        border-bottom: none;
        margin-top: 0;
    }
    
    .footer-bottom {
        padding: 0;
    }
    
    .footer-bottom .copyright {
        text-align: center;
    }
    
    .footer-bottom p.mobile-visible {
        display: block;
    }
    
    .footer-bottom .to-top {
        text-align: center;
    }
    
    .f-col {
        border-bottom: 1px solid #e5e5e5;
        margin-top: 15px;
    }
    #order_review{
        display: block !important;
    }
    #order_review #payment,#order_review table{
        width: 100% !important;
    }
} 
/* End responsive */
.main-header .main-nav .categories .catmenu-opener , .categories .block-1 , .reg-email button{background-color: #a0cb00;}
.searchbox input {border: 2px solid #8fbc1c;}
.main-header {border-bottom: 2px solid #a0cb00;}


