@font-face { font-family: 'Saira'; font-style: normal; font-weight: 300; src: url('../font/Saira/Saira-Light.ttf') format('truetype');}
@font-face { font-family: 'Saira'; font-style: normal; font-weight: 400; src: url('../font/Saira/Saira-Regular.ttf') format('truetype');}
@font-face { font-family: 'Saira'; font-style: normal; font-weight: 600; src: url('../font/Saira/Saira-Medium.ttf') format('truetype');}
@font-face { font-family: 'Saira'; font-style: normal; font-weight: 700; src: url('../font/Saira/Saira-Bold.ttf') format('truetype');}

@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 300; src: url('../font/Roboto/Roboto-Light.ttf') format('truetype');}
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; src: url('../font/Roboto/Roboto-Regular.ttf') format('truetype');}
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; src: url('../font/Roboto/Roboto-Bold.ttf') format('truetype');}
@font-face { font-family: 'SVN-Russell'; font-style: normal; font-weight: normal; src: url('../font/SVN-Russell.ttf') format('truetype');}

body { padding: 0px; margin: 0px; font-family: 'Saira', Helvetica, Arial,sans-senif; font-size: 13px; line-height: 1.5; background: #fff; }
body.asd { position: relative; overflow-x: hidden; }
body.asd div.w-header{z-index:8 !important}
body.asd div.w-menu{z-index:10 !important}
body.asd:after { position: absolute; content: ''; width: 100%; height: 100%; background: rgba(0,0,0,.8); left: 0; top: 0; z-index: 9; }
a#noop-top { display: none; position: fixed; width: 40px; height: 40px; background: #fff; font-size: 20px; color: #0e9551; text-align: center; line-height: 40px; cursor: pointer; border: 1px solid #0e9551; border-radius: 3px; transition: all .3s; right: 25px; bottom: 25px; z-index: 99999999999; }
a#noop-top:hover { background: #0e9551; color: #fff; }
.content12 {width: 1200px;margin: auto;position: relative;/* display: flex; *//* justify-content: space-between; */}
.sale {position: absolute;padding: 0 5px;background: #ED1C24;left: 0;top: 0;z-index: 5;color: #fff;}

/*CSS Header*/
div.w-header {position: relative;z-index: 101;background: #fff;}
div.t-header { background: #f5f5f5; color: #000; font-weight: bold; }
div.t-header .content12 { min-height: 40px; padding: 5px 0; line-height: 25px; }
div.address-header { padding-left: 25px; background: url('../images/icon1.png') no-repeat left center; float: left; }
.header-righttt { float: right; }
.email-header { float: left; }
.social-header { float: left; }
span.email-header { padding-left: 25px; background: url('../images/icon2.png') no-repeat left center; position: relative; }
span.email-header:after { position: absolute; content: ''; width: 1px; height: 7px; background: #7aabe4; left: 100%; top: 50%; transform: translateY(-50%); }
a.i-social:hover { background: #2770c5; border-radius: 3px; }
div.b-header { display: flex; justify-content: space-between; padding: 40px 0; }
form#frm-search input { display: block; width: 405px; float: left; height: 45px; border: 1px solid #eeeeee; border-right: none; padding-left: 10px; }
form#frm-search button {display: block;width: 65px;float: left;height: 45px;border: none;background: url('../images/icon3.png') no-repeat center #0e9551;position: relative;position: absolute;right: 0;}
form#frm-search button:before { position: absolute; content: ''; width: 7px; height: 10px; background: url('../images/icon4.png') no-repeat; right: 100%; top: 50%; transform: translateY(-50%); text-align: center; }
div.w-support { padding-left: 60px; background: url('../images/icon5.png') no-repeat left center; }
div.w-support b { display: block; font-weight: normal; font-size: 15px; color: #333333; }
div.w-support span { font-size: 20px; color: #ed1c24; }
div.w-cart a { display: block; padding-left: 50px; background: url('../images/icon18.png') no-repeat left center; font-size: 13px; color: #333; }
div.w-cart a b { display: block; font-size: 15px; color: #333333; }

/*CSS Menu*/
div.w-menu {background: #0e9551;position: relative;z-index: 99;}
div.w-menu > div{display:flex;justify-content:space-between;}
div.w-menu-fixed { position: fixed!important; width: 100%; left: 0px; top: 0px; bottom: initial; z-index: 9999999; -webkit-animation: fadeInDown .5s; animation: fadeInDown .5s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }
div.w-category {position: relative;width: 285px;/* float: left; */background: #0d8649;}
div.w-category span.title-category { font-size: 18px; color: #fff; text-transform: uppercase; background: #0d8649; line-height: 50px; }
div.w-category span.title-category .l-title-category { width: 50px; height: 50px; float: left; margin-right: 10px; background: url('../images/icon6.png') no-repeat center #0c7f45; }
div.c-category { position: absolute; width: 100%; left: 0px; top: 100%; z-index: 999; background: #fff; }
ul.o-category { height: 440px; overflow: auto; }
ul.o-category::-webkit-scrollbar { width: 0px; height: 5px;}
ul.o-category::-webkit-scrollbar-button { width: 0px; height: 0px; }
ul.o-category::-webkit-scrollbar-track { background-color: #c3c3c3;}
ul.o-category::-webkit-scrollbar-track-piece { background-color: #ffffff;}
ul.o-category::-webkit-scrollbar-thumb { height: 50px; background-color: #c3c3c3; border-radius: 3px;}
ul.o-category::-webkit-scrollbar-corner { background-color: #ffffff;}
ul.o-category::-webkit-resizer { background-color: #666;}
ul.o-category > li { padding-left: 20px; padding-right: 10px; border-bottom: 1px dotted #efefef; background: linear-gradient(180deg, #8bca9a 0, #0E9551 50%); background: -ms-linear-gradient(180deg, #8bca9a 0, #0E9551 50%); }
ul.o-category > li > a { display: block; padding: 12px 0px 11.5px 0px; font-size: 15px; color: #fff; }
ul.o-category > li > a > img { margin-right: 10px; }
ul.o-category > li > ul { display: none; position: absolute; width: 645px; height: 100%; overflow: auto; background: #fff; left: 100%; top: 0px; z-index: 998; }
ul.o-category > li:hover > ul { display: block; }
ul.o-category > li > ul { padding: 15px; box-shadow: 0 0 3px #e2e0e0; }
ul.o-category > li > ul > li { width: 33.3%; float: left; }
ul.o-category > li > ul > li:nth-child(3n+1) { clear: both; }
ul.o-category > li > ul > li > div > a { display: block; font-weight: bold; font-size: 14px; color: #555; padding: 3px 0px; }
ul.o-category > li > ul > li > ul > li > a { display: block; color: #555; padding: 3px 10px; }
ul.o-category > li > ul > li > ul { display: none; }
ul.o-category > li > ul > li > ul > li > ul > li > a { padding: 0 10px; }
ul.o-category a:hover { color: #0e9551; }
ul.o-category > li:hover { background: #fff; }
ul.o-category > li:hover > a { color: #555; }
div.c-category-inner { display: none; }
ul.c-menu {display: flex;justify-content: space-around;width: 915px;/* float: left; */}
ul.c-menu li a { display: block; font-size: 15px; color: #fff; text-transform: capitalize; text-align: center; line-height: 50px; }
.w-toggle { position: relative; display: flex; }
.w-toggle a { width: calc(100% - 20px); }
.w-toggle i { width: 20px; color: #0e9551; padding-top: 6px; cursor: pointer; }

.mm-listitem { background: linear-gradient(180deg, #8bca9a 0, #0E9551 50%); background: -ms-linear-gradient(180deg, #8bca9a 0, #0E9551 50%); }
.mm-listitem > a { color: #fff!important; }

/*CSS Slider*/
div.w-slider { background: #f5f5f5; }
div.w-slider .content12 { display: grid; grid-column-gap: 10px; grid-template-columns: 285px 905px; }
div.r-slider { padding: 10px 0px; }

/*CSS Index*/
div.s-banner { margin: 30px 0px; }
div.s-banner .w-img { position: relative; }
div.s-banner h3 { position: absolute; width: 100%; left: 0px; top: 50%; transform: translateY(-50%); background: url('../images/icon8.png') no-repeat center; }
div.s-banner h3 a { display: block; font-size: 30px; color: #fff; text-align: center; text-transform: uppercase; line-height: 75px; white-space: normal; }

h3.title-web { text-align: center; padding-bottom: 25px; background: url('../images/icon19.png') no-repeat bottom center; margin-bottom: 20px; }
h3.title-web span { display: block; font-family: 'SVN-Russell'; font-size: 30px; color: #333; text-transform: uppercase; }
h3.title-web p { font-size: 15px; color: #999; padding-top: 5px; }

h3.title-list { padding-bottom: 3px; border-bottom: 1px solid #0e9551; margin-bottom: 30px; position: relative; }
h3.title-list:after { position: absolute; content: ''; width: 100%; height: 3px; background: #0e9551; left: 0px; bottom: 3px; z-index: 6; }
h3.title-list span { display: block; font-size: 20px; color: #fff; text-transform: uppercase; min-width: 240px; background: #0e9551; line-height: 44px; padding-left: 20px; position: relative; }
h3.title-list span:after { position: absolute; content: ''; width: 50px; height: 44px; background: url('../images/icon13.png') no-repeat; left: 100%; top: 0; z-index: 7; }
h3.title-list a.more { display: block; padding-left: 10px; background: url('../images/icon12.png') no-repeat left center; font-family: Arial; font-size: 13px; font-weight: bold; color: #ed1c24; }

div.w-list { margin-bottom: 50px; }
div.i-product { width: 275px; margin: auto; margin-top: 4px; background: #f5f5f5; border: 1px solid #ebebeb; padding: 5px; position: relative; }
div.i-product img.img-hot { position: absolute; right: -4px; top: -4px; z-index: 9; }
div.i-product .w-img { border: 1px solid #ebebeb; background: #fff; }
div.i-product .a-product { position: absolute; right: 5px; top: 5px; opacity: 0; background: transparent; cursor: pointer; border: none; }
div.i-product .a-product img { width: 50px; }
div.i-product:hover .a-product { opacity: 1; -webkit-animation: fadeIn .5s; animation: fadeIn .5s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }
div.i-product .info-product { padding: 20px 0px 15px; }
div.i-product .info-product h3 a { display: block; font-size: 15px; color: #333; text-align: center; margin-bottom: 5px;height: 38px;
    overflow: hidden; }
div.i-product .info-product .w-price-product { display: grid; grid-template-columns: 50% 50%; }
div.i-product .info-product .w-price-product .price-product { font-size: 15px; color: #555; text-align: center; }
div.i-product .info-product .w-price-product .price-product b { font-weight: normal; color: #ed1c24; }
div.i-product .info-product .w-price-product .amount-product { font-size: 15px; color: #0e9551; text-align: center; }
div.i-product .info-product .w-price-product .amount-product b { font-weight: normal; color: #ed1c24; }
div.i-product .info-product .w-price-product .amount-product strong { font-weight: normal; color: #555; }

div.s-quangcao { margin: 50px auto; }

div.w-dichvu { background: url('../images/bg1.png') no-repeat; background-size: cover; padding: 50px 0px; }
div.w-dichvu h3.title-web span { color: #fff; }
div.w-dichvu h3.title-web p { color: #cde4d8; }
div.i-dichvu { max-width: 375px; margin: auto; min-height: 450px; background: #f5f5f5; position: relative; }
div.i-dichvu .info-dichvu { width: calc(100% - 40px); position: absolute; left: 20px; top: 220px; background: #fff; padding: 20px; border-bottom: 5px solid #e6e6e6; }
div.i-dichvu .info-dichvu h3 a { display: block; font-weight: 600; font-size: 17px; color: #333; text-align: center; padding-bottom: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; }
div.i-dichvu .info-dichvu h3 a:after { position: absolute; content: ''; width: 50px; height: 2px; background: #0e9551; left: 50%; bottom: 0px; transform: translateX(-50%); }
div.i-dichvu .info-dichvu p.des-dichvu { font-size: 13px; color: #555555; margin: 20px 0px; text-align: center; line-height: 20px; }
div.i-dichvu .info-dichvu a.detail-dichvu { display: block; width: 110px; margin: auto; font-size: 13px; color: #fff; text-align: center; line-height: 35px; background: #0e9551; }

div.w-bottom { display: grid; grid-template-columns: 580px 580px; grid-column-gap: 40px; padding: 40px 0px; }
h3.title-bottom { font-size: 30px; color: #333; text-transform: uppercase; padding-bottom: 10px; border-bottom: 1px solid #e2e2e2; margin-bottom: 20px; position: relative; }
h3.title-bottom:before { position: absolute; content: ''; width: 105px; height: 4px; background: #0e9551; left: 0px; bottom: 0px; }

div.i-tintuc { display: grid; grid-template-columns: 160px 400px; grid-column-gap: 20px; padding: 19px 0px; border-bottom: 1px solid #e2e2e2; }
div.i-tintuc .info-tintuc h3 a { display: block; font-weight: 600; font-size: 16px; color: #0d6b00; }
div.i-tintuc .info-tintuc .date-tintuc { font-size: 13px; color: #555; }
div.i-tintuc .info-tintuc .des-tintuc { font-size: 13px; color: #555; text-align: justify; line-height: 20px; }

div.r-bottom .w-img img { height: 400px; }
div.r-bottom select { height: 40px; }

div.w-partner { margin: 20px auto; }
div.w-partner .w-img { max-width: 175px; margin: auto; }
div.w-partner .w-img img { filter: gray; -webkit-filter: grayscale(1); }
div.w-partner .w-img:hover img { filter: initial; -webkit-filter: grayscale(0); }
/*CSS Footer*/
div.t-footer { background: #f5f5f5; padding: 40px 0px;  }
div.t-footer .content12 { display: grid; grid-template-columns: 235px 295px 360px auto; grid-column-gap: 10px; }
h3.title-footer { font-family: Roboto; font-size: 16px; font-weight: bold; color: #555; text-transform: uppercase; padding-bottom: 10px; margin-bottom: 10px; position: relative; }
h3.title-footer:before { position: absolute; content: ''; width: 50px; height: 2px; background: #0e9551; left: 0px; bottom: 0px; }
div.t-footer .i-footer:nth-child(3) { padding-right: 90px; }
div.i-footer a { display: block; font-size: 13px; color: #555; text-transform: capitalize; padding: 5px 0px; }
div.i-footer b { font-size: 13px; color: #555; line-height: 20px; }
form#frmNewsletter { margin: 10px 0px; }
form#frmNewsletter input { display: block; width: 100%; height: 35px; padding-left: 10px; background: url('../images/icon17.png') no-repeat 95% 6px #dcdcdc; border: none; }
form#frmNewsletter button { display: block; width: 70px; font-size: 13px; color: #fff; text-align: center; text-transform: uppercase; background: #ed1c24; margin-top: 10px; border: none; line-height: 30px; }
div.b-footer { background: #fff; display: grid; grid-template-columns: 360px 650px 190px; padding: 30px 0px; }
div.w-thongke table tr { border-bottom: 1px solid #d6d6d6; }
div.w-thongke table tr:last-child { border-bottom: none; }
div.w-thongke table td { padding: 10px 5px; }
div.w-copyright { background: #0e9551; padding: 20px 0px; text-align: center; font-size: 13px; color: #4cbb83; }
div.w-copyright span { text-transform: uppercase; color: #fff; }
.map_canvas_contact iframe{width:100%;}
/*CSS Product*/
div.grid-product { display: grid; grid-template-columns: 275px 275px 275px 275px; grid-column-gap: 35px; grid-row-gap: 35px; }
div.grid-product .i-product { width: auto; }

/*CSS Cart*/
div.w_left_cart { width: 100%; float: left; }
div.w_right_cart { width: 250px; float: right; margin-top: 15px; }
div.w_thongtindonhang { width: 250px; float: right; }
div.w_thongtinchung { width: 250px; float: right; margin: 15px 20px 15px 0px; }
div.box { box-shadow: 0 2px 4px rgba(0,0,0,0.3); border-radius: 5px; background: #fff; }
table.tbl_cart { width: 100%; max-width: 100%; border-collapse: collapse; border-spacing: 0; border-color: grey; }
table.tbl_cart i { cursor: pointer; color: #999; }
i.fa-trash-alt { color: #f00!important; }
table.tbl_cart i:hover { color: #000; }
table.tbl_cart thead tr th { border-bottom: 1px solid #d2d2d2; color: #777777; font-size: 13px; font-weight: 400; padding: 15px 20px; text-align: left; }
table.tbl_cart tbody tr td { padding: 15px 20px; line-height: 1.428571429; vertical-align: top; font-size: 14px; }
table.tbl_cart td.image { padding-right: 0px; }
table.tbl_cart td.unit { font-weight: bold; }
table.tbl_cart td.quantity input[type="number"] { width: 40px; height: 30px; border: 1px solid #ccc; padding-left: 5px; }
table.tbl_cart tr.sep-row td { padding: 0px 20px; }
table.tbl_cart tr.sep-row td hr { border: 0; border-top: 1px solid #eeeeee; margin: 0px; }
table.tbl_cart tbody tr td.action { padding-top: 18px; }
div.box_footer { padding: 10px; background: #eee; }
.btn_cart { display: block; float: right; border-width: 1px; padding: 5px; font-size: 20px; border-bottom: 4px solid #487513; color: #fff; font-weight: 700; text-shadow: 0 1px 1px rgba(99, 165, 15, 0.75); border-radius: 4px; background-color: #71be0f; border-color: #63a60d; cursor: pointer; text-transform: uppercase; min-width: 200px; text-align: center; }
.btn_cart:hover { background-color: #7fd611; border-color: #79cc10; }
a.continue_pay { display: block; float: left; color: #f00; font-size: 14px; line-height: 45px; }
span.badge { min-width: 10px; padding: 3px 7px; font-size: 12px; font-weight: bold; color: #ffffff; vertical-align: middle; text-align: center; background-color: #777777; border-radius: 10px; }
div.box__header{ border-bottom: 1px solid #d2d2d2; padding: 13px 20px; }
h2.box__title { display: inline-block; margin: 0; color: #000000; font-size: 15px; font-weight: 500; line-height: 22px; }
div.box__body { padding: 20px; position: relative; }
ul.order-summary li { padding: 5px 0; }
.order-summary li .k { float: left; color: #999999; font-size: 13px; }
.order-summary li .v { float: right; }
.order-summary li.sep { margin: 10px 0; padding: 0; height: 1px; background-color: #d2d2d2; }
.order-summary li.total .v { color: #ed1c24; font-size: 20px; font-weight: 500; }
.order-summary li.total .k { color: #000; font-size: 15px; margin-top: 7px; }
.item_tt { width: 49%; float: left; margin-right: 2%; margin-bottom: 15px; }
.item_tt:nth-child(2n) { margin-right: 0px; }
.item_tt:nth-child(2n+1) { clear: both; }
.item_tt label { display: block; color: #999999; font-weight: 400; font-size: 13px; margin-bottom: 5px; }
.item_tt input, .item_tt select, .item_tt textarea { display: block; width: 100%; height: 45px; border: 1px solid #cccccc; background-color: #ffffff; color: #555555; line-height: 1.3333333; padding: 10px 16px; border-radius: 5px; }
div.w_pttt { width: calc(100% - 260px); float: left; }
div.w_pttt label { display: block; font-size: 15px; color: #000; margin-bottom: 5px; }
span.item_pttt { display: block; width: 50%; float: left; text-align: center; background: #f5f5f5; padding: 10px 0px; font-size: 14px; color: #555; cursor: pointer; }
span.item_pttt.active { background: #d2d2d2; }
div.content_pttt { padding: 10px; background: #fbfbfb; }
div.w_pttt div.box__body { padding: 5px; }
div.content_pttt .hidden { display: none; }
div.content_pttt .active { display: block; }
ul.pagination { justify-content: center; align-items: center; }

#frm-search{position: relative;}
/*Search auto load*/
.res-autosearch {position: absolute;top: 42px;left: 0px;width: 100%;z-index: 999999999;}
.result-autosearch { position: relative; background: #fff; padding-bottom: 39px; text-align: left; }
.list-result-autosearch { max-height: 300px; overflow-y: auto; overflow-x: hidden; border: 1px solid #eae7e7; border-bottom: 0px; }
.list-result-autosearch::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); background-color: #F5F5F5; }
.list-result-autosearch::-webkit-scrollbar { width: 6px; background-color: #F5F5F5; }
.list-result-autosearch::-webkit-scrollbar-thumb { background-color: #000000; }
.price-old-search-product { text-decoration: line-through; margin-left: 10px; }
.search-product {display: block;color: #333 !important;border-bottom: 1px solid #eae7e7;border-right: 1px solid #eae7e7;padding: 10px;position: relative;display: inline-block;display: flex;}
.img-search-product {float: left;margin-right: 10px;width: 40px;background: #fff;text-align: center;}
.img-search-product > span{position:absolute;right: 15px;color:#f00;font-weight:bold;bottom: 11px;display: none;}
.img-search-product img { border: 1px solid #eae7e7; }
.info-search-product {/* float: left; */width: calc(100% - 50px);}
.title-search-product.text-hide { -webkit-line-clamp: 2; }
.text-hide { overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 3; }
.title-search-product { font-size: 12px; margin: 0px; line-height: 18px; margin-bottom: 1px; font-family: 'Roboto'; color: #000; font-weight: 700; font-size: 14px; }
.price-search-product span { display: inline-block; }
.price-new-search-product { font-size: 15px; color: var(--color-red); font-family: 'Roboto'; font-weight: 700 }
.info-autosearch { position: absolute; bottom: 5px; display: flex; justify-content: space-between; width: 100%; padding-left: 10px; padding-right: 30px; }
.info-autosearch p{display: inline-block;margin-bottom: 0}
.info-autosearch p b{color: #f00}
.close-autosearch{cursor: pointer;}

