* {
	box-sizing: border-box;
}

:root {
	--primary-color: #404040;
	--second-color: #000000;
	--third-color: #FFFFFF;
	--fourth-color: #dd3333;
	--fifth-color: silver;
	--sixth-color: #f1f1f1;
	--seventh-color: #2d2d2d;
	--eighth-color: #ddd;
	--ninth-color: #333;


	--tenth-color: 255, 255, 255;
	--eleventh-color: 0, 0, 0;
	--twelfth-color: 11, 11, 11;

	--thirdteen-color: #555555;
	--fourthteen-color: #800100;
	--fifteen-color: #754c28;
	--sixthteen-color: #b20000;
	--seventeen-color: #ececec;


	--bg-facebook: #3a589d;
	--bg-insta: #3b6994;
	--bg-youtube: #c33223;

}

@font-face {
	font-family: Roboto Condensed;
	src: url('fonts/RobotoCondensed-VariableFont_wght.ttf') format('truetype'),
		url('fonts/RobotoCondensed-VariableFont_wght.woff') format('woff');
	font-display: swap;
}

body {
	/* font-family: 'Roboto', sans-serif; */
	font-family: "Roboto Condensed", sans-serif;
	line-height: 1.6;
	color: var(--primary-color);
}

.adm-glyphicon span {
	/* background: url('img/setting.png');
    background-size: cover;
    width: 12px;
    height: 12px; */
	display: inline-block !important;
	position: relative;
	z-index: 9;
}

.wrap {
	max-width: 1340px;
	width: 100%;
	margin: 0 auto;
}

a {
	transition: .3s;
}

a:hover,
a:focus {
	text-decoration: none;
}

input,
button,
textarea,
select {
	outline: none;
}

input {
	-webkit-appearance: none;
}

.img-404 {
	max-width: 100%;
}

ol,
ul,
li {
	list-style: none;
	margin: 0;
	padding: 0;
}

img {
	max-width: 100%;
	height: auto;
}

.img-100 {
	position: relative;
	height: 0;
	overflow: hidden;
	display: block;
}

.img-100>img {
	object-fit: cover;
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
}

/* .img-100:hover img {
    transform: scale(1.05);
} */

h1,
h2,
h3,
h4,
h5,
h6,
p {
	width: 100% !important;
	font-size: unset;
	font-weight: unset;
	margin: 0px;
	padding: 0px;
}

p {
	margin-bottom: 20.8px;
}

.site-title {
	width: 0px;
	height: 0px;
	overflow: hidden;
	margin: 0 !important;
	padding: 0 !important;
}

/* a[href^="tel"] {
    color: inherit; 
    text-decoration: none; 
} */

#swal2-content {
	font-size: 18px;
}

.wrap-img {
	display: block;
}

.stop-scroll {
	height: 100%;
	overflow: hidden;
}

.img-zoom img {
	transition: 5s;
}

.img-zoom:hover img {
	transform: scale(1.3);
}

/* Navbar */
.navbar-wrap {
	padding-top: 8px;
}

.navbar-inner {
	text-align: right;
}

.form-search,
.navbar-inner .social-icons {
	display: inline-block;
	transition: background-color .3s;
}

.form-search {
	width: 156px;
	line-height: 33px;
	height: 33px;
	position: relative;
	margin-right: 30px;
}

.form-search input {
	width: 100%;
	border: 1px solid var(--second-color);
	color: var(--second-color);
	border-radius: 99px;
	padding: 0px 35px 0px 11px;
}

.form-search input::placeholder {
	color: currentColor;
}

.form-search button {
	position: absolute;
	top: 0;
	right: 0;
	background-color: transparent;
	border: none;
	padding: 0;
	width: 35px;
	text-align: center;
	font-size: 18px;
}

.social-icons a {
	color: var(--third-color);
	display: inline-block;
	width: 35px;
	line-height: 35px;
	border-radius: 50%;
	text-align: center;
	transition: transform .3s, border .3s, background-color .3s, box-shadow .3s, opacity .3s, color .3s;
	font-size: 18px;
}

.social-icons a:hover {
	box-shadow: inset 0 0 0 100px rgba(0, 0, 0, .2);
}

.social-icons .facebook {
	background-color: var(--bg-facebook);
}

.social-icons .insta {
	background-color: var(--bg-insta);
}

.social-icons .youtube {
	background-color: var(--bg-youtube);
}

.tool-tip {
	position: relative;
}

.tool-tip .tooltip-text {
	visibility: hidden;
	opacity: 0;
	width: 140px;
	background-color: var(--second-color);
	color: var(--third-color);
	text-align: center;
	border-radius: 6px;
	position: absolute;
	z-index: 1;
	top: calc(100% + 15px);
	left: 50%;
	transform: translateX(-50%);
	font-size: 15px;
}

.tool-tip .tooltip-text::after {
	content: "";
	position: absolute;
	bottom: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent var(--second-color) transparent;
}

.tool-tip:hover .tooltip-text {
	visibility: visible;
	opacity: 1;
	transition: 1s;
}

/* header  */
.header-wrap .logo img {
	max-height: 98px;
	transform: translateY(-22px);
	padding: 4px 0;
}

.header-wrap .menu {
	margin-top: 35px;
	margin-left: 20px;
}

.header-wrap .menu li {
	display: inline-block;
}

.header-wrap .menu li:not(:last-child) {
	margin-right: 50px;
}

.header-wrap .menu li a {
	color: var(--primary-color);
	font-weight: 700;
	font-size: 17.6px;
	text-transform: uppercase;
	transition: all .2s;
	letter-spacing: 0.352px;
}

.header-wrap .menu li.active a {
	color: var(--fourth-color);
}

@keyframes stuckMoveDown {
	0% {
		-webkit-transform: translateY(-100%);
		transform: translateY(-100%);
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

.header-wrap.affix {
	width: 100%;
	background-color: rgba(var(--tenth-color), .9);
	top: 0;
	box-shadow: 1px 1px 10px rgba(0, 0, 0, .15);
	animation: stuckMoveDown .6s;
	z-index: 8;
}

.header-wrap.affix .logo img {
	max-height: 70px;
	transform: translateY(0px);
}

.header-wrap.affix .menu {
	margin-top: 22px;
}

.icon-menu-mobile {
	display: none;
}

.menu-mobile {
	display: none;
}

.overlay-menu-mobile,
.overlay-sidebar-product-mobile {
	display: none;
}

/* banner */
#banner {
	position: relative;
}

#banner .item {
	height: 500px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}

#banner .owl-dots,
#quick-view .owl-dots {
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
}

.owl-dots button {
	margin: 0 5px;
}

#banner .owl-dots button.active span {
	background-color: var(--third-color);
}

.owl-dots button span {
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 3px solid rgba(var(--tenth-color), .4);
	transition: .3s;
}

#banner .owl-dots button:hover span {
	border: 3px solid rgba(var(--tenth-color), .7);
}

/* Giới thiệu */
.gioi-thieu {
	padding: 30px 0 62.4px;
}

.h3-title {
	font-size: 30px;
	color: var(--thirdteen-color);
	margin-bottom: 15px;
	text-transform: uppercase;
	font-weight: 700;
}

.has-padding {
	padding-bottom: 30px;
}

.gioi-thieu .h3-title {
	padding-bottom: 19.6px;
}

.mo-ta p {
	font-size: 19.2px;
	text-align: justify;
	margin-bottom: 24.96px;
}

.gioi-thieu .left .see-more {
	background-color: #800100;
	padding: 0 25px;
	color: var(--third-color);
	font-size: 12.8px;
	display: inline-block;
	letter-spacing: 0.384px;
	font-weight: 700;
	line-height: 33px;
}

.gioi-thieu .left .see-more:hover {
	box-shadow: inset 0 0 0 100px rgba(0, 0, 0, .2);
}

.gioi-thieu .wrap-img {
	padding-bottom: 66.25%;
}

/* Các thương hiệu */
.cac-thuong-hieu {
	background-color: rgb(96, 96, 96);
}

.cac-thuong-hieu .inner {
	background-color: rgba(3, 1, 1, 0.581);
	padding: 30px 0 10px;
	color: var(--third-color);
}

.cac-thuong-hieu .h3-title {
	color: var(--third-color);
}

.item-thuong-hieu {
	margin-bottom: 50px;
}

.item-thuong-hieu .wrap-img {
	padding-bottom: 75%;
}

.item-thuong-hieu .name {
	font-size: 17.6px;
	text-align: center;
	text-transform: uppercase;
	padding: 15px;
	background-color: rgb(128, 1, 0);
	color: var(--third-color);
}

.nhan-hieu {
	padding: 30px 0 10px;
	background-color: rgb(var(--eleventh-color));
}

.nhan-hieu .h3-title {
	color: var(--third-color);
}

/* Thư viện hình ảnh */
.thu-vien-anh {
	padding: 25px 0 55px;
}

#image-gallery {
	position: relative;
}

#image-gallery .wrap-img {
	padding-bottom: 75%;
}

#image-gallery .item .name {
	padding: 12.88px 10px 25.76px;
	font-weight: 400;
	font-size: 17.6px;
	text-transform: uppercase;
	display: block;
	color: var(--thirdteen-color);
	text-align: center;
	line-height: 1.3;
}

.is-divider {
	display: block;
	height: 2px;
	background-color: rgba(var(--eleventh-color), .1);
	max-width: 30px;
}

#image-gallery .is-divider {
	margin: 9.2px auto;
}

.owl-nav button {
	position: absolute;
	width: 36px;
	height: 36px;
	border: 2px solid var(--primary-color) !important;
	border-radius: 50%;
	top: 38%;
	transform: translateY(-50%);
	transition: all .3s;
	opacity: 0;
	visibility: hidden;
}

#image-gallery:hover .owl-nav button {
	opacity: 1;
	visibility: visible;
}

.owl-nav button:hover {
	background-color: var(--primary-color) !important;
	color: var(--third-color) !important;
}

.owl-nav button svg {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#image-gallery .owl-nav .owl-prev {
	left: -36px;
}

#image-gallery .owl-nav .owl-next {
	right: -36px;
}

.owl-nav button svg {
	width: 16px;
}

/* Tin tức và sự kiện */
.tin-tuc {
	padding-bottom: 30px;
}

.item-news-prj .wrap-img {
	padding-bottom: 75%;
}

.item-news-prj .name {
	font-size: 16.56px;
	color: var(--fifteen-color);
	line-height: 1.3;
	text-transform: uppercase;
	display: block;
	padding: 10px 0 20px;
	letter-spacing: 0.828px;
}

.item-news-prj .is-divider {
	margin: 7.2px 0;
}

.item-news-prj .name .loca {
	font-size: 14.4px;
	color: var(--primary-color);
	text-transform: capitalize;
	letter-spacing: 0px;
	transition: .3s;
}

.item-news-prj:hover .loca {
	color: var(--fourth-color);
}

/* footer  */
.footer-wrap {
	padding: 30px 0 70px;
	background-color: var(--seventh-color);
	border-top: 1px solid rgba(0, 0, 0, .05);
}

.cam-ket {
	padding: 0 30px;
}

.cam-ket .item {
	text-align: center;
}

.cam-ket .item img {
	max-width: 60px;
}

.cam-ket .item p {
	color: var(--third-color);
	font-weight: 400;
	font-size: 18px;
	text-transform: uppercase;
	margin-top: 16px;
}

.footer-inner {
	margin-top: 30px;
}

.footer-inner h2 {
	color: var(--third-color);
	font-size: 25.6px;
	line-height: 1.3;
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: 12.8px;
}

.footer-inner .item-left ul {
	color: var(--sixth-color);
}

.footer-inner .item-left ul li {
	margin-bottom: 9.6px;
	font-size: 16px;
}

.footer-inner .item-right {
	max-width: 510px;
	float: right;
}

.form-contact {
	text-align: center;
}

.form-contact input {
	background-color: var(--seventh-color);
	border: 1px solid var(--eighth-color);
	margin-bottom: 15px;
	padding: 0 12px;
	transition: .3s;
	color: var(--sixth-color);
	width: 100%;
	height: 39px;
	line-height: 39px;
	font-size: 16px;
	transition: .3s;
}

.form-contact input::placeholder {
	color: currentColor;
}

.form-contact input:focus {
	box-shadow: 0 0 5px #ccc;
	outline: 0;
	background-color: var(--third-color);
	color: var(--ninth-color);
}

.form-contact button {
	background-color: var(--primary-color);
	height: 40px;
	line-height: 40px;
	padding: 0px 50px;
	border: 1px solid var(--third-color);
	border-radius: 20px;
	color: var(--third-color);
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	transition: .3s;
}

.form-contact button:hover {
	box-shadow: inset 0 0 0 100px rgba(0, 0, 0, .2);
}

.footer-wrap .social-icons {
	margin: 67px 0 15px;
	text-align: center;
}

.footer-wrap .social-icons a {
	width: 41px;
	line-height: 41px;
	font-size: 21px;
}

.footer-wrap .tool-tip .tooltip-text,
.social-share .tool-tip .tooltip-text {
	top: calc(-100% - 15px);
}

.footer-wrap .tool-tip .tooltip-text::after,
.social-share .tool-tip .tooltip-text::after {
	border-color: var(--second-color) transparent transparent transparent;
	top: 100%;
}

.footer-wrap .hotline {
	text-align: center;
}

.footer-wrap .hotline a {
	color: var(--third-color);
	font-size: 20px;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 1px;
}

.copy-right {
	text-align: center;
	font-size: 18.72px;
}

.back-to-top {
	position: fixed;
	bottom: 30px;
	z-index: 21;
	right: 20px;
	display: inline-block;
	width: 40px;
	height: 40px;
	line-height: 36px;
	text-align: center;
	border: 2px solid var(--primary-color);
	border-radius: 50%;
	color: var(--primary-color);
	font-size: 20px;
	transform: translateY(30%);
	opacity: 0;
	visibility: hidden;
}

.btn-fixed {
	position: fixed;
	right: 20px;
	z-index: 21;
	display: inline-block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	transform: translateX(150%);
	opacity: 0;
	visibility: hidden;
}

.zalo-fixed {
	bottom: 130px;
}

.mess-fixed {
	bottom: 80px;
}

.back-to-top:hover {
	background-color: var(--primary-color);
	color: var(--third-color);
}

.back-to-top.active {
	transform: translateY(0);
	visibility: visible;
	opacity: 1;
}

.btn-fixed.active {
	transform: translateX(0);
	visibility: visible;
	opacity: 1;
}

/* Page detail  */
.bg-page {
	background-position: 54% 39%;
	background-size: cover;
	background-repeat: no-repeat;
	height: 400px;
	margin: 30px 0px;
	position: relative;
}

.bg-page .overlay {
	background-color: rgba(var(--eleventh-color), 0.02);
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
}

.page-detail .content {
	padding-bottom: 30px;
}

.page-detail .introduce {
	justify-content: space-between;
	display: grid;
	grid-template-columns: 49% 49%;
	align-items: center;
	text-align: center;
}

.page-detail .introduce {
	margin-bottom: 30px;
}

.page-detail .introduce-item .wrap-img {
	padding-bottom: 45%;
}

.page-detail .introduce:nth-child(even) .item-left {
	order: 1;
}

.page-detail .introduce-title {
	font-size: 20px;
	color: var(--sixthteen-color);
	margin-bottom: 10px;
	font-weight: 700;
	text-transform: uppercase;
}

.page-detail .introduce-content {
	font-size: 16px;
	text-align: left;
}

.title-doi-tac {
	position: relative;
	text-align: center;
	margin-bottom: 10px;
	margin-top: 20px;
}

.title-doi-tac span {
	font-size: 20px;
	color: var(--sixthteen-color);
	font-weight: 700;
	text-transform: uppercase;
	padding: 0 15px;
	background-color: var(--third-color);
}

.title-doi-tac::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	background: var(--primary-color);
	opacity: .1;
	bottom: 50%;
	left: 0;
	z-index: -1;
}

.doi-tac-wrap {
	margin-top: 30px;
	padding: 0 15px 30px;
}

#doi-tac {
	position: relative;
}

#doi-tac .item .wrap-img {
	padding-bottom: 70.67%;
}

#doi-tac .item .name {
	color: var(--thirdteen-color);
	padding: 10px 10px 20px 10px;
	font-size: 16.2px;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
}

#doi-tac .owl-dots {
	text-align: center;
	margin-top: 20px;
}

#doi-tac .owl-dots button span,
#quick-view .owl-dots button span {
	border: 3px solid var(--ninth-color);
	opacity: .4;
}

#doi-tac .owl-dots button:hover span,
#quick-view .owl-dots button:hover span {
	opacity: .7;
}

#doi-tac .owl-dots button.active span,
#quick-view .owl-dots button.active span {
	background-color: var(--ninth-color);
	opacity: 1;
}

#doi-tac:hover .owl-nav button {
	opacity: 1;
	visibility: visible;
}

#doi-tac .owl-nav .owl-prev {
	left: 15px;
}

#doi-tac .owl-nav .owl-next {
	right: 15px;
}

/* -----------breadcrumb------- */
.breadcrumb-build {
	background-color: var(--second-color);
	height: 60px;
	line-height: 60px;
}

.breadcrumb-build ol li {
	display: inline-block;
	position: relative;
}

.breadcrumb-build ol li:last-child a {
	pointer-events: none;
}

.breadcrumb-build ol li:not(:first-child) {
	margin-left: 20px;
}

.breadcrumb-build ol li:last-child a {
	font-weight: 700;
}

.breadcrumb-build li a {
	font-size: 16px;
	font-weight: 400;
	line-height: 20px;
	color: var(--third-color);
	text-transform: uppercase;
}

.breadcrumb-build li:not(:first-child)::before {
	content: '/';
	position: absolute;
	top: 0px;
	left: -12px;
	color: var(--third-color);
	opacity: .3;
}

/* Product list  */
.product-list-page {
	padding: 30px 0;
}

.sidebar-product .block {
	margin-bottom: 30px;
}

.sidebar-product .block .title {
	font-size: 16px;
	color: var(--fourth-color);
	text-transform: uppercase;
	font-weight: 600;
	line-height: 1.05;
	letter-spacing: 0.8px;
}

.sidebar-product .block .title .is-divider {
	height: 3px;
	margin: 10.5px 0 16px;
}

.kich-thuoc {
	width: 100%;
}

.select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 30px;
	font-size: 15.6px;
}

.sidebar-product .options li a {
	font-size: 16px;
	color: var(--primary-color);
	text-transform: uppercase;
	line-height: 40px;
	display: block;
}

.sidebar-product .options li a:hover {
	color: var(--sixthteen-color);
	font-weight: bold;
}

.sidebar-product .options li:not(:last-child) {
	border-bottom: 1px solid var(--seventeen-color);
}

.item-product .wrap-img {
	padding-bottom: 100%;
}

.item-product .wrap-img img {
	width: 100%;
}

.item-product .wrap-img .img-hover {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	opacity: 0;
	transition: .3s;
	z-index: 1;
}

.item-product:hover .img-hover {
	opacity: 1;
}

.quick-view {
	display: block;
	position: absolute;
	bottom: 0;
	width: 100%;
	background-color: var(--primary-color);
	opacity: .95;
	font-weight: bold;
	color: var(--sixth-color);
	text-transform: uppercase;
	transition: .3s;
	font-size: 13.6px;
	padding: 5.4px 0 6.8px;
	z-index: 2;
	text-align: center;
	transform: translateY(105%);
	opacity: 0;
	visibility: hidden;
}

.quick-view:hover {
	color: var(--sixth-color);
}

.item-product:hover .quick-view {
	transform: translateY(0%);
	opacity: 1;
	visibility: visible;
}

#quick-view .owl-nav button {
	opacity: 1;
	visibility: visible;
	top: 50%;
	border-radius: 0%;
	border: none !important;
	color: var(--second-color);
}

#quick-view .owl-nav .owl-prev {
	left: 0px;
}

#quick-view .owl-nav .owl-next {
	right: 0px;
}

.item-product .content {
	padding: 10px 0 20px;
	text-align: center;
}

.item-product .content .name {
	color: var(--primary-color);
}

.item-product .content .name:hover {
	color: var(--fourth-color);
}

.item-product {
	margin-bottom: 20px;
}

#modal-quick-view {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 50;
	opacity: 0;
	visibility: hidden;
	transition: .6s;
}

#modal-quick-view.active {
	visibility: visible;
	opacity: 1;
}

.overlay-quick-view {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background-color: var(--second-color);
	opacity: .6;
	z-index: 51;
}

#modal-quick-view .content {
	width: 875px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -52%);
	background-color: var(--third-color);
	z-index: 52;
	box-shadow: 3px 3px 20px 0 rgba(var(--eleventh-color), .15);
	transition: .6s;
	min-height: 437px;
}

.close-quick-view {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 52;
	padding: 10px;
	color: var(--third-color);
	opacity: .6;
	transition: .3s;
	cursor: pointer;
	transform: translateY(50%) translateZ(1px);
}

#modal-quick-view.active .close-quick-view {
	transform: translateY(0) translateZ(1px);
}

#modal-quick-view.active .content {
	transform: translate(-50%, -50%);
}

.close-quick-view:hover {
	opacity: 1;
}

#quick-view {
	width: 50%;
	float: left;
}

#modal-quick-view .info-prd-detail {
	width: 50%;
	float: right;
	padding: 30px;
}

.info-prd-detail .name {
	font-size: 24.48px;
	margin-bottom: 12.4px;
	color: var(--thirdteen-color);
	line-height: 1.3;
	font-weight: 700;
}

.info-prd-detail .is-divider {
	margin: 14.4px 0;
}

.info-prd-detail table {
	margin-bottom: 15px;
	width: 100%;
}

.info-prd-detail table th {
	font-size: 13.824px;
	padding: 6.9px 6.9px 6.9px 0px;
	text-transform: uppercase;
	letter-spacing: 0.6912px;
	line-height: 1.9;
}

.info-prd-detail table tr {
	border-bottom: 1px solid var(--seventeen-color);
}

.info-prd-detail table td {
	font-size: 12.4px;
	color: var(--thirdteen-color);
}

.info-prd-detail .danh-muc {
	font-size: 11.52px;
}

.info-prd-detail .danh-muc a {
	color: var(--primary-color);
	text-transform: uppercase;
}

.info-prd-detail .danh-muc a:hover {
	color: var(--fourth-color);
}

.loc-mobile {
	display: none;
}

.sidebar-product .block .sp-da-xem .wrap-img {
	padding-bottom: 100%;
}

.sidebar-product .block .sp-da-xem .name {
	font-size: 16px;
	color: var(--primary-color);
}

.sidebar-product .block .sp-da-xem .name:hover {
	color: var(--fourth-color);
}

.sidebar-product .block .sp-da-xem {
	padding: 10px 0;
}

.sidebar-product .block .sp-da-xem:not(:last-child) {
	border-bottom: 1px solid var(--seventeen-color);
}

/* Pagination */
.pagination-box {
	text-align: center;
}

.pagination-box div {
	display: inline-block;
}

.pagination-box div:not(:last-child) {
	margin-right: 5px;
}

.pagination-box div a {
	width: 34px;
	height: 34px;
	border: 1px solid var(--primary-color);
	display: inline-block;
	text-align: center;
	line-height: 34px;
	color: var(--primary-color);
	transition: .3s;
	border-radius: 50%;
	font-size: 15px;
	font-weight: 700;
}

.pagination-box div.prev a,
.pagination-box div.next a {
	font-size: 20px;
}

.pagination-box div.current a,
.pagination-box div a:hover {
	background: var(--primary-color);
	color: var(--third-color);
}

/* Prodcut detail */
.breadcrumb-build.prd-detail {
	background-color: transparent;
	height: 60px;
	padding-top: 20px;
	line-height: 40px;
}

.breadcrumb-build.prd-detail li a {
	color: var(--thirdteen-color);
	opacity: .6;
}

.breadcrumb-build.prd-detail li a:hover {
	opacity: 1;
}

.breadcrumb-build.prd-detail li:not(:first-child)::before {
	color: var(--primary-color);
	opacity: .35;
}

/* .breadcrumb-build.prd-detail ol li:last-child a{
    font-weight: 400;
} */

.product-detail-right {
	margin-left: -15px;
	padding-left: 30px;
	border-left: 1px solid var(--seventeen-color);
}

.product-detail-left-top {
	padding: 15px 0 80px;
}

#slider .wrap-img,
#thumbnailSlider .wrap-img {
	padding-bottom: 100%;
}

.thumbnail-slider-container {
	margin-top: 10px;
}

#thumbnailSlider img {
	opacity: .6;
}

#thumbnailSlider img.active {
	opacity: 1;
}

#thumbnailSlider {
	position: relative;
}

#thumbnailSlider .owl-nav button {
	top: 50%;
	border: none !important;
	width: 20px;
	height: 20px;
}

#thumbnailSlider:hover .owl-nav button {
	opacity: 1;
	visibility: visible;
}

#thumbnailSlider .owl-nav button:hover {
	background-color: transparent !important;
	color: var(--second-color) !important;
}

#thumbnailSlider .owl-nav .owl-prev {
	left: -5px;
}

#thumbnailSlider .owl-nav .owl-next {
	right: -5px;
}

.product-detail-left-top {
	padding-right: 15px;
}

.product-detail-left-top .info-prd-detail .name {
	font-size: 27.2px;
	margin-bottom: 13.6px;
}

.product-detail-left-top .info-prd-detail table th {
	font-size: 15.36px;
	padding: 7.68px 7.68px 7.68px 0px;
}

.product-detail-left-top .info-prd-detail table td {
	font-size: 13.824px;
}

.product-detail-left-top .info-prd-detail .danh-muc {
	font-size: 12.8px;
}

.product-detail-left-top .info-prd-detail table {
	margin-bottom: 25px;
}

.social-share {
	margin-top: 16px;
}

.social-icons .twitter {
	background-color: #2478ba;
}

.social-icons .envelope {
	background-color: #111;
}

.social-icons .linkedin {
	background-color: #0072b7;
}

.social-icons .tumblr {
	background-color: #36455d;
}

.social-icons .telegram {
	background-color: #54a9ea;
}

.related-product {
	padding-right: 15px;
	border-top: 1px solid var(--seventeen-color);
}

.related-product h3 {
	font-size: 20px;
	color: var(--thirdteen-color);
	line-height: 1.2;
	text-transform: uppercase;
	padding: 15px 0;
	font-weight: 700;
	margin-bottom: 10px;
}

#related-product {
	position: relative;
	overflow: hidden;
}

#related-product .owl-nav .owl-prev {
	left: -15px;
}

#related-product .owl-nav .owl-next {
	right: -15px;
}

#related-product .owl-nav button {
	border: none !important;
	width: 30px;
	height: 100%;
	background-color: rgba(var(--tenth-color), .7);
	box-shadow: 0 -150px 15px 0 rgba(var(--eleventh-color), .3);
	border-radius: 0;
}

#related-product:hover .owl-nav button {
	opacity: 1;
	visibility: visible;
}

#related-product:hover .owl-nav .owl-prev {
	left: -7px;
}

#related-product:hover .owl-nav .owl-next {
	right: -7px;
}

#related-product .owl-nav button:hover {
	background-color: var(--third-color) !important;
	color: var(--second-color) !important;
}

.social-icons .whatsapp {
	display: none;
}

/* News list  */
.news-list {
	padding: 30px 0 40px;
}

.item-news {
	margin-bottom: 30px;
}

.item-news .wrap-img {
	padding-bottom: 56.25%;
}

.item-news .name {
	display: block;
	padding: 10px 10px 20px 10px;
	font-size: 16.56px;
	color: var(--thirdteen-color);
	text-align: center;
	line-height: 1.3;
}

.item-news .name .is-divider {
	margin: 7.2px auto;
}

.bg-page.news .overlay {
	background-color: rgba(var(--eleventh-color), 0.17);
}

.breadcrumb-build.news li a {
	font-size: 19.2px;
}

.breadcrumb-build.news ol li:last-child a {
	color: var(--fourth-color);
	opacity: 1;
}

.breadcrumb-build.news li:not(:first-child)::before {
	font-size: 19.2px;
	top: -3px;
	left: -18px;
}

.breadcrumb-build.news ol li:not(:first-child) {
	margin-left: 30px;
}

/* News detail  */
.sidebar-news {
	padding-left: 15px;
}

.sidebar-news .block {
	margin-bottom: 24px;
}

.sidebar-news .block .title {
	font-size: 16px;
	color: var(--fourth-color);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.8px;
}

.sidebar-news .block .is-divider {
	margin: 10.5px 0 16px;
}

.sidebar-news .block .list li a {
	font-size: 16px;
	color: var(--primary-color);
	display: block;
	padding: 6px 0;
}

.sidebar-news .block .list li a:hover {
	color: var(--fourth-color);
}

.sidebar-news .block .list li:not(:last-child) {
	border-bottom: 1px solid var(--seventeen-color);
}

.lastest-news .item .wrap-img {
	padding-bottom: 100%;
}

.lastest-news .item .name {
	margin-left: -15px;
	display: block;
	line-height: 1.2;
	font-size: 16px;
	color: var(--primary-color);
}

.lastest-news .item .name:hover {
	color: var(--fourth-color);
}

.lastest-news .item {
	padding: 10px 0 20px;
}

.lastest-news .item:not(:last-child) {
	border-bottom: 1px solid var(--seventeen-color);
}

.news-detail {
	padding: 30px 0 100px;
}

.news-detail .muc-luc a {
	color: var(--primary-color);
	text-transform: uppercase;
	font-size: 11.2px;
	letter-spacing: 0.56px;
	font-weight: 700;
}

.news-detail .muc-luc a:hover {
	color: var(--fourth-color);
}

.news-detail .content-wrap .post-title {
	font-size: 27.2px;
	color: var(--thirdteen-color);
	line-height: 1.3;
	font-weight: 700;
}

.news-detail .content-wrap .is-divider {
	height: 3px;
	margin: 16px 0;
}

.news-detail .content-wrap .wrap-img {
	margin: 24px 0;
}

.news-detail .content-wrap .wrap-img img {
	width: 100%;
}

.news-detail .content-news h2,
.page-detail .content h2,
.news-detail .content-news h3,
.page-detail .content h3,
.news-detail .content-news h4,
.page-detail .content h4,
.news-detail .content-news p,
.page-detail .content p {
	font-family: 'Roboto Condensed', sans-serif !important;
	color: var(--thirdteen-color) !important;
	width: 100% !important;
}

.news-detail .content-news h2,
.page-detail .content h2 {
	font-size: 25.6px !important;
	line-height: 1.3 !important;
	font-weight: 700 !important;
	margin: 0 0 12.8px 0 !important;
}

.news-detail .content-news h3,
.page-detail .content h3 {
	font-size: 20px !important;
	line-height: 1.6 !important;
	font-weight: 700 !important;
	margin: 0 0 10px 0 !important;
}

.news-detail .content-news h4,
.page-detail .content h4 {
	font-size: 18px !important;
	line-height: 1.6 !important;
	font-weight: 700 !important;
	margin: 0 0 9px 0 !important;
}

.news-detail .content-news p,
.news-detail .description-news p,
.page-detail .content p {
	color: var(--primary-color) !important;
	font-size: 16px !important;
	line-height: 1.6 !important;
}

.news-detail .content-news div {
	font-size: 16px;
	line-height: 1.6;
}

.news-detail .content-news a,
.page-detail .content a {
	color: var(--primary-color) !important;
}

.news-detail .content-news a:hover,
.page-detail .content a:hover {
	color: var(--fourth-color) !important;
}

.news-detail .content-news img,
.page-detail .content img {
	max-width: 100% !important;
}

.news-detail .content-news ul {
	margin-bottom: 12px;
	padding-left: 20px;
	color: var(--primary-color);
}

.news-detail .content-news ul li {
	list-style: disc;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
}

.emoji {
	width: 16px;
}

.news-detail-left .is-divider {
	margin: 16px auto;
}

.news-detail-left .social-share {
	text-align: center;
}

.news-detail-left {
	margin-right: -15px;
	padding-right: 30px;
	border-right: 1px solid var(--seventeen-color);
}

.news-detail-left .muc-luc-bai-viet {
	background: #f9f9f9;
	border: 1px solid #aaa;
	padding: 10px;
	margin-bottom: 15px;
	width: auto;
	display: table;
	font-size: 95%;
	font-size: 15.2px;
	transition: .3s;
}

.news-detail-left .muc-luc-bai-viet .title span {
	font-weight: 700;
	text-align: center;
}

.news-detail-left .muc-luc-bai-viet .title .mo-rong {
	display: none;
}

.news-detail-left .muc-luc-bai-viet.active .title .mo-rong {
	display: unset;
}

.news-detail-left .muc-luc-bai-viet.active .title .an {
	display: none;
}

.news-detail-left .muc-luc-bai-viet a {
	color: var(--primary-color);
}

.news-detail-left .muc-luc-bai-viet a:hover {
	color: var(--fourth-color);
	text-decoration: underline;
}

.news-detail-left .muc-luc-bai-viet .chi-tiet-muc-luc {
	margin-top: 15px;
}

.news-detail-left .muc-luc-bai-viet .chi-tiet-muc-luc li ul {
	margin-left: 22.8px;
}

/* Dự án */
.du-an-wrap,
.thong-tin-huu-ich {
	padding: 30px 0;
}

.bg-page.du-an {
	margin: 0px;
}

.title-section {
	position: relative;
	text-align: center;
	margin-bottom: 30px;
}

.title-section span {
	font-size: 27.2px;
	color: var(--sixthteen-color);
	font-weight: 700;
	text-transform: uppercase;
	padding: 0 15px;
	background-color: var(--third-color);
}

.title-section::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	background: var(--primary-color);
	opacity: .1;
	bottom: 50%;
	left: 0;
	z-index: -1;
}

.title-section .see-all {
	font-size: 21.76px;
	color: var(--primary-color);
	float: right;
	font-weight: 700;
	padding-left: 15px;
	background-color: var(--third-color);
	line-height: 29.91px;
}

.title-section .see-all:hover {
	color: var(--fourth-color);
}

.title-section .see-all i {
	opacity: .6;
	margin-left: 10px;
}

.du-an-wrap .item-news .wrap-img {
	padding-bottom: 75%;
}

.du-an-wrap .item-news .name {
	text-transform: uppercase;
}

.bg-page.thong-tin {
	margin: 0px;
}

.thong-tin-huu-ich .item-news .wrap-img {
	padding-bottom: 65%;
}

/* Thư viện ảnh */
.thu-vien {
	border-bottom: 1px solid var(--seventeen-color);
	margin-bottom: 40px;
}

.thu-vien ul {
	text-align: center;
	border-bottom: 1px solid var(--seventeen-color);
}

.thu-vien ul li {
	display: inline-block;
}

.thu-vien ul li a {
	font-size: 17.6px;
	color: var(--thirdteen-color);
	font-weight: 700;
	padding: 10px 15px;
	text-transform: uppercase;
	display: inline-block;
	border: 1px solid var(--seventeen-color);
	transform: translateY(2px);
	opacity: .6;
	background-color: rgba(var(--eleventh-color), .04);
}

.thu-vien ul li.active a {
	border-bottom: none;
	color: var(--second-color);
	opacity: 1;
	border-top: 2px solid var(--second-color);
	background-color: var(--third-color);
}

.thu-vien .tab-content {
	padding: 30px;
}

.thu-vien .item-news .wrap-img {
	padding-bottom: 75%;
}

.thu-vien .item-news .name {
	text-transform: uppercase;
	font-size: 16.2px;
	font-weight: 700;
}

.img-list {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -2px;
}

.col {
	flex: 25%;
	max-width: 25%;
	padding: 2px;
}

.col img {
	margin-top: 8px;
	vertical-align: middle;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.fancybox__backdrop {
	background-color: rgba(var(--eleventh-color), .7);
}

.tu-khoa {
	margin-bottom: 30px;
	font-size: 20px;
}

/* fix điểm  */
.banner-wrap {
	height: 500px;
}

@media only screen and (max-width: 1440px) {
	.tool-tip.youtube .tooltip-text {
		right: 0;
		left: unset;
		transform: unset;
	}

	.tool-tip.youtube .tooltip-text::after {
		left: unset;
		right: 13px;
	}
}

@media only screen and (max-width: 1200px) {
	.header-wrap .menu {
		margin-left: 0px;
	}

	.header-wrap .menu li:not(:last-child) {
		margin-right: 40px;
	}

	.header-wrap .menu li a {
		font-size: 15.6px;
	}

	.gioi-thieu .mo-ta p {
		font-size: 16px;
	}
}

@media only screen and (max-width: 767.9px) {
	.navbar-wrap {
		display: none;
	}

	.header-wrap .menu {
		display: none;
	}

	.icon-menu-mobile {
		display: inline-block;
		font-size: 12.8px;
		border: 1px solid var(--fifth-color);
		border-radius: 5px;
		width: 33px;
		line-height: 32px;
		text-align: center;
		margin-top: 18px;
		color: var(--fifth-color);
	}

	.header-wrap {
		padding-top: 30px;
	}

	.header-wrap .logo img {
		max-height: 70px;
		transform: translateY(-10px);
	}

	.header-wrap .logo-wrap {
		text-align: center;
	}

	.header-wrap.affix {
		padding-top: 0px;
	}

	.header-wrap.affix .logo img {
		transform: translateY(0px);
	}

	.menu-mobile {
		display: block;
		background-color: rgba(var(--eleventh-color), .95);
		position: fixed;
		top: 0;
		bottom: 0;
		width: 260px;
		left: 0;
		transition: .2s;
		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);
		padding: 30px 0 100px;
		z-index: 15;
		transform: translateX(-100%);
		visibility: hidden;
		opacity: 0;
	}

	.menu-mobile.active {
		transform: translateX(0%);
		visibility: visible;
		opacity: 1;
	}

	.menu-mobile .form-search-wrap,
	.menu-mobile .social-icons {
		padding: 20px;
	}

	.menu-mobile .form-search {
		width: 100%;
		margin-right: 0px;
	}

	.menu-mobile .form-search input {
		background-color: rgba(var(--tenth-color), .2);
		border: 1px solid rgba(var(--tenth-color), .09);
		color: rgba(var(--tenth-color), .8);
		font-size: 12.8px;
	}

	.menu-mobile .form-search input::placeholder {
		color: var(--third-color);
	}

	.menu-mobile .form-search button {
		color: rgba(var(--tenth-color), .8);
	}

	.menu-mobile .menu li {
		border-top: 1px solid rgba(var(--tenth-color), .2);
		padding: 15px 25px 15px 20px;
		position: relative;
	}

	.menu-mobile .menu li:last-child {
		border-bottom: 1px solid rgba(var(--tenth-color), .2);
	}

	.menu-mobile .menu li a {
		color: var(--third-color);
		text-transform: uppercase;
		font-size: 12.8px;
		color: rgba(var(--tenth-color), .8);
		font-weight: 700;
		letter-spacing: 0.256px;
		/* display: block;
        padding: 15px 20px; */
	}

	.overlay-menu-mobile,
	.overlay-sidebar-product-mobile {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(var(--twelfth-color), .6);
		transition: .25s;
		z-index: 13;
		opacity: 0;
		visibility: hidden;

	}

	.overlay-menu-mobile.active,
	.overlay-sidebar-product-mobile.active {
		opacity: 1;
		visibility: visible;
	}

	.close-menu-mobile,
	.close-sidebar-product-mobile {
		position: absolute;
		width: 40px;
		height: 40px;
		top: 0;
		right: 0;
		text-align: center;
		line-height: 60px;
		overflow: hidden;
		color: var(--sixth-color);
		opacity: .6;
		transform: translateY(50%) translateZ(1px);
		transition: .6s;
	}

	.close-menu-mobile.active,
	.close-sidebar-product-mobile.active {
		transform: translateY(0) translateZ(1px);
	}

	/* banner */
	#banner .item {
		height: 183.75px;
	}

	.h3-title {
		font-size: 16px;
		margin-bottom: 8px;
	}

	.mo-ta p {
		font-size: 12px;
		margin-bottom: 15.6px;
	}

	.gioi-thieu .wrap-img {
		margin-top: 30px;
	}

	.gioi-thieu {
		padding: 30px 0;
	}

	.item-thuong-hieu .name {
		font-size: 12px;
	}

	.item-thuong-hieu {
		margin-bottom: 30px;
	}

	.cac-thuong-hieu .inner,
	.nhan-hieu {
		padding: 30px 0 0px;
	}

	#image-gallery .owl-nav .owl-prev {
		left: 0px;
	}

	#image-gallery .owl-nav .owl-next {
		right: 0px;
	}

	#image-gallery .owl-nav button {
		opacity: 1;
		visibility: visible;
		border: none;
	}

	.thu-vien-anh {
		padding: 25px 0;
	}

	.item-news-prj .name {
		font-size: 13.6px;
	}

	.item-news-prj {
		margin-bottom: 20px;
	}

	.tin-tuc {
		padding-bottom: 0px;
	}

	.item-news-prj .name .loca {
		font-size: 13.6px;
	}

	/* footer  */
	.footer-inner h2 {
		font-size: 19.2px;
		margin-bottom: 9.6px;
	}

	.footer-inner .item-right {
		margin-top: 60px;
	}

	.footer-wrap .hotline a {
		font-size: 16px;
	}

	/* .back-to-top{
        display: none;
    } */

	/* page detail  */
	.bg-page {
		height: 161px;
	}

	.page-detail .content h3 {
		font-size: 16px;
		margin-bottom: 8px;
	}

	.page-detail .introduce {
		display: block;
	}

	.page-detail .item-left {
		margin-bottom: 30px;
	}

	.page-detail .introduce-title {
		font-size: 16px;
		margin-bottom: 8px;
	}

	.doi-tac-wrap {
		margin-top: 24px;
	}

	.title-doi-tac span {
		font-size: 16px;
	}

	/* Product list  */
	.loc-mobile {
		display: block;
		background-color: var(--second-color);
		color: var(--third-color);
		/* padding-bottom: 45px; */
		padding-top: 20px;
		padding-bottom: 30px;
		transform: translateY(-2px);
		text-align: center;
		font-size: 16px;
		text-transform: uppercase;
	}

	.loc-mobile a {
		color: var(--sixth-color);
		font-weight: 700;
	}

	.breadcrumb-build {
		text-align: center;
	}

	.breadcrumb-build.prd-list {
		line-height: 40px;
		padding-top: 20px;
	}

	.sidebar-product {
		position: fixed;
		background-color: rgba(var(--tenth-color), .95);
		top: 0;
		bottom: 0;
		width: 260px;
		left: 0;
		transition: .2s;
		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);
		padding: 30px 20px;
		z-index: 15;
		overflow-y: scroll;
		transform: translateX(-100%);
		visibility: hidden;
		opacity: 0;
	}

	.sidebar-product.active {
		transform: translateX(0%);
		visibility: visible;
		opacity: 1;
	}

	.item-product .content {
		padding: 9px 0 19px;
	}

	.item-product .content .name {
		font-size: 13.6px;
	}

	.quick-view {
		display: none;
	}

	/* Product detail  */
	.tooltip-text {
		display: none;
	}

	.product-detail-left-top,
	.related-product {
		padding-right: 0px;
	}

	.product-detail-right {
		display: none;
	}

	.related-product {
		margin-bottom: 20px;
	}

	.product-detail-left-top .info-prd-detail {
		margin-top: 40px;
	}

	.product-detail-left-top .info-prd-detail .name {
		font-size: 22.4px;
		margin-bottom: 11.2px;
	}

	.social-icons .whatsapp {
		background-color: #51cb5a;
		display: inline-block;
	}

	#related-product .owl-nav button {
		background-color: transparent;
		opacity: 1;
		visibility: visible;
		box-shadow: none;
	}

	#related-product .owl-nav .owl-prev {
		left: -7px;
	}

	#related-product .owl-nav .owl-next {
		right: -7px;
	}

	#related-product .owl-nav button:hover {
		background-color: transparent !important;
	}

	/* news list  */
	.bg-page.news {
		height: 135px;
	}

	.item-news .name {
		font-size: 13.6px;
	}

	/* News detail  */
	.breadcrumb-build.prd-detail {
		height: unset;
	}

	.breadcrumb-build.detail {
		line-height: 30px;
	}

	.breadcrumb-build.detail ol li:last-child {
		margin-left: 0px;
	}

	.breadcrumb-build.detail ol li:last-child::before {
		content: unset;
	}

	.news-detail .content-wrap .post-title {
		font-size: 22.4px;
	}

	.news-detail .content-news h2 {
		font-size: 19.2px !important;
		margin: 0 0 9.6px 0;
	}

	.news-detail .content-news h3,
	.news-detail .content-news h4 {
		font-size: 16px;
		margin: 0 0 8px 0;
	}

	.news-detail-left {
		margin-right: 0px;
		padding-right: 0px;
		border-right: none;
	}

	.sidebar-news {
		padding-left: 0px;
		margin-top: 100px;
	}

	.news-detail {
		padding: 30px 0 30px;
	}

	.img-list {
		margin: 0;
	}

	.col {
		flex: 100%;
		max-width: 100%;
		padding: 2px 0px;
	}

	.col img {
		margin-top: 0px;
	}

	.thu-vien .is-divider {
		display: none;
	}

	.thu-vien .item-news .name {
		font-size: 15.3px;
	}

	.title-section span {
		font-size: 22.4px;
	}

	.title-section .see-all {
		font-size: 17.92px;
		line-height: 26px;
	}

	/* fix điểm  */
	.banner-wrap {
		height: 183.75px;
	}

	#banner.owl-carousel {
		display: block;
	}

	#banner.owl-carousel .item {
		display: none;
	}

	#banner.owl-carousel .item:first-child {
		display: block !important;
	}

	/* Khách yêu cầu thêm */
	.menu-mobile .menu li .has-menu-1 {
		position: absolute;
		right: 10px;
		transform: rotate(-90deg);
	}

	.menu-mobile .menu li .has-menu-1.active {
		transform: rotate(0deg);
	}

	.level-2-wrap,
	.level-3 {
		padding: 10px 0 10px 10px;
		display: none;
	}

	.item-level-2 {
		position: relative;
		padding-right: 20px;
	}

	.item-level-2 .has-menu-2 {
		position: absolute;
		right: 0px;
		transform: rotate(-90deg);
	}

	.item-level-2 .has-menu-2.active {
		transform: rotate(0deg);
	}

	.menu-mobile {
		height: 100vh;
		overflow: scroll;
	}

	.menu-mobile .menu .item-level-3 a {
		text-transform: none;
	}
}