html, body { font-family: 'Cabin'; font-size: 16px; position: relative; }

h1, h2, h3, h4, h5, h6{ font-family: 'Cabin', sans-serif; /* font-size: 1em; */  line-height: 1.2em; }

.grecaptcha-badge { visibility: hidden; }

i.fas.fa-phone { transform: rotateY(180deg); }

.container .boundary .address { color: #BBB; }
.container .boundary .address:before { content: "\f3c5"; font-family: 'Font Awesome 5 Free'; font-weight: 900; margin-right: 8px; }

.top-menu { background-color: #E1BE64; height: auto; position: relative; }
.top-menu .boundary { text-align: left; }
.top-menu .logo { display: inline-block; }
.top-menu .logo img { height: 70px; width: auto; display: inline-block; vertical-align: top; }
.top-menu .main-menu { display: inline-block; vertical-align: top; float: right; }
.top-menu .main-menu i { color: #000; font-size: 2em; line-height: 80px; margin-right: 20px; }
.top-menu .main-menu .menu-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.5; filter: opacity(50); z-index: 800; display: none; }
.top-menu .main-menu ul.menu-content { position: absolute; top: 100%; left: 0; width: 100%; height: auto; background-color: var(--f-color); z-index: 900; margin: 0; padding: 0 0 20px; box-shadow:0 0 3px #333; overflow: hidden; display: none; }
.top-menu .main-menu ul.menu-content li { color: #333; text-align: left; padding: 0; font-family: "Quicksand"; font-size: 1em; font-weight: bold; text-transform: uppercase; }
.top-menu .main-menu ul.menu-content li:first-child { margin-top:20px; }
.top-menu .main-menu ul.menu-content li a { color: inherit; padding: 10px 20px; width: 100%; box-sizing: border-box; display: block; }
.top-menu .main-menu ul.menu-content li a:hover, .top-menu .main-menu ul.menu-content li a.active { color:#333; background-color: var(--main-color); }
.top-menu .main-menu ul.menu-content li ul { list-style-type:none; margin:0; }
.top-menu .main-menu ul.menu-content li ul li:first-child { margin-top:0; }
.top-menu .main-menu ul.menu-content li ul li { text-transform:none; }
.top-menu .main-menu ul.menu-content li ul li a { padding:0 0 10px; color:#333; }

.banner { position: relative; height: auto; margin-bottom: 20px; box-shadow: 0 2px 3px #999;/*  overflow: hidden; */ }
.banner.hide-banner { box-shadow: unset; margin-bottom: 0; }
/* .banner:before { padding-top: 30%; content: ""; display: block; width: 100%; height: auto; } */

/* changed */
.member-bar, .member-bar .bg { position: absolute; top: 0; left: 0; width: 100%; height: auto; z-index: 100; }
.member-bar { position: relative; box-shadow: 0 1px 3px #999; background-color:#F0E68C; }
.member-bar .boundary { padding: 5px 0; width: 94%; vertical-align: bottom; }
.member-bar .boundary .button { margin-left: 5px; margin-right: 0; padding: 3px 5px; border: 2px solid var(--main-color); }
.member-bar .boundary .button.support { margin-top: 2px; }
.member-bar .boundary .button.hide { display: none; }
.member-bar .boundary .button span {width: 20px; height: 20px; background-color: #F00; display: inline-block; text-align: center; border-radius: 100%; line-height: 20px; color: #FFF; margin-left: 10px; font-size: 0.8em; }
.member-bar .boundary .button:hover { background-color: var(--main-color); }
.member-bar .bg { background-color: var(--f-color); height: 100%; z-index: -1; }
.member-bar a { color: #000; }
.member-bar .logout { display: none; font-size: 1.4em; padding: 0 10px; margin-right: 0; line-height: 38px; vertical-align: middle; }

.member-bar .member-icon { display: inline-block; line-height: 38px; margin-right: 10px; position: relative; }
.member-bar .member-icon.min-hide { display: none; }
.member-bar .member-icon .noti-amount { position: absolute; font-size: 0.7em; color: #FFF; background-color: #F00; border-radius: 100%; z-index: 100; top: -10px; left: 25px; line-height: 20px; width: 20px; height: 20px; text-align: center; }
.member-bar .member-icon .circle-image { display: inline-block; width: 38px; vertical-align: middle; margin-top: -3px; margin-right: 5px; border: 1px solid var(--main-color); }

.member-bar .member-bar-menu { display: none; position: absolute; top: 100%; left: 0; z-index: 9999; width: 100%; height: 400px; overflow-y: scroll; background-color: #FFF; border-top: 1px solid #000; padding-top: 20px; box-shadow: 0 1px 2px #000; }
.member-bar .member-bar-menu .image-uploader { border-radius: 100%; width: 150px; height: 150px; }
.member-bar .member-bar-menu .menu-content { padding: 0 10px 100px; }
.member-bar .member-bar-menu .menu-content .break { text-transform: uppercase; padding: 10px; background-color: var(--main-color); margin: 10px 0; box-shadow: 0 0 2px #000; }
.member-bar .member-bar-menu .menu-content a { display: block; color: #333; }
.member-bar .member-bar-menu .menu-content a:before { content: "\26AB"; font-size: 0.3em; vertical-align: middle; padding: 0 10px 0 5px; }
.member-bar .member-bar-menu .menu-content a:hover, .member-bar .member-bar-menu .menu-content a.active { text-shadow: 0 0 1px #333; }
.member-bar .member-bar-menu .member-name { font-weight: bold; text-transform: capitalize; font-size: 1.2em; }
.member-bar .member-bar-menu .star i { color: var(--main-color); margin: 0 3px; }
.member-bar .member-bar-menu .logout { display: inline-block; }

.member-bar .boundary {margin:0 auto;}
.member-bar .marquee {display:block; width:100%; height:auto; overflow:hidden;}
/* changed */

.banner #banner { position: relative; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; }
/* .banner.hide-banner #banner { display: none; } */
.banner #banner ul { list-style-type: none; padding: 0; margin: 0; }
.banner #banner ul li img { width: 100%; height: auto; vertical-align: bottom; }
.banner .controls { position: absolute; bottom: 50%; right: 0; width: 100%; text-align: center; z-index: 1; }
.banner.solar-banner .controls { bottom: unset; top: 0; }
.banner .controls ol { list-style-type: none; padding: 0; text-align: right; display: inline-block; width:96%; }
.banner .controls ol li { display: inline-block; width: 2px; height: 2px; border: 1px solid #000; border-radius: 20px; margin-right: 2px; cursor: pointer; }
.banner .controls ol li.current, .banner .controls ol li:hover{ background-color: #000; }
.banner .controls ol li a span { display: none; }
.banner .controls .numericControls { margin: 0; }
.banner.hide-banner .controls { display: none; }

.banner .search-box { display: inline-block; width: 100%; height: auto; margin: 0; padding: 18px 1% 18px; box-sizing: border-box; background-color: #FCFCFC; }
.banner .search-box { display: none; }
/* search box on mobile */
.banner .search-box.min-search-box { display: block; width: 96%; margin: 0 auto; }
.banner .search-box.min-search-box .tab-container { margin-bottom: 0; }
.banner .search-box.min-search-box .tabcontent .glass { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; }
/* / search box on mobile */
.banner .search-box .tab-container, .banner.hide-banner .search-box .tab-container { background: transparent; box-sizing: border-box; }
.banner .search-box .tab-container .tab-nav, .banner.hide-banner .search-box .tab-nav { text-align: left;}
.banner .search-box .tabcontent { border: 3px solid #000; }
.banner .search-box .tabmenu { background-color: #000; color: #FFF; border-bottom: 0 !important; padding: 3px 0; text-align: center; width: 50%; box-sizing: border-box; font-size: 0.8em; text-transform: uppercase; }
.banner .search-box .tabmenu { border: 0; line-height: 37px; }
.banner .search-box .tabmenu.active, .banner .search-box .tabmenu:hover { background-color: var(--main-color); color: #000; border: 0; }
.banner .search-box .tabmenu:first-child { border-right: 0 !important; }
.banner .search-box .tabcontent { padding: 0; border-width: 3px !important; text-align: left; position: relative; }
.banner .search-box .tabcontent form { position: relative; }
.banner .search-box .tabcontent form, .banner .search-box .tabcontent .selection, .banner .search-box .tabcontent .textbox, .banner .search-box .tabcontent .button { height: 39px; }
.banner .search-box .tabcontent .selection, .banner .search-box .tabcontent .textbox, .banner .search-box .tabcontent .button { margin: 0; border: 0; }
.banner .search-box .tabcontent .textbox { width: 92%; margin: 0; padding: 5px; }
.banner .search-box .tabcontent .selection { width: 100%; padding: 5px; border-right: 2px solid #000; display: block; }
.banner .search-box .tabcontent .custom-select { height: 37px; width: 100%; padding: 0; vertical-align: top; box-sizing: border-box; border-bottom: 1px solid #DDD; line-height: 37px; }
.banner .search-box .tabcontent .custom-select .styledSelect span { line-height: 37px; }
.banner .search-box .tabcontent .custom-select .styledSelect:after { top: 22px; }
.banner .search-box .tabcontent .custom-select ul li { line-height: 1.5em; text-transform: capitalize; }
.banner .search-box .tabcontent .button { border-radius: 0; float: right; color: #FFF !important; background-color: #000; display: none; box-shadow: unset; padding: 0 20px; }
.banner .search-box .tabcontent .button:hover { background-color: var(--main-color); color: #000 !important; }
.banner .search-box .tabcontent button { position: absolute; display: inline-block; background-color: #000; top: 0; right: -1px; font-size: 1.32em; line-height: 40px; height: 41px; width: 40px; border: 0; color: #FFF; outline: 0; margin: 0; margin-top: -1px; vertical-align: middle; text-align: center; padding:0; }
.banner .search-box .tabcontent button i { font-size: 1.3em; line-height: 40px; }
.banner .search-box .tabcontent button:hover { cursor: pointer; background-color: var(--main-color); color: #000; }

.breadcrumb { margin: 0 0 10px; padding: 0 10px 10px; box-sizing: border-box; }

.top-news .boundary, .topic-title, .topic-container .boundary, .ultilities .boundary { width: 90%; }

.top-news h2, .top-news h3 { font-family: cabin; }
.top-news .boundary { background-color: #eee; box-shadow: 0 0 5px #333; border-radius: 5px; }
.top-news .boundary .table .col-lg-8, .top-news .boundary .table .col-lg-4 { padding: 5px; padding-bottom: 0; text-align: left; overflow: hidden; }
.top-news .boundary .table .col-lg-4 { padding-left: 0; }
.top-news .boundary .block, .top-news .boundary .small-block { display: inline-block; width: 100%; height: auto; position: relative; margin-bottom: 5px; vertical-align: top; overflow: hidden; box-shadow: 0 0 5px #000; }
.top-news .boundary .block:before, .top-news .boundary .small-block:before { content: ""; display: block; padding-top: 62.5%; }
.top-news .boundary .block:before { padding-top: 65.2%; }
.top-news .boundary .table .col-lg-8 .small-block { width: 48.1%; margin-right: 10px; display: none; }
.top-news .boundary .table .col-lg-8 .small-block.last { margin: 0; }
.top-news .boundary .table .col-lg-8 .small-block:before { padding-top: 64.2%; }
.top-news .boundary .block .square-image, .top-news .boundary .small-block .square-image { position: absolute; top: 0; left: 0; width: 100%; height: auto; }
.top-news .boundary .small-block .square-image:before { padding-top: 62.5%; }
.top-news .boundary .table .col-lg-8 .small-block .square-image:before { padding-top: 64.2%; }
.top-news .boundary .block .square-image:before { padding-top: 65.2%; }

.top-news .tag { display: inline-block; position: absolute; top: 0; left: 0; width: auto; height: auto; color: #FFF; padding: 0 10px; }
.top-news .tag a { color: inherit; }
.top-news .tag:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; z-index: 1; opacity: 0.6; filter: alpha(opacity=60); }
.top-news .tag span { z-index: 2; position: relative; line-height: 2em; }

.top-news .title { position: absolute; width: 100%; height: auto; bottom: 0; left: 0; padding: 5px 10px; padding-top: 20px; box-sizing: border-box; color: #FFF; }
.top-news .title div { position: relative; z-index: 2; }
.top-news .title h2 { color: #FFF; font-size: 1em; margin-top: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-transform: uppercase; }
.top-news .title a { color: inherit;}
.top-news .title a:hover { color: var(--f-color); }
.top-news .title:before { display: block; content:""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: -moz-linear-gradient(top,rgba(0,0,0,0) 10%,rgba(0,0,0,0.3) 20%,rgba(0,0,0,0.7) 80%,rgba(0,0,0,0.9) 100%); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 10%,rgba(0,0,0,0.3) 20%,rgba(0,0,0,0.7) 80%,rgba(0,0,0,0.9) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 10%,rgba(0,0,0,0.3) 20%,rgba(0,0,0,0.7) 80%,rgba(0,0,0,0.9) 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#a6000000',GradientType=0);}
.top-news .title .money { background-color: var(--main-color); color: #000; padding: 3px 10px; font-weight: bold; font-size: 1.3em; box-shadow: 0 0 3px #999; }
.top-news .title .address { font-size: 1em; display: none; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; }

.top-news .sudo-box .slide { height: 100%; }

.top-news .small-block .title .money { font-size: 1em; }
.top-news .small-block .title h3 { color: #FFF; line-height: 1.5em; margin-top: 5px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-transform: uppercase;  }

.top-news .block #slider {position: absolute; top: 0; left: 0; width: 100%; height: 100% !important; overflow: hidden; display: none; }
.top-news .block #slider ul li { position: relative; width: 100%; height: 100%; }
.top-news .block .controls { display: inline-block; width: auto; height: auto; position: absolute; top: 0; right: 0; z-index: 10; }
.top-news .block .controls a { width: 30px; height: 30px; background-color: var(--main-color);  text-indent: -9999px; display: inline-block; position: relative; margin-left: 5px; text-align: center; line-height: 30px; }
.top-news .block .controls a:hover { background-color: var(--f-color); }
.top-news .block .controls a:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 2em; content: "\f104"; color: #333; text-indent: 0; }
.top-news .block .controls a.nextBtn:before { content: "\f105"; }

.topic-title { margin: 8px 0 0; text-align: left; border-bottom: 1px solid var(--main-color); }
.topic-title h2 { font-size: 1.1em; width: auto; display: inline-block; background-color: var(--main-color); color: #000; padding: 8px 10px 5px 5px; position: relative; text-transform: uppercase; font-weight: bold; margin-bottom: -1px; }
.topic-title h2:after { content: ""; display: inline-block; height: 100%; position: absolute; top: 0; right: -18px; width: 18px; background: transparent url("../images/topic-title-right.gif") no-repeat top left; background-size: 100% 100%; }
.topic-title a { font-family: "Quicksand", sans-serif; color: #000; display: inline-block; font-weight: bold; float: right; padding: 3px 10px; }
.topic-title a:hover { background-color: var(--f-color); color: #333; }

.topic-container .boundary { position: relative; }
.topic-container .boundary .col { padding: 0; }
.topic-container .block, .topic-container .small-block { display: inline-block; width: 100%; background-color: #DDD; height: auto; min-height: 100px; padding: 0; background-color: #333; box-shadow: 0 0 5px #000; }
.topic-container .block { margin-bottom: 10px; }
.topic-container .small-block { width: 49%; vertical-align: top; }
.topic-container .small-block.last { margin-left: 2%; margin-left:}
.topic-container .min-hide { display: none; }
.topic-container .square-image { border: 0; }
.topic-container .square-image:before { padding-top: 66.666%; }
.topic-container .block-title { text-align: left; position: relative; color: #FFF; padding: 5px 10px; }
.topic-container .block-title h4 a { font-family: Cabin; color: var(--main-color); text-transform: uppercase; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-height: 1.5em; font-size: 1.2em; }
/* .topic-container .block-title h4 a { color: inherit; } */
.topic-container .block-title h4 a:hover { color: var(--f-color); }
.topic-container .block-title .address { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 1; }
.topic-container .block-title .money { font-weight: bold; font-size: 1.3em; line-height: 1.8em; display: inline-block; }
.topic-container .block-title .button { float: right; margin: 0; padding: 0 5px; box-shadow: unset; font-size: 0.8em; }
.topic-container.new-posts .button { padding: 0 5px; }
.topic-container.new-posts .square-image:before { padding-top: 65%; }

.topic-container ul { padding: 0; margin: 0; list-style-type: none; }
.topic-container ul li { display: inline-block; }
.topic-container.news .small-block { width: 100%; margin: 0; }

.topic-container.news ul.slidesContainer li.slide { padding: 10px 0; }
.topic-container.news .controls { display: block; position: absolute; top: 50%; transform: translateY(-50%); width:100%; }
.topic-container.news .controls a { display: inline-block; width: 30px; height: 30px; text-indent: -9999px; background-color: #DDD; color: #333; border-radius: 100%; position: relative; margin-left: -10px; box-shadow: 0 0 3px #000; }
.topic-container.news .controls a:before { content: "\f104"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 2em; text-indent: 0; width:100%; height: 100%; position: absolute; top: 0; left: 0; line-height: 30px; text-align: center; }
.topic-container.news .controls a:hover { background-color: var(--f-color); }
.topic-container.news .controls a.nextBtn { float: right; margin-left: 0; margin-right: -10px; }
.topic-container.news .controls a.nextBtn:before { content: "\f105"; }

.ultilities a { display: block; width: 100%; padding: 10px; font-weight: bold;  font-size: 1.1em; color: #FFF; background-color: #333; text-align: center; margin-bottom: 10px; box-sizing: border-box; box-shadow: 0 0 5px #000; text-transform: uppercase; }
.ultilities a:hover { color: var(--f-color); }

.cities { margin: 40px 0; }
.cities .boundary { width: 96% !important; max-width: unset; padding:2%; }
.cities .boundary .table { border-collapse:separate; }
.cities .boundary .table.max-hide { border-spacing:10px;}
.cities .boundary .table.min-hide { border-spacing:20px;}
.cities .col { padding: 0; text-align:left; }
.cities .col div { color: #FFF; line-height: 2.3em;  }
.cities .col div a { background-color: #333; color: inherit; font-size: 1.2em; display: inline-block; width:49%; margin:0 2% 0 0; text-transform: capitalize; font-weight: bold; text-align:center; box-sizing:border-box; line-height:2.5em; }
.cities .col div a:hover { background-color: var(--main-color); color: #333; }
.cities .col div a:nth-child(2n+0) {margin-right:0;}
.cities .col div a.min-hide {display:none;}
.cities .col div span { display: none; }
.cities .col div.min-show { display: block; }
.cities .table.max-hide .col div { padding: 10px 0; }
.cities .table.max-hide.hide-1 {display:none;}

.footer { background-color: var(--f-color); color: #000; padding: 30px 0; margin-top: 20px; font-size: 1.1em; position:relative; }
.footer .table .col { text-align: left; padding: 0 5px; }
.footer .logo { display: block; text-align: center; }
.footer .logo img { width: 40%; outline: 0; }
.footer h2 { color: #000; width: 100%; text-align: center; text-transform: uppercase; font-size: 1.2em; line-height: 1.5em; margin-bottom: 30px; white-space: nowrap; }
.footer h2 span { display: block; font-size: 2.5em; margin-top: 0.5em; }
.footer i { font-size: 1.3em; }
.footer i.landline { display: inline-block; width: 25px; height: 17px; background: url(../images/phone-ico.gif) no-repeat top left; background-size: 100%; }
.footer i.zalo { display: inline-block; width: 25px; height: 24px; background: url(../images/zalo-ico.gif) no-repeat top left; background-size: 100%; }
.footer table { border: 0; }
.footer table tr td { border: 0; padding: 5px 0 10px; line-height: 1.5em; }
.footer > table > tr > td:first-child { text-align: center; padding: 0 10px 0 0; }
.footer table tr td a { color: inherit; font-size: 1em; }
.footer a:hover { text-shadow: 0 0 1px #000; }

.footer .table .col.right { padding-top: 20px; line-height: 1.5em; }
.footer h3 { font-size: 1.4em; text-transform: uppercase; border-bottom: 2px solid #000; color: #000; padding-bottom: 5px; margin-bottom: 20px; }

.footer .table .right table tr td { padding-top: 0; vertical-align: top; }
.footer .table table tr td:first-child { width: 10%; padding: 0 5px 0 0; text-align: center;  }
.footer .table .right a { font-weight: normal; line-height: 1.5em; display: block; color: #000; margin-bottom: 10px; }
.footer .table .right .table .col { margin-bottom: 20px; }
.footer .table .right table tr td a { font-size: 1em; }

.footer .table .col.text-center table tr td {text-align:left;}

/* PAGE NAV */
.page-nav { display: block; width: 100%; box-sizing: border-box; padding: 10px 10px 0; text-align: right; }
.page-nav a { background-color: #DDD; border: 1px solid #333; color: #333; text-align: center; display: inline-block; width: 1.5em; height: 1.5em; line-height: 1.5em; margin-left: 5px; }
.page-nav a:hover, .page-nav a.active { font-weight: bold; background-color: var(--main-color); }
/* PAGE NAV */

.popup-form { padding: 0 !important; display: none; }
.popup-form h2 { padding: 10px; text-align: center; text-transform: uppercase; background-color: var(--main-color); color: #000; margin-bottom: 20px; font-size: 1.6em; text-shadow: 0 0 1px #DDD; }
.popup-form a.close-modal { color: #FFF !important; top: 10px !important; }
.popup-form form { padding: 10px; text-align: center; }
.popup-form form input.textbox, .popup-form form .textarea, .popup-form form input.button, .popup-form.login .cities{ width: 100%; max-width: 400px; margin-bottom: 10px; }
.popup-form form .required { position: relative; }
.popup-form form .required:after { content:"*"; position: absolute; top: 0; right: 10px; display: inline-block; line-height: 2em; color: #F00; font-weight: bold; }
.popup-form form .selection.required:after {right:25px;line-height:2.5em;}
.popup-form form .textarea { height: 5em; min-height: unset; }
.popup-form form a { color: #000; }
.popup-form form a:hover { text-decoration: underline; }
.popup-form.login #form2{ display: none; }
.popup-form.login .cities { margin: 0 auto; }
.popup-form.login .cities .flex { text-align: center; display: block; justify-content: space-between; margin: 0 auto; }
.popup-form.login .cities .selection { width: 100%; }
.popup-form.login .description { color: #666; font-style: italic; width: 100%; max-width: 400px; display: inline-block; text-align: justify; }
.popup-form span { color: #F00; font-weight: bold; margin-left: -15px; position: relative; z-index: 1; vertical-align: top; }

/* .login { padding: 0 !important; display: none; }
.login h2 { padding: 10px; text-align: center; text-transform: uppercase; background-color: var(--main-color); color: #000; margin-bottom: 20px; font-size: 1.6em; text-shadow: 0 0 1px #DDD; }
.login a.close-modal { color: #FFF !important; top: 10px !important; }
.login form { padding: 10px; text-align: center; }
.login form input.textbox, .login form .textarea, .login form input.button, .login .cities{ width: 100%; max-width: 400px; margin-bottom: 10px; }
.login form .textarea { height: 5em; min-height: unset; }
.login form a { color: #000; }
.login form a:hover { text-decoration: underline; }
.login #form2{ display: none; }
.login .cities { margin: 0px auto 10px; }
.login .cities .flex { text-align: center; display: flex; justify-content: space-between; margin: 0 auto; }
.login .cities .selection { width: 32%; display: inline-block; }
.login .description { color: #666; font-style: italic; width: 100%; max-width: 400px; display: inline-block; text-align: justify; }
.login span { color: #F00; font-weight: bold; margin-left: -15px; position: relative; z-index: 1; vertical-align: top; } */

/* OPTIONS SLIDER */
.options-slider { display: block; position: relative; width: 100%; height: auto; }
.options-slider:after { content: "\f078"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 0.68em; position: absolute; top: 0; right: 23px; height: 100%; line-height: 3.2em;  }
.options-slider .slider-display { padding: 3px 10px; width: 96%; box-sizing: border-box; background-color: #FFF; border: 1px solid #DDD; text-align: left; margin: 10px auto 0; position: relative; cursor: pointer;  }
.options-slider .slider-display span { line-height: 1em; }
.options-slider .slider-display ul { display: none; min-width: 100%; height: auto; position: absolute; top: 100%; left: 0; list-style-type: none; background-color: #FFF; z-index: 100; margin: 0; padding: 0; border: 1px solid var(--f-color); text-align: left; }
.options-slider .slider-display ul li { padding: 0 10px; }
.options-slider .slider-display ul li.active, .options-slider .slider-display ul li:hover { background-color: var(--f-color); }
.options-slider .slider-display ul li .textbox { width: 30%; margin: 0; }
.options-slider .slider-display ul:hover { cursor: pointer; }
/* / OPTIONS SLIDER */

/* FLOATING MENU */
#fl_menu { display: inline-block; position:fixed; bottom:70px; left:10px; z-index:9999; width:42px; height:42px; background-color: var(--main-color); color: #333; text-align: center; box-shadow: 0 0 3px #000; }
#fl_menu i { color: #333; font-size: 1.7em; line-height: 40px;}
#fl_menu .fl-content { display: none; position: absolute; bottom: 0; left: 0; width: auto; height: auto; background-color: #FFF; border: 1px solid #DDD; padding-bottom: 45px; z-index: -1; box-shadow: 0 0 3px #000;  }
#fl_menu .fl-content a { white-space: nowrap; color: #333; display: block; padding: 10px; text-transform: capitalize; }
#fl_menu .fl-content a.active, #fl_menu .fl-content a:hover { background-color: var(--main-color); }
/* / FLOATING MENU */


/* SOCIAL BAR */
.social-bar { position: fixed; bottom: 10px; left: 10px; z-index: 10000; width: auto; height: auto; display: inline-block; }
.social-bar.min-hide { display: none; }
.social-bar .bar-item { position: relative; display: none; text-align: right; margin-bottom: 2px; }
.social-bar .bar-item:first-child { margin-bottom: 3px; }
.social-bar .bar-item:last-child { margin-top: 2.5px; }

.social-bar .bar-item.min-show { display: block; }
/* .social-bar .bar-item.min-show .icon { border-bottom-left-radius: 10px; border-top-left-radius: 10px; } */

.social-bar .bar-item span { display: inline-block; line-height: 42px; font-weight: bold; background-color: var(--main-color); color: #000; white-space: nowrap; text-align: left; vertical-align: top; box-shadow: 0 0 2px #666; position: relative; z-index: 100; }
.social-bar .bar-item .icon { width: 42px; height: 42px; text-align: center; }
.social-bar .bar-item .icon i { font-size: 1.6em; vertical-align: middle; }
.social-bar .bar-item .icon i.fab { font-size: 1.8em; }
.social-bar .bar-item span i.zalo, .social-bar .bar-item span i.contact { width: 35px; height: 34px; vertical-align: middle; margin-top: -5px; }
.social-bar .bar-item span i.contact { width: 45px; height: 44px; }
.social-bar .bar-item .content { padding: 0 20px; display: none; z-index: 50; }
.social-bar .bar-item:hover .content { background-color: var(--f-color); }
/* / SOCIAL BAR */

/* CUSTOM CHECKBOX */
.custom-checkbox, .custom-radio{
	width: 16px;
	height: 16px;
	display: inline-block;
	position: relative;
	z-index: 1;
	top: 3px;
	background: url("/images/checkbox/checkbox.png") no-repeat;
	margin: 0 !important;
	margin-right: 5px !important;
}
.custom-checkbox:hover{
	background: url("/images/checkbox/checkbox-hover.png") no-repeat;
}
.custom-checkbox.selected{
	background: url("/images/checkbox/checkbox-selected.png") no-repeat;
}
.custom-checkbox input[type="checkbox"], .custom-radio input[type="radio"]{
	margin: 0;
	position: absolute;
	z-index: 2;            
	cursor: pointer;
	outline: none;
	opacity: 0;
	/* CSS hacks for adding opacity in older browsers */
	_noFocusLine: expression(this.hideFocus=true); 
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	-khtml-opacity: 0;
	-moz-opacity: 0;
}
.custom-radio{
	background: url("/images/checkbox/radio.png") no-repeat;
}
.custom-radio:hover{
	background: url("/images/checkbox/radio-hover.png") no-repeat;
}
.custom-radio.selected{
	background: url("/images/checkbox/radio-selected.png") no-repeat;
}
/* CUSTOM CHECKBOX */

@media screen and (min-width: 568px){
	.topic-container.news .small-block { width: 96%; margin: 0 2%; }
	.popup-form form .selection.required:after {right:-30px;}
}

@media (min-width:768px){
	.footer h2 { font-size: 1.5em; }
	
	.footer .table .col.text-center table tr td {padding:5px;}
	.footer .table .col.text-center table tr td:first-child {text-align:center;}
}

@media screen and (min-width: 769px){
	
	.banner { margin-bottom: 36px; }
	.banner .search-box { display: block; padding: 36px 1%; }
	.banner .search-box.min-search-box { display: none; }
	.banner .search-box .tabcontent { border-width: 5px !important; padding: 0; }
	.banner .search-box .tabcontent .button { display: inline-block; /* padding: 4px 10px 5px; */}
	.banner .search-box .tabcontent button { display: none; }
	.banner .search-box .tabcontent .selection, .banner .search-box .tabcontent .custom-select { width: 198px; display: inline-block; }
	.banner .search-box .tabcontent .custom-select { border-right: 3px solid #333; border-bottom: 0; height: 49.5px; line-height: 49.5px;}
	.banner .search-box .tabcontent .custom-select .styledSelect span { line-height: 49.5px; }
	.banner .search-box .tabcontent .textbox { width: 50%; }
	
	.breadcrumb { margin: 0 0 24px; }
	
	.top-menu .main-menu ul.menu-content li { font-size: 1.2em; }
	
	.top-news .boundary .table .col-lg-8 { padding: 10px; }
	.top-news .title h2 { font-size: 1.5em; line-height: 1.5em; }
	
		
	.topic-container.news .controls a { width: 40px; height: 40px; }
	.topic-container.news .controls a:before { line-height: 40px; }
	
	.topic-title { margin: 38px 0 18px; }
	.topic-title h2 { font-size: 1.2em; padding-right: 30px; }

	.ultilities .boundary { display: flex; justify-content: space-between; }
	.ultilities a { display: inline-block; width: 33%; font-size: 1.2em; padding: 5px; white-space: nowrap; }

	.cities .col { padding: 0; }
	.cities .col div.min-show { display: none; }
	.cities .col.min-hide { display: table-cell; }

	.footer .table .col.right { padding-top: 50px; }
	
	/* SOCIAL BAR */
	.social-bar { bottom: unset; left: unset; top: 27%; right: 0; }
	.social-bar.min-hide { display: block; }
	.social-bar .bar-item { display: block; }
	.social-bar .bar-item:nth-child(2) .icon { border-top-left-radius: 10px; }
	.social-bar .bar-item:last-child .icon { border-bottom-left-radius: 10px; }
	.social-bar .bar-item.min-show { display: none; }
	.social-bar .bar-item:hover .content { display: inline-block; }
	/* / SOCIAL BAR */
	
	.banner .controls, .banner.solar-banner .controls { position: absolute; top: 10px; bottom: unset;  }
	
	.page-nav { padding: 10px; }
}

@media screen and (min-width:1020px){
	#fl_menu { display: none; }
	.scrollup{ bottom: 50px; }
		
	/* h1 { font-size: 1.8em; } h2 { font-size: 1.6em; } h3 { font-size: 1.4em; } h4 { font-size: 1.2em; } h5, h6 { font-size: 1em; } */
	/* .member, .member .bg { z-index: unset; } */
	
	.options-slider:after { right: 15px; }
	
	.banner .search-box {position:absolute; top: 20px; left:0; z-index:100; width: 100%; text-align: center; background: transparent; }
	.banner .controls ol li { width: 10px; height: 10px; margin-right: 5px; border-width: 2px; }

	.top-menu .logo img { height: 70px; }

	.top-menu .main-menu i, .top-menu .main-menu .menu-bg { display: none !important; }
	.top-menu .main-menu ul.menu-content { background-color: transparent; z-index: unset; top: unset !important; left: unset !important; position: relative; list-style-type: none; width: auto; display: block !important; margin-top: 5px; box-shadow:unset; padding-bottom:0; overflow:unset; }
	.top-menu .main-menu ul.menu-content li { position:relative; display: inline-block; line-height: 70px; padding: 0 10px; }
	.top-menu .main-menu ul.menu-content li:first-child { margin: 0; }
	.top-menu .main-menu ul.menu-content li a { display: inline-block; padding: 0; }
	.top-menu .main-menu ul.menu-content li:hover, .top-menu .main-menu ul.menu-content li a:hover,  .top-menu .main-menu ul.menu-content li a.active { color: var(--f-color); background-color: transparent; }
	.top-menu .main-menu ul.menu-content li ul { position:absolute; top:100%; right:0; z-index:1000; background-color:var(--f-color); box-shadow:0 0 3px #333; padding:5px 0; line-height:1.5em; display:none; }
	.top-menu .main-menu ul.menu-content li:hover ul {display:inline-block;}
	.top-menu .main-menu ul.menu-content li ul li { line-height:1.5em; display:block; }
	.top-menu .main-menu ul.menu-content li ul li a { white-space:nowrap; font-weight:normal; padding:5px 0; }
	.top-menu .main-menu ul.menu-content li ul li:hover a {color:#900; }
	
	.top-menu .main-menu ul.menu-content li.sub-menu {padding-right:20px;}
	.top-menu .main-menu ul.menu-content li.sub-menu:after { content:"\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; line-height: 1em; display: inline-block; position: absolute; top: 50%; right: 0; transform: translateY(-50%) rotate(90deg); color:inherit; }

	.top-news .col.min-hide { display: table-cell !important; }
	.top-news .boundary .table .col-lg-8, .top-news .boundary .table .col-lg-4 { padding: 15px; padding-bottom: 0; }
	.top-news .boundary .table .col-lg-4 { padding-left: 0; }
	.top-news .boundary .block, .top-news .boundary .small-block { margin-bottom: 14px; width: 100%; }
	.top-news .boundary .table .col-lg-8 .small-block {  width: 48.3%; margin-right: 15.5px; display: inline-block; }

	.top-news .title { padding: 10px; }
	.top-news .title h2 { -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
	.top-news .title .money { font-size: 1.5em; padding: 3px 20px; }
	.top-news .title .address { font-size: 1.1em; display: -webkit-box; }
	.top-news .block .controls { bottom: 10px; top: unset; right: 10px; }
	.top-news .small-block .title h3 { margin-top: 10px; }
	.top-news .small-block .title .money { font-size: 1.2em; }
	
	.banner .search-box .tabcontent form, .banner .search-box .tabcontent .selection, .banner .search-box .tabcontent .textbox, .banner .search-box .tabcontent .button { height: 49.5px; }
	.banner { overflow: hidden; }
	.banner:before { padding-top: 30%; content: ""; display: block; width: 100%; height: auto; }
	.banner.hide-banner:before { display: none; }
	.banner.hide-banner { overflow: unset; }

	.banner #banner { position: absolute; width: 100%; height: 100%; margin:0; top:0; }

	.banner .search-box .tab-container { margin: 0 auto; max-width: 1001px; text-align: left; }
	.banner.hide-banner .search-box .tab-container { max-width: 981px; }
	.banner .search-box .tab-container .tab-nav { width: 400px; display: inline-block; }
	.banner .search-box .tab-container .tab-nav .tabmenu { font-size: 0.9em; }
	.banner .search-box .tabcontent .textbox { width: 68%; outline: none; }
	.banner.hide-banner .search-box { position: relative; top: 0; }
	.banner.hide-banner .search-box .tabcontent .button { margin-right: -1px; }

	.member-bar .boundary { width: 96%; max-width: unset; }
	.member-bar .member-icon { display: none; }
	.member-bar .member-icon.min-hide { display: inline-block; }
	.member-bar .member-bar-menu { display: none !important; }
	.member-bar .logout { display: inline-block;  }
	/* .member-bar .boundary .button.support { margin-top: 3px; } */
	.member-bar .boundary .button.hide { display: inline-block; /* margin-top: 1px; */ }
	
	.topic-title a { margin-top: 10px; }
	.topic-title h2 { font-size: 1.4em; padding: 15px 30px 9px 10px; }

	.topic-container .small-block { width: 48%; margin-left: 2%; }
	.topic-container .small-block.min-hide { display: inline-block; margin-top: 1.5%; }
	.topic-container .block .square-image:before { padding-top: 86.2%; }
	.topic-container.news .controls a { width: 50px; height: 50px; margin-left: -20px; }
	.topic-container.news .controls a:before { line-height: 50px; font-size: 2.5em; text-ident: -5px; }
	.topic-container.news .controls a.nextBtn:before { text-indent: 5px; }
	.topic-container.news .controls a.nextBtn{margin-right: -20px;}

	.topic-container .block-title .money { display: inline-block; font-size: 1em; }
	
	.filter-box-container { display: none; }
	
	/* .cities .boundary .table.min-hide { border-spacing: 10px;}
	.cities .col { padding: 0; }
	.cities .table.min-hide { display: table; }
	.cities .max-hide { display: none !important; }
	.cities .col div { padding: 10px 0 !important; }
	.cities .col div span { display: block; } */
	
	.cities .boundary {padding:20px;}
	.cities .col div a { width:calc(25% - 15px); margin-right:20px; }
	.cities .col div a:nth-child(2n+0) { margin-right:20px; }
	.cities .col div a:nth-child(4n+0) { margin-right:0; }
	
	/* .cities .col div a { width:calc(16.666% - 8.333px); margin-right:10px; }
	.cities .col div a:nth-child(2n+0) { margin-right:10px; }
	.cities .col div a:nth-child(6n+0) { margin-right:0; } */
	.cities .col div a.min-hide {display:inline-block;}

	.footer .boundary { max-width: unset; width: 90%; }
	.footer .table .col { text-align: left; padding: 0; }
	.footer .table .col .table .col.last h3 { padding-left: 10px; }
	.footer .table .col .table .col.last table td i { margin-left: 10px; }
	.footer .table .col .table .col.last table tr td { padding: 0 0 8px 0; }
	.footer .table .col .table .col.last table tr td a { margin: 0 0 0 10px; }
	.footer .logo, .footer h2 { display: inline-block; font-size: 1.2em; text-transform: capitalize; }
	.footer .logo img { width: 40%; margin:0 auto;}
	.footer h2 span { display: inline-block; font-size: 1em; margin: 0; }
	.footer table tr td:first-child { padding: 0; padding-right: 10px; text-align: center; }
}

@media screen and (min-width: 1280px){
	.top-menu .main-menu ul.menu-content li { padding: 0 20px; }
	
	
	.top-news .boundary { width: 100%; }
	.top-news .boundary .table .col-lg-8 .small-block {  width: 48.68%; }
	.top-news .boundary .block, .top-news .boundary .small-block { margin-bottom: 15px; }
	.topic-container .block .square-image:before { padding-top: 82.2%; }

	.ultilities a { padding: 20px; }
	
	.cities .boundary .table.min-hide { border-spacing:20px;}

	.footer .table .col.right { padding-top: 6.4em; padding-left: 40px; }
	.footer .table .col.right .table .col-md-4 { width: 45% !important; }
	.footer .table .col.right .table .col-md-4.last { width: 10% !important; }
}
