@charset "utf-8";
/* CSS Document */
@import url("css/fonts.css");
* { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline: none; margin: 0; }
body { font-family: 'Roboto', sans-serif; line-height: 1.5; padding: 0; font-weight: 400; }
img { max-width: 100%; height: auto; vertical-align: middle; }
iframe { max-width: 100%; }
.grecaptcha-badge { display: none !important; }
a { text-decoration: none; outline: none; }
a:hover, a:focus { color: unset; outline: none; }
ul { visibility: visible; }
.clearfix { float: none; clear: both; }
.clearfix:before { content: ""; display: table; }
.clearfix:after { content: ""; clear: both; }
.table-responsive { width: 100%; overflow-x: auto; overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; }
#main { width: 100%; position: relative; }
#info { width: 100%; position: relative; padding: 15px 0; }
#info .noidung_detail { display: block; width: 100%; }
.box_fotorama { margin: auto; text-align: center; width: 90%; }
#info .noidung_detail .ngaydang { font-size: 14px; font-weight: 400; font-style: italic; background: url(images/calender.png) no-repeat left center; padding: 0 0 0 20px; }
#info .noidung_detail .noidung * { max-width: 100%; height: auto; }
#info .noidung_detail .noidung { margin: 10px 0; }
.addthis_inline_share_toolbox { width: 100%; display: flex; align-items: center; margin: 20px 0 0 0; }
.a2a_kit { vertical-align: top; }
.a2a_kit .a2a_svg { width: 30px; height: 30px; line-height: 30px; }
.margin_auto { width: 1200px; margin: 0 auto; }
#container { position: relative; transition: 0.5s all; background: #ffffff; margin: 0 auto; width: 100%; max-width: 1920px; }
main { position: relative; }
.bando iframe { width: 100%; display: block; }
#popup { display: none; padding: 0; max-width: 95%; }
.loading { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: none; z-index: 1; }
.updating { width: 100%; text-align: center; color: #000000; font-weight: 400; font-size: 15px; text-transform: uppercase; padding: 10px 0; }
.updating.white { color: #ffffff; }
.khung_flex { display: flex; flex-wrap: wrap; justify-content: space-between; }
.khung_flex.flex_center { align-items: center; }
.khung_flex.justify_star { justify-content: flex-start; }
.khung_flex.flex_end { align-items: flex-end; }
/* Zalo */
.zalo { display: block; width: 41px; height: 41px; position: fixed; left: calc(100% - 60px); bottom: 200px; z-index: 99; }
.zalo img { position: relative; z-index: 1; }
.kenit-alo-circle-fill { width: 60px; height: 60px; top: -10px; position: absolute; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid transparent; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; background-color: #0294e0; opacity: .75; right: -10px; }
.kenit-alo-circle { width: 50px; height: 50px; top: -5px; right: -5px; position: absolute; background-color: transparent; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid #0294e0; opacity: .1; opacity: .5; }
/* Facebook */
.js-facebook-messenger-container.closed, .js-facebook-messenger-tooltip.closed { display: none !important }
.js-facebook-messenger-tooltip { bottom: 97px; right: 97px }
.js-facebook-messenger-tooltip { color: #404040; background: #fff }
.js-facebook-messenger-box, .js-facebook-messenger-button, .js-facebook-messenger-tooltip { z-index: 999 }
.js-facebook-messenger-tooltip { display: none; position: fixed; text-align: center; border-radius: 10px; overflow: hidden; font-size: 12px; line-height: 1; padding: 10px; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: rgba(0, 0, 0, 0.15) 0 2pt 10pt; z-index: 1.0E+30 }
.js-facebook-messenger-close-tooltip { width: 10px; height: 10px; display: inline-block; cursor: pointer; margin-left: 10px }
.js-facebook-messenger-box.rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand }
.js-facebook-messenger-box.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both }
.js-facebook-messenger-box { bottom: 70px; right: 10px }
.js-facebook-messenger-box { background: #1182fc }
.js-facebook-messenger-box, .js-facebook-messenger-button, .js-facebook-messenger-tooltip { z-index: 999 }
.js-facebook-messenger-box { width: 60px; height: 60px; display: block; position: fixed; cursor: pointer; text-align: center; line-height: 60px; background: #1182FC; border-radius: 100%; overflow: hidden; -webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3) }
.js-facebook-messenger-box.rotate svg#fb-msng-icon { transform: rotate(0deg) }
.js-facebook-messenger-box svg#fb-msng-icon { width: 30px; height: 30px; position: absolute; top: 15px; left: 15px; opacity: 1; overflow: hidden; -webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out; -moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out; -o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out; transition: opacity 160ms ease-in-out, transform 160ms ease-in-out }
.js-facebook-messenger-box.rotate svg#close-icon { transform: rotate(-45deg) }
.js-facebook-messenger-box svg#close-icon { opacity: 0; width: 20px; height: 20px; position: absolute; top: 20px; left: 20px; -webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out; -moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out; -o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out; transition: opacity 160ms ease-in-out, transform 160ms ease-in-out }
.js-facebook-messenger-container { transform: translateY(50px); bottom: 110px; right: 35px }
.js-facebook-messenger-container, .js-facebook-messenger-container-button { z-index: 1000 }
.js-facebook-messenger-container { position: fixed; opacity: 0; display: none; width: 300px; border-radius: 10px; pointer-events: none; box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06), 0 2px 32px rgba(0, 0, 0, 0.16); -webkit-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out; -moz-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out; -o-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out; transition: transform 160ms ease-in-out, opacity 160ms ease-in-out }
.js-facebook-messenger-top-header { width: 300px; line-height: 25px; }
.js-facebook-messenger-top-header { color: #fff; background: #1182fc }
.js-facebook-messenger-top-header { display: block; position: relative; width: 300px; background: #1182FC; color: #fff; text-align: center; line-height: 1; padding: 10px; font-size: 14px; border-top-left-radius: 10px; border-top-right-radius: 10px }
.js-facebook-messenger-container iframe, .js-facebook-messenger-container-button iframe { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px }
.js-facebook-messenger-box, .js-facebook-messenger-button, .js-facebook-messenger-tooltip { z-index: 999 }
.js-facebook-messenger-container, .js-facebook-messenger-container-button { z-index: 1000 }
.js-facebook-messenger-top-header { color: #fff; background: #1182fc }
.js-facebook-messenger-box { background: #1182fc }
.js-facebook-messenger-top-header { width: 300px }
.js-facebook-messenger-tooltip { color: #404040; background: #fff }
.js-facebook-messenger-box { bottom: 120px; right: 10px }
.js-facebook-messenger-container { transform: translateY(50px); bottom: 150px; right: 50px; }
.js-facebook-messenger-container.open { transform: translateY(0px); opacity: 1; pointer-events: all; display: block; }
.js-facebook-messenger-tooltip { bottom: 97px; right: 97px }
.js-facebook-messenger-box.open svg#fb-msng-icon { opacity: 0 }
.js-facebook-messenger-box.rotate.open svg#close-icon { transform: rotate(0deg) }
.js-facebook-messenger-box.open svg#close-icon { opacity: 1 }
/* Goi dien */
.toolbar { display: inline-block; width: 100%; padding: 10px 0; left: 0; bottom: 0; position: fixed; z-index: 9999999; height: auto; display: none; height: 50px; box-shadow: 0px -1px 4px #00000052; background: #1865D9; }
.toolbar ul { list-style: none; padding: 0; }
.toolbar ul li { position: relative; text-align: center; float: left; width: calc(100% / 4); line-height: 1; }
.toolbar ul li a { display: block; width: 100%; }
.toolbar ul li a span { font-weight: 500; color: #ffffff; font-size: 13px; display: block; font-family: Muli, sans-serif; text-transform: capitalize; }
.toolbar ul li a img { height: 15px; width: auto; margin-bottom: 5px; }
.toolbar ul li.actived .wrap_multiphone { display: block; }
.wrap_multiphone { width: 200px; display: none; position: absolute; bottom: 60px; left: 10px; border-radius: 10px; border: 1px solid #ddd; padding: 5px 20px; background: #fff; }
.wrap_multiphone a { color: #333 !important; display: block; line-height: 25px !important; }
/* MXH */
.mangxh h4 { margin-top: 8px; font-size: 16px; color: #fff; }
.mangxh a { padding: 2px 5px 0px 5px; }
.lienket { position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.lienket a { display: inline-block; margin-left: 2px; }
.lienket a:first-child { margin-left: 0; }
.lienket a:hover img { transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transition: all 1s; }
.lienket_r { position: fixed; right: 0; top: 50%; transform: translateY(-50%); border-radius: 5px 0 0 5px; overflow: hidden; box-shadow: 0 0 2px #ffffff; }
.lienket_r a { display: block; border-bottom: 1px solid #ffffff; }
.lienket_r a:last-child { border: 0; }
/* Header */
#header { width: 100%; position: relative; z-index: 2; background: #ffffff; }
#quangcao { background: #0C50A8; }
#header .header { background: #D80010; }
#header .header p { font-size: 15px; color: #ffffff; font-weight: 400; max-width: 125px; }
#header .header p span { display: block; font-size: 15px; color: #fde770; }
/* Main menu */
#mainmenu { width: 100%; position: relative; background: #1865D9; }
#mainmenu.fixed { position: fixed; top: 0; left: 0; z-index: 999; box-shadow: 0px 1px 5px #000000bd; }
nav.menu_top > ul > li ul li a, nav.menu_top > ul > li ul li { -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; -ms-transition: all 0.25s linear; -o-transition: all 0.25s linear; transition: all 0.25s linear; }
.menubar { width: 100%; }
nav.menu_top { width: calc(100% - 230px); }
nav.menu_top > ul { width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; list-style: none; padding: 0; margin: 0; }
nav.menu_top > ul > li.icon > a { font-size: 15px; position: relative; display: block; z-index: 1; font-weight: 400; line-height: 50px; color: #ffffff; text-transform: uppercase; border-right: 1px solid #054EBC; border-left: 1px solid #3479E2; }
nav.menu_top > ul > li.icon:first-child > a { border-left: 0; }
nav.menu_top > ul > li.icon.end { border-right: 1px solid #3479E2; }
nav.menu_top > ul > li.icon { position: relative; list-style: none; text-align: center; flex: auto; }
nav.menu_top > ul > li.icon.active > a, nav.menu_top > ul > li.icon:hover > a { color: #fff300; }
nav.menu_top > ul > li > ul > li:hover > a, nav.menu_top > ul > li > ul > li > ul > li:hover > a, nav.menu_top > ul > li > ul > li > ul > li > ul > li:hover > a { background: #339933; color: #ffffff; }
nav.menu_top > ul > li ul { visibility: hidden; list-style: outside none none; margin: 0; min-width: 230px; padding: 0; position: absolute; z-index: 999; top: 100%; left: 0; text-indent: 0; font-weight: 400; }
nav.menu_top > ul > li ul::-webkit-scrollbar { width: 3px; }
nav.menu_top > ul > li ul::-webkit-scrollbar-track { box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); }
nav.menu_top > ul > li ul::-webkit-scrollbar-thumb { background-color: darkgrey; outline: 1px solid slategrey; }
nav.menu_top > ul > li ul li ul { left: calc(100% - 1px); top: 0; }
nav.menu_top > ul > li.end ul li ul { left: unset; right: calc(100% - 1px); }
nav.menu_top > ul > li:hover > ul, nav.menu_top > ul > li ul li:hover > ul { visibility: visible }
nav.menu_top > ul > li ul li { display: table; padding: 0; width: 100%; opacity: 0; z-index: 999; line-height: 20px; position: relative; -webkit-transform: translateY(30px); -moz-transform: translateY(30px); -ms-transform: translateY(30px); -o-transform: translateY(30px); transform: translateY(30px); }
nav.menu_top > ul li:hover > ul > li, nav.menu_top > ul > li ul li:hover > ul li { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); }
nav.menu_top > ul > li ul li a { color: #000000; font-size: 15px; height: auto; margin: 0px; text-align: left; width: 100%; border: none; font-weight: 400; padding: 8px 10px; display: inline-block; border: 1px solid #0000001a; background: #ffffff; border-bottom: 0; text-transform: capitalize; }
nav.menu_top > ul > li ul li:last-child a { border-bottom: 1px solid #00000036; }
nav.menu_top > ul > li:hover ul li { color: #fff; }
nav.menu_top > ul > li a i { margin-left: 10px; position: relative; top: 0; }
nav.menu_top > ul > li.slogan { padding-left: 20px; flex: auto; line-height: 1; width: 350px; }
nav.menu_top > ul > li.slogan marquee { font-size: 19px; font-weight: 900; color: #fff300; font-style: italic; text-shadow: 0 0 4px #000000e0; }
/* Title */
.title { width: 100%; position: relative; text-align: center; border-bottom: 2px solid #ECECEC; padding: 0 0 15px 0; margin: 0 0 25px 0; }
.title p { font-size: 15px; color: #000000; font-weight: 500; }
.title h4, .title h2 { font-size: 22px; position: relative; color: #ee0808; font-weight: 700; text-transform: uppercase; }
.title p { font-size: 22px; color: #808080; font-weight: 300; font-style: italic; font-family: SFUGaramondCondensedLight; position: relative; text-indent: 30px; }
.title p:before { position: absolute; content: ''; width: 25px; height: 1px; background: #000000; bottom: 7px; left: 0; }
.title.title_center { text-align: center; }
.title.title_center p { text-indent: 0; }
.title.title_center p:before { display: none; }
.title.white h4, .title.white h2 { color: #ffffff; }
.tab_duan { list-style: none; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; position: absolute; right: 0; top: 10px; }
.tab_duan.tab_detail { margin: 0 0 20px 0; }
.tab_duan li { font-size: 18px; color: #353535; font-weight: 300; cursor: pointer; padding: 0 20px; line-height: 1; text-transform: uppercase; border-right: 1px solid #A2A2A2; border-left: 1px solid #D2D2D2; }
.tab_duan li.active, .tab_duan li:hover { color: #339933; }
.tab_duan li:first-child { border-left: 0; padding-left: 0; }
.tab_duan li:last-child { border-right: 0; padding-right: 0; }
/* Slider */
.box_index { display: block; background: #EFEFEF; padding-bottom: 25px; }
#slider { width: 100%; position: relative; padding: 3px 3px 0 0; display: flex; justify-content: flex-end; background: #ffffff; }
#slider .slider { width: 687px; }
#slider .qc_slider { width: 270px; margin: -0.6px 0; margin-left: 7px; }
#slider .qc_slider .slick-slide { margin: 0.6px 0; }
/*  */
#sp_info { display: flex; flex-wrap: wrap; justify-content: space-between; }
.frame_images { padding: 0; width: 460px; position: relative; }
.MagicZoom { width: 100%; text-align: center; background: #ffffff; }
.app-figure { width: 100%; }
.selectors { width: 100%; margin: 10px 0 0 0; }
.list_carousel { width: 100%; position: relative; }
.list_carousel ul { margin: 0; padding: 0; list-style: none; display: block; }
.list_carousel #foo3 { margin: 0 -4px; }
.foo3_video { position: relative; }
.foo3_video img:nth-child(2) { position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; z-index: 1; }
.list_carousel .slick-slide { margin: 0 4px; }
.foo3_l { position: absolute; top: calc(50% - 20px); left: 5px; z-index: 99; cursor: pointer; background: #ffffff7a; padding: 5px; width: 25px; }
.foo3_r { position: absolute; top: calc(50% - 20px); right: 5px; z-index: 99; cursor: pointer; background: #ffffff7a; padding: 5px; width: 25px; }
.list_carousel li { display: none; border: 1px solid #dddddd; }
.list_carousel li img { display: block; }
.list_carousel li a { text-decoration: none; }
.list_carousel li a h3 { color: #835410; text-align: center; font-weight: 500; margin-top: 10px; font-size: 16px; margin-bottom: 10px; text-transform: uppercase; }
.list_carousel.responsive { width: auto; margin-left: 0; }
.pager { width: 320px; text-align: center; }
.pager a { margin: 0 5px; text-decoration: none; }
.pager a.selected { text-decoration: underline; }
.timer { background-color: #999; height: 6px; width: 0px; }
.prev13 { width: 12px; height: 19px; position: absolute; z-index: 10; background: url(images/left_ow.png) no-repeat; top: 50%; left: 0; transform: translate(0, -50%); }
.next13 { width: 12px; height: 19px; position: absolute; z-index: 10; background: url(images/right_ow.png) no-repeat; top: 50%; right: 0; transform: translate(0, -50%); }
.caroufredsel_wrapper { width: 100% !important; }
/* Khung thong tin */
.product_ct { width: 100%; }
.khung_product_detail { margin-bottom: 30px; }
#container_product {     /* margin: 20px 0 0 0; */ }
#container_product .noidung_tab { width: 100%; display: block; }
div#container_product #tabs { overflow: hidden; display: flex; border: 1px solid #ebebeb; position: relative; list-style: none; margin: 0; padding: 0; width: 100%; background: #ffffff; }
div#container_product #tabs.fixed { position: fixed; top: 40px; left: 50%; transform: translateX(-50%); z-index: 2; max-width: 1200px; }
div#container_product #tabs li { text-transform: uppercase; }
div#container_product #tabs li.active { background: #ffffff; border-bottom: none; position: relative; border-top: 2px solid #0D3C00; top: 0px; }
div#container_product #tabs li { padding: 8px 20px; list-style: none; text-align: center; border-right: 1px solid #dddddd; font-weight: 400; }
div#container_product #tabs li a { color: #000000; font-size: 14px; text-decoration: none; cursor: pointer; }
.noidung_ta { padding: 10px; }
.khung_thongtin { width: calc(100% - 480px); }
.khung_thongtin > a { background: #70eea0; color: #ffffff; padding: 5px 30px; display: inline-block; margin: 10px 0; text-transform: uppercase; cursor: pointer; }
.khung_thongtin .addthis_inline_share_toolbox { width: 100%; }
.khung_thongtin > .it_detail { font-weight: 500; font-size: 14px; padding: 5px 0; width: 100%; border-top: 1px dashed #dddddd; position: relative; }
.khung_thongtin > .it_detail label { color: #333333; font-weight: 400; }
.khung_thongtin > .it_detail > a { font-size: 14px; font-weight: 700; color: #1865d9; }
.khung_thongtin > .it_detail > a:hover { color: #dd0000; }
.khung_thongtin h1 { font-size: 18px; color: #0049B6; padding: 0 0 10px 0; text-transform: uppercase; font-weight: 900; }
.khung_thongtin b { font-weight: 100; margin: 0 10px 0 0; font-weight: 500; }
.khung_thongtin span.giacu { text-decoration: line-through; color: #808080; font-weight: 400; }
.khung_thongtin span.giaban, .khung_thongtin span.giaban a { color: #e21616; font-size: 17px; font-weight: 700; }
.khung_thongtin .dathang { color: #fff; display: inline-block; font-family: 'Lato', sans-serif; font-weight: 500; font-size: 14px; cursor: pointer; text-transform: uppercase; }
.khung_thongtin .dathang img { width: 300px; }
.plugin a { font-size: 14px; color: #333333; font-weight: 400; margin: 0 20px 0 0; }
.plugin a:hover { color: #f03495; }
#social-air-sp { display: inline-flex; }
#social-air-sp img { display: inline-block !important; }
.zalo-share-button img { width: 30px !important; }
/* buy product detail */
.input-number { padding: 5px 8px; border: 1px solid #c9c9c9; width: 50px; margin: 0 0 0 7px; }
.add_to_cart { width: 100%; margin: 5px 0 0 0; }
.add_to_cart a { display: inline-block; font-family: 'Lato', sans-serif; font-size: 13px; color: #ffffff; border-radius: 3px; cursor: pointer; font-weight: 400; }
.add_to_cart a.buy { background: #326e52 url(images/icon_add_cart_white.svg) no-repeat 10px center; background-size: 30px; padding: 8px 10px 8px 40px; }
.add_to_cart a.muangay { background: #ff6600 url(images/icon_buy_now.svg) no-repeat 10px center; background-size: 20px; padding: 8px 10px 8px 40px; }
.add_to_cart a.tragop { background: #d60c0c url(images/tragop.png) no-repeat 10px center; background-size: 20px; padding: 8px 10px 8px 40px; }
/* Search */
#timkiem { width: 400px; position: relative; }
#timkiem ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 0; margin: 0; }
#timkiem ul li { }
#timkiem ul li:hover a, #timkiem ul li.active a { color: #fde770; }
#timkiem ul li a { text-transform: uppercase; font-size: 15px; color: #ffffff; }
#timkiem form { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; margin: 5px 0 0 0; box-shadow: 0 0 0 1px #ffffff96; }
.frm_timkiem input { color: #2b2b2b; padding: 7px 10px; transition: opacity 0.5s, width 0.5s; outline: none; font-family: 'Roboto', sans-serif; font-weight: 400; font-size: 12px; border: none; background: #ffffff; border-bottom: 1px solid #ffffff; }
.frm_timkiem input.show { width: calc(100% - 30px); z-index: 1; visibility: visible; }
.frm_timkiem button { cursor: pointer; outline: none; border: none; display: inline-block; background: #D1D2D4 url('images/search.png') no-repeat center; z-index: 1; width: 30px; height: 30px; }
.frm_timkiem input::-webkit-input-placeholder { color: #2b2b2b; }
.frm_timkiem input:-moz-placeholder { color: #2b2b2b; }
.frm_timkiem input::-moz-placeholder { color: #2b2b2b; }
.frm_timkiem input:-ms-input-placeholder { color: #2b2b2b; }
/* Menu left */
.isfixed { position: -webkit-sticky !important; position: sticky !important; top: 60px; }
#left h4 { position: relative; z-index: 2; text-transform: uppercase; display: block; font-weight: 700; color: #ffffff; background: #339933 url(images/danhmuc.png) no-repeat 15px center; text-align: center; padding: 0; font-size: 14px; line-height: 40px; }
#left h4 a { color: #ffffff; }
.danhmuc { width: 100%; display: block; margin: 0 0 20px 0; position: relative; background: #FFFFFF; }
.danhmuc .title_dm { line-height: 45px; background: #3188ef url(images/danhmuc.png) no-repeat 20px center; text-align: center; font-size: 15px; color: #ffffff; font-weight: 700; text-transform: uppercase; }
.danhmuc_l { list-style: none; padding: 0; border-top: 0; }
.danhmuc_l::-webkit-scrollbar { width: 3px; }
.danhmuc_l::-webkit-scrollbar-track { box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); }
.danhmuc_l::-webkit-scrollbar-thumb { background-color: darkgrey; outline: 1px solid slategrey; }
.danhmuc_l li { position: relative; }
.danhmuc_l > li i { position: absolute; right: 0; top: 10px; cursor: pointer; width: 20px; height: 20px; line-height: 20px; text-align: center; font-size: 20px; }
.danhmuc_l li.active > a {     /* background: #eeeeee; */ }
.danhmuc_l li:hover > a, .danhmuc_l > li.active > a { color: #0049B6; }
.danhmuc_l li > a { font-size: 14px; color: #000000; display: block; }
.danhmuc_l > li > a { font-weight: 500; padding: 10px 0; border-top: 1px solid #ededed; text-transform: uppercase; }
.danhmuc_l > li > ul li a { font-weight: 400; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.danhmuc_l > li:first-child > a { border-top: 0; }
.danhmuc_l > li > ul > li > ul > li {     /* text-indent: 10px; */ }
.danhmuc_l > li ul { top: 0; list-style: outside none none; border: none; display: none; border-left: 1px solid #dddddd; }
.danhmuc_l > li.active ul { display: block; }
.danhmuc_l > li > ul li { border: none; color: #333333; padding: 8px 5px 8px 10px; left: -1px; border-left: 1px solid transparent; }
.danhmuc_l > li > ul li:hover { border-left: 1px solid #0049B6; }
.danhmuc_l > li > ul li a { }
.danhmuc_l > li > ul li a span { color: #858585; }
.danhmuc_l ul { list-style: none; padding: 0; }
.danhmuc_l > li:hover > ul { visibility: visible; }
/* Menu danh muc */
#mainmenu.fixed #menu_danhmuc .list_danhmuc, #mainmenu.no-index #menu_danhmuc .list_danhmuc { display: none; }
#menu_danhmuc:hover .list_danhmuc { display: block !important; }
#menu_danhmuc { width: 230px; position: relative; }
#menu_danhmuc h4 a { font-size: 15px; color: #ffffff; line-height: 50px; font-weight: 700; display: block; text-transform: uppercase; background: #0049B6 url(images/dm.png) no-repeat 20px center; text-indent: 50px; }
#menu_danhmuc .list_danhmuc { position: absolute; top: 100%; left: 0; width: 100%; z-index: 2; }
#menu_danhmuc .list_danhmuc > ul { max-height: 400px; overflow: auto; }
#menu_danhmuc .list_danhmuc > ul { list-style: none; padding: 0; background: #ffffff; border: 1px solid #EFEFEF; border-top: 0; }
#menu_danhmuc .list_danhmuc > ul > li > a { font-size: 14px; font-weight: 400; color: #2b2b2b; display: block; border-bottom: 1px solid #EFEFEF; position: relative; padding: 4.4px 10px; }
#menu_danhmuc .list_danhmuc > ul > li > a > img { margin-right: 10px; }
#menu_danhmuc .list_danhmuc > ul > li:hover > a { color: #ff0000; }
#menu_danhmuc .list_danhmuc > ul > li:last-child a { border-bottom: 0; }
#menu_danhmuc .list_danhmuc > ul::-webkit-scrollbar { width: 3px; }
#menu_danhmuc .list_danhmuc > ul::-webkit-scrollbar-track { box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); }
#menu_danhmuc .list_danhmuc > ul::-webkit-scrollbar-thumb { background-color: darkgrey; outline: 1px solid slategrey; }
#menu_danhmuc .list_child { position: absolute; left: 100%; top: 0; display: none; }
#menu_danhmuc .list_child > ul::-webkit-scrollbar { width: 3px; }
#menu_danhmuc .list_child > ul::-webkit-scrollbar-track { box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); }
#menu_danhmuc .list_child > ul::-webkit-scrollbar-thumb { background-color: darkgrey; outline: 1px solid slategrey; }
#menu_danhmuc .list_danhmuc > ul > li:hover > .list_child { width: calc(1200px - 230px); transition: visibility 0.5s; display: block; background: #ffffff; }
#menu_danhmuc .list_child > ul { list-style: none; padding: 10px 0; display: flex; flex-wrap: wrap; height: 397px; max-height: 400px; overflow: auto; border: 1px solid #EFEFEF; border-left: 0; box-shadow: 1px 1px 1px 0px #0000001f; }
#menu_danhmuc .list_child > ul > li { width: 20%; padding: 0 10px; }
#menu_danhmuc .list_child > ul > li > a { display: block; text-transform: uppercase; font-weight: 500; color: #000; font-size: 13px; border-bottom: solid 1px #dddddf; padding: 0 0 5px 0; }
#menu_danhmuc .list_child > ul > li > ul { list-style: none; padding: 0; }
#menu_danhmuc .list_child > ul > li > ul > li > a { font-size: 14px; color: #333333; font-weight: 400; display: block; padding: 5px 0; }
#menu_danhmuc .list_child > ul > li > ul > li:hover > a { color: #ff0000; }
/* Tin khac */
.visit_hidden { visibility: hidden; height: 0; }
.tinkhac { width: 100%; margin: 0; display: block; }
.tinkhac ul { margin: 0; padding: 0; }
.tinkhac ul li { width: 100%;     /* line-height: 30px; */ list-style: none; display: inline-flex; align-items: baseline; }
.tinkhac li a { color: #000000; font-size: 15px; font-weight: 400; text-indent: 0px; display: inline-block; transition: all 0.5s; }
.tinkhac li a img:hover { opacity: 0.5; }
.tinkhac li a i { margin-right: 10px; }
.tinkhac li:hover a { color: #0049b6; text-indent: 10px; }
ul.pagination { text-align: center; color: #829994; }
ul.pagination li { display: inline; padding: 0 3px; }
ul.pagination a { color: #fff; display: inline-block; padding: 5px 10px; border: 1px solid #cde0dc; text-decoration: none; background: #333333; font-size: 12px; }
ul.pagination a:hover, ul.pagination a.current { background: #0d7963; color: #fff; }
.page_info { display: none !important; }
/* ========== Content pagination ========== */
.paging { width: 100%; text-align: center; margin: 20px 0px 0px 0px; }
.paging .pagination { margin: auto; float: unset; width: auto !important; text-align: center; margin: 0; padding: 0; }
.pages li.prev { margin-right: 15px; }
.pages li.next { margin-left: 15px; }
.pages li { display: inline-block; margin: 5px 2px; }
.pages li a { height: 25px; padding: 4px 8px; text-decoration: none; color: #666666; font-weight: bold; background: url(../images/backgrounds/pagingBg.png) repeat-x 0 0; border: 1px solid #d5d5d5; font-size: 11px; }
.pages li a:hover { background: #f6f6f6; }
.pages li .active { background: url(../images/backgrounds/sideGradient.png) repeat-x; color: #fff; border-color: #424852; }
.pages li .active:hover { background: #2a313d; }
/* Thong ke */
.thongke { list-style: none; padding: 0; display: block; width: 300px; }
.thongke ul { list-style: none; font-size: 14px; color: #ffffff; font-weight: 400; background: url(images/thongke.png) no-repeat left center; padding: 0 0 0 30px; line-height: 35px; }
/* Thanh title */
.thanh_title { width: 100%; position: relative; margin: 0 0 30px 0; text-align: center; font-family: 'Barlow Semi Condensed', sans-serif; padding: 0 0 20px 0; }
.thanh_title h2, .thanh_title h4 { font-size: 36px; font-weight: 700; display: block; color: #333333; text-transform: uppercase; font-family: 'Roboto Condensed', sans-serif; }
.thanh_title p { font-size: 15px; color: #5c5c5c; font-weight: 400; }
.thanh_title:after { position: absolute; content: ''; width: 80px; height: 3px; background: #0068BD; bottom: 0; left: 50%; transform: translateX(-50%); }
/* Gioi thieu */
#gioithieu { width: 100%; position: relative; padding: 50px 0; }
.title_gt { position: relative; }
.title_gt h2 { font-size: 45px; color: #353535; font-weight: 300; text-transform: uppercase; line-height: 1; }
.title_gt p { font-size: 22px; color: #808080; font-weight: 300; font-style: italic; font-family: SFUGaramondCondensedLight; position: relative; text-indent: 30px; }
.title_gt p:before { position: absolute; content: ''; width: 25px; height: 1px; background: #000000; bottom: 7px; left: 0; }
.gioithieu > .noidung { width: 405px; max-width: 100%; }
.gioithieu > .noidung .mota { margin: 25px 0 40px 0; }
.gioithieu .xemthem { font-size: 15px; color: #333333; font-weight: 500; padding: 10px 20px; position: relative; display: table; text-transform: uppercase; border: 2px solid #339933; }
.gioithieu .xemthem:hover { background: #339933; color: #ffffff; }
.slick_lienket { width: 770px; display: none; margin: 0 -9px; }
.slick_lienket .slick-slide { margin: 0 9px; }
.slick_lienket .lk { position: relative; }
.slick_lienket .noidung { position: absolute; bottom: 0; left: 0; padding: 20px 14px; width: 100%; background-image: linear-gradient(to top, #000000b5, #0000); }
.slick_lienket .noidung h3 a { font-size: 30px; color: #ffffff; font-weight: 300; text-transform: uppercase; }
.slick_lienket .noidung p { font-size: 20px; color: #ffffff; font-weight: 100; font-family: SFUGaramondCondensedLight; font-style: italic; overflow: hidden; text-overflow: ellipsis; line-height: 25px; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; position: relative; text-indent: 30px; }
.slick_lienket .noidung p:before { position: absolute; content: ''; width: 25px; height: 1px; background: #ffffff; bottom: 5px; left: 0; }
/*Tin tức*/
.box_news { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 20px; }
.box_news .news { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 5px; border-radius: 3px; box-shadow: 0 0 5px #00000040; }
.box_news .news .img a { display: table; margin: 0 auto; }
.box_news .news .noidung { width: calc(100% - 150px); }
.box_news .news:hover h3 a { color: #0049b6; }
.box_news .news h3 { margin-bottom: 5px; }
.box_news .news h3 a { font-size: 15px; color: #000000; font-weight: 700; overflow: hidden; text-overflow: ellipsis; line-height: 20px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; }
.box_news .news .mota { font-size: 14px; color: #333333; font-weight: 400; overflow: hidden; text-overflow: ellipsis; line-height: 20px; -webkit-line-clamp: 4; display: -webkit-box; -webkit-box-orient: vertical; margin: 0; text-align: justify; }
.box_news .news .ngaydang { font-weight: 400; font-size: 14px; color: #a7a0a0; font-style: italic; }
/*Điều hướng*/
#banner_detail img { width: 100%; }
.dieuhuong { width: 100%; padding: 10px 0; position: relative; border-bottom: 1px solid #dddddd; border-top: 1px solid #dddddd; }
.dieuhuong a { color: #000000; font-size: 14px; padding: 0px 10px; position: relative; font-weight: 400; display: inline-block; }
.dieuhuong a:first-child { padding: 0 10px 0 0; }
.dieuhuong a:first-child i { margin-right: 5px; font-size: 16px; color: #191919; font-weight: 100; }
.dieuhuong a:before {     /* font-family: FontAwesome; */
position: absolute; content: '/'; right: -5px; top: 0; }
.dieuhuong a:last-child, .dieuhuong a:hover { color: #0049B6; }
.dieuhuong a:last-child:before { display: none; }
.noidung_tt { width: calc(100% - 380px); }
.noidung_tt .hinhanh { margin-bottom: 20px; }
/*Tab*/
.khung_tab { width: 100%; display: none; }
.khung_tab.active { display: block; }
.tags_sp a { display: inline-block; font-size: 14px; color: #333333; padding: 5px 10px; border: 1px solid #dddddd; margin: 0 0 5px 0; }
.tags_sp a:hover { color: #ed1c24; border-color: #ed1c24; }
/* sp noi bat  */
.khung_other { margin-top: 20px; width: 100%; }
.slick_spkhac { display: none; margin: 0 -5px; }
.slick_spkhac .slick-slide { margin: 0 5px; }
#sanpham { background: #ffffff; padding: 15px 0; }
#giatot { background: url(images/bggiatot1.png) no-repeat 20px 10px, url(images/bggiatot2.png) no-repeat center; background-size: auto, cover; padding: 10px; margin: 0 0 15px 0; }
.title_giatot { text-align: center; margin: 0 0 10px 0; }
.title_giatot h2 { font-size: 27px; color: #feeb00; font-weight: 700; text-transform: uppercase; font-style: italic; }
.box_giasoc .sanpham { grid-template-columns: repeat(5, 1fr); grid-gap: 0; margin: 0; border-bottom: 1px solid #dddddd; }
.box_giasoc .sanpham .bao_item { padding: 10px 15px; border-top: 1px solid #0053DD; border: 1px solid #EFEFEF; margin: -0.5px; position: relative; padding-bottom: 55px; }
.slick_danhmuc { display: none; list-style: none; padding: 20px 20px; }
.slick_danhmuc li { margin: 0 20px; }
.slick_danhmuc li a { font-size: 14px; color: #2b2b2b; font-weight: 400; display: block; }
.slick_danhmuc li:hover a { color: #ff0000; }
.bao_sp { background: #ffffff; padding: 10px; overflow: hidden; }
.slick_sp { margin: 0 -15px; }
.slick_sp .spl { position: absolute; left: 5px; top: calc(50% - 28px); z-index: 1; }
.slick_sp .spr { position: absolute; right: 5px; top: calc(50% - 28px); z-index: 1; transform: rotateZ(180deg); }
.slick_sp .slick-slide { margin: 0 15px; }
.slick_sp .item .noidung[data-sale]:before { position: absolute; content: attr(data-sale); width: 41px; height: 45px; line-height: 44px; text-align: center; z-index: 1; font-size: 13px; color: #fde770; font-weight: 400; right: 0; top: -25px; background: url(images/sale1.png) no-repeat bottom center; margin: 0; padding: 0; }
.slick_sp .item .gia .giaban { color: #e132a0; }
.title_sp { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 20px; }
.title_sp h2 { font-size: 16px; color: #ffffff; font-weight: 700; text-transform: uppercase; background: #0053DD; padding: 10px 30px; cursor: pointer; }
.tab_sp { list-style: none; display: flex; align-items: center; padding: 0; margin: 0 0 0 20px; }
.tab_sp li { font-size: 14px; color: #2b2b2b; font-weight: 400; margin: 0 10px; cursor: pointer; }
.tab_sp li:hover, .tab_sp li.active { color: #dd0000; }
.slick_img { display: none; margin: 0 0 15px 0; }
.slick_img .slick-slide { margin: 0 5px; }
.khung_sp { padding: 15px 0; }
.khung_sp a.xemtatca { display: table; margin: 0 auto; margin-top: 20px; font-size: 14px; color: #ffffff; font-weight: 400; text-transform: uppercase; background: #EE0808; padding: 10px 40px; border-radius: 5px; }
.khung_sp a.xemtatca:hover { background: #0053DD; }
/* Nhận tin */
#nhantin { display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1366px; margin: 0 auto; }
#nhantin .bando { width: calc(100% - 560px); }
#nhantin .bando iframe { height: 100%; }
.nhantin { position: relative; display: flex; flex-wrap: wrap; align-items: center; }
.nhantin h4 { background: url(images/email.png) no-repeat left center; font-size: 14px; color: #393939; font-weight: 700; padding: 20px 50px 20px 65px; border-right: 1px solid #f4f4f4; }
.nhantin p { font-size: 13px; color: #000000; font-weight: 400; margin: 0 50px; }
.dknhantin { position: relative; width: 335px; display: block; display: flex; flex-wrap: wrap; justify-content: space-between; }
.dknhantin .input { width: calc(100% - 75px); padding: 10px; font-size: 13px; color: #b0b0b0; background: #ffffff; font-family: 'Roboto', sans-serif; font-weight: 400; border: 1px solid #C2C2C2; border-right: 0; }
.dknhantin textarea.input { width: 100%; }
.dknhantin input[type=submit] { color: #ffffff; cursor: pointer; font-size: 14px; font-weight: 400; font-family: 'Roboto', sans-serif; border: none; text-align: center; text-transform: uppercase; background: #E90000; width: 75px; }
.dknhantin input[type=submit]:hover { background: #000000; }
.dknhantin p { font-size: 14px; color: #000000; font-weight: 500; background: url(images/check.png) no-repeat left center; padding: 0 0 0 30px; margin: 20px 0 0 0; width: 100%; }
.dknhantin .input::-webkit-input-placeholder { color: #a1a1a1; }
.dknhantin .input:-moz-placeholder { color: #a1a1a1; }
.dknhantin .input::-moz-placeholder { color: #a1a1a1; }
.dknhantin .input:-ms-input-placeholder { color: #a1a1a1; }
/* Footer */
#footer { width: 100%; position: relative; }
#footer .tieude_f { font-size: 14px; color: #000000; font-weight: 500; margin: 0 0 15px 0; text-transform: uppercase; }
#footer .thongtin_ct .tieude_f, #footer .nhantin .tieude_f { border: none; margin: 0 0 10px 0; padding: 0; }
#footer .footer { padding: 35px 0; background: #EEEEEE; }
#footer .thongtin_ct { width: 350px; }
#footer .facebook { width: 270px; }
/* Chinh sach */
.chinhsach { width: 230px; }
.chinhsach ul { width: 100%; list-style: none; padding: 0; }
.chinhsach ul li { font-weight: 400; margin-bottom: 5px; position: relative; }
.chinhsach ul li:before { position: absolute; content: ''; left: 0; top: 6px; width: 0; height: 0; border-top: 3px solid transparent; border-bottom: 3px solid transparent; border-left: 5px solid #000000; }
.chinhsach ul li a { font-size: 13px; color: #393939; font-weight: 400; display: block; text-indent: 15px; }
.chinhsach ul li:hover a { color: #e90000; }
/* coppy */
.coppy { font-weight: 400; font-size: 13px; color: #5d5d5d; position: relative; line-height: 25px; padding: 15px 0; background: #EEEEEE; }
.coppy a { font-weight: 500; text-transform: uppercase; color: #5d5d5d; }
.coppy ul { list-style: none; padding: 0; color: #ffffff; font-weight: 400; display: flex; flex-wrap: wrap; justify-content: center; }
.coppy ul li:nth-child(2) { margin: 0 20px; }
/* back to top  */
#back-to-top { width: 55px; height: 55px; cursor: pointer; z-index: 2; position: fixed; bottom: 55px; right: 12px; background: #1865D9; border-radius: 50%; box-shadow: 0 0 5px #00000087; }
#back-to-top:before { position: absolute; font-family: FontAwesome; content: "\f102"; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 25px; color: #ffffff; }
/* Mang XH*/
.mang_xh { position: relative; width: 100%; display: flex; flex-wrap: wrap; align-items: center; margin: 20px 0 0 0; }
.mang_xh label { font-size: 14px; font-weight: 300; }
.mang_xh a { margin: 0 0 0 10px; display: inline-block; }
.mang_xh a img { vertical-align: middle; display: block; }
.mang_xh a:hover img { transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transition: all 1s; }
/* contact */
.khung_contact { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 0 20px 0; }
.khung_contact .noidung_detail { margin-bottom: 20px; }
.khung_contact .bando { width: 100%; margin-top: 20px; }
.khung_trai, .khung_phai { width: 48%; }
.thongtin_lh { width: 100%; padding: 0px 40px 20px 0px; }
.thongtin_lh h1 { font-size: 20px; text-transform: uppercase; color: #04608B }
.form_lh { max-width: 100%; width: 600px; margin: 0 auto; }
.form_lh h4 { font-weight: 700; font-size: 35px; color: #000000; margin-bottom: 20px; }
.form_lh p.mxn { width: 100%; }
.form_lh p.mxn > b { padding: 0px 20px 0px 0px; }
.form_lh p.mxn input { width: 100px; }
.form_lh p { margin-bottom: 20px; width: 100%; display: inline-block; }
.form_lh p input, .form_lh p textarea { padding: 10px 0; width: 100%; border: none; border-bottom: 1px solid #dddddd; font-weight: 500; border-radius: unset; font-family: 'Roboto', sans-serif; }
.form_lh p label { display: block; font-size: 15px; font-weight: 400; color: #333333; }
.form_lh button { border: 0px; background: #1865d9; padding: 10px 35px; border-radius: 40px; margin: 0; color: #ffffff; cursor: pointer; text-transform: uppercase; font-weight: 500; font-family: 'Roboto', sans-serif; }
.form_lh button:hover { background: #c60700; }
.form_contact { padding: 0 0 10px 0; }
#form_contact input { padding: 5px; }
.box_map { width: 100%; position: relative; margin-top: 30px; }
.tab_map { list-style: none; position: absolute; bottom: 10px; left: 10px; padding: 10px; z-index: 1; }
.iframe_map .iframe { display: none; width: 100%; }
.iframe_map .iframe iframe { display: block; width: 100%; }
.iframe_map .iframe.active { display: block; }
/*--------------tags---------------------*/
#tags { padding: 10px 0; }
.tags { width: 100%; margin: 20px 0 0 0; }
.tags label { font-size: 14px; font-weight: 700; }
.tags a { color: #333333; font-size: 13px; padding: 4px 10px; margin: 0 0 6px 5px; border: 1px solid #dddddd; border-radius: 5px; display: inline-block; font-weight: 500; }
.tags a:hover { background: #dd3630; color: #ffffff; }
/*-----------------end tags-----------------------*/
/*++++++++++LEFT+++++++++++*/
.sp_index { display: flex; flex-wrap: wrap; justify-content: space-between; }
div#left { width: 230px; position: relative; z-index: 1; }
.product_detail { width: calc(100% - 240px); position: relative; z-index: 0; }
.service_detail { width: calc(100% - 410px); }
/* product */
.noidung_product { background: #f7f7f6; padding: 25px 20px; -webkit-box-shadow: 0 0 16px 4px rgba(0, 0, 0, .15); box-shadow: 0 0 16px 4px rgba(0, 0, 0, .15); border: 1px solid #fff; margin: 0 0 30px 0; }
.sanpham { width: 100%; display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: 30px; }
.product_detail .sanpham { grid-template-columns: repeat(4, 1fr); grid-gap: 10px; }
.item .img { position: relative; -webkit-backface-visibility: a hidden; -moz-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); z-index: 0; display: block; }
.item .img .icon { width: 50px; position: absolute; left: 10px; top: 10px; z-index: 1; font-size: 13px; color: #ffffff; text-transform: uppercase; }
.item .img .icon.hot:before { position: relative; content: "HOT"; background: #339933; display: block; padding: 5px 0; margin: 0 0 5px 0; }
.item .img .icon.new:after { position: relative; content: "new"; background: #339933; display: block; padding: 5px 0; }
.item .noidung[data-sale]:before { position: absolute; content: attr(data-sale); width: 54px; height: 54px; line-height: 54px; text-align: center; z-index: 1; font-size: 13px; color: #fde770; font-weight: 400; right: 0; top: -25px; background: url(images/sale2.png) no-repeat bottom center; margin: 0; padding: 0; }
.item .img img { display: table; margin: 0 auto; }
.item { transition: 0.5s all;     /* position: relative; */ transition: border 1s; }
.item.item_detail { border: 1px solid #eeeeee; position: relative; padding: 10px 0px 40px; }
.item.item_detail .noidung { padding: 10px; }
.item .noidung { background-size: 100%; position: relative; padding: 5px 0 0px 0; }
.item .noidung .thuonghieu { display: block; font-size: 15px; font-weight: 700; text-transform: uppercase; color: #0c73c0; }
.item h3 { position: relative; width: 100%; display: block; }
.item h3 a { color: #575757; font-size: 13px; overflow: hidden; text-overflow: ellipsis; line-height: 20px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; font-weight: 400; }
.item .gia { font-size: 18px; position: relative; font-weight: 400; color: #353535; }
.item .gia span { display: block; }
.item .giaban { color: #fe0000; font-size: 17px; font-weight: 700; }
.item .giacu { text-decoration: line-through; color: #575757; font-size: 13px; }
.item:hover h3 a { color: #ff0000; }
/* Tab product */
.tab_show { display: block !important; border: 1px solid #ebebeb; border-top: 0; padding: 10px; width: 100%; background: #ffffff; position: relative; z-index: 1; }
.tab_hidden { display: none; }
.tabct { border: 1px solid #ebebeb; border-top: 0; padding: 10px; width: 100%; background: #ffffff; position: relative; padding: 0; }
.tabct h4 { padding: 10px; border-bottom: 1px solid #dddddd; font-size: 15px; font-weight: 500; text-transform: uppercase; }
.tabct .noidung_ta { padding: 10px; }
/*.tab_hidden{}*/
/*Hover images*/
.hover_img { overflow: hidden; position: relative; }
.hover_img:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #ffffff5e; content: ''; z-index: 10; -webkit-transition: -webkit-transform .6s; transition: transform .6s; -webkit-transform: scale3d(2.2, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, -120%, 0); transform: scale3d(2.2, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, -120%, 0); }
.hover_img:hover:before { webkit-transform: scale3d(2.2, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, 120%, 0); transform: scale3d(2.2, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, 120%, 0); }
/* Zoom In #1 */
.hover_zoom { position: relative; overflow: hidden; display: block; }
.hover_zoom img { -webkit-transform: scale(1); transform: scale(1); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; position: relative; }
.hover_zoom:hover img { -webkit-transform: scale(1.09); transform: scale(1.09); }
.hover1 { display: block; position: relative; }
.hover1:before { z-index: 1; content: ""; position: absolute; left: 10px; right: 10px; top: 10px; bottom: 10px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; transform: scale(0, 1); -moz-transform: scale(0, 1); -webkit-transform: scale(0, 1); -ms-transform: scale(0, 1); transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; }
.hover1:after { z-index: 1; content: ""; position: absolute; left: 10px; right: 10px; top: 10px; bottom: 10px; border-left: 1px solid #fff; border-right: 1px solid #fff; transform: scale(1, 0); -moz-transform: scale(1, 0); -webkit-transform: scale(1, 0); -ms-transform: scale(0, 1); transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; }
.hover1:hover:before, .hover1:hover:after { transform: scale(1, 1); -moz-transform: scale(1, 1); -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); }
/* Service detail */
.box_service { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px; }
.service { display: block; }
.service .img { overflow: hidden; display: block; }
.service img { display: inline-block; }
.service h3 { width: 100%; position: relative; margin: 9px 0; }
.service h3 a { font-size: 15px; color: #000000; overflow: hidden; text-overflow: ellipsis; line-height: 25px; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; font-weight: 500; }
.service:hover h3 a { color: #339933; }
.service p { font-size: 13px; color: #000000; font-weight: 400; width: 100%; padding: 0; overflow: hidden; text-overflow: ellipsis; line-height: 20px; -webkit-line-clamp: 3; max-height: 60px; display: -webkit-box; -webkit-box-orient: vertical; text-align: justify; }
.owl_tinkhac { margin: 0 -10px; }
.owl_tinkhac .slick-slide { margin: 0 10px; }
.owl_tinkhac .service { display: none; }
/* Video */
.box_video { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px; }
.video h3 { text-align: center; margin-top: 10px; }
.video h3 a { font-size: 14px; color: #333333; font-weight: 500; overflow: hidden; text-overflow: ellipsis; line-height: 20px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; }
.video:hover h3 a { color: #c51d1d; }
.bot_video iframe { display: block; }
.bot_video select { width: 100%; padding: 10px; font-size: 14px; color: #333333; font-weight: 400; border: 1px solid #f0f0f0; }
/* Quang cao */
.slick_qc { display: none; }
.slick_qc img { width: 100%; }
.slick_banner { display: none; margin: -10px 0; }
.slick_banner .slick-slide { display: none; margin: 10px 0; }
/* bottom */
#tintuc { padding: 30px 0; background: #ffffff; }
.slick_tintuc { display: none; width: 100%; margin: 0 -15px; }
.slick_tintuc .slick-slide { position: relative; margin: 0 15px; }
.tintuc { display: flex !important; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; }
.tintuc .ngaydang { width: 90px; text-align: center; font-size: 14px; color: #878787; font-weight: 700; text-transform: uppercase; }
.tintuc .ngaydang span { display: block; font-size: 36px; background: #535353; line-height: 60px; margin: 5px 0 0 0; }
.tintuc .noidung { position: relative; }
.tintuc .noidung h3 { margin: 5px 0; }
.tintuc .noidung h3 a { font-size: 15px; color: #0c73c0; font-weight: 700; overflow: hidden; text-overflow: ellipsis; line-height: 20px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; }
.tintuc .noidung p.mota { font-size: 13px; color: #333333; font-weight: 300; overflow: hidden; text-overflow: ellipsis; line-height: 20px; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; text-align: justify; margin: 0 0 10px 0; }
.tintuc .noidung a.xemthem { display: table; font-size: 13px; color: #0c73c0; font-weight: 400; border: 1px solid #0c73c0; padding: 6px 15px; }
.tintuc:hover .noidung h3 a { color: #dd0000; }
.tintuc .noidung a.xemthem:hover { background: #0c73c0; color: #ffffff; }
/* Hotline */
.blink_me { -webkit-animation-name: blinker; -webkit-animation-duration: 1s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -moz-animation-name: blinker; -moz-animation-duration: 1s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; animation-name: blinker; animation-duration: 1s; animation-timing-function: linear; animation-iteration-count: infinite; }
@-moz-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
@-webkit-keyframes blinker { 0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
@keyframes blinker { 0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
/*phone*/
.quick-alo-phone.quick-alo-show { visibility: visible; }
.quick-alo-phone { position: fixed; visibility: hidden; background-color: transparent;     /* width: 200px;height: 200px;*/ width: 100px; height: 100px; cursor: pointer; z-index: 200000 !important; -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0); -webkit-transition: visibility .5s; -moz-transition: visibility .5s; -o-transition: visibility .5s; transition: visibility .5s; left: 20px; bottom: 50px; }
.quick-alo-phone.quick-alo-green .quick-alo-ph-circle { border-color: #FF0400; border-color: #bfebfc 9; opacity: .5; }
.quick-alo-ph-circle { width: 100px; height: 100px; top: 0; left: 0; position: absolute; background-color: transparent; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid rgba(30, 30, 30, 0.4); border: 2px solid #bfebfc 9; opacity: .1; -webkit-animation: quick-alo-circle-anim 1.2s infinite ease-in-out; -moz-animation: quick-alo-circle-anim 1.2s infinite ease-in-out; -ms-animation: quick-alo-circle-anim 1.2s infinite ease-in-out; -o-animation: quick-alo-circle-anim 1.2s infinite ease-in-out; animation: quick-alo-circle-anim 1.2s infinite ease-in-out; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; }
.quick-alo-phone.quick-alo-green .quick-alo-ph-circle-fill { background-color: #ff0400; background-color: #a6e3fa 9; opacity: .75 !important; }
.quick-alo-ph-circle-fill { width: 80px; height: 80px; top: 10px; left: 10px; position: absolute; background-color: #000; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid transparent; opacity: .1; -webkit-animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out; -moz-animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out; -ms-animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out; -o-animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out; animation: quick-alo-circle-fill-anim 2.3s infinite ease-in-out; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; }
.quick-alo-phone.quick-alo-green .quick-alo-ph-img-circle {     /*background-color: #00aff2;background-color: #00aff2;*/ }
.quick-alo-ph-img-circle { width: 50px; height: 50px; top: 25px; color: #FF0400; font-size: 20px; font-family: RobotoBold; left: 25px; position: absolute; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: none;     /*opacity: .7;*/ -webkit-animation: quick-alo-circle-img-anim 1s infinite ease-in-out; -moz-animation: quick-alo-circle-img-anim 1s infinite ease-in-out; -ms-animation: quick-alo-circle-img-anim 1s infinite ease-in-out; -o-animation: quick-alo-circle-img-anim 1s infinite ease-in-out; animation: quick-alo-circle-img-anim 1s infinite ease-in-out; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; }
@-moz-keyframes quick-alo-circle-anim { 0% { -moz-transform: rotate(0) scale(.5) skew(1deg); opacity: .1; -moz-opacity: .1; -webkit-opacity: .1; -o-opacity: .1 }
30% { -moz-transform: rotate(0) scale(.7) skew(1deg); opacity: .5; -moz-opacity: .5; -webkit-opacity: .5; -o-opacity: .5 }
100% { -moz-transform: rotate(0) scale(1) skew(1deg); opacity: .6; -moz-opacity: .6; -webkit-opacity: .6; -o-opacity: .1 }
}
@-webkit-keyframes quick-alo-circle-anim { 0% { -webkit-transform: rotate(0) scale(.5) skew(1deg); -webkit-opacity: .1 }
30% { -webkit-transform: rotate(0) scale(.7) skew(1deg); -webkit-opacity: .5 }
100% { -webkit-transform: rotate(0) scale(1) skew(1deg); -webkit-opacity: .1 }
}
@-o-keyframes quick-alo-circle-anim { 0% { -o-transform: rotate(0) kscale(.5) skew(1deg); -o-opacity: .1 }
30% { -o-transform: rotate(0) scale(.7) skew(1deg); -o-opacity: .5 }
100% { -o-transform: rotate(0) scale(1) skew(1deg); -o-opacity: .1 }
}
@-moz-keyframes quick-alo-circle-fill-anim { 0% { -moz-transform: rotate(0) scale(.7) skew(1deg); opacity: .2 }
50% { -moz-transform: rotate(0) -moz-scale(1) skew(1deg); opacity: .2 }
100% { -moz-transform: rotate(0) scale(.7) skew(1deg); opacity: .2 }
}
@-webkit-keyframes quick-alo-circle-fill-anim { 0% { -webkit-transform: rotate(0) scale(.7) skew(1deg); opacity: .2 }
50% { -webkit-transform: rotate(0) scale(1) skew(1deg); opacity: .2 }
100% { -webkit-transform: rotate(0) scale(.7) skew(1deg); opacity: .2 }
}
@-o-keyframes quick-alo-circle-fill-anim { 0% { -o-transform: rotate(0) scale(.7) skew(1deg); opacity: .2 }
50% { -o-transform: rotate(0) scale(1) skew(1deg); opacity: .2 }
100% { -o-transform: rotate(0) scale(.7) skew(1deg); opacity: .2 }
}
@-moz-keyframes quick-alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) }
10% { -moz-transform: rotate(-25deg) scale(1) skew(1deg) }
20% { -moz-transform: rotate(25deg) scale(1) skew(1deg) }
30% { -moz-transform: rotate(-25deg) scale(1) skew(1deg) }
40% { -moz-transform: rotate(25deg) scale(1) skew(1deg) }
50% { -moz-transform: rotate(0) scale(1) skew(1deg) }
100% { -moz-transform: rotate(0) scale(1) skew(1deg) }
}
@-webkit-keyframes quick-alo-circle-img-anim { 0% { -webkit-transform: rotate(0) scale(1) skew(1deg) }
10% { -webkit-transform: rotate(-25deg) scale(1) skew(1deg) }
20% { -webkit-transform: rotate(25deg) scale(1) skew(1deg) }
30% { -webkit-transform: rotate(-25deg) scale(1) skew(1deg) }
40% { -webkit-transform: rotate(25deg) scale(1) skew(1deg) }
50% { -webkit-transform: rotate(0) scale(1) skew(1deg) }
100% { -webkit-transform: rotate(0) scale(1) skew(1deg) }
}
@-o-keyframes quick-alo-circle-img-anim { 0% { -o-transform: rotate(0) scale(1) skew(1deg) }
10% { -o-transform: rotate(-25deg) scale(1) skew(1deg) }
20% { -o-transform: rotate(25deg) scale(1) skew(1deg) }
30% { -o-transform: rotate(-25deg) scale(1) skew(1deg) }
40% { -o-transform: rotate(25deg) scale(1) skew(1deg) }
50% { -o-transform: rotate(0) scale(1) skew(1deg) }
100% { -o-transform: rotate(0) scale(1) skew(1deg) }
}
@-moz-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0) }
100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none }
}
@-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0) }
100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none }
}
@-o-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0) }
100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none }
}
.ui-slider-horizontal { height: 3px !important; background: #fff; }
.ui-slider .ui-slider-handle { width: 8px !important; height: 8px !important; border-radius: 50% !important; }
.ui-slider-horizontal .ui-slider-handle { top: -3px !important; margin-left: 0px !important; }
.contain_slider_number { padding: 7px 0px; position: relative; }
.num_before { position: absolute; right: 100%; margin-right: 5px; font-size: 13px; color: #fff; line-height: 20px; top: 0px; font-weight: bold; }
.num_after { position: absolute; left: 100%; margin-left: 5px; font-size: 13px; color: #fff; line-height: 20px; top: 0px; font-weight: bold; }
.ui-slider-handle { }
.tooltip_slider { position: absolute; bottom: 100%; white-space: nowrap; padding: 3px; display: block; color: #fff; background: rgba(0, 0, 0, 0.5); margin-bottom: 5px; left: 50%; margin-left: -7px; display: none; }
.quick-alo-phone > img { position: absolute; top: 5px; left: 20px; z-index: 2; }
.quick-alo-phone > p { position: absolute; background: #FF0400; padding: 8px 30px 8px 40px; min-width: 160px; line-height: 25px; border-radius: 30px; left: 50px; top: 50%; transform: translateY(-50%); }
.quick-alo-phone > p a { font-size: 22px; color: #ffffff; font-weight: 700; display: block; }
/* Vi sao */
#visao { background: #E90000; padding: 15px 0; }
.slick_visao { display: none; margin: 0 -20px; overflow: hidden; }
.visao { display: flex !important; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 0 20px; position: relative; }
.visao:after { position: absolute; content: ''; width: 1px; height: 42px; background: #ffffff; right: -1px; }
.visao .noidung { width: calc(100% - 85px); }
.visao .noidung label { font-size: 16px; font-weight: 700; color: #ffffff; text-transform: uppercase; }
.visao .noidung p { font-size: 13px; color: #ffffff; font-weight: 400; }
.visao:hover img { transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transition: all 1s; }
/* Thuong Hieu */
.box_thuonghieu { display: grid; grid-template-columns: repeat(6, 1fr); grid-gap: 20px; }
.box_thuonghieu .thuonghieu { border: 1px solid #dddddd; border-radius: 5px; }
.buynow { padding: 8px; text-align: center; color: #fff; background: #1865D9; border-radius: 5px; text-transform: uppercase; font-size: 14px; cursor: pointer; position: absolute; left: 10px; bottom: 10px; right: 10px; }
.buynow:hover { color: #fff; background: #EE0808; }
.close { float: right; font-size: 1.5rem; font-weight: 700; line-height: 1; color: #000; text-shadow: 0 1px 0 #fff; opacity: .5 }
.close:hover { color: #000; text-decoration: none }
.close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover { opacity: .75 }
button.close { padding: 0; background-color: transparent; border: 0 }
a.close.disabled { pointer-events: none }
.toast { -ms-flex-preferred-size: 350px; flex-basis: 350px; max-width: 350px; font-size: .875rem; background-color: rgba(255, 255, 255, .85); background-clip: padding-box; border: 1px solid rgba(0, 0, 0, .1); box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .1); opacity: 0; border-radius: .25rem }
.toast:not(:last-child) { margin-bottom: .75rem }
.toast.showing { opacity: 1 }
.toast.show { display: block; opacity: 1 }
.toast.hide { display: none }
.toast-header { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; padding: .25rem .75rem; color: #6c757d; background-color: rgba(255, 255, 255, .85); background-clip: padding-box; border-bottom: 1px solid rgba(0, 0, 0, .05); border-top-left-radius: calc(.25rem - 1px); border-top-right-radius: calc(.25rem - 1px) }
.toast-body { padding: .75rem }
.modal-open { overflow: hidden }
.modal-open .modal { overflow-x: hidden; overflow-y: auto }
.modal { position: fixed; top: 0; left: 0; z-index: 1050; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0 }
.modal-dialog { position: relative; width: auto; margin: .5rem; pointer-events: none }
.modal.fade .modal-dialog { transition: -webkit-transform .3s ease-out; transition: transform .3s ease-out; transition: transform .3s ease-out, -webkit-transform .3s ease-out; -webkit-transform: translate(0, -50px); transform: translate(0, -50px) }
@media (prefers-reduced-motion:reduce) { .modal.fade .modal-dialog { transition: none }
}
.modal.show .modal-dialog { -webkit-transform: none; transform: none }
.modal.modal-static .modal-dialog { -webkit-transform: scale(1.02); transform: scale(1.02) }
.modal-dialog-scrollable { display: -ms-flexbox; display: flex; max-height: calc(100% - 1rem) }
.modal-dialog-scrollable .modal-content { max-height: calc(100vh - 1rem); overflow: hidden }
.modal-dialog-scrollable .modal-footer, .modal-dialog-scrollable .modal-header { -ms-flex-negative: 0; flex-shrink: 0 }
.modal-dialog-scrollable .modal-body { overflow-y: auto }
.modal-dialog-centered { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; min-height: calc(100% - 1rem) }
.modal-dialog-centered::before { display: block; height: calc(100vh - 1rem); height: -webkit-min-content; height: -moz-min-content; height: min-content; xmlns='http://www.w3.org/2000/svg'
}
.modal-dialog-centered.modal-dialog-scrollable { -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; height: 100% }
.modal-dialog-centered.modal-dialog-scrollable .modal-content { max-height: none }
.modal-dialog-centered.modal-dialog-scrollable::before { content: none }
.modal-content { position: relative; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, .2); border-radius: .3rem; outline: 0 }
.modal-backdrop { position: fixed; top: 0; left: 0; z-index: 1040; width: 100vw; height: 100vh; background-color: #000 }
.modal-backdrop.fade { opacity: 0 }
.modal-backdrop.show { opacity: .5 }
.modal-header { display: -ms-flexbox; display: flex; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: justify; justify-content: space-between; padding: 1rem 1rem; border-bottom: 1px solid #dee2e6; border-top-left-radius: calc(.3rem - 1px); border-top-right-radius: calc(.3rem - 1px) }
.modal-header .close { padding: 1rem 1rem; margin: -1rem -1rem -1rem auto }
.modal-title { margin-bottom: 0; line-height: 1.5; font-size: 1rem; font-weight: 700; }
.modal-body { position: relative; -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 1rem }
.modal-footer { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: center; align-items: center; -ms-flex-pack: end; justify-content: flex-end; padding: .75rem; border-top: 1px solid #dee2e6; border-bottom-right-radius: calc(.3rem - 1px); border-bottom-left-radius: calc(.3rem - 1px) }
.modal-footer > * { margin: .25rem }
.modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll }
.text-green { color: green; }
.font-weight-bold { font-weight: 700 !important }
.mb-2, .my-2 { margin-bottom: .5rem !important }
.mb-3, .my-3 { margin-bottom: .7rem !important }
.h1, .h2, .h3, .h4, .h5, .h6 { margin-bottom: .5rem; font-weight: 500; line-height: 1.2 }
.h5, h5 { font-size: 1.25rem }
.font-italic { font-style: italic !important }
.text-center { text-align: center !important }
.text-danger { color: #dc3545 !important }
a.text-danger:focus, a.text-danger:hover { color: #a71d2a !important }
.form-control { padding: 10px 10px; border: 1px solid #E9EBEC; border-radius: 5px; width: 100%; font-size: 14px; margin-bottom: 10px; }
.note-product { color: #333; font-size: 15px; }
.note-product span { color: #E90000; }
.btn-buynow { padding: 10px 20px; text-align: center; color: #fff; background: #1865D9; border-radius: 5px; text-transform: uppercase; font-size: 14px; cursor: pointer; display: inline-block; border: none; outline: none; font-weight: 700; }
.btn-buynow:hover { color: #fff; background: #EE0808; }
.buynow_details .buynow { position: relative; bottom: 0px; left: 0px; right: 0px; display: inline-block; padding: 10px 30px; }
.text-right { text-align: right; }
@media (min-width:576px) { .modal-dialog { max-width: 500px; margin: 1.75rem auto }
.modal-dialog-scrollable { max-height: calc(100% - 3.5rem) }
.modal-dialog-scrollable .modal-content { max-height: calc(100vh - 3.5rem) }
.modal-dialog-centered { min-height: calc(100% - 3.5rem) }
.modal-dialog-centered::before { height: calc(100vh - 3.5rem); height: -webkit-min-content; height: -moz-min-content; height: min-content }
.modal-sm { max-width: 300px }
}
@media (min-width:992px) { .modal-lg, .modal-xl { max-width: 800px }
}
@media (min-width:1200px) { .modal-xl { max-width: 1140px }
}
/* Responsive */
@media (max-width:1200px) { .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; margin-bottom: 1em; }
.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.margin_auto { width: 100% !important; }
#info { padding: 10px; margin: 0; border: none; }
div#left, #menu_left, #menu_danhmuc, #right { display: none; }
.product_detail, .service_detail { width: 100%; }
.toolbar { display: block; }
.khung_flex { justify-content: center; }
}
@media(max-width:1000px) { .quick-alo-phone, .zalo { display: none; }
#header { position: relative; background: #ffffff !important; }
#header #logo { width: 100%; text-align: center; }
#header .header { width: 100%; padding: 10px; }
#header .header p { display: none; }
#header #timkiem ul { display: none; }
#mainmenu { margin: 0; width: 100%; height: 45px; }
nav.menu_top > ul > li.icon { display: none; }
#mainmenu .header_mm a { display: block; top: 50%; left: 5px !important; left: unset; z-index: 99; transform: translateY(-50%); }
nav.menu_top > ul > li.slogan { width: calc(100% - 80px); position: absolute; right: 10px; top: 13px; padding: 0; }
#slider { padding: 5px; }
#slider .slider { width: 100%; }
#slider .qc_slider { display: none; }
#giatot { background: url(images/bggiatot2.png) no-repeat center; }
.title_sp { display: block; }
.title_sp h2 { width: 100%; padding: 10px; text-align: center; }
.tab_sp { width: 100%; margin: 0; padding: 10px; border: 1px solid #dddddd; border-top: 0; }
.tab_sp li:first-child { margin-left: 0; }
#visao { padding: 30px 10px; }
#visao .visao { padding: 0 10px; }
.slick_visao { margin: 0 -5px; }
.slick_visao .slick-slide { margin: 0 5px; }
.visao:after { display: none; }
#dichvu { padding: 10px; }
.slick_dichvu { margin: 0 -5px; }
.slick_dichvu .slick-slide { margin: 0 5px; }
.box_dichvu { grid-template-columns: repeat(3, 1fr); grid-gap: 10px; }
#duan { padding: 0 10px 20px 10px; }
.tab_duan { position: relative; width: 100%; margin-top: 20px; justify-content: flex-start; }
.box_duan { grid-template-columns: repeat(2, 1fr); grid-gap: 10px; }
.khung_duan { padding: 30px 10px; }
.slick_duan_cat, .slick_project { margin: 0 -5px; }
.slick_duan_cat .slick-slide, .slick_project .slick-slide { margin: 0 5px; }
.sanpham, .product_detail .sanpham, .box_giasoc .sanpham { grid-template-columns: repeat(3, 1fr); grid-gap: 10px; }
.box_giasoc .sanpham { padding: 0 10px; }
/* .box_giasoc .sanpham .bao_item { padding: 0; border: none; } */
.slick_sp { margin: 0 -5px; }
.slick_sp .slick-slide { margin: 0 5px; }
#nhantin { padding: 10px; }
#nhantin .nhantin { justify-content: center; text-align: center; }
.nhantin p { width: 100%; margin: 10px 0; }
#tintuc { padding: 30px 10px; }
#tintuc .big_tintuc { display: none; }
.slick_tintuc { width: 100%; margin: 0 -5px; }
.slick_tintuc .slick-slide { margin: 0 5px; }
#doitac { padding: 30px 35px; }
.dieuhuong { padding: 10px; }
.khung_thongtin, .frame_images { width: 100% !important; padding: 0; margin-bottom: 20px; }
.app-figure { width: 100%; margin: 0; }
.selectors { position: relative; width: 100%; }
.foo3_l { left: 0; transform: translate(0); top: calc(50% - 20px); }
.foo3_r { right: 0; transform: translate(0); top: calc(50% - 20px); left: unset; bottom: unset; }
#footer { margin-bottom: 50px; }
#footer .footer { padding: 30px 20px; }
#footer .thongtin_ct, #footer .facebook, #footer .chinhsach { width: 100%; }
#footer .chinhsach { margin: 15px 0; }
.coppy { padding: 10px; text-align: center; font-size: 12px; }
}
@media(max-width:980px) { box_video, .box_service { grid-template-columns: repeat(3, 1fr); grid-gap: 10px; }
.owl_tinkhac .slick-slide { margin: 5px; }
.lienket { justify-content: center; margin-top: 5px; }
.lienket a { margin: 5px; }
.title_lk h4:before, .title_lk h4:after { display: none; }
}
@media(max-width:800px) { .box_news { grid-template-columns: 1fr; }
}
@media(max-width:750px) { #slider .slider .content h3 { font-size: 5vw; }
#slider .slider .content p { font-size: 2vw; }
#slider .slider .content a { font-size: 1.5vw; padding: 5px 20px; }
#slider .slider_r { width: 10px; right: 5px; }
#slider .slider_l { width: 10px; left: 5px; }
.box_service, .box_video, .box_dichvu, .box_project { grid-template-columns: repeat(2, 1fr); grid-gap: 10px; }
.box_tintuc { display: block; }
#sp_info .khung .img { width: 100%; }
.khung_trai, .khung_phai { width: 100%; margin: 10px 0; }
.sanpham, .product_detail .sanpham, .box_giasoc .sanpham { grid-template-columns: repeat(2, 1fr); }
/* .box_giasoc .sanpham .bao_item { padding: 0; } */
.box_congtrinh { grid-template-columns: repeat(2, 1fr); }
}
@media(max-width:650px) { .dichvu .noidung { padding: 10px; top: calc(100% - 50px); }
.title h4, .title h2 { padding: 0; background: none; font-size: 35px; }
}
@media(max-width:600px) { #danhmuc { background: #ffffff; }
#footer .thongtin_ct ul { grid-template-columns: 1fr; }
.mang_xh:before, .mang_xh:after { display: none; }
.tab_sp li { font-size: 12px; padding: 5px 9px; }
}
@media(max-width:500px) { .slick_lienket .noidung h3 a { font-size: 20px; }
.duan h3 a { -webkit-line-clamp: 2; }
.item h3 a { font-size: 15px; -webkit-line-clamp: 2; }
.item .gia { font-size: 14px; }
.item .img .icon, .item .img[data-sale]:before { font-size: 10px; width: 25px; }
.item .img .icon:before, .item .img .icon:after { padding: 0 !important; }
.tintuc .noidung h3 a { font-size: 15px; font-weight: 500; }
.title p { text-indent: 0; }
.title p:before { display: none; }
#header #logo img:nth-child(2) { display: none; }
.buynow { font-size: 13px; padding: 7px; }
}
@media(max-width:450px) { .box_dichvu { grid-template-columns: 1fr; }
}
@media(max-width:400px) { .box_duan { grid-template-columns: 1fr; }
}