@charset "UTF-8";

.title-menu {
	display: inline-block;
	font-family: 'Roboto-Bold';
	font-size: 22px;
	text-transform: uppercase;
	vertical-align: middle;
	color: #fff;
	margin-left: 15px;
}

nav:not(.mm-menu) {
	display: none;
}

.mm-listview > li {
	text-transform: capitalize;
}

.mm-navbar .mm-title {
	text-transform: uppercase;
}

.mm-listview {
	font-size: 16px !important;
}

.mm-title {
	font-size: 20px;
}

.mm-menu {
	background: #17468a !important;
}

.mm-menu .mm-listview > li .mm-next:after {
	border-color: #fff !important;
}

.mm-menu .mm-btn::after,
.mm-menu .mm-btn:before {
	border-color: #fff !important;
}

.mm-listview > li > a,
.mm-listview > li > span {
	color: #fff !important;
}

.mm-listview > li,
.mm-listview > li .mm-next,
.mm-listview > li .mm-next::before,
.mm-listview > li::after,
.mm-navbar {
	border-color: #0000001f !important;
}

.mm-navbar .mm-title,
.mm-menu em.mm-counter {
	color: #fff !important;
}

.c-mburger {
	display: none;
	color: #17468a;
	align-self: center;
	text-align: center;
}

.c-mburger span {
	text-transform: uppercase;
	font-family: var(--font-bold);
	font-size: 28px;
	margin-left: 5px;
}

.mburger {
	--mb-button-size: 40px !important;
	--mb-bar-width: 1 !important;
	--mb-bar-height: 3px !important;
}

.goidien {
	display: none;
	position: fixed;
	z-index: var(--z-index);
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #17468a;
}

.goidien .td {
	text-align: center;
	width: 25%;
	box-sizing: border-box;
	padding: 6px 5px;
}

.goidien label {
	display: block;
	text-transform: uppercase;
	font-size: 14px;
	margin-top: 5px;
}

.goidien a {
	color: #fff;
}

.goidien i {
	font-size: 25px;
}

.blink_me {
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: blinker;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;
	animation-name: blinker;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

@-moz-keyframes blinker {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-webkit-keyframes blinker {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes blinker {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@media only screen and (max-width: 1199px) {
	.inherit {
		margin-left: 15px;
		margin-right: 15px;
	}
}

@media only screen and (max-width: 1024px) {
	.icon-search {
		display: block;
		padding: 5px 9px;
		border: 1px solid #ddd;
		border-radius: 50%;
		cursor: pointer;
	}
	.search {
		display: none;
		position: absolute;
        right: 10px;
        top: 83px;
        z-index: 999;
	}

	.hotline,
	.email {
		display: none;
	}
	.menu {
		display: none;
	}

	.menu-intro {
		flex-direction: column;
		justify-content: flex-end;
	}

	.menu-intro .col {
		width: 100%;
		padding: 25px;
	}

	.menu-intro .col:not(:last-child) {
		border-right: none;
		border-bottom: 1px solid #ffffff6b;
	}

	.intro-logo {
		top: 20px;
	}

	.intro-slogan {
		top: 120px;
		left: 15px;
		right: 15px;
		-moz-transform: unset;
		-webkit-transform: unset;
		-o-transform: unset;
		-ms-transform: unset;
		transform: unset;
		font-size: 25px;
	}

	.fixed .logo img {
		max-height: 55px;
	}

	ul.tintuc li.bt {
		margin: 7.5px 15px 7.5px 0;
		width: calc((100% + 15px) / 2 - 15px);
		width: -moz-calc((100% + 15px) / 2 - 15px);
		width: -webkit-calc((100% + 15px) / 2 - 15px);
	}

	.c-mburger {
		display: block;
	}

	.goidien {
		display: flex;
	}

	.scrollToTop {
		bottom: 70px;
	}

	.btn-map{
		bottom: 140px;
	}
	.btn-zalo {
		bottom: 320px;
	}

	.photo-about {
		width: 100%;
		margin: 20px auto;
		text-align: center;
	}
	.content-about {
		width: 100%;
		margin-top: 10px;
	}

	.title-about h2,
	.title-letter h2,
	.title-main h2,
	.bgfooter .title {
		font-size: 25px;
	}

	.title-about p,
	.title-main p {
		font-size: 16px;
	}

	.inherit-letter {
		flex-wrap: wrap;
	}
	.letter {
		width: 100%;
		margin-top: 10px;
	}
	#FormLetter {
		width: 100%;
	}

	.grid-product {
		grid-template-columns: repeat(3, 1fr);
		gap: 10px;
	}

	.nl-left {
		width: 100%;
	}
	.nl-right {
		max-width: 700px;
		width: 100%;
		margin: 0px auto;
	}
	.copyright,
	.footer-statistic {
		width: 100%;
	}
	.link-map {
		margin: 10px auto;
	}
}
@media only screen and (max-width: 580px) {
	.flex-nl-t {
		top: 12px;
		gap: 5px;
	}
	.flex-nl-b {
		bottom: 12px;
		gap: 5px;
	}
	.box-nl {
		width: calc(33.3% - 5px);
	}
}
@media only screen and (max-width: 768px) {
	.grid-product {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
	.grid-news {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
	.flex-news {
		flex-wrap: wrap;
	}
	.news-left {
		width: 100%;
	}
	.news-right {
		width: 100%;
	}
	.line-list {
		display: none;
	}
	.img-list {
		width: 100%;
	}
	.img-list .name {
		width: 100%;
		clip-path: none;
	}
	.img-list .name h3 {
		font-size: 14px;
	}

	.logo {
		zoom: 0.7;
	}

	.bgheader-right {
		display: none;
	}

	ul.tintuc li.bt {
		width: 100%;
	}

	.bgfooter {
		padding: 40px 0;
	}

	.bgfooter .col-1,
	.bgfooter .col-2,
	.bgfooter .col-3 {
		max-width: 100%;
		width: 100%;
	}

	.bgfooter .col:not(:last-child) {
		margin-bottom: 30px;
	}

	.pro-detail-left,
	.pro-detail-right {
		width: 100%;
	}

	.pro-detail-right {
		padding-left: 0;
		margin-top: 10px;
	}

	.contact .col {
		width: 100%;
	}
}

@media only screen and (max-width: 480px) {
	.box-nl .name {
		display: none;
	}

	.logo {
		zoom: 0.5;
	}

	.title-about h2,
	.title-letter h2,
	.title-main h2,
	.bgfooter .title {
		font-size: 20px;
	}
	.title-list-project span {
		padding: 6px;
	}
}