.hero {
	position: relative;
	margin-top: 120px;
	overflow: hidden;
	margin-bottom: 10px;
	
}

.hero .row {
	max-width: 1360px;
}

.hero-height-control .hero-imgarea {
	height: 250px;
	position: static;
	margin-bottom: 50px;
}

.hero-content > .row {
	height: 100%;
}

.hero-content-column {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.hero-imgarea {
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	/*background: var(--color-primary);*/
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.hero-imgarea video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.hero-imgarea::before {

	/*height: 80%;*/
	/*content: "";
	position: absolute;
	width: 100%;
	
	height: 90%;
	bottom: 0;
	left: 0;
	background: rgba(20, 23, 47, 0.5);
	pointer-events: none;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);*/
}



.hero-content .hero-big {
	color: inherit;
	font-weight: 700;
	overflow: hidden;
	font-size: 2rem;
	padding-bottom: 20px;
	/*margin-bottom: 30px;*/
	color: var(--color-primary);
}

.hero-content .hero-big strong {
	display: block;
	line-height: 1.3;
}

.hero-content .hero-big span {
	position: relative;
}

.hero-content .hero-big span:before {
	left: 0;
	top: 55%;
	width: 0;
	content: "";
	height: 6px;
	display: block;
	position: absolute;
	transform: translateY(-50%);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100%;
	transition: width 2.5s;
	transition-delay: 2000ms;
}

.hero-content .hero-big .animated span:before {
	width: 100%;
}

.hero-content .button {
	padding: 13px 29px;
}

.hero-button {
	
	animation-delay: 2200ms;
/*	margin-left: calc(var(--sides-size) * -1);
	margin-right: calc(var(--sides-size) * -1);*/
}


.hero-button .button {
	width: auto;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 2px;
    padding: 13px 45px;

}

.hero-subtitle {
	font-weight: 700;
	font-size: 1.188rem;
	overflow: hidden;
	color: var(--color-gray-alt);
	animation-delay: 1000ms;
	line-height: 1.3;
	margin-bottom: 4px;
}

.hero-subtitle-animation {
	
}

.hero-button .button {
	width: 100%;
	/*max-width: 265px;*/
}

.hero-button .button-one {margin-bottom: 15px;}

.btn_class_flex .hero-button-two a {
	background: var(--color-special-bg);
	border: 2px solid var(--color-special-bg);
}

.first-top-area .btn_class_flex {
		margin-bottom: 45px;
}


.padesktop.first-section {
	padding-top: 0px;
	/*padding-top: 60px;*/
}

.info-content h1,
.process-steps h1 {
    font-weight: 600;
    font-size: 2.4rem;

}

@media screen and (min-width: 768px) {
	.hero {
		margin-top: 0;
		background: var(--color-black);
	}


	.hero-imgarea::before {
		content: "";
		position: absolute;
		width: 100%;
		/*height: 80%;*/
		height: 90%;
		bottom: 0;
		left: 0;
		background: rgba(20, 23, 47, 0.5);
		pointer-events: none;
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
	}

	.hero-content {
		display: flex;
		flex-direction: column;
		width: 100%;
		justify-content: flex-end;
		align-items: center;
		position: relative;
		/*text-align: center;*/
		color: var(--color-pure-white);
	}

	.hero-content .hero-big {
		color: #fff;
	}

	.hero-height-control 
	{
		/*height: 520px;*/
		height: 70vh;
	}
	.hero-height-control .hero-imgarea 
	{
		height: 100%;
		margin-bottom: 0;
		position: absolute;
	}
	.hero-height-control {
		/*min-height: 70vh;*/
	}
	.hero-button .button {
		width: 100%;
		max-width: 265px;
	}
	.first-top-area .btn_class_flex {
		/*margin-bottom: 0;*/
	}
	.padesktop.first-section {
		padding-top: 100px;
	}

	.info-content h1,
	.process-steps h1 {
	    font-weight: 600;
	    font-size: 2.6rem;}

}

@media screen and (min-width: 1025px) {
	.hero-results-title span {
		max-width: 240px;
	}

	.hero-content > .row {
		height: auto;
	}

	.hero-results-item p {
		width: 90%;
	}

	.hero-content {
		min-height: calc(100vh - 125px);
	}
	.hero {
		margin-top: 115px;
		margin-bottom: 0;
	}

	.hero-results-title {
		padding-right: 20px;
	}

	.hero-results-item {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.hero-content {
		min-height: 70vh;
		text-align: left;
		padding: 170px 0;
		justify-content: center;
	}

	.hero-content .hero-big {
		font-size: 3rem;
		padding-bottom: 0;
	}

	.hero-button {
		margin: 0;
	}

	.hero-imgarea::after {
		left: 0;
		top: 0;
		width: 100%;
		height: 132px;
		content: "";
		display: block;
		position: absolute;
	}

	.hero-imgarea::before {
		top: 0;
		/*width: 81%;*/
		width: 100%;
		height: 100%;
		background: linear-gradient(to right, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0) 100%);
	}

	.first-top-area .btn_class_flex {
		margin-bottom: 0;
	}

}

@media screen and (min-width: 768px) {

	.btn_class_flex {
		display: flex;
	  }
	  .button-one .hero-button {margin-bottom: 25px;}

	  .btn_class_flex .hero-button-two {margin-left: 20px; margin-bottom: 0;}

}

/* INTRO */
.intro p {
	margin-bottom: 30px;
	line-height: 1.6;
}

.intro-inner {
	display: flex;
	flex-wrap: wrap;
}

.intro-content {
	width: 100%;
}

.intro-content .h1 {
	font-size: 1.938rem;
}

.intro-content h4 {
	margin-bottom: 20px;
	letter-spacing: 4.5px;
}

@media screen and (min-width: 768px) {
	.intro-content .h1 {
		font-size: 3.313rem;
	}

	.intro-content h4 {
		margin-bottom: 37px;
	}
}


/* FEATURES */
.features {
	position: relative;
	overflow: hidden;
}

/*.features .row {
	max-width: 1070px;
}*/

.features:before {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0.06;
	width: 100%;
	height: 100%;
	background-size: contain;
	content: "";
	pointer-events: none;
}

.features .column {
	position: relative;
	z-index: 1;
}

.features .h1 {
	margin-bottom: 0;
	font-size: 2rem;
	text-align: center;
	color: var(--color-body-text);
}

.features .h1:after {
	display: none;
}

.features p {
	margin-bottom: 42px;
	text-align: center;
	color: var(--color-body-text);
	font-size: 1.1rem;
	margin-top: 10px;
}

@media screen and (min-width: 768px) {
	.features p {
		max-width: 660px;
		margin: 0 auto 45px;
	}

	.features .h1 {
		font-size: 2.5rem;
	}
}


@media screen and (min-width: 1025px) and (max-height: 820px) {
	.hero-content .hero-big {
		font-size: 3.3rem;
	}
	.hero-height-control {
		min-height: 500px;
	}

	.hero-results {
		padding-top: 0;
	}

	.hero-content {
		/*padding-top: 120px;*/
	}
}


.services-area {
    width: 48%;
    float: left;
    /*margin: 0 1% 40px;*/
    margin-bottom: 30px;
}

.services-area.wide-3 {
    width: 100%;
    padding: 0 30px;
}

.services-hold {
    position: relative;
    line-height: 0;
    overflow: hidden;
    border-radius: 1em;
    margin-bottom: 10px;
}

.services-hold .serv-photo img, .services-hold .serv-area {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.services-hold .serv-photo img {
/*    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);*/
    width: 100%;
}

.services-hold:hover .serv-photo img {
/*    -webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    -ms-transform: scale(1.15);
    -o-transform: scale(1.15);
    transform: scale(1.15);*/
}

.services-hold .serv-area {
    /*background: var(--color-primary);*/
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    
/*    -webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    -ms-transform: scale(1.15);
    -o-transform: scale(1.15);
    transform: scale(1.15);*/
}

.services-hold:hover .serv-area {
    opacity: 1;
    background: var(--color-primary);
  /*  -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);*/
}

.serv-img img {
    max-width: 30% !important;
    padding-bottom: 15px;
}

.serv-text p {
	opacity: 0;
    padding: 0 40px;
    font-size: 26px;
    line-height: 30px;
    color: #fff;
    margin-bottom: 0;
}

.services-hold:hover .serv-area p,
.services-hold:focus .serv-area p{
	opacity: 1;
}

.serv-link, .serv-link a {
	margin-bottom: 0;
	color: var(--color-body-text);
	font-size: 1.3rem;
	font-weight: 700;
}

.serv-wrap {
    display: table;
    height: 100%;
    width: 100%;
}

.serv-hold {
    display: table-cell;
    height: 100%;
    vertical-align: middle;
}

.more-services {
    text-align: center;
}

.reviewbtn {
	margin-top: 50px;
}
.services-btn {
	margin-top: 30px;
}
.gallery-viewmore {
	margin-top: 50px;
}

.big-img-area img {
	width: 100%;
}


.hero-hero-content-column-text span {
    display: block;
    line-height: 1.1;
    color: #000;
    font-size: 2.1rem;
    padding-bottom: 0;
    margin-bottom: 25px;
    font-weight: 700;
}

.hero-home .hero-hero-content-column-text span {
	color: var(--color-heading);
}

.hero-hero-content-row {
	width: 100%;
    height: 100%;
    position: relative;
}

.hero-hero-content-column {
	width: 100%;
    margin-left: auto;
    box-sizing: border-box;
    margin-right: auto;
    display: block;
}

.hero-hero-content-column-right {
	left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    object-fit: cover;
    /*background: url('images/hero.avif');*/
    background-image: none;

    padding-top: 45%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: 120px;

}

.second-top-area .hero-hero-content-column-right {margin-bottom: 40px;}


.hero-hero-content-column-right img {
	position: relative;
	top: 0;
	height: 100%;
	width: 100%;
}

	.hero-hero-content-column-text span i {
	font-family: var(--font-family-special);
    /*color: var(--color-body-text);*/
    /*font-size: 53px;*/
    font-weight: 600;
    letter-spacing: -1px;
    margin-right: 10px;
    font-size: 3rem;
    color: var(--color-medium-bg);
	}

/*2nd option header hero*/
.hero-hero-content-column.column-area {
	margin-bottom: 55px;
}
@media (min-width: 768px) {
	.services-area.wide-3 {
		width: 31.333%;
		margin: 0 1% 40px;
		padding: 0;
	}
}
@media (min-width: 1024px) {

	.hero-content .hero-big {
		margin-bottom: 30px;
	}

	.hero-home {
		height: 70vh;
		max-width: 1700px;
	}

	.hero-hero-content-column-text span
	{
		display: block;
        
        font-size: 2.8rem;
        padding-bottom: 0;
        margin-bottom: 25px;
        line-height: 1.1;
	}

	.second-top-area .hero-hero-content-column-right {margin-bottom: 0px;}
	
	.hero-hero-content-column-right {
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
	}


    .hero-hero-content-column-right img {
        display: none;
 	}

	.hero-hero-content-row {
        display: grid; 
        grid-template-columns: 1fr 1fr;
	}

}

 @media (min-width: 768px) {
	.second-top-area .hero-hero-content-column-right {
		margin-top: 0
	}

 }
 @media (min-width: 1024px) {
    .hero-hero-content-column {
        margin: auto 0 auto 50px;
        width: auto;
        padding-right: 20px;
    }
	#homehero2 {
		margin-top: 60px;
	}

}

 @media (min-width: 1281px) {
    .hero-hero-content-column {
        margin: auto 0 auto 100px;
    }
}

/* INFO */
.info {
	background: linear-gradient(to right, rgba(233, 234, 238, 0) 0%, rgba(233, 234, 238, 1) 100%);
	overflow: hidden;
}

.info-inner {
	position: relative;
	display: flex;
	flex-wrap: wrap;
}

.info-image {
	margin-right: -30px;
	margin-bottom: 45px;
	margin-left: -30px;
	position: relative;
	z-index: 1;
	width: calc(100% + 60px);

	position: relative;
}

.info-image img {
	width: 100%;
}
.info-image-div {
	position: relative;
}

/*.info-image-div:after{
    position: absolute;
    content: '';
    width: 124px;
    height: 124px;
    right: -6px;
    bottom: 6px;
    background: var(--color-medium-bg);
    z-index: -1;
}*/

.info-content {
	position: relative;
	z-index: 1;
	width: 100%;
	line-height: 1.65;
}
.info-content ul li {
	position: relative;
	padding-left: 35px;
	font-weight: 800;
	font-size: 1.375rem;
}

.info-content ul li:not(:last-child) {
	margin-bottom: 15px;
}

.info-content ul li:before {
	left: 0;
	content: "\f178";
	display: block;
	position: absolute;
	font-family: "Font Awesome 6 Pro";
	color: var(--color-secondary);
}

.info.has-white {
	background: var(--color-pure-white);
}

.info-image img {
	width: 100%;
}

@media screen and (min-width: 768px) {
	.info {
		background-color: transparent;
	}
	.info-image {
		margin-left: -30px;
		margin-right: 0;
		margin-bottom: 0;
		width: calc(50% + 30px);
	}

	.info-content {
		width: 50%;
	}

	.info-inner:before {
		position: absolute;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100%;
		background: linear-gradient(to right, rgba(233, 234, 238, 0) 0%, rgba(233, 234, 238, 1) 100%);
		content: "";
	}

	.info.has-white .info-inner:before {
		background: var(--color-pure-white);
	}

	.info.has-white .info-image {
		margin-left: 0;
		width: 38%;
		order:1;
	}

	.info.has-white .info-content {
		width: 62%;
		order: 2;
	}

	.contact-form .form-group button {
		max-width: 400px;
	}
}

@media screen and (min-width: 1025px) {
	.info-image {
		width: calc(40% + 30px);
	}

	.info-image img {
		max-width: 100%;
	}

	.info-content {
		width: 60%;
	}
}

@media screen and (min-width: 1200px) {
	.info-image {
		margin-left: -140px;
		width: calc(32% + 140px);
	}

	.info-content {
		padding-left: 45px;
		width: 68%;
	}
}




/*process page*/

.process-div {
	padding: 50px 0px;
	border-radius: 1rem;
	/*margin-bottom: 25px;*/
}

/*.process-div .small-12 {padding: 0;}*/

.process-first {padding-top: 0;}

.process-steps p {
	margin-bottom: 20px;
}

.process-steps .button {width: 100%;}

.process-img img {
	border-radius: 1rem;
	margin-bottom: 12px;
	box-shadow: 0 0 20px #d9d9d7;
}

.process-div.div-even {
	background: #f9f8f8;
}

.process-div h2 {margin-bottom: 12px;}
.process-div h3 {
	margin-bottom: 15px;
}

@media screen and (min-width: 768px) {
	.process-div .row {
	    display: flex;
	    align-items: center; /* Centers content vertically */
	}

	.text-column {
	    display: flex;
	    flex-direction: column;
	    justify-content: center; /* Ensures the text is centered within the column */
	    height: 100%; /* Makes sure it takes full height */
	}


	.order-1 {
		order: 1;
	}
	.order-2 {
		order: 2;
	}

}
@media screen and (min-width: 1025px) {
	.process-div {
		/*padding: 75px;*/
	}

	.process-div.div-even {
		padding: 75px 0;
	}
	.process-img img {
		margin-bottom: 0;
	}
	.process-div h2 {margin-bottom: 20px;}

	.float-first {float: right;}
}
