/* EXAMPLE GOOGLE FONT EMBED @import url(https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900); */



/* ==|== primary styles =====================================================
   Author: Silverink
   ========================================================================== */



/* ROOT VARIABLES ================================================= */


:root {
	--brand-primary: #80FF00;
	--white: #F7F5F4;
	--black: #141311;
	--base-primary: rgb(144, 138, 132);
	--base-secondary: #B1AAA3;
	--base-tertiary: #DDD9D6;
	--base-light: #EBE8E5;
	---box-shadow: 0px 15px 25px rgba(144, 138, 132, 0.2);
	--font-head: serif;
	--font-body: sans-serif;
	--font-bold: 700;
}


a {
	color: rgba(0, 0, 0, 1)
}




/* ==|== Easibuild Structural Elements =====================================================
   Structural elements such as mainContent/Wide, submenu etc. Ideally these elements will change
   to HTML5 tags...  aside, article etc.
   ========================================================================== */
#mainContentWrapper {
	position: relative;
	z-index: 1;
	background: white;
}


body,
html {
	min-height: 100vh;
	font-weight: 500;

	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-smooth: never;
}

/* body {
    opacity: 0; 
    overflow-x: hidden; 
    transition: opacity 0.3s ease; 
} */
body {
	position: relative;
	font-family: proxima-nova, sans-serif;
	font-size: 26px;
}

/* Hide the default cursor */
body,
body:hover,
a:hover,
img:hover,
.serviceItemBtn:hover {
	cursor: none !important;
}

.btn-rounded {
	border-radius: 50px;
}

.careerPanel .panelContain {
	border-bottom: 1px solid #000;
	padding-top: 30px;
	padding-bottom: 30px;
}

.contentContain {
	z-index: 2 !important;
}

/* APPROACH */

.approachContain {
	padding-top: 110px;
	padding-bottom: 110px;
	border-bottom: 1px solid var(--black)
}

.approachContain.last {
	border-bottom: none !important;
}

.approachPanel strong {
	font-weight: 800 !important;
}

.approachPanel .approachTitle {
	font-size: 108px;
}

.approachPanel .approachText {
	color: #838383;
}

.approachPanel .row {
	padding-top: 100px;
	padding-bottom: 100px;
	border-bottom: 0.5px solid #000;
}

.approachPanel .row:first-child {
	padding-top: 100px;
	padding-bottom: 60px;
}

.ourPeople {
	background: #000;
	color: #fff;
}

.ourPeople h2 {
	margin-bottom: 100px;
}

/* Arrow styling using ::after */
.careerPanel .panelContain strong::after {
	content: "";
	display: inline-block;
	width: 29px;
	height: 16px;
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDI5IDE2Ij4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkZCIgY2xpcC1ydWxlPSJldmVub2RkZCIgZD0iTTIxLjU3NSAwLjMxODE5TDI4LjY3MzMgNy4yMzE4MkMyOS4xMDg5IDcuNjU2MDcgMjkuMTA4OSA4LjM0MzkzIDI4LjY3MzMgOC43NjgxOEwyMS41NzUgMTUuNjgxOEMyMS4xMzk1IDE2LjEwNjEgMjAuNDMzMiAxNi4xMDYxIDE5Ljk5NzcgMTUuNjgxOEMxOS41NjIxIDE1LjI1NzYgMTkuNTYyMSAxNC41Njk3IDE5Ljk5NzcgMTQuMTQ1NEwyNS4xOTE4IDkuMDg2MzdIMFY2LjkxMzYzSDI1LjE5MThMMTkuOTk3NyAxLjg1NDU1QzE5LjU2MjEgMS40MzAzIDE5LjU2MjEgMC43NDI0NDUgMTkuOTk3NyAwLjMxODE5QzIwLjQzMzIgLTAuMTA2MDY1IDIxLjEzOTUgLTAuMTA2MDY1IDIxLjU3NSAwLjMxODE5WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+");
	background-size: contain;
	background-repeat: no-repeat;
	margin-left: 0.5em;
	vertical-align: middle;
	transition: transform 0.3s ease;
	/* Optional smooth animation */
}

picture {
	opacity: 0;
	/* Hide until animation */
	transform: translateY(30px);
	/* Initial position */
}

.testimonial-section {
	background-color: #000;
	/* Black background */
	color: #fff;
	/* White text */
}

.testimonial-box {
	padding-left: 80px !important;
	padding-right: 80px !important;
}

.testimonial-quote {
	font-size: 2.5rem;
	font-family: Georgia, serif;
	margin-bottom: 20px;
	margin-top: 80px;
}

.testimonial-text {
	margin-bottom: 20px;
}

.testimonial-author {
	font-weight: bold;
}

.testimonial-company {
	margin-bottom: 80px;
}





/* Style the custom cursor */
.custom-cursor {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: var(--brand-primary);
	position: fixed;
	z-index: 9999;
	top: 0px;
	left: 0px;
	pointer-events: none;
	/* Ensures the cursor doesn’t interfere with clicking */
	transform: translate(-50%, -50%);
	/* Center the cursor */
}


/* Play icon style */
.custom-cursor.play-icon {
	width: 0;
	height: 0;
	border-left: 20px solid var(--brand-primary);
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-radius: 0;
	background: none;
}

a:link,
a:visited,
a:hover,
a:active,
.nav-link:hover,
.nav-link:focus {
	color: #000;
	text-decoration: none;
}

#topBanner {
	position: fixed;
	/* Default position */
	width: 100%;
	background-color: rgba(255, 255, 255, 0.7);
	/* Default background */
	z-index: 1000;
	/* Default stacking order */
	transition: none;
	/* Turn off CSS transitions, GSAP handles it */
	backdrop-filter: blur(30px);
	/* Blurs the content behind */
	-webkit-backdrop-filter: blur(30px);
	/* Safari support */
}

.scrolled {


	background: rgba(255, 255, 255, 0.7) !important;
}

#topBanner.expanded {
	/* Expanded state handled by GSAP */
	background: none !important
}



/* inverted menu and top banner styling */
body[data-itemid="1"] #topBanner,
body[data-itemid="5"] #topBanner {
	background: none
}

body[data-itemid="1"] #siteLogoTextLayer path,
body[data-itemid="5"] #siteLogoTextLayer path {
	fill: rgba(255, 255, 255, 1)
}

body[data-itemid="1"] .scrolled #siteLogoTextLayer path,
body[data-itemid="5"] .scrolled #siteLogoTextLayer path {
	fill: rgba(0, 0, 0, 1) !important
}

body[data-itemid="1"] .expanded #siteLogoTextLayer path,
body[data-itemid="5"] .expanded #siteLogoTextLayer path, body[data-itemid="1"] .scrolled.expanded #siteLogoTextLayer path,
body[data-itemid="5"] .scrolled.expanded #siteLogoTextLayer path {
	fill: rgba(255, 255, 255, 1) !important
}

.scrolled #topMenu .nav-item a {
	color: #000 !important
}

/*Black BG OVERRIDES */
.blackBG #topBanner.scrolled,
.blackBG {
	background: rgba(0, 0, 0, 1) !important;
	color: #fff
}

.blackBG .scrolled #siteLogoTextLayer path {
	fill: rgba(255, 255, 255, 1)
}

.blackBG .scrolled #topMenu a {
	color: rgba(255, 255, 255, 1) !important
}

.blackBG .scrolled .nav-pills {
	filter: invert(1)
}


.ContactDetails h1,
.ContactForm h1 {
	font-size: 1.75em;
}

.ContactForm label,
#questionForm label {
	display: block;
}

.ContactForm div,
#questionForm div {
	margin-bottom: 10px;
}

.ContactForm input[type='text'],
.ContactForm input[type='tel'],
.ContactForm input[type='email'],
.ContactForm textarea {
	border: 1px solid #888;
}

.notEmail {
	display: none;
}

#fpImageDiv,
.carousel-inner,
.carousel-item,
.video-item {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16/9;
}

.carousel-item .embed-responsive,
.video-item .embed-responsive {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

.embed-responsive iframe {
	aspect-ratio: 16/9;
	width: 100% !important;
	object-fit: cover;
	/* Ensures the video fills without distortion */
	position: absolute;
	top: 0;
	left: 0;
}

/* FOOTER */

.footer {
	z-index: 1 !important;
	width: 100%;
	/* Set the fixed height of the footer here */
	background-color: #000;
	color: #fff;

	& a {
		color: rgba(255, 255, 255, 1);
	}

	& .nav-link {
		padding: 0px;
		margin: 0px;
	}

	& svg {
		height: 37px !important;
		width: auto;
	}

}

.footer .container {
	background-color: #000;
}

/* END FOOTER */

h3 {
	font-size: 3rem;
}

#homeLeader,
#darkPanel {
	background-color: #000;
	color: #fff;
}

#darkPanel {
	margin-bottom: 130px;
}

#homeLeader h1 {
	font-weight: 500;
	font-size: 3rem;
	color: rgba(255, 255, 255, 1)
}

#homeLeader h1 span {
	display: block;
	overflow: hidden;
}


img {
	max-width: 100%;
	height: auto !important;
}

.introText h3 {
	font-size: 4.5rem;
}

.line-wrapper {
	display: block;
	overflow: hidden;
}

.nav-link {
	color: #000;
}

.navbar-brand img {
	width: auto;
	height: 20px !important;
	max-height: 100%;
	cursor: pointer;
}

/* .accordion {border-bottom: 1px solid rgba(0,0,0,1)} */
.serviceItem {
	border-bottom: 1px solid #000;
}

.serviceItem:last-child {
	margin-bottom: 70px;
}

/* Add transition to svg rotation and path stroke color */
.expandIcon svg {
	transition: transform 0.3s ease;
	/* Rotate smoothly over 0.3 seconds */
	width: 24px;
	height: 24px;
}

.expandIcon svg path {
	transition: stroke 0.3s ease;
	/* Smooth color transition over 0.3 seconds */
}

/* Rotate and change stroke color when expanded */
.serviceItemBtn[aria-expanded="true"] .expandIcon svg {
	transform: rotate(45deg);
}

.serviceItemBtn[aria-expanded="true"] .expandIcon svg path {
	stroke: var(--brand-primary);
}

/* Change stroke color on hover */
.serviceItemBtn:hover .expandIcon svg path {
	stroke: var(--brand-primary);
}


.accordion h2 {
	margin-bottom: 30px;
}

.accordion>.row {
	border-bottom: 1px solid #000
}

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

/* ==|== Everything Else =====================================================================
   Alphabetically ordered unles it's nested (.level2 will be nested with #submenu for example)
   =========================================================================================== */

#mainContentContainer,
#darkPanel {
	padding-top: 170px;
}

body[data-itemid="1"] #mainContentContainer,
body[data-itemid="5"] #mainContentContainer {
	padding-top: 0px;
}

#homeLeader {
	padding-top: 160px;
}

.month li,
.year li {
	display: none;
}

.month li.monthName,
.month li.yearName {
	display: block;
}



/* #map_canvas {width: 100%; min-height: 150px;} */

.navbar-toggle {
	border: 1px solid #efefef;
}

.navbar-toggle .icon-bar {
	background: #efefef;
}


/* NEWS */
.newsCard a {
	color: #A7A7A7;
	text-decoration: none;
}

.newsCard a:hover {
	text-decoration: none;
	color: #000
}

.newsCard h2 {
	font-weight: 500;
}

.owl-carousel img {
	aspect-ratio: 16/9;
	object-fit: cover;
}

#owl_1 img {
	aspect-ratio: initial;
}

#topBanner {
	padding-top: 1rem;
	padding-bottom: 1rem;
}

/* Wrapper for the carousel */
.carousel-container {
	position: relative;
	overflow: hidden;
	/* Hide content that exceeds the container */
}

/* Fade effect on left and right sides */
.carousel-container::before,
.carousel-container::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 10%;
	/* Adjust width for fade effect */
	z-index: 2;
	/* Place above the carousel */
	pointer-events: none;
	/* Allow interactions with carousel */
}

.carousel-container::before {
	left: 0;
	background: linear-gradient(to right, white, rgba(255, 255, 255, 0));
}

.carousel-container::after {
	right: 0;
	background: linear-gradient(to left, white, rgba(255, 255, 255, 0));
}




.vimeo-container {
	position: relative;
	width: 100%;
	height: 0;
	padding-top: 56.25%;
	/* 16:9 Aspect Ratio */
	background: #000;
	/* Optional background color */
	overflow: hidden;
}

.vimeo-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	/* Disable interaction until custom play button is clicked */
	z-index: 1;
}

.vimeo-container::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 120px;
	height: 120px;
	background: rgba(255, 255, 255, 0.95);
	/* Semi-transparent white */
	clip-path: polygon(30% 20%, 80% 50%, 30% 80%);
	/* Triangle play button */
	cursor: pointer;
	z-index: 2;
	box-shadow: 0px 12px 11px rgba(0, 0, 0, 0.4)
}

.vimeo-container.playing::after {
	display: none;
	/* Hide the custom play button when playing */
}

.vimeo-container iframe {
	pointer-events: auto;
	/* Enable interaction with the iframe when playing */
}


.navbar-toggler {
	width: 38px;
	/* Adjust the size */
	height: 25px;
	/* Adjust the size */
	border: none;
	border-radius: 13px;
	/* Makes it a circle */
	background-color: none;
	/* Background color of the button */
	border: 1px solid #000;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	padding: 0px;
}

.navbar-toggler-icon {
	display: inline-block;
	width: 15px;
	/* Width of the lines */
	height: 0px;
	/* Thickness of the lines */
	background-color: #000;
	/* Line color */
	position: relative;
	background-image: none;
}

.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
	content: "";
	width: 15px;
	height: 1px;
	background-color: #000;
	/* Same color as the main line */
	position: absolute;
	left: 0;
	transition: transform 0.5s ease-in-out;
	/* Smooth transition for transform */

}

body[data-itemid="1"] .navbar-toggler,
body[data-itemid="5"] .navbar-toggler {
	border: 1px solid #fff;
}

body[data-itemid="1"] .navbar-toggler-icon::before,
body[data-itemid="1"] .navbar-toggler-icon::after,
body[data-itemid="5"] .navbar-toggler-icon::before,
body[data-itemid="5"] .navbar-toggler-icon::after,
.blackBG .navbar-toggler-icon::before,
.blackBG .navbar-toggler-icon::after {
	background-color: #fff;
}


.scrolled .navbar-toggler,
.scrolled .navbar-toggler {
	border: 1px solid #000 !important;
}

.scrolled .navbar-toggler-icon::before,
.scrolled .navbar-toggler-icon::after,
.scrolled .navbar-toggler-icon::before,
.scrolled .navbar-toggler-icon::after,
.blackBG .navbar-toggler-icon::before,
.blackBG .navbar-toggler-icon::after {
	background-color: #000 !important;
}

.navbar-toggler-icon::before {
	top: -3px;
	/* Position above the middle line */
}

.navbar-toggler-icon::after {
	top: 3px;
	/* Position below the middle line */
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before {
	transform: translateY(3px) rotate(45deg);
	/* Translate and rotate for animation */
	background-color: #fff;

}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after {
	transform: translateY(-3px) rotate(-45deg);
	/* Translate and rotate for animation */
	background-color: #fff;

}

.navbar-toggler[aria-expanded="true"] {
	border-color: #fff;
}


/* Optional: Hover effect for the button */
.navbar-toggler:hover {
	background-color: none;
	/* Slightly darker background on hover */
}


#owl_1 .item {
	display: flex;
	/* Enable flexbox */
	justify-content: center;
	/* Center horizontally */
	align-items: center;
	/* Center vertically */
	height: 150px;
	/* Adjust height based on your design */
	padding: 10px;
	/* Optional padding */
}

#owl_1 .item img {
	max-height: 100%;
	/* Ensure images scale properly */
	max-width: 100%;
	/* Prevent images from overflowing */
	object-fit: contain;
	/* Maintain aspect ratio */
	filter: grayscale(100%);
	transition: filter 0.3s ease;
}



.owl-carousel .item {
	display: flex;
	justify-content: center;
	align-items: center;
}

.owl-carousel img {
	max-width: 100%;
	height: auto;
	display: block;
}

.owl-theme .owl-controls .owl-pagination {
	margin-top: 15px;
	text-align: left;
	/* Align the pagination to the left */
	padding-left: 10px;
}

.owl-theme .owl-controls .owl-page span {
	font-size: 18px !important;
	line-height: 1;
	color: #fff;
	display: inline-block;
}

.owl-theme .owl-controls .owl-page.active span {
	font-weight: 700 !important;
	text-decoration: underline;
	font-size: 18px !important;

}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span,
.owl-theme .owl-dots .owl-dot span {
	background: none;
	font-size: 18px !important;
	font-weight: 100 !important;
}

.owl-theme .owl-dots .owl-dot.active span {
	font-weight: 900 !important
}

.footer {
	margin-top: 0px;
}

.footer li a,
.footer p {
	font-weight: 400;
}

.footer li a:hover {
	color: #fff;
}

.footer strong {
	font-weight: 500;
}

body[data-itemid="5"] .footer {
	margin-top: 0px;
}

/* PRODUCTS */
.AttributeValuesList {
	font-size: 1.4rem;
}

.AttributeValuesList .active,
.AttributeValuesList .active:hover {
	background-color: #888;
	border-color: #888
}

.AttributeValuesList .list-group-item {
	padding: 10px;
	cursor: pointer;
	display: none;
}

.AttributeValuesList .list-group-item.active,
.AttributeValuesList .list-group-item.visible {
	display: block;
}

.AttributeValuesList img {
	max-width: 30px;
	height: auto;
}


.listingContainer {
	display: block;
	position: relative;
}

.showhideOptions {
	cursor: pointer;
	font-size: 1.2rem;
	margin-top: 10px;
}


/* END PRODUCTS */

#siteLogo {
	height: 35px;
	width: auto;
}

.socialShareLinks svg {
	width: 24px;
}

.socialShareLinks svg path {
	fill: var(--brand-primary)
}

/* SILVERINK LINK */
#silverinkWebDesign {
	font-size: 10px;
	font-family: helvetica, arial;
	margin-left: 0px;
	margin-top: 5px;
}

#silverinkWebDesign a {
	color: #888;
}


.valuesContainer {
	background: #000;
	color: #fff;
	padding-top: 130px;
	padding-bottom: 450px;
}



/* WORK */
.rBreadcrumb {
	display: block;
	margin-bottom: 70px;
}

.rBreadcrumb,
.rBreadcrumb a {
	color: #969696;
	font-size: 14px;
}

.projectCard {
	margin-bottom: 70px;
}

.projectsContainer .col-md-6 .projectCard .cardImage img {
	aspect-ratio: 85/60;
	object-fit: cover;
}

.projectsContainer .col-md-12 .projectCard .cardImage img {
	aspect-ratio: 17/6;
	object-fit: cover;
}

.projectCard .card-title {
	margin-bottom: 20px;
	line-height: 100%;
}

.categoryName {
	color: #838383;
	font-size: 24px;
	font-weight: 700;
	text-transform: capitalize;
}

.pCategoriesRow {
	font-size: 21px;
	margin-top: 71px;
	margin-bottom: 160px;
}

.pCategoriesRow .cat-name {
	color: #838383;
}

.DirectoryItem .cardImage {
	display: block;
	margin-bottom: 110px;
}

.DirectoryItem .cardImage img {
	aspect-ratio: 17/8;
	object-fit: cover;
}

.DirectoryItem .introRow {
	margin-bottom: 70px;
}

.cat-name {
	text-transform: capitalize;
}

.workPanel {
	margin-top: 70px;
	margin-bottom: 70px;
	padding-top: 70px;
	padding-bottom: 70px;
}

.otherClient {
	border-bottom: 1px solid #fff;
	position: relative;
}

.otherClient picture {
	display: none;
	position: absolute;
	top: 0px;
	left: calc(50% - 100px);
	max-width: 200px;
	z-index: 9999;
}

/* Style for pills */
.nav-pills .nav-link {
	border: 1px solid transparent;
	/* Light border for outline */
	border-radius: 40px;
	/* Rounded corners */
	padding: 6px 20px;
	/* Add some padding */
	color: #000;
	/* Black text color */
	background-color: transparent;
	/* Transparent background */
	transition: all 0.3s ease;
	/* Smooth transition effect */
}

.nav-pills .nav-link.active {
	background-color: transparent;
	/* Black background for active state */
	color: #000;
	/* White text color for active state */
	border: 1px solid #000;
	/* Dark border for active state */
}

.nav-pills .nav-link:hover {
	background-color: none;
	/* Light gray background on hover */
	color: #000;
	/* Ensure black text remains on hover */
}

#latestWork {
	margin-top: 140px;
	margin-bottom: 140px;
}

.workItem {
	margin-bottom: 170px;
}

.workItem .orgName {
	font-size: 24px;
	color: #838383;
	font-weight: 700;
	line-height: 120%;
}

.workItem img {
	aspect-ratio: 16/9;
	object-fit: cover;
	width: 100%;
}

body[data-itemid='1'] .workItem img {
	aspect-ratio: 1740/744;
	object-fit: cover;
	width: 100%;
}

.workItem .workIntro {
	color: #838383;
}

.footer #siteLogo path {
	fill: #fff;
}

.tel,
.email-address {
	text-decoration: underline;
}

#mobileMenuContainer {
	display: none;
	position: fixed !important;
	top: 0px;
	left: 0px;
	width: 100vw;
	height: 0vh;
	background-color: #000;
	z-index: -1;
}

#mobileMenuContainer.expanded+#topBanner {
	position: fixed;
	top: 0px;
	left: 0px;
	max-width: 100vw;
	z-index: 2001;
}

#mobileMenuContainer.expanded {
	display: block;
	z-index: 2000
}

body:has(#mobileMenuContainer.expanded) {
	padding-top: 180px;
	/* Add padding to the top of the body */
}

#mobileMenuContainer .navbar-nav {
	margin-top: 100px
}

#mobileMenuContainer .nav-item {
	position: relative;
	overflow: hidden;
}

#mobileMenuContainer .nav-item a {
	display: inline-block;
	position: relative;
	color: #fff;
	/* Default text color */
	font-size: 45px;
	line-height: 40px;
	text-decoration: none;
	overflow: hidden;
}

#mobileMenuContainer .nav-item a .overlay {
	position: absolute;
	top: -100%;
	left: 0;
	width: 100%;
	height: 100%;
	background: #838383;
	/* Hover color */
	z-index: 1;
	mix-blend-mode: multiply;
	pointer-events: none;
}

#mobileMenuContainer .nav-item.active a {
	color: #838383 !important;
}

#mobileMenuContainer .nav-item a .text {
	position: relative;
	z-index: 2;
	display: inline-block;
}

.mobileBottomLinks {
	position: absolute;
	bottom: -1000px;
}

.mobileBottomLinks a {
	color: #fff !important;
	font-weight: 300;
	font-size: 16px;
	text-decoration: underline;
}

.mobileBottomLinks div {
	line-height: 16px;
}

.mobileSocial a {
	text-decoration: none;
}

/* ==|== media queries ======================================================
   Media Queries for Responsive Design.
   These override the primary ('mobile/desktop first') styles
   Modify as content requires.
   ========================================================================== */




/*===============================*/
/* 480 - LANDSCAPE MOBILE LAYOUT */
/*===============================*/

@media only screen and (min-width: 480px) {
	/* Style adjustments for viewports 480px and over go here */

}





















/*=====================*/
/* 768 - TABLET LAYOUT */
/*=====================*/
@media only screen and (min-width: 768px) {

	#topBanner .container {
		padding-left: 0px;
	}

	#topBanner .container .navbar-brand {
		position: relative;
		height: 65px;
	}

	#topBanner .container svg {
		position: relative;
		margin-left: 0px;
	}

	/* Style adjustments for viewports 768px and over go here */
	.active {
		font-weight: bold;
	}


	#siteLogo {
		height: 55px;
	}

	#homeLeader {
		overflow: hidden;

		/* padding-top: 1px; */
		& h1 {
			font-size: 3.44rem;
			margin-top: 60px;
			margin-bottom: 156px;
			font-weight: 600;
		}

		& span {
			display: block;
			overflow: hidden;
		}

		& .text {
			display: inline-block;
			overflow: hidden;
			/* For masking effect */
			white-space: nowrap;
		}
	}


	#mobileMenu {
		display: none !important;
	}

	.newsTitleRow {
		margin-top: 50px;
	}


	.testimonial-quote {
		font-size: 4.5rem;
		font-family: Georgia, serif;
		margin-bottom: 20px;
		margin-top: 80px;
	}

	#topMenu .nav-item {
		font-size: 1.25rem;
	}

	#topMenu .nav-item a {
		color: #000
	}

	body[data-itemid="1"] #topMenu a,
	body[data-itemid="5"] #topMenu a {
		color: rgba(255, 255, 255, 1)
	}

}










/*=======================*/
/* 1024 - DESKTOP LAYOUT */
/*=======================*/
@media only screen and (min-width: 992px) {

	/* Style adjustments for viewports 1024px and over go here */
	body[data-template="News"] .content {
		gap: 30px;
		/* Adjust gap as needed */
		column-count: 1;
		/* Number of columns on desktop */

	}

	#homeLeader {
		overflow: hidden;

		/* padding-top: 1px; */
		& h1 {
			font-size: 3.44rem;
			margin-top: 60px;
			margin-bottom: 156px;
			font-weight: 600;
		}

		& span {
			display: block;
			overflow: hidden;
		}

		& .text {
			display: inline-block;
			overflow: hidden;
			/* For masking effect */
			white-space: nowrap;
		}
	}

	.newsCard {
		font-size: 3rem;

		border-top: 1px solid rgba(0, 0, 0, 1);
		padding-top: 70px;
		padding-bottom: 70px;

		& .date {
			font-weight: 500;
			margin: 0;
			font-size: 2.5rem !important;
			line-height: 120%;
		}

		& h2 {
			font-size: 3rem !important;
			margin: 0;
			line-height: 120%;
		}
	}

	.newsCard:last-child {
		border-bottom: 1px solid rgba(0, 0, 0, 1);
	}

	.newsTitleRow h1 {
		font-size: 3rem;
	}



	#topBanner {
		position: fixed;
		/* Default position */
		top: 51px;
		width: 90%;
		left: 5%;
		padding-left: 30px;

		background-color: rgba(255, 255, 255, 0.7);
		/* Default background */
		z-index: 1000;
		/* Default stacking order */
		transition: none;
		/* Turn off CSS transitions, GSAP handles it */
		backdrop-filter: blur(160px);
		/* Blurs the content behind */
		-webkit-backdrop-filter: blur(160px);
		/* Safari support */
		border-radius: 50px;
	}

	.scrolled {


		background: rgba(255, 255, 255, 0.7) !important;
	}

	#topBanner.expanded {
		/* Expanded state handled by GSAP */
		background: none !important
	}
}










/* WIDE DESKTOP LAYOUT */
@media only screen and (min-width: 1200px) {

	/* Style adjustments for viewports 1200px and over go here */
	#homeLeader {
		overflow: hidden;

		/* padding-top: 1px; */
		& h1 {
			font-size: 4.44rem;
			margin-top: 60px;
			margin-bottom: 156px;
			font-weight: 600;
		}

		& span {
			display: block;
			overflow: hidden;
		}

		& .text {
			display: inline-block;
			overflow: hidden;
			/* For masking effect */
			white-space: nowrap;
		}
	}

	.testimonial-quote {
		font-family: proxima-nova, sans-serif;
		font-size: 147px;
		font-weight: 400;
		margin-bottom: 20px;
		margin-top: 80px;
	}
}

@media only screen and (min-width: 1600px) {
	#homeLeader {
		overflow: hidden;

		/* padding-top: 1px; */
		& h1 {
			font-size: 6.3rem;
			margin-top: 60px;
			margin-bottom: 126px;
			font-weight: 600;
		}

		& span {
			display: block;
			overflow: hidden;
		}

		& .text {
			display: inline-block;
			overflow: hidden;
			/* For masking effect */
			white-space: nowrap;
		}

	}

	.newsCard {
		font-size: 4rem;

		border-top: 1px solid rgba(0, 0, 0, 1);
		padding-top: 70px;
		padding-bottom: 70px;

		& .date {
			font-weight: 500;
			margin: 0;
			font-size: 3.5rem !important;
			line-height: 120%;
		}

		& h2 {
			font-size: 4rem !important;
			margin: 0;
			line-height: 120%;
		}
	}
}



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

	.footer {
		width: 100%;
		/* Set the fixed height of the footer here */
		background-color: #000;
		color: #fff;

		& h3 {
			font-size: 4.6rem;
		}
	}

	#homeLeader {
		overflow: hidden;

		/* padding-top: 1px; */
		& h1 {
			font-size: 8.44rem;
			margin-top: 60px;
			margin-bottom: 156px;
			font-weight: 600;
		}

		& span {
			display: block;
			overflow: hidden;
		}

		& .text {
			display: inline-block;
			overflow: hidden;
			/* For masking effect */
			white-space: nowrap;
		}

	}

	.newsCard {
		font-size: 4rem;

		border-top: 1px solid rgba(0, 0, 0, 1);
		padding-top: 70px;
		padding-bottom: 70px;

		& .date {
			font-weight: 500;
			margin: 0;
			font-size: 3.5rem !important;
			line-height: 120%;
		}

		& h2 {
			font-size: 4rem !important;
			margin: 0;
			line-height: 120%;
		}
	}
}






/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
	* {
		background: transparent !important;
		color: black !important;
		text-shadow: none !important;
		filter: none !important;
		-ms-filter: none !important;
	}

	/* Black prints faster: h5bp.com/s */
	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content: "";
	}

	/* Don't show links for images, or javascript/internal links */
	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	thead {
		display: table-header-group;
	}

	/* h5bp.com/t */
	tr,
	img {
		page-break-inside: avoid;
	}

	img {
		max-width: 100% !important;
	}

	@page {
		margin: 0.5cm;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}



/* CSS for elements without the invert effect */
#topBanner,
#homeLeader,
#fpImageDiv {
	filter: none;
	transition: filter 0.5s ease;
}

/* Invert effect applied */
.invert {
	filter: invert(1);
}

/*Black BG OVERRIDES */
.blackBG #topBanner,
.blackBG {
	background: rgba(0, 0, 0, 1);
	color: #fff
}

.blackBG #siteLogoTextLayer path {
	fill: rgba(255, 255, 255, 1)
}

.blackBG #topMenu a {
	color: rgba(255, 255, 255, 1)
}

.blackBG .nav-pills {
	filter: invert(1)
}


.workCard .card-body {
	padding-left: 0px;
}

.workPanel {
	margin-top: 35px !important;
	padding-top: 35px !important;
	margin-bottom: 35px !important;
	padding-bottom: 35px !important
}

/* .workPanel p, .workPanel+p {margin: 0px;} */


/* Override Bootstrap defaults for typography on desktop */

.footer {
	& svg {
		width: auto;
		margin-top: 120px;
		margin-bottom: 50px;
	}
}

h6,
.h6,
h5,
.h5,
h4,
.h4,
h3,
.h3 {
	font-weight: 500 !important
}

body,
p,
ul,
li {
	font-size: 26px;
	line-height: 34px;
}

h1 {
	font-size: 74px;
	line-height: 1.2;
	word-break: break-word !important;

}

h2 {
	font-size: 74px;
	line-height: 1.2;
}

h3 {
	font-size: 47px;
	line-height: 1.2;
}

h4 {
	font-size: 48px;
	line-height: 1.2;
}

/* Adjust other heading levels based on hierarchy and importance */
h5 {
	font-size: 42px;
	line-height: 1.3;
}

.serviceItem h5 {
	font-size: 32px;
	font-weight: 400;
}

.serviceItem p {
	font-size: 20px;
}

h6 {
	font-size: 34px;
	line-height: 1.4;
}

.line-wrapper {
	line-height: 120%;
}

/* Ensure responsive typography adjustments */

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

	/* Modify the font sizes as necessary for tablet and smaller devices */
	body,
	p,
	ul,
	li {
		font-size: 22px;
		line-height: 30px;
	}

	h1,
	h2,
	h3 {
		font-size: 58px;
	}

	h4 {
		font-size: 40px;
	}

	h5 {
		font-size: 34px;
	}

	h6 {
		font-size: 28px;
	}
}


.second-testimonial {
	border-left: 1px solid #fff;
}


/* MOBILE RESPONSIVE */
@media only screen and (max-width: 1200px) {

	.footer li, .footer p a, .footer strong {
		line-height: 180%;
		font-size: 12px !important;
	}
	.DirectoryItem .cover-video {
		margin-left: -0.75rem;
		margin-right: -0.75rem;
		width: 100vw;
	}

	#fpImageDiv {
		margin-left: -24px;
		margin-right: -24px;
	}

	#pageWipe {
		display: none;
	}

	.accContainer {
		padding: 0px !important
	}

	.accordion>.row {
		border-bottom: none !important
	}

	.serviceIntro {
		font-size: 14px;
		/* text-transform: capitalize; */
	}

	.accordion h2 {
		margin-top: 3px;
		margin-bottom: 30px;
	}

	.accordion svg {
		width: 17px !important;
		height: 17px !important;
	}

	.accordion p {
		font-size: 12px;
	}

	/* APPROACH */
	.approachContain {
		padding-top: 43px;
		padding-bottom: 43px;
	}

	body[data-itemid="5"] #darkPanel .introText {
		font-size: 17px !important;
	}

	.approachPanel .row {
		padding-top: 25px !important;
		padding-bottom: 15px;
		border-bottom: 0.5px solid #000;
	}

	/* .approachContain p {width: 212px;} */
	.approachPanel .row:first-child {
		padding-top: 50px;
		padding-bottom: 20px;
	}

	.approachContain .approach_chess {
		width: 90px;
		height: 130px;
	}

	.approachContain .approach_chess img {
		width: 100%;
		height: 100% !important;
		object-fit: cover;
	}

	.approachContain .mt-5,
	.approachContain .mb-5 {
		margin-top: 45px !important;
		margin-bottom: 45px !important;
	}

	.cat-title {
		margin-bottom: 5px;
	}

	.number {
		font-size: 35px;
		margin-bottom: 10px;
	}


	.valuesContainer h4 {
		font-size: 26px;
		margin-bottom: 17px;
	}

	.valuesContainer p {
		margin-bottom: 45px;
		font-size: 13px;
	}

	.learnMore {
		margin-bottom: 37px;
		margin-top: 20px;
		font-size: 13px;
	}

	.learnMore svg {
		width: 15px;
	}

	.ourPeople h2 {
		margin-bottom: 29px;
	}

	.second-testimonial {
		border-top: 1px solid #fff;
		border-left: 0px;
	}

	.serviceItem h5 {
		font-size: 21px;
		font-weight: 400;
	}

	.testimonial-quote {
		margin-top: 45px;
		margin-bottom: 0px;
		font-size: 3.3rem;
	}

	.testimonial-text,
	.testimonial-author,
	.testimonial-company {
		font-size: 12px;
		line-height: 141%;
	}

	.valuesContainer {
		padding-top: 1px;
		padding-bottom: 1px;
	}

	.owl-theme .owl-dots .owl-dot.active span,
	.owl-theme .owl-dots .owl-dot:hover span,
	.owl-theme .owl-dots .owl-dot span {
		font-size: 9px !important;
		padding: 0px;
		margin: 0px;
	}

	body,
	p,
	ul,
	li {
		font-size: 10px;
		line-height: 141%;
	}

	#darkPanel {
		margin-bottom: 30px;
	}

	body[data-itemid="5"] #darkPanel {
		margin-bottom: 0px;
	}

	.categoryName {
		font-size: 11px !important;
		line-height: 120%;
		margin-bottom: 0px;
	}

	.footer {
		padding-top: 98px;
	}

	/* .footer * {font-size: 11px !important; line-height: 140%;} */
	.footer {
		& svg {
			height: 19px !important;
			width: auto;
			margin-top: 50px
		}
	}

	h1 {
		font-size: 28px;
	}

	h2,
	h3 {
		font-size: 17px;
		line-height: 17px;
	}

	h2 {
		font-size: 26px;
	}

	h3 {
		font-size: 22px;
		margin-bottom: 28px;
	}

	.introText h3 {
		font-size: 30px !important;
	}

	h4 {
		font-size: 22px;
	}

	h5 {
		font-size: 24px;
		font-weight: 400 !important;
	}

	h6 {
		font-size: 16px;
	}

	.catCol {
		border-bottom: 1px solid var(--black);
		width: 100%;
	}

	.catCol .category-header {
		margin-bottom: 15px;
	}

	.DirectoryItem .introRow {
		margin-bottom: 35px;
	}


	.btn-lg {
		font-size: 16px;
	}

	/* Arrow styling using ::after */
	.careerPanel .panelContain strong::after {
		content: "";
		display: inline-block;
		width: 15px;
		height: 7px;
		background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOSIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDI5IDE2Ij4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkZCIgY2xpcC1ydWxlPSJldmVub2RkZCIgZD0iTTIxLjU3NSAwLjMxODE5TDI4LjY3MzMgNy4yMzE4MkMyOS4xMDg5IDcuNjU2MDcgMjkuMTA4OSA4LjM0MzkzIDI4LjY3MzMgOC43NjgxOEwyMS41NzUgMTUuNjgxOEMyMS4xMzk1IDE2LjEwNjEgMjAuNDMzMiAxNi4xMDYxIDE5Ljk5NzcgMTUuNjgxOEMxOS41NjIxIDE1LjI1NzYgMTkuNTYyMSAxNC41Njk3IDE5Ljk5NzcgMTQuMTQ1NEwyNS4xOTE4IDkuMDg2MzdIMFY2LjkxMzYzSDI1LjE5MThMMTkuOTk3NyAxLjg1NDU1QzE5LjU2MjEgMS40MzAzIDE5LjU2MjEgMC43NDI0NDUgMTkuOTk3NyAwLjMxODE5QzIwLjQzMzIgLTAuMTA2MDY1IDIxLjEzOTUgLTAuMTA2MDY1IDIxLjU3NSAwLjMxODE5WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+");
		background-size: contain;
		background-repeat: no-repeat;
		margin-left: 0.3em;
		vertical-align: middle;
		transition: transform 0.3s ease;
		/* Optional smooth animation */
	}

	.chosenStory p {
		font-size: 13px;
	}

	.pCategoriesRow {
		margin-top: 20px;
		margin-bottom: 35px;
	}

	.footer #siteLogo path {
		fill: #fff;
	}

	#latestWork {
		margin-top: 52px;
		margin-bottom: 52px;
	}

	#mainContentContainer,
	#darkPanel {
		padding-top: 160px;
	}

	.newsCard {
		padding-top: 33px;
		padding-bottom: 33px;
		border-top: 1px solid var(--black);
		margin-bottom: 0px !important
	}

	.newsCard:last-of-type {
		border-bottom: 1px solid var(--black);
		margin-bottom: 63px !important;
	}

	.newsCard .date {
		font-size: 28px;
		font-weight: 600;
		line-height: 120%;
	}

	.newsCard h2 {
		font-size: 30px;
		font-weight: 400;
		line-height: 120%;
	}

	.scrolled .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before,
	.scrolled .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after,
	.scrolled .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before,
	.scrolled .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after,
	.navbar-toggler[aria-expanded="true"].blackBG .navbar-toggler-icon::before,
	.navbar-toggler[aria-expanded="true"].blackBG .navbar-toggler-icon::after {
		background-color: #fff !important;
	}

	.scrolled .navbar-toggler[aria-expanded="true"],
	.scrolled .navbar-toggler[aria-expanded="true"] {
		border: 1px solid #fff !important;
	}

	.serviceItem {
		padding-bottom: 0px !important;
	}

	.workItem .orgName {
		font-size: 11px;
		margin-bottom: 10px;
	}

	.workItem h3 {
		margin-bottom: 6px;
		font-size: 24px;
	}

	.workPanel {
		margin-top: 10px !important;
		padding-top: 30px !important;
		margin-bottom: 0px !important;
		padding-bottom: 0px !important
	}

	.workPanel:last-of-type {
		margin-bottom: 52px !important;
	}

	.workPanel p:last-of-type {
		margin-bottom: 0px !important;
	}

	.rBreadcrumb {
		margin-bottom: 23px;
	}

	.workCard img {
		aspect-ratio: 16/9;
		object-fit: cover;
	}


	.workCard .card-title {
		margin-bottom: 0px;
	}

	.workItem {
		margin-bottom: 70px;
	}

	.workItem svg,
	.approachPanel svg {
		width: 16px;
	}

	.approachPanel .approachTitle {
		font-size: 22px;
	}

	#topBanner {
		padding-top: 23px !important;
	}

	.testimonial-box {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	.testimonial-company {
		margin-bottom: 30px;
	}

	.workPanel .col-md-6:first-child {
		margin-bottom: 23px
	}

	.workPanel .col-12 p,
	.introRow p {
		padding-right: 50px;
	}

}


/* Override Bootstrap container width for large desktops */
@media (min-width: 768px) {

	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 800px;
	}

	body,
	p,
	ul,
	li {
		font-size: 14px;
		line-height: 20px;
	}

	.workItem .workIntro,
	.workItem .workIntro+a {
		font-size: 24px;
	}
	body[data-template="Directory"] .workCard img {
		aspect-ratio: 870/592 !important;
		object-fit: cover;
	}

	body[data-template="Directory"] .col-md-12 .workCard .cardImage img {
		aspect-ratio: 17/6 !important;
		object-fit: cover;
	}

}




/* Override Bootstrap container width for large desktops */
@media (min-width: 1200px) {
	.approachPanel .approachTitle {
		font-size: 68px;
	}

	.approachPanel .approachText {
		font-size: 22px;
		line-height: 120%;
	}

	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 1100px;

		.workCard img {
			aspect-ratio: 16/9;
			object-fit: cover;
		}
	}
	body[data-template="Directory"] .workCard img {
		aspect-ratio: 870/592 !important;
		object-fit: cover;
	}

	body[data-template="Directory"] .col-md-12 .workCard .cardImage img {
		aspect-ratio: 17/6 !important;
		object-fit: cover;
	}
	body[data-itemid="5"] #darkPanel .introText {
		margin-bottom: 294px;
		font-size: 32px;
	}

	body[data-itemid="5"] #darkPanel .video-item {
		margin-bottom: 170px;
	}


	body,
	p,
	ul,
	li {
		font-size: 18px;
		line-height: 120%;
	}

	.footer,
	.footer p,
	.footer ul,
	.footer li {
		font-size: 20px;
		line-height: 30px;
	}

	.approachContain h3 {
		font-size: 74px;
		font-weight: 500 !important;
		margin-bottom: 30px;
	}

	.number {
		font-size: 64px;
		margin-bottom: 10px;
	}
	.otherClient h5 {
	font-size: 36px !important;
	line-height: 1.3;
}

	.learnMore {
		margin-top: 200px;
		margin-bottom: 130px;
		font-size: 24px;
	}

	.btn-lg {
		font-size: 26px;
		padding: 0px 80px !important;
	}

	footer .container .col-12.mt-5.d-md-block {
		padding-top: 76px;
	}

	h1 {
		font-size: 40px;
		line-height: 1.2;
		word-break: break-word !important;
	}

	.testimonial-box {
		padding-left: 0px !important;
		padding-right: 60px !important;
	}

	.second-testimonial .testimonial-box {
		padding-left: 60px !important;
		padding-right: 60px !important;
	}

	.valuesContainer h2 {
		margin-bottom: 109px;
	}

}

@media (min-width: 1600px) {
	.approachPanel .approachTitle {
		font-size: 78px;
	}

	.approachPanel .approachText {
		font-size: 24px;
		line-height: 120%;
	}

	body,
	p,
	ul,
	li {
		font-size: 20px;
		line-height: 32px;
	}

	body[data-itemid="5"] #darkPanel .introText {
		margin-bottom: 266px;
		font-size: 40px;
	}

	.btn-lg {
		font-size: 32px;
		padding: 0px 80px !important;
	}

	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 1400px;
	}

	h1 {
		font-size: 60px;
		line-height: 1.2;
		word-break: break-word !important;
		margin-bottom: 50px;
	}

		.otherClient h5 {
			font-size: 42px !important;
			line-height: 1.3;
		}

			.learnMore {
		margin-top: 200px;
		margin-bottom: 130px;
		font-size: 30px;
	}
}

/* Override Bootstrap container width for large desktops */
@media (min-width: 1900px) {

	.approachPanel .approachTitle {
		font-size: 108px;
	}

	.approachPanel .approachText {
		font-size: 30px;
	}

	body[data-itemid="5"] #darkPanel .introText {
		margin-bottom: 296px;
		font-size: 50px;
	}

	body,
	p,
	ul,
	li {
		font-size: 24px;
		line-height: 32px;
	}

	h1 {
		font-size: 74px;
		line-height: 1.2;
		word-break: break-word !important;
	}

	.workItem .workIntro,
	.workItem .workIntro+a {
		font-size: 30px;
	}

	.newsCard {
		font-size: 2rem;

		border-top: 1px solid rgba(0, 0, 0, 1);
		padding-top: 70px;
		padding-bottom: 70px;

		& .date {
			font-weight: 600 !important;
			margin: 0;
			font-size: 74px !important;
			line-height: 120%;
		}

		& h2 {
			font-size: 74px !important;
			font-weight: 400 !important;
			margin: 0;
			line-height: 120%;
		}
	}


	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 1736px;
	}

}