@charset "UTF-8";

/* Main */
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
@font-face { font-family: SVN-Poppins; src: url("../fonts/SVN-Poppins/SVN-Poppins.eot") format("embedded-opentype"), url("../fonts/SVN-Poppins/SVN-Poppins.woff2") format("woff2"), url("../fonts/SVN-Poppins/SVN-Poppins.woff") format("woff"), url("../fonts/SVN-Poppins/SVN-Poppins.ttf") format("truetype"), url("../fonts/SVN-Poppins/SVN-Poppins.svg#SVN-Poppins") format("svg"); }
@font-face { font-family: SVN-PoppinsMedium; src: url("../fonts/SVN-PoppinsMedium/SVN-PoppinsMedium.eot") format("embedded-opentype"), url("../fonts/SVN-PoppinsMedium/SVN-PoppinsMedium.woff2") format("woff2"), url("../fonts/SVN-PoppinsMedium/SVN-PoppinsMedium.woff") format("woff"), url("../fonts/SVN-PoppinsMedium/SVN-PoppinsMedium.ttf") format("truetype"), url("../fonts/SVN-PoppinsMedium/SVN-PoppinsMedium.svg#SVN-PoppinsMedium") format("svg"); }
@font-face { font-family: SVN-PoppinsSemiBold; src: url("../fonts/SVN-PoppinsSemiBold/SVN-PoppinsSemiBold.eot") format("embedded-opentype"), url("../fonts/SVN-PoppinsSemiBold/SVN-PoppinsSemiBold.woff2") format("woff2"), url("../fonts/SVN-PoppinsSemiBold/SVN-PoppinsSemiBold.woff") format("woff"), url("../fonts/SVN-PoppinsSemiBold/SVN-PoppinsSemiBold.ttf") format("truetype"), url("../fonts/SVN-PoppinsSemiBold/SVN-PoppinsSemiBold.svg#SVN-PoppinsSemiBold") format("svg"); }
@font-face { font-family: SVN-PoppinsBold; src: url("../fonts/SVN-PoppinsBold/SVN-PoppinsBold.eot") format("embedded-opentype"), url("../fonts/SVN-PoppinsBold/SVN-PoppinsBold.woff2") format("woff2"), url("../fonts/SVN-PoppinsBold/SVN-PoppinsBold.woff") format("woff"), url("../fonts/SVN-PoppinsBold/SVN-PoppinsBold.ttf") format("truetype"), url("../fonts/SVN-PoppinsBold/SVN-PoppinsBold.svg#SVN-PoppinsBold") format("svg"); }
@font-face { font-family: SVN-PyesPaHeadline; src: url("../fonts/SVN-PyesPaHeadline/SVN-PyesPaHeadline.eot") format("embedded-opentype"), url("../fonts/SVN-PyesPaHeadline/SVN-PyesPaHeadline.woff2") format("woff2"), url("../fonts/SVN-PyesPaHeadline/SVN-PyesPaHeadline.woff") format("woff"), url("../fonts/SVN-PyesPaHeadline/SVN-PyesPaHeadline.ttf") format("truetype"), url("../fonts/SVN-PyesPaHeadline/SVN-PyesPaHeadline.svg#SVN-PyesPaHeadline") format("svg"); }
:root { --font1:'SVN-PoppinsMedium'; --font2:'SVN-PoppinsSemiBold'; --font3:'SVN-PoppinsBold'; --font4:'SVN-PyesPaHeadline'; --main-color: #ffba51; --color-menu: #ffba51; --second-color: #000000; --hover-color: #ec2d3f; --color-yellow: #fcbf1a; --color-red: #ec2d3f; --color-medium-red: #cc2c32; --color-dark-red: #c31829; --color-green: #28a745; --color-dark-green: #207d36; --color-black: #212529; --color-gray: #6c757d; }
.min-width { min-width: 1366px; }
body { font-size: 15px; color: #333333; font-family: SVN-Poppins; top: 0 !important; }
img { max-width: 100%; height: auto; vertical-align: top; }
a, input, textarea { outline: none; padding: 0px; }
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { appearance: none; margin: 0px; }
.w-clear::after { display: block; content: ""; clear: both; }
.hidden { display: none; }
.clear { clear: both; }
.none { display: none; }
.hidden-seoh { visibility: hidden; height: 0px; margin: 0px; overflow: hidden; }
.wrap-main, .wrap-content { max-width: 1200px; margin: 0px auto; }
.wrap-content-pd0 { max-width: 1220px; margin: 0px auto; }
.wrap-home { max-width: 100%; padding: 0px; overflow: hidden; }
.wrap-content { margin: auto; }
.content-ck img { height: auto !important; }
.content-main { margin-top: 10px; }
.btn-fix { background: var(--main-color); border: 1px solid var(--main-color); }
.flex-c-b { display: flex; justify-content: space-between; align-items: center; }
.flex-c-s { display: flex; justify-content: space-around; align-items: center; }
.flex-c-e { display: flex; justify-content: flex-end; align-items: center; }
.flex-c-b-w { display: flex; justify-content: space-between; flex-wrap: wrap; }

/* effect */
.effect-1 { position: relative; overflow: hidden; transition: all 0.5s ease 0s; }
.effect-1::after { position: absolute; top: 0px; left: -66%; z-index: 2; display: block; content: ""; width: 50%; height: 100%; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 100%); transform: skewX(-10deg); }
.effect-1:hover::after { animation: 0.75s ease 0s 1 normal none running shine; }
@-webkit-keyframes shine {
	100% { left: 125%; }
}
@keyframes shine {
	100% { left: 125%; }
}
.effect-2 { display: flex; justify-content: center; align-items: center; position: relative; text-align: center; }
.effect-2::before, .effect-2::after { box-sizing: inherit; content: ""; position: absolute; z-index: 9; width: calc(100% - 20px); height: calc(100% - 20px); left: 10px; top: 10px; transform-origin: center center; }
.effect-2::before { border-top: 1px solid rgb(255, 255, 255); border-bottom: 1px solid rgb(255, 255, 255); transform: scale3d(0, 1, 1); }
.effect-2::after { border-left: 1px solid rgb(255, 255, 255); border-right: 1px solid rgb(255, 255, 255); transform: scale3d(1, 0, 1); }
.effect-2:hover { background: rgba(0, 0, 0, 0.45); }
.effect-2:hover::before, .effect-2:hover::after { transform: scale3d(1, 1, 1); transition: transform 0.5s ease 0s; }
.effect-2 > img { width: 100%; height: 100%; object-fit: cover; transition: all 0.5s ease 0s; }
.effect-2:hover > img { opacity: 0.8; }
.effect-3 > img { transform: translateY(0px); animation: 6s ease-in-out 0s infinite normal none running float; }
@keyframes float {
	0% { box-shadow: rgba(0, 0, 0, 0.6) 0px 5px 15px 0px; transform: translateY(0px); }
	50% { box-shadow: rgba(0, 0, 0, 0.2) 0px 25px 15px 0px; transform: translateY(-20px); }
	100% { box-shadow: rgba(0, 0, 0, 0.6) 0px 5px 15px 0px; transform: translateY(0px); }
}

/* Toc */
.box-readmore { padding: 8px 15px; border: 1px solid rgb(222, 222, 222); margin-bottom: 2rem; border-radius: 5px; background-color: rgb(238, 238, 238); }
.box-readmore li ul > li { margin: 0px 0px 8px; }
.box-readmore li ul > li::before { content: counters(item, ".") " "; }
.box-readmore ul { list-style-type: none; counter-reset: item 0; margin-bottom: 0px; margin-top: 8px; padding-left: 0px !important; }
.box-readmore ul li { display: table; counter-increment: item 1; margin-bottom: 5px; }
.box-readmore ul li::before { content: counters(item, ".") ". "; display: table-cell; padding-right: 5px; }
.box-readmore ul li a { color: rgb(51, 51, 51); cursor: pointer; font-weight: 600; }
.box-readmore ul li a:hover { color: rgb(118, 118, 118); }

/* General */
.title-main { text-align: center; position: relative; padding-bottom: 20px; }
.title-main span { font-size: 32px; color: #333333; text-transform: uppercase; display: block; position: relative; font-family: var(--font2); }

/*---*/
.title-main-second { text-align: center; position: relative; padding-bottom: 15px; }
.title-main-second span { font-size: 30px; color: #c90808; text-transform: uppercase; margin-bottom: 30px; display: block; position: relative; }
.title-main-second span:before { position: absolute; content: ''; background: url(../images/dat/icon-main.png) no-repeat; width: 144px; height: 20px; bottom: -20px; left: 50%; transform: translateX(-50%); }
.title-main-second p { margin: 0; color: #181818; }

/*---*/
.title-main-third { text-align: center; position: relative; padding-bottom: 35px; padding-top: 69px; }
.title-main-third:before { position: absolute; content: ''; background: url(../images/dat/icon-main.png) no-repeat; width: 197px; height: 79px; top: 0; left: 50%; transform: translateX(-50%); }
.title-main-third span { font-size: 48px; color: var(--main-color); text-transform: capitalize; }

/*---*/
.time-main i { vertical-align: top; margin: 3px 7px 0px 0px; }
.time-main span { vertical-align: top; display: inline-block; }
.share { padding: 17px 15px 10px; line-height: normal; background: rgba(128, 128, 128, 0.15); margin-top: 15px; border-radius: 5px; }
.share b { display: block; margin-bottom: 5px; }
.control-owl { position: absolute; width: 100%; z-index: 2; left: 0px; top: calc(50% - 22.5px); }
.control-owl button { opacity: 0.5; top: 0px; position: absolute; outline: none; border: 0px; padding: 0px; cursor: pointer; color: rgb(255, 255, 255); width: 45px; height: 45px; text-align: center; display: flex; align-items: center; justify-content: center; font-size: 25px; margin: 0px; background-color: rgb(0, 0, 0); border-radius: 3px; transition: all 0.3s ease-out 0s; }
.control-owl button:hover { opacity: 1; }
.control-owl button.owl-prev { left: 20px; }
.control-owl button.owl-next { right: 20px; }
.form-control, .form-control-plaintext:not(textarea), .custom-select { height: calc(1em + 1.25rem + 8px); }
.text-sm { font-size: 0.875rem !important; }

/* Lazyload */
img.lazy { opacity: 0; }
img:not(.initial) { transition: opacity 1s ease 0s; }
img.initial, img.loaded, img.error { opacity: 1; }
img:not([src]) { visibility: hidden; }

/* Header */
.header { background: var(--second-color) }
.header-top { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; }
.header-left { display: flex; justify-content: space-between; align-items: center; max-width: 600px; }
.width-null { width: 215px; margin-right: 40px; }
.slogan-main { font-size: 18px; font-family: var(--font1); color: var(--main-color); text-transform: uppercase; -webkit-line-clamp: 1 !important; }
.info-header { font-size: 15px; color: #fff; }
.info-header .fas.fa-phone-volume { transform: rotate(-45deg); font-size: 20px; }
.info-header i { margin-right: 5px; color: var(--main-color); }
.info-header span { color: var(--main-color); }
.header-bottom { }
.logo-header { margin-top: -20px; position: relative; z-index: 1; display: flex; justify-content: center; }
.logo-header:before { position: absolute; content: ''; background: #808080; width: 215px; height: 26px; border-radius: 10px 10px 0 0; top: -11px; overflow: hidden; }
.logo-header img { border-radius: 12px 12px 0 0; z-index: 1; position: relative; }
.banner-header { }
.hotline-header { padding-left: 85px; position: relative; }
.hotline-header:before { position: absolute; content: ''; background: url(../images/dat/icon-phone.png) no-repeat; width: 77px; height: 78px; left: 0; }
.hotline-header p { font-size: 20px; color: #186497; }
.hotline-header a { font-size: 30px; color: #186497; }
.hotline-header a:hover { text-decoration: none; color: var(--hover-color); }
.hotline-header:hover a { }
.user-header a { color: rgb(255, 255, 255); padding-right: 9px; margin-right: 7px; position: relative; display: inline-block; vertical-align: top; text-decoration: none; }
.user-header a::after { content: ""; position: absolute; width: 1px; height: 8px; background-color: rgb(255, 255, 255); top: calc(50% - 3.5px); right: 0px; opacity: 0.7; }
.user-header a:last-child { padding-right: 0px; margin-right: 0px; }
.user-header a:last-child::after { display: none; }

/*MENU*/
.menu-page { position: relative; z-index: 100; background: #fff; padding: 5px 0; transition: all .5s ease-in-out; }
.menu-page.fixed { box-shadow: 0 0px 4px #0000008c; position: fixed; width: 100%; padding: 0; top: 0; }
.menu-page.fixed .logo-header { zoom: 0.7; margin-top: 0; }
.menu-page.fixed .logo-header:before { display: none; }
.menu-page.fixed .menu { padding: 0; }
.box-menu { width: 80%; }
.menu { width: 76%; }
.menu ul { padding: 0px; list-style: none; width: 100%; margin: 0; }
.menu ul li a { display: block; position: relative; padding: 11px 0px; text-transform: uppercase; color: #333333; font-size: 15px; text-decoration: none !important; }
.transition i {display: flex;justify-content: center;align-items: center;width: 30px;height: 30px;color: #fff;font-size: 15px;}
.menu ul li a.has-child { }
.menu ul li a.active, .menu ul li:hover > a { color: var(--main-color); }
.menu ul li a.active i { background: var(--second-color); border-radius: 100%; color: var(--main-color); }
.menu ul li:hover > a.has-child::after, .menu ul li a.active.has-child::after { }
.menu ul li ul:hover a { background: none; }
.menu ul li ul { position: absolute; width: 250px; background-color: #efefef; border-radius: 0px; box-shadow: rgba(0, 0, 0, 0.15) 1px 1px 15px; transform: perspective(600px) rotateX(-90deg); transform-origin: 0px 0px 0px; opacity: 0; visibility: hidden; transition: all 0.5s ease 0s; top: 90%; margin: 0px; }
.menu ul li:hover > ul { transform: perspective(600px) rotateX(0deg); transform-origin: 0px 0px 0px; opacity: 1; visibility: visible; transition: all 0.7s ease 0s; color: rgb(255, 255, 255); border-radius: 5px; }
.menu ul li ul li { }
.menu ul li ul li a { font-size: 15px; text-align: left; color: rgb(49, 49, 49); border-bottom: 1px solid #0000002e; }
.menu ul li ul li:last-child > a { border-bottom: 20px; }
.menu ul li ul li a.has-child { margin-right: 0px; padding: 10px; }
.menu ul li ul li a.has-child::after { border-color: rgb(255, 255, 255); transform: rotate(-45deg); }
.menu ul li ul li a.active, .menu ul li ul li:hover > a { background-color: var(--second-color); color: #fff; clip-path: none; padding: 10px; border-radius: 5px; }
.menu ul li ul li:hover > a.has-child::after, .menu ul li ul li a.active.has-child::after { border-color: rgb(255, 255, 255); }
.menu ul li ul li a { text-transform: capitalize; color: #000; padding: 10px; line-height: 27px; clip-path: none; }
.menu ul li ul li ul { left: 100%; margin-top: 0px; top: 0px; }

/* Search */
.search { width: 70%; background: #fff; margin: 0px auto; position: relative; border-radius: 50px; margin-left: 5px; margin-top: 10px; }
.search p { position: absolute; width: 20px; height: 20px; line-height: 20px; cursor: pointer; text-align: center; margin: 0px; color: #4bb07b; font-size: 15px; right: 10px; top: 50%; transform: translateY(-50%); }
.search p > i { color: #3498db; font-size: 16px; }
.search input { background: #0000; width: calc(100% - 40px); height: 36px; float: left; outline: none; padding: 0px; border: 0px; text-indent: 10px; border-radius: 0; color: #000; }
input#keyword { font-size: 13px; font-weight: 500; color: #636363; }
.search input::-webkit-input-placeholder { font-size: 13px; font-weight: 500; color: ##636363; }
.search span { position: absolute; cursor: pointer; -webkit-text-fill-color: transparent; font-size: 20px; text-align: center; height: 50px; line-height: 50px; right: 30px; }

/* Mmenu */
.menu-res { display: none; height: 85px; z-index: 10; background: var(--main-color); top: 0px; position: sticky; line-height: normal; box-shadow: 0 1px 5px #00000036; }
.menu-bar-res { height: 85px; padding: 0px 15px; display: flex; align-items: center; justify-content: space-between; }
.menu-bar-res .logo-header img { }
#menu { display: none; }
#hamburger { display: block; width: 45px; height: 23px; position: relative; }
#hamburger::before, #hamburger::after, #hamburger span {background: #000;content: "";display: block;width: 100%;height: 3px;position: absolute;left: 0px;}
#hamburger::before { top: 0px; }
#hamburger span { top: 10px; }
#hamburger::after { top: 20px; }
#hamburger::before, #hamburger::after, #hamburger span { transition: transform 0.5s ease 0.5s, top 0s ease 0s, bottom 0s ease 0s, left 0s ease 0s, opacity 0s ease 0s; }
.mm-wrapper_opening #hamburger::before, .mm-wrapper_opening #hamburger::after { top: 10px; }
.mm-wrapper_opening #hamburger span { left: -50px; opacity: 0; }
.mm-wrapper_opening #hamburger::before { transform: rotate(45deg); }
.mm-wrapper_opening #hamburger::after { transform: rotate(-45deg); }
.mm-menu_opened { display: block !important; }

/* Search Responsive */
.search-res { position: relative; }
.search-res .icon-search { width: 30px; height: 30px; cursor: pointer; text-align: center; line-height: 32px; color: rgb(255, 255, 255); margin: 0px; border-radius: 100%; background: url(../images/dat/icon-search.png) no-repeat center; }
.icon-search i { }
.search-res .icon-search.active { color: #fff; border-radius: 100%; background: url(../images/dat/icon-search.png) no-repeat center; }
.search-res .search-grid { position: absolute; top: 50px; right: 0px; width: 0px; height: 40px; overflow: hidden; background: rgb(255, 255, 255); border: 1px solid rgb(135, 142, 136); z-index: 2; opacity: 0; border-radius: 25px; line-height: normal; }
.search-grid.w-clear i { color: rgb(236, 45, 63); }
.search-res .search-grid p { float: left; width: 35px; height: 38px; cursor: pointer; outline: none; border: none; margin: 0px; font-size: 17px; display: block; color: var(--color-red); line-height: 40px; text-align: center; }
.search-res .search-grid input { width: calc(100% - 36px); float: right; line-height: 38px; outline: none; border: none; color: rgb(135, 142, 136); }
.search-res .search-grid input::-webkit-input-placeholder { color: rgb(204, 204, 204); }

/* Slideshow */
.slide-top { }
.slideshow { position: relative; }
.slideshow-item { display: block; cursor: pointer; position: relative; }
.slideshow:hover .control-slideshow { opacity: 1; }
.control-slideshow { opacity: 0; }
.slide-arrow { transform: translateY(-40%); position: absolute; top: 40%; left: -60px; z-index: 1; border: none; background: none; cursor: pointer; }
.slide-arrow.ic-right { left: unset; right: -60px; }
.slide-arrow:focus { outline: none; }
.slide-img { width: 100%; object-fit: cover; }
.slide-arrow-pro { transform: translateY(-40%); position: absolute; top: 40%; left: -20px; z-index: 1; border: none; background: none; cursor: pointer; }
.slide-arrow-pro.ic-right { left: unset; right: -30px; }

/*---*/
.slide-2, .slide-3, .slide-4, .slide-5, .slide-6 { margin: 0 -10px; }
.slide-2 .slick-slide, .slide-3 .slick-slide, .slide-4 .slick-slide, .slide-5 .slick-slide, .slide-6 .slick-slide { margin: 0 10px; }
.slide-news { margin: 0 -20px; }
.slide-news .slick-slide { margin: 0 20px; }

/*Google dichj*/
.goog-te-gadget { font-size: 13px !important; color: #515151 !important; }
#google_language_translator { display: inline-block; line-height: 40px; height: 40px; overflow: hidden; float: right; cursor: pointer; }
#google_language_translator * { outline: none; cursor: pointer; }
.social_header { display: inline-block; float: right; margin-left: 10px; }
.goog-te-combo { line-height: 25px;/* border-radius: 5px; */ height: 30px; }
.goog-te-banner-frame { display: none }

/* Breadcrumb */
.breadCrumbs { background-color: rgb(238, 238, 238); margin-bottom: 15px; }
.breadCrumbs .wrap-content { padding: 0.75rem 15px; }
.breadCrumbs .wrap-content .breadcrumb { padding: 0px; margin-bottom: 0px; background-color: transparent; border-radius: 0px; }
.breadCrumbs .wrap-content .breadcrumb-item a { color: var(--color-black); }
.breadCrumbs .wrap-content .breadcrumb-item.active a { color: var(--color-gray); }

/*Intro*/
.wrap-intro { background-color: rgb(238, 234, 221); }
.news-intro::before { content: ""; position: absolute; width: 1px; height: calc(100% - 50px); top: 10px; left: 90px; background-color: rgb(202, 202, 202); }
.news-scroll::before, .news-scroll::after { content: ""; position: absolute; width: 10px; height: 10px; left: 85px; border-radius: 100%; background-color: rgb(202, 202, 202); }
.news-scroll::before { top: 10px; }
.news-scroll::after { bottom: 40px; }
.news-control { left: 85px; font-size: 13px; opacity: 0.5; z-index: 1; cursor: pointer; }
.news-control:hover { opacity: 1; color: var(--color-main); }
.news-control#up { top: -10px; }
.news-control#down { bottom: 20px; }
.news-shadow { padding-bottom: 30px; }
.news-shadow-time { font-size: 13px; width: 75px; margin-right: 45px; }
.news-shadow-time::after { content: ""; position: absolute; width: 20px; height: 20px; top: calc(50% - 10px); right: -26px; background-repeat: no-repeat; background-position: center center; background-image: url("../images/pattern-news.png"); }
.news-shadow-article { width: calc(100% - 120px); padding: 14px 15px; border-radius: 10px; background-color: rgb(255, 255, 255); border: 1px solid rgb(206, 202, 187); }
.news-shadow-article::before { content: ""; position: absolute; top: calc(50% - 13px); left: -13px; z-index: 0; border-top: 13px solid transparent; border-right: 13px solid rgb(206, 202, 187); border-bottom: 13px solid transparent; }
.news-shadow-article::after { content: ""; position: absolute; top: calc(50% - 12px); left: -11px; z-index: 1; border-top: 12px solid transparent; border-right: 11px solid rgb(255, 255, 255); border-bottom: 12px solid transparent; }
.news-shadow-image { margin-right: 10px; width: 90px; }
.news-shadow-info { width: calc(100% - 100px); }
.news-shadow-name { height: 36px; font-size: 15px; font-weight: 700; }
.news-shadow-name a { color: rgb(34, 34, 34); }
.news-shadow-name a:hover { color: var(--color-main); }
.news-shadow-desc { height: 38px; font-size: 13px; }
.news-shadow-name a.text-split, .news-shadow-desc.text-split { -webkit-line-clamp: 2; }

/* News */
.news { margin-bottom: 2rem; }
.news-name { margin-bottom: 0.5rem; }
.news-name a { color: #333; font-size: 16px; }
.news-name a.text-split { -webkit-line-clamp: 2; }
.news-name a:hover { color: var(--hover-color); }
.news-time { color: #84878a; margin-bottom: 0.25rem; }
.news-desc { color: #333333; margin-top: 5px; line-height: 22px; }
.othernews b { margin-bottom: 10px; }
.list-news-other { padding-left: 17px; list-style: square; }
.list-news-other li { margin-bottom: 2px; }
.list-news-other li a { text-transform: none; color: #333333; }
.list-news-other li a:hover { color: var(--color-red); }
.btn-download { background: var(--main-color); border-radius: 5px; text-align: center; margin: 0 !important; width: 18%; }
.btn-download:hover { background: var(--second-color); }

/*VIDEO*/
.wrap-video { margin-bottom: 60px; }
.desc-video { border-top: 1px solid var(--main-color); border-bottom: 1px solid var(--main-color); padding: 40px 0; }
.desc-video>div{ -webkit-line-clamp: 9;}
.desc-video>div p{ -webkit-line-clamp: 9; line-height: 26px; margin-bottom: 26px; }
.btn-video { width: 130px; background: var(--second-color); text-align: center; border-radius: 50px; }
.btn-video:hover { background: var(--main-color); }
.btn-video a { color: var(--main-color); text-transform: uppercase; display: block; padding: 10px 0; }
.btn-video a:hover { color: var(--second-color); text-decoration: none; }
.item-video { position: relative; cursor: pointer; }

/*--*/
.icon-video { background: url("../images/dat/icon-video.png") no-repeat; width: 112px; height: 110px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; cursor: pointer; }
.video { cursor: pointer; margin-bottom: 1rem; }
.video-image { position: relative; margin-bottom: 0.75rem; }
.video-image::before { content: ""; position: absolute; width: 50px; height: 35px; top: calc(50% - 25px); left: calc(50% - 17.5px); z-index: 1; background-repeat: no-repeat; background-image: url("../images/play.png"); }
.video-name { text-align: center; font-size: 16px; color: var(--color-black); margin-bottom: 0px; }

/*PRODUCT*/
.rp-product { padding: 0 10px; }
.fix-product { padding: 0 10px; padding-bottom: 20px; }
.wrap-product {padding: 40px 0px;}

/*---*/
.product-ul { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin: 0px auto; padding-bottom: 20px; }
.product-li { list-style-type: none; text-align: center; cursor: pointer; transition: all 0.3s ease 0s; position: relative; background: #fff; margin: 0 5px; border: 1px solid #e6e6e6; border-radius: 5px; }
.product-li:first-child::before { display: none; }
.product-li a { text-transform: capitalize; display: grid; font-size: 15px; font-weight: 700; color: #282828; padding: 10px 20px; border-radius: 5px; }
.product-li a div { margin-bottom: 20px; background: #fff; border: 3px solid #ffc107; border-radius: 100%; width: 100px; height: 100px; display: flex; justify-content: center; align-items: center; }
.product-ul > li.active a, .product-ul li:hover a { text-decoration: none; color: #fff; background: var(--main-color); }

/*---*/
.box-product { margin-bottom: 50px; }
.box-product:last-child{margin-bottom:0;}
.item-product { position: relative; border: 1px solid #e1e1e1; padding: 10px; border-radius: 40px; }
.item-product .scale-img { border-radius: 30px; }
.title-product { text-align: center; padding-top: 10px; }
.name-product { }
.name-product a { font-size: 15px; color: #333333; -webkit-line-clamp: 1; }
.name-product a:hover { text-decoration: none; color: var(--hover-color); }
.price-product { margin: 0; }
.price-product .price-new { font-size: 15px; font-family: var(--font2); color: #000; }
.price-product .price-old { margin-left: 10px; font-size: 13px; color: #626262; text-decoration: line-through; }
.price-product .price-per { position: absolute; top: 10px; right: 10px; background: var(--hover-color); color: #fff; border-radius: 100%; height: 37px; width: 37px; display: flex; justify-content: center; align-items: center; font-size: 12px; }

/* Product Detail */
.box-product-detail{display: flex; justify-content: space-between; position: relative; }
.product-detail-left{width: 23.8%;position: sticky;top: 10%;height: 500px;}
.product-top { padding-bottom: 20px; }
.product-top p {margin: 0;font-size: 18px;font-weight: 700;text-transform: uppercase;color: #fff;text-align: center;line-height: 40px;background: url(../images/dat/icon3.png) no-repeat center left 20px #cc0000;border-radius: 10px 10px 0 0;}
.pro-list {margin: 0;padding: 0;background: var(--main-color);list-style-type: none;height: 200px !important;}
.pro-list li {padding: 12.5px 0px 12.5px 30px;border-top: 1px solid #00000024;}
.pro-list li:first-child { border-top: 0; }
.pro-list li a {font-size: 16px;color: #000;max-width: 220px;-webkit-line-clamp: 1;}
.pro-list li:hover a {text-decoration: none;color: var(--hover-color);}
.pro-list li:hover a i {text-decoration: none;color: var(--hover-color);}
.pro-list li a i {font-size: 18px;color: #000;margin-right: 15px;}
.product-bottom { }
.product-bottom p {margin: 0;font-size: 18px;font-weight: 700;text-transform: uppercase;color: #fff;text-align: center;line-height: 40px;background: url(../images/dat/icon2.png) no-repeat center left 30px #cc0000;border-radius: 10px 10px 0 0;}
.pro-brand {margin: 0;padding: 0;background: var(--main-color);brand-style-type: none;height: 250px;overflow-y: scroll;}
.pro-brand li { padding: 12.5px 0px 12.5px 30px; border-top: 1px solid #ffffff2b; }
.pro-brand li:first-child { border-top: 0; }
.pro-brand li a {font-size: 16px;color: #000;max-width: 220px;-webkit-line-clamp: 1;}
.pro-brand li:hover a {text-decoration: none;color: var(--hover-color);}
.pro-brand li:hover a i {text-decoration: none;color: var(--hover-color);}
.pro-brand li a i {font-size: 18px;color: #000;margin-right: 15px;}
.product-detail-right{width: 74.6%;}
/*--*/
.img-partner-detail{border-radius: 10px;}
.partner-name-detail{text-align: center;}
.partner-name-detail a{font-size: 15px;font-weight: 500;color: #000;text-transform: uppercase;}
.partner-name-detail:hover a{text-decoration:none;color:var(--hover-color);}
/*---*/
.grid-pro-detail { margin-bottom: 3rem; margin-top: 20px; }
.left-pro-detail { position: relative; text-align: center; }
.left-pro-detail .MagicZoom { border: 1px solid rgb(238, 238, 238); padding: 7px; border-radius: 5px; background-color: rgb(255, 255, 255); }
.gallery-thumb-pro { position: relative; margin-top: 10px; }
.owl-pro-detail { padding: 0px 30px; }
.control-pro-detail button { background-color: transparent; color: rgb(34, 34, 34); opacity: 1; width: 25px; font-size: 23px; }
.control-pro-detail button:hover { opacity: 0.7; }
.control-pro-detail button.owl-prev { left: 0px; }
.control-pro-detail button.owl-next { right: 0px; }
.thumb-pro-detail { border: 1px solid rgb(238, 238, 238); padding: 5px; border-radius: 3px; cursor: pointer; background-color: rgb(255, 255, 255); display: block !important; margin-bottom: 20px; }
.thumb-pro-detail.mz-thumb.mz-thumb-selected { border-color: rgb(206, 207, 210); }
.thumb-pro-detail img { box-shadow: none !important; filter: brightness(100%) !important; border-bottom: 0px !important; padding-bottom: 0px !important; }
.title-pro-detail { text-transform: capitalize; font-size: 20px; display: block; font-weight: 700; color: rgb(0, 0, 0); }
.comment-pro-detail { display: flex; align-items: center; justify-content: flex-start; }
.social-plugin-pro-detail { margin-bottom: 1rem; margin-top: 0px !important; }
.desc-pro-detail { margin-bottom: 1rem; }
.attr-pro-detail { list-style: none; padding: 0px; }
.attr-pro-detail li { margin-bottom: 0.5rem; }
.attr-label-pro-detail { margin: 0px 5px 0px 0px; }
.attr-label-pro-detail.d-block { display: block; margin: 0px 0px 5px; }
.attr-content-pro-detail { display: inline-block; margin-bottom: 0px; }
.price-new-pro-detail { font-weight: 700; font-size: 20px; color: var(--color-red); }
.price-old-pro-detail { font-weight: 500; color: var(--color-gray); text-decoration: line-through; padding-left: 10px; }
.price-per-pro-detail { padding-left: 10px; }
.price-per-pro-detail span { font-weight: 700; font-size: 18px; color: var(--color-red); }
.color-pro-detail { cursor: pointer; display: inline-block; vertical-align: top; position: relative; width: 35px; height: 30px; margin: 0px 0px 3px; border: 1px solid transparent; background-repeat: no-repeat; background-size: contain; background-position: center center; }
.size-pro-detail { cursor: pointer; border: 1px solid rgb(204, 204, 204); padding: 3px 10px 4px; display: inline-block; position: relative; }
.size-pro-detail.active, .color-pro-detail.active { border-color: rgb(229, 16, 29); color: rgb(229, 16, 29); }
.size-pro-detail.active::after, .color-pro-detail.active::after { content: ""; position: absolute; bottom: 0px; right: 0px; width: 13px; height: 13px; background-repeat: no-repeat; background-image: url("../images/check-cart.png"); }
.color-pro-detail input[type="radio"], .size-pro-detail input[type="radio"] { display: none; }
.quantity-pro-detail { width: 100%; max-width: 110px; line-height: normal; display: flex; align-items: center; justify-content: space-between; text-align: center; }
.quantity-pro-detail span { line-height: 25px; padding: 0px; width: 30px; height: 30px; color: rgb(95, 95, 95); cursor: pointer; font-size: 22px; border: 1px solid rgb(204, 204, 204); }
.quantity-pro-detail span.quantity-plus-pro-detail { border-left: 0px; }
.quantity-pro-detail span.quantity-minus-pro-detail { border-right: 0px; }
.quantity-pro-detail input { height: 30px; border: 1px solid rgb(204, 204, 204); width: calc(100% - 60px); text-align: center; font-size: 14px; padding: 5px; }
.cart-pro-detail { margin-bottom: 1rem; }
.cart-pro-detail a { font-size: 14px; text-transform: uppercase; color: rgb(255, 255, 255) !important; }
.tags-pro-detail a { float: left; font-size: 13px; padding-bottom: 0.375rem; margin: 0px 5px 5px 0px; }
.tags-pro-detail a i { font-size: 11px; margin: 5px 5px 0px 0px; }
.tabs-pro-detail { margin-top: 2rem; }
.tabs-pro-detail .nav-tabs .nav-link { border-top-width: 3px; font-size: 13px; }
.tabs-pro-detail .nav-tabs .nav-link.active, .tabs-pro-detail .nav-tabs .nav-item.show .nav-link { border-top-color: rgb(85, 85, 85); }
.btn-more{
    background: var(--main-color);
    display: flex;
    justify-content: center;
    width: 24%;
    margin: 0px auto;
    margin-bottom: 20px;
    color: #000;
}

.btn-more:hover {
    background: var(--second-color);
    color: var(--main-color);
}
/*PRODUCT LIST*/
.wrap-productlist { padding: 60px 0 10px; }
.item-productlist { position: relative; margin: 37px 0 30px 0; }
.icon-productlist { position: absolute; left: 10px; top: -34px; z-index: 10; }
.item-productlist .scale-img { }
.title-productlist { width: 65%; background: var(--second-color); text-align: center; position: absolute; right: 20px; bottom: -28px; z-index: 10; }
.title-productlist:hover { background: var(--main-color); }
.title-productlist a {font-size: 20px;font-family: var(--font2);text-transform: uppercase;color: var(--main-color);max-width: 100%;/* padding: 13px 5px; */line-height: 56px;-webkit-line-clamp: 1 !important;}
.title-productlist a:hover { text-decoration: none; color: var(--second-color); }

/*GIỚI THIỆU*/
.wrap-introduce {background: url(../images/dat/bg-gt.jpg) no-repeat;background-size: cover;}
.row-intro { display: flex; justify-content: space-between; align-items: start; position: relative; padding-top: 120px; }
.intro-left { width: 50%; height: 412px; position: relative; }
.wrap-introduce .images .img { display: block; position: absolute;/*IE 8*//*FF 3.5+*//*Saf3-4, Chrome, iOS 4.0.2-4.2, Android 2.3+*/box-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.2);/* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */ /*IE 5.5-7*/ }
.wrap-introduce .images .img:nth-child(1) { -webkit-animation-name: hinha; -webkit-animation-duration: 8s; -webkit-animation-iteration-count: infinite; animation-name: hinha; animation-duration: 8s; animation-iteration-count: infinite; }
.wrap-introduce .images .img:nth-child(2) { -webkit-animation-name: hinhb; -webkit-animation-duration: 8s; -webkit-animation-iteration-count: infinite; animation-name: hinhb; animation-duration: 8s; animation-iteration-count: infinite; border: 5px solid var(--main-color); }
@-webkit-keyframes hinha {
	0% { left: 0; top: 0; z-index: 1; }
	50% { left: calc(100% - 440px); top: calc(100% - 300px); z-index: 0; }
	100% { left: 0; top: 0; z-index: 1; }
}
@keyframes hinha {
	0% { left: 0; top: 0; z-index: 1; }
	50% { left: calc(100% - 440px); top: calc(100% - 300px); z-index: 0; }
	100% { left: 0; top: 0; z-index: 1; }
}
@-webkit-keyframes hinhb {
	0% { left: calc(100% - 440px); top: calc(100% - 300px); z-index: 0; }
	50% { left: 0; top: 0; z-index: 1; }
	100% { left: calc(100% - 440px); top: calc(100% - 300px); z-index: 0; }
}
@keyframes hinhb {
	0% { left: calc(100% - 440px); top: calc(100% - 300px); z-index: 0; }
	50% { left: 0; top: 0; z-index: 1; }
	100% { left: calc(100% - 440px); top: calc(100% - 300px); z-index: 0; }
}
.intro-right { width: 48%; }
.title-intro { position: relative; padding-bottom: 10px; margin-left: -140px; }
.title-intro>span { font-size: 36px; font-family: var(--font4); color: #fff; }
.title-intro h3 { font-size: 36px; text-transform: uppercase; color: var(--main-color); font-family: var(--font3); margin: 0; }
.intro-right span { -webkit-line-clamp: 3; line-height: 28px; margin-bottom: 25px; color: #fff; }

/*TIÊU CHÍ*/
.grid-criteria { display: grid; grid-template-columns: auto auto; gap: 15px; }
.item-criteria { }
.item-criteria .hrv-rotateY { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; position: relative; }
.item-criteria .hrv-rotateY:before { position: absolute; content: ''; background: var(--main-color); width: 95px; height: 1px; top: 12px; left: 63px; overflow: hidden; }
.item-criteria .hrv-rotateY:after { position: absolute; content: ''; background: var(--main-color); width: 95px; height: 1px; bottom: 11px; left: 63px; overflow: hidden; }
.item-criteria span:hover { color: var(--hover-color); }
.item-criteria span { margin: 0 !important; width: calc(100% - 85px); font-family: var(--font2); text-transform: uppercase; -webkit-line-clamp: 1; }

/*PARTNER*/
.wrap-partner { padding: 60px 0; background: #cccccc; }
.item-partner { border: 1px solid #ebebeb; }

/*TAG từ khóa*/
.wrap-keywordtag{padding: 60px 0;}
.wrap-keywordtag .wrap-content{display: flex;justify-content: space-between;align-items: flex-start;flex-wrap: wrap;}
.title-keywordtag{
	font-size: 20px;
	color: #333333;
	font-family: var(--font2);
	text-transform: uppercase;
	padding-right: 10px;
}
.keywordtag-ul{
	padding: 0;
	list-style-type: none;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: calc(100% - 150px);
	line-height: 30px;
}
.keywordtag-ul li{
	margin: 0 10px;
	margin-bottom: 3px;
	position: relative;
}

.keywordtag-ul li:before {
	position: absolute;
	content: '';
	background: #333;
	width: 1px;
	height: 16px;
	right: -12px;
	top: 7px;
	transform: rotate(17deg);
}
.keywordtag-ul li a{
	font-size: 15px;
	color: #333;
}

.keywordtag-ul li a:hover {
	text-decoration: none;
	color: var(--hover-color);
}

/*NEWS*/
.wrap-news { margin-bottom: 60px; }
.box-news { position: relative; padding-bottom: 8px; margin-bottom: 30px; }
.box-news:hover .btn-news { background: url(../images/dat/icon-tt2.png) no-repeat; }
.box-news:before { position: absolute; content: ''; background: #fef1da; width: 100%; height: 100%; z-index: -1; right: -8px; bottom: 0; }
.box-news .scale-img { }
.title-news { padding: 15px 15px 30px 15px; background: #fdfcf5; }
.title-news span { font-size: 13px; color: var(--main-color); }
.title-news h3 { margin-top: 5px; }
.title-news h3 a { font-size: 15px; color: #000000; font-family: var(--font1); text-transform: uppercase; -webkit-line-clamp: 1; }
.title-news h3 a:hover { text-decoration: none; color: var(--hover-color); }
.title-news p { font-size: 14px; color: #050505; margin: 0; -webkit-line-clamp: 2; line-height: 25px; }
.btn-news { width: 51px; height: 51px; background: url(../images/dat/icon-tt1.png) no-repeat center bottom; margin: 0 auto; position: absolute; left: 50%; bottom: -20px; transform: translateX(-50%); }

/*VIDEO*/

/*#video-select { height: 420px; }
.video-main { height: 420px; }
.video-main iframe { height: 420px; }
.listvideos { margin-top: 2px; padding: 8px 0px 8px 10px; width: 100%; }
.fotorama__stage__frame.fotorama__active img { height: 420px !important; }*/

/* Contact */
.contact-article { margin-bottom: 3rem; }
.contact-input { position: relative; margin-bottom: 15px; }
.contact-input textarea { resize: none; height: 150px; }
.contact-input .custom-file-label::after { content: attr(title); }
.contact-map { position: relative; height: 500px; }
.contact-map iframe { position: absolute; top: 0px; left: 0px; width: 100% !important; height: 100% !important; }

/*REGISTER*/
.wrap-regis { background: url(../images/dat/bg-dk.jpg) no-repeat; background-size: cover; padding: 70px 0; margin-bottom: 70px; }
.row-regis { display: flex; justify-content: space-between; align-items: center; }
.regis-left { width: 40.4%; }
.regis-right { width: 50%; }
.desc-regis { }
.desc-regis>span { font-size: 30px; color: #fff; text-transform: uppercase; }
.desc-regis p { font-size: 18px; color: #fff; margin: 15px 0; }
.hotline-regis { display: inline-grid; }
.hotline-regis span { font-size: 15px; color: #fff; text-transform: uppercase; }
.hotline-regis a { font-size: 30px; color: #fff; background: url(../images/dat/icon-phone.png) no-repeat left center; padding-left: 36px; }
.hotline-regis a:hover { text-decoration: none; color: var(--hover-color); }

/*--*/
.box-regis { background: #fff; padding: 40px 30px; }
.title-regis { }
.title-regis span { font-size: 30px; text-transform: uppercase; }
.title-regis p { margin-top: 5px; }
#FormNewsletter { }
#FormNewsletter input { border: 0; height: 40px; border-bottom: 1px solid #cccccc; margin-bottom: 20px; width: 48%; }
#FormNewsletter textarea { border: 0; height: 70px; border-bottom: 1px solid #cccccc; margin-bottom: 20px; width: 100%; }
#FormNewsletter button { border: 0; border-radius: 50px; background: var(--main-color); width: 136px; height: 45px; font-size: 15px; color: #fff; text-transform: uppercase; }
#FormNewsletter button:hover { background: var(--second-color); }

/* Footer */
.footer { margin: 0 !important; }
.footer-article {position: relative;background: url(../images/dat/bg-ft.jpg) no-repeat;background-size: cover;padding-top: 50px;}
.title-footer { font-size: 20px; font-weight: 900; color: rgb(0, 160, 255); text-transform: uppercase; margin-bottom: 20px; }
.footer-info { font-size: 15px; color: #fff; margin: 20px 0px 0px 0; line-height: 22px; }
.footer-info.content-ck p { margin-bottom: 15px; }
.social-ft {display: flex;justify-content: flex-start;align-items: center;padding: 0px;margin: 0;}
.social-ft li {list-style-type: none;margin: 0 5px;font-size: 15px;color: #fff;font-family: var(--font2);text-transform: uppercase;}
.footer-title-main { font-size: 45px; color: #fff; text-transform: capitalize; margin: 0; font-family: 'Lobster', cursive; }
.footer-title {text-align: left;font-size: 15px;color: var(--main-color);display: block;text-transform: uppercase;font-family: var(--font2);}
.footer-ul { list-style: none; padding: 0px; margin: 0; padding: 18px 0 8px 0; }
.footer-ul li { margin-bottom: 10px; }
.footer-ul li {line-height: 24px;list-style-type: disc;list-style-position: inside;position: relative;margin: 0;margin-bottom: 10px;color: var(--main-color);}
.footer-ul li:last-child { margin-bottom: 0px; }
.footer-ul li a { color: #fff; font-size: 14px; font-weight: 500; }
.footer-ul li:hover a { text-decoration: none; color: var(--hover-color); }
.footer-tags { background: rgb(238, 238, 238); }
.footer-tags .wrap-content { padding: 30px 15px; }
.footer-tags-lists { list-style: none; padding: 0px; margin: 0px; }
.footer-tags-lists li { float: left; }
.footer-tags-lists li a { padding-bottom: 0.375rem; }
.footer-powered {padding: 16px 0px;}
.footer-copyright {text-align: left;color: #fff;font-size: 13px;}
.footer-copyright span { font-weight: 800; }
.footer-top { text-align: center; }
.box-footer {display: flex;justify-content: space-between;align-items: start;flex-wrap: wrap;padding: 40px;border: 1px solid var(--main-color);}
.item-footer1 {width: 30%;}
.item-footer2 {width: 19%;}
.item-footer3 {width: 29.2%;}
.title-main-footer{
    text-align: center;
    margin-bottom: 30px;
}
.title-main-footer h3{
    font-size: 36px;
    color: var(--main-color);
    font-family: var(--font3);
    margin: 0;
}
.title-main-footer span{
    font-size: 14px;
    color: #fff;
}

/**/
.footer-statistic { text-align: right; color: #fff; font-size: 13px; }
.menu-footer { list-style-type: none; margin: 0px; padding: 0px; }
.menu-footer li { padding: 5px 13px; position: relative; }
.menu-footer li::after { position: absolute; content: ""; border: 1px dashed rgba(204, 204, 204, 0.8); width: 1px; height: 20px; right: -2px; top: 5px; }
.menu-footer li:last-child::after { border: 0px solid rgb(255, 255, 255); }
.menu-footer li a { color: rgb(76, 76, 76); }
.menu-footer li:hover a { text-decoration: none; color: rgb(211, 4, 4); }
.footer-statistic span { padding: 0 6px; border-right: 1px solid #fff; }
.footer-statistic span:last-child { border: 0; }
.footer-statistic span:last-child { padding-right: 0px; }
#footer-map {position: relative;height: 450px;}
#footer-map iframe { position: absolute !important; width: 100% !important; height: 100% !important; top: 0px !important; left: 0px !important; }
#fanpage-facebook { }
#fanpage-facebook iframe { }
.map-facebook { position: relative; margin-top: 60px; }

/* Chi nhanh */
.info-map { position: relative; }
.info-map ul { padding: 0; position: absolute; top: 20px; left: 30px; z-index: 100; margin: 0; }
.info-map ul li { text-align: center; padding-top: 0; margin: 5px; background: #fff; list-style: none; cursor: pointer; box-shadow: 0 0 5px 5px #00000029; display: inline-block; }
.info-map ul li .content { padding: 10px; max-height: 200px; overflow: auto; }
.info-map ul li.act span.title-listmap { background: #041bf5; }
.info-map ul li span.title-listmap { font-size: 20px; display: block; font-weight: 400; text-transform: uppercase; color: #fff; background: #000000ab; position: relative; padding: 8px 28px; }
.iframe-map { display: none; }
.iframe-map.act { display: block; }
.iframe-map iframe { width: 100%; }

/*HOVER ROTATE */
.hrv-rotateY img { transition: all 0.9s ease 0s; }
.hrv-rotateY:hover { text-decoration: none; }
.hrv-rotateY:hover img { transition: all 0.7s ease 0s; transform: rotateY(180deg); text-decoration: none; }

/* Like Share */
.social-plugin { display: flex; justify-content: flex-start; margin-top: 10px; }
.social-plugin .at-share-btn { margin-bottom: 0px !important; }
.social-plugin .zalo-share-button { margin-left: 3px; }

/* Paging */
.share .pagination-home { padding-bottom: 0; }
.pagination-home { padding-bottom: 20px; }
.pagination-home .pagination .page-item .page-link { color: rgb(85, 85, 85); font-size: 0.875rem; }
.pagination-home .pagination .page-item.active .page-link { color: rgb(255, 255, 255); background-color: var(--main-color); border-color: var(--main-color); }

/* Paging Ajax */
.pagination-ajax { text-align: center; }
.pagination-ajax a { display: inline-block; vertical-align: top; margin: 0px 3px 3px; width: 32px; height: 32px; line-height: 31px; border: 1px solid #a9a9a9;/* background-color: #ebebeb; */ font-size: 14px; font-weight: 600; color: #a9a9a9 !important; cursor: pointer; text-decoration: none !important; border-radius: 100%; }
.pagination-ajax a.current, .pagination-ajax a:hover { border-color: var(--main-color);/* background-color: var(--main-color); */ font-weight: 500; color: var(--main-color) !important; }
.pagination-ajax a.first, .pagination-ajax a.last, .pagination-ajax a.prev, .pagination-ajax a.next { text-indent: -9999px; position: relative; background-color: rgba(26, 26, 26, 0.1) !important; }
.pagination-ajax a.first::before, .pagination-ajax a.last::before, .pagination-ajax a.prev::before, .pagination-ajax a.next::before { content: ""; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 2; background-color: #fff; background-repeat: no-repeat; background-position: center center; border-radius: 100%; }
.pagination-ajax a.first::before { background-image: url("../images/page-first.png"); }
.pagination-ajax a.last::before { background-image: url("../images/page-last.png"); }
.pagination-ajax a.prev::before { background-image: url("../images/page-prev.png"); }
.pagination-ajax a.next::before { background-image: url("../images/page-next.png"); }

/* Popup */
#popup .modal-body { padding: 0px; }

/* Hidden Google Captcha */
.grecaptcha-badge { overflow: hidden; display: none !important; width: 0px !important; height: 0px !important; visibility: hidden !important; }

/* Hidden Check Grammar Coccoc */
coccocgrammar { display: none; }

/* Scroll Top */
.scrollToTop { width: 41px; height: 41px; text-align: center; font-weight: bold; color: rgb(68, 68, 68); text-decoration: none; position: fixed; bottom: 90px; right: 25px; display: none; z-index: 10; cursor: pointer; }

/* Text Hide */
.text-split { overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 3; }

/* Transition All */
.transition { transition: all 0.3s ease-out 0s; }

/* Scale IMG */
.scale-img { overflow: hidden; display: block; }
.scale-service.scale-img { margin: 0px auto; display: table; z-index: 10; }
.scale-img img { transition: all 0.3s ease-out 0s; transform: scale(1, 1); }
.scale-img:hover > img { transition: all 0.3s ease-out 0s; transform: scale(1.1, 1.1); }

/* Blink */
.blink { animation-name: blink; animation-duration: 1s; animation-timing-function: linear; animation-iteration-count: infinite; }
@-webkit-keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}


/*Scrollbar*/
.scrollbar {height: 200px;overflow-y: scroll;}
#style-2::-webkit-scrollbar { border-radius: 10px; width: 5px; background-color: #F5F5F5; }
#style-2::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); background-color: #ec1c24; }
#style-2::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); border-radius: 10px; background-color: #F5F5F5; }

/*Hover Glass*/
.hover-glass { overflow: hidden; display: block; position: relative; }
.hover-glass::before { position: absolute; top: 0px; left: -75%; z-index: 2; display: block; content: ""; width: 50%; height: 100%; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%); transform: skewX(-25deg); }
.hover-glass:hover::before { animation: 0.75s ease 0s 1 normal none running shine; }
@-webkit-keyframes shine {
	100% { left: 125%; }
}
@keyframes shine {
	100% { left: 125%; }
}

/*ALBUM*/
.album { cursor: pointer; margin-bottom: 1rem; }
.album-image { margin-bottom: 0.75rem; }
.album-name { margin-bottom: 0px; text-align: center; }
.album-name a { display: block; font-size: 16px; color: var(--color-black); margin-bottom: 0px; }
.album-name:hover a { text-decoration: none; color: #d00; }
.hover-img img { filter: grayscale(1); }
.hover-img:hover img { filter: none; }

/* Button Frame */
.btn-frame { display: block; width: 50px; height: 50px; position: fixed; right: 20px; z-index: 10; cursor: pointer; }
.btn-frame i { display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; border-radius: 50%; background: var(--main-color); position: relative; z-index: 1; }
.btn-frame i img { vertical-align: middle; width: 70%; }
.btn-frame .animated.infinite { animation-iteration-count: infinite; }
.btn-frame .kenit-alo-circle { width: 60px; height: 60px; top: -5px; right: -5px; position: absolute; background-color: transparent; border-radius: 100%; border: 2px solid var(--main-color); opacity: 0.5; }
.btn-frame .zoomIn { animation-name: zoomIn; }
.btn-frame .animated { animation-duration: 1s; animation-fill-mode: both; }
.btn-frame .kenit-alo-circle-fill { width: 70px; height: 70px; top: -10px; right: -10px; position: absolute; border-radius: 100%; border: 2px solid transparent; transition: all 0.5s ease 0s; background-color: var(--main-color); opacity: 0.4; }
.btn-frame .pulse { animation-name: pulse; }

/*Btn-frame VIDEO*/
.btn-frame__video { display: block; width: 88px; height: 88px; z-index: 2; cursor: pointer; background-color: rgb(209, 211, 212); border-radius: 100%; }
.btn-frame__video img { border-radius: 100%; }
.btn-frame__video i { display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; border-radius: 50%; background: rgb(204, 0, 0); position: relative; z-index: 1; }
.btn-frame__video i img { vertical-align: middle; width: 70%; }
.btn-frame__video .animated.infinite { animation-iteration-count: infinite; }
.btn-frame__video .kenit-alo-circle { width: 90px; height: 90px; top: 0px; right: 0px; position: absolute; background-color: transparent; border-radius: 100%; border: 2px solid rgb(209, 211, 212); opacity: 0.5; }
.btn-frame__video .zoomIn { animation-name: zoomIn; }
.btn-frame__video .animated { animation-duration: 1s; animation-fill-mode: both; }
.btn-frame__video .kenit-alo-circle-fill { width: 100px; height: 100px; top: -5px; right: -7px; position: absolute; border-radius: 100%; border: 6px solid rgb(255, 255, 255); transition: all 0.5s ease 0s; background-color: rgba(255, 255, 255, 0); opacity: 0.4; }
.btn-frame__video .pulse { animation-name: pulse; }
.btn-frame__video .kenit-alo-circle-fills { width: 90px; height: 90px; top: 0px; right: -2px; position: absolute; border-radius: 100%; border: 5px solid rgb(255, 255, 255); transition: all 0.5s ease 0s; background-color: rgba(0, 0, 0, 0.1); opacity: 0.4; }
.btn-frame__video .pulses { animation-name: pulse; }

/* Zalo */
.btn-zalo { bottom: 315px; }

/* Phone */
.btn-phone { bottom: 230px; }

/* Messenger */
.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: rgb(64, 64, 64); background: rgb(255, 255, 255); }
.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) 0px 2pt 10pt; }
.js-facebook-messenger-close-tooltip { width: 10px; height: 10px; display: inline-block; cursor: pointer; margin-left: 10px; }
.js-facebook-messenger-box.rubberBand { animation-name: rubberBand; }
.js-facebook-messenger-box.animated { animation-duration: 1s; animation-fill-mode: both; }
.js-facebook-messenger-box, .js-facebook-messenger-button, .js-facebook-messenger-tooltip { z-index: 999; }
.js-facebook-messenger-box { display: block; position: fixed; cursor: pointer; bottom: 150px; right: 17px; width: 56px; height: 56px; text-align: center; background: var(--main-color); border-radius: 100%; overflow: hidden; z-index: 99; box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 4px 0px; }
.js-facebook-messenger-box.rotate svg#fb-msng-icon { transform: rotate(0deg); }
.js-facebook-messenger-box svg#fb-msng-icon { width: 32px; height: 33px; position: absolute; top: 13px; left: 12px; opacity: 1; overflow: hidden; transition: opacity 160ms ease-in-out 0s, transform 160ms ease-in-out 0s; }
.js-facebook-messenger-box.rotate svg#close-icon { transform: rotate(-45deg); }
.js-facebook-messenger-box svg#close-icon { opacity: 0; width: 19px; height: 20px; position: absolute; top: 19px; left: 19px; transition: opacity 160ms ease-in-out 0s, transform 160ms ease-in-out 0s; }
.js-facebook-messenger-container, .js-facebook-messenger-container-button { z-index: 1000; }
.js-facebook-messenger-container { position: fixed; opacity: 0; transform: translateY(50px); bottom: 110px; right: 90px; border-radius: 10px; pointer-events: none; box-shadow: rgba(0, 0, 0, 0.06) 0px 1px 6px, rgba(0, 0, 0, 0.16) 0px 2px 32px; transition: transform 160ms ease-in-out 0s, opacity 160ms ease-in-out 0s; }
.js-facebook-messenger-top-header { width: 220px; }
.js-facebook-messenger-top-header { color: rgb(255, 255, 255); background: var(--main-color); }
.js-facebook-messenger-top-header { display: block; position: relative; width: 220px; background: var(--main-color); color: rgb(255, 255, 255); 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: rgb(255, 255, 255); background: var(--main-color); }
.js-facebook-messenger-top-header { width: 220px; }
.js-facebook-messenger-tooltip { color: rgb(64, 64, 64); background: rgb(255, 255, 255); }
.js-facebook-messenger-container.open { transform: translateY(0px); opacity: 1; pointer-events: all; }
.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; }

/* Cart Fix */
.cart-menu { position: relative; }
.cart-menu i { font-size: 18px; width: 18px; height: 14px; color: rgb(255, 255, 255); }
.cart-menu span { position: absolute; top: -8px; right: -10px; color: rgb(0, 0, 0); width: 16px; height: 16px; background: var(--color-yellow); text-align: center; line-height: 16px; font-size: 13px; border-radius: 100%; z-index: 99; }
.cart-fixed { position: fixed; left: 20px; bottom: 390px; z-index: 10; background: rgb(0, 168, 90); width: 50px; height: 50px; text-align: center; border-radius: 100%; display: flex; align-items: center; justify-content: center; color: rgb(255, 255, 255) !important; }
.cart-fixed i { font-size: 20px; }
.cart-fixed span { position: absolute; top: 0px; right: -5px; color: rgb(255, 255, 255); width: 25px; height: 25px; background: var(--color-red); text-align: center; line-height: 25px; font-size: 11px; border-radius: 100%; z-index: 99; }

/* Toolbar */
.toolbar { background: var(--main-color); width: 100%; padding: 3vw; bottom: 0px; position: fixed; z-index: 500; height: auto; left: 0px; }
.toolbar ul { list-style: none; display: flex; align-items: center; justify-content: space-between; padding: 0px; margin: 0px; }
.toolbar ul li { text-align: center; width: 25%; }
.toolbar ul li a { display: block; width: 100%; cursor: pointer; }
.toolbar ul li a img { height: 6vw; width: auto; filter: brightness(0) invert(1); -webkit-filter: brightness(0) invert(1); }
.toolbar ul li a span { font-weight: 400; color: rgb(255, 255, 255); font-size: 3.5vw; display: none; }

/* Fixbar */
.fixbar { bottom: 0px; display: block; background: rgb(240, 239, 244); border-top: 1px solid rgb(221, 221, 221); width: 100%; box-sizing: border-box; position: fixed; margin: 0px; z-index: 500; backface-visibility: hidden; height: 50px; }
.fixbar ul { margin: 0px; padding: 0px; list-style: none; }
.fixbar ul li { display: inline-block; margin: 0px auto 10px; text-align: center; width: 25%; float: left; }
.fixbar .icon-cart-mobile, .fixbar .icon-cart-new, .fixbar .icon-home-new, .fixbar .icon-hotdeal-new { width: 20px; height: 20px; display: block; margin: 8px auto 0px; }
.fixbar .icon-cart-mobile { background: url("../images/cart-mobile.png") no-repeat; }
.cart-total-header-mobile { font-size: 10px; position: absolute; background: red; border-radius: 50%; height: 15px; width: 15px; line-height: 15px; top: 5px; margin-left: 5px; color: rgb(255, 255, 255) !important; }
.fixbar ul li a { font-size: 11px; text-decoration: none; color: rgb(51, 51, 51); }
.fixbar ul li a i { font-size: 20px; }

/* Plugbar */
.plugbar { position: fixed; bottom: 0px; left: 0px; border-top: 1px solid rgb(234, 230, 230); width: 100%; right: 0px; max-width: 767px; margin: 0px auto; background: rgb(255, 255, 255); padding: 9px 10px 10px 7px; z-index: 10; }
.plugbar ul { list-style: none; padding: 0px; margin: 0px; display: flex; justify-content: space-between; align-items: center; }
.plugbar ul li { width: 20%; float: left; }
.plugbar ul li a { display: block; color: rgb(105, 105, 105); font-size: 12px; text-align: center; position: relative; }
.plugbar ul li a i { font-size: 20px; color: rgb(105, 105, 105); }
.plugbar ul li a span { position: absolute; width: 50px; height: 50px; top: -40px; left: calc(50% - 25px); font-size: 14px; display: block; border: 1px solid rgba(234, 230, 230, 0.5); border-radius: 100%; }

/* Combo Phone */
.support-online { position: fixed; z-index: 999; left: 10px; bottom: 0px; }
.support-online a { position: relative; margin: 20px 10px; text-align: left; width: 40px; height: 40px; }
.support-online i { width: 40px; height: 40px; background: rgb(67, 161, 243); color: rgb(255, 255, 255); border-radius: 100%; font-size: 20px; text-align: center; line-height: 1.9; position: relative; z-index: 999; }
.support-online a span { border-radius: 2px; text-align: center; background: rgb(103, 182, 52); padding: 9px; display: none; width: 180px; margin-left: 10px; position: absolute; color: rgb(255, 255, 255); z-index: 999; top: 0px; left: 40px; transition: all 0.2s ease-in-out 0s; animation: 0.7s ease 0s 1 normal none running headerAnimation; }
.support-online a:hover span { display: block; }
.support-online a { display: block; }
.support-online a span::before { content: ""; width: 0px; height: 0px; border-style: solid; border-width: 10px 10px 10px 0px; border-color: transparent rgb(103, 182, 52) transparent transparent; position: absolute; left: -10px; top: 10px; }
.support-online .kenit-alo-circle-fill { width: 60px; height: 60px; top: -10px; position: absolute; border-radius: 100%; border: 2px solid transparent; transition: all 0.5s ease 0s; background-color: rgba(0, 175, 242, 0.5); opacity: 0.75; right: -10px; }
.support-online .kenit-alo-circle { width: 50px; height: 50px; top: -5px; right: -5px; position: absolute; background-color: transparent; border-radius: 100%; border: 2px solid rgb(0, 137, 185); opacity: 0.5; }
.support-online .support-online .btn-support { cursor: pointer; }
.support-online .mes i { background: orange; }
.support-online .sms i { background: red; }
.support-online .call-now i { background: green; }

/* Phone Switch */
.widget-mobile { position: fixed; left: 50%; transform: translateX(-50%); bottom: 10px; z-index: 9999999; }
#my-phone-circle { position: relative; width: 50px !important; height: 50px !important; }
.wcircle-open .wcircle-icon i::before { content: ""; }
.wcircle-icon { background: rgb(18, 130, 252); border-radius: 50%; align-items: center; -webkit-box-pack: center; justify-content: center; display: flex !important; position: relative !important; }
.wcircle-icon::before { position: absolute; content: ""; width: 60px; height: 60px; background: rgba(18, 130, 252, 0.5); border: 1px solid rgb(255, 255, 255); border-radius: 50%; left: -5px; top: -5px; animation: 1s ease-in-out 0s infinite normal none running pulse; }
.wcircle-icon::after { position: absolute; content: ""; width: 80px; height: 80px; background: rgba(18, 130, 252, 0.5); border-radius: 50%; left: -15px; top: -15px; animation: 2s ease-in-out 0s infinite normal none running zoomIn; }
.wcircle-menu { left: 0px; top: 0px; display: none; position: absolute !important; }
.wcircle-menu-item { width: 50px; height: 50px; background: rgb(18, 130, 252); border-radius: 50%; display: flex; align-items: center; -webkit-box-pack: center; justify-content: center; }
.wcircle-menu-item img { width: 50px; height: 50px; display: block; border-radius: 50%; }
.wcircle-menu-item i, .wcircle-icon i { font-size: 25px; color: rgb(255, 255, 255); position: relative; z-index: 9999; }
.shake-anim { animation: 1s ease-in-out 0s infinite normal none running shake-anim; transform-origin: 50% 50%; }
@-webkit-keyframes shake-anim {
	0%, 100%, 50% { transform: rotate(0deg) scale(1) skew(1deg); }
	10%, 30% { transform: rotate(-25deg) scale(1) skew(1deg); }
	20%, 40% { transform: rotate(25deg) scale(1) skew(1deg); }
}

/* Responsive */
@media (min-width:1200px) {
	.toolbar { display: none; }
}
@media (max-width:1200px) {
	.header, .social-header, .menu-page, .btn-zalo, .btn-phone, #messages-facebook { display: none !important; }
	.menu-res { display: block; }
	.footer { overflow: hidden; }
	.search-res .icon-search { background: var(--second-color) !important; background-image: none !important; width: 40px !important; height: 40px; display: flex; justify-content: center; align-items: center; }
	.box-slide { display: block; }
	.slide-top, .slide-top img, .box-document { width: 100%; }
	.box-document { padding: 0 10px; padding-top: 20px; }
	.name-document { margin-bottom: 15px; }
	.name-document a { padding-right: 40px; font-size: 17px; }
	.slide-6up { margin: 0 -15px; }
	.slide-6up .slick-slide { margin: 0 15px; }
}
@media (min-width:1024px) { }
@media (max-width:1024px) {
	.btn-primarys { bottom: 210px; }
	.scrollToTop { bottom: 150px; }
	.header-bottom .wrap-content { display: block !important; }
	.banner-header { margin: 0px auto; }
	.wrap-main .grid-pro-detail, .wrap-main .content-main { padding: 0px 10px; }
	.wrap-main .wrap-content, .footer .wrap-content { padding: 0px 10px; }

	/*---*/
	.title-intro{margin-left: -100px;}
	.fix-product{padding: 0 7px;padding-bottom: 14px;}
	.btn-more{width: 29%;}
	.desc-video{padding: 32px 0;}
	.desc-video p{-webkit-line-clamp:7;}
	.item-footer1{width: 34%;}
	
}
@media (max-width:769px) {
	.news-info { padding-top: 10px; }
	.wrap-main.wrap-home>div {padding: 30px 0;margin-bottom: 0;}

	/*---*/
	.btn-more{width: 50%;}
	.row-intro{display: block;padding-top: 0;}
	.intro-left{height: 350px;width: 100%;}
	.intro-right{width: 100%;}
	.title-intro{margin-left:0; }
	.wrap-introduce{padding: 30px 0;background: #000;background-image: none; }
	.wrap-video{padding-top: 0 !important;}
	.desc-video{margin-top: 20px;}
	.item-footer1,.item-footer2,.item-footer3{width: 48%;}
	.footer-copyright,.footer-statistic{text-align: center;}
	.box-product-detail{display: block;}
	.product-detail-left{width: 100%;position: relative;}
	.product-detail-right{width: 100%;}

}
@media (max-width:640px) {
	.title-main span,.title-main-footer h3,.title-intro h3{font-size: 28px;}
	.item-footer1,.item-footer2,.item-footer3{width: 100%;}
	.item-footer2{margin: 20px 0;}
	.slide-news{margin: 0 -10px;}
	.slide-news .slick-slide{margin: 0 10px;}
	.wrap-keywordtag .wrap-content{display: block;}
	.keywordtag-ul{width: 100%;}
	.box-footer{padding: 20px;}

}
@media (max-width:426px) {
	.title-productlist a{line-height: 45px;font-size: 17px;}
	.intro-left{zoom:0.6;}
	.grid-criteria{grid-template-columns:auto;}
	.btn-more{width: 75%;}
}
@media (max-width:376px) {
	.title-main span, .desc-regis>span { font-size: 24px; }
	.btn-download { width: 55%; }
	.title-main span, .title-main-footer h3, .title-intro h3{font-size: 24px;}
}
@media (max-width:374px) { }