@charset "utf-8";
html, body, h1, h2, h3, h4, h5, h6, p, a, em, img, small, strike, strong, sup, sub, b, u, i, center, ul, ol, li, caption, form, fieldset, legend, input, button, textarea, select, label, iframe, figcaption, figure, menu, nav, section{margin: 0; padding: 0; vertical-align: baseline; border: 0; outline: 0; list-style: none}
body, html{font-family: Arial; font-size:13px; line-height: 24px; background: #fff}
html{-webkit-text-size-adjust:none}
h1{ text-indent: -9999px; height: 0 }
a{ text-decoration:none; color: #0070bb}
input{-webkit-appearance: none;}
.resolution{ height: 10px; background: #090 }
@font-face{ font-family: aa; src: url('../fonts/font-times-new-roman.ttf'); font-style: normal }
/* CSS Chung */
.main{ clear:both; width:98%; max-width: 1100px; margin:0 auto; position:relative} .main::after{ content:''; display:block; clear:both}
.leftcol{ width:20%; float:left; margin-top: 20px} .content{ width:78%; float:right; margin-top: 20px}
.hide{ display: none !important }
.clr{ clear: both; }
.hsp{color: #114a82; text-transform: uppercase; margin-bottom: 25px; font-family: aa; font-size: 36px; position: relative; display: inline-block; padding-bottom: 10px; border-bottom: 3px solid #114a82; width: auto; margin: 0 auto; text-align: center; margin-bottom: 15px; margin-top: 45px; max-width: 100% !important}
h2.titlechupanh{text-align:center; text-transform:uppercase; font-size:34px; color:#104982; margin:30px 0;}
h2.tieudetin{text-align:center; text-transform:uppercase; font-size:34px; color:#104982; margin:30px 0; line-height:37px;}
.clr10{ clear: both; height: 10px } .clr20{ clear: both; height: 20px }
img{line-height: 0 !important; vertical-align: middle; max-width: 100%; height: auto;}
.breadcrumb{ margin:10px 0; } .breadcrumb a{ color: #000 } .breadcrumb a:hover{ color: #0070bb }
/* CSS Tmp */
a.tt{ color: #0070bb } a.tt:hover{ color: #f30 }
img.bannercat{ width: 100% }
h2.title{ text-transform: uppercase;color:#09f; margin-bottom: 20px; font-family: Arial }

.rtop{ padding: 10px 0; background: #191919 }
.rtop .left{ width: 45%; float: left;color: #fff }
.rtop .left a{color: #fff}
.rtop .right{ width: 45%; float: right; text-align: right; color: #fff }

.chay{ top: 0 !important; position: fixed; z-index: 100 }
.dung{ z-index: 9999; position: absolute; top: auto }

.or{text-align: center; font-weight: bold; color: #333; font-size: 18px}
.leftct img{ max-width: 100%; height: auto; }

.goi{ text-align: center; padding: 10px 20px; background: #b71c1f; box-sizing: border-box; font-size: 18px; color: #fff; margin-bottom: 15px; cursor: pointer; border: 0px #666 solid;  margin: 15px; font-weight: bold; text-transform: capitalize }
.hoiinfo{ text-align: center; padding: 10px 20px; background: #b71c1f; box-sizing: border-box; font-size: 18px; color: #fff; margin-bottom: 15px; cursor: pointer; border: 0px #666 solid; margin: 15px; font-weight: bold; text-transform: capitalize }
.goi a{ display: block; padding: 5px 0; font-size: 16px; font-weight: bold; color: #fff  }

.rightct{ width: 27%; float: right; }
.ttct{ padding: 10px 0; font-size: 20px; color: #333 }
.leftadv{ border: 1px solid #ddd; background: #fff; box-sizing: border-box; border-radius: 5px }
.leftadv .title{ color: #fff; margin-bottom: 10px; text-align: center; background: #3a3834; border-radius: 2px; padding: 10px 20px; font-size: 16px; font-weight: 600; text-transform: capitalize; font-family: Arial }
.timfilter{display:block; margin: 0 auto; padding: 5px 10px; text-align: center; background: #333; color: #fff; width: 150px; margin-top: 10px; cursor: pointer; font-size: 16px; text-transform: capitalize}
.chonloai{ margin-top: 15px }
.boxfilterrelative .timfilter{padding: 8px 10px; width: 10%; float: right; margin-top: 0}
.chonloai::after{ content: ''; display: block; clear: both}
.chonloai select{ width: 100%; padding: 12px 5px; box-sizing: border-box; background: #fff; border-radius: 5px }
.regfrom{ width: 100% }
.regform input{ padding:1%; width: 98%; border: 1px solid #ccc; margin-top:5px; margin-bottom: 20px }
#SubmitReg{ background: #f60; color: #fff; text-transform: uppercase; font-weight: bold; cursor: pointer; width: 100% }
#SubmitReg:hover{ background: #090 }
.mailletter{ position: relative}
.mailletter input#txtEmail,.mailletter textarea{ padding: 10px 3%; width: 100%; box-sizing: border-box; margin-bottom:7px }
.mailletter input#txtDienthoai{ padding: 10px 3%; width: 100%; box-sizing: border-box; margin-bottom:7px  }
.mailletter input#txtTen{ padding: 10px 3%; width: 100%; box-sizing: border-box; margin-bottom:7px  }
.mailletter input#txtDiachi{ padding: 10px 3%; width: 100%; box-sizing: border-box; margin-bottom:7px  }
.mailletter input#txtNoidung{ padding: 10px 3%; width: 100%; box-sizing: border-box; margin-bottom:7px  }
.mailletter input#btnSubmit{ display: block;padding:10px 0; background: #F9A11B; color: #fff; cursor: pointer; width: 20%; text-align: center; float: right; }
.mailletter input#btnSubmit:hover{ background: #333; transition: 1s }
a.inactive{ padding: 10px 20px; border: 1px solid #ccc; border-radius: 2px; margin-right: 5px; cursor: pointer; margin-top: 20px }
a.onactive{ padding: 10px 20px; border: 1px solid #ccc; background: #F7921D; color:#fff; border-radius: 2px; margin-right: 5px; cursor: pointer; margin-top: 20px; background: #0070bb !important }
/* End CSS Tmp */
.bannercat{ border: 0; max-width: 100%; margin-bottom: 20px }
.detailcat{ text-align: justify; margin-bottom: 20px }

span.lang{ cursor: pointer; }
p.price{ font-size: 24px; color:#f60; }

.rowtexttop{ color: #fff; overflow: hidden; margin:10px 0; }
.rowtexttop h2{ text-transform: uppercase; color: #fff; margin-bottom: 15px; font-size: 34px;  font-family: Arial }
.texttop li{ width: 48%;background: #F3F3F9; float: left; color:#515666; text-align: center; box-shadow: 0px 4px 6px rgb(50 50 50 / 32%); border-radius: 6px; margin: 1%; padding: 10px; box-sizing: border-box; overflow: hidden;}
.texttop li:hover{transition: 0.2s;  box-shadow: 0px 4px 12px rgb(50 50 50 / 107%)}
.texttop li:hover img{ transform: scale(1.05); transition: 1s; }
.texttop li a{ height: 300px; color: #040503; text-transform: uppercase; font-weight: bold; font-size: 16px }
.texttop li a img{ width: 100%; height: 100%; object-fit: cover; }
.texttop li a p{ display: block; padding: 10px 0; background: #F8B231;  }

/* CSS filter */
ul.filter li{ background:url(../svg/nocheck.svg) left center no-repeat; background-size:18px; outline: 0; border: 0; cursor: pointer; padding-left:24px; margin:10px 0;}
ul.filter li.checked {  background:url(../svg/dacheck.svg) left center no-repeat; background-size:18px; font-weight: bold}
.setphantrang{text-align: center}
.setphantrang > a{background: #fff;
    font-size: 16px;
    font-weight: bold;
    border: 1px #d8d8d8 solid}
/* Select Box */
.selectbox {border: 1px solid#eee; border-radius: 5px; max-width: 100%; background: #fff url(../svg/drop-arrow.svg) right 10px center no-repeat;box-sizing: border-box; background-size: 10px; border:0.1px solid #e5e5f8; border-radius: 2px; font-size: 13px; width: 100%; z-index: 9999 !important; margin-top: 15px; color: #515666; box-shadow: 1px 1px 2px #ccc; min-height: 45px}
.selectbox div{ position: absolute; z-index: 9999 !important; background: #fff; width: 100%; margin-left:-1px; top:0;}
.selectbox:hover{ color: #F9A11B; transition: 0.5s }
.selectbox p{ padding:8px 0 8px 15px; cursor: pointer}
.selectbox div li { display: none; padding: 5px; cursor: pointer; border: 0.1px solid #eee; border-top:none; z-index: 9999}
.selectbox div li:hover { background-color:#eee}
.selectbox div li:nth-child(odd) { background-color:#f6f6f6}
.selectbox div li:nth-child(odd):hover { background-color:#eee }
.selectbox div li.lv2{ padding-left: 42px; background-image: url(../images/tree.png); background-repeat: no-repeat; background-position: left center}
.selectbox div li.lv3{ padding-left: 80px; background-image: url(../images/tree-lv3.png); background-repeat: no-repeat; background-position: left 35px center}
.selectbox .maxheight{ max-height: 260px; overflow: hidden; overflow-y: scroll; }
.selectbox .maxheightx{ max-height: 488px; overflow: hidden; overflow-y: scroll; }

.offthuoctinh{ display: none }
.onthuoctinh{ display: block; }

.leftdetail{ width: 75%; float: left; }
.rightdetail{ width: 22%; float: right }

.boxfilterapsolute{ position: absolute;box-shadow: 0px 0px 18px #000; width:30%; bottom:0; background: rgba(255,255,255,0.5); z-index: 100; padding: 20px 40px; right: 0; margin: 0 auto; box-sizing: border-box; height: auto !important; margin: 6%; border-radius: 0% 0% 1% 1%; margin: 7%; margin-right: 4%} 
.boxfilterapsolute::after{ content: ''; display: block; clear: both; height: 20px }
.boxfilterrelative{ position: relative; top: 0; left: 0; padding: 20px; box-sizing: border-box; background:#fff; }.boxfilterrelative::after{ content: ''; display: block; clear: both; height: 20px }
.boxfilterrelative .rowfilter{ width: 12%; margin: 0 1%; float: left; box-sizing: border-box; }
.boxfilterrelative .rowfilter .selectbox{ border: 1px solid#eee; border-radius: 5px; background: #eee url(../svg/drop-arrow.svg) right 10px center no-repeat; background-size:10px; margin: 0  }
.boxfilterrelative .chonloai{ width: 14.66%; margin:0 1%; float: left; box-sizing: border-box; }
.rowfilter{ position: relative; margin-bottom: 10px; width: 100% }
.rowfilter strong{ color: #0070BB }
.boxfilterapsolute::before{ content: ""; position: absolute; top: 0; left: 0; width: 0; height: 0; border-top: 0px solid transparent; border-bottom: 45px solid transparent; border-left: 45px solid rgba(34,34,34,0.9) }
.boxfilterapsolute::after { content: ""; position: absolute; top: 0; right: 0; width: 0; height: 0; border-top: 0px solid transparent; border-bottom: 45px solid transparent; border-right: 45px solid rgba(34,34,34,0.9) }
/* Kw_header */
.kw_header{ padding:0; position: relative;background: rgba(0, 0, 0, 0.46) none repeat scroll 0 0; top: 0; left: 0; width: 100%; z-index: 100; padding: 20px 0} .kw_headerapsolute::after{ content: ''; display: block; clear: both; }
.kw_header a.logo{ float: left; text-align: left; display: block; width: 16%; float: left; } .kw_headerapsolute a.logo img{ max-width: 100%; height: auto; }
.kw_header .menu{ width: 65%; float: right; }

.kw_header .hotline{ float: right; text-align: right; margin-top: 30px; color:#666; font-size: 12px }
.kw_header .hotline a{ padding:10px 0; background: url(../images/telephone.png) left center no-repeat; background-size: 16px; color: #EF4836; cursor: pointer; padding-left: 30px; font-size: 23px; font-weight: bold; font-family: Verdana}

.khungcon{ margin-bottom: 50px }
.kw_headerrelative{ position: relative; top: 0; left: 0; background: #333; padding: 10px 0 }
.kw_headerrelative a.logo{ float: left; text-align: left; display: block; width:16%; float: left; } .kw_headerapsolute a.logo img{ margin-top: -7px; height: auto; max-height: 75px }
.kw_headerrelative .menu{ width: 65%; float: right; }
.khung{ position: relative}

.wrap_slider{ position: relative; }
.kw_menu{ background: #f7f7f7; height: 60px; width: 100%; position: relative; margin-top:10px; }
.body #keyword{ width: 93.5%; padding: 4% 2%; border: 1px #ccc solid; padding-left: 4%; margin: 6px 0px; margin-bottom: 10px }
.nonebody #keyword{ width: 94%; padding: 7% 2%; border: 1px #eee solid; min-height: 20px; border-radius: 3px; padding-left: 9% }
/* Menutop */
#MobileMenu{ display: none; width: 96%; height: 16px; background: #005595 url(../images/threeline.png) left 20px center no-repeat; color: #fff; padding:13px 2%; z-index: 444; cursor: pointer; text-indent: -9999px}
#menutop{ position:relative; z-index: 333}
#menutop span{ display: none }
#menutop li img{ max-height: 70px }
#menutop ul{box-shadow: 0px 0px 12px 1px #ccc; position:relative; text-align: center; display: flex; align-items: center; justify-content: center; border-radius: 10px; background: rgba(255,255,255,0.75);}
#menutop ul a{ display:block; padding:13px 12px; color: #024679; font-weight: bold;
    font-family: "Roboto", sans-serif; font-size: 16px; position: relative;}
#menutop ul li:before{ position: absolute; content: ''; height: 20px; width: 2px; right: 0; top: 29%; background: #024679 }
#menutop ul > li{ position:relative; text-transform: uppercase; border-radius: 2px; transition: all 0.3s ease-in-out; display: inline-block;}
#menutop ul ul{ display:none; position:absolute; top:100%; left:0; background:#fff; padding:0; box-shadow: 1px 1px 2px #ccc; max-height:350px;overflow-y:auto;}
#menutop ul ul li{ float:none; margin-top:1px; margin-right: 0; border-radius: 0; text-transform: none; display: block; border-bottom: 1px solid#ccc}
#menutop ul ul a { line-height:100%; padding:10px 15px; color: #333 !important}
#menutop ul ul li:hover a {color: #F9A11B !important}
#menutop ul ul ul { top:0; left:100%}
#menutop ul li:hover > ul{ display:block}
#menutop ul li:hover a{ color: #A70E14 }
#menutop ul li:last-child:before{ display: none; }
#menutop ul li.logongang:before{ position: absolute; content: ''; height: 20px; width: 2px; right: 0; top: 39%; background:#024679 }
#menutop ul li li:before{ display: none; }
#menutop ul li li a{ text-align: left; }
.menut{ background: url(../images/head.png) center no-repeat; background-size: cover; padding: 15px 0 }

/* Leftmenu */
.category{ margin-top:5px; margin-bottom: 10px; text-transform: uppercase; font-weight: bold; border-top:1px solid #22a7f0; padding-top: 5px }
.category h3{ border-top: 5px solid #22a7f0; display: inline-block; padding-top: 5px; margin-top: -8px}
.firstcat{ text-transform: uppercase; font-weight: bold; text-align: center; outline: 2px solid #22a7f0; padding:3%; width: 94%; margin:10px 0; background: #fff; cursor: pointer;}

.leftmenu{ width: 100%; margin-bottom: 16px}
.leftmenu li{ background: rgba(255,255,255,0.9) url(../images/star.svg) left 5px center no-repeat; background-size: 12px; cursor: pointer; position: relative; padding:8px 0; margin-bottom: 1px; padding-left: 25px; transition: 1s }
.leftmenu li > ul{ position: absolute; left: 100%; width: 250px; display: none; z-index: 99999 }
.leftmenu li:hover{ background: #22a7f0 url(../images/star-hover.svg) left 5px center no-repeat; background-size: 12px;  }
.leftmenu li:hover > ul{ display: block; top:0; }
.leftmenu li.checked{ background: url(../images/start_i.png) left center no-repeat; font-weight: bold}
.leftmenu li a{ color: #000 }

.leftmenu span{ cursor: pointer; color: #0070bb } .leftmenu span:hover{ color: #f60 }
.leftmenu li.on{ display: none; }

.xemthem{ display:block; margin: 0 auto;padding: 10px 30px;text-align: center; background: #11549f; width: 150px; color: #fff; font-size: 18px; text-transform: capitalize; margin-top: 15px }

.kw_search{ float: right; position: relative; margin:10px 10px 0 0; position: relative;}
.kw_search input{ width: 280px; border:1px solid #eee; background:#fff; border-radius:2px; padding:7px; }
.kw_search button{ width: 65px; height: 32px; background: url(../svg/search.svg) center center no-repeat #333; background-size: 20px; display: block; position: absolute; top: 0; right: 0; text-indent: -9999px; cursor: pointer; transition: 0.5s }
.kw_search button:hover{ background-color: #F7921D }
.ttdm{ display: inline-block;margin-left: 1%; font-size: 24px; color: #114A82 }


/* CSS Color */
.mauD91E18{ background: #D91E18 }
.mauDB0A5B{ background: #DB0A5B }
.mau9A12B3{ background: #9A12B3 }
.mau1F3A93{ background: #1F3A93 }
.mau26A65B{ background: #26A65B }
.mauF7CA18{ background: #F7CA18 }
.mauF89406{ background: #F89406 }
.mau6C7A89{ background: #6C7A89 }
/* CSS Boxsp */



.lefttin{ width: 47%; float: left; }
.lefttin .hinh{ width: 100% }
.lefttin .hinh img{ width: 100%; height:auto; }
.lefttin .ten{ padding: 5px 0; }
.lefttin .ten a{ color: #303339; font-size: 15px }
.lefttin .mota{color: #50524B; line-height: 26px; font-size: 15px}
.lefttin .ngaydang{ color: #999; padding: 10px 0 }
.righttin{ width: 47%; float: right; box-sizing: border-box; }

#boxsp{ width:102%; margin:0 -1%; padding-bottom: 20px} #boxsp::after{ content: ''; display: block; clear: both; }
#boxsp li.product{ width: 31.33%; float: left; margin:0 1% 2% 1%; position: relative; box-sizing: border-box;box-shadow: 0px 4px 6px rgb(50 50 50 / 32%);
    border-radius: 6px; overflow: hidden; }
#boxsp li.product:hover{transition: 0.2s;  box-shadow: 0px 4px 12px rgb(50 50 50 / 107%)}
#boxsp li.product .hinh{height: 250px; }
#boxsp li.product .hinh img{ width: 100%; height: 100%; object-fit: cover;}
#boxsp li.product .info h3{padding: 5px 10px; height: 32px; color: #000; text-transform: uppercase; text-align: center;font-family: 'Cabin', sans-serif; font-size: 17px; line-height: 32px}
#boxsp li.product .info a{ color: #000 }


.baba li.product{width: 100% !important; margin: 0!important}
.boxtt li.product{ position: relative; box-sizing: border-box;box-shadow: 0px 4px 6px rgb(50 50 50 / 32%);
    border-radius: 6px; width: 31.33%; float:left; margin: 1% 1% 135px 1%}
.boxtt li.product:hover{transition: 0.2s;  box-shadow: 0px 4px 12px rgb(50 50 50 / 107%)}
.boxtt li.product .hinh{height: 225px; }
.boxtt li.product .hinh img{ width: 100%; height: 100%; object-fit: cover;}
.boxtt li.product .info h3{overflow: hidden;padding: 5px 10px 5px 20px; height: 55px; color: #000; text-transform: uppercase; text-align: center;font-family: 'Cabin', sans-serif; font-size: 17px; line-height: 32px;}
.boxtt li.product .info a{ color: #000 }
.boxtt li.product .info .gachngan{ width: 30px; height: 2px; background: #ccc; margin-left: 10px; margin-bottom: 10px }

.csschitiet{ font-size: 20px; line-height: 30px }
#boxsp li.product .icon{position: absolute; top:10px; right: 10px}
#boxsp li.product .icontext{ position: absolute; top: 10px; right:10px; font-size: 11px; color: #fff; padding:5px; z-index: 999}
#boxsp li.product .property{ color: #515666; margin-bottom: 10px }
#boxsp li.product .property::after{ content: ''; display: block; clear: both; }
#boxsp li.product .property li:nth-child(1){background:  rgba(255, 255, 255,0.6) url(../images/hotel.png) left center no-repeat; background-size: 16px;  width: 40%; float: left; padding-left: 10%}
#boxsp li.product .property li:nth-child(2){background:  rgba(255, 255, 255,0.6) url(../images/position.png) left center no-repeat; background-size: 16px; width: 40%; float: left; padding-left: 10%}
#boxsp li.product .property li:nth-child(3){background:  rgba(255, 255, 255,0.6) url(../images/shower.png) left center no-repeat; background-size: 16px;  width: 40%; float: left; padding-left: 10%}
.boxtin li.news{
    width: 31.33%;
    margin: 1%; float: left; padding: 10px; box-sizing: border-box; box-shadow: 0px 4px 6px rgb(50 50 50 / 32%);
    border-radius: 5px;
    transition: 0.2s; background: #fce3b5}
.boxtin li.news:hover{ transition: 0.2s;
    box-shadow: 0px 4px 12px rgb(50 50 50); }

.boxtin li.news h3{ font-size:17px; font-family: 'Cabin', sans-serif; height: 50px; margin: 10px 0}
.boxtin li.news .mota{ font-size:15px;
    display: block;
    height: 110px;
    line-height: 26px;
    text-align: justify;color: #242423; }
.boxtin li.news .mota a{ color: #242423 }
.boxtin li.news h3 a{ color:#1A1A1A}

.boxtin li.news p.capnhat{ color:#666; font-style: italic; color: #b7b7b7 }
.boxtin li.news .frame{ width: 100%; display: block; overflow: hidden; height: 250px  }
.boxtin li.news .frame img{width:100%; height: 100%; object-fit: cover; }

.baba li.news{ width: 100% !important;
    margin: 0!important;}

#loadmoreproduct{ width: 100%; height: 10px; text-align: center; padding:10px 0; cursor: pointer;}
#loadmore{ display: block; padding:10px 20px; width:100px; margin:20px auto; background: #f60; color: #fff; border-radius: 3px; cursor: pointer; text-align: center; border:3px solid #eee; font-size: 16px }
#loadmore:hover{ background: #f30 }

ul.tags{ margin-bottom:20px} ul.tags::after{ content: ''; display: block; clear: both; }
ul.tags li{ display:block; float: left; padding:5px; border: 1px solid #ccc; border-radius: 20px 5px 5px 20px; margin-right: 10px; background: url(../images/iconprice.png) left 5px center no-repeat; padding-left: 22px; border-bottom: 1px solid #f90; border-left: 1px solid #f90; font-style: italic;}
/* CSS tiêu đề */
h2.tieubieu{ text-transform: uppercase; color: #222; font-size: 15px; margin-bottom: 20px; padding-left: 10px; font-family: Arial}
h2.tieubieu span{}
h2.homecat{ text-transform: uppercase; color: #000; border-bottom: 1px dashed #ccc; margin-top:8px; height: 31px; font-size: 14px; font-family: Arial }
h2.homecat a{ background: #0070bb; color:#fff; padding:12px 10px; }
/* CSS input */
input.required{ background-image: url(../images/required.png); background-position: right 4px center; background-repeat: no-repeat; background-size:8px;}
input.noempty{ border:1px dashed #f30 !important; }
span.returnstatus{ color: #f30; font-size: 12px; font-style: italic; display: block; float:right; margin-top:-15px; }

.goimobile{ position: fixed; left: 0; bottom: 0; width: 100%; z-index: 9991; background: #fff; border: 1px #ccc solid; display: none }
.goimobile ul{}
.goimobile ul li{display: inline-block; float: left; margin: 1%; padding: 2% 1%; width: 48%; text-align: center; font-weight: bold; background: #b71c1f; box-sizing: border-box; font-size: 14px; color: #fff; cursor: pointer; border: 0px #666 solid; text-transform: capitalize; font-family: Tahoma; font-weight: normal}
.goimobile ul li a{ color: #fff }

table{width:auto; max-width: 100% !important; border-collapse: collapse; margin:15px 0; }
table td{text-align: center; padding: 15px 0px;}
table td em{font-weight: bold; font-style: normal;}
td, th { border: 1px solid #999}


span.login{ display: block; margin-top: 20px }
span.login a{ display: inline-block; margin-left: 5px; padding-left: 5px; color: #005447}
span.login a:hover{ color: #b38300 }
a.cart{ display: block; margin-top: 40px; background: url(../images/carticon.png) left center no-repeat; background-size: 16px; padding-left: 20px; color: #000; float: right; text-transform: uppercase; font-weight: bold}
a.cart:hover{ color:#E9772B; }

/* CSS Logo Thương hiệu */
ul.brand{ margin-bottom: 30px; outline: 2px solid #ccc; padding:10px; background: #f7f7f7 }
ul.brand li{ width: 100%; margin-bottom: 20px}
ul.brand li img{ width: 100%}
ul.brand li a{ color: #000 } ul.brand li a:hover{ color: #0070bb }

/* CSS Slider & Quảng cáo */
.kw_slider{ width: 100%; position: relative; z-index:1} .kw_slider img{ border: 0; width: 100% }
.kw_onslide{ width: 20%; max-height: 504px; background: rgba(255,255,255,0.6); position: absolute; left: 7%; z-index: 9999 }

.bannertop{ position: relative; }
.bannertop .control{ position: absolute; top: 0; left: 0; z-index: 999999 }
.arrow{ position: absolute; z-index: 999; top:0; bottom: 0 }

.leftadv img{ border: 0; margin-bottom:30px; max-width: 100%}
.leftadv img:hover{ opacity: 0.8 }

.middleadv{ width: 100%; margin:10px 0}
.middleadv::after{ content: ''; display: block; clear: both; margin-bottom: 10px }
.middleadv li{ overflow: hidden} .middleadv li img{ max-width: 100%; height: auto;}
.middleadv .name{ text-align: center; padding: 10px 0; color: #000; text-transform: uppercase; font-size: 20px }

.lastestnews li{ width: 100%; float: left; position: relative; box-sizing: border-box; padding-bottom: 20px}
.lastestnews li .info{ width: 70%; float: right; }
.lastestnews li .info a{ color: #303339; font-size: 14px }
.lastestnews li .info:hover a{ color: #000; transition: 1s }
.lastestnews li .info .ngaydang{ color: #b7b7b7; font-style: italic; padding: 5px 0 }
.lastestnews li .info .ngaydang span{ color: #000; font-weight: normal;; font-style: normal; }
.lastestnews li .info .mota{ color: #999; line-height: 24px}
.lastestnews li .hinh{ width: 25%; float: left}
.lastestnews li .hinh img{ max-width: 100%; height: auto }

.kw_textbottom{ width: 100%; background: rgba(34,167,240,0.3); padding:20px 0; border-bottom: 3px solid #22a7f0; margin:20px 0;} 
.kw_textbottom::after{ content: ''; display: block; clear: both; }
.kw_textbottom li{ width: 29.33%; margin: 0 2%; float: left; text-align: center; color: #000;} .kw_textbottom li img{ border:2px solid #fff; padding:20px; border-radius:100%; background: #22a7f0 }
.kw_textbottom li h3{ text-transform: uppercase; margin-top: 10px; color: #000}

/* Phân trang */
ul#phantrang{ margin-top:30px; }
ul#phantrang li{ display: inline-block; float: left; width: 20px; border:1px solid #ccc; margin:2px; border-radius:2px; padding:1px 5px 3px 5px; cursor: pointer; text-align: center; }
ul#phantrang li.active{ color: #f00; font-weight: bold; }
ul#phantrang li.next{ width:auto; }
input#gotopage{ display:inline-block; width:65px; height: 18px; padding:1px 5px 3px 5px; border: 1px solid #ccc; border-radius: 2px; float: left; margin-top:2px;}
ul#phantrang li.goto{ background: #ccc; border-radius:2px; padding:1px 5px 3px 5px; height: 18px; cursor: pointer; display: block; float: left; margin-left: 3px}
ul#phantrang li.goto:hover{ background: #999; color: #fff }

.leftct li{ list-style: initial }
.leftct ul{ padding-left: 20px }
/* CSS Footer */
.footer img{ max-width: 100%; height: auto; }
.footer .info a img{ margin-right: 5px }
.footer .link{ width: 45%; float: right; padding:0 2%; line-height: 35px; margin-top: 20px }
.footer .link a{ display: block; float: left; width: 50% }
.copyright{ text-align: center; padding: 10px 0; background: #F9A11B; color:#fff; } .copyright a{ color:#fff; }

/* Menu tab */
ul.tabs { float:left; list-style:none; height:32px; width:100%; margin-top:10px;padding:0}
ul.tabs li { float:left; height:32px; line-height:32px; border:1px solid #ccc; border-bottom:0; overflow:hidden; position:relative;
background: #ddd; border-radius:2px 2px 0 0; margin-right:1px; padding:0 10px; font-size:13px}
ul.tabs li a {text-decoration:none;color:#000}
ul.tabs li.active,html ul.tabs li.active a:hover {background:#fff}
.tabContainer { overflow:hidden; clear:both; position: relative;}
.tabContent {padding-top:10px; display: none}
#poppop_loinhan{ border: 1px solid rgba(131,131,131,.3); padding: 2% 4%; width: 92%; border-radius: 2px; background: none; min-height: 30px; color: #666; font-size: 14px }
/* BXSlider */
.bx-wrapper {position: relative; margin: 0 auto; padding:0; width: auto}
.bx-wrapper img{max-width:100%}
.bx-wrapper .bx-prev { left: 10px; background: rgba(0,0,0,0.3) url(../svg/arrow-left.svg) center center no-repeat; background-size: 30px 30px; border-radius: 2px}
.bx-wrapper .bx-next { right: 10px; background: rgba(0,0,0,0.3) url(../svg/arrow-right.svg) center center no-repeat; background-size: 30px 30px; border-radius: 2px}
.bx-wrapper .bx-controls-direction a { position: absolute; margin: auto; top:0; bottom:0; z-index: 100; width: 32px; height: 32px; display: none }
.bx-wrapper:hover .bx-controls-direction a{ display: block; }

.bx-wrapper .bx-pager{position: absolute; display: inline-block; bottom: 10px; width: 80px; margin: auto; left:0; right:0; z-index: 100}
.bx-wrapper .bx-pager a{ float: left; width:12px; height:12px; text-indent: -999px; border-radius: 100%; margin-right: 5px}
.bx-wrapper .bx-pager.bx-default-pager a { background: #666}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {background: #000}

#nav_up{ padding:7px; background-color:white; border:1px solid #CCC; position:fixed; background:transparent url(../images/arrow_up.png) no-repeat top left; background-position:50% 50%; width:20px; height:20px; bottom:70px; opacity:0.7; right:30px; white-space:nowrap; cursor: pointer; border-radius:3px 3px 0 0; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70)}
#nav_down{ padding:7px; background-color:white; border:1px solid #CCC; position:fixed; background:transparent url(../images/arrow_down.png) no-repeat top left; background-position:50% 50%; width:20px; height:20px; bottom:30px; opacity:0.7;
	right:30px; white-space:nowrap; cursor: pointer; border-radius:0 0 3px 3px; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70)}

/* CSS box call */
.boxcall{ position: fixed; z-index: 9990; bottom: 20px; right: 10px; border-radius: 5px; font-size: 18px; background: url(../images/sdt1.png) center no-repeat; background-size: 300px;width: 300px; height: 90px;}
.boxcall a img{ clear: both; max-width: 25px; height: auto; margin-bottom: 5px; position: absolute; right: 26px; top: 32px }
.boxcall a span{ background: #F8B231;border: 2px solid #f9813b;
    box-shadow: -5px 10px 8px #888888; padding: 10px 30px; border-radius: 20px 0 0 20px; right: 50px }
.boxcall a { display: inline-block; float: left; text-align: center; font-size: 16px; color: #000; font-weight: bold; }
.boxcall a.sdt{ margin-right: 10px }
.boxcall a.sdt img{animation: quick-alo-circle-img-anim 1s infinite ease-in-out;  }

.boxzalo{ position: fixed; z-index: 9990; bottom: 120px; right: 10px; border-radius: 5px; font-size: 18px; background: url(../images/zalo01.png) center no-repeat; background-size: 300px;width: 300px; height: 90px;}
.boxzalo a img{ clear: both; max-width: 30px; height: auto; margin-bottom: 5px; position: absolute; right: 24px; top: 28px }
.boxzalo a span{ background: #F8B231;border: 2px solid #f9813b;
    box-shadow: -5px 10px 8px #888888; padding: 10px 30px; border-radius: 20px 0 0 20px; right: 50px }
.boxzalo a { display: inline-block; float: left; text-align: center; font-size: 16px; color: #000; font-weight: bold; }
.boxzalo img{animation: quick-alo-circle-img-anim 1s infinite ease-in-out;  }
.boxzalo .quick-alo-ph-circle{ border: 10px solid rgba(11,132,218,1); }

/* CSS Scrollbar */
::-webkit-scrollbar { width: 8px}
::-webkit-scrollbar-track {background-color: #eaeaea}
::-webkit-scrollbar-thumb {background-color: #ccc; border-radius:15px}
::-webkit-scrollbar-thumb:hover {background-color: #aaa}

/* Responsive cho comment & Facebook */
#___comments_0{width:100% !important}
.video-wrap{width:100% !important}
.fb-comments {max-width:100%}
.fb-comments span{max-width:100%} .fb-comments iframe{max-width:100%}
.fb_iframe_widget{max-width:100%} .fb_iframe_widget iframe{max-width: 100%}
.fb_iframe_widget span{max-width:100%}
iframe{max-width:100%}

/* CSS box call */
.boxphone{border-color: #F9A11B;cursor: pointer;  height: 160px; position: fixed; left: -15px; bottom: -15px; transition: visibility 0.5s ease 0s; width: 200px; z-index: 200000 !important;}
.coccoc-alo-ph-circle {background-color: transparent;
border: 2px solid #F9A11B; border-radius: 100%; height: 100px; left: 20px; opacity: 0.1; position: absolute; top: 20px; transform-origin: 50% 50% 0; 
transition: all 0.5s ease 0s; width: 100px; -webkit-animation: 1.2s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim;
-moz-animation: 1.2s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim;animation: 1.2s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim; }
.circle{background-color: #F9A11B; animation: 1s ease-in-out 0s normal none infinite running coccoc-alo-circle-img-anim;background: #F9A11B url(../images/hotline-ico.png) no-repeat scroll center center; border: 2px solid transparent;
border-radius: 100%; height: 60px; left: 25px; opacity: 0.9; position: fixed;bottom: 41px; transform-origin: 50% 50% 0; text-indent:-9999px; width: 60px;}
@keyframes coccoc-alo-circle-anim {
0% {opacity: 0.1; transform: rotate(0deg) scale(0.5) skew(1deg);}
30% {opacity: 0.5; transform: rotate(0deg) scale(0.7) skew(1deg);}
100% {opacity: 0.6; transform: rotate(0deg) scale(1) skew(1deg);}
}