:root {
    --color1: #0064d6;
    --color2: #0abd30;
    --color-border: #e5e7eb;
    --color-bg: #f6f6f7;
    --color-line: #e5e6e9;
}

html{}
body{ float:left; background:#fff; width:100%; font-family: 'URW Geometric', sans-serif; font-weight:normal; font-size:16px; color:#000; margin:initial!important; overflow-x:hidden; overflow-y:auto }
section{width:100%; float:left; position:relative}
section>.container{z-index:2;}

@media (max-width:767px) {
    section>.container{max-width:100%;}
}

.st1{background:url(../img/S1-bg.jpg) no-repeat center bottom; background-size:cover}
.st1 .inner{height:1150px;}
.st1:before{width:80%; height:100%;  background-image: linear-gradient(to right, rgba(0,0,0,.75) , rgba(0,0,0,0)); content:''; position:absolute; top:0; left:0;}
.st1 .logo{width:250px; margin-left:-125px; position:absolute; top:-5px; left:50%;}
.st1 .logo img{width:100%;}
.st1 .caption{width:50%; float:left; position:relative; color:#fff; padding-top:150px;}
.st1 .caption h1{font-family:'URW Geometric ExtraBold'; margin:0; padding:0; font-size:70px;}
.st1 .caption h4{font-size:24px; text-align:justify; padding-top:10px;}
.st1 .text-foot{width:calc(100% - 30px); float:left; position:absolute; text-align:center; font-family: 'URW Geometric Bold'; left:15px; bottom:550px; color:#fff; font-size:30px; border-radius:10px; padding: 10px 20px; }
.st1 .text-foot span{display:block; position:relative; z-index:5;}
.st1 .text-foot:before{content:''; width:50%; height:100%; background: linear-gradient(to right, rgba(0,0,0,0) , var(--color2) 50%); position:absolute; top:0; left:0; border-radius: 0 0}
.st1 .text-foot:after{content:''; width:50%; height:100%; background: linear-gradient(to right, var(--color2) 50%, rgba(0,0,0,0)); position:absolute; top:0; right:0; border-radius:  0 0 }

@media (max-width:767px) {
    .st1{background-size: auto 110%; background-position: center bottom}
    .st1:before{width:100%; display:none;}
    .st1 .inner{height:1200px;}
    .st1 .caption{width:calc(100% - 20px); text-align:center; left:10px; background:rgba(0,0,0,.3); padding: 20px; top:300px; border-radius:20px; padding-top:30px;}
    .st1 .caption h1{font-size:35px;}
    .st1 .caption h4{font-size:22px;}
    .st1 .text-foot{bottom:450px; width:calc(100%); left:0; font-size:22px; padding-left:10px; padding-right:10px; background:var(--color2); border-radius:0;}
}

@media (min-width:768px) and (max-width:991px) {
    .st1:before{width:100%;}
    .st1 .inner{height:1000px;}
    .st1 .caption{width:100%;}
    .st1 .caption h1{font-size:50px;}
    .st1 .text-foot{bottom:500px;}
}

.st2{margin-top:-500px; }
.st2 .wrap-caption{width:100%; float:left; position:relative; margin-top:300px; background:url(../img/S2-bg-caption.svg) no-repeat center 0; background-size: 100% auto; padding-top:150px; padding-bottom:80px; z-index:2;}
.st2 .wrap-caption .title-caption{font-family: 'URW Geometric ExtraBold'; margin-bottom:210px; position:absolute; display:flex; align-items:center; left:0; bottom:100%;}
.st2 .wrap-caption .title-caption h3{font-size:55px; color:#fff;}
.st2 .wrap-caption ul.info{width:calc(100% + 40px); margin:0; padding:0; list-style:none; margin: 0 0 0 -20px;}
.st2 .wrap-caption ul.info li{width:33.33333333%; padding: 0 20px; position:relative; float:left; color:#fff; padding-left:75px;}
.st2 .wrap-caption ul.info li:before{content:'1'; position:absolute; top:-20px; left:20px; text-align:revert; font-family: 'URW Geometric ExtraBold'; font-size:90px; width:50px;}
.st2 .wrap-caption ul.info li h4{font-family: 'URW Geometric Bold'; font-size:30px;}
.st2 .wrap-caption ul.info li p{margin:0; width:100%; font-size:20px; text-align:justify}
.st2 .wrap-caption ul.info li:nth-child(2):before{content:'2'}
.st2 .wrap-caption ul.info li:nth-child(3):before{content:'3'}
.st2 .inner{height:750px;}

@media(max-width:767px) {
    .st2 .wrap-caption{background:none; background:var(--color1); padding-bottom:50px;}
    .st2 .wrap-caption .title-caption{bottom:initial; top:0;}
    .st2 .wrap-caption .title-caption h3{font-size:40px; padding: 0 25px; text-align:left ;}
    .st2 .wrap-caption ul.info{margin-top:100px; width:100%; margin-left:0;}
    .st2 .wrap-caption ul.info li{width:calc(100%); margin-top:25px; border-bottom:1px dashed rgba(255,255,255,.7); margin:0; padding-top:20px; padding-bottom:20px; padding-left:50px;}
    .st2 .wrap-caption ul.info li:before{top:5px; text-align:left; left:0; font-size:65px;}
    .st2 .wrap-caption ul.info li h4{font-size: 25px}
    .st2 .wrap-caption ul.info li:last-child{border:none; padding-bottom:0;}
}

@media (min-width:768px) and (max-width:991px) {
    .st2 .wrap-caption{background:none; background:var(--color1)}
    .st2 .wrap-caption .title-caption{bottom:initial; top:0;}
    .st2 .wrap-caption .title-caption h3{font-size:45px;}
    .st2 .wrap-caption .title-caption h3 br{display:none;}
    .st2 .wrap-caption ul.info{margin-top:60px}
    .st2 .wrap-caption ul.info li{width:calc(100%); margin-top:25px;}
}


#slide-st2{width:450px; overflow:hidden; border-radius:20px; position:absolute; right:15px; bottom:100%; margin-bottom:40px; box-shadow: 0 0 30px rgba(0,0,0,.3)}
#slide-st2 .item{width:100%; }
#slide-st2 .item img {display: block; width: 100%; height: auto;}

@media(max-width:767px) {
    #slide-st2{right:50%; margin-right: -210px; width:420px;}

}


.st3{background:url(../img/S3-bg.jpg) no-repeat center bottom; background-size:100% auto; }
.st3 .bg-wood{position:absolute; left:15px; bottom:-80px;}
.st3 .bgOver{width:100%; height:250px; display:none; background:url(../img/S3-bg-line.svg) no-repeat center 0; background-size: 100% auto; position:absolute; left:0; bottom:0; z-index:1;}

#slide-st3{width:100%; overflow:hidden;position:relative; z-index:2; }
#slide-st3 .item{height:650px; position:relative; display:table; width:100%; }
#slide-st3 .item .col-img{display:table-cell; position:relative; width:480px;}
#slide-st3 .item .col-img img{width:100%; position:absolute; bottom:50px;}
#slide-st3 .item .col-info{display:table-cell; position:relative; text-align:center; padding-top:100px; padding-left:30px;}
#slide-st3 .item .col-info h3{width:100%;  text-align:center; font-family: 'URW Geometric ExtraBold'; color:var(--color1); font-size:50px;}
#slide-st3 .item .col-info ul{margin:0; padding:0; list-style:none; width:350px; margin: 20px auto 0 auto }
#slide-st3 .item .col-info ul li{width:100%; background:var(--color2); margin-top:15px; font-size:22px; color:#fff; line-height:45px; border-radius:20px;}
#slide-st3 .item .col-info .nav-more{background:var(--color1); padding: 0 35px; line-height:46px; height:45px; margin-top:100px; color:#fff; display:inline-block; font-size: 22px; border-radius:20px; text-decoration:none; animation: zoom-in-zoom-out 1.5s ease-out infinite;}

#slide-st3 .owl-controls{margin:0;}
#slide-st3 .owl-controls .owl-buttons div{width:50px; height:50px;border-radius:50%; font-size:0; opacity:1; background:#fff; margin:0; display:flex; align-items:center; justify-content:center; position:absolute; top:50%; margin-top:-25px; box-shadow: 0 0 0 5px rgba(0,0,0,.15); transition:.3s;} 
#slide-st3 .owl-controls .owl-buttons div:hover{background:var(--color1)}
#slide-st3 .owl-controls .owl-buttons div:hover:before{color:#fff!important}
#slide-st3 .owl-controls .owl-buttons .owl-prev{left:5px;}
#slide-st3 .owl-controls .owl-buttons .owl-prev:before{font-family: "Font Awesome 5";font-weight: 900; content:"\f053"; font-size:16px; color:var(--color1)}
#slide-st3 .owl-controls .owl-buttons .owl-next{right:5px;}
#slide-st3 .owl-controls .owl-buttons .owl-next:before{font-family: "Font Awesome 5";font-weight: 900; content:"\f054"; font-size:16px; color:var(--color1)}

@keyframes zoom-in-zoom-out {
    0% { transform: scale(1, 1); }
    50% { transform: scale(1.2, 1.2); }
    100% { transform: scale(1, 1); }
}

@media (max-width:767px) {
    .st3{background-size:auto 100%}
    #slide-st3 .item{display:block; height:650px;}
    #slide-st3 .item .col-img{width:350px; margin-left:-175px;  float:left; display:block; bottom:40px; left:50%; display:block; position:absolute}
    #slide-st3 .item .col-img img{position:relative; bottom:initial}
    #slide-st3 .item .col-info{display:block; position:initial; top:0; width:100%; top:0; right:0; padding-top:50px; padding-left:0;}
    #slide-st3 .item .col-info h3{font-size:35px;}
    #slide-st3 .item .col-info ul{width:300px;}
    #slide-st3 .item .col-info ul li{font-size:19px; line-height:42px;}
    #slide-st3 .item .col-info .nav-more{position:absolute; right:50%; width:200px; margin-right:-100px; bottom:40px;  height:40px; line-height:40px; font-size:19px;}
    .st3 .bg-wood{width:350px; left:50%; margin-left:-175px; bottom:-55px;}
}


@media (min-width:768px) and (max-width:991px) {
    #slide-st3 .item{display:block; height:500px;}
    #slide-st3 .item .col-img{width:350px;  float:left; display:block; bottom:20px; left:0; display:block; position:absolute}
    #slide-st3 .item .col-img img{position:relative; bottom:initial}
    #slide-st3 .item .col-info{display:block; position:absolute; top:0; width:100%; top:0; right:0; padding-top:70px;}
    #slide-st3 .item .col-info h3{font-size:45px;}
    #slide-st3 .item .col-info ul{width:300px; float:right}
    #slide-st3 .item .col-info ul li{font-size:19px; line-height:42px;}
    #slide-st3 .item .col-info .nav-more{position:absolute; right:50px; top:400px; margin:0; height:40px; line-height:40px; font-size:19px;}
    .st3 .bg-wood{width:350px;}
}

@media (min-width:992px) and (max-width:1199px){
    
}


.st4{background:url(../img/S4-bg.jpg) no-repeat center 0; background-size:100% auto }
.st4:before{width:100%; height:calc(100% - 100px);  background-image: linear-gradient(to top, var(--color2) 30% , rgba(70,204,94,0)); content:''; position:absolute; bottom:0; left:0;}
.st4 .inner{height:800px; padding-top:70px;}
.st4 .inner .info{width:calc(100% - 310px); float:left; background:url(../img/s4-bg-over.png) no-repeat center 0; background-size:100% auto; padding: 70px 150px 0 50px;}
.st4 .inner .info .title{width:500px;}
.st4 .inner .info p{width:100%; font-size:22px; text-align:justify; color:#fff; margin:40px 0 10px 0;}
.st4 .inner .info .item{width:100%; float:left; position:relative; padding-left:50px; color:#fff; width:550px; margin-top:10px;}
.st4 .inner .info .item i{width:50px; text-align:center; font-size:32px; position:absolute; top:0; left:0;}
.st4 .inner .info .item b{font-family: 'URW Geometric Bold'; font-size:30px;}
.st4 .inner .info .item span{font-size:22px; display:block; clear:both; width:100%; float:left; }
.st4 .inner .info .item .date{margin-top:-5px; margin-bottom:15px;}
.st4 .inner .human{width:400px; position:absolute; right:15px; bottom:0;z-index:3;}

@media (max-width:767px) {
    .st4{background-size:cover; }
    .st4 .inner{height:auto; padding-top:50px; padding-bottom:40px;}
    .st4 .inner .info{background:none; width:100%; padding:0;}
    .st4 .inner .info .title{width:350px;}
    .st4 .inner .info p{padding-right:180px; font-size:21px; margin-bottom:15px; }
    .st4 .inner .info .item{padding-left:30px;}
    .st4 .inner .info .item i{font-size:22px; left:0; width:auto; top:5px;}
    .st4 .inner .info .item b{font-size:24px;}
    .st4 .inner .info .item span{font-size:20px;}
    .st4 .inner .info .item{width:calc(100% - 160px);}
    .st4 .inner .human{width:300px; right:-100px;}
}

@media (min-width:768px) and (max-width:991px) {
    .st4{background-size:cover; }
    .st4 .inner{height:720px;}
    .st4 .inner .info{background:none; width:100%; padding:0;}
    .st4 .inner .info .title{width:400px;}
    .st4 .inner .info p{padding-right:250px; font-size:21px; margin-bottom:25px; }
    .st4 .inner .info .item i{font-size:28px;}
    .st4 .inner .info .item b{font-size:28px;}
    .st4 .inner .info .item{width:450px;}
    .st4 .inner .human{width:300px; right:-50px;}
}

@media (min-width:992px) and (max-width:1199px) {
    .st4 .inner{height:850px;}
    .st4 .inner .info .item{width:450px}
}

.st5{background:var(--color1)}
.st5 ul{width:calc(100% + 30px); float:left; margin:0 0 0 -15px; padding:10px 0 0 0; list-style:none;}
.st5 ul:before{ width:calc(100% - 400px); height:10px; background:#fff; position:absolute; top:0; left:15px; border-radius:5px 0 0 5px;}
.st5 ul:after{ width:calc(430px); height:10px; background:var(--color2); position:absolute; top:0; right:15px; border-radius: 0 5px 5px 0}
.st5 ul li{width: calc(33.3333333333333% - 30px);  float:left; margin: 50px 15px; background:var(--color1); color:#fff; border-radius:30px; border:4px solid #fff; text-align:center; padding:25px 20px 5px 20px; font-size:25px; box-shadow: 0 3px 10px 5px rgba(0,0,0,.1); cursor:pointer}
.st5 ul li span{display:block; width:100%; text-transform:uppercase; font-family: 'URW Geometric Bold';}
.st5 ul li label{width:100%; margin:0; cursor:pointer}
.st5 ul li b{display:block; font-family: 'URW Geometric ExtraBold'; font-size:70px; width:100%; float:left; margin-top:-10px;}
.st5 ul li:first-child{animation:  zoom-in-zoom-out-tag 3s ease-out infinite;}
.st5 ul li:nth-child(2){animation:  zoom-in-zoom-out-tag 2.5s ease-out infinite;}
.st5 ul li:nth-child(3){animation:  zoom-in-zoom-out-tag 2s ease-out infinite;}

@keyframes zoom-in-zoom-out-tag {
    0% { transform: scale(1, 1); }
    50% { transform: scale(1.08, 1.08); }
    100% { transform: scale(1, 1); }
}

@media (max-width:767px) {
    .st5 ul{width:calc(100% + 10px); margin:20px 0 10px -5px;}
    .st5 ul li{width:calc(33.33333333% - 10px); margin:0 5px; border-radius:0; border:none; float:left;  box-shadow:none; padding:20px 10px 5px 10px; color:var(--color1); background:#fff; border-radius:14px;}
    .st5 ul li span{font-size:18px; font-family: 'URW Geometric Bold'}
    .st5 ul li label{font-size:20px;}
    .st5 ul li b{font-size:40px; margin-top:-5px; color:var(--color2)}
}

.st6{background:var(--color1); }
.st6 .inner{height:850px;}
.st6 .gift-bg{left:-400px; position:absolute; top:-20px; height:820px; z-index:4;}
.st6 .gift{position:absolute; top:170px; height:380px; left:15px; transform:rotate(-25deg) ; z-index:5 }
.st6 .rotation{position:absolute; bottom:0px; right:15px; z-index:2;width:550px; height:580px; overflow:hidden }
.st6 .rotation img{width:100%; height:auto; position:absolute; top:0; left:0;}
.st6 .caption{position:absolute; top:70px; right:15px; z-index:6; color:#fff}
.st6 .caption h3{font-family: 'URW Geometric ExtraBold'; font-size:45px; text-transform:uppercase; width:550px; text-align:center;}
.st6 .caption h4{text-align:center;}

@media (max-width:767px) {
    .st6 .inner{height:840px}
    .st6 .caption{width:100%; text-align:center; right:0; top:50px; }
    .st6 .caption h3{text-align:center; font-size:35px;width:100%; padding: 0 15px;}
    .st6 .caption h4{font-size:22px;}
    .st6 .rotation{width:300px; height:320px; right:15px;bottom:initial; top:200px; }
    .st6 .gift-bg{height:520px; top:300px; margin-left:0; left:-300px;}
    .st6 .gift{height:240px; top:420px; left:20px;}
}

@media (min-width:768px) and (max-width:991px) {
    .st6 .caption{width:100%; text-align:center; right:0; }
    .st6 .caption h3{text-align:center; font-size:40px;width:100%; padding: 0 15px;}
    .st6 .rotation{width:400px; height:430px; right:0px;bottom:initial; top:300px; }
    .st6 .gift-bg{height:650px; top:180px; margin-left:0;}
    .st6 .gift{height:330px; top:290px; left:-30px;}
}

@media (min-width:992px) and (max-width:1199px) {
    .st6 .inner{height:670px;}
    .st6 .gift-bg{left:-400px; position:absolute; top:0px; height:780px; z-index:4;}
    .st6 .rotation{width:450px; height:455px; overflow:hidden; bottom:-20px; }
    .st6 .caption h3{font-size:40px;}
}

.st7{background:var(--color1); }
.st7:before{content:''; background:url(../img/st7-bg.png) no-repeat center bottom; background-size: 110% 110%; width:100%; height:100%; position:absolute; bottom:0; left:0;}
.st7 .inner{height:600px;}
.st7 .combo{width:520px; position:absolute; right:15px; bottom:30px;}
.st7 .caption{position:absolute; top:130px; left:15px; z-index:6; color:#fff}
.st7 .caption h3{font-family: 'URW Geometric ExtraBold'; font-size:45px; text-transform:uppercase; width:550px; text-align:left; }
.st7 .caption .info{text-align:center; display:table; position:relative; margin-top:20px; }
.st7 .caption .price{display:table-cell; position:relative; vertical-align:middle; padding-right:100px; text-align:left; padding-top:25px;}
.st7 .caption .price span{display:block; font-size:22px;}

.st7 .caption .price b{font-family: 'URW Geometric Bold'; font-size:45px; margin-top:-5px; width:100%; float:left;}
.st7 .caption .price b:after{content:'đ'; font-size:30px;}
.st7 .caption .price .row-bottom b{font-size:30px;}
.st7 .caption .price .row-bottom b:after{font-size:22px; padding-left:5px;}
.st7 .caption ul{margin:0; padding:0; list-style:none; color:#fff; display:table-cell }
.st7 .caption ul li.title{padding-left:0; font-family: 'URW Geometric Bold'; text-align:left;}
.st7 .caption ul li{position:relative; font-size:22px; padding-left:35px; margin-top:20px; text-align:left;}
.st7 .caption ul li:not(.title):before{font-family: "Font Awesome 5"; font-weight:900;content: "\f058"; position:absolute; top:-3px; left:0;}

@media (max-width:767px) {
  .st7 .inner{height:740px;}
  .st7:before{background-size: auto 100%}
  .st7 .caption{top:0; width:100%; text-align:center; left:0; padding: 0 15px;}
  .st7 .caption h3{font-size:35px; text-align:center; width:100%;}
  .st7 .caption .info{display:block;}
  .st7 .caption .price{padding:0; width:100%;}
  .st7 .caption .price b{font-size:38px;}
  .st7 .caption .price .row-top{float:left;}
  .st7 .caption .price .row-bottom{float:left; padding: 10px 0 0 40px}
  .st7 .caption .price .row-bottom span{font-size:19px;}
  .st7 .caption .price .row-bottom b{font-size:25px; padding-top:5px; }
  .st7 .caption ul{display:block; width:100%; float:left;}
  .st7 .caption ul li{margin-top:10px; font-size:20px}
   .st7 .combo{width:380px; margin-right: -190px; right:50%;}
}

@media (min-width:768px) and (max-width:991px) {
    .st7 .caption{top:0; width:100%; text-align:center;}
    .st7 .caption h3{font-size:40px; text-align:center; width:100%;}
    .st7 .caption .info{ display:block}
    .st7 .caption ul{clear:both; display:block;}
    .st7 .combo{width:500px; right:-50px;}
}

@media (min-width:992px) and (max-width:1199px) {
    .st7 .caption .info{display:block;}
    .st7 .caption .price{width:100%; padding:0; display:flex; float:left; }
    .st7 .caption .price .row-bottom{margin: 16px 0 0 40px;}
    .st7 .caption h3{font-size:40px;}
    .st7 .combo{width:480px;}

}


.st-products {z-index:2; padding-bottom:80px;}
.st-products .head-row{width:100%; float:left; position:relative; padding-top:0px; margin-bottom:20px;}
.st-products .head-row h3{font-family: 'URW Geometric ExtraBold'; font-size:45px; color:var(--color1); margin-top:80px;}
.st-products .head-row h4{font-size:28px; font-family: 'URW Geometric Bold';}
.st-products .head-row a.nav-more{position:absolute; top:80px; right:15px; line-height:44px; height:42px; background:var(--color2); color:#fff; font-size:20px; padding: 0 30px; border-radius:10px; text-decoration:none; animation: zoom-in-zoom-out 1.5s ease-out infinite; }

@media (max-width:767px) {
    .st-products{}
    .st-products .head-row{position:initial}
    .st-products .head-row h3{font-size:35px; text-align:center; margin-top:50px;}
    .st-products .head-row h4{text-align:center; font-size: 23px;}
    .st-products .head-row a.nav-more{ top:initial; bottom:0px; right:50%; width:200px; margin-right:-100px; margin-bottom:-65px; text-align:center; height:40px; line-height:42px;}
}

@media (min-width:768px) and (max-width:991px) {
    .st-products{}
    .st-products .head-row{position:initial}
    .st-products .head-row h3{font-size:40px; text-align:center; margin-top:50px;}
    .st-products .head-row h4{text-align:center; font-size: 23px;}
    .st-products .head-row a.nav-more{ top:initial; bottom:0px; right:50%; width:200px; margin-right:-100px; margin-bottom:-65px; text-align:center; height:40px; line-height:42px;}
}

ul.list-products{width:100%; margin:0; padding:0; list-style:none;}
ul.list-products li{width:calc(25% - 20px); float:left; position:relative; border:1px solid rgba(0,0,0,.1); border-radius:16px; padding:10px 10px 70px 10px; margin:10px; transition:.3s }
ul.list-products li:hover{border-color:var(--color2); box-shadow: 0 2px 25px rgba(0,0,0,.1)}
ul.list-products li .sale-labe{position:absolute; z-index:2; background:#ba0300; right:0; top:20px; color:#fff; line-height:26px; height:26px; border-radius:13px 0 0 13px; font-weight:bold}
ul.list-products li .sale-labe:before{content:'Giảm:'; font-weight:normal; padding-left:10px; padding-right:3px;}
ul.list-products li .sale-labe:after{content: '₫'; padding-left:2px; padding-right:5px;}
ul.list-products li .percent-label {position: absolute; position: absolute; width: 50px; height: 50px; top: 15px; right: 10px;background: url(../img/bg-percent.svg) no-repeat center; background-size: auto 100%; z-index: 3; text-align: right;font-size: 17px; color: #000; padding-top: 20px;padding-right: 7px; font-family: 'URW Geometric ExtraBold';}
ul.list-products li .percent-label:before { content: 'Giảm'; font-family: 'URW Geometric Medium'; position:absolute;top: 6px;font-size: 13px;font-weight: normal; width: 100%; right: 7px; float: left;}
ul.list-products li .nav-img{width:100%; float:left; position:relative;}
ul.list-products li .nav-img img{width:100%;}
ul.list-products li .nav-name{width:100%; float:left; position:relative; text-decoration:none; text-align:center; margin-top:10px;}
ul.list-products li .nav-name h3{width:100%; float:left; padding: 0 15px; position:relative; font-size:19px; margin-bottom:7px; color:#000; transition:.3s; font-family: 'URW Geometric Medium';-webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; overflow: hidden; text-overflow: ellipsis;display: -webkit-box;}
ul.list-products li .nav-name:hover h3{color:#0c5c13}
ul.list-products li .wrap-price{width:100%; float:left; position:relative; display:flex; margin-top:5px; justify-content:center}
ul.list-products li .wrap-price .price-buy {font-size: 20px;color: #ba0300;position: relative;padding-right: 12px; font-family: 'URW Geometric ExtraBold';}
ul.list-products li .wrap-price .price-buy:after {content: '₫';position: absolute;right: 0;top: 1px; font-size: 16px;}
ul.list-products li .wrap-price .price-init {font-weight: normal;font-size: 17px;color: #000;margin: 4px 0 0 15px;position: relative;padding-right: 10px; font-family: 'URW Geometric Bold';}
ul.list-products li .wrap-price .price-init:before {content: '';width: 100%;height: 1px;background: #000;position: absolute;left: 0;top: 10px}
ul.list-products li .wrap-price .price-init:after {content: '₫';position: absolute;right: 0;top: 1px;font-size: 15px;}
ul.list-products li .nav-buy{width:calc(100% - 30px); background:var(--color1); line-height:44px; border-radius:7px; height:42px; text-transform:uppercase; text-align:center; display:block; float:left; color:#fff; font-size:16px; position:absolute; bottom:15px; left:15px; transition:.3s; text-decoration:none;  font-family: 'URW Geometric Bold'}
ul.list-products li .nav-buy:hover{background:var(--color2)}

@media(max-width:767px) {
    .section-products .section-container{width:100%!important; max-width:initial!important}
    ul.list-products{width: calc(100% + 10px); margin-left:-5px; }
    ul.list-products li{width:calc(50% - 10px); margin:5px ;}
    ul.list-products li .wrap-price{display:block; text-align:center;}
    ul.list-products li .wrap-price .price-buy{display:inline-block; margin: 0 10px;}
    ul.list-products li .wrap-price .price-init{clear:both; margin: 0 0 0 0; display:inline-block; margin:0 10px; } 
}

@media (min-width:768px) and (max-width:991px) {
    ul.list-products{}
    ul.list-products li{width:calc(33.3333333333333% - 20px);}
}

@media (min-width:992px) and (max-width:1199px) {
    ul.list-products li{width:calc(25% - 20px);}
}


.st-footer{background:var(--color1); margin-top:20px; float:left; padding-bottom:50px;}
.st-footer .col-left{width:calc(100% - 350px); float:left; position:relative; padding-left:170px; margin-top:50px; }
.st-footer .col-left .qr-code{position:absolute; top:15px; left:0; width:140px;}
.st-footer ul{width:100%; margin:0; padding:0; list-style:none; font-size:20px;}
.st-footer ul li{width:100%; color:#fff; margin-top:8px; padding-left:0px;}
.st-footer ul li.title{padding-left:0; font-family: 'URW Geometric Bold'; font-size:26px;}
.st-footer ul li a{color:#fff; text-decoration:none;}
.st-footer ul li b{font-family: 'URW Geometric Medium'; font-weight:500; padding-right:5px;}
.st-footer .col-right{width:350px; position:relative; float:left;}
.st-footer .col-right ul{margin-top:55px;}

@media (max-width:767px) {
    .st-footer{margin-top:100px;}
    .st-footer .col-left{width:100%; padding-left:0; padding-top:15px;}
    .st-footer .col-left .qr-code{bottom:100%; top:initial; margin-bottom:0px; box-shadow: 0 0 0 1px rgba(0,0,0,.02), 0 0 20px rgba(0,0,0,.2); border-radius:10px; }
    .st-footer .col-right{width:100%; padding-left:0; margin-top:0px;}
    .st-footer .col-right ul{margin-top:30px; font-size:19px;}
    .st-footer ul li.title{font-size:24px;}
}

@media (min-width:768px) and (max-width:991px) {
    .st-footer .col-left{width:100%;}
    .st-footer .col-right{width:100%; padding-left:170px; margin-top:0px;}
    .st-footer .col-right ul{margin-top:30px;}
   
}

.lineHori01{width:100%; height:15px; position:relative; float:left; display:block;}
.lineHori01:before{content:''; width:50%; position:absolute; bottom:100%; left:0; height:100%; background:#fff; border-radius:0 50px 0 0; }
.lineHori01:after{content:''; width:50%; position:absolute; top:0px; right:0; height:100%; background:var(--color2); border-radius:0 0 0 50px; }

.lineHori02{width:100%; height:15px; position:relative; float:left; display:block;}
.lineHori02:before{content:''; width:50%; position:absolute; bottom:0; left:0; height:100%; background:#fff; border-radius:0 0 50px 0; }
.lineHori02:after{content:''; width:50%; position:absolute; bottom:100%; right:0; height:100%; background:var(--color2); border-radius:50px 0 0 0; }

.st-map{ background:var(--color1); padding: 0 10px 0px 10px;}
.st-map iframe{width:100%; height:500px; margin:0!important; border-radius:15px;}