@font-face {
  font-family: "roboto-regular";
  src: url("../fonts/Roboto-Regular.ttf");
  font-weight: normal; }
@font-face {
  font-family: "roboto-light";
  src: url("../fonts/Roboto-Light.ttf");
  font-weight: normal; }  
@font-face {
  font-family: "roboto-bold";
  src: url("../fonts/Roboto-Bold.ttf");
  font-weight: normal; }
@font-face {
  font-family: "roboto-black";
  src: url("../fonts/Roboto-Black.ttf");
  font-weight: normal; }
@font-face {
  font-family: "utm-azuki";
  src: url("../fonts/UTM Azuki.ttf");
  font-weight: normal; }
@font-face {
  font-family: "saira-semibold";
  src: url("../fonts/SairaCondensed-SemiBold.ttf");
  font-weight: normal; }

.row.row-10{
    margin-left: -5px;
    margin-right: -5px;
}
.row-10 [class*="col-"]{
    padding-left: 5px;
    padding-right: 5px;
}
.header-title{
  position: relative;
  text-align: center;
  background: url(../images/h2_center.png) bottom center no-repeat;
  padding-bottom: 10px;
  margin-bottom: 30px;
}
.header-title .desc{
  font-family: roboto-regular;
  font-size: 15px;
  color: #191919;
  margin: 10px 0;
}
.h2-title{
  font-family: utm-azuki;
  font-size: 65px;
  color: #191919;
  font-weight: normal;
  line-height: 1;
}

#menu-top {z-index: 9999;width: 100%;display: flex;align-items: center;width: 100%;/* background-color: #FFF; */position: relative;height: 65px;background: #fb6f22;border-radius: 15px;/* padding: 0 45px; */}
#menu-top.sticky_topbar { position: fixed !important; top: 0; left: 0; z-index: 99999; bottom: unset; background: #209800; }
#menu-top > .container { position: relative; display: flex; justify-content: center; /* background: #fed700; */ /* bottom: 0; */ }
#menu-top .menu-parent {list-style: none;position: relative;margin-bottom: 0;display: flex;flex-wrap: wrap;justify-content: flex-end;width: 100%;/* background-color: #fb6f22; */padding: 0;margin: 0;}
#menu-top .menu-parent:nth-child(1){justify-content: flex-start;}
#menu-top .menu { display: inline-flex; flex-wrap: wrap; align-items: center; position: relative; }
#menu-top .text-a {display: inline-flex;position: relative;align-items: center;color: #FFF;font-size: 15px;position: relative;font-family: 'Jura', sans-serif;font-weight: bold;line-height: 65px;padding: 0 18px;z-index: 999;text-decoration: none !important;text-transform: uppercase;}
#menu-top .text-a img { vertical-align: unset; margin-right: 10px; }
#menu-top .menu:hover .text-a {color: #0c0c0c;}
#menu-top .active2 .text-a, #menu-top .menu:hover .text-a {color: #0a0a0a;}
#menu-top .ul-child {padding: 0;position: absolute;display: none;background-color: rgb(247, 126, 59);z-index: 9999;list-style-type: none;text-align: left;top: 100%;min-width: 200px;left: -1px;}
#menu-top .ul-child a {font-size: 16px;color: #FFF;line-height: 18px;white-space: nowrap;/* font-family: "muli-regular"; */text-decoration: none;}
#menu-top .li-child:hover > a {/* color: #333; */}
#menu-top .li-child:hover {background: #f95800;}
#menu-top .li-child { padding: 12px 20px; border-style: solid; border-width: 0 0px 1px; border-bottom: 1px solid #ccc; border-color: rgba(255, 255, 255, 0.75); line-height: 25px; cursor: pointer; position: relative; }
#menu-top .menu:hover .ul-child { display: block; }
#menu-top .active2:hover .ul-child { display: block; }
#menu-top .ul-child-child { position: absolute; display: none; background-color: rgba(30, 144, 22, 0.85); z-index: 9999; list-style-type: none; top: -1px; left: 100%; min-width: 200px; border-top: 1px solid #fed700; min-width: 200px; }
#menu-top .li-child-child { padding: 7px 20px; border-style: solid; border-width: 0 0px 1px 1px; border-color: #fed700; line-height: 35px; cursor: pointer; position: relative; }
#menu-top .li-child-child:hover { background: #27961f; }
#menu-top .li-child-child:hover > a { color: #fff; }
#menu-top .li-child:hover .ul-child-child { display: block; }
#menu-top .ul-child-child-child { position: absolute; display: none; background-color: #fff; z-index: 9999; list-style-type: none; top: -1px; left: 100%; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; min-width: 200px; }
#menu-top .li-child-child-child { padding: 7px 20px; border-style: solid; border-width: 0 1px; border-color: #ccc; line-height: 18px; cursor: pointer; }
#menu-top .li-child-child-child:hover { background: #72777e; }
#menu-top .li-child-child-child:hover > a { color: #fff; }
#menu-top .li-child-child:hover .ul-child-child-child { display: block; }
#menu-top #timkiem { width: 255px; height: 35px; float: right; margin-top: 5px; position: relative; background: #FFF; border-radius: 20px; }
#menu-top #timkiem form { background: #efefef; }
#menu-top #timkiem input { border: none; outline: none; background: none; }
#menu-top #timkiem input[type="text"] { padding-left: 15px; height: 35px; border-radius: 20px; }
#menu-top #timkiem input[type="button"] { position: absolute; left: 10px; top: 10px; width: 24px; height: 24px; background: url(../images/timkiem_icon.png) top center no-repeat; color: transparent; }
#header{
    position:fixed;
    z-index:9;
    top:0;
    left:0;
    width:100%;
    padding-top: 51px;
}
#header .container{
    padding: 0 45px;
}
#menu-top:before{
    content: url(../images/menu_left.png);
    position:absolute;
    left: -40px;
    bottom: -13px;
}
#menu-top:after{
    content: url(../images/menu_right.png);
    position:absolute;
    right: -40px;
    bottom: -13px;
}
.product_item{
        background-color: #fff;
        text-align: center;
        padding-bottom: 20px;
    }
    .product_item .image{
        position: relative;
        overflow: hidden;
        margin-bottom: 10px;
    }
    .product_item .image:before{
            content: '';
            position: absolute;
            bottom: -1px;
            left: 0;
            width: 100%;
            height: 116px;
            /* background: url(../images/product_item.png); */
            background-size: 100%;
            z-index: 99;
    }
    .product_item h3 a{
        font-family: roboto-black;
        font-size: 16px;
        color: #222222;
    }
.product_item  .giaban{
    color: #e02c2c;
    font-size: 16px;
}
  .product_item .image img{
  
  }
    #product_noibat{
         background: url(../images/bg_product_noibat.jpg);
        background-size: cover;
        padding: 45px 0;
    }
    #visaochon{
        background: url(../images/bg_visaochon.jpg);
        background-size: cover;
        padding: 45px 0;
        height: 890px;
        position: relative;
    }
    #album{
        background: url(../images/bg_khonggianquan.jpg);
        background-size: cover;
        padding: 45px 0;
    }
    .kgq_item{
        margin-bottom: 10px;
    }
    
    #tintuc{
        background: url(../images/bg_tintuc.jpg);
        background-size: cover;
        padding: 45px 0;
    }
    .tintuc_item{
        position: relative;
        background-color: #faf8ec;
    }
    .tintuc_item .detail{
        
        padding-left: 70px;
        position: relative;
        padding-bottom: 15px;
    }
    .tintuc_item h3{
        margin-top: 10px;
    }
    .tintuc_item h3 a{
        color: #333333;
        font-family: roboto-black;
        font-size: 15px;
        text-transform: uppercase;
    }
    .tintuc_item .mota{
        color: #333;
        font-size: 14px;
        font-family: roboto-regular;
    }
    .tintuc_item .ngaytao{
        position: absolute;
        background-color: #fb6f22;
        width: 55px;
        left: 0;
        top: -30px;
    }
    .tintuc_item .ngaytao{
        font-family: "saira-semibold";
        line-height: 1.2;
        color: #FFF;
        text-align: center;
        padding-top: 15px;
        padding-bottom: 5px;
        font-size: 14px;
    }
    .tintuc_item .ngaytao .ngay{
        font-size: 24px;
    }
    .tintuc_item .xemthem{
        margin-top: 8px;
    }
    .tintuc_item .xemthem a{
       font-family: roboto-light;
    font-size: 14px;
    color: #333333;
    display: inline-flex;
    border: 1px solid #ffc4a4;
    padding: 5px 30px;
    border-radius: 30px;
    }
    .thumbhinh {display: block;/* display: flex; */}
.thumbhinh .mcs-item { padding: 5px; }
#left { width: calc(100% - 15px); }
@media (min-width: 1024px) { #left {/* width: calc(50% - 15px); */} }
@media (min-width: 0) { #left { width: 560px; } }
#right { width: calc(100%); padding: 0 15px; }
@media (min-width: 1024px) { #right {/* width: calc(50% - 15px); */} }
@media (min-width: 0) { #right { width: calc(100% - 590px); } }
.breadcrumb { background: none; }
.breadcrumb a { color: #ec008c; }
.product_info .label { margin-right: 8px; }
body.product_detail h1 {font-size: 24px;border-bottom: 1px solid #8a4105;margin: 0;margin-bottom: 10px;letter-spacing: 1.5px;text-align: left;}
.product_info { padding-bottom: 10px; border-bottom: 1px solid rgba(118, 191, 68, 0.11); margin-bottom: 10px; color: #454545; font-size: 16px; align-items: center; display: flex; }
.product_info .label { color: #000; text-transform: uppercase; font-size: 13px; letter-spacing: 2px; }
.product_info .giaban {font-family: 'Jura', sans-serif;}
.product_info .giacu { font-size: 24px; color: #888; text-decoration: line-through; }
.product_info .giacu:before { content: "-"; margin-right: 20px; }
.product_info .nav-link { color: #333; }
.product_info .nav-tabs .nav-link.active, .product_info .nav-tabs .nav-item.show .nav-link { border: none; border-bottom: 2px solid #333; }
.product_info .nav.nav-tabs { justify-content: space-between; }
.product_info .btn-muangay, .product_info .btn-giohang { color: #FFF; padding: 10px 30px; display: inline-block; margin-right: 15px; border-radius: 5px; font-family: "muli-regular"; cursor: pointer; font-size: 15px; }
.product_info .btn-giohang.muangay { background-color: #df0000; }
.product_info .btn-giohang { background: #209800; }

.product_info .btn-giohang:before { content: "\f07a"; font-family: FontAwesome; font-size: 17px; margin-right: 10px; }
.soluong_11 { border: 1px solid #CCC; float: left; height: 32px; }
.soluong { border: none; outline: 0; border-left: 1px solid #CCC; border-right: 1px solid #ccc; float: left; width: 100px; height: 100%; text-align: center; }
.soluong_11 .a_1 { float: left; width: 20px; display: flex; align-items: center; justify-content: center; height: 100%; color: #000; font-size: 10px; }
.chiase{
    display: flex;
    justify-content: flex-start;
}
.ngaydang, .luotxem { color: #454545; font-size: 13px; }
.ngaydang:before, .luotxem:before { font-family: "FontAwesome"; margin-right: 4px; }
.ngay_luot { margin-bottom: 10px; }
.luotxem:before { content: "\f06e"; }
.ngaydang { margin-right: 15px; }
.ngaydang:before { content: "\f073 "; }
.card_news {display: flex;justify-content: space-between;line-height: 1.5;box-shadow: 0 0 1px 1px #e8e8e8;border-radius: 5px;margin-bottom: 25px;}
.card_news .image { width: 180px; }
.card_news .content { width: calc(100% - 195px); }
.card_news .h3-title {font-family: jura;font-size: 18px;color: #232323;margin-bottom: 5px;margin-top: 5px;display: block;}
.card_news a.h3-title { text-decoration: none; text-transform: uppercase; }
.card_news a.h3-title:hover { color: #df0000; }

.sticky_header #logo img{
    height: 55px;
}
.sticky_header{
    padding: 0!important;
    /* background: #fb6f22; */
}
.h3a{

    color: #333;
        font-size: 16px;
        text-decoration: none!important;
}
.content .content{
    padding:0;
}
#menunuoc{
    background: url(../images/bg_menu.jpg);
    padding: 45px 0;
}
#menunuoc .h2-title{
    color: #fb6f22;
}
#menunuoc .menunuoc_item .image{
    border-radius: 50%;
    position:relative;
    background: #f59000;
    padding: 8px;
    overflow: hidden;
}
#menunuoc .menunuoc_item .image > div{
    overflow: hidden;
    border-radius: 50%;
}
#menunuoc .menunuoc_item .image img{
    border-radius: 50%;
}
#menunuoc h3{
    position:absolute;
    z-index:9;
    bottom: 30px;
    background: url(../images/tieude.png) center;
    width: 100%;
    /* background-size:cover; */
    height: 64px;
    text-align: center;
    line-height: 61px;
}
#menunuoc h3 a{
    font-family: roboto-black;
    color: #000;
    font-size: 17px;
}
.menunuoc_item{
    transition: all 0.3s;
}
.swiper-slide:not(.swiper-slide-active) .menunuoc_item{
    transform: scale(0.55) translateY(-145px);
    transition: all 0.3s;
} 
.menunuoc-content{
    position:relative;
    background: url(../images/nuoc_after.png) 0 20px no-repeat;
    background-size:100%;
}
.hieuung{position: relative;overflow: hidden;}
.hieuung:after{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.5);
    content: '';
    -webkit-transition: -webkit-transform 0.6s;
    transition: transform 0.8s;
    -webkit-transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-110%,0);
    transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-110%,0);
    pointer-events: none;
}
.hieuung:hover:after{
    webkit-transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,110%,0);
    transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,110%,0);
}
.effecspcl {pointer-events: none;}
.effecspcl:after,.effecspcl:before {
    content: '';
    display: block;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    z-index: 1;
    -moz-transition: all .4s ease;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    position: absolute;
}
.effecspcl:before {
    border-top: 1px solid #f00;
    border-bottom: 1px solid #f00;
    -webkit-transform: scale(0,1);
    -moz-transform: scale(0,1);
    transform: scale(0,1);
}
.effecspcl:after {
    border-left: 1px solid #f00;
    border-right: 1px solid #f00;
    -webkit-transform: scale(1,0);
    -moz-transform: scale(1,0);
    transform: scale(1,0);
}
.hieuung:hover .effecspcl {
    background: rgba(255,255,255,0.1);
    box-shadow: none;
}
.hieuung:hover .effecspcl:after,.hieuung:hover .effecspcl:before
{
    -webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    transform: scale(1,1);
}
/* Hieu ung */
.hieuung2{position: relative;overflow: hidden;opacity: 0.9;transition: all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-ms-transition: all 0.5s;}
.hieuung2 img{}
.hieuung2:after{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(251, 251, 251, 0.2);content: '';-webkit-transition: -webkit-transform 0.6s;transition: transform 0.6s;-webkit-transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);pointer-events: none;}
.hieuung2:hover:after{webkit-transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);transform: scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);}
.hieuung2:hover{opacity: 1;}
/* End hieu ung */
.hover:hover h3 a{
    color: #f00;
}
.hover .image img{
        transition: all 0.5s;
}
.hover:hover .image img{
    transform: scale(1.3);
    transition: all 0.5s;
}