@charset "UTF-8";

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/subset-Poppins-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/subset-Poppins-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/subset-Poppins-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/subset-Poppins-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
}

:root {
	--padding: 150px;
	--spacing: 250px;
}

html {
    -webkit-text-size-adjust: none;
}

* {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

body, div {
	margin: 0;
	padding: 0;
}

body {
	font-family: 'Poppins', Arial, sans-serif;
	font-size: 17px;
	font-weight: 300;
	color: #123F4E;
	line-height: 1.411;
	background: #D4DEE3;
	letter-spacing: 0.1px;
}

/* Main Wrapper */

#mainWrapper {
	position: relative;
	text-align: left;
	margin: 0 auto;
	min-width: 320px;
	overflow: hidden;
}

@supports (overflow:clip) {
	#mainWrapper {
		overflow: clip;
	}
}

/* Section */

.section {
	max-width: 1164px;
	margin: 0 auto;
}

/* Header */

#header {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	padding: 10px 20px;
	height: 82px;
	display: flex;
	align-items: center;
	z-index: 1000000;
}

#header .logo {
	width: 300px;
	filter: brightness(0) saturate(100%) invert(19%) sepia(23%) saturate(1406%) hue-rotate(149deg) brightness(95%) contrast(93%);
}

#header.forHome .logo {
	filter: none;
}

#header.forProjects .logo {
	width: 169px;
}

#header .logo img {
	display: block;
	width: 100%;
}

#header .options {
	margin-left: auto;
	display: flex;
	align-items: center;
}

#header .options #navigation ul {
	margin: 0;
	padding: 0;
	display: flex;
}

#header .options #navigation ul li {
	position: relative;
	margin: 0 0 0 28px;
	padding: 0;
	list-style: none;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.2px;
	text-transform: uppercase;
}

#header .options #navigation ul li a {
	position: relative;
	display: inline-block;
	color: #123F4E;
}

#header.forHome .options #navigation ul li a {
	color: #fff;
}

#header .options #navigation ul li:before {
	background-color: #B9C9D1;
	bottom: -0.8em;
	content: "";
	height: 0.6666666666666667em;
	left: 0;
	position: absolute;
	right: 0;
	-webkit-transform: scaleX(0);
	    -ms-transform: scaleX(0);
	        transform: scaleX(0);
	-webkit-transform-origin: right;
	    -ms-transform-origin: right;
	        transform-origin: right;
	-webkit-transition: -webkit-transform .75s cubic-bezier(.19,1,.22,1);
	transition: -webkit-transform .75s cubic-bezier(.19,1,.22,1);
	-o-transition: transform .75s cubic-bezier(.19,1,.22,1);
	transition: transform .75s cubic-bezier(.19,1,.22,1);
	transition: transform .75s cubic-bezier(.19,1,.22,1), -webkit-transform .75s cubic-bezier(.19,1,.22,1);
}

#header .options #navigation ul li:hover:before,
#header .options #navigation ul li.active:before {
	-webkit-transform: scaleX(1);
	    -ms-transform: scaleX(1);
	        transform: scaleX(1);
	-webkit-transform-origin: left;
	    -ms-transform-origin: left;
	        transform-origin: left;
}

#header .options .linkBtn {
	margin: 0 0 0 34px;
}

#header.forHome .options .linkBtn {
	color: #fff;
	border-color: #123F4E;
	background-color: #123F4E;
}

#header.forHome .options .linkBtn:hover {
	background-color: #fff;
	color: #123F4E;
}

#header.forContact .options .linkBtn {
	color: #123F4E;
	border-color: #fff;
	background-color: #fff;
}

#header.forContact .options .linkBtn:hover {
	color: #fff;
	background-color: #123F4E;
	border-color: #123F4E;
}

body :has(#header.forContact) #contact .section {
	padding-top: 225px;
}

/* Intro */

#intro {
	position: relative;
	height: 71.73611111111111vw;
	padding-top: 1px;
	overflow: hidden;
}

#intro .sky {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url(../images/sky-image.jpg) no-repeat center top;
	background-size: cover;
}

#intro .title {
	position: relative;
	font-size: 10.41666666666667vw; /* 150px */
	font-weight: bold;
	color: #fff;
	line-height: 0.9333;
	width: 90.48611111111111vw;
	text-align: center;
	margin: 10.41666666666667vw auto 0;
	z-index: 1;
	letter-spacing: 0;
}

#intro .crane {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url(../images/crane-image.png) no-repeat center bottom;
	background-size: 100vw;
	z-index: 2;
}

#intro .text {
	position: absolute;
	left: 62.3vw;
	top: 39vw;
	font-size: 0.8333333333333333vw; /* 12px */
	font-weight: 500;
	padding-left: 5.666666666666667em;
	padding-top: 2.916666666666667em;
	letter-spacing: 0.0166666666666667em;
	line-height: 1.333;
	width: 19.16666666666667em;
	background: url(../images/pointer.svg) no-repeat left top;
	background-size: 4.7vw;
	z-index: 2;
}

.content-section {
    height: 100vh;
    background: #ebebeb;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Content */

.content .section {
	max-width: 690px;
}

/* White Box */

.whiteBox {
	display: flex;
	background: #fff;
	border-radius: 10px;
	padding: 27px;
	margin: 40px 0;
	align-items: flex-start;
}

.whiteBox .ico {
	width: 50px;
	margin-right: 14px;
	margin-top: -2px;
}

/* Blue Box */

.blueBox {
	background: #2AAFD1;
	border-radius: 10px;
	padding: 20px;
	margin: 40px 0 var(--spacing);
}

.blueBox * {
	color: #fff;
}

.blueBox ul {
	font-weight: 600;
	letter-spacing: 0.2px;
}

.blueBox>:last-child {
	margin-bottom: 0;
}

/* Pagi */

.pagi {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: var(--padding);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.2px;
}

.pagi span {
	color: #fff;
}

.pagi .prev,
.pagi .next {
	width: 9px;
	height: 16px;
	text-indent: -9999em;
	margin: 0 20px;
	background: url(../images/slider-arrow.svg) no-repeat;
}

.pagi .next {
	transform: rotate(180deg);
}

/* Intro Text */

.introText {
	background: #d4dee3 url(../images/pattern-white.svg) repeat center;
	text-align: center;
	background-attachment: fixed;
}

.introText .section {
	padding-top: calc(var(--padding) + 40px);
	padding-bottom: var(--padding);
}

.introText .text {
	max-width: 926px;
	margin: 0 auto;
}

.introText .text>:last-child {
	margin-bottom: 0;
}

/* Slider */

.slider {
	max-width: 926px;
	margin: 0 auto;
	padding-bottom: var(--padding)
}

.slider img {
	display: block;
	width: 100%;
	border-radius: 10px;
}

.slider .swiper-slide {
	position: relative;
}

.slider .swiper-slide p {
	position: absolute;
	left: 0;
	top: 100%;
	margin: 0;
	padding: 13px 110px 0 0;
}

.slider .navi {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 90px;
	height: 45px;
	padding: 0 14px;
	background: #B9C9D1;
	margin-left: auto;
	margin-right: 10px;
	outline: none;
	border-radius: 0 0 10px 10px;
	z-index: 1;
}

.slider .navi:after {
	position: absolute;
	content: "";
	width: 3px;
	height: 3px;
	left: 50%;
	margin-left: -1.5px;
	top: 50%;
	margin-top: -1.5px;
	border-radius: 100%;
	background: #fff;
}

.slider .navi div {
	background: yellow;
	width: 9px;
	cursor: pointer;
	height: 16px;
	outline: none;
	background: url(../images/slider-arrow.svg) no-repeat;
}

.slider .navi div:last-child {
	transform: rotate(180deg);
}

/* Project */

#project {
	position: relative;
	padding-top: 140px;
	z-index: 1;
}

#project:before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 442px;
	background: url(../images/pattern-white.svg) repeat center 98px;
}

#project .slider {
	padding-bottom: 100px;
}

#project .blueBox {
	margin-bottom: 100px;
}

/* Image Text */

.imageText {
	background: #B9C9D1;
	margin-bottom: var(--spacing);
}

.imageText .section {
	display: flex;
	padding-top: var(--padding);
	padding-bottom: var(--padding);
}

.imageText .image {
	position: relative;
	width: 300px;
	margin-left: 77px;
}

.imageText .image h1 {
	position: absolute;
	left: 50%;
	right: 0;
	top: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	text-align: center;
	width: 621px;
	transform: translateX(-50%);
	color: #fff;
}

.imageText .image img {
	display: block;
	border-radius: 10px;
}

.imageText .text {
	margin-left: auto;
	width: 523px;
	align-self: center;
}

.imageText .text>:last-child {
	margin-bottom: 0;
}

/* Services */

.services {
	margin-bottom: var(--spacing);
}

.services .listing {
	display: flex;
	justify-content: center;
	margin: -10px 0;
}

.services .listing .service {
	display: flex;
	flex-direction: column;
	width: 453px;
	background: #fff;
	padding: 20px 40px 20px 20px;
	margin: 10px;
	border-radius: 10px;
	align-items: flex-start;
	transition: background-color 0.3s;
}

.services .listing .service>:last-of-type {
	margin-bottom: 0;
}

.services .listing .service .ico {
	display: block;
	height: 50px;
	margin-bottom: 90px;
}

.services .listing .service .text {
	flex: 1;
}

.services .listing .service .linkBtn {
	margin-top: 20px;
}

.services .listing .service:hover {
	background: #2AAFD1;
}

/* Text Image */

.textImage {
	margin-bottom: var(--spacing);
}

.textImage .section {
	display: flex;
}

.textImage .text {
	width: 523px;
	align-self: center;
}

.textImage .text>:last-child {
	margin-bottom: 0;
}

.textImage .image {
	width: 572px;
	margin-left: auto;
}

.textImage .image img {
	display: block;
	width: 100%;
	border-radius: 10px;
}

/* Sectors */

.sectors {
	text-align: center;
	margin-bottom: var(--spacing);
}

.sectors .listing {
	margin: 35px 0 0;
	padding: 0;	
	display: flex;
	justify-content: center;
	text-align: left;
	flex-wrap: wrap;
}

.sectors .listing li {
	margin: 10px;
	padding: 20px;	
	list-style: none;
	background: #fff;
	border-radius: 10px;
	width: 250px;
}

.sectors .listing li>:last-child {
	margin-bottom: 0;
}

.sectors .listing li img {
	display: block;
	height: 50px;
	margin-bottom: 20px;
}

/* We Do */

.weDo {
	margin-bottom: var(--spacing);
}

.weDo h1 {
	text-align: center;
}

.weDo .listing {
	margin: 40px -10px 0;
	padding: 0;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.weDo .listing li {
	margin: 10px 0;
	padding: 0 10px;
	list-style: none;
	width: 473px;
	display: flex;
}

.weDo .listing li .item {
	background: #fff;
	width: 100%;
	padding: 20px;
	border-radius: 10px;
	display: flex;
	align-items: flex-start;
	transition: background-color 0.3s;
}

.weDo .listing li .ico {
	width: 50px;
	margin-right: 15px;
	margin-top: -2px;
}

.weDo .listing li .linkBtn {
	margin: 13px 0 0;
}

.weDo .listing li a.item:hover .linkBtn.linkBtnWhite {
	background-color: #123F4E;
	border-color: #123F4E;
	color: #fff;
}

.weDo .listing li:last-child .item {
	background: #2AAFD1;
	color: #fff;
}

.weDo .listing li:last-child h4 {
	color: #fff;
}

.weDo .listing li a.item:hover {
	background-color: #2AAFD1;
}

/* Table */

.table {
	margin: 0 0 33px;
	padding: 0;
	border-spacing: 0;
	border-collapse: 0;
}

.table th,
.table td {
	margin: 0;
	padding: 0;
	font-weight: normal;
	font-size: 17px;
	font-weight: 300;
}

.table th {
	font-size: 13px;
	font-weight: bold;
	color: #2AAFD1;
	padding-right: 17px;
	text-transform: uppercase;
	letter-spacing: 0.2px;
}

/* Projects */

#projects {
	display: flex;
	height: 100vh;
	--padding-top: 15vh;
}

#projects .sidebar {
	width: 210px;
	border-right: 1px solid #123F4E;
	padding-top: var(--padding-top);
	flex-shrink: 0;
}

#projects .sidebar .inner {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; 
    overscroll-behavior: auto;;
	padding-bottom: 20px;
	height: 100%;
}

#projects .sidebar .navi {
	margin: 37px 0 20px;
	padding: 0;
	text-align: center;
}

#projects .sidebar .navi li {
	position: relative;
	margin: 0 0 10px;
	padding: 0;
	list-style: none;
	font-size: 13px;
	font-weight: bold;
	letter-spacing: 0.2px;
}

#projects .sidebar .navi li a {
	display: block;
	color: #fff;
	padding: 9px 0;
	transition: color 0.3s;
}

#projects .sidebar .navi li:after {
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	width: 10px;
	height: 0;
	background: #2AAFD1;
	pointer-events: none;
	transition: all 0.3s;
}

#projects .sidebar .navi li.active a {
	color: #2AAFD1;
}

#projects .sidebar .navi li.active:after {
	height: 100%;
}

#projects .sidebar .pagination {
	position: relative;
	height: 63px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: stretch;
	text-align: center;
	overflow: hidden;
}

#projects .sidebar .pagination:after {
	content: "";
	position: absolute;
	left: 50%;
	margin-left: -2px;
	top: 50%;
	margin-top: -2px;
	width: 4px;
	height: 4px;
	background: #fff;
	border-radius: 100%;
}

#projects .sidebar .pagination a {
	display: block;
}

#projects .sidebar .pagination a span {
	display: block;
	background: url(../images/slider-arrow.svg) no-repeat center;
	width: 100%;
	height: 16px;
	text-indent: -9999em;
	pointer-events: none;
}

#projects .sidebar .pagination a.prev span {
	transform: rotate(90deg);
}

#projects .sidebar .pagination a.next span {
	transform: rotate(-90deg);
}

#projects .contents {
	position: relative;
	flex: 1;
	min-width: 0;
	overflow: hidden;
}

#projects .contents .project {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	z-index: 1;
}

#projects .contents .project.active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

#projects .contents .project .images {
	display: flex;
	position: absolute;
	right: 2%;
	width: 50.89256198347107%;
	top: var(--padding-top);
	bottom: calc(13vh - 45px);
}

#projects .contents .project .images .slider {
	max-width: 100%;
	height: 100%;
	padding-bottom: 45px;
}

#projects .contents .project .images .slider img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

#projects .contents .project .text {
    width: 47.10743801652893%;
    padding: 20px 7.851239669421488%;
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; 
    overscroll-behavior: auto;;
    display: flex;
    flex-direction: column;
}

#projects .contents .project .text .inner {
    margin: auto 0;
}

#projects .contents .project .text .inner>:last-child {
	margin-bottom: 0;
}

#projects .contents .project .info {
	position: relative;
	width: 70.74380165289256%;
	height: 20vh;
	background: #fff;
	border-radius: 0 10px 0 0;
	padding: 40px 7.851239669421488%;
	z-index: 99999999;
}

#projects .contents .project .info .items {
	display: flex;
	justify-content: space-between;
	margin: 0 -10px;
}

#projects .contents .project .info .items .item {
	padding: 0 10px;
}

#projects .contents .project .info .items h6 {
	text-transform: uppercase;
	color: #2AAFD1;
	letter-spacing: 0.2px;
}

/* Contact */

#contact {
	position: relative;
	background: #2aafd1;
	z-index: 1;
}

#contact:before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: url(../images/pattern-white.svg) repeat center;
	background-size: 785px;
	opacity: 0.3;
	z-index: -1;
	background-attachment: fixed;
}

#contact .section {
	display: flex;
	padding-top: var(--padding);
	padding-bottom: var(--padding);
}

#contact .text {
	width: 471px;
}

#contact .text h1 {
	color: #fff;
}

#contact .text .contacts {
	margin: 40px 0 0;
	padding: 0;
}

#contact .text .contacts li {
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.411;
}

#contact .text .contacts li a {
	display: inline-block;
	padding-left: 34px;
}

#contact .text .contacts li.phone a {
	background: url(../images/phone-ico.svg) no-repeat 4px 0;
}

#contact .text .contacts li.location a {
	background: url(../images/location-ico.svg) no-repeat 3px 0;
}

#contact .form {
	width: 572px;
	margin-left: auto;
}

#contact .form .fields {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -14px;
}

#contact .form .fields .field {
	width: 100%;
	padding: 0 14px;
	margin-bottom: 11px;
}

#contact .form .fields .field.half {
	width: 50%;
}

#contact .form .fields .field label {
	display: block;
	font-size: 13px;
	font-weight: bold;
	letter-spacing: 0.2px;
	text-transform: uppercase;
	line-height: 1.692;
	padding-bottom: 1px;
	padding-left: 5px;
	text-align: left;
}

#contact .form .fields .field .textbox {
	margin: 0;
	padding: 0;
	display: block;
	width: 100%;
	height: 44px;
	padding: 12px 15px;
	font-family: 'Poppins', Arial, sans-serif;
	font-size: 15px;
	font-weight: 600;
	border-radius: 10px;
	border: 1px solid #fff;
	background: rgba(42,175,209, 0.75);
	-webkit-appearance: none;
	appearance: none;
}

#contact .form .fields .field textarea.textbox {
	height: 200px;
	overflow: auto;
	resize: none;
}

#contact .form .submitBtn {
	margin: 18px 0 0;
}

/* Ninja Forms */
#contact .form .nf-form-fields-required,
#contact .form .nf-form-title,
#contact .form .nf-before-form-content {
	display: none;
}

#contact .form .nf-form-content {
	max-width: none;
	padding: 0;
}

#contact .form nf-fields-wrap {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -14px;
}

#contact .form nf-fields-wrap > nf-field:has(.field.half) {
	width: 50%;
}

#contact .form nf-fields-wrap > nf-field:has(.field:not(.half)),
#contact .form nf-fields-wrap > nf-field:has(.submit-container) {
	width: 100%;
}

#contact .form .nf-field-container.field {
	width: 100%;
	padding: 0 14px;
	margin: 0 0 11px;
}

#contact .form .nf-field-container.field.half {
	width: 100%;
}

#contact .form .nf-field-label {
	margin: 0;
}

#contact .form .nf-field-label label {
	display: block;
	font-size: 13px;
	font-weight: bold;
	letter-spacing: 0.2px;
	text-transform: uppercase;
	line-height: 1.692;
	padding: 0 0 1px 5px;
	text-align: left;
}

#contact .form .nf-field-element {
	width: 100%;
}

#contact .form .nf-form-content input:not([type="button"]),
#contact .form .nf-form-content textarea {
	margin: 0;
	display: block;
	width: 100%;
	height: 44px;
	padding: 12px 15px;
	font-family: 'Poppins', Arial, sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: #123F4E;
	border-radius: 10px;
	border: 1px solid #fff;
	background: rgba(42,175,209, 0.75);
	-webkit-appearance: none;
	appearance: none;
}

#contact .form .nf-form-content textarea {
	height: 200px;
	overflow: auto;
	resize: none;
}

#contact .form .nf-form-content input[type="submit"].submitBtn {
	display: inline-block;
	width: auto !important;
	height: auto;
	margin: 18px 14px 0;
	padding: 13px 37px;
	border: 0;
	cursor: pointer;
}

#contact .form .nf-error-msg,
#contact .form .ninja-forms-req-symbol {
	color: #123F4E;
}

@media only screen and (max-width: 767px) {
	#contact .form .nf-field-container.field.half {
		width: 100%;
	}

	#contact .form nf-fields-wrap > nf-field:has(.field.half) {
		width: 100%;
	}

	#contact .form .nf-form-content input[type="submit"].submitBtn {
		margin-left: auto;
		margin-right: auto;
	}
}

/* Footer */

#footer {
	background: #123F4E;
	color: #D4DEE3;
}

#footer .section {
	display: flex;
	padding-top: 85px;
	padding-bottom: 45px;
}

#footer h5 {
	color: #2AAFD1;
}

#footer .logo {
	width: 227px;
	margin-left: -56px;
}

#footer .logo img {
	display: block;
	width: 100%;
}

#footer .left {
	width: 355px;
	margin-left: 66px;
}

#footer .right {
	display: flex;
	margin-left: auto;
	margin-right: -56px;
	flex-wrap: wrap;
	justify-content: flex-end;
}

#footer .right .links {
	width: 216px;
	margin-left: 15px;
}

#footer .right .links ul {
	margin: 0;
	padding: 0;
}

#footer .right .links ul li {
	margin: 0 0 10px;
	padding: 0;
	list-style: none;
}

#footer .right .links ul li a {
	display: inline-block;
}

#footer .right .links ul li a:hover {
	text-decoration: underline;
}

#footer .right .websiteBy {
	width: 100%;
	flex-shrink: 0;
	margin: 0 56px 0 0;
	text-align: right;
	font-size: 13px;
	font-weight: bold;
	color: rgba(212,222,227,0.35);
	text-transform: uppercase;
	letter-spacing: 0.2px;
}

#footer .right .websiteBy a {
	text-decoration: underline;
	transition: color 0.3s;
}

#footer .right .websiteBy a:hover {
	color: rgba(212,222,227,0.80);
}

/* Hamburger */

.hamburger {
	display: none;
	overflow: visible;
	position: absolute;
	top: 7px;
	right: 10px;
	margin-top: 0;
	-webkit-transition-timing-function: linear;
	     -o-transition-timing-function: linear;
	        transition-timing-function: linear;
	-webkit-transition-duration: .15s;
	     -o-transition-duration: .15s;
	        transition-duration: .15s;
	-webkit-transition-property: opacity, -webkit-filter;
	transition-property: opacity, -webkit-filter;
	-o-transition-property: opacity, filter;
	transition-property: opacity, filter;
	transition-property: opacity, filter, -webkit-filter;
	text-transform: none;
	color: inherit;
	border: 0;
	background-color: transparent;
}

.hamburger.is-active:hover,
.hamburger:hover {
	opacity: 1
}

.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner:after,
.hamburger.is-active .hamburger-inner:before {
	background-color: #123F4E;
}

.hamburger-box {
	display: inline-block;
	width: 32px;
	height: 24px;
}

.hamburger-inner {
	top: 50%;
	display: block;
	margin-top: -4px
}

.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {
	position: absolute;
	width: 32px;
	height: 4px;
	-webkit-transition-timing-function: ease;
	     -o-transition-timing-function: ease;
	        transition-timing-function: ease;
	-webkit-transition-duration: .15s;
	     -o-transition-duration: .15s;
	        transition-duration: .15s;
	-webkit-transition-property: -webkit-transform;
	transition-property: -webkit-transform;
	-o-transition-property: transform;
	transition-property: transform;
	transition-property: transform, -webkit-transform;
	border-radius: 4px;
	background-color: #123F4E;
}

.hamburger-inner:after,
.hamburger-inner:before {
	display: block;
	content: ""
}

.hamburger-inner:before {
	top: -10px
}

.hamburger-inner:after {
	bottom: -10px
}

.hamburger .hamburger-inner {
	-webkit-transition-timing-function: cubic-bezier(.55, .055, .675, .19);
	     -o-transition-timing-function: cubic-bezier(.55, .055, .675, .19);
	        transition-timing-function: cubic-bezier(.55, .055, .675, .19);
	-webkit-transition-duration: .22s;
	     -o-transition-duration: .22s;
	        transition-duration: .22s
}

.hamburger .hamburger-inner:before {
	-webkit-transition: top .1s ease-in .25s, opacity .1s ease-in;
	-o-transition: top .1s ease-in .25s, opacity .1s ease-in;
	transition: top .1s ease-in .25s, opacity .1s ease-in
}

.hamburger .hamburger-inner:after {
	-webkit-transition: bottom .1s ease-in .25s, -webkit-transform .22s cubic-bezier(.55, .055, .675, .19);
	transition: bottom .1s ease-in .25s, -webkit-transform .22s cubic-bezier(.55, .055, .675, .19);
	-o-transition: bottom .1s ease-in .25s, transform .22s cubic-bezier(.55, .055, .675, .19);
	transition: bottom .1s ease-in .25s, transform .22s cubic-bezier(.55, .055, .675, .19);
	transition: bottom .1s ease-in .25s, transform .22s cubic-bezier(.55, .055, .675, .19), -webkit-transform .22s cubic-bezier(.55, .055, .675, .19)
}

.hamburger.is-active .hamburger-inner {
	-webkit-transition-delay: .12s;
	     -o-transition-delay: .12s;
	        transition-delay: .12s;
	-webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
	     -o-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
	        transition-timing-function: cubic-bezier(.215, .61, .355, 1);
	-webkit-transform: rotate(225deg);
	    -ms-transform: rotate(225deg);
	        transform: rotate(225deg)
}

.hamburger.is-active .hamburger-inner:before {
	top: 0;
	-webkit-transition: top .1s ease-out, opacity .1s ease-out .12s;
	-o-transition: top .1s ease-out, opacity .1s ease-out .12s;
	transition: top .1s ease-out, opacity .1s ease-out .12s;
	opacity: 0
}

.hamburger.is-active .hamburger-inner:after {
	bottom: 0;
	-webkit-transition: bottom .1s ease-out, -webkit-transform .22s cubic-bezier(.215, .61, .355, 1) .12s;
	transition: bottom .1s ease-out, -webkit-transform .22s cubic-bezier(.215, .61, .355, 1) .12s;
	-o-transition: bottom .1s ease-out, transform .22s cubic-bezier(.215, .61, .355, 1) .12s;
	transition: bottom .1s ease-out, transform .22s cubic-bezier(.215, .61, .355, 1) .12s;
	transition: bottom .1s ease-out, transform .22s cubic-bezier(.215, .61, .355, 1) .12s, -webkit-transform .22s cubic-bezier(.215, .61, .355, 1) .12s;
	-webkit-transform: rotate(-90deg);
	    -ms-transform: rotate(-90deg);
	        transform: rotate(-90deg)
}

.mm-panels {
	font-size: 22px;
}

.mm-panel {
	background: #D4DEE3;
	text-align: left;
		font-weight: bold;
}

.mm-navbar>* {
	min-height: 40px;
	background: #123F4E;
	font-weight: bold;
}

.mm-navbar__title>span {
	color: #fff;
	padding-left: 10px;
}

.mm-listitem__text {
	color: #000 !important;
	padding-top: 20px;
	padding-bottom: 20px;
}

.mm-listitem.active, 
.mm-listitem .active {
	background-color: #2AAFD1;  
}

.mm-listitem:after {
	display: none;
}

.mm-listitem.active a, 
.mm-listitem .active a {
	color: #fff !important;
}

/* Miscelleneous */

p {
	margin: 0 0 10px;
}

strong {
	font-weight: bold;
}

h1,h2,h3,h4,h5,h6 {
	font-family: 'Poppins', Arial, sans-serif;
	font-weight: bold;
	margin: 0 0 19px;
	line-height: 1.2;
	color: #123F4E;
	letter-spacing: 0;
}

h1 {
	font-size: 52px;
	line-height: 1.230;
	color: #2AAFD1;
	letter-spacing: 0.2px;
	margin: 0 0 17px;
}

h2 {
	font-size: 44px;
	font-weight: 500;
	line-height: 1.230;
	margin: 0 0 17px;
}

h3 {
	font-size: 32px;
	font-weight: 600;
	line-height: 1.312;
	margin: 0 0 21px;
	letter-spacing: 0.1px;
}

h4 {
	font-size: 26px;
	font-weight: 500;
	line-height: 1.230;
	margin: 0 0 9px;
	letter-spacing: 0.2px;
}

h5 {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.411;
	margin: 0 0 10px;
	letter-spacing: 0.1px;
}

h6 {
	font-size: 13px;
	font-weight: bold;
	line-height: 1.230769230769231;
	margin: 0 0 10px;
	letter-spacing: 0.2px;	
}

a {
	outline: none;
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: inherit;
}

hr {
	margin: 32px 0;
	padding: 0;
	height: 1px;
	border: 0;
	background: #000;
}

img {
	border: 0;
	max-width: 100%;
}

ul,
ol {
	padding: 0 0 0 30px;
	margin-bottom: 10px;
}

.linkBtn {
	position: relative;
	display: table;
	font-family: 'Poppins', Arial, sans-serif;
	font-size: 15px;
	font-weight: 600;
	margin: 1.933333333333333em 0;
	min-width: 8.666666666666667em;
	text-align: center;
	color: #1E2623;
	border: 0.1333333333333333em solid #2AAFD1;
	padding: 0.6286666666666667em 1.666666666666667em;
	background: #2AAFD1;
	color: #fff;
	border-radius: 0.6666666666666667em;
	letter-spacing: 0.0133333333333333em;
	text-transform: uppercase;
	cursor: pointer;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	     appearance: none;
	-webkit-transition: background-color 0.3s;
	-o-transition: background-color 0.3s;
	transition: background-color 0.3s;
}

.linkBtn:hover {
	background-color: #123F4E;
	border-color: #123F4E;
	color: #fff;
}

.linkBtn.linkBtnHollow {
	color: #123F4E;
	border-color: #123F4E;
	background-color: transparent;
}

.linkBtn.linkBtnHollow:hover {
	background-color: #123F4E;
	color: #fff;
}

.linkBtn.linkBtnDark {
	color: #fff;
	border-color: #123F4E;
	background-color: #123F4E;
}

.linkBtn.linkBtnDark:hover {
	background-color: #fff;
	color: #123F4E;
}

.linkBtn.linkBtnWhite {
	color: #2AAFD1;
	border-color: #fff;
	background-color: #fff;
}

.clear {
	clear: both;
}

.clearfix:after { 
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden; 
}

.clearfix { 
  display: inline-block;  
}

* html .clearfix{  
  height: 1%;  
}

.clearfix {  
  display: block;  
}

input::-moz-focus-inner { 
    border: 0;
    padding: 0;
}

form {
	margin: 0;
	padding: 0;
}

input, select, textarea {
    border-radius: 0;
}

::-webkit-input-placeholder {
	color: inherit;
	opacity: 1;
}

:-moz-placeholder {
	color: inherit;
	opacity: 1;
}

::-moz-placeholder {
	color: inherit;
	opacity: 1;
}

:-ms-input-placeholder {  
	color: inherit;
	opacity: 1;
}

/* Media Queries */

@media only screen and (max-width : 1310px) {
	#footer .logo {
		margin-left: 0;
	}
}

/* Tablet Screens (Landscape) */

@media only screen and (max-width : 1260px) {
	.section {
		max-width: 970px;
	}	

	:root {
		--padding: 125px;
		--spacing: 200px;
	}

	#header.forProjects .logo {
		width: 115px;
		margin-left: -7px;
	}

	#projects .sidebar {
		width: 140px;
	}

	#projects .sidebar .navi {
		margin-top: 0;
	}

	#projects .contents .project .text {
		padding: 20px 4%;
	}

	#projects .contents .project .info {
		padding-left: 4%;
		padding-right: 4%;
	}

	.imageText .image {
		margin-left: 70px;
	}

	.imageText .image h1 {
		width: 440px;
	}

	.textImage .image,
	.textImage .text {
		width: 475px;
	}
	
	.sectors .listing li {
		width: 220px;
	}

	body :has(#header.forContact) #contact .section {
		padding-top: 185px;
	}

	#contact .form {
		width: 470px;
	}

	#footer .left {
		margin-left: 37px;
	}

	h1 {
		font-size: 40px;
	}

	h4 {
		font-size: 22px;
	}
}

/* Tablet Screens (Portrait) */

@media only screen and (max-width : 991px) {
	.section {
		max-width: 750px;
		padding-left: 15px;
		padding-right: 15px;
	}	

	:root {
		--padding: 90px;
		--spacing: 150px;
	}

	#header .logo {
		width: 180px;
		margin-top: -9px;
	}
	
	#header.forProjects .logo {
		margin-left: -14px;
		width: 77px;
	}

	#header .options #navigation ul li:before {
		bottom: -0.5em;
		height: 0.4em;
	}
	
	#header .options #navigation ul li {
		margin-left: 16px;
		font-size: 14px;
	}

	#header .options .linkBtn {
		margin-left: 16px;
	}

	body :has(#header.forContact) #contact .section {
		padding-top: 133px;
	}

	#projects .sidebar {
		width: 90px;
	}

	#projects .contents .project .images {
		width: 40%;
	}

	#projects .contents .project .text {
		width: 58%;
	}
	
	#projects .contents .project .info {
		width: 78%;
		height: 17vh;
		padding: 20px 4%;
	}

	#project {
		padding-top: 110px;
	}

	#project:before {
		height: 342px;
	}

	#project .slider {
		padding-bottom: 65px;
	}

	.imageText .image {
		width: 255px;
		margin-left: 20px;
	}

	.imageText .image h1 {
		width: 370px;
	}
	
	.imageText .text {
		width: 386px;
	}

	.textImage .image, .textImage .text {
		width: 349px;
	}

	.services .listing .service .ico {
		margin-bottom: 40px;
	}

	.sectors .listing li {
		width: 340px;
	}
	
	.weDo .listing li {
		width: 370px;
	}
	
	#contact .text,
	#contact .form {
		width: 350px;
	}
	
	#contact .form .fields {
		margin-left: -8px;
		margin-right: -8px;
	}

	#contact .form .fields .field {
		padding: 0 8px;
	}

	#footer .logo {
		width: 170px;
	}

	#footer .left {
		width: 290px;
	}
	
	#footer .right {
		margin-right: 0;
		width: 200px;
	}

	#footer .right .links {
		width: 100%;
	}

	#footer .right .websiteBy {
		margin: 10px 27px 0 0;
	}
	
	.linkBtn {
		font-size: 14px;
	}

	h1 {
		font-size: 35px;
	}

	h2 {
		font-size: 33px;
	}

	h3 {
		font-size: 25px;
	}
}

/* Mobile Screens */

@media only screen and (max-width : 767px) {
	.hamburger {
		display: block;
	}

	:root {
		--padding: 60px;
		--spacing: 80px;
	}

	body {
		border: none;
	}

	body {
		font-size: 15px;
	}

	#mainWrapper {
		text-align: center;
	}

	#header {
		height: 45px;
		padding: 0 10px;
	}

	#header .logo {
		width: 165px;
	}

	#header.forProjects .logo {
		margin-left: 0;
		width: 85px;
		margin-top: -5px;
	}

	#header .options {
		display: none;
	}

	body :has(#header.forContact) #contact .section {
		padding-top: 75px;
	}
	
	#intro {
		height: 216vw;
	}

	#intro .crane {
		background: url(../images/crane-image.png) no-repeat -150vw bottom;
		background-size: 347vw;
	}

	#intro .text {
		left: 69.3vw;
		top: 105vw;
		text-align: left;
		font-size: 2vw;
		padding-top: 0.916667em;
		width: 14.166667em;
		padding-left: 2.666667em;
	}

	#intro .title {
		font-size: 17.416667vw;
		margin-top: 17.416667vw;
	}

	.introText .section {
		padding-top: calc(var(--padding) + 15px);
		padding-bottom: var(--padding);
	}

	#projects {
		position: relative;
		padding-top: 240px;
	}

	#projects .sidebar {
		width: 50px;
		padding-top: 20px;
	}
	
	#projects .sidebar .navi li:after {
		width: 6px;
	}

	#projects .sidebar .navi li a {
		padding-top: 3px;
		padding-bottom: 3px;
	}

	#projects .contents .project {
		position: absolute;
		width: auto;
	}

	#projects .contents .project .images {
		left: 10px;
		right: 10px;
		top: 40px;
		bottom: auto;
		width: auto;
		height: 200px;
	}

	#projects .contents .project .images .slider {
		padding-bottom: 0;
	}

	#projects .contents .project .images .slider .navi {
		display: none;
	}

	#projects .contents .project .text {
		width: 100%;
	}

	#projects .contents .project .text .inner {
		margin: 0;
	}

	#projects .contents .project .info {
		width: 98%;
		font-size: 11px;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	#projects .contents .project .info .items {
		flex-wrap: wrap;
		margin: 0 -10px;
	}

	#projects .contents .project .info .items h6 {
		margin: 0;
		font-size: 11px;
	}

	#projects .contents .project .info .items .item {
		width: 50%;
		padding: 0 10px;
	}

	#projects .contents .project .info .items .item p br {
		display: none;
	}

	#project {
		padding-top: 53px;
	}

	#project:before {
		height: 38vw;
	}

	#project .slider {
		padding-bottom: 50px;
	}

	.whiteBox {
		display: block;
	}

	.table {
		text-align: left;
		margin-left: auto;
		margin-right: auto;
	}

	#contact .section {
		display: block;
	}

	#contact .text {
		width: 100%;
		margin-bottom: 30px;
	}

	#project .blueBox {
		margin-bottom: 40px;
	}

	#contact .form {
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}

	#contact .form .submitBtn {
		margin-left: auto;
		margin-right: auto;
	}

	#contact .form .fields .field.half {
		width: 100%;
	}

	#footer .section {
		position: relative;
		flex-direction: column;
		padding-top: var(--padding);
		padding-bottom: var(--padding);
	}

	#footer .logo {
		margin: 0 auto 30px;
		order: 0;
	}

	#footer .left {
		margin: 0;
		width: 100%;
		order: 2;
	}

	#footer .right {
		width: 100%;
		order: 1;
		margin-bottom: 8px;
	}

	#footer .right .links {
		margin-left: 0;
		margin-bottom: 10px;
	}

	#footer .right .websiteBy {
		position: absolute;
		margin: 0;
		text-align: center;
		left: 0;
		right: 0;
		bottom: 30px;
	}

	.services .listing {
		display: block;
	}

	.services .listing .service {
		margin: 0 auto 30px;
		width: 100%;
		max-width: 500px;
	}

	.services .listing .service .ico {
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 14px;
	}

	.services .listing .service:last-child {
		margin-bottom: 0;
	}

	.imageText .section {
		display: block;
	}

	.imageText .text {
		margin: 0;
		width: 100%;
		text-align: center;
	}

	.imageText .text .linkBtn {
		margin-left: auto;
		margin-right: auto;
	}

	.imageText .image {
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 30px;
	}

	.textImage .section {
		flex-direction: column;
		text-align: center;
	}

	.textImage .image {
		order: -1;
		width: 100%;
		max-width: 500px;
		margin: 0 auto 30px;
	}

	.textImage .text {
		width: 100%;
	}

	.textImage .text .linkBtn {
		margin-left: auto;
		margin-right: auto;
	}

	.sectors .listing {
		margin-top: 20px;
	}

	.sectors .listing li {
		width: calc(50% - 10px);
		margin: 5px;
		text-align: center;
	}

	.sectors .listing li img {
		margin: 0 auto 10px;
	}

	.weDo .listing li {
		max-width: 500px;
		width: 100%;
	}

	.weDo .listing li .item {
		display: block;
		text-align: center;
	}

	.weDo .listing li .ico {
		margin: 0 auto 10px;
	}

	.weDo .listing li .linkBtn {
		margin-left: auto;
		margin-right: auto;
	}
		
	.linkBtn {
		font-size: 12px;
		margin: 1.3em auto;
	}

	ul.bulletList {
		padding: 0;
	}

	ul.bulletList li {
		position: relative;
		list-style: none;
	}

	ul.bulletList li:before {
		content: "\2022";
		margin-right: 8px;
	}

	h1 {
		font-size: 35px;
	}

	h2 {
		font-size: 30px;
	}

	h3 {
		font-size: 20px;
	}

	h4 {
		font-size: 18px;
	}

	h5 {
		font-size: 15px;
	}

	h6 {
		font-size: 11px;
	}

}

@media only screen and (max-width : 479px) {

}

/* Optional motion enhancements (Global Options > Enable subtle animations). */
.acg-motion-enabled .services .service,
.acg-motion-enabled .weDo .item,
.acg-motion-enabled .imageSlider .swiper-slide {
	overflow: hidden;
}

.acg-motion-enabled .services .service img,
.acg-motion-enabled .weDo .item .ico,
.acg-motion-enabled .imageSlider .swiper-slide img {
	transition: transform 0.65s cubic-bezier(.22, 1, .36, 1);
}

.acg-motion-enabled .services .service:hover img,
.acg-motion-enabled .weDo a.item:hover .ico,
.acg-motion-enabled .imageSlider .swiper-slide:hover img {
	transform: scale(1.025);
}

.acg-motion-enabled .pagination a span,
.acg-motion-enabled .imageSlider .navi > div {
	transition: transform 0.25s ease;
}

.acg-motion-enabled .pagination .prev:hover span,
.acg-motion-enabled .imageSlider .navi .prev:hover {
	transform: translateX(-4px);
}

.acg-motion-enabled .pagination .next:hover span,
.acg-motion-enabled .imageSlider .navi .next:hover {
	transform: translateX(4px);
}

@media (prefers-reduced-motion: reduce) {
	.acg-motion-enabled *,
	.acg-motion-enabled *::before,
	.acg-motion-enabled *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}