/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/
@import url('https://fonts.googleapis.com/css2?family=Stack+Sans+Headline:wght@200..700&display=swap');
/*************** ADD CUSTOM CSS HERE.   ***************/
body {
	font-family: "Stack Sans Headline", sans-serif;
}
.itform-col input[type=submit] {
	text-transform: none;
	font-weight: 500;
}
.header-button a:before {content:url(https://htc.marpro.vn/wp-content/uploads/2026/07/Phone-call.png); position:relative; top:6px; padding-right:10px;}
.box-dotte1 span {background:#ffffff29; padding:7px 15px; border-radius:99px;}
.box-dotte1 span:before {content: "\f111"; font-family: FontAwesome; color:#EDC701; font-size:5px; padding-right:7px; position:relative; bottom:3px;}
.banner-checklist p:before {content: "\f058"; font-family: FontAwesome; color:#EDC701; padding-right:10px;}
.year-box .icon-inner {margin-top:20px;}
.box-dotte2 span {background:#fff; padding:7px 15px; border-radius:99px; color:#000;}
.box-dotte2 span:before {content: "\f111"; font-family: FontAwesome; color:#B5040A; font-size:5px; padding-right:7px; position:relative; bottom:3px;}
.about-list ul {list-style:none;}
.about-list li {margin-left:0 !important;}
.about-list li:before {content: "\f058"; font-family: FontAwesome; color:#19519C; padding-right:10px; font-size:13px;}
.more-but span:after {content: "\f061"; font-family: FontAwesome; padding-left:10px;}
.box-dotte3 span {background:#F6F5ED; padding:7px 15px; border-radius:99px; color:#000}
.box-dotte3 span:before {content: "\f111"; font-family: FontAwesome; color:#B5040A; font-size:5px; padding-right:7px; position:relative; bottom:3px;}
h2 {font-size:46px;}
.box-badge .box-text {bottom:0;}
.project-box {
    border-radius: 40% 40% 0 0;
    overflow: hidden;
}
.project-box img {
	height: 488px;
	object-fit: cover;
}
.project-box .box-text {background:linear-gradient(180deg,rgba(24, 24, 24, 0) 0%, rgba(24, 24, 24, 0.6) 39%);; !important}
.process-col:before {content:url(https://htc.marpro.vn/wp-content/uploads/2026/07/arrow.png); position:absolute; left:-40px; top:20px;}
.style-banner .banner-bg {border-radius:20px;}
.banner p {margin-bottom:0;}
.style-banner {
	cursor: pointer;
}
.style-banner .text-box {
	/*display:none;*/
	transition: 1s ease-out;
	visibility: hidden;
	opacity: 0;
}
.style-banner:hover .text-box {
	/*display:block;*/
	opacity: 1;
	visibility: visible;
}
.ctform-row {display:inline-flex;}
.ctform-col1 {margin-right:7px}
.ctform-col2 {margin-left:7px;}
.itform-col input {border-radius:10px; height:60px; border:none; box-shadow:none; background-color:#F6F6F6;}
.itform-col textarea {border-radius:10px; background-color:#F6F6F6; border:none; box-shadow:none;}
input[type=submit] {border-radius:99px; background-color:#B5040A !important;}
.itform-col input[type=submit] {margin-top:30px;}
.accordion-title {border:none; background:#fff;padding:20px 20px 20px 30px; border-radius:10px; color:#181818 !important;}
.accordion-inner {background-color:#252422; border-radius:0px 0px 12px 12px; color:#fff;}
.accordion-title.active {margin-bottom:0; border-radius:12px 12px 0px 0px; color:#fff !important; background-color:#252422;}
.accordion-item {margin-bottom:30px;}
.stories-col1:hover .col-inner {background-color:#19519C !important; color:#fff;}
.stories-col1:hover .stories-col2 .col-inner {background-color:#3062a6 !important;}
.star-rating:before {color:#EDC701 !important;}
.star-rating span:before {color:#EDC701 !important;}
#footer ul {list-style:none; margin-bottom:0;}
#footer li {margin-left:0;}
.absolute-footer {display:none;}
#footer input[type=submit] {width:100%;}
#footer input {text-align:center; border:none; height:50px;}
.page-title-bar {height:400px; background:url(https://htc.marpro.vn/wp-content/uploads/2026/07/tbgg.png)center no-repeat; background-size:cover;}
.page-title-bar .title {position:absolute; top:280px; color:#fff; font-size:50px; text-transform:uppercase; font-weight:500;}
.page-title-bar .breadcrumb {padding-top:15px; color:#fff;}
.page-title-bar a {color:#fff;}
.box-text .button {margin:0}
.box-dotte4 span {background:#fff; padding:7px 15px; border-radius:99px; color:#000}
.box-dotte4 span:before {content: "\f111"; font-family: FontAwesome; color:#EDC701; font-size:5px; padding-right:7px; position:relative; bottom:3px;}
.info-row1 .col-inner {border-radius:15px 15px 0px 0px;}
.info-row2 p {margin-bottom:0;}
.info-row2 {border-bottom:1px solid #ddd;}
.info-row2 .col {padding-bottom:10px; padding-top:10px;}
.button.icon.circle {margin-bottom:0;}
.info-row3 .col-inner {border-radius:0px 0px 15px 15px;}
img.size-full.alignnone {margin-bottom:3px;}
.icon-box-text p {margin-bottom:5px;}
.gallery-col .box-badge .box-text {bottom:35%}
.gallery-col p {font-weight:600; font-size:40px; font-weight:300;}
.contact-col input {height:68px; border-radius:7px;}
.contact-col input[type=submit] {padding-left:50px; padding-right:50px;}
.contact-col textarea {border-radius:7px;}
.accordion .toggle {
	right: 0;
	left: auto;
	color:#EDC701;
	top:12px;
}
.accordion-title.active {
	font-weight: 500;
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
	.project-box img {
		height: 388px;
	}
	h2 {
	    font-size: 24px;
	}
	.ctform-row {
	    display: block;
	}
	.itform-col input {
		height: 45px;
	}
	.ctform-col2, .ctform-col1 {
		margin: 0;
	}
	.h2-mb h2 {
		font-size: 32px;
	}
}
/* */
.button.secondary:hover {
	transform: translate(10px, 0px);
}
.ms-thumb {
	border-radius: 10px;
	overflow: hidden;
}