@charset "utf-8";

* {
	scroll-behavior: smooth;
}

:root {
	font-size: 16px;
	--wrapper-padding: 40px;
	--color-text: #282828;
	--color-white: #fff;
	--color-black: #000;
	--color-green: #07A84A;
	--color-dark-red: #962E2F;
	--color-dark-green: #2D4537;
	--color-orange: #EF8639;
	--color-bg-soft: #F5F7F8;
	--color-light-grey: #F5F5F5;
	--color-bg-grey: #F2F2F2;
	--color-border-grey: #DBDBDB;
	--color-checkbox-grey: #C6C9CB;
	--color-text-grey: #707070;
	--color-red: #FF0000;

	--font-bebas-neue: 'Bebas Neue', Arial, Helvetica, sans-serif;
	--font-poppins: 'Poppins', sans-serif;

	--max-width: 1400px;
	--h1-font-size: 3.75rem;
	--h2-font-size: 3.125rem;
	--h3-font-size: 1.5625rem;
	--h4-font-size: 1.25rem;
	--font-size-title: 1.875rem;
	--font-size-sm: 0.9375rem;
	--font-size-xs: 0.875rem;

	--weight-regular: 400;
	--weight-medium: 500;
	--weight-semibold: 600;
	--weight-bold: 700;

	--ease-out: cubic-bezier(0.25, 1, 0.5, 1);
	--ease-out-smooth: cubic-bezier(0.22, 1, 0.36, 1);

	--nivo-caption-bottom: 3rem;
}

/*  ###############################################
	STANDARD
	###############################################  */
* {
	transition: all 0.5s ease;
	transition-property: background-size, transform, width, height, opacity;
}

body {
	font-family: var(--font-poppins);
	margin: 0;
	background-color: var(--color-white);
	line-height: 1.2;
	overflow-x: hidden;
	color: var(--color-text);
}

.mobile {
	display: none;
}

.wrapper {
	box-sizing: content-box;
	width: 100%;
	max-width: var(--max-width);
	padding: 7.125rem 40px 7.5rem 40px;
	margin: auto;
}

#header-top .wrapper,
#header-container .wrapper,
.nivo-caption .wrapper,
#footer .wrapper,
#copyright .wrapper {
	padding: 0 40px !important;
}

h1 {
	font-size: var(--h1-font-size);
	font-family: var(--font-bebas-neue);
	color: var(--color-dark-green);
	font-weight: normal;
}

h2 {
	font-size: var(--h2-font-size);
	font-family: var(--font-poppins);
	color: var(--color-dark-red);
}

h3 {
	font-size: var(--h3-font-size);
	font-family: var(--font-poppins);
	color: var(--color-dark-red);
}

h4 {
	font-size: var(--h4-font-size);
	font-family: var(--font-poppins);
	color: var(--color-dark-red);
}

input,
select,
textarea {
	color: inherit;
}

p {
	font-size: 1rem;
	font-weight: var(--weight-regular);
	color: var(--color-text);
}

a {
	color: var(--color-dark-green);
	font-weight: var(--weight-medium);
	text-decoration: none;
}

a:link {
	text-decoration: none
}

a:visited {
	text-decoration: none;
}

.red-link {
	color: var(--color-dark-red);
	font-weight: var(--weight-medium) !important;
	border-bottom: none;
	padding-bottom: 7px;
	text-decoration: none;
	display: inline-block;
	position: relative;
}

.red-link::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background-color: var(--color-dark-green);
	transform: scaleX(0);
	transform-origin: bottom right;
	transition: transform 0.3s ease-out;
}

.red-link:hover {
	color: var(--color-dark-green);
}

.red-link:hover::after {
	transform: scaleX(1);
	transform-origin: bottom left;
}

.browse {
	color: var(--color-dark-red);
	font-weight: var(--weight-medium) !important;
	border-bottom: 2px solid var(--color-dark-red);
	padding-bottom: 3px;
	text-decoration: none;
	display: inline-block;
	transition: color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

.browse:hover {
	color: var(--color-dark-green);
	border-color: var(--color-dark-green);
	transform: translateX(4px);
}

.green-link,
.white-link {
	font-weight: var(--weight-medium);
	font-size: var(--font-size-sm);
	text-decoration: none !important;
	border-bottom: none;
	padding-bottom: 4px !important;
	display: inline-flex;
	align-items: center;
	line-height: 1;
	white-space: nowrap;
	position: relative;
}

.green-link {
	color: var(--color-dark-green);
}

.white-link {
	color: var(--color-white);
}

.green-link::after,
.white-link::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background-color: currentColor;
	transform: scaleX(0);
	transform-origin: bottom right;
	transition: transform 0.3s ease-out;
}

.green-link:hover,
.project-grid-card:hover .green-link,
.homepage-project-card:hover .green-link,
.white-link:hover,
.project-grid-card:hover .white-link,
.homepage-project-card:hover .white-link {
	color: var(--color-dark-red) !important;
}

.green-link:hover::after,
.project-grid-card:hover .green-link::after,
.homepage-project-card:hover .green-link::after,
.white-link:hover::after,
.project-grid-card:hover .white-link::after,
.homepage-project-card:hover .white-link::after {
	transform: scaleX(1);
	transform-origin: bottom left;
}

a img {
	border: none;
}

.btn-red,
.btn-wo {
	font-weight: var(--weight-medium);
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	display: inline-block;
	text-align: center;
	border-radius: 30px;
	padding: 1.25rem 2.125rem;
	text-decoration: none;
	background-image: none !important;
	cursor: pointer;
	transition: background-color 0.35s ease,
		color 0.35s ease,
		border-color 0.35s ease,
		transform 0.35s var(--ease-out),
		box-shadow 0.35s ease;
}

.btn-red {
	background-color: var(--color-dark-red);
	border: 1px solid var(--color-dark-red);
	color: var(--color-white) !important;
}

.btn-wo {
	background-color: transparent;
	border: 1px solid var(--color-white);
	color: var(--color-white) !important;
}

.btn-red:hover {
	background-color: var(--color-white) !important;
	color: var(--color-dark-red) !important;
	border-color: var(--color-dark-red) !important;
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.18);
}

.btn-wo:hover {
	background-color: var(--color-white);
	color: var(--color-dark-red) !important;
	border-color: var(--color-white);
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(255, 255, 255, 0.2);
}

.btn-red:active,
.btn-wo:active {
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

iframe {
	width: 100%;
	display: block;
}

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

.no-records-message {
	text-align: center;
	color: var(--color-text);
	padding: 20px 0;
}

.highlight {
	color: var(--color-dark-red) !important;
	font-weight: var(--weight-medium) !important;
}

/*  ###############################################
	LOGO
	###############################################  */
#logo a,
#logo a img {
	display: block;
	height: 60px !important;
	width: auto !important;
	object-fit: contain;
}


/*  ###############################################
	HEADER
	###############################################  */
#header-holder {
	position: fixed;
	top: 0px;
	width: 100%;
	z-index: 200;
	background: transparent;
}

#header-top {
	background: transparent;
	position: relative;
	z-index: 1;
}

#header-top .wrapper {
	width: 100%;
	max-width: var(--max-width);
	margin: auto;
}

#header-top .wrapper>div {
	padding: 5px 0px;
	display: flex;
	align-items: center;
	position: relative;
	width: 100%;
	border-bottom: 1px solid var(--color-white);
}

#header-top #logo {
	padding: 10px 0px;
	background: transparent;
	position: relative;
}

#header-top #title {
	margin-left: 1.5rem;
	display: flex;
	flex-grow: 1;
	align-items: center;
	color: var(--color-white);
	font-family: var(--font-poppins);
	font-size: var(--font-size-title);
	font-weight: var(--weight-semibold);
	text-transform: uppercase;
	letter-spacing: 1px;
}

#header-holder.scroll #header-container {
	background-color: var(--color-white);
	background-image: none;
	position: relative;
	z-index: 0;
	border-bottom: solid 1px var(--color-border-grey);
}

#header-holder.scroll #logo {
	padding: 5px 0px;
}

#header-holder.scroll #logo a,
#header-holder.scroll #logo a img {
	height: 45px;
}

#header-holder.scroll #menu {
	padding: 6px 0px;
}

#header-holder.scroll #header-top #title {
	margin-left: 1.5rem;
	font-size: 1.45rem;
}

#header-holder.scroll #menu-top {
	padding-left: 0px;
}

#header-holder.scroll #menu ul ul {
	padding-top: 24px;
}

#header-holder.scroll #menu ul {
	align-items: center;
}

#header-holder.scroll #menu>ul>li>a,
#header-holder.scroll #menu>ul>li>a:visited {
	color: var(--color-dark-red);
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/*  #######################################
    MENU 
    #######################################   */
#header-container {
	background: transparent;
	position: relative;
	z-index: 0;
}

#header-container .wrapper {
	position: relative;
	width: 100%;
	max-width: var(--max-width);
	margin: auto;
	display: flex;
	align-items: center;
}

#menu-top {
	font-size: var(--font-size-sm);
	list-style-type: none;
	position: relative;
	z-index: 103;
	padding-left: 0px;
	flex-grow: 1;
	text-align: left;
}

#mobile-menu {
	display: none;
}

.slicknav_menu {
	display: none;
}

/*  ###############################################
	BANNER
	###############################################  */
#banner-contant {
	width: 100%;
	margin: 0 auto;
	aspect-ratio: 1920 / 850;
	overflow: hidden;
	position: relative;
}

.inner #banner-contant {
	height: 500px;
	aspect-ratio: auto;
	overflow: hidden;
}

.inner .nivoSlider {
	height: 100% !important;
}

.inner.contact #banner-contant {
	border-bottom: solid 1px var(--color-border-grey);
}

.banner-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 8;
	background: rgba(0, 0, 0, 0.55);
	pointer-events: none;
}

.nivoSlider,
.nivoSlider * {
	transition: none !important;
}

.nivoSlider img,
.nivo-main-image,
.nivo-slide img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

#slider:not(.nivoSlider) {
	width: 100%;
	height: 100%;
}

.nivoSlider>video,
.nivoSlider>a>video {
	display: none !important;
}

.nivo-video-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	z-index: -2;
	pointer-events: none !important;
}

.nivo-video-link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	display: block;
	pointer-events: auto !important;
}

.nivo-caption {
	color: var(--color-white);
	z-index: 100;
	display: flex !important;
	position: absolute;
	bottom: var(--nivo-caption-bottom);
	left: 0px;
	width: 100%;
	padding: 0px;
}

body:has(.nivo-slider-wrapper .nivo-caption) .loading-caption {
	display: none !important;
}

.nivo-caption:has(.nivo-video-bg) {
	top: 0 !important;
	bottom: 0 !important;
	height: 100% !important;
	display: block !important;
	pointer-events: none !important;
}

.nivo-caption:has(.nivo-video-bg)::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.55);
	z-index: 0;
	pointer-events: none;
}

.nivo-caption:has(.nivo-video-bg) .wrapper {
	position: absolute !important;
	bottom: var(--nivo-caption-bottom) !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	max-width: var(--max-width) !important;
	margin: auto !important;
	z-index: 1 !important;
}

.nivo-caption:has(.nivo-video-bg) .wrapper * {
	pointer-events: auto;
}

.nivo-caption .wrapper {
	width: 100%;
	max-width: var(--max-width);
	margin: auto;
}

.nivo-caption .wrapper>div {
	max-width: 100%;
}

.nivo-caption p.title {
	font-family: var(--font-bebas-neue);
	font-size: var(--h1-font-size);
	color: var(--color-white);
	text-transform: uppercase;
	line-height: 1;
	text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.6);
	max-width: 720px;
	margin-top: -5px;
}

.nivo-caption p.desc {
	display: block;
	color: var(--color-white);
	font-size: 1rem;
	font-weight: var(--weight-medium);
	line-height: 1.25;
	text-transform: none;
}

.nivo-caption a.btn-red {
	background-color: rgba(150, 46, 47, 0.75);
}

.nivo-caption a.btn-red,
.nivo-caption a.btn-wo {
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.6);
	margin-top: 1.75rem;
	margin-right: 1.5rem;
}

.nivo-caption a.btn-red:last-child,
.nivo-caption a.btn-wo:last-child {
	margin-right: 0px;
}


/*  ###############################################
	MAIN CONTENT
	###############################################  */
#main-content {
	max-width: 100%;
	margin: auto;
}

body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper {
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: 30px;
	text-align: left;
	align-items: start;
	padding-bottom: var(--intro-spacing, 0rem) !important;
}

body.inner #main-content~div:not(.credentials-section):not(#projects):not(#project-form):not(#job-form):not(#contact-form) .wrapper {
	padding-top: 0 !important;
}

body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper>h1 {
	grid-column: 1;
	grid-row: 1 / span 20;
	text-transform: uppercase;
	margin-top: -8px;
	margin-bottom: 0;
}

body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper>*:not(h1) {
	grid-column: 2;
	font-size: var(--h4-font-size);
	margin-top: 0;
}

body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper>*:not(h1):last-child {
	margin-bottom: 0;
}

body.inner.our-news #main-content .wrapper>*:not(h1),
body.inner.our-events #main-content .wrapper>*:not(h1) {
	margin-top: 25px !important;
	margin-left: 20px;
}

body.inner #main-content .wrapper ul li {
	font-size: inherit !important;
}

body.about-us,
body.our-leaders {
	--intro-spacing: 5rem;
}

body.core-business,
body.project-detail {
	--intro-spacing: 7.125rem;
}

body.residential,
body.our-news,
body.our-events {
	--intro-spacing: 2.75rem;
}

body.careers {
	--intro-spacing: 1.9375rem;
}

body.certifications-awards {
	--intro-spacing: 2.8125rem;
}

body.about-us #main-content .wrapper>h1 {
	margin-top: -10px;
}

body.inner.about-us #main-content .wrapper *:not(h1) {
	font-size: 1rem !important;
}

body.home #main-content {
	background: linear-gradient(to bottom, var(--color-bg-grey) calc(100% - min(189px, 14.3vw - 11px)), var(--color-white) calc(100% - min(189px, 14.3vw - 11px))) !important;
}

body.home #main-content .wrapper>p:first-child {
	margin: 0;
	font-size: var(--h4-font-size);
}

body.home #main-content .wrapper>h1 {
	color: var(--color-dark-green);
	text-transform: uppercase;
	margin: -5px 0 20px 0;
}

body.home #main-content .wrapper>h1::after {
	content: "";
	display: block;
	width: 60px;
	height: 3px;
	background: var(--color-dark-red);
	margin: 0 auto;
}

body.home #main-content .wrapper table~p {
	font-size: var(--h4-font-size);
	margin: 20px auto;
	max-width: 1152px;
	line-height: 1.25;
}

body.home #main-content .wrapper>table {
	display: grid;
	grid-template-columns: 1fr auto auto 1fr;
	align-items: center;
	margin-top: 1rem;
	width: 100%;
}

body.home #main-content .wrapper>table tbody,
body.home #main-content .wrapper>table tr,
body.home #main-content .wrapper>table td {
	display: contents;
}

body.home #main-content .wrapper>table:first-of-type h2 {
	display: inline-block;
	vertical-align: middle;
	margin: 0;
	line-height: 1;
}

body.home #main-content .wrapper>table td:first-child,
body.home #main-content .wrapper>table td:last-child {
	display: inline-block;
	font-weight: var(--weight-medium);
	color: var(--color-text);
	margin: 0;
}

body.home #main-content .wrapper>table td:first-child {
	justify-self: end;
	align-self: start;
	padding: 0px 20px 0 0;
}

.home #main-content .wrapper>table td:last-child {
	justify-self: start;
	align-self: end;
	padding: 0 0 0px 20px;
}

body.home #main-content .wrapper>table td:nth-child(2) h2 {
	justify-self: end;
	margin-right: 30px;
	position: relative;
}

body.home #main-content .wrapper>table td:nth-child(3) h2 {
	justify-self: start;
	margin-left: 30px;
}

body.home #main-content .wrapper>table td:nth-child(2) h2::after {
	content: "";
	position: absolute;
	right: -30px;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 47px;
	background-color: var(--color-border-grey);
}

body.home #main-content .wrapper img {
	display: block;
	width: 100%;
	max-width: var(--max-width);
	aspect-ratio: 1400 / 400;
	border-radius: 30px;
	margin: 55px auto -7.5rem auto;
	object-fit: cover;
}

/*  ###############################################
	HOME PAGE CORE BUSINESS
	###############################################  */

#business .section-header {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin-bottom: 2rem;
	width: 100%;
}

#business .header-title {
	flex: 0 0 auto;
}

#business .section-header .header-title>p {
	margin: 0 0 -8px 0;
	font-size: var(--h4-font-size);
}

#business .header-title h1 {
	color: var(--color-dark-red);
	margin: 0;
}

#business .header-divider {
	flex: 0 0 1px;
	height: 70px;
	background-color: var(--color-border-grey);
	margin: 0 40px;
}

#business .header-bullet-points {
	flex: 1 1 auto;
}

ul {
	padding: 0px;
}

ul>li {
	padding: 0px 0px 0.8rem 0.5rem;
	position: relative;
}

body.inner:not(.sitemap) .wrapper:not(#header-container .wrapper):not(#career-list .wrapper) ul {
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}

body.inner:not(.sitemap) .wrapper:not(#header-container .wrapper):not(#career-list .wrapper):not(.project-detail .wrapper) ul li {
	position: relative;
	margin-left: 0;
	padding-left: 28px;
	font-weight: var(--weight-medium);
	font-size: 1rem;
	color: var(--color-text);
}

body.inner #core-business .wrapper ul li {
	font-weight: var(--weight-regular) !important;
}

body.inner:not(.sitemap) .wrapper:not(#header-container .wrapper):not(#career-list .wrapper):not(.project-detail .wrapper) ul li::before,
#business .header-bullet-points ul li::before {
	content: "";
	position: absolute;
	background-image: url("themes/green-tick.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

body.inner:not(.sitemap) .wrapper:not(#header-container .wrapper):not(#career-list .wrapper):not(.project-detail .wrapper) ul li::before,
#business .header-bullet-points ul li::before {
	left: 0;
	top: 0;
	width: 1.125rem;
	height: 1.125rem;
}

/*  ###############################################
	HOME PAGE CORE BUSINESS
	###############################################  */
#business .header-bullet-points ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

#business .header-bullet-points ul li {
	position: relative;
	padding: 0 0 0 32px;
	margin: 0;
	font-size: 1rem;
	font-weight: var(--weight-medium);
}

.home-business-list {
	display: flex;
	flex-direction: column;
	gap: 4rem;
	width: 100%;
}

@keyframes panRight {
	0% {
		transform: translate3d(-5%, 0, 0);
	}
	100% {
		transform: translate3d(5%, 0, 0);
	}
}

@keyframes panLeft {
	0% {
		transform: translate3d(5%, 0, 0);
	}
	100% {
		transform: translate3d(-5%, 0, 0);
	}
}

.home-business-card {
	position: relative;
	width: 100%;
	height: 650px;
	border-radius: 40px;
	background-size: cover;
	background-position: center;
	overflow: hidden;
}

.home-business-card::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -10%;
	width: 120%;
	background-image: inherit;
	background-size: cover;
	z-index: 0;
	will-change: transform;
}

.home-business-card.card-left::before {
	background-position: left center;
	animation: panRight 20s ease-in-out infinite alternate;
}

.home-business-card.card-right::before {
	background-position: right center;
	animation: panLeft 20s ease-in-out infinite alternate;
}

.home-business-card .card-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 40px 50px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	z-index: 1;
}

.card-left {
	margin-left: calc((100% - 100vw) / 2);
	width: calc((100vw + 100%) / 2);
	border-radius: 0px 40px 40px 0px;
	height: 650px;
}

.home-business-card.card-left {
	margin-left: calc((100% - 100vw) / 2);
	width: calc((100vw + 100%) / 2);
	border-radius: 0px 40px 40px 0px;
	background-position: left center;
}

.home-business-card.card-right {
	margin-right: calc((100% - 100vw) / 2);
	width: calc((100vw + 100%) / 2);
	border-radius: 40px 0px 0px 40px;
	background-position: right center;
}

.home-business-card.card-left .card-overlay {
	justify-content: flex-end;
	padding-left: calc((100vw - 100%) / 2 + 50px);
	padding-right: 50px;
}

.home-business-card.card-right .card-overlay {
	justify-content: flex-start;
	padding-left: 50px;
	padding-right: calc((100vw - 100%) / 2 + 50px);
}

.home-business-card .card-content {
	background: rgba(255, 255, 255, 0.75);
	border-radius: 20px;
	padding: 0 50px;
	width: 620px;
	height: 550px;
	box-sizing: border-box;
	text-align: left;
	display: flex;
	flex-direction: column;
	justify-content: center;
	transition: transform 0.4s var(--ease-out);
	will-change: transform;
}

.home-business-card .card-content:hover,
body.js-active.home .home-business-list.revealed .home-business-card .card-content:hover {
	transform: translate3d(0, -10px, 0);
}

.home-business-card .card-title {
	font-size: var(--font-size-title);
	font-weight: var(--weight-semibold);
	text-transform: uppercase;
	margin: 0;
	line-height: 1;
}

.home-business-card .card-desc {
	font-size: var(--h4-font-size);
	margin-bottom: 40px;
}

.home-business-card .browse {
	align-self: flex-start;
}

/*  ###############################################
	COLLABORATE WITH US & JOIN OUR TEAM GRID
	###############################################  */
.engagement {
	display: flex;
	width: 100%;
	min-height: 480px;
	flex-wrap: wrap;
}

.engagement-card {
	flex: 1 1 50%;
	min-width: 320px;
	position: relative;
	background-size: 0 0 !important;
	display: flex;
	align-items: center;
	padding: 6rem 0;
	box-sizing: border-box;
	overflow: hidden;
}

.engagement-card::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -10%;
	width: 120%;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 0;
	will-change: transform;
}

.collaborate-card {
	justify-content: flex-start;
	padding-left: max(40px, calc((100vw - var(--max-width)) / 2));
	padding-right: 80px;
}

.collaborate-card::before {
	animation: panRight 20s ease-in-out infinite alternate;
}

.join-card {
	justify-content: flex-start;
	padding-left: 80px;
	padding-right: max(40px, calc((100vw - var(--max-width)) / 2));
}

.join-card::before {
	animation: panLeft 20s ease-in-out infinite alternate;
}

.engagement-content {
	max-width: 620px;
	text-align: left;
	color: var(--color-white);
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
	transition: transform 0.4s var(--ease-out);
	will-change: transform;
}

.engagement-card:hover .engagement-content,
body.js-active .engagement.revealed .engagement-card:hover .engagement-content {
	transform: translate3d(0, -10px, 0);
}

.engagement-content h1 {
	color: var(--color-white) !important;
	text-transform: uppercase;
	margin: 0;
	letter-spacing: 1px;
}

.engagement-content p {
	color: var(--color-white);
	line-height: 1.25;
	margin-bottom: 48px;
	text-transform: none;
}

/*  #######################################
    TAB MENUS
    #######################################   */
.tab-menu {
	padding: 0px 30px 2rem 30px !important;
	display: flex;
	justify-content: center;
	gap: 15px;
	margin-top: 2rem;
}

.tab-menu>div {
	flex: none;
	text-align: center;
	background-color: transparent;
	font-size: 0.9rem;
	border: solid 1.5px var(--color-orange);
	border-radius: 2rem !important;
	transition: all 0.3s ease;
	display: flex;
	justify-content: center;
	align-items: center;
}

.tab-menu>div a {
	font-weight: 600;
	padding: 10px 2rem;
	color: var(--color-orange);
	text-transform: uppercase;
	line-height: 1;
	display: inline-block;
}

.tab-menu>div:hover,
.tab-menu>div.active {
	background-color: var(--color-orange);
	box-shadow: none;
}

.tab-menu>div.active a,
.tab-menu>div:hover a {
	color: var(--color-white) !important;
}

.tab-menu .cat {
	display: inline-block;
	display: inline;
	zoom: 1;
	margin: 0px 10px;
	font-size: 18px;
	color: var(--color-white);
	font-weight: bold;
	text-decoration: none;
	line-height: 35px;
	cursor: pointer;
	border-color: var(--color-orange);
}

/*  ###############################################
	PAGE HEADER (INNER BANNER CONTENT)
	###############################################  */
.page-header {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	max-width: var(--max-width);
	height: 100%;
	z-index: 110;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	text-align: center;
	box-sizing: border-box;
	padding-bottom: 47px;
	padding-left: 40px;
	padding-right: 40px;
	pointer-events: none;
}

.page-header .breadcrumb,
.page-header .breadcrumb * {
	pointer-events: auto !important;
}

.page-header .parent-title {
	display: block;
	text-transform: capitalize;
	color: var(--color-white);
	margin-bottom: 5px;
}

.page-header h1 {
	color: var(--color-white);
	margin-top: 0;
	margin-bottom: 5px;
	line-height: 1;
}

/*  ###############################################
	BREADCRUMB
	###############################################  */
.breadcrumb .wrapper {
	padding: 0 !important;
	max-width: none;
	margin: 0;
	text-align: center;
}

.breadcrumb a,
.breadcrumb-current {
	display: inline;
	margin: 0;
	padding: 0;
	text-decoration: none;
	font-weight: var(--weight-medium);
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	color: var(--color-white);
	transition: color 0.3s ease;
	word-wrap: break-word;
}

.breadcrumb a {
	color: var(--color-white);
	white-space: nowrap;
}

.breadcrumb a:hover {
	color: var(--color-dark-red);
}

.breadcrumb-current {
	color: var(--color-white);
}

.breadcrumb-separator {
	display: inline-block;
	vertical-align: middle;
	width: 1.25rem;
	height: 10px;
	margin: 0 6px;
	color: transparent;
	background-image: url(themes/breadcrumb-arrow.png);
	white-space: nowrap;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transform: none;
}

ol {
	padding-left: 1.5rem;
	margin-top: 1rem;
}

ol>li {
	padding-left: 1rem;
}

ul>li:last-child,
ol>li:last-child {
	padding-bottom: 0px;
}

ol>li {
	padding: 0px 0px 1rem 1rem;
	margin-left: 0px;
}

select {
	color: var(--color-text);
	padding: 20px 1.5rem;
	border: solid 1px var(--color-btn-gold);
	font-family: var(--font-bebas-neue);
	margin: 0px;
	position: relative;
	background-color: transparent;
}

textarea {
	color: var(--color-text);
	padding: 20px 1.5rem;
	border: solid 1px var(--color-btn-gold);
	font-family: var(--font-bebas-neue);
	margin: 0px;
	position: relative;
	background-color: transparent;
}

table:not(.tbContactform) {
	max-width: 100%;
	width: 100%;
	border-collapse: collapse;
	display: block;
}

table:not(.tbContactform) tbody {
	display: block;
	width: 100%;
}

table:not(.tbContactform) td {
	width: auto !important;
}


/*  ###############################################
	TAB NAV SECTION
	###############################################  */
.tab-nav {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-bottom: 10px;
	flex-wrap: wrap;
}

.tab-nav::after {
	content: "";
	flex: 1;
	height: 1px;
	background-color: var(--color-orange);
}

.tab-btn {
	background: transparent;
	border: 2px solid var(--color-orange);
	padding: 12px 25px;
	border-radius: 30px;
	color: var(--color-dark-green);
	font-size: var(--font-size-sm);
	font-weight: var(--weight-semibold);
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.3s ease,
		color 0.3s ease,
		transform 0.3s var(--ease-out);
	outline: none;
	display: inline-block;
	text-decoration: none;
}

.tab-btn:hover {
	background-color: rgba(239, 134, 57, 0.1);
	color: var(--color-orange);
	transform: translateY(-2px);
}

.tab-btn.active {
	background-color: var(--color-orange);
	color: var(--color-white);
	border-color: var(--color-orange);
}

.tab-content {
	display: none;
	animation: fadeIn 0.4s ease;
}

.tab-content.active {
	display: block;
}

@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/*  ###############################################
	ABOUT US, COMPANY INFO, & TIMELINE
	###############################################  */
body.about-us #company-tab .tab-nav:has([data-tab="company-info"].active) {
	margin-bottom: 2.75rem;
}

body.about-us #company-tab .tab-nav:has([data-tab="vision-mission"].active) {
	margin-bottom: 3.125rem;
}

body.about-us #company-tab .tab-nav:has([data-tab="milestone"].active) {
	margin-bottom: 3.0625rem;
}

body.about-us #company-info table tr {
	display: grid;
	grid-template-columns: 1.4fr 1.5fr 1.3fr 1fr;
	gap: 60px;
	padding: 35px 0;
	border-bottom: 1px solid var(--color-border-grey);
	text-align: left;
}

body.about-us #company-info table tr:first-child {
	padding-top: 0 !important;
}

body.about-us #company-info table tr:last-child {
	border-bottom: none;
	padding-bottom: 0 !important;
}

body.about-us #company-info table td {
	min-width: 0;
	display: block;
	padding: 0;
}

body.about-us #company-info table tr>td:first-child:nth-last-child(2)~td:last-child {
	grid-column: span 3;
}

body.about-us #company-info table td h4 {
	color: var(--color-orange);
	font-weight: var(--weight-medium);
	text-transform: uppercase;
	margin: 0;
}

body.about-us #company-info table td p {
	font-size: 1rem;
	line-height: 1.2;
	color: var(--color-text);
	margin: 0;
}

body.about-us #company-info table td ol {
	padding-left: 16px;
	padding-top: 2px;
	margin: 0;
}

body.about-us #company-info table td ol li {
	padding: 0 0 0 15px;
	margin: 0;
}

body.about-us #company-info table td ol li:last-child {
	padding-bottom: 0;
}

/*  ###############################################
	 VISION & MISSION BANNER
	###############################################  */
.vm-banner {
	position: relative;
	background-size: cover;
	background-position: 150% 60%;
	background-repeat: no-repeat;
	border-radius: 0 40px 40px 0;
	margin-top: 30px;
	height: 600px;
	overflow: hidden;
	box-sizing: border-box;
	margin-left: calc((100% - 100vw) / 2);
	width: calc((100vw + 100%) / 2);
	padding: 25px 60px 50px calc((100vw - 100%) / 2);
	display: block;
	color: var(--color-white);
	z-index: 1;
}

body.about-us #vision-mission .vm-banner table {
	height: 100%;
	position: relative;
	z-index: 2;
}

body.about-us #vision-mission .vm-banner tbody {
	height: 100%;
}

body.about-us #vision-mission .vm-banner table tr {
	display: grid;
	grid-template-columns: 0.7fr 160px 2fr;
	height: 100%;
	align-items: center;
}

.vm-banner-overlay,
.vm-banner::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.45);
	z-index: 1;
}

body.about-us #vision-mission .vm-banner table tr::after,
.vm-banner::after {
	content: "";
	grid-column: 2;
	grid-row: 1;
	width: 1px;
	background-color: var(--color-white);
	z-index: 2;
	justify-self: center;
	align-self: stretch;
	margin-top: var(--vm-banner-line-margin-top, 85px) !important;
	margin-bottom: var(--vm-banner-line-margin-bottom, 75px) !important;
}

body.about-us #vision-mission .vm-banner table td:first-child {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	text-align: left;
	grid-column: 1;
	grid-row: 1;
}

body.about-us #vision-mission .vm-banner table td:first-child p {
	color: var(--color-white);
	margin: 0;
}

body.about-us #vision-mission .vm-banner table td:first-child p:first-of-type,
body.about-us #vision-mission .vm-banner table td:first-child p:last-of-type {
	font-size: 1.25rem;
}


body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(2),
body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(3) {
	font-size: 9.375rem;
	font-weight: var(--weight-bold);
	line-height: 1;
}

body.about-us #vision-mission .vm-banner table td:first-child hr {
	height: 1px;
	background-color: var(--color-white);
	width: 260px;
	border: none;
	margin: 0;
}

body.about-us #vision-mission .vm-banner table td:last-child {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: left;
	grid-column: 3;
	grid-row: 1;
}

body.about-us #vision-mission .vm-banner table td:last-child h1:nth-of-type(2) {
	margin-top: 70px;
}

body.about-us #vision-mission .vm-banner table td:last-child h1,
body.about-us #vision-mission .vm-banner table td:last-child h3,
body.about-us #vision-mission .vm-banner table td:last-child h4 {
	color: var(--color-white);
}

body.about-us #vision-mission .vm-banner table td:last-child h1 {
	margin: 0;
	padding: 0;
}

body.about-us #vision-mission .vm-banner table td:last-child h3,
body.about-us #vision-mission .vm-banner table td:last-child h4 {
	margin: 0;
}

body.about-us #vision-mission .vm-banner table td:last-child h3 {
	font-weight: var(--weight-medium);
}

body.about-us #vision-mission .vm-banner table td:last-child h4 {
	font-weight: var(--weight-regular);
}

body.about-us #vision-mission>h1 {
	margin-top: 100px;
	text-align: center;
	color: var(--color-dark-red) !important;
	text-transform: uppercase;
	margin-bottom: -10px;
	display: block;
}

body.about-us #vision-mission>p {
	text-align: center;
	margin-bottom: 2.875rem;
}

body.about-us #vision-mission>table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	box-sizing: border-box !important;
}

body.about-us #vision-mission>table>tbody {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 40px;
	box-sizing: border-box !important;
}

body.about-us #vision-mission>table>tbody>tr {
	display: contents;
}

body.about-us #vision-mission>table td {
	position: relative;
	background-color: var(--color-dark-green);
	border-radius: 20px;
	padding: 50px 50px 50px 65px;
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto auto;
	column-gap: 35px;
	align-items: center;
	text-align: left;
	transition: transform 0.3s ease;
	box-sizing: border-box !important;
}

body.about-us #vision-mission>table td::after {
	content: "";
	position: absolute;
	top: 1px;
	bottom: 1px;
	right: 1px;
	left: 20px;
	background-color: var(--color-white);
	border-radius: 20px;
	z-index: 1;
}

body.about-us #vision-mission>table td:hover,
body.js-active.about-us #vision-mission > table.revealed td:hover {
	transform: translate3d(0, -8px, 0);
	transition: transform 0.3s var(--ease-out);
	transition-delay: 0s !important;
}

body.about-us #vision-mission>table td>h1:first-of-type {
	position: relative;
	z-index: 2;
	font-size: 160px;
	color: var(--color-dark-red);
	margin: 0;
	line-height: 1;
	grid-column: 1;
	grid-row: 1 / span 2;
}

body.about-us #vision-mission>table td>h1:last-of-type {
	position: relative;
	z-index: 2;
	margin: 0;
	text-transform: uppercase;
	grid-column: 2;
	grid-row: 1;
	align-self: end;
}

body.about-us #vision-mission>table tr:first-child td:first-child>h1:last-of-type,
body.about-us #vision-mission>table tr:last-child td:last-child>h1:last-of-type {
	margin-top: -1.25rem;
}

body.about-us #vision-mission>table tr:first-child td:last-child>h1:last-of-type,
body.about-us #vision-mission>table tr:last-child td:first-child>h1:last-of-type {
	margin-top: -2.5rem;
}

body.about-us #vision-mission>table td>p {
	position: relative;
	z-index: 2;
	margin: 0;
	grid-column: 2;
	grid-row: 2;
	align-self: start;
}

/*  ###############################################
	 Milestone Timeline Slider Section
	###############################################  */
.milestone-section {
	position: relative;
	width: 100%;
	overflow: hidden;
}

.timeline-dates-capsule {
	box-sizing: border-box;
	background-color: var(--color-light-grey);
	border-radius: 50px;
	padding: 20px 40px;
	margin: 0 30px 15px 30px;
	position: relative;
	width: calc(100% - 60px);
}

.timeline-nav-scroll {
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	width: 100%;
}

.timeline-nav-items {
	box-sizing: border-box;
	position: relative;
	display: flex;
	justify-content: flex-start !important;
	align-items: center;
	z-index: 2;
	width: max-content !important;
	padding: 0;
	gap: 40px;
	flex-wrap: nowrap;
}

.timeline-nav-item {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	cursor: pointer;
	text-align: center;
	user-select: none;
	color: var(--color-dark-green);
	padding: 0 10px;
	flex-shrink: 0;
	transition: color 0.3s ease, transform 0.3s var(--ease-out);
	will-change: transform;
}

.timeline-nav-item:not(.active):hover {
	color: var(--color-orange);
	transform: scale(1.08);
}

.timeline-nav-item .month {
	color: inherit;
	text-transform: uppercase;
	margin: 0 0 -5px 0;
}

.timeline-nav-item .year {
	color: inherit;
	margin: 0;
}

.timeline-nav-item.active {
	color: var(--color-orange);
}

.timeline-nav-item.active .month {
	font-size: 37px;
}

.timeline-nav-item.active .year {
	font-size: var(--font-size-title);
}

.timeline-bar-wrapper {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	width: 100%;
	margin-bottom: 40px;
}

.timeline-bar-container {
	flex: 1;
	height: 20px;
	position: relative;
	border-radius: 10px;
	margin: 0 7px;
}

.timeline-nav-arrow {
	background: none;
	border: none;
	width: 25px;
	height: 40px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0;
	user-select: none;
	z-index: 10;
	transition: transform 0.2s ease;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
}

.timeline-nav-arrow::before,
.timeline-nav-arrow::after {
	content: '';
	position: absolute;
	width: 24px;
	height: 2.75px;
	background-color: var(--color-orange);
	border-radius: 1.5px;
	transition: background-color 0.2s ease;
}

.prev-btn::before {
	left: 2px;
	top: calc(50% - 1.375px);
	transform: rotate(-45deg);
	transform-origin: 1.375px 1.375px;
}

.prev-btn::after {
	left: 2px;
	top: calc(50% - 1.375px);
	transform: rotate(45deg);
	transform-origin: 1.375px 1.375px;
}

.next-btn::before {
	right: 2px;
	top: calc(50% - 1.375px);
	transform: rotate(45deg);
	transform-origin: 22.625px 1.375px;
}

.next-btn::after {
	right: 2px;
	top: calc(50% - 1.375px);
	transform: rotate(-45deg);
	transform-origin: 22.625px 1.375px;
}

.timeline-nav-arrow:hover {
	transform: scale(1.2);
}

.timeline-nav-line {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 100%;
	background-color: var(--color-dark-green);
	border-radius: 10px;
	z-index: 1;
	pointer-events: none;
}

.timeline-nav-progress {
	display: none !important;
}

.timeline-nav-handle {
	position: absolute;
	top: 50%;
	left: 0;
	width: 14px;
	height: 14px;
	background-color: var(--color-orange);
	border: 5px solid var(--color-white);
	border-radius: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
	transition: left 0.5s ease;
	pointer-events: none;
}

.milestone-slider-container {
	position: relative;
	width: calc(100% - 64px);
	margin-left: 32px;
	padding: 30px 0 20px 0;
	margin-top: -30px;
	overflow: hidden;
}

.milestone-slider-track {
	display: flex;
	gap: 50px;
	transition: transform 0.3s var(--ease-out);
	will-change: transform;
}

.milestone-card {
	cursor: pointer;
	box-sizing: border-box;
	flex: 0 0 calc((100% - 100px) / 3);
	height: auto;
	display: flex;
	flex-direction: column;
	overflow: visible;
	opacity: 1;
	position: relative;
	background: transparent;
	border: none;
	box-shadow: none;
	transition: transform 0.3s var(--ease-out);
	will-change: transform;
}

.milestone-card:not(.active-card):hover {
	transform: translateY(-5px);
}

.milestone-card-arrow {
	position: absolute;
	top: -24px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-left: 23px solid transparent;
	border-right: 23px solid transparent;
	border-bottom: 35px solid var(--color-orange);
	opacity: 0;
	transition: opacity 0.3s ease;
	z-index: 10;
}

.milestone-card.active-card {
	cursor: default;
}

.milestone-card.active-card .milestone-card-arrow {
	opacity: 1;
}

.milestone-card-header {
	box-sizing: border-box;
	min-height: 60px;
	height: auto;
	background-color: var(--color-dark-green);
	color: var(--color-white);
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 15px 20px 35px 20px;
	font-size: var(--h4-font-size);
	font-weight: var(--weight-semibold);
	border-radius: 20px 20px 0 0;
	position: relative;
	z-index: 1;
}

.milestone-card.active-card .milestone-card-header {
	background-color: var(--color-orange);
}

.milestone-card.hidden-card {
	display: none !important;
}

.milestone-card-body {
	box-sizing: border-box;
	flex: 1;
	height: auto;
	padding: 20px 25px;
	background-color: var(--color-light-grey);
	border: 1px solid var(--color-dark-green);
	border-bottom: 5px solid var(--color-dark-green);
	border-radius: 20px;
	display: flex;
	flex-direction: column;
	gap: 15px;
	margin-top: -20px;
	position: relative;
	z-index: 2;
}

.milestone-card.active-card .milestone-card-body {
	border-color: var(--color-orange);
	box-shadow: 0 8px 25px rgba(228, 91, 35, 0.15);
}

.milestone-card-body h4 {
	color: var(--color-dark-green);
	margin: 0;
}

.milestone-card-body p {
	margin: 0;
}

/*  ###############################################
	LEADER SECTION
	###############################################  */
.leader-section {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	box-sizing: border-box;
}

.leader-tabs-container {
	position: relative;
	margin-bottom: 70px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}

.leader-tabs-line {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 1px;
	background-color: var(--color-orange);
	z-index: 1;
	transform: translateY(-50%);
}

.tab-nav.leader-tabs {
	position: relative;
	z-index: 2;
	background-color: var(--color-white);
	padding: 0 20px !important;
	margin-top: 0;
	margin-bottom: 0;
	justify-content: center;
}

.tab-nav.leader-tabs::after {
	display: none;
}

.leader-tab-content {
	display: none;
	opacity: 0;
	transition: opacity 0.5s ease;
}

.leader-tab-content.active {
	display: block;
	opacity: 1;
}

.directors-tier {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
	width: 100%;
}

.directors-tier.tier-1 {
	margin-bottom: 50px;
}

.directors-tier.tier-2 {
	gap: 50px 80px;
	max-width: 1100px;
	margin: 0 auto;
}

.director-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	position: relative;
	width: 300px;
}

.director-image-wrapper {
	border-radius: 50%;
	overflow: hidden;
	position: relative;
	background-color: var(--color-white);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.chairman-card .director-image-wrapper {
	width: 300px;
	height: 300px;
	border: 3px solid var(--color-dark-green);
}

.bod-card .director-image-wrapper {
	width: 300px;
	height: 300px;
	border: 3px solid var(--color-orange);
}

.director-image-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.director-name-badge {
	position: relative;
	z-index: 2;
	margin-top: -24px;
	padding: 10px 24px;
	border-radius: 0 29px 0 29px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	width: 300px;
	max-width: 100%;
	box-sizing: border-box;
}

.chairman-card .director-name-badge {
	background-color: var(--color-dark-green);
	color: var(--color-white);
}

.bod-card .director-name-badge {
	background-color: var(--color-orange);
	color: var(--color-white);
}

.director-name-badge span {
	font-size: var(--font-size-sm);
	font-weight: var(--weight-medium);
	line-height: 1.3;
	text-align: center;
	text-transform: uppercase;
}

.director-position {
	margin: 12px 0 0 0;
}

.org-structure-container {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 20px;
	background-color: var(--color-white);
	border-radius: 20px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
}

.org-structure-img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 10px;
}

/*  ###############################################
	BUSINESS
	###############################################  */
.core-business-list {
	width: 100%;
}

.business-section {
	margin-bottom: 7.5625rem;
	width: 100%;
	display: flex;
	flex-direction: column;
}

.business-section:last-child {
	margin-bottom: 0px;
}

.business-section:nth-child(odd) .business-banner {
	margin-left: calc((100% - 100vw) / 2);
	width: calc((100vw + 100%) / 2);
}

.business-section:nth-child(odd) .business-banner img {
	border-radius: 0px 40px 40px 0px;
	object-position: left;
}

.business-section:nth-child(even) .business-banner {
	margin-right: calc((100% - 100vw) / 2);
	width: calc((100vw + 100%) / 2);
}

.business-section:nth-child(even) .business-banner img {
	border-radius: 40px 0px 0px 40px;
	object-position: right;
}

.business-banner {
	width: 100%;
	margin-bottom: 50px;
}

.business-banner img {
	width: 100%;
	max-width: 100%;
	height: 650px;
	object-fit: cover;
	position: static;
	transform: none;
	margin: 0;
	display: block;
}

.business-details {
	text-align: left;
}

.business-details>p:first-of-type {
	font-size: var(--h4-font-size);
}


.business-subtitle {
	margin-bottom: 5px;
}

.business-title {
	text-transform: uppercase;
	color: var(--color-dark-red);
	margin: -20px 0 10px 0;
	line-height: 1;
}

.business-desc {
	line-height: 1.2;
}

.business-desc p {
	margin-bottom: 10px;
}

/*  ###############################################
	Project Banner
	###############################################  */
body.residential #highlight,
body.careers #banner {
	position: relative;
	height: 650px;
	overflow: hidden;
}

body.residential #highlight .wrapper,
body.careers #banner .wrapper {
	position: relative;
	height: 100%;
	padding: 0 !important;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: 25px;
}

body.residential #highlight .wrapper img,
body.careers #banner .wrapper img {
	position: absolute;
	top: 0;
	left: calc((100% - 100vw) / 2);
	width: calc((100vw + 100%) / 2) !important;
	max-width: none !important;
	height: 650px;
	object-fit: cover;
	border-radius: 0px 40px 40px 0px;
	z-index: 0;
}

body.residential #highlight .wrapper img {
	object-position: left 3%;
}

body.careers #banner .wrapper img {
	object-position: center 31%;
}

body.residential #highlight .wrapper>p:has(img),
body.careers #banner .wrapper>p:has(img) {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	pointer-events: none;
	z-index: 0;
}

body.residential #highlight .wrapper::after {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 90px;
	width: 620px;
	height: 550px;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 20px;
	z-index: 1;
}

body.residential #highlight .wrapper>h3,
body.residential #highlight .wrapper>ul,
body.residential #highlight .wrapper>p:has(a) {
	position: relative;
	margin-left: calc(100% - 670px) !important;
	z-index: 2;
}

body.residential #highlight .wrapper>h3,
body.residential #highlight .wrapper>ul,
body.residential #highlight .wrapper>p:has(a) {
	width: 540px;
}

body.residential #highlight .wrapper>h3 {
	font-size: var(--font-size-title);
	font-weight: var(--weight-semibold);
	text-transform: none;
	margin-top: 0;
	margin-bottom: 0;
	color: var(--color-dark-red);
}

body.residential #highlight .wrapper>ul {
	margin-top: 0;
	margin-bottom: 0.9375rem;
	padding-left: 20px;
}

body.residential #highlight .wrapper>p:has(a) {
	margin: 0;
}

body.residential #highlight .wrapper a {
	display: inline-block;
	text-align: left;
	width: auto;
}

/*  ##############################################
	PROJECTS 
	############################################## */
.project-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-top: 50px;
	width: 100%;
}

.project-grid-card,
.homepage-project-card {
	display: flex;
	flex-direction: column;
	border-radius: 20px;
	overflow: hidden;
	box-sizing: border-box;
	color: inherit !important;
	text-decoration: none !important;
}

.project-grid-card {
	width: calc(33.333% - 30px);
	background: var(--color-white);
	border: solid 1px var(--color-border-grey);
	transition: transform 0.4s var(--ease-out),
		box-shadow 0.4s var(--ease-out),
		border-color 0.3s ease;
	will-change: transform;
}

.project-grid-card:hover {
	border-color: var(--color-orange);
	transform: translateY(-6px);
	box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}

.project-grid-card .image,
.homepage-project-card .image {
	overflow: hidden;
	position: relative;
	width: 100%;
}

.project-grid-card .image img,
.homepage-project-card .image img {
	width: 100%;
	display: block;
	height: 300px !important;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.project-grid-card:hover .image img,
.homepage-project-card:hover .image img {
	transform: scale(1.05);
}

.project-grid-card .info,
.homepage-project-card .info {
	padding: 20px 30px 30px 30px;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	text-align: left;
}

.project-grid-card .title,
.homepage-project-card .title {
	margin: 0 0 5px 0;
	text-transform: uppercase;
	font-weight: var(--weight-semibold);
}

.project-grid-card .meta,
.homepage-project-card .meta {
	margin-bottom: 15px;
	flex-grow: 1;
}

.project-grid-card .footer-row,
.homepage-project-card .footer-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.project-grid-card .badge,
.homepage-project-card .badge,
.newsevent-badge,
.h-newsevent-badge {
	background-color: var(--color-orange);
	color: var(--color-white);
	padding: 4px 20px;
	border-radius: 0 29px 0 29px;
	font-size: var(--font-size-sm);
	font-weight: var(--weight-medium);
	text-transform: uppercase;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	line-height: 1;
}

/*  ###########################################################
	HOMEPAGE KEY PROJECTS 
	########################################################### */
#business {
	border-bottom: none !important;
	box-shadow: none !important;
}

.homepage-projects-section {
	border-top: none !important;
	box-shadow: none !important;
	background-size: 0 0 !important;
	position: relative;
	color: var(--color-white);
	overflow: hidden;
}

@keyframes panProjectsRight {
	0% {
		transform: scaleX(1.2) translate3d(-5%, 0, 0);
	}
	100% {
		transform: scaleX(1.2) translate3d(5%, 0, 0);
	}
}

.homepage-projects-section::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: inherit;
	background-size: cover;
	background-position: left 80%;
	z-index: 0;
	will-change: transform;
	animation: panProjectsRight 20s ease-in-out infinite alternate;
}

.homepage-projects-section .wrapper {
	position: relative;
	z-index: 1;
}
.homepage-projects-header {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: start;
	gap: 40px;
	margin-bottom: 50px;
	text-align: left;
}

.homepage-projects-title {
	color: var(--color-white) !important;
	margin: -9px 0 0 0;
	white-space: nowrap;
}

.homepage-projects-desc {
	color: var(--color-white) !important;
	font-weight: var(--weight-regular);
	margin: 0 0 0 15px;
}

.homepage-projects-action {
	justify-self: end;
}

.homepage-project-card-wrapper {
	display: flex;
	width: 100%;
}

.homepage-project-card {
	border: 1px solid var(--color-white);
	color: var(--color-white);
	margin: 10px;
	flex: 1;
	transition: transform 0.4s var(--ease-out), 
	            box-shadow 0.4s var(--ease-out), 
	            background-color 0.4s var(--ease-out), 
	            border-color 0.4s var(--ease-out), 
	            color 0.4s var(--ease-out) !important;
	will-change: transform, box-shadow;
}

.homepage-project-card .title,
.homepage-project-card .meta {
	color: var(--color-white);
	transition: color 0.4s var(--ease-out) !important;
}

.homepage-project-card:hover {
	background: var(--color-white);
	border-color: var(--color-white);
	color: var(--color-text);
	transform: translate3d(0, -10px, 0);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
	text-decoration: none !important;
}

.homepage-project-card.active {
	background: var(--color-white);
	border-color: var(--color-white);
	color: var(--color-text);
}

.homepage-project-card:hover .title,
.homepage-project-card.active .title {
	color: var(--color-dark-red);
}

.homepage-project-card:hover .meta,
.homepage-project-card.active .meta {
	color: var(--color-text);
}

.homepage-projects-slider-container {
	position: relative;
	width: 100%;
}

.homepage-projects-slider {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	margin-left: -10px;
	margin-right: -10px;
}

.homepage-projects-slider.slick-initialized {
	display: block;
}

.homepage-projects-slider.slick-initialized .slick-track {
	display: flex !important;
	transition: none;
}

.homepage-projects-slider.slick-initialized .slick-slide {
	height: auto !important;
	display: flex !important;
}

.homepage-projects-slider.slick-initialized .slick-slide>div {
	display: flex;
	width: 100%;
}


.homepage-projects-slider-container .slider-arrow {
	position: absolute;
	top: auto;
	bottom: -15px;
	background: transparent;
	border: none;
	color: transparent;
	font-size: 0;
	width: 40px;
	height: 40px;
	cursor: pointer;
	z-index: 10;
	transition: opacity 0.3s ease;
	opacity: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}

.homepage-projects-slider-container .slider-arrow::before {
	content: '';
	display: inline-block;
	width: 18px;
	height: 33px;
	background-color: var(--color-white);
	-webkit-mask-image: url("themes/right-arrow-white.png");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-image: url("themes/right-arrow-white.png");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	transition: background-color 0.3s ease;
}

.homepage-projects-slider-container .slider-arrow:hover::before {
	background-color: var(--color-orange);
}

.homepage-projects-slider-container .prev-arrow {
	left: -10px;
}

.homepage-projects-slider-container .prev-arrow::before {
	transform: scaleX(-1);
}

.homepage-projects-slider-container .next-arrow {
	right: -10px;
}

.homepage-projects-slider-container .next-arrow::before {
	transform: none;
}

.homepage-projects-slider-container .slick-dots {
	position: static;
	display: flex !important;
	justify-content: center;
	align-items: center;
	gap: 15px;
	margin-top: 40px;
	padding: 0;
	list-style: none;
}

.homepage-projects-slider-container .slick-dots li {
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.homepage-projects-slider-container .slick-dots li button {
	font-size: 0;
	line-height: 0;
	display: block;
	width: 12px;
	height: 12px;
	padding: 0;
	cursor: pointer;
	border-radius: 50%;
	border: none;
	background-color: var(--color-white);
	opacity: 1;
	transition: all 0.3s ease;
}

.homepage-projects-slider-container .slick-dots li.slick-active button {
	position: relative;
	background-color: var(--color-orange);
}

.homepage-projects-slider-container .slick-dots li.slick-active button::after {
	content: '';
	position: absolute;
	top: -5px;
	left: -5px;
	right: -5px;
	bottom: -5px;
	border: 2px solid var(--color-orange);
	border-radius: 50%;
}


/*  ###############################################
	PROJECT DETAILS PAGE
	###############################################  */
.project-detail-container {
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
}

.project-header-section {
	margin-bottom: 2.5rem;
	text-align: left;
}

.project-detail #main-content .wrapper ul li {
	position: relative !important;
	padding-left: 20px !important;
	margin-bottom: -5px !important;
}

.project-detail #main-content .wrapper ul li::before,
.accordion-body ul li::before {
	content: "•" !important;
	color: var(--color-orange) !important;
	background-image: none !important;
	position: absolute !important;
	font-size: 1.5rem !important;
	line-height: 1 !important;
	left: 0 !important;
	top: -2px !important;
}

.project-detail-main-image {
	width: 100%;
	height: auto;
	max-height: 650px;
	object-fit: cover;
	display: block;
	border-radius: 0 40px 40px 0;
}

.project-detail-image-caption {
	text-align: left;
	margin-top: 10px !important;
}

.project-detail .card-left {
	height: auto !important;
}

.project-detail-specs-map-section {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 7.5rem 0;
	position: relative;
}

.project-detail-metadata-grid {
	flex: 1;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 10px;
	row-gap: 23px;
	text-align: left;
	margin-top: 0;
	margin-right: 40px;
}

.project-meta-item {
	display: flex;
	flex-direction: column;
}

.project-meta-label {
	font-size: var(--h4-font-size);
	color: var(--color-orange);
	font-weight: var(--weight-medium);
	text-transform: uppercase;
	margin-bottom: 3px;
}

.project-meta-item.span-2 {
	grid-column: span 2;
}

.project-detail-metadata-grid .project-meta-group {
	grid-column: span 2;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 10px;
	row-gap: 23px;
}

.project-detail-metadata-grid .left-column {
	grid-column: 1;
}

.project-detail-metadata-grid .right-column {
	grid-column: 2;
}

.project-detail-metadata-grid .section-title-item {
	margin-bottom: -20px;
}

.project-detail-metadata-grid .section-title-item .project-meta-label {
	border-bottom: 2px solid var(--color-orange);
	display: inline-block;
	align-self: flex-start;
	padding-bottom: 5px;
}

.project-detail-map-card {
	flex: 0 0 850px;
	width: 850px;
	height: 650px;
	margin-right: calc((100% - 100vw) / 2);
	border-radius: 40px 0 0 40px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background-color: var(--color-bg-soft);
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.project-detail-map-wrapper {
	flex: 1;
	width: 100%;
	overflow: hidden;
	position: relative;
}

.project-detail-map-wrapper iframe {
	width: 100%;
	height: calc(100% + 780px);
	margin-top: -390px;
	border: none;
	display: block;
}

.project-detail-map-bar {
	background-color: var(--color-orange);
	padding: 30px 50px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-sizing: border-box;
}

.project-detail-map-location-name {
	color: var(--color-white);
	font-weight: var(--weight-semibold);
	font-size: var(--h4-font-size);
	text-align: left;
	padding-right: 15px;
}

.project-detail-map-btn:hover {
	background-color: var(--color-white) !important;
	color: var(--color-orange) !important;
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(255, 255, 255, 0.2);
}

.project-gallery-tabs-section {
	margin-top: 4rem;
	text-align: left;
}

.project-gallery-tabs-section .tab-nav {
	margin-bottom: 50px;
}

.project-gallery-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 3.125rem 1.875rem;
}

.project-gallery-card {
	display: flex;
	flex-direction: column;
	text-align: center;
	cursor: pointer;
}

.project-gallery-card p {
	margin-bottom: 0;
}

.project-gallery-image-wrapper {
	width: 100%;
	height: 457px;
	border-radius: 30px;
	overflow: hidden;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.project-gallery-image-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.project-detail-gallery,
.site-plan-gallery {
	margin-bottom: 7.5rem;
}

.project-gallery-modal-overlay {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	background-color: #ffffff !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	z-index: 99999 !important;
	opacity: 0 !important;
	visibility: hidden !important;
	padding: 0 !important;
	transition: opacity 0.4s var(--ease-out), visibility 0.4s var(--ease-out) !important;
}

.project-gallery-modal-overlay,
.project-gallery-modal-overlay * {
	box-sizing: border-box !important;
}

.project-gallery-modal-overlay.active {
	opacity: 1 !important;
	visibility: visible !important;
}

.project-gallery-modal-container {
	width: 100% !important;
	max-width: 100% !important;
	height: 100% !important;
	max-height: 100% !important;
	margin: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	transform: none !important;
}

.project-gallery-modal-content {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-color: #ffffff !important;
}

.project-gallery-modal-img-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden !important;
	background-color: #ffffff !important;
	padding: 60px 80px !important;
}

.project-gallery-modal-img-wrapper img {
	max-width: 100% !important;
	max-height: 100% !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain !important;
	opacity: 0;
	transform: scale(0.95);
	transition: opacity 0.4s var(--ease-out), transform 0.4s var(--ease-out);
	border-radius: 0 !important;
}

.project-gallery-modal-overlay.active .project-gallery-modal-img-wrapper img {
	opacity: 1;
	transform: scale(1);
}

.project-gallery-modal-overlay.zoomed .project-gallery-modal-img-wrapper img {
	transition: none !important;
}

.project-modal-close-btn {
	position: absolute;
	top: 30px;
	right: 30px;
	background-color: transparent;
	background-image: url('themes/close.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 18px 18px;
	border: none;
	cursor: pointer;
	z-index: 100;
	width: 32px;
	height: 32px;
	transition: opacity 0.2s ease;
	opacity: 0.6;
}

.project-modal-close-btn:hover {
	opacity: 1;
}

.project-modal-nav-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border: none;
	cursor: pointer;
	width: 24px;
	height: 40px;
	z-index: 55;
	transition: opacity 0.2s ease;
	opacity: 0.6;
	-webkit-tap-highlight-color: transparent;
}

.project-modal-nav-btn:hover {
	opacity: 1;
}

.project-modal-nav-btn.prev-btn {
	left: -50px;
	background-image: url('themes/left-arrow.png');
	background-size: 40px !important;
}

.project-modal-nav-btn.next-btn {
	right: -50px;
	background-image: url('themes/right-arrow.png');
	background-size: 40px !important;
}

.project-gallery-modal-overlay.zoomed .project-modal-nav-btn {
	pointer-events: none !important;
}

.project-gallery-modal-nav-overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 50%;
	height: 100%;
	background: transparent !important;
	border: none;
	cursor: pointer;
	z-index: 50;
	padding: 0;
	-webkit-tap-highlight-color: transparent !important;
}

.project-gallery-modal-nav-overlay.prev-overlay {
	left: 0;
}

.project-gallery-modal-nav-overlay.next-overlay {
	right: 0;
}

.project-modal-img-container,
.certsawards-modal-img-container,
.project-gallery-modal-img-container {
	position: relative;
	display: inline-block;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
}

.project-modal-counter {
	position: absolute;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%);
	color: #888888;
	font-family: inherit;
	font-size: 14px;
	z-index: 50;
}

.project-enquiry-intro {
	background-color: var(--color-dark-green);
	color: #ffffff;
	text-align: center;
	padding: 7.5rem 1.5rem;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.project-enquiry-intro h4 {
	font-weight: var(--weight-regular);
	margin-top: 0;
	margin-bottom: 50px;
	color: var(--color-white);
}

/* #project-form {
	scroll-margin-top: 100px !important;
} */

.antispam {
	display: none;
	visibility: hidden;
}

#job-form,
#contact-form {
	background-color: var(--color-dark-green);
}

#tbProjectEnquiryForm>h1,
#tbJobForm>h1,
#tbContactform>h1 {
	float: left;
	margin-top: -8px;
	margin-right: 20px;
	margin-bottom: 30px;
}

#tbContactform>h1 {
	padding-right: 25px;
}

#tbProjectEnquiryForm>p:first-of-type,
#tbJobForm>p:first-of-type,
#tbContactform>p:first-of-type {
	display: flow-root;
	margin-top: 8px;
	margin-bottom: 30px;
	font-size: var(--h4-font-size);
}

#tbProjectEnquiryForm>table,
#tbJobForm>table,
#tbContactform>table {
	clear: both;
}

#tbJobForm h1,
#tbJobForm p,
#tbJobForm label,
#tbContactform h1,
#tbContactform p,
#tbContactform label {
	color: var(--color-white) !important;
}

#tbProjectEnquiryForm table.tbContactform,
#tbContactform table.tbContactform,
#tbJobForm table.tbContactform {
	width: 100%;
	border-collapse: collapse;
}

#tbProjectEnquiryForm table.tbContactform td,
#tbContactform table.tbContactform td,
#tbJobForm table.tbContactform td {
	padding: 0 0 11px 0 !important;
	border: none !important;
}

#tbContactform table.tbContactform td:first-child:not([colspan]),
#tbJobForm table.tbContactform td:first-child:not([colspan]) {
	padding-right: 15px !important;
}

#tbContactform table.tbContactform td:last-child:not([colspan]),
#tbJobForm table.tbContactform td:last-child:not([colspan]) {
	padding-left: 15px !important;
}

#tbProjectEnquiryForm table.tbContactform td label,
#tbContactform table.tbContactform td label,
#tbJobForm table.tbContactform td label {
	display: block;
	font-weight: var(--weight-medium);
	text-transform: uppercase;
}

#tbProjectEnquiryForm table.tbContactform td input.text,
#tbProjectEnquiryForm table.tbContactform td textarea,
#tbContactform table.tbContactform td input.text,
#tbContactform table.tbContactform td textarea,
#tbContactform table.tbContactform td select,
#tbJobForm table.tbContactform td input.text,
#tbJobForm table.tbContactform td textarea,
#tbJobForm table.tbContactform td select {
	font-family: inherit;
	width: 100%;
	border: none !important;
	font-size: 1.1rem;
	background: transparent !important;
	outline: none;
	box-shadow: none;
	box-sizing: border-box !important;
	border-radius: 0 !important;
}

#tbContactform table.tbContactform td input.text,
#tbContactform table.tbContactform td select,
#tbJobForm table.tbContactform td input.text,
#tbJobForm table.tbContactform td select {
	border-bottom: 1px solid var(--color-white) !important;
	padding: 10px 0 !important;
	height: 44px !important;
	color: var(--color-white) !important;
}

/* Custom Dropdown Selector Styling */
.custom-select-wrapper {
	position: relative;
	width: 100%;
	height: 44px;
	border-bottom: 1px solid var(--color-white) !important;
	box-sizing: border-box !important;
	cursor: pointer;
}

.custom-select-wrapper.error {
	border-bottom-color: var(--color-red) !important;
}

.custom-select-trigger {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100%;
	padding: 10px 0;
	color: var(--color-white);
	font-size: 1.1rem;
	box-sizing: border-box;
}

.custom-select-trigger .arrow {
	width: 0.9375rem;
	height: 0.8125rem;
	background-image: url("themes/down-arrow.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.custom-select-options {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background-color: var(--color-white);
	border: 1px solid var(--color-border-grey);
	border-radius: 4px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	display: none;
	z-index: 999;
	max-height: 250px;
	overflow-y: auto;
	margin-top: 5px;
}

.custom-select-wrapper.open .custom-select-options {
	display: block;
}

.custom-option {
	padding: 12px 16px;
	color: var(--color-text);
	font-size: 1rem;
}

.custom-option:hover {
	background-color: var(--color-dark-green);
	color: var(--color-white);
}

#tbProjectEnquiryForm table.tbContactform td textarea,
#tbContactform table.tbContactform td textarea,
#tbJobForm table.tbContactform td textarea {
	height: 150px;
	resize: vertical;
}

#tbContactform table.tbContactform td textarea,
#tbJobForm table.tbContactform td textarea {
	border-bottom: 1px solid var(--color-white) !important;
	padding: 10px 0 !important;
	color: var(--color-white) !important;
}

#tbProjectEnquiryForm table.tbContactform td input.text,
#tbProjectEnquiryForm table.tbContactform td textarea {
	border-bottom: 1px solid var(--color-dark-green) !important;
	padding: 10px 0 !important;
	color: var(--color-text) !important;
}

#tbProjectEnquiryForm table.tbContactform td input.text {
	height: 44px !important;
}

#tbProjectEnquiryForm table.tbContactform td textarea {
	line-height: 1.25 !important;
}

#tbProjectEnquiryForm table.tbContactform td input.text:focus,
#tbProjectEnquiryForm table.tbContactform td textarea:focus {
	border-color: var(--color-dark-green) !important;
}

#tbProjectEnquiryForm table.tbContactform td input.text.error,
#tbProjectEnquiryForm table.tbContactform td textarea.error {
	border-bottom-color: var(--color-dark-red) !important;
}

#tbContactform table.tbContactform td input.text:focus,
#tbContactform table.tbContactform td textarea:focus,
#tbContactform table.tbContactform td select:focus,
#tbJobForm table.tbContactform td input.text:focus,
#tbJobForm table.tbContactform td textarea:focus,
#tbJobForm table.tbContactform td select:focus {
	color: var(--color-white);
}

#tbContactform table.tbContactform td input.text.error,
#tbContactform table.tbContactform td textarea.error,
#tbContactform table.tbContactform td select.error,
#tbJobForm table.tbContactform td input.text.error,
#tbJobForm table.tbContactform td textarea.error,
#tbJobForm table.tbContactform td select.error {
	border-bottom-color: var(--color-dark-red) !important;
}

.tbErrors {
	color: var(--color-red) !important;
	margin-top: 0;
	margin-bottom: 1rem;
}

.tbSuccess {
	text-align: left;
	color: var(--color-white) !important;
	background-color: var(--color-green);
	padding: 15px 25px;
	border-radius: 8px;
	box-sizing: border-box;
	border: 1px solid rgba(255, 255, 255, 0.2);
}

.tb-field-error,
#tbProjectEnquiryForm table.tbContactform td span.tb-field-error,
#tbJobForm table.tbContactform td span.tb-field-error,
#tbContactform table.tbContactform td span.tb-field-error,
#tbJobForm table.tbContactform td.resume span.tb-field-error,
#tbProjectEnquiryForm table.tbContactform td.terms span.tb-field-error,
#tbJobForm table.tbContactform td.terms span.tb-field-error,
#tbContactform table.tbContactform td.terms span.tb-field-error {
	color: var(--color-red) !important;
	text-transform: none !important;
	font-size: 0.8125rem !important;
	font-weight: var(--weight-regular) !important;
	display: block !important;
	margin-top: 4px !important;
}


#tbContactform table.tbContactform td select,
#tbJobForm table.tbContactform td select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: url("themes/down-arrow.png");
	background-repeat: no-repeat !important;
	background-position: right 0 center !important;
	background-size: 15px 13px !important;
	padding: 10px 20px 10px 0 !important;
	height: 44px !important;
	box-sizing: border-box !important;
	cursor: pointer;
}

#tbContactform table.tbContactform td select option,
#tbJobForm table.tbContactform td select option {
	color: var(--color-text);
	background-color: var(--color-white);
}

#tbContactform table.tbContactform td.resume input[type="file"],
#tbJobForm table.tbContactform td.resume input[type="file"] {
	color: var(--color-white) !important;
	font-family: inherit;
	font-size: var(--font-size-sm);
	margin-top: 14px;
	margin-bottom: 4px;
}

#tbJobForm table.tbContactform td.resume input[type="file"]::file-selector-button {
	font-family: var(--font-poppins);
	font-weight: var(--weight-medium);
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	display: inline-block;
	text-align: center;
	border-radius: 30px;
	padding: 20px 34px;
	transition: all 0.3s ease;
	text-decoration: none;
	background-image: none !important;
	background-color: transparent;
	border: 1px solid var(--color-white) !important;
	color: var(--color-white) !important;
	cursor: pointer;
	margin-right: 15px;
	outline: none;
}

#tbContactform table.tbContactform td.resume input[type="file"]::file-selector-button:hover,
#tbJobForm table.tbContactform td.resume input[type="file"]::file-selector-button:hover {
	background-color: var(--color-white);
	color: var(--color-dark-green) !important;
	border-color: var(--color-white);
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(255, 255, 255, 0.15);
}

#tbContactform table.tbContactform td.resume>span,
#tbJobForm table.tbContactform td.resume>span {
	display: block;
	font-weight: var(--weight-medium);
	text-transform: uppercase;
	color: var(--color-white) !important;
	font-size: var(--font-size-sm);
	margin-bottom: 8px;
}

#tbContactform table.tbContactform td.resume .note,
#tbJobForm table.tbContactform td.resume .note {
	color: var(--color-orange) !important;
	font-size: 0.9rem;
	margin-top: 8px;
}

#tbContactform table.tbContactform td.gender,
#tbContactform table.tbContactform td.employed,
#tbJobForm table.tbContactform td.gender,
#tbJobForm table.tbContactform td.employed {
	color: var(--color-white) !important;
}

#tbContactform table.tbContactform td.gender span,
#tbContactform table.tbContactform td.employed span,
#tbJobForm table.tbContactform td.gender span,
#tbJobForm table.tbContactform td.employed span {
	display: block;
	font-weight: var(--weight-medium);
	text-transform: uppercase;
	color: var(--color-white) !important;
	font-size: var(--font-size-sm);
	margin-bottom: 8px;
}

#tbContactform table.tbContactform td.gender .radio-holder,
#tbContactform table.tbContactform td.employed .radio-holder,
#tbJobForm table.tbContactform td.gender .radio-holder,
#tbJobForm table.tbContactform td.employed .radio-holder {
	display: flex;
	gap: 20px;
	margin-top: 10px;
}

#tbContactform table.tbContactform td.gender .radio-holder .item,
#tbContactform table.tbContactform td.employed .radio-holder .item,
#tbJobForm table.tbContactform td.gender .radio-holder .item,
#tbJobForm table.tbContactform td.employed .radio-holder .item {
	display: flex;
	align-items: center;
	gap: 8px;
}

#tbContactform table.tbContactform td.gender .radio-holder .item span,
#tbContactform table.tbContactform td.employed .radio-holder .item span,
#tbJobForm table.tbContactform td.gender .radio-holder .item span,
#tbJobForm table.tbContactform td.employed .radio-holder .item span {
	display: inline;
	text-transform: none;
	font-weight: var(--weight-normal);
	font-size: 1rem;
	margin-bottom: 0;
}

#tbProjectEnquiryForm table.tbContactform td.terms {
	padding: 0 0 46px 0 !important;
}

#tbContactform table.tbContactform td.terms,
#tbJobForm table.tbContactform td.terms {
	padding: 3px 0 50px 0 !important;
}

#tbProjectEnquiryForm table.tbContactform td.terms div,
#tbContactform table.tbContactform td.terms div,
#tbJobForm table.tbContactform td.terms div {
	display: flex;
	align-items: center;
}

#tbProjectEnquiryForm table.tbContactform td.terms input[type="checkbox"],
#tbContactform table.tbContactform td.terms input[type="checkbox"],
#tbJobForm table.tbContactform td.terms input[type="checkbox"] {
	margin: 0 20px 0 0 !important;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	border: 1.5px solid var(--color-checkbox-grey) !important;
	background-color: var(--color-white);
	outline: none;
	cursor: pointer;
	position: relative;
}

#tbProjectEnquiryForm table.tbContactform td.terms input[type="checkbox"]:checked {
	background-color: var(--color-dark-green);
	border-color: var(--color-dark-green) !important;
}

#tbContactform table.tbContactform td.terms input[type="checkbox"]:checked,
#tbJobForm table.tbContactform td.terms input[type="checkbox"]:checked {
	background-color: var(--color-dark-green);
	border-color: var(--color-white) !important;
}

#tbProjectEnquiryForm table.tbContactform td.terms input[type="checkbox"]:checked::after,
#tbContactform table.tbContactform td.terms input[type="checkbox"]:checked::after,
#tbJobForm table.tbContactform td.terms input[type="checkbox"]:checked::after {
	content: '';
	position: absolute;
	left: 6px;
	top: 2px;
	width: 5px;
	height: 10px;
	border: solid var(--color-white);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

#tbProjectEnquiryForm table.tbContactform td.terms input[type="checkbox"].error,
#tbContactform table.tbContactform td.terms input[type="checkbox"].error,
#tbJobForm table.tbContactform td.terms input[type="checkbox"].error {
	border-color: var(--color-dark-red) !important;
}

#tbContactform table.tbContactform td.terms span,
#tbJobForm table.tbContactform td.terms span {
	font-size: 1rem;
	font-weight: var(--weight-regular);
	line-height: 1.5;
	color: var(--color-white) !important;
}

#tbProjectEnquiryForm table.tbContactform td.terms span a,
#tbContactform table.tbContactform td.terms span a,
#tbJobForm table.tbContactform td.terms span a {
	text-decoration: none;
	border-bottom: 1px solid transparent;
}

#tbProjectEnquiryForm table.tbContactform td.terms span a {
	color: var(--color-dark-red);
}

#tbProjectEnquiryForm table.tbContactform td.terms span a:hover {
	border-color: var(--color-dark-green);
}

#tbContactform table.tbContactform td.terms span a,
#tbJobForm table.tbContactform td.terms span a {
	color: var(--color-orange) !important;
}

#tbContactform table.tbContactform td.terms span a:hover,
#tbJobForm table.tbContactform td.terms span a:hover {
	border-color: var(--color-orange) !important;
}

#tbProjectEnquiryForm table.tbContactform td.captcha,
#tbContactform table.tbContactform td.captcha,
#tbJobForm table.tbContactform td.captcha {
	text-align: left;
	vertical-align: top !important;
	width: 50%;
	padding-bottom: 0 !important;
}

#tbProjectEnquiryForm table.tbContactform td.button,
#tbContactform table.tbContactform td.button,
#tbJobForm table.tbContactform td.button {
	text-align: right;
	vertical-align: top !important;
	width: 50%;
	padding-bottom: 0 !important;
}

#tbContactform table.tbContactform td.button .btn-wo,
#tbJobForm table.tbContactform td.button .btn-wo {
	outline: none;
	cursor: pointer;
}

#tbContactform table.tbContactform td.button .btn-wo:hover,
#tbJobForm table.tbContactform td.button .btn-wo:hover {
	color: var(--color-dark-green) !important;
}

/*  ###########################################################
	Contact Map Section
	########################################################### */
#contact-map {
	position: relative;
}

#contact-map .contact-map-embed {
	width: 100%;
	height: 650px;
	overflow: hidden;
}

#contact-map .contact-map-embed iframe {
	width: 100%;
	height: calc(100% + 240px);
	margin-top: -150px;
	border: none;
	display: block;
	zoom: 1.15;
}

#contact-map .contact-map-bar {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	max-width: 1400px;
	background-color: var(--color-orange);
	padding: 30px 50px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	box-sizing: border-box;
	border-radius: 40px 40px 0 0;
	color: var(--color-white);
}

#contact-map .contact-map-bar .contact-map-name {
	font-weight: var(--weight-semibold);
	font-size: var(--font-size-title);
	white-space: nowrap;
	padding-right: 50px;
}

#contact-map .contact-map-bar .contact-map-address {
	font-size: var(--h4-font-size);
	line-height: 1.25;
	flex: 1;
	padding-right: 50px;
}

#contact-map .contact-map-bar .btn-wo {
	white-space: nowrap;
}

#contact-map .contact-map-bar .btn-wo:hover {
	color: var(--color-orange) !important;
}

/*  ###########################################################
	 News & Events
	########################################################### */
#news-list-section .tab-nav,
#events-list-section .tab-nav {
	margin-bottom: 50px;
}

.newsevent-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
	margin-top: 30px;
	width: 100%;
}

.newsevent-grid .no-records-message,
.project-grid .no-records-message {
	grid-column: 1 / -1;
	width: 100%;
}

.newsevent-card {
	position: relative;
	overflow: hidden;
	border-radius: 24px;
	width: 100%;
	aspect-ratio: 1.5;
	height: auto;
	background-size: cover;
	background-position: center;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	text-decoration: none;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.newsevent-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.61) 100%) 0% 0% no-repeat padding-box;
	z-index: 1;
}

.newsevent-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
}

.newsevent-card-content {
	padding: 30px;
	box-sizing: border-box;
	text-align: left;
	width: 100%;
	position: relative;
	z-index: 2;
}

.newsevent-card-header {
	display: flex;
	align-items: center;
	margin-bottom: 15px;
}

.newsevent-badge {
	padding: 4px 30px;
}

.newsevent-date,
.h-newsevent-date {
	color: var(--color-white);
	font-size: var(--font-size-sm);
	font-weight: var(--weight-regular);
	font-style: italic;
	margin-left: 20px;
}

.h-newsevent-date {
	margin-left: 0 !important;
}

.newsevent-title {
	color: var(--color-white);
	font-weight: var(--weight-semibold);
	margin: 0;
	line-height: 1.2;
	min-height: 2.4em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.h-newsevent-featured-title {
	color: var(--color-white);
	font-weight: var(--weight-semibold);
	margin: 0;
	transition: color 0.3s ease;
}

.newsevent #main-content>.wrapper {
	padding-top: 7.25rem !important;
	padding-bottom: 3.125rem !important;
}

.newsevent-detail-content {
	max-width: 1000px;
	line-height: 1.5;
	text-align: left;
	margin: 0 auto;
}

.newsevent-detail-content p:first-child {
	margin-top: 0;
}

.newsevent-detail-content img {
	max-width: 100% !important;
	height: auto !important;
	display: block;
	margin-top: 25px;
}

.newsevent-detail-content p:has(>em) {
	margin-top: -10px;
	text-align: center;
}

.newsevent-detail-action {
	position: relative;
	text-align: center;
	margin: 67px 0 18px 0;
}

.newsevent-detail-action::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 1px;
	background: var(--color-border-grey);
	z-index: 1;
}

.newsevent-detail-action .btn-red {
	position: relative;
	z-index: 2;
}

.newsevent-detail-navigation .nav-divider {
	display: none;
}

.newsevent-detail-navigation .nav-links {
	display: flex;
	justify-content: space-between;
	gap: 20px;
}

.newsevent-detail-navigation .nav-item {
	width: 50%;
}

.newsevent-detail-navigation .nav-item-link {
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 100%;
	text-decoration: none;
}

.newsevent-detail-navigation .next-item .nav-item-link {
	align-items: flex-end;
}

.newsevent-detail-navigation .nav-label {
	font-weight: var(--weight-medium);
	color: var(--color-dark-red);
	display: flex;
	align-items: center;
	gap: 20px;
	margin-bottom: 15px;
}

.newsevent-detail-navigation .prev-arrow {
	display: inline-block;
	width: 31px;
	height: 15px;
	flex-shrink: 0;
	background-image: url("themes/left-arrow-red.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transition: transform 0.3s ease;
}

.newsevent-detail-navigation .next-arrow {
	display: inline-block;
	width: 31px;
	height: 15px;
	flex-shrink: 0;
	background-image: url("themes/right-arrow-red.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transition: transform 0.3s ease;
}

.newsevent-detail-navigation .nav-card {
	display: flex;
	background-color: transparent;
	border: none;
	border-radius: 0;
	overflow: visible;
	text-decoration: none;
	width: 100%;
	height: auto;
	gap: 30px;
}

.newsevent-detail-navigation .nav-thumb {
	width: 200px;
	height: 130px;
	background-size: cover;
	background-position: center;
	border-radius: 15px;
	flex-shrink: 0;
}

.newsevent-detail-navigation .nav-info {
	display: flex;
	flex-direction: column;
	justify-content: center;
	flex-grow: 1;
}

.newsevent-detail-navigation .next-item .nav-info {
	text-align: right;
	margin-right: 10px;
}

.newsevent-detail-navigation .nav-item:empty {
	display: none;
}

.newsevent-detail-navigation .nav-date {
	font-size: var(--font-size-sm);
	font-style: italic;
	margin-bottom: 5px;
}

.newsevent-detail-navigation .nav-title {
	font-weight: var(--weight-semibold);
	color: var(--color-dark-green);
	margin: 0;
}

.newsevent-detail-navigation .nav-card:hover .nav-title,
.newsevent-detail-navigation .nav-card:hover .nav-date {
	color: var(--color-dark-red);
}

.newsevent-detail-navigation .next-item .nav-card {
	flex-direction: row-reverse;
}

.newsevent-detail-navigation .prev-item .nav-info {
	text-align: left;
}

.newsevent-detail-navigation .next-item .nav-info {
	text-align: right;
}

/*  ###########################################################
	 Homepage News & Event
	########################################################### */
.h-newsevent-header {
	text-align: center;
	margin-bottom: 45px;
}

.h-newsevent-header .section-subtitle {
	font-size: var(--h4-font-size);
}

.h-newsevent-header h1 {
	color: var(--color-dark-red);
	margin: 0 0 5px 0;
}

.h-newsevent-header .section-desc {
	font-size: var(--h4-font-size);
	margin: 0 auto;
}

.h-newsevent-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	margin-left: auto;
	margin-right: auto;
}

.h-newsevent-badge {
	padding: 4px 29px !important;
}

.h-newsevent-featured {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	height: 457px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	text-decoration: none;
	transition: transform 0.4s var(--ease-out), box-shadow 0.4s var(--ease-out);
	will-change: transform;
}

.h-newsevent-featured::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 0.5s var(--ease-out);
	z-index: 0;
	will-change: transform;
}

.h-newsevent-featured:hover {
	transform: translate3d(0, -8px, 0);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

.h-newsevent-featured:hover::before {
	transform: scale(1.06);
}

.h-newsevent-featured:hover .h-newsevent-date,
.h-newsevent-featured:hover .h-newsevent-featured-title {
	color: var(--color-orange) !important;
}

.h-newsevent-featured-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.2) 60%, rgba(0, 0, 0, 0) 100%);
	z-index: 1;
}

.h-newsevent-featured-content {
	position: relative;
	z-index: 2;
	padding: 30px;
	box-sizing: border-box;
}

.h-newsevent-meta {
	display: flex;
	align-items: center;
	margin-bottom: 12px;
	gap: 15px;
}

.h-newsevent-list {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
}

.h-newsevent-item {
	display: flex;
	align-items: center;
	text-decoration: none;
	background-color: var(--color-white);
	border-radius: 16px;
	overflow: hidden;
	transition: transform 0.4s var(--ease-out), box-shadow 0.4s var(--ease-out);
	will-change: transform;
}

.h-newsevent-item:hover {
	transform: translate3d(0, -6px, 0);
	box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}

.h-newsevent-item:hover .h-newsevent-date,
.h-newsevent-item:hover .h-newsevent-title {
	color: var(--color-orange) !important;
}

.h-newsevent-thumb {
	width: 200px;
	height: 135px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 20px;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
}

.h-newsevent-thumb::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: inherit;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transition: transform 0.5s var(--ease-out);
	z-index: 0;
	will-change: transform;
}

.h-newsevent-item:hover .h-newsevent-thumb::before {
	transform: scale(1.06);
}

.h-newsevent-list .h-newsevent-date {
	color: var(--color-text) !important;
}

.h-newsevent-info {
	flex: 1;
	padding-left: 24px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.h-newsevent-info .h-newsevent-meta {
	margin-bottom: 8px;
}

.h-newsevent-title {
	color: var(--color-dark-green);
	font-weight: var(--weight-semibold);
	margin: 0;
	transition: color 0.3s ease;
}


.h-newsevent-explore-container {
	text-align: center;
	margin-top: 45px;
}

/*  ###############################################
	CREDENTIALS SECTION
	###############################################  */
.credentials-section {
	text-align: center;
	background-color: var(--color-bg-grey);
}

.credentials-section .wrapper {
	padding-top: 5.8194rem !important;
}

.credentials-header {
	margin-bottom: 3rem;
	padding: 0 15px;
}

.credentials-header p {
	font-size: var(--h4-font-size);
	max-width: 1200px;
	margin: auto;
}

.credentials-header h1 {
	margin-bottom: 10px;
	color: var(--color-dark-red);
	margin-top: -5px;
}

.credentials-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 40px;
	max-width: 1400px;
	margin: 0 auto;
}

.credential-card {
	background-color: var(--color-white);
	border-radius: 20px;
	box-shadow: 2px 6px 6px rgba(0, 0, 0, 0.05);
	flex: 1 1 250px;
	max-width: 320px;
	min-height: 220px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 16px;
	box-sizing: border-box;
	border: 1px solid var(--color-border-grey);
	transition: transform 0.3s var(--ease-out),
		box-shadow 0.3s ease;
	will-change: transform;
}

.credential-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
}

.credential-card img {
	max-width: 100%;
	max-height: 120px;
	width: auto;
	height: auto;
	object-fit: contain;
	display: block;
	margin: 0 auto;
}

.credential-card-title {
	font-weight: var(--weight-medium);
	margin-top: 15px;
	text-align: center;
}

/*  ###############################################
	CERTIFICATES & AWARDS SECTION
	###############################################  */
.certsawards-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 50px 20px;
	margin-top: 35px;
}

.certsawards-card {
	background-color: var(--color-white);
	border-radius: 20px;
	border: 1px solid var(--color-border-grey);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	max-width: 340px;
	width: 100%;
	margin: 0 auto;
}

.certsawards-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
}

.certsawards-img-wrapper {
	width: 100%;
	aspect-ratio: 1/1.414;
	background: #fff;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.certsawards-img-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	display: block;
}

.pdf-thumbnail-wrapper {
	position: relative;
	width: 100%;
	aspect-ratio: 705 / 1000;
	background: #f5f6f8;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: 1px solid var(--color-border-grey);
}

.pdf-thumbnail-canvas {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.pdf-loading-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #f5f6f8 0%, #e9ecef 100%);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px;
	gap: 15px;
	transition: opacity 0.3s ease;
	z-index: 2;
}

.pdf-loading-overlay .pdf-icon {
	font-family: var(--font-bebas-neue);
	font-size: 2.5rem;
	color: var(--color-dark-red);
	background: rgba(150, 46, 47, 0.1);
	padding: 10px 20px;
	border-radius: 8px;
	border: 2px solid var(--color-dark-red);
}

.pdf-loading-overlay .pdf-filename {
	font-size: 0.85rem;
	text-align: center;
	word-break: break-all;
	font-weight: var(--weight-medium);
	color: var(--color-text);
}

.certsawards-info {
	padding: 25px 15px;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	flex-grow: 1;
}

.certsawards-info>h4 {
	font-weight: var(--weight-semibold);
	margin: 0;
}

.certsawards-subtitle {
	font-size: var(--font-size-sm);
	font-style: italic;
	line-height: 1.2;
}

.certsawards-subtitle:empty {
	display: none !important;
}

body.modal-open {
	overflow: hidden !important;
}

.certsawards-modal-overlay,
.certsawards-modal-overlay * {
	box-sizing: border-box;
}

.certsawards-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	z-index: 9999;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
	display: block;
	overflow: auto;
	text-align: center;
	padding: 40px 20px;
	white-space: nowrap;
}

.certsawards-modal-overlay::before {
	content: "";
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -4px;
}

.certsawards-modal-overlay.active {
	opacity: 1;
	visibility: visible;
}

.certsawards-modal-container {
	background-color: #ffffff !important;
	border-radius: 8px;
	width: fit-content;
	max-width: 90%;
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
	position: relative;
	overflow: hidden;
	transform: scale(0.9);
	transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
	display: inline-flex;
	flex-direction: column;
	text-align: left;
	vertical-align: middle;
	white-space: normal;
	margin: 0 auto;
}

@media (hover: hover) and (pointer: fine) {
	.certsawards-modal-container {
		max-width: 850px;
		overflow: visible;
	}

	.certsawards-modal-content {
		overflow: visible;
	}
}

.certsawards-modal-overlay.active .certsawards-modal-container {
	transform: scale(1);
	display: inline-flex;
}

.certsawards-modal-content {
	background-color: #ffffff !important;
	padding: 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	width: 100%;
}

.certsawards-modal-header {
	display: none;
}

.certsawards-modal-img-wrapper {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	background: #ffffff;
	overflow: hidden;
}

.certsawards-modal-img-wrapper img {
	max-width: 100%;
	max-height: 750px;
	height: auto;
	display: block;
	box-shadow: none;
	transition: transform 0.15s ease-out;
}

.certsawards-modal-bottom-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 15px 25px;
	background-color: #ffffff !important;
	width: 0;
	min-width: 100%;
	box-sizing: border-box;
}

.certsawards-modal-bottom-left {
	display: flex;
	align-items: center;
	gap: 15px;
	flex: 1;
	min-width: 0;
}

.certsawards-modal-controls {
	display: flex;
	align-items: center;
	gap: 8px;
}

.certsawards-modal-nav {
	background-color: #ffffff;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 8px auto;
	border: 1px solid #e9ecef;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	outline: none;
	padding: 0;
	-webkit-tap-highlight-color: transparent !important;
	opacity: 0.6;
}

.certsawards-modal-nav:hover {
	background-color: #f8f9fa;
	border-color: #dee2e6;
	opacity: 1;
}

.certsawards-modal-nav.prev-page {
	background-image: url('themes/left-arrow.png');
	background-position: calc(50% - 1px) center !important;
	background-size: 12px !important;
}

.certsawards-modal-nav.next-page {
	background-image: url('themes/right-arrow.png');
	background-position: calc(50% + 1px) center !important;
	background-size: 12px !important;
}

.certsawards-modal-counter {
	font-size: 14px;
	color: #868e96;
	font-weight: 500;
	min-width: 30px;
	text-align: center;
	user-select: none;
}

.certsawards-modal-title {
	font-size: 15px;
	font-weight: 600;
	color: #212529;
	margin: 0;
	line-height: 1.2;
	word-wrap: break-word;
	flex: 1;
	min-width: 0;
}

.certsawards-modal-close-btn {
	background-color: #ffffff;
	background-image: url('themes/close.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 10px;
	border: 1px solid #e9ecef;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	outline: none;
	margin-left: 15px;
	padding: 0;
	opacity: 0.6;
}

.certsawards-modal-close-btn:hover {
	background-color: #f8f9fa;
	border-color: #dee2e6;
	opacity: 1;
}

.certsawards-modal-subtitle {
	display: none;
}

.certsawards-modal-nav-overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 50%;
	height: 100%;
	background: transparent;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	z-index: 10;
	outline: none;
	padding: 0;
	transition: background 0.3s ease;
	-webkit-tap-highlight-color: transparent !important;
}

.certsawards-modal-overlay.zoomed .certsawards-modal-nav-overlay {
	pointer-events: none !important;
}

.certsawards-modal-nav-overlay.prev-overlay {
	left: 0;
	justify-content: flex-start;
}

.certsawards-modal-nav-overlay.next-overlay {
	right: 0;
	justify-content: flex-end;
}

.nav-overlay-arrow {
	background-color: rgba(255, 255, 255, 0.7);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 8px auto;
	border: 1px solid rgba(0, 0, 0, 0.05);
	width: 38px;
	height: 38px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	opacity: 0;
	transition: opacity 0.3s ease, background-color 0.2s ease, transform 0.2s ease;
	-webkit-tap-highlight-color: transparent !important;
}

.prev-overlay .nav-overlay-arrow {
	margin-left: 20px;
	background-image: url('themes/left-arrow.png');
	background-size: 20px !important;
}

.next-overlay .nav-overlay-arrow {
	margin-right: 20px;
	background-image: url('themes/right-arrow.png');
	background-size: 20px !important;
}

.certsawards-modal-nav-overlay:hover .nav-overlay-arrow {
	opacity: 0.6;
}

.certsawards-modal-nav-overlay:hover .nav-overlay-arrow:hover {
	opacity: 1;
	background-color: #ffffff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.prev-overlay:hover .nav-overlay-arrow {
	transform: scale(1.05);
}

.next-overlay:hover .nav-overlay-arrow {
	transform: scale(1.05);
}

.certsawards-modal-nav-outside {
	position: absolute;
	top: calc(50% - 31px);
	transform: translateY(-50%);
	background-color: #ffffff;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 8px auto;
	border: 1px solid #e9ecef;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	outline: none;
	padding: 0;
	z-index: 100;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	opacity: 0.8;
}

.certsawards-modal-nav-outside:hover {
	opacity: 1;
	transform: translateY(-50%) scale(1.05);
	background-color: #ffffff;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}

.certsawards-modal-nav-outside.prev-btn {
	left: -64px;
	background-image: url('themes/left-arrow.png');
	background-size: 16px !important;
	background-position: calc(50% - 1.5px) center !important;
}

.certsawards-modal-nav-outside.next-btn {
	right: -64px;
	background-image: url('themes/right-arrow.png');
	background-size: 16px !important;
	background-position: calc(50% + 1.5px) center !important;
}

/*  ###############################################
	CAREER SECTION
	###############################################  */
body.careers #feature table {
	display: block;
	width: 100%;
}

body.careers #feature table tbody {
	display: block;
	width: 100%;
}

body.careers #feature table tr {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 25px;
	width: 100%;
}

body.careers #feature table td {
	display: block;
	text-align: left;
}

body.careers #feature table td img {
	width: 120px;
	height: 120px;
	object-fit: contain;
	display: block;
	margin-left: 0;
}

body.careers #feature table td h4 {
	font-weight: var(--weight-semibold);
	color: var(--color-dark-red);
	margin: 14px 0;
	max-width: 180px;
	line-height: 1;
	min-height: 2.4em;
}

body.careers #feature table td p {
	line-height: 1.2;
	margin: 0;
}

/*  ###########################################################
	 BUILDING CAREERS TOGETHER (JOB LISTINGS & ACCORDION)
	########################################################### */
body.careers #message .wrapper {
	padding-bottom: 0 !important;
}

body.careers #message .wrapper>h1:first-of-type {
	margin-top: 6.875rem;
	color: var(--color-dark-red);
}

body.careers #message .wrapper>p {
	font-size: var(--h4-font-size);
}

body.careers #message .wrapper>p:last-of-type {
	margin-bottom: 4.625rem;
}

.career-accordion {
	margin-top: 50px;
	border: 1px solid var(--color-border-grey);
	border-radius: 10px;
	overflow: hidden;
}

.accordion-item {
	border-bottom: 1px solid var(--color-border-grey);
	background-color: var(--color-white);
}

.accordion-item:last-child {
	border-bottom: none;
}

.accordion-header {
	padding: 20px 32px;
	font-size: var(--h4-font-size);
	font-weight: var(--weight-medium);
	color: var(--color-dark-green);
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
	user-select: none;
}

.accordion-item.active .accordion-header {
	background-color: var(--color-dark-green);
	color: var(--color-white);
}

.accordion-icon::before {
	content: "";
	display: inline-block;
	width: 0.875rem;
	height: 0.75rem;
	background-image: url("themes/right-arrow-orange.png") !important;
	background-repeat: no-repeat !important;
	background-size: contain !important;
	background-position: center !important;
}

.accordion-item.active .accordion-icon::before {
	content: "";
	width: 0.9375rem;
	height: 0.8125rem;
	background-image: url("themes/down-arrow.png") !important;
	background-repeat: no-repeat !important;
	background-size: contain !important;
	background-position: center !important;
	transform: none !important;
}

.accordion-content {
	border-top: 1px solid var(--color-border-grey);
	transition: none !important;
}

.accordion-body {
	padding: 35px 40px;
	background-color: var(--color-white);
}

.accordion-body>*:first-child {
	margin-top: 0 !important;
}

.accordion-body>*:last-child {
	margin-bottom: 0 !important;
}

.accordion-body strong+div:not(:has(ul)) {
	margin-top: -10px;
}

.accordion-body ul {
	list-style-type: none !important;
	margin: 10px 0 20px 0 !important;
	padding-left: 0 !important;
	padding-inline-start: 0 !important;
}

.accordion-body ul li {
	position: relative !important;
	padding-left: 20px !important;
	line-height: 1.2;
}

.career-closing-date {
	margin-top: 1.5625rem;
	margin-bottom: 1.875rem;
	font-size: 0.9375rem;
}

.accordion-body strong+p {
	margin-top: 5px;
}

/*  ###############################################
	 Modern Footer
	###############################################  */
#footer {
	color: var(--color-text);
	padding: 1rem 0 0 0;
}

#footer .wrapper {
	max-width: 1400px;
	margin: 0 auto;
}

#footer>.wrapper>div:first-child {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 2rem;
	flex-wrap: wrap;
	width: 100%;
	padding: 1.5rem 0;
}

#footer #cologo {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	align-self: flex-start;
	text-align: center;
}

#footer #cologo a.logo {
	border-bottom: none;
	padding: 0;
	margin: 0 auto;
	display: block;
	float: none;
	width: 190px;
	text-align: center;
}

#footer #cologo a.logo img {
	display: block;
	margin: 0 auto;
	float: none;
	width: 190px;
	height: auto;
	padding: 0;
}

#footer #cologo p {
	font-weight: var(--weight-semibold);
	color: var(--color-dark-green);
	margin: 10px auto 0 auto;
	text-transform: uppercase;
	letter-spacing: 0px;
	border-bottom: none;
	padding-bottom: 0;
	text-align: center;
	max-width: 194px;
	width: 100%;
	white-space: nowrap;
	font-size: 1rem;
	line-height: 1.25;
	display: block;
}

#footer .footer-col {
	display: flex;
	flex-direction: column;
	min-width: 150px;
	flex: 0 1 auto;
	text-align: left;
}

#footer .footer-col h4 {
	font-size: var(--h4-font-size);
	font-weight: var(--weight-semibold);
	margin: 0 0 0.1rem 0;
	text-transform: none;
}

#footer .footer-col p {
	font-size: var(--font-size-sm);
	line-height: 1.2;
	color: var(--color-text);
	margin: 0 0 10px 0;
	text-transform: none;
}

#footer .footer-divider {
	border: none;
	border-top: solid 1px var(--color-border-grey);
	margin: 2rem 0 0 0;
	width: 100%;
}

#footer #f-menu {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 1.7rem 0;
	width: 100%;
	font-size: var(--font-size-sm);
}

#footer #f-menu .footermenu {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem 2.5rem;
	max-width: 100%;
	width: 100%;
}

#footer #f-menu .footermenu a {
	margin: 0;
	padding: 0;
	text-decoration: none;
	display: inline-block;
	border-bottom: none;
	padding-bottom: 0;
	transition: color 0.3s ease;
}

#copyright {
	background-color: var(--color-dark-green);
	font-size: var(--font-size-xs);
	color: var(--color-white);
	font-weight: var(--weight-regular);
	display: flex;
	width: 100%;
	padding: 2rem 0;
}

#copyright .wrapper {
	max-width: 1400px;
	margin: 0 auto;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.copyright a {
	font-weight: var(--weight-semibold);
	color: var(--color-white);
	position: relative;
	display: inline-block;
}

#copyright .right-group {
	display: flex;
	align-items: center;
	gap: 15px;
	margin-left: auto;
}

#copyright #footer-menu2 {
	display: flex;
	align-items: center;
	margin: 0 0 0 auto;
	line-height: 1;
	flex-grow: 1;
	text-align: right;
}

#copyright #footer-menu2 a {
	text-transform: uppercase;
	font-weight: var(--weight-regular);
	font-size: var(--font-size-xs);
	color: var(--color-white);
	margin: 0px 1rem;
	letter-spacing: 0.5px;
	transition: color 0.3s ease;
	border-bottom: none;
	padding-bottom: 0;
	line-height: 1;
	position: relative;
}

.copyright a::after,
#copyright #footer-menu2 a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 100%;
	height: 1px;
	background-color: var(--color-dark-red);
	transform: scaleX(0);
	transform-origin: bottom right;
	transition: transform 0.3s ease-out;
}

#copyright #footer-menu2 a:last-child {
	margin-right: 0px;
}

.copyright a:hover,
#copyright #footer-menu2 a:hover {
	color: var(--color-dark-red) !important;
}

.copyright a:hover::after,
#copyright #footer-menu2 a:hover::after {
	transform: scaleX(1);
	transform-origin: bottom left;
}

#copyright .follow {
	display: flex;
	gap: 20px;
	align-items: center;
	flex-wrap: nowrap;
	margin: 0 0 0 1rem;
}

.follow a {
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	transition: transform 0.3s ease, opacity 0.3s ease;
	opacity: 0.85;
	vertical-align: middle;
	box-shadow: none;
	border: none;
	border-radius: 0%;
	padding: 0;
	margin: 0;
	font-size: 0;
	line-height: 0;
}

.follow a:hover {
	transform: scale(1.15);
	opacity: 1;
	background-color: transparent;
}

.follow a.facebook {
	background-image: url(themes/icon-facebook-w.png);
	width: 30px;
	height: 30px;
}

.follow a.linkedin {
	background-image: url(themes/icon-linkedin-w.png);
	width: 36px;
	height: 30px;
}

body.privacy-policy #main-content,
body.terms-and-conditions #main-content,
body.sitemap #main-content {
	font-size: 1rem;
	text-align: left;
}

body.privacy-policy h1,
body.terms-and-conditions h1,
body.sitemap #main-content h1 {
	text-align: center;
}

/*  ###############################################
	 Sitemap Page
	###############################################  */
#sitemap h3 {
	margin-top: 0 !important;
	margin-bottom: 1rem !important;
}

#sitemap h3 a,
#sitemap h3 a:visited,
#sitemap h3 a span {
	color: var(--color-dark-red) !important;
	text-decoration: none !important;
}

#sitemap>.top {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

#sitemap ul {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

#sitemap li {
	position: relative !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 8px 0 8px 24px !important;
}

#sitemap li::before {
	content: "" !important;
	position: absolute !important;
	left: 4px !important;
	top: 15px !important;
	width: 6px !important;
	height: 6px !important;
	background-color: var(--color-orange) !important;
	border-radius: 50% !important;
}

#sitemap li a {
	color: var(--color-dark-red) !important;
	font-size: 1rem !important;
	font-weight: var(--weight-medium) !important;
}

#sitemap li a:hover {
	color: var(--color-dark-green) !important;
}

#sitemap li .top {
	margin-top: 4px !important;
	padding-left: 8px !important;
}

/*  ###############################################
	 Media Queries
	###############################################  */
@media only screen and (max-width: 1480px) {

	.wrapper,
	#header-top .wrapper,
	#header-container .wrapper,
	#footer .wrapper,
	#copyright .wrapper {
		max-width: auto;
		max-width: initial;
		max-width: none;
		box-sizing: border-box;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		width: calc((100vw + 100%) / 2 - var(--wrapper-padding)) !important;
	}
}

@media only screen and (max-width: 1400px) {
	:root {
		font-size: 15px;
		--h1-font-size: 3.4rem;
		--h2-font-size: 2.85rem;
		--h3-font-size: 1.45rem;
		--h4-font-size: 1.2rem;
		--font-size-title: 1.75rem;
	}

	.vm-banner {
		background-position: center 60% !important;
	}

	body.about-us #vision-mission .vm-banner table tr {
		grid-template-columns: 0.7fr 110px 2fr !important;
	}

	.credentials-section .wrapper {
		padding-top: 5rem !important;
	}

	.project-gallery-image-wrapper {
		height: 380px !important;
	}

	#logo a,
	#logo a img {
		height: 52px !important;
	}

	#header-top #title {
		font-size: 1.55rem !important;
		margin-left: 1.2rem !important;
	}

	#menu>ul>li>a,
	#menu>ul>li>a:visited {
		padding: 8px 14px !important;
		font-size: 0.95rem !important;
	}

	#header-holder.scroll #logo a,
	#header-holder.scroll #logo a img {
		height: 40px !important;
	}

	#header-holder.scroll #logo {
		padding: 4px 0px !important;
	}

	#header-holder.scroll #header-top #title {
		font-size: 1.35rem !important;
		margin-left: 1rem !important;
	}

	#header-holder.scroll #menu {
		padding: 4px 0px !important;
	}

	#header-holder.scroll #menu>ul>li>a,
	#header-holder.scroll #menu>ul>li>a:visited {
		padding: 5px 12px !important;
		font-size: 0.9rem !important;
	}
}

@media only screen and (max-width: 1240px) {
	:root {
		font-size: 14px;
	}

	#header-top #title {
		font-size: 1.35rem !important;
		margin-left: 1rem !important;
	}

	#menu>ul>li>a,
	#menu>ul>li>a:visited {
		padding: 8px 10px !important;
		font-size: 0.9rem !important;
	}

	.vm-banner {
		height: 520px !important;
	}

	body.about-us #vision-mission .vm-banner table tr {
		grid-template-columns: auto 120px 1fr !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h1:nth-of-type(2) {
		margin-top: 40px !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(2),
	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(3) {
		font-size: 6.875rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:first-of-type,
	body.about-us #vision-mission .vm-banner table td:first-child p:last-of-type {
		font-size: 1.15rem !important;
	}

	body.about-us #vision-mission>table>tbody {
		gap: 20px;
	}

	body.about-us #vision-mission>table td {
		padding: 40px 30px 40px 45px;
		column-gap: 20px;
	}

	body.about-us #vision-mission>table td::after {
		left: 15px;
	}

	.project-gallery-image-wrapper {
		height: auto !important;
		aspect-ratio: 3/2 !important;
		overflow: hidden;
	}

	.project-gallery-image-wrapper img {
		height: 100% !important;
		object-fit: cover !important;
	}

	.project-grid-card {
		width: calc(50% - 15px) !important;
	}

	.project-detail-specs-map-section {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		margin: 4rem 0 !important;
		gap: 40px !important;
	}

	.project-detail-metadata-grid {
		margin-right: 0 !important;
		width: 100% !important;
	}

	.project-detail-map-card {
		width: 100% !important;
		flex: none !important;
		margin-right: 0 !important;
		border-radius: 20px !important;
		height: 450px !important;
	}

	.project-detail-map-wrapper {
		height: 350px !important;
		width: 100% !important;
	}

	.project-detail-map-bar {
		padding: 20px 30px !important;
	}

	.inner.our-news #main-content .wrapper p {
		margin-top: 0;
	}

	.home-business-card.card-left {
		height: 580px !important;
	}

	.home-business-card.card-left {
		border-radius: 0px 35px 35px 0px !important;
	}

	.home-business-card.card-right {
		border-radius: 35px 0px 0px 35px !important;
	}

	.home-business-card.card-left .card-overlay {
		justify-content: flex-end !important;
		padding-left: calc((100vw - 100%) / 2 + 45px) !important;
		padding-right: 45px !important;
	}

	.home-business-card.card-right .card-overlay {
		justify-content: flex-start !important;
		padding-left: 45px !important;
		padding-right: calc((100vw - 100%) / 2 + 45px) !important;
	}

	.home-business-card .card-content {
		width: 560px !important;
		height: 500px !important;
		padding: 0 45px !important;
		border-radius: 20px !important;
	}

	.home-business-card .card-desc {
		margin-bottom: 30px !important;
	}

	body.residential #highlight,
	body.careers #banner {
		height: 580px !important;
	}

	body.residential #highlight .wrapper::after {
		width: 560px !important;
		height: 480px !important;
		right: 90px !important;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		height: 580px !important;
		border-radius: 0px 35px 35px 0px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		margin-left: calc(100% - 610px) !important;
		right: auto !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		width: 480px !important;
	}
}

@media only screen and (max-width: 1024px) {
	:root {
		font-size: 13.5px;
		--h1-font-size: 3.0rem;
		--h2-font-size: 2.5rem;
		--font-size-title: 1.625rem;
		--h3-font-size: 1.375rem;
		--h4-font-size: 1.125rem;
	}

	.wrapper {
		padding: 6rem 40px !important;
	}

	.newsevent #main-content>.wrapper {
		padding-top: 6.1rem !important;
		padding-bottom: 2.6rem !important;
	}

	.credentials-section .wrapper {
		padding-top: 4rem !important;
	}

	.business-banner img {
		height: 460px !important;
	}

	body.about-us,
	body.our-leaders {
		--intro-spacing: 4rem;
	}

	body.core-business,
	body.project-detail {
		--intro-spacing: 5.5rem;
	}

	body.residential,
	body.our-news,
	body.our-events {
		--intro-spacing: 2.25rem;
	}

	body.careers {
		--intro-spacing: 1.5rem;
	}

	body.certifications-awards {
		--intro-spacing: 2.25rem;
	}

	#banner-contant,
	.nivoSlider,
	.nivo-main-image,
	.nivo-slide {
		height: auto !important;
	}

	.inner #banner-contant {
		height: 350px !important;
	}

	.nivo-main-image,
	.nivo-slide img {
		object-fit: cover !important;
		height: 100% !important;
		width: 100% !important;
	}

	.nivo-caption {
		--nivo-caption-bottom: clamp(1.5rem, 4vw, 3rem);
		bottom: var(--nivo-caption-bottom);
	}

	.nivo-caption p.title {
		font-size: clamp(1.5rem, 3.8vw, 2.5rem) !important;
		max-width: 700px;
		line-height: 1.1 !important;
	}

	.nivo-caption p.desc {
		font-size: clamp(0.85rem, 1.2vw, 0.95rem) !important;
		line-height: 1.3 !important;
		margin-top: -0.5rem !important;
	}

	.nivo-caption a.btn-red,
	.nivo-caption a.btn-wo {
		padding: 0.625rem 1.25rem !important;
		font-size: clamp(0.75rem, 1vw, 0.85rem) !important;
		margin-top: 1rem !important;
	}

	.project-grid-card {
		width: calc(50% - 15px);
	}

	.page-header {
		padding-bottom: 45px !important;
	}

	.home-business-card.card-left {
		height: 540px !important;
	}

	.home-business-card.card-left {
		border-radius: 0px 30px 30px 0px !important;
	}

	.home-business-card.card-right {
		border-radius: 30px 0px 0px 30px !important;
	}

	.home-business-card.card-left .card-overlay {
		justify-content: flex-end !important;
		padding-left: calc((100vw - 100%) / 2 + 40px) !important;
		padding-right: 40px !important;
	}

	.home-business-card.card-right .card-overlay {
		justify-content: flex-start !important;
		padding-left: 40px !important;
		padding-right: calc((100vw - 100%) / 2 + 40px) !important;
	}

	.home-business-card .card-content {
		width: 520px !important;
		height: 460px !important;
		padding: 0 45px !important;
		border-radius: 20px !important;
	}

	.home-business-card .card-desc {
		margin-bottom: 25px !important;
	}

	body.about-us #company-info table tr {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 30px !important;
		padding: 25px 0 !important;
	}

	body.about-us #company-info table tr>td:first-child:nth-last-child(3)~td:last-child {
		grid-column: span 2 !important;
	}

	.tab-btn {
		padding: 10px 16px !important;
	}

	#contact-map .contact-map-embed {
		height: 500px !important;
	}

	#contact-map .contact-map-bar {
		padding: 24px 30px !important;
		border-radius: 30px 30px 0 0 !important;
	}

	#contact-map .contact-map-bar .contact-map-name {
		font-size: 1.5rem !important;
		padding-right: 30px !important;
	}

	#contact-map .contact-map-bar .contact-map-address {
		font-size: 1.05rem !important;
		padding-right: 30px !important;
	}

	body.residential #highlight,
	body.careers #banner {
		height: 620px !important;
	}

	body.residential #highlight .wrapper::after {
		width: 520px !important;
		height: 440px !important;
		right: 90px !important;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		width: calc((100vw + 100%) / 2 - 40px) !important;
		height: 100% !important;
		border-radius: 0px 30px 30px 0px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		margin-left: calc(100% - 570px) !important;
		right: auto !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		width: 440px !important;
	}

	.project-detail-main-image {
		border-radius: 0 30px 30px 0 !important;
	}
}

@media only screen and (max-width: 991px) {
	:root {
		font-size: 13px;
		--wrapper-padding: 30px;
	}

	.wrapper {
		padding: 4.75rem 30px 5rem 30px !important;
	}

	.newsevent #main-content>.wrapper {
		padding-top: 4.85rem !important;
		padding-bottom: 2.1rem !important;
	}

	#projects {
		scroll-margin-top: -4.75rem !important;
	}

	body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper {
		grid-template-columns: 1fr !important;
		row-gap: 5px !important;
	}

	body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper>h1 {
		grid-column: 1 !important;
		grid-row: auto !important;
		margin-top: 0 !important;
	}

	body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper>*:not(h1) {
		grid-column: 1 !important;
		margin-top: 0 !important;
		margin-left: 0 !important;
	}

	body.inner.our-news #main-content .wrapper>*:not(h1),
	body.inner.our-events #main-content .wrapper>*:not(h1) {
		margin-top: 0 !important;
	}

	body.about-us,
	body.our-leaders {
		--intro-spacing: 3rem;
	}

	body.core-business,
	body.project-detail {
		--intro-spacing: 4.5rem;
	}

	body.residential,
	body.our-news,
	body.our-events {
		--intro-spacing: 1.5rem;
	}

	body.certifications-awards {
		--intro-spacing: 1.5rem;
	}

	#header-top .wrapper,
	#header-container .wrapper,
	.nivo-caption .wrapper,
	#footer .wrapper,
	#copyright .wrapper {
		padding: 0 30px !important;
	}

	#menu {
		display: none;
	}

	#mobile-menu {
		display: block !important;
		position: static !important;
		pointer-events: auto !important;
		width: 100% !important;
	}

	#header-holder {
		position: relative !important;
		top: 0px;
		left: 0px;
		width: 100%;
		background-color: var(--color-dark-green) !important;
		box-shadow: none !important;
		z-index: 200;
	}

	#header-top {
		background: transparent !important;
		position: relative;
		width: 100%;
		border: none !important;
	}

	#header-top .wrapper>div {
		border-bottom: none !important;
	}

	#header-top #title {
		font-size: clamp(1.1rem, 2.2vw, 1.5rem) !important;
		margin-left: 1rem;
	}

	#header-holder #header-container,
	#header-holder.scroll #header-container {
		background: transparent !important;
		position: static !important;
		width: 100% !important;
		border: none !important;
		z-index: 100 !important;
		pointer-events: auto !important;
		display: block !important;
	}

	#header-holder #header-container .wrapper,
	#header-holder.scroll #header-container .wrapper {
		position: static !important;
		pointer-events: auto !important;
		display: block !important;
		padding: 0 30px !important;
		max-width: 1400px !important;
		margin: 0 auto !important;
	}

	.slicknav_menu {
		display: block !important;
		background: transparent !important;
		padding: 0px !important;
		position: static !important;
		width: 100% !important;
		pointer-events: auto !important;
	}

	#logo a,
	#logo a img {
		height: 45px !important;
	}

	.slicknav_btn {
		position: absolute !important;
		top: 15px !important;
		right: 30px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		box-sizing: border-box !important;
		padding: 12px 1.5rem !important;
		width: auto !important;
		height: 45px !important;
		border-radius: 20px !important;
		z-index: 1005 !important;
		pointer-events: auto !important;
		background-color: var(--color-dark-red) !important;
		margin: 0 !important;
	}

	.slicknav_nav {
		position: relative !important;
		width: 100% !important;
		margin-top: 0px !important;
		box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08) !important;
		pointer-events: auto !important;
		background-color: var(--color-white) !important;
		border-bottom: none !important;
	}

	.slicknav_nav ul {
		background-color: var(--color-white) !important;
	}

	.slicknav_nav ul li {
		border-top: none !important;
	}

	.slicknav_nav li {
		margin-top: 2px !important;
		border-bottom: none !important;
	}

	.slicknav_nav>li:first-child {
		margin-top: 0px !important;
	}

	.slicknav_nav a {
		margin-top: 0px !important;
	}

	.slicknav_nav a:hover,
	.slicknav_nav .slicknav_item:hover,
	.slicknav_nav .slicknav_item:hover a,
	.slicknav_nav .slicknav_item a:hover {
		background-color: var(--color-dark-green) !important;
		color: var(--color-white) !important;
	}

	#menu-top {
		padding-left: 0px !important;
		width: 100% !important;
		position: static !important;
	}

	body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper>h1 {
		grid-column: auto;
		grid-row: auto;
	}

	body.inner:not(.newsevent):not(.terms-of-use):not(.privacy-policy):not(.sitemap) #main-content .wrapper>*:not(h1) {
		grid-column: auto;
	}

	#business .section-header .header-title>p {
		margin-bottom: 0px !important;
	}

	.business-title {
		margin: -10px 0 10px 0;
	}

	.certsawards-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	body.careers #feature table {
		margin-bottom: 5rem;
	}

	body.careers #feature table tr {
		grid-template-columns: repeat(2, 1fr);
		gap: 40px 30px;
	}

	.project-gallery-tabs-section .tab-nav {
		margin-bottom: 35px !important;
	}

	.homepage-projects-header {
		grid-template-columns: 1fr auto;
		align-items: start;
		gap: 0 40px;
	}

	.homepage-projects-title {
		grid-column: 1;
		grid-row: 1;
		margin: 0;
		white-space: normal;
	}

	.homepage-projects-desc {
		grid-column: 1;
		grid-row: 2;
		margin: 0 !important;
	}

	.homepage-projects-action {
		grid-column: 2;
		grid-row: 1 / span 2;
		align-self: center;
		justify-self: end;
	}

	.homepage-projects-slider {
		grid-template-columns: repeat(2, 1fr);
	}

	#project-form,
	#job-form {
		scroll-margin-top: 0px !important;
	}

	.h-newsevent-grid {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.h-newsevent-featured {
		height: 380px;
	}

	.page-header {
		padding-bottom: 40px !important;
	}

	body.about-us #company-info table tr {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 25px !important;
		padding: 20px 0 !important;
	}

	body.about-us #company-info table tr>td:first-child:nth-last-child(3)~td:last-child {
		grid-column: span 2 !important;
	}

	.tab-btn {
		padding: 8px 14px !important;
	}

	.vm-banner {
		height: 480px !important;
	}

	body.about-us #vision-mission .vm-banner table tr {
		grid-template-columns: auto 100px 1fr !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child hr {
		width: 175px !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(2),
	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(3) {
		font-size: 6.25rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:first-of-type,
	body.about-us #vision-mission .vm-banner table td:first-child p:last-of-type {
		font-size: 1.1rem !important;
	}

	.milestone-card-header {
		font-size: 0.95rem;
		padding: 12px 15px 32px 15px;
	}

	#tbProjectEnquiryForm .wrapper,
	#tbContactform .wrapper,
	#tbJobForm .wrapper {
		margin-bottom: 20px !important;
	}

	#tbProjectEnquiryForm>h1,
	#tbJobForm>h1,
	#tbContactform>h1 {
		float: none;
		margin: 0 0 5px 0;
	}

	#tbContactform>h1 {
		padding-right: 0;
	}

	#tbProjectEnquiryForm>p:first-of-type,
	#tbJobForm>p:first-of-type,
	#tbContactform>p:first-of-type {
		margin-top: 0;
	}

	.newsevent-grid {
		gap: 20px;
	}

	#contact-map {
		display: flex !important;
		flex-direction: column !important;
	}

	#contact-map .contact-map-embed {
		height: 380px !important;
	}

	#contact-map .contact-map-bar {
		position: relative !important;
		left: auto !important;
		bottom: auto !important;
		transform: none !important;
		width: 100% !important;
		border-radius: 0px !important;
		padding: 30px 20px !important;
		flex-direction: column !important;
		align-items: center !important;
		text-align: center !important;
	}

	#contact-map .contact-map-bar .contact-map-name {
		font-size: 1.35rem !important;
		padding-right: 0px !important;
		margin-bottom: 12px !important;
		white-space: normal !important;
	}

	#contact-map .contact-map-bar .contact-map-address {
		font-size: 0.95rem !important;
		padding-right: 0px !important;
		margin-bottom: 20px !important;
	}

	#contact-map .contact-map-bar .btn-wo {
		width: 100% !important;
		max-width: 280px !important;
		box-sizing: border-box !important;
	}

	.collaborate-card {
		padding-left: max(30px, calc((100vw - var(--max-width)) / 2)) !important;
	}

	.join-card {
		padding-right: max(30px, calc((100vw - var(--max-width)) / 2)) !important;
	}

	body.residential #highlight,
	body.careers #banner {
		height: 620px !important;
	}

	body.residential #highlight .wrapper::after {
		width: 520px !important;
		height: 440px !important;
		right: 80px !important;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		width: calc((100vw + 100%) / 2 - 30px) !important;
		height: 100% !important;
		border-radius: 0px 30px 30px 0px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		margin-left: calc(100% - 560px) !important;
		right: auto !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		width: 440px !important;
	}
}

@media only screen and (max-width: 880px) {
	.vm-banner {
		height: 450px !important;
	}

	body.about-us #vision-mission .vm-banner table tr {
		grid-template-columns: auto 80px 1fr !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child hr {
		width: 145px !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(2),
	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(3) {
		font-size: 5.3125rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:first-of-type,
	body.about-us #vision-mission .vm-banner table td:first-child p:last-of-type {
		font-size: 1.05rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h1:nth-of-type(2) {
		margin-top: 28px !important;
	}

	.business-banner img {
		height: 400px !important;
	}

	.newsevent-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.newsevent-card-content {
		padding: 25px;
	}

	.newsevent-title {
		min-height: 0;
		display: block;
		overflow: visible;
	}

	.newsevent-detail-action {
		margin: 30px 0 15px 0;
	}

	.newsevent-detail-navigation .nav-links {
		flex-direction: column;
		gap: 30px;
	}

	.newsevent-detail-navigation .nav-item {
		width: 100%;
	}

	.newsevent-detail-navigation .nav-thumb {
		width: 150px;
		height: 100px;
	}

	body.residential #highlight,
	body.careers #banner {
		height: 540px !important;
	}

	body.residential #highlight .wrapper::after {
		width: 480px !important;
		height: 400px !important;
		right: 80px !important;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		width: calc((100vw + 100%) / 2 - 30px) !important;
		height: 100% !important;
		border-radius: 0px 24px 24px 0px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		margin-left: calc(100% - 520px) !important;
		right: auto !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		width: 400px !important;
	}
}

@media only screen and (max-width: 768px) {
	:root {
		font-size: 12.5px;
		--h1-font-size: 2.5rem;
		--h2-font-size: 2.125rem;
		--font-size-title: 1.5rem;
		--h3-font-size: 1.25rem;
		--h4-font-size: 1.0625rem;
	}

	.credentials-section .wrapper {
		padding-top: 3.5rem !important;
	}

	.certsawards-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 30px 20px;
	}

	.project-gallery-modal-nav-overlay,
	.certsawards-modal-nav-overlay {
		display: flex !important;
	}

	.project-gallery-modal-nav-overlay .nav-overlay-arrow,
	.certsawards-modal-nav-overlay .nav-overlay-arrow {
		display: none !important;
	}

	.vm-banner {
		height: 420px !important;
	}

	body.about-us #vision-mission .vm-banner table tr {
		grid-template-columns: auto 60px 1fr !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child hr {
		width: 120px !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(2),
	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(3) {
		font-size: 4.375rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:first-of-type,
	body.about-us #vision-mission .vm-banner table td:first-child p:last-of-type {
		font-size: 1rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h1:nth-of-type(2) {
		margin-top: 25px !important;
	}

	body.careers #feature table {
		margin-bottom: 4rem;
	}

	.homepage-projects-header {
		display: flex !important;
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 5px !important;
		margin-bottom: 10px !important;
	}

	.homepage-projects-title {
		grid-column: auto !important;
		grid-row: auto !important;
		margin: 0 !important;
		white-space: normal !important;
	}

	.homepage-projects-desc {
		grid-column: auto !important;
		grid-row: auto !important;
		margin: 0 !important;
	}

	.homepage-projects-action {
		grid-column: auto !important;
		grid-row: auto !important;
		align-self: flex-start !important;
		margin-top: 5px !important;
	}

	body.home #main-content .wrapper table~p img {
		height: auto !important;
		aspect-ratio: 1400 / 450 !important;
		border-radius: 20px !important;
		margin-top: 35px !important;
		margin-bottom: -7.5rem !important;
		object-position: center !important;
	}

	body.about-us #vision-mission>h1 {
		margin-top: 80px;
	}

	body.about-us #vision-mission>table>tbody {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	body.about-us #vision-mission>table td {
		border-radius: 24px 12px 12px 24px;
		padding: 25px 25px 25px 45px;
		column-gap: 20px;
	}

	body.about-us #vision-mission>table td::after {
		left: 12px;
		border-radius: 12px;
	}

	body.about-us #vision-mission>table td>h1:first-of-type {
		font-size: 90px;
	}

	body.about-us #vision-mission>table td>h1:last-of-type {
		margin-top: 0 !important;
	}

	#header-top #title {
		flex-direction: row !important;
		align-items: center !important;
		font-size: clamp(1rem, 2vw, 1.2rem) !important;
	}

	#header-top #title>div:first-child {
		margin-bottom: 0px !important;
		margin-right: 0.4rem !important;
	}

	#logo a,
	#logo a img {
		height: 40px !important;
	}

	.slicknav_btn {
		height: 40px !important;
		padding: 0 16px !important;
		right: 30px !important;
	}

	#banner-contant,
	.nivoSlider,
	.nivo-main-image,
	.nivo-slide {
		height: auto !important;
	}

	.inner #banner-contant {
		height: 250px !important;
	}

	.nivo-caption {
		--nivo-caption-bottom: clamp(1rem, 3vw, 2rem);
		bottom: var(--nivo-caption-bottom);
	}

	.nivo-caption p.title {
		font-size: clamp(1.8rem, 3.5vw, 2.2rem) !important;
		max-width: 500px;
	}

	.nivo-caption p.desc {
		font-size: clamp(0.85rem, 1.2vw, 0.95rem) !important;
		line-height: 1.3 !important;
		margin-top: -0.4rem !important;
	}

	.nivo-caption a.btn-red,
	.nivo-caption a.btn-wo {
		padding: 0.5rem 1rem !important;
		font-size: clamp(0.7rem, 0.9vw, 0.8rem) !important;
		margin-top: 0.75rem !important;
		margin-right: 0.75rem !important;
	}

	body.home #main-content .wrapper>h1 {
		margin-top: -2px !important;
		margin-bottom: 15px !important;
	}

	body.inner #desc .wrapper {
		padding: 3rem 30px;
	}

	#footer #cologo a img {
		width: 120px;
	}

	#footer-menu {
		font-size: 13px;
	}

	#footer .follow a {
		height: 25px;
		width: 30px;
	}

	#footer .follow a.linkedin {
		width: 35px;
	}

	.mobile {
		display: block;
	}

	.tab-menu>div a {
		padding: 1rem 0.5rem;
	}

	#footer>.wrapper>div:first-child {
		flex-direction: column !important;
		align-items: center;
		text-align: center;
		gap: 1.5rem;
	}

	#footer #cologo {
		align-items: center;
		text-align: center;
		align-self: center !important;
	}

	#footer #cologo a.logo {
		width: 140px !important;
	}

	#footer .footer-col {
		align-items: center;
		text-align: center;
		min-width: 200px;
	}

	#copyright .wrapper {
		flex-direction: column !important;
		justify-content: center !important;
		align-items: center !important;
		gap: 1rem !important;
	}

	#copyright .copyright {
		text-align: center !important;
	}

	#copyright .right-group {
		margin: 0 !important;
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: wrap !important;
		gap: 15px !important;
		justify-content: center !important;
		align-items: center !important;
		width: auto !important;
	}

	#copyright #footer-menu2 {
		margin: 0 !important;
		display: flex !important;
		flex-direction: row !important;
		align-items: center !important;
		justify-content: center !important;
		flex-wrap: nowrap !important;
	}

	#copyright #footer-menu2 a {
		margin: 0 0.4rem !important;
	}

	#copyright .follow {
		margin: 0 0 0 10px !important;
		justify-content: center !important;
	}

	#copyright .follow a.facebook {
		width: 22px !important;
		height: 22px !important;
	}

	#copyright .follow a.linkedin {
		width: 26px !important;
		height: 22px !important;
	}

	#footer #f-menu {
		padding: 1rem 0 !important;
	}

	#footer #f-menu .footermenu {
		gap: 0.8rem 1.5rem !important;
	}

	#sitemap>.top {
		grid-template-columns: 1fr;
	}

	body.home #main-content .wrapper table~p {
		margin-bottom: 2.5rem !important;
	}

	.engagement-card {
		flex: 1 1 100%;
		padding: 4rem 1.5rem;
		justify-content: center;
	}

	.collaborate-card,
	.join-card {
		padding-left: 1.5rem !important;
		padding-right: 1.5rem !important;
	}

	.engagement-content {
		gap: 1rem;
	}

	.engagement-content p {
		margin: -5px 0 15px 0;
	}

	body.inner #main-content .wrapper>h1:first-of-type {
		float: none;
		width: auto;
	}

	.business-banner img {
		height: 380px !important;
	}

	.business-section {
		margin-bottom: 4rem;
	}

	.business-section:nth-child(odd) .business-banner img {
		border-radius: 0 20px 20px 0 !important;
	}

	.business-section:nth-child(even) .business-banner img {
		border-radius: 20px 0 0 20px !important;
	}

	.btn-red,
	.btn-wo {
		padding: 14px 28px !important;
	}

	#business .section-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 1.5rem;
		margin-bottom: 2.5rem;
	}

	#business .subtitle {
		margin-bottom: 1.5rem;
	}

	#business .header-divider {
		display: none;
	}

	#business .header-bullet-points {
		margin-top: -10px;
	}

	#business .header-bullet-points ul li {
		padding-left: 28px !important;
	}

	.home-business-list {
		gap: 2.5rem;
	}

	.home-business-card.card-left {
		height: 500px !important;
	}

	.home-business-card.card-left {
		border-radius: 0px 24px 24px 0px !important;
	}

	.home-business-card.card-right {
		border-radius: 24px 0px 0px 24px !important;
	}

	.home-business-card.card-left .card-overlay {
		justify-content: flex-end !important;
		padding-left: calc((100vw - 100%) / 2 + 30px) !important;
		padding-right: 30px !important;
	}

	.home-business-card.card-right .card-overlay {
		justify-content: flex-start !important;
		padding-left: 30px !important;
		padding-right: calc((100vw - 100%) / 2 + 30px) !important;
	}

	.home-business-card .card-content {
		width: 480px !important;
		height: 420px !important;
		padding: 0 40px !important;
		border-radius: 20px !important;
		background: rgba(255, 255, 255, 0.75) !important;
		display: flex !important;
		flex-direction: column !important;
		justify-content: center !important;
	}

	.project-grid {
		gap: 20px !important;
	}

	.project-grid-card {
		width: calc(50% - 10px) !important;
	}

	.project-grid-card .image img {
		height: 240px !important;
	}

	.project-grid-card .info,
	.homepage-project-card .info {
		padding: 15px 20px 20px 20px !important;
	}

	.project-grid-card .footer-row {
		flex-direction: row !important;
		align-items: center !important;
		justify-content: space-between !important;
	}

	.project-grid-card .badge {
		padding: 3px 10px !important;
		font-size: 0.75rem !important;
		white-space: nowrap !important;
	}

	.project-grid-card .green-link {
		font-size: 0.8rem !important;
		white-space: nowrap !important;
	}

	.project-detail-map-card {
		height: 380px !important;
	}

	.project-detail-map-wrapper {
		height: 280px !important;
	}

	.project-gallery-tabs-section .tab-nav {
		margin-bottom: 25px !important;
	}

	.project-gallery-grid {
		gap: 2.4rem !important;
	}

	.project-enquiry-form .form-footer {
		flex-direction: column;
		align-items: flex-start;
	}

	.leader-section {
		padding: 40px 15px;
	}

	.leader-tabs-container {
		margin-bottom: 40px;
		display: block;
		width: 100%;
	}

	.leader-tabs-line {
		display: none;
	}

	.tab-nav.leader-tabs {
		flex-direction: column;
		align-items: stretch;
		width: 100%;
		gap: 12px;
		padding: 0 !important;
		background-color: transparent;
		box-sizing: border-box !important;
	}

	.tab-nav.leader-tabs .tab-btn {
		width: 100%;
		box-sizing: border-box !important;
	}

	.directors-tier.tier-2 {
		gap: 40px 20px;
	}

	.director-card {
		width: 100%;
	}

	.chairman-card .director-image-wrapper,
	.bod-card .director-image-wrapper {
		width: 240px;
		height: 240px;
	}

	.director-name-badge {
		width: 240px !important;
	}

	.milestone-section {
		margin-top: 60px;
		margin-bottom: 40px;
	}

	.timeline-dates-capsule {
		padding: 15px 20px;
		margin-bottom: 20px;
	}

	.timeline-nav-scroll {
		margin: 0;
	}

	.timeline-nav-item .month {
		font-size: 0.8rem;
		margin-bottom: 3px;
	}

	.timeline-nav-item .year {
		font-size: 0.95rem;
		margin-top: 0;
	}

	.timeline-nav-item.active .month {
		font-size: 1.5rem;
	}

	.timeline-nav-item.active .year {
		font-size: 1.25rem;
	}

	.timeline-bar-wrapper {
		margin-bottom: 30px;
	}

	.milestone-slider-track {
		gap: 20px;
	}

	.milestone-card {
		flex: 0 0 calc((100% - 40px) / 3);
		height: auto;
	}

	.milestone-card-body {
		padding: 20px;
		flex: 1;
		height: auto;
	}

	.milestone-card-body h3 {
		font-size: 1.1rem;
	}

	.projects-section-container .tab-nav {
		flex-direction: column;
		width: 100%;
		gap: 10px;
	}

	.projects-section-container .tab-nav::after {
		display: none;
	}

	.projects-section-container .tab-btn {
		width: 100%;
		text-align: center;
	}

	.project-detail-title {
		font-size: 2.8rem;
	}

	.project-detail-metadata-grid {
		grid-template-columns: 1fr !important;
		row-gap: 20px !important;
	}

	.project-meta-item.span-2,
	.project-detail-metadata-grid .left-column,
	.project-detail-metadata-grid .right-column {
		grid-column: span 1 !important;
	}

	.project-detail-metadata-grid .project-meta-group {
		grid-column: span 1 !important;
		display: flex !important;
		flex-direction: column !important;
		row-gap: 20px !important;
	}

	.project-detail-metadata-grid .project-meta-group .left-column {
		order: 1 !important;
	}

	.project-detail-metadata-grid .project-meta-group .right-column {
		order: 2 !important;
	}

	.project-detail-metadata-grid .project-meta-group div:empty {
		display: none !important;
	}

	.project-detail-metadata-grid .section-title-item {
		margin-bottom: -5px !important;
		margin-top: 10px !important;
	}

	.project-gallery-grid {
		grid-template-columns: 1fr;
		gap: 2rem !important;
	}

	.project-enquiry-intro {
		padding: 4.5rem 1.25rem;
	}

	.project-enquiry-intro h4 {
		font-size: 1.05rem;
		margin-bottom: 2rem;
	}

	#tbProjectEnquiryForm table.tbContactform td {
		padding-bottom: 2rem !important;
	}

	#tbProjectEnquiryForm table.tbContactform tr:last-child {
		display: flex;
		flex-direction: column;
		gap: 1.5rem;
	}

	#tbProjectEnquiryForm table.tbContactform td.captcha,
	#tbProjectEnquiryForm table.tbContactform td.button {
		width: 100% !important;
		text-align: left;
	}

	#tbProjectEnquiryForm table.tbContactform td.button .btn-red {
		width: 100%;
		text-align: center;
	}

	#tbProjectEnquiryForm table.tbContactform td.terms div,
	#tbContactform table.tbContactform td.terms div,
	#tbJobForm table.tbContactform td.terms div {
		align-items: flex-start !important;
	}

	#tbProjectEnquiryForm table.tbContactform td.terms input[type="checkbox"],
	#tbContactform table.tbContactform td.terms input[type="checkbox"],
	#tbJobForm table.tbContactform td.terms input[type="checkbox"] {
		margin-top: 3px !important;
	}

	#tbContactform table.tbContactform td,
	#tbJobForm table.tbContactform td {
		display: block !important;
		width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		padding-bottom: 1.5rem !important;
		box-sizing: border-box;
	}

	#tbContactform table.tbContactform tr:last-child,
	#tbJobForm table.tbContactform tr:last-child {
		display: flex;
		flex-direction: column;
		gap: 1.5rem;
	}

	#tbContactform table.tbContactform td.captcha,
	#tbContactform table.tbContactform td.button,
	#tbJobForm table.tbContactform td.captcha,
	#tbJobForm table.tbContactform td.button {
		width: 100% !important;
		text-align: left;
	}

	#tbProjectEnquiryForm table.tbContactform td.captcha,
	#tbContactform table.tbContactform td.captcha,
	#tbJobForm table.tbContactform td.captcha {
		margin-bottom: 1.5rem !important;
	}

	#tbContactform table.tbContactform td.button .btn-wo,
	#tbJobForm table.tbContactform td.button .btn-wo {
		width: 100%;
		text-align: center;
	}

	#news-list-section .tab-nav {
		margin-bottom: 30px;
		gap: 10px;
	}

	#news-list-section .tab-nav::after {
		display: none;
	}

	.news-detail-container {
		padding: 2.5rem 1rem;
	}

	.news-detail-title {
		font-size: 2.2rem;
		margin-bottom: 1.5rem;
	}

	.news-detail-navigation .nav-links {
		flex-direction: column;
	}

	.news-detail-navigation .nav-item {
		width: 100%;
	}

	.news-detail-navigation .nav-item.next-item {
		align-items: flex-start;
	}

	.news-detail-navigation .next-item .nav-card {
		flex-direction: row;
	}

	.news-detail-navigation .next-item .nav-info {
		text-align: left;
	}

	.news-detail-navigation .nav-card {
		height: 90px;
	}

	.news-detail-navigation .nav-thumb {
		width: 110px;
	}

	.credentials-header {
		padding: 0 !important;
	}

	.credentials-header h1 {
		font-size: clamp(1.8rem, 5vw, 2.25rem) !important;
		line-height: 1.25 !important;
	}

	.credentials-header p {
		font-size: clamp(0.85rem, 3vw, 0.95rem) !important;
		line-height: 1.5 !important;
	}

	.credentials-grid {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		grid-auto-rows: 1fr !important;
		gap: 20px !important;
	}

	.credential-card {
		max-width: 100% !important;
		min-height: 150px !important;
	}

	.homepage-projects-slider {
		grid-template-columns: 1fr;
	}

	.accordion-header {
		padding: 18px 20px;
		font-size: 1rem;
	}

	.accordion-body {
		padding: 25px 20px;
	}

	.career-accordion {
		margin-top: 30px;
	}

	.page-header {
		padding-bottom: 20px !important;
	}

	.tab-nav {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 10px !important;
		width: 100% !important;
	}

	.tab-nav::after {
		display: none !important;
	}

	.tab-btn {
		width: 100% !important;
		text-align: center !important;
		box-sizing: border-box !important;
		padding: 12px 20px !important;
	}

	#tbContactform table.tbContactform,
	#tbJobForm table.tbContactform,
	#tbProjectEnquiryForm table.tbContactform,
	#tbContactform table.tbContactform tbody,
	#tbJobForm table.tbContactform tbody,
	#tbProjectEnquiryForm table.tbContactform tbody,
	#tbContactform table.tbContactform tr,
	#tbJobForm table.tbContactform tr,
	#tbProjectEnquiryForm table.tbContactform tr,
	#tbContactform table.tbContactform td,
	#tbJobForm table.tbContactform td,
	#tbProjectEnquiryForm table.tbContactform td {
		display: block !important;
		width: 100% !important;
	}

	#tbContactform table.tbContactform td:first-child:not([colspan]),
	#tbJobForm table.tbContactform td:first-child:not([colspan]) {
		padding-right: 0 !important;
	}

	#tbContactform table.tbContactform td:last-child:not([colspan]),
	#tbJobForm table.tbContactform td:last-child:not([colspan]) {
		padding-left: 0 !important;
	}

	#tbContactform table.tbContactform td,
	#tbJobForm table.tbContactform td,
	#tbProjectEnquiryForm table.tbContactform td {
		padding: 0 0 20px 0 !important;
	}

	#tbContactform table.tbContactform td.terms,
	#tbJobForm table.tbContactform td.terms,
	#tbProjectEnquiryForm table.tbContactform td.terms {
		padding: 10px 0 25px 0 !important;
	}

	#tbContactform table.tbContactform td.captcha,
	#tbJobForm table.tbContactform td.captcha,
	#tbProjectEnquiryForm table.tbContactform td.captcha {
		padding-bottom: 20px !important;
	}

	#tbContactform table.tbContactform td.button,
	#tbJobForm table.tbContactform td.button,
	#tbProjectEnquiryForm table.tbContactform td.button {
		text-align: left !important;
		padding-bottom: 0 !important;
	}

	#tbContactform table.tbContactform td.button .btn-wo,
	#tbJobForm table.tbContactform td.button .btn-wo,
	#tbProjectEnquiryForm table.tbContactform td.button .btn-red {
		width: 100% !important;
		display: block !important;
		text-align: center !important;
	}

	.certsawards-modal-content {
		padding: 0;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.certsawards-modal-overlay {
		padding: 0 !important;
		overflow: hidden !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
	}

	.certsawards-modal-overlay::before {
		display: none !important;
	}

	.certsawards-modal-container {
		width: 100% !important;
		max-width: 100% !important;
		height: 100% !important;
		max-height: 100% !important;
		border-radius: 0 !important;
		margin: 0 !important;
		display: flex !important;
		flex-direction: column !important;
		transform: none !important;
		-webkit-transform: none !important;
	}

	.certsawards-modal-content {
		height: 100% !important;
		display: flex !important;
		flex-direction: column !important;
	}

	.certsawards-modal-img-wrapper {
		flex: 1 !important;
		padding: 10px !important;
		display: flex !important;
		justify-content: center !important;
		align-items: center !important;
		overflow: hidden !important;
		background-color: #f8f9fa !important;
	}

	.certsawards-modal-img-container {
		display: inline-flex !important;
		justify-content: center !important;
		align-items: center !important;
		max-width: 100% !important;
		max-height: 100% !important;
		width: auto !important;
		height: 100% !important;
	}

	.certsawards-modal-img-wrapper img {
		max-width: 100% !important;
		max-height: 100% !important;
		width: auto !important;
		height: auto !important;
		object-fit: contain !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		transition: transform 0.15s ease-out !important;
	}

	.certsawards-modal-bottom-bar {
		padding: 12px 15px !important;
		background-color: #ffffff !important;
		border-top: 1px solid #e9ecef !important;
	}

	.project-gallery-modal-img-wrapper {
		padding: 40px 0 !important;
	}

	.project-gallery-modal-img-wrapper img {
		max-width: 100% !important;
		max-height: 100% !important;
		width: auto !important;
		height: auto !important;
	}

	.project-modal-nav-btn {
		background-color: #ffffff !important;
		border: 1px solid #e9ecef !important;
		border-radius: 50% !important;
		width: 44px !important;
		height: 44px !important;
		background-position: center !important;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
		transition: all 0.2s ease !important;
		z-index: 55;
		top: 50% !important;
		transform: translateY(-50%) !important;
	}

	.project-gallery-modal-img-container:has(img:hover, .project-gallery-modal-nav-overlay:hover) .project-modal-nav-btn,
	.project-gallery-modal-img-container .project-modal-nav-btn:hover {
		opacity: 0.85 !important;
		visibility: visible !important;
		pointer-events: auto !important;
	}

	.project-modal-nav-btn:hover {
		opacity: 1 !important;
		background-color: #ffffff !important;
		box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2) !important;
		visibility: visible !important;
		pointer-events: auto !important;
	}

	.certsawards-modal-nav-outside {
		display: none !important;
	}

	.project-modal-nav-btn.prev-btn {
		left: 15px !important;
		background-position: calc(50% - 1.5px) center !important;
		background-size: 16px !important;
	}

	.project-modal-nav-btn.next-btn {
		right: 15px !important;
		background-position: calc(50% + 1.5px) center !important;
		background-size: 16px !important;
	}

	.project-gallery-modal-overlay.zoomed .project-modal-nav-btn {
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}

	.project-modal-close-btn,
	.certsawards-modal-close-btn {
		opacity: 1 !important;
	}
}

@media only screen and (max-width: 650px) {
	.vm-banner {
		height: 400px !important;
	}

	body.about-us #vision-mission .vm-banner table tr {
		grid-template-columns: auto 40px 1fr !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(2),
	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(3) {
		font-size: 4.5rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:first-of-type,
	body.about-us #vision-mission .vm-banner table td:first-child p:last-of-type {
		font-size: 0.85rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h1:nth-of-type(2) {
		margin-top: 20px !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h1 {
		font-size: 1.6rem !important;
		margin: 0 !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h3 {
		font-size: 1.05rem !important;
		line-height: 1.3 !important;
		margin: 5px 0 0 0 !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h4 {
		font-size: 0.85rem !important;
		line-height: 1.35 !important;
		margin: 5px 0 0 0 !important;
	}

	#header-top #title {
		display: flex !important;
		font-size: clamp(0.9rem, 3.2vw, 1.2rem) !important;
		margin-left: 0.5rem !important;
	}

	#banner-contant,
	.nivoSlider,
	.nivo-main-image,
	.nivo-slide {
		height: auto !important;
	}

	.inner #banner-contant {
		height: 240px !important;
	}

	.nivo-caption {
		--nivo-caption-bottom: 1.5rem;
		bottom: var(--nivo-caption-bottom);
	}

	.nivo-caption .wrapper>div {
		max-width: 100% !important;
	}

	.nivo-caption p.title {
		font-size: 2.0rem !important;
		max-width: 100%;
	}

	.nivo-caption p.desc,
	.nivo-caption .banner-info {
		font-size: 0.85rem !important;
		line-height: 1.2 !important;
	}

	.nivo-caption a.btn-red,
	.nivo-caption a.btn-wo {
		margin-top: 10px !important;
	}

	.tab-menu {
		margin-top: -1rem;
	}

	.h-newsevent-featured {
		height: 320px !important;
	}

	.milestone-card {
		flex: 0 0 100%;
		max-width: 100%;
	}
}

@media only screen and (max-width: 576px) {
	:root {
		font-size: 12px;
		--wrapper-padding: 20px;
	}

	body.careers #message .wrapper>h1:first-of-type {
		margin-top: 4.5rem;
	}

	body.careers #message .wrapper>p:last-of-type {
		margin-bottom: 2rem;
	}

	.certsawards-grid {
		grid-template-columns: 1fr;
		gap: 35px 0;
	}

	.certsawards-modal-header {
		display: block !important;
		padding: 12px 15px !important;
		background-color: #ffffff !important;
		border-bottom: 1px solid #e9ecef !important;
		width: 100% !important;
		box-sizing: border-box !important;
	}

	.certsawards-modal-title-top {
		display: block !important;
		font-size: 15px !important;
		font-weight: 600 !important;
		color: #212529 !important;
		margin: 0 !important;
		line-height: 1.3 !important;
		word-wrap: break-word !important;
		text-align: center !important;
	}

	.certsawards-modal-title-bottom {
		display: none !important;
	}

	.certsawards-modal-bottom-left {
		display: contents !important;
	}

	.certsawards-modal-img-wrapper {
		padding: 10px 0 !important;
	}

	.certsawards-modal-img-container {
		width: 100% !important;
		height: auto !important;
		max-height: 100% !important;
		display: flex !important;
	}

	.certsawards-modal-img-wrapper img {
		width: 100% !important;
		height: auto !important;
		max-height: 100% !important;
		object-fit: contain !important;
	}

	.wrapper {
		padding: 3.8rem 20px 4rem 20px !important;
	}

	.newsevent #main-content>.wrapper {
		padding-top: 3.85rem !important;
		padding-bottom: 1.65rem !important;
	}

	#projects {
		scroll-margin-top: -3.8rem !important;
	}

	body.about-us,
	body.our-leaders {
		--intro-spacing: 2rem;
	}

	body.core-business,
	body.project-detail {
		--intro-spacing: 2.5rem;
	}

	#header-top .wrapper,
	#header-container .wrapper,
	.nivo-caption .wrapper,
	#footer .wrapper,
	#copyright .wrapper {
		padding: 0 20px !important;
	}

	.vm-banner {
		padding: 20px 15px 20px calc((100vw - 100%) / 2) !important;
		height: 380px !important;
	}

	body.about-us #vision-mission .vm-banner table tr {
		grid-template-columns: auto 30px 1fr !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(2),
	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(3) {
		font-size: 4.0rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:first-of-type,
	body.about-us #vision-mission .vm-banner table td:first-child p:last-of-type {
		font-size: 0.78rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child hr {
		width: 90%;
	}

	body.about-us #company-info table tr {
		grid-template-columns: 1fr !important;
		gap: 25px !important;
		padding: 20px 0 !important;
	}

	body.about-us #company-info table tr>td:first-child:nth-last-child(3)~td:last-child,
	body.about-us #company-info table tr>td:first-child:nth-last-child(2)~td:last-child {
		grid-column: auto !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h1:nth-of-type(2) {
		margin-top: 20px !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h1 {
		font-size: 1.4rem !important;
		margin: 0 !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h3 {
		font-size: 0.95rem !important;
		line-height: 1.3 !important;
		margin: 5px 0 0 0 !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h4 {
		font-size: 0.8rem !important;
		line-height: 1.35 !important;
		margin: 5px 0 0 0 !important;
	}

	.chairman-card .director-image-wrapper,
	.bod-card .director-image-wrapper {
		width: 200px !important;
		height: 200px !important;
	}

	.director-name-badge {
		width: 200px !important;
		min-height: 40px !important;
		padding: 8px 16px !important;
		margin-top: -18px !important;
	}

	.director-name-badge span {
		font-size: 0.75rem !important;
	}

	.director-position {
		font-size: 0.85rem !important;
		margin-top: 10px !important;
	}

	.directors-tier.tier-2 {
		gap: 30px 15px !important;
	}

	h1 {
		line-height: 1.1;
		letter-spacing: 0.02em !important;
	}

	h2,
	h3,
	h4 {
		line-height: 1.3;
		letter-spacing: 0 !important;
	}

	body.home #main-content .wrapper img {
		height: auto !important;
		aspect-ratio: 1400 / 500 !important;
		border-radius: 15px !important;
		margin-top: 25px !important;
		margin-bottom: -4rem !important;
	}

	body.home #main-content .wrapper>table {
		display: grid !important;
		grid-template-columns: 1fr auto auto 1fr !important;
		column-gap: 12px !important;
		align-items: center !important;
		justify-items: center !important;
		width: 100% !important;
	}

	body.home #main-content .wrapper>table td:first-child {
		justify-self: end !important;
		align-self: start !important;
		padding: 0 !important;
		text-align: right !important;
		font-size: 0.75rem !important;
		line-height: 1.2 !important;
	}

	body.home #main-content .wrapper>table td:last-child {
		justify-self: start !important;
		align-self: end !important;
		padding: 0 !important;
		text-align: left !important;
		font-size: 0.75rem !important;
		line-height: 1.2 !important;
	}

	body.home #main-content .wrapper>table td:nth-child(2) h2 {
		justify-self: end !important;
		align-self: center !important;
		margin: 0 12px 0 0 !important;
		font-size: 2.2rem !important;
		line-height: 1 !important;
	}

	body.home #main-content .wrapper>table td:nth-child(3) h2 {
		justify-self: start !important;
		align-self: center !important;
		margin: 0 0 0 12px !important;
		font-size: 2.2rem !important;
		line-height: 1 !important;
	}

	body.home #main-content .wrapper>table td:nth-child(2) h2::after {
		right: -18px !important;
		top: 50% !important;
		transform: translateY(-50%) !important;
		width: 1px !important;
		height: 35px !important;
		background-color: var(--color-border-grey) !important;
		bottom: auto !important;
	}

	#logo a,
	#logo a img {
		height: 35px !important;
	}

	#header-top #title {
		display: flex !important;
		font-size: clamp(0.8rem, 3vw, 1.1rem) !important;
		margin-left: 0.4rem !important;
	}

	.slicknav_btn {
		height: 35px !important;
		padding: 0 14px !important;
		right: 20px !important;
	}

	#banner-contant {
		height: auto !important;
	}

	.inner #banner-contant {
		height: 220px !important;
	}

	.nivoSlider,
	.nivo-main-image,
	.nivo-slide {
		height: 100% !important;
	}

	.nivo-caption {
		--nivo-caption-bottom: 1.2rem;
		bottom: var(--nivo-caption-bottom);
	}

	.nivo-caption p.title {
		font-size: 1.8rem !important;
		line-height: 1.1 !important;
	}

	.nivo-caption p.desc {
		font-size: 0.8rem !important;
		margin-top: -0.3rem !important;
		line-height: 1.2 !important;
	}

	.nivo-caption a.btn-red,
	.nivo-caption a.btn-wo {
		font-size: 0.75rem !important;
		margin-top: 8px !important;
		margin-right: 8px !important;
	}

	#footer-menu2 a {
		margin: 5px 1rem;
	}

	body.inner #main-content .wrapper {
		padding-top: 1.5rem;
	}

	body.contact #main-content .wrapper {
		padding-bottom: 2.5rem;
	}

	.business-banner img {
		height: 250px !important;
	}

	.business-banner {
		margin-bottom: 30px;
	}

	.btn-red,
	.btn-wo {
		padding: 10px 20px !important;
	}

	#business .header-bullet-points ul li {
		padding-left: 26px !important;
	}

	.business-desc {
		font-size: 1rem;
	}

	.business-desc p {
		font-size: 1rem;
	}

	.browse-projects-btn {
		padding: 14px 30px;
		font-size: 0.8rem;
	}

	.home-business-card.card-left {
		height: 420px !important;
	}

	.home-business-card.card-left .card-overlay {
		padding: 20px 30px 20px 30px !important;
	}

	.home-business-card.card-right .card-overlay {
		padding: 20px 30px 20px 30px !important;
	}

	.home-business-card .card-content {
		width: 100% !important;
		height: auto !important;
		max-height: calc(100% - 30px) !important;
		padding: 40px 25px !important;
	}

	.home-business-card .card-desc {
		margin-bottom: 20px;
	}

	.project-grid-card {
		width: 100% !important;
	}

	.project-grid-card .image img {
		height: 200px !important;
	}

	.project-grid-card .info,
	.homepage-project-card .info {
		padding: 15px 20px 20px 20px !important;
	}

	.project-grid-card .title {
		font-size: 1.2rem !important;
	}

	.project-grid-card .meta {
		font-size: 0.9rem !important;
		margin-bottom: 12px !important;
	}

	.project-grid-card .badge {
		padding: 3px 12px !important;
		font-size: 0.8rem !important;
	}

	.project-detail-specs-map-section {
		margin: 3rem 0 !important;
		gap: 30px !important;
	}

	.project-detail-metadata-grid {
		grid-template-columns: 1fr !important;
		row-gap: 15px !important;
	}

	.project-meta-item.span-2,
	.project-detail-metadata-grid .left-column,
	.project-detail-metadata-grid .right-column {
		grid-column: span 1 !important;
	}

	.project-detail-metadata-grid .project-meta-group {
		row-gap: 15px !important;
	}

	.project-detail-metadata-grid .section-title-item {
		margin-bottom: -5px !important;
		margin-top: 10px !important;
	}

	.newsevent-card-content {
		padding: 20px;
	}

	.project-detail-map-card {
		height: 320px !important;
		border-radius: 12px !important;
	}

	.project-detail-map-wrapper {
		height: 220px !important;
	}

	.project-detail-map-bar {
		padding: 15px 20px !important;
		flex-direction: column !important;
		align-items: center !important;
		gap: 10px !important;
	}

	.project-detail-map-location-name {
		font-size: 1.1rem !important;
		padding-right: 0 !important;
		text-align: center !important;
	}

	.project-detail-map-btn {
		width: 100% !important;
		text-align: center !important;
		box-sizing: border-box !important;
		padding: 8px 16px !important;
	}

	.project-gallery-tabs-section .tab-nav {
		margin-bottom: 20px !important;
	}

	.project-gallery-grid {
		grid-template-columns: 1fr !important;
		gap: 1.6rem !important;
	}

	.project-gallery-image-wrapper {
		border-radius: 16px !important;
	}

	body.careers #feature table tr {
		grid-template-columns: 1fr;
		gap: 25px;
	}

	body.careers #feature table {
		margin-bottom: 3.5rem;
	}

	body.careers #feature table td {
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding-left: 85px;
		min-height: 70px;
		box-sizing: border-box;
	}

	body.careers #feature table td img {
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 70px !important;
		height: 70px !important;
		margin-bottom: 0;
	}

	body.careers #feature table td h4 {
		margin-top: 0;
		margin-bottom: 5px;
		min-height: 0;
		max-width: none;
		line-height: 1.2;
	}

	body.careers #feature table td p {
		margin: 0;
	}

	.h-newsevent-featured {
		height: 290px !important;
	}

	.page-header {
		padding-bottom: 20px !important;
		padding-left: 15px !important;
		padding-right: 15px !important;
	}

	.credentials-grid {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		grid-auto-rows: 1fr !important;
		gap: 12px !important;
	}

	.credential-card {
		max-width: 100% !important;
		min-height: 125px !important;
		padding: 12px !important;
	}

	.credential-card img {
		max-height: 60px !important;
	}

	.credential-card-title {
		font-size: 0.75rem !important;
		margin-top: 8px !important;
		line-height: 1.2 !important;
	}

	.newsevent-detail-action {
		margin: 15px 0 10px 0 !important;
	}

	.newsevent-detail-navigation .nav-thumb {
		width: 100px;
		height: 70px;
		border-radius: 8px;
	}

	.newsevent-detail-navigation .nav-label {
		font-size: 0.9rem;
		margin-bottom: 8px;
		gap: 10px;
	}

	.newsevent-detail-navigation .nav-title {
		font-size: 0.95rem;
	}

	.newsevent-detail-navigation .nav-links {
		gap: 20px;
	}

	.newsevent-detail-navigation .nav-card {
		gap: 15px;
	}

	.accordion-header {
		padding: 16px 15px !important;
		font-size: 0.95rem !important;
	}

	.accordion-body {
		padding: 20px 15px !important;
	}

	.collaborate-card,
	.join-card {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	.h-newsevent-thumb {
		width: 120px !important;
		height: 90px !important;
		border-radius: 12px !important;
	}

	.h-newsevent-info {
		padding-left: 15px !important;
	}

	.h-newsevent-badge {
		padding: 4px 15px !important;
	}

	.h-newsevent-meta {
		gap: 10px !important;
	}

	.h-newsevent-list .h-newsevent-date {
		font-size: 0.85rem !important;
		white-space: nowrap !important;
	}

	.h-newsevent-title {
		font-size: 0.95rem !important;
		line-height: 1.3 !important;
	}

	.h-newsevent-featured {
		height: 280px !important;
	}

	body.residential #highlight {
		height: 350px !important;
		min-height: 380px !important;
	}

	body.careers #banner {
		height: 350px !important;
	}

	body.residential #highlight .wrapper::after {
		width: auto !important;
		height: auto !important;
		top: 30px !important;
		bottom: 30px !important;
		left: 30px !important;
		right: 45px !important;
		transform: none !important;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		width: calc((100vw + 100%) / 2 - 20px) !important;
		height: 100% !important;
		border-radius: 0px 20px 20px 0px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		margin-left: 55px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		width: calc(100% - 125px) !important;
	}

	.project-detail-main-image {
		border-radius: 0 20px 20px 0 !important;
	}
}

@media only screen and (max-width: 450px) {
	:root {
		font-size: 11.5px;
		--wrapper-padding: 15px;
		--h1-font-size: 2.125rem;
		--h2-font-size: 1.8125rem;
		--font-size-title: 1.375rem;
		--h3-font-size: 1.1875rem;
		--h4-font-size: 1.0rem;
	}

	.wrapper {
		padding: 3.3rem 15px 3.5rem 15px !important;
	}

	.newsevent #main-content>.wrapper {
		padding-top: 3.35rem !important;
		padding-bottom: 1.45rem !important;
	}

	#projects {
		scroll-margin-top: -3.3rem !important;
	}

	#header-top .wrapper,
	#header-container .wrapper,
	.nivo-caption .wrapper,
	#footer .wrapper,
	#copyright .wrapper {
		padding: 0 15px !important;
	}

	body.residential #highlight {
		height: 280px !important;
		min-height: 380px !important;
	}

	body.careers #banner {
		height: 280px !important;
	}

	body.residential #highlight .wrapper::after {
		width: auto !important;
		height: auto !important;
		left: 20px !important;
		right: 30px !important;
		top: 20px !important;
		bottom: 20px !important;
		transform: none !important;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		width: calc((100vw + 100%) / 2 - 15px) !important;
		height: 100% !important;
		border-radius: 0px 16px 16px 0px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		margin-left: 35px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		width: calc(100% - 80px) !important;
	}

	.business-banner img {
		height: 200px !important;
	}

	.h-newsevent-thumb {
		width: 100px !important;
		height: 75px !important;
		border-radius: 10px !important;
	}

	.h-newsevent-info {
		padding-left: 12px !important;
	}

	.h-newsevent-badge {
		padding: 3px 10px !important;
		font-size: 0.75rem !important;
	}

	.h-newsevent-meta {
		gap: 8px !important;
	}

	.h-newsevent-list .h-newsevent-date {
		font-size: 0.8rem !important;
		white-space: nowrap !important;
	}

	.h-newsevent-title {
		font-size: 0.88rem !important;
		line-height: 1.25 !important;
	}

	.h-newsevent-featured {
		height: 230px !important;
	}

	body.home #main-content .wrapper img {
		height: auto !important;
		aspect-ratio: 1400 / 550 !important;
		margin-top: 20px !important;
		margin-bottom: -3.5rem !important;
	}

	#banner-contant {
		height: auto !important;
	}

	.inner #banner-contant {
		height: 180px !important;
	}

	#logo a,
	#logo a img {
		height: 30px !important;
	}

	.slicknav_btn {
		height: 30px !important;
		box-sizing: border-box !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 0px 12px !important;
		font-size: 0.68rem !important;
		right: 15px !important;
	}

	.slicknav_menu .slicknav_icon-bar {
		width: 1.1rem !important;
		height: 2px !important;
		margin-bottom: 2px !important;
	}

	#header-top #title {
		display: flex !important;
		font-size: clamp(0.7rem, 2.7vw, 0.85rem) !important;
		margin-left: 0.3rem !important;
		white-space: nowrap !important;
	}

	.nivoSlider,
	.nivo-main-image,
	.nivo-slide {
		height: 100% !important;
	}

	.nivo-caption {
		--nivo-caption-bottom: 1rem;
		bottom: var(--nivo-caption-bottom);
	}

	.nivo-caption p.title {
		font-size: 1.6rem !important;
	}

	.nivo-caption p.desc {
		display: block !important;
		font-size: 0.8rem !important;
		line-height: 1.25 !important;
		margin-top: -6px !important;
	}

	.nivo-caption a.btn-red,
	.nivo-caption a.btn-wo {
		padding: 0.375rem 0.75rem !important;
		font-size: 0.7rem !important;
		margin-top: 6px !important;
		margin-right: 6px !important;
	}

	div.g-recaptcha>div {
		width: 100% !important;
		height: auto !important;
	}

	body.careers #feature table {
		margin-bottom: 2.5rem;
	}

	body.careers #feature table td {
		padding-left: 67px;
		min-height: 55px;
	}

	body.careers #feature table td img {
		width: 55px !important;
		height: 55px !important;
	}

	.career-accordion {
		margin-top: 20px !important;
	}

	.accordion-header {
		padding: 14px 12px !important;
		font-size: 0.9rem !important;
	}

	.accordion-body {
		padding: 15px 12px !important;
	}

	.accordion-body ul li {
		padding-left: 15px !important;
		font-size: 0.85rem !important;
	}

	.accordion-body ul li::before {
		font-size: 1.2rem !important;
		top: -1px !important;
	}

	.accordion-body strong {
		font-size: 0.9rem !important;
	}

	.career-closing-date {
		margin-top: 18px !important;
		margin-bottom: 20px !important;
		font-size: 0.85rem !important;
	}

	#tbJobForm table.tbContactform td.resume input[type="file"]::file-selector-button {
		padding: 12px 22px !important;
		margin-right: 10px;
	}

	.certsawards-grid {
		grid-template-columns: 1fr !important;
		gap: 20px !important;
	}

	.collaborate-card,
	.join-card {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
}

@media only screen and (max-width: 414px) {
	:root {
		font-size: 11px;
		--wrapper-padding: 20px;
	}

	.vm-banner {
		padding: 15px 10px 15px calc((100vw - 100%) / 2) !important;
		height: 320px !important;
	}

	body.about-us #vision-mission .vm-banner table tr {
		grid-template-columns: auto 20px 1fr !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child hr {
		width: 80%;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(2),
	body.about-us #vision-mission .vm-banner table td:first-child p:nth-of-type(3) {
		font-size: 3.2rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:first-child p:first-of-type,
	body.about-us #vision-mission .vm-banner table td:first-child p:last-of-type {
		font-size: 0.7rem !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h1 {
		font-size: 1.25rem !important;
		margin: 0 !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h3 {
		font-size: 0.85rem !important;
		margin: 0 !important;
	}

	body.about-us #vision-mission .vm-banner table td:last-child h4 {
		font-size: 0.75rem !important;
		margin: 0 !important;
	}

	body.about-us #vision-mission>table td {
		padding: 20px 15px 20px 30px !important;
		column-gap: 15px !important;
	}

	body.about-us #vision-mission>table td::after {
		left: 8px !important;
	}

	body.about-us #vision-mission>table td>h1:first-of-type {
		font-size: 70px !important;
	}

	.nivo-caption p.title {
		font-size: 1.5rem !important;
	}

	.nivo-caption p.desc {
		font-size: 0.75rem !important;
	}

	#header-top #title {
		font-size: clamp(0.65rem, 2.5vw, 0.8rem) !important;
	}

	.home-business-card.card-left {
		height: 380px !important;
	}

	.home-business-card .card-content {
		padding: 30px 20px !important;
	}

	body.home #main-content .wrapper>table {
		grid-template-columns: 1fr auto auto 1fr !important;
		column-gap: 4px !important;
	}

	body.home #main-content .wrapper>table td:first-child,
	body.home #main-content .wrapper>table td:last-child {
		font-size: 0.65rem !important;
	}

	body.home #main-content .wrapper>table h2 {
		font-size: 1.6rem !important;
	}

	body.home #main-content .wrapper>table td:nth-child(2) h2 {
		margin-right: 8px !important;
	}

	body.home #main-content .wrapper>table td:nth-child(3) h2 {
		margin-left: 8px !important;
	}

	body.home #main-content .wrapper>table td:nth-child(2) h2::after {
		right: -9px !important;
		height: 25px !important;
	}

	body.residential #highlight {
		height: 250px !important;
		min-height: 380px !important;
	}

	body.careers #banner {
		height: 250px !important;
	}

	body.residential #highlight .wrapper::after {
		width: auto !important;
		height: auto !important;
		left: 20px !important;
		right: 35px !important;
		top: 20px !important;
		bottom: 20px !important;
		transform: none !important;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		width: calc((100vw + 100%) / 2 - 20px) !important;
		height: 100% !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		margin-left: 35px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		width: calc(100% - 85px) !important;
	}
}

@media only screen and (max-width: 320px) {
	:root {
		--wrapper-padding: 15px;
	}

	.wrapper {
		padding: 1.9rem 15px 2rem 15px !important;
	}

	.newsevent #main-content>.wrapper {
		padding-top: 1.95rem !important;
		padding-bottom: 0.85rem !important;
	}

	#projects {
		scroll-margin-top: -1.9rem !important;
	}

	body.home #main-content .wrapper table~p img {
		height: auto !important;
		aspect-ratio: 1400 / 600 !important;
		margin-top: 15px !important;
		margin-bottom: -4rem !important;
	}

	.h-newsevent-featured {
		height: 190px !important;
	}

	.nivo-caption p.desc {
		display: none !important;
	}

	.nivo-caption a.btn-red,
	.nivo-caption a.btn-wo {
		padding: 5px 10px !important;
		font-size: 0.6rem !important;
		margin-top: 2px !important;
		margin-right: 4px !important;
	}

	.g-recaptcha {
		transform: scale(0.85);
		transform-origin: 0 0;
	}

	body.residential #highlight {
		height: 190px !important;
		min-height: 350px !important;
	}

	body.careers #banner {
		height: 190px !important;
	}

	body.residential #highlight .wrapper::after {
		width: auto !important;
		height: auto !important;
		left: 15px !important;
		right: 30px !important;
		top: 15px !important;
		bottom: 15px !important;
		transform: none !important;
	}

	body.residential #highlight .wrapper img,
	body.careers #banner .wrapper img {
		width: calc((100vw + 100%) / 2 - 15px) !important;
		height: 100% !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		margin-left: 27px !important;
	}

	body.residential #highlight .wrapper>h3,
	body.residential #highlight .wrapper>ul,
	body.residential #highlight .wrapper>p:has(a) {
		width: calc(100% - 69px) !important;
	}
}

/* ==========================================================================
   ENTRANCE AND SCROLL REVEAL ANIMATIONS
   ========================================================================== */
@keyframes captionSlideUp {
	from {
		opacity: 0;
		transform: translate3d(0, 35px, 0);
	}

	to {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

.nivo-caption p.title,
.loading-caption p.title,
.nivo-caption p.title.animate-caption,
.nivo-caption p.desc,
.loading-caption p.desc,
.nivo-caption p.desc.animate-caption,
.nivo-caption a.btn-red,
.loading-caption a.btn-red,
.nivo-caption a.btn-wo,
.loading-caption a.btn-wo,
.nivo-caption a.btn-red.animate-caption,
.nivo-caption a.btn-wo.animate-caption {
	transition: none !important;
	will-change: transform, opacity;
	animation: captionSlideUp 1.0s var(--ease-out-smooth) both;
}

.nivo-caption p.title,
.loading-caption p.title,
.nivo-caption p.title.animate-caption {
	animation-delay: 0.1s;
}

.nivo-caption p.desc,
.loading-caption p.desc,
.nivo-caption p.desc.animate-caption {
	animation-delay: 0.25s;
}

.nivo-caption a.btn-red,
.loading-caption a.btn-red,
.nivo-caption a.btn-wo,
.loading-caption a.btn-wo,
.nivo-caption a.btn-red.animate-caption,
.nivo-caption a.btn-wo.animate-caption {
	animation-delay: 0.4s;
}

@keyframes slideUp {
	from {
		opacity: 0;
		transform: translate3d(0, 50px, 0);
	}
	to {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

body.js-active.home #main-content .wrapper,
body.js-active.about-us #company-tab,
body.js-active.home #business.section-header,
body.js-active .credentials-section,
body.js-active.home .home-business-card,
body.js-active.home .home-business-card .card-content,
body.js-active.home .homepage-projects-header,
body.js-active.home .homepage-project-card-wrapper,
body.js-active.home .h-newsevent-header,
body.js-active.home .h-newsevent-grid,
body.js-active .engagement-content,
body.js-active.about-us #company-info > table,
body.js-active.about-us #vision-mission > h1,
body.js-active.about-us #vision-mission > p,
body.js-active.about-us #milestone .milestone-section,
body.js-active.about-us #vision-mission > .vm-banner td {
	opacity: 0;
	transform: translate3d(0, 50px, 0);
	will-change: transform, opacity;
	transition: opacity 1.1s var(--ease-out-smooth), transform 1.1s var(--ease-out-smooth);
}

body.js-active.about-us #vision-mission > table td {
	opacity: 0;
	transform: translate3d(0, 50px, 0);
	will-change: transform, opacity;
	transition: opacity 1.1s var(--ease-out-smooth), transform 0.3s var(--ease-out);
}

body.js-active.about-us #vision-mission > .vm-banner {
	opacity: 0;
	will-change: opacity;
	transition: opacity 1.1s ease;
}

body.js-active.home #main-content .wrapper.revealed,
body.js-active.about-us #company-tab.revealed,
body.js-active.home #business .section-header.revealed,
body.js-active .credentials-section.revealed,
body.js-active.home .home-business-list.revealed .home-business-card,
body.js-active.home .home-business-list.revealed .home-business-card .card-content,
body.js-active.home .homepage-projects-section.revealed .homepage-projects-header,
body.js-active.home .homepage-projects-section.revealed .homepage-project-card-wrapper,
body.js-active.home .h-newsevent-section.revealed .h-newsevent-header,
body.js-active.home .h-newsevent-section.revealed .h-newsevent-grid,
body.js-active .engagement.revealed .engagement-content,
body.js-active.about-us #company-info > table.revealed,
body.js-active.about-us #vision-mission > h1.revealed,
body.js-active.about-us #vision-mission > p.revealed,
body.js-active.about-us #milestone .milestone-section.revealed,
body.js-active.about-us #vision-mission > .vm-banner.revealed td,
body.js-active.about-us #vision-mission > table.revealed td {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

body.js-active.about-us #vision-mission > .vm-banner.revealed {
	opacity: 1;
}

body.js-active.about-us #company-info > table.revealed,
body.js-active.about-us #milestone .milestone-section.revealed {
	transition-delay: 0.1s;
}

body.js-active.home .home-business-card .card-content,
body.js-active.home .homepage-projects-section.revealed .homepage-project-card-wrapper:nth-child(1),
body.js-active.about-us #vision-mission > .vm-banner.revealed td:first-child {
	transition-delay: 0.15s;
}

body.js-active.about-us #vision-mission > table.revealed tr:first-child td:first-child {
	transition-delay: 0.15s, 0s;
}

body.js-active.home .home-business-list.revealed .home-business-card:nth-child(2),
body.js-active.home .h-newsevent-section.revealed .h-newsevent-grid, 
body.js-active .engagement.revealed .join-card .engagement-content,
body.js-active.about-us #vision-mission > h1.revealed {
	transition-delay: 0.25s;
}

body.js-active.home .homepage-projects-section.revealed .homepage-project-card-wrapper:nth-child(2),
body.js-active.about-us #vision-mission > .vm-banner.revealed td:last-child {
	transition-delay: 0.3s;
}

body.js-active.about-us #vision-mission > table.revealed tr:first-child td:last-child,
body.js-active.about-us #vision-mission > table.revealed tr:last-child td:first-child {
	transition-delay: 0.3s, 0s;
}

body.js-active.about-us #vision-mission > p.revealed {
	transition-delay: 0.35s;
}

body.js-active.home .home-business-list.revealed .home-business-card:nth-child(2) .card-content {
	transition-delay: 0.4s;
}

body.js-active.home .homepage-projects-section.revealed .homepage-project-card-wrapper:nth-child(3) {
	transition-delay: 0.45s;
}

body.js-active.about-us #vision-mission > table.revealed tr:last-child td:last-child {
	transition-delay: 0.45s, 0s;
}

/* Override: inner pages use keyframe animation instead of transition
   because the wrapper is always above the fold on page load */
body.js-active.inner #main-content .wrapper {
	transition: none;
	animation: slideUp 1.1s var(--ease-out-smooth) 0.15s both;
}