@font-face {
  font-family: Zag;
  src: url(../fonts/zag.regular.otf);
  font-weight: normal;
}
@font-face {
  font-family: Zag;
  src: url(../fonts/zag.bold.otf);
  font-weight: bold;
}

body p{
    font-size: 14px;
}
.w-100{
    width: 100%;
}
.d-none{
    display: none !important;
}
#menu-support{
    /*display: grid;*/
    /*grid-template-columns: 1fr 1fr;*/
}
.item-title.active>a{
    color: #f39c12;
}
.slick-prev, .slick-next{z-index: 1;}
.res-button{
    top: 27px;
    width: inherit;
    height: initial;
    padding: 8.5px 9.5px;
}
.nav.vertical-megamenu > li.open > .dropdown-menu, .nav.vertical-megamenu > li:hover > .dropdown-menu{
    height: min-content;
}

/*Slide product*/
.item-content .item-price>ins.discount, .box-title a, .content_product_detail .discount{
    color: #ffaa00;
    /* color: #ff5900; */
    margin-left: 5px;
    
}
.item-content h4{
    width: 95%;
}
.item-content h4 a{
    text-transform: none;
}
.product-thumb-hover{
    position: relative;
}
.out_of_stock_overplay{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0%;
    width: 100%;
    height: 100%;
    background: #38323252;
    text-transform: uppercase;
    color: #fff;
    display: flex;
    align-items: center;
    font-size: 18px;
}
.out_of_stock_overplay>p{
    width: 100%; 
    text-align: center;
    background: #00000069;
    padding: 10px;
}
.woocommerce .item-bottom .button.out_of_stock_detail:before, .item-bottom .button.out_of_stock_detail:before{
    content: "Chi tiết";
    font-family: RobotoRegular;
    font-size: 14px;
}

.product:hover .item-content h4>a{
    color: #ffaa00 !important;
}
.product:hover .item-bottom>.button{
    background: #ffaa00;
}
.product:hover .item-bottom>.button.added{
    background: url(../images/icons/added.png) no-repeat center center #ff5900;
}

/*
* Làm đẹp - lam dep
*/
.sidebar .widget .widget-inner .block-title-widget h2{ background: #ff5900; color: #fff; }

/*product in page news*/
.item-content .price .discount{
    color: #ffaa00;
}

.widget.etrostore_best_seller_product ul li .item-img{
    position: relative;
}
.widget.etrostore_best_seller_product ul li .item-img .sale-off{
    position: absolute;
    top: -15px;
    right: -15px;
}
.sale-off{
    background-color: #ffaa00;
}
.products-nav .woocommerce-pagination .page-numbers>li>a{
    font-size: 14px;
    padding: 0 5px;
}
.woocommerce-pagination .page-numbers>li.active>a{
    color: #ffaa00;
}
.item-wrap .item-detail .products-thumb{
    z-index: 1;
}
.wrapp-minicart::before{
    content: " ";
    position: absolute;
    top: -13px;
    right: 0px;
    z-index: 999;
    width: 40px;
    height: 30px;
    background-color: background-color: transparent;;
    /* border-top: 15px solid white;
    border-bottom: 15px solid white;
    border-left: 15px solid #ffffff;
    border-right: 15px solid #ffffff;
    transform: rotate(45deg); */
}
.header.header-style2 .header-bottom.sticky-menu .top-form.top-form-minicart .wrapp-minicart{
    /* top: 45px; */
    /* opacity: 1;
    transform: scale(1); */
}
.top-form .wrapp-minicart .minicart-padding ul.minicart-content li .product-image{
    width: 50px;
}

.minicart-content>li .product-price>.price>del{

}
.minicart-content>li .product-price>.price>.discount{
    color: #ffaa00;
    padding-left: 5px;
}
.main_menu_footer{
    display: flex;
    justify-content: space-between;
    margin-left: 0px;
    margin-top: 17px;
}   
.main_menu_footer li{
    list-style: none;
}
.fixed_left_icon{
    position: fixed;
    left: 0;
    top: 50%;
    z-index: 99999;
    opacity: 0.7;
}
.fixed_left_icon>div{
    text-align: center;
    width: 40px;
    margin-bottom: 5px;
}
.fixed_left_icon>div i{
    font-size: 55px;
    /* color: #4dc3ff; */
    color: #ff5900;
    animation: rung 0.7s infinite;
    transform: rotate(0deg);     
}
.fixed_left_icon>div img{
    width: 40px;
}


/* Review */
.box_item_review{
    cursor: pointer;
}
.item_review .name_client h2 small{
    font-size: 12px;
}
.item_review .info_client{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.item_review .client_say_info .client-comment{
    min-height: 66px;
}

.item_review .image_client a>img {
    box-shadow: 2px 3px 14px -5px #232222;
}
.item_review .info_client .list_comment{
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    justify-content: space-between;
}
.list_comment>.box_comment{
    box-shadow: 3px 3px 7px 0px #716e6e;
    margin: 0 5px;
}
.list_comment img{
    height: 50px;
}



@keyframes rung {
  0% {transform: rotate(-30deg);}
  50% {transform: rotate(30deg);}
  100% {transform: rotate(-30deg);}
}

@media (max-width: 991px){
    .wrap-vertical .resmenu-container .navbar-toggle:before {
        color: #ffffff;
    }
    .header.header-style2 .header-mid{
        background-attachment: initial;
        background-size: cover;
    }
    #main-menu .primary-menu .nav-pills{
        display: block;
    }
    .header .header-bottom .main-menu{
        padding: 21px 0 14px;
    }
    .wrap-vertical .resmenu-container{
        top: -9px;
        left: -9px;
        padding: 17px 20px 12px;
    }
}

@media (max-width: 767px) {
    .footer .infomation .info-support {
        display: block;
        background: #262321;
        color: #a8a8a8;
        padding: 10px;
        border-radius: 4px;
    }
    .footer .infomation .info-support ul li {
        color: #a8a8a8;
    }
    .footer .infomation>p{
        display:none;
    }

    .footer-style1 .widget_nav_menu h2 {
        margin-bottom: 0px;
    }
    .footer-style1 .footer-bottom .vc_column_container{
        margin-bottom: 10px;
    }
}

@media (max-width: 479px){
    .header.header-style2 .top-form .wrapp-minicart {
        left: inherit;
        margin-left: 0;
        right: 0;
    }
    .etrostore-logo{
        float: left;
        width: 44%;
    }
    .mid-header2{
        float: right;
        width: 51%;
        padding: 30px 0;
    }
    .header .header-mid .top-form.top-search .topsearch-entry input{
        width: 75%;
    }
    .header.header-style2 .header-mid .top-form.top-search .topsearch-entry{
        width: 100%;
    }
    .wrap-vertical .wrap-title .mega-left-title{
        /*padding: 0px;*/
    }
    .wrap-vertical .resmenu-container{
        top: -9px;
        left: -9px;
        padding: 10px 0px 0px;
    }
    #main-menu .primary-menu .resmenu-container .navbar-toggle{
        padding: 17px 20px 12px;
    }
    .footer-style1 .widget_nav_menu{
        margin: 0px;
    }
    .navbar-toggle.collapsed::after{
        content: "";
        position: absolute;
        top: 0px;
        left: 0px;
        width: 1px;
        height: 1px;
        background: transparent;
        
    }
    .navbar-toggle::after{
        content: "";
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background: #0000005c;
    }
    .header .header-bottom .main-menu{
        padding: 0px;
    }
    .home-style1 .wrap-vertical .resmenu-container .menu-responsive-wrapper{
        max-height: max-content;
    }
    .header .header-top .sidebar-account .account-title{
        padding: 0 12px 0 0;
    }
    .listings-title .container{
        padding: 0;
    }
}

.modal>.modal_center_screen {
    top: 50%;
    -webkit-transform: translateY(-50%) !important;
    -ms-transform: translateY(-50%) !important;
    transform: translateY(-50%) !important;
}

/* MODAL XL -full screen */
#modal_list_image{z-index: 999}
.modal .modal-xl {
    width: 96%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}
.modal .modal-xl.full_height{
    height: calc(100% - 35px);
}
.modal-xl .modal-header{
    background-color: #3FABA4;
    color: #fff;
}
.modal-xl .modal-header> .close{
    opacity: 1;
}
.modal-xl .modal-title{
    font-size: 13px;
    font-weight: bold;
}

.modal-xl .modal-content {
    height: 100%;
    border: 0;
    border-radius: 0;
}
.modal-xl .modal-body{
    padding:  15px 15px 0 15px;
    height: calc(100% - 65px);
    overflow-y: scroll;
}

.modal-xl .modal-footer{
    padding:  5px;
}

/* MODAL  - Full Height Desktop - Tablet - Mobile*/
.modal .full_height{
    max-height: calc(100% - 35px);
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}
.modal .full_height .modal-body{
    max-height: calc(100vh - 60px - 57px - 35px);
    overflow-y: scroll;
    min-height: 50vh;
}


.modal .modal-w-50 {
    width: 50%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

.modal .modal-w-60 {
    width: 60%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

.modal .modal-w-65 {
    width: 65%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

.modal .modal-w-70 {
    width: 70%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

.modal .modal-w-75 {
    width: 75%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

.modal .modal-w-80 {
    width: 80%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

.modal .modal-w-85 {
    width: 85%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

.modal .modal-w-90 {
    width: 90%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

.modal .modal-w-100 {
    width: 98%;
    max-width: none;
    max-height: calc(100% - 35px);
    margin: 0px auto;
}

/* Modal Full Height 50% - 100% */
.modal .full_height.modal-h-50, .modal .full_height.modal-h-60, .modal .full_height.modal-h-65, .modal .full_height.modal-h-70, .modal .full_height.modal-h-75, .modal .full_height.modal-h-80, .modal .full_height.modal-h-85, .modal .full_height.modal-h-90, .modal .full_height.modal-h-95, .modal .full_height.modal-h-100  {
    max-height: calc(100vh - 0px);
    width: 100%;
    padding: 0;
}

.modal .modal-h-50 .modal-body{
    min-height: calc(50vh - 57px - 66px);
}

.modal .modal-h-60 .modal-body{
    min-height: calc(60vh - 57px - 66px);
}

.modal .modal-h-65 .modal-body{
    min-height: calc(65vh - 57px - 66px);
}

.modal .modal-h-70 .modal-body{
    min-height: calc(70vh - 57px - 66px);
}

.modal .modal-h-75 .modal-body{
    min-height: calc(75vh - 57px - 66px);
}

.modal .modal-h-80 .modal-body{
    min-height: calc(80vh - 57px - 66px);
}

.modal .modal-h-85 .modal-body{
    min-height: calc(85vh - 57px - 66px);
}

.modal .modal-h-90 .modal-body{
    min-height: calc(90vh - 57px - 66px);
}

.modal .modal-h-95 .modal-body{
    min-height: calc(95vh - 57px - 66px);
}

.modal .modal-h-100 .modal-body{
    min-height: calc(99.8vh - 57px - 66px);
    max-height: calc(99.8vh - 57px - 66px);
}