/*
Theme Name: emerson
Theme URI: https://www.internetimagineering.com
Author: Internet Imagineering, LLC
Author URI: https://www.internetimagineering.com
Description: Custom template for Emerson Construction
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.0
Text Domain: emerson
*/

/* CSS LAYERS: https://css-tricks.com/css-cascade-layers/ */

/* Establish CSS Layer priorities, lowest => highest */
@layer reset, theme;

/* Theme styles: colors, fonts, etc. */
@layer theme {
    :root {
    	/* CUSTOM SITE COLORS */
		--ec-red: #bf2e1a;
		--ec-black: #2c2d2d;
    
		/* STANDARD COLORS */
		--beige: #FF9900;
		--red: #459939;
		--dkred: #990000;
		--black: #000000;
		--ltgray: #DDDDDD;
		--midgray: #CCCCCC;
		--gray: #999999;
		--dkgray: #666666;
		--white: #ffffff;
    
        --content-width: 1440px;
    }

    body {
		background-color: #fff;
		margin: 0px 0px; 
		padding: 0px;
		font-family: 'Goldman', trebuchet ms, arial, verdana, sans-serif;
		color: #333;
		font-size: 14px;
	}

	.clear { clear: both;}
	ul {margin: 0; padding: 0;}
	ul li {margin: 0; padding: 0;}

	.imgFull {width: 100%;}
	img.imgFull {width: 100%;}
	
	.lightbox {display: none; padding: 30px;}

	/* iiMenu */
	i.iiMenuIcon {margin: 0 0 0 5px;}
	ul.iiMenu > li:hover i.iiMenuIcon { rotate: 180deg; }

	ul.iiMenu {display: flex; /*justify-content: none;*/ padding: 0 0 0 0px;}
	ul.iiMenu li {list-style-type: none; margin: 0; padding: 0;}

	ul.iiMenu > li {position: relative; padding: 25px 20px 25px 20px; height: 70px; margin: 0;}
	ul.iiMenu > li > a {font-size: 1rem; color: var(--white); text-decoration: none; text-transform: uppercase; font-weight: 500; } /* main menu */
	ul.iiMenu > li > a:hover {color: var(--white); text-decoration: none;} /* main menu hover */
	ul.iiMenu > li:hover {background-color: var(--white); color: var(--ec-red); }
	ul.iiMenu > li:hover > a { color: var(--ec-red);}

	ul.iiMenu > li > ul {position: absolute; background-color: var(--white); margin: 0; padding: 10px 20px; min-width: 240px; top: 70px; border-bottom: 10px solid var(--ec-red); left: 0px; justify-self: start;}
	ul.iiMenu > li > ul > li {justify-self: start; text-align: left;}
	ul.iiMenu ul {visibility: hidden; opacity: 0; transition: opacity 0.5s;}
	ul.iiMenu > li:hover > ul {visibility: visible; opacity: 1;}

	ul.iiMenu > li > ul a { display: block; color: var(--ec-red); padding: 5px 0; margin: 0; font-weight: 500; text-decoration: none; } /* subnav level 1 menu */
	ul.iiMenu > li > ul a:hover {color: var(--ec-black); text-decoration: none;}

	ul.iiMenu > li > ul:before {
		content: '';
		width: 0;
		height: 0;
		border-left: 0px solid transparent;
		border-right: 0px solid transparent;
		border-bottom: 0px solid var(--);
		top: -10px;
		left: 25px;
		position: absolute;
	}

	.scrolled ul.iiMenu > li {position: relative; padding: 20px 20px 20px 20px; height: 60px;}
	.scrolled ul.iiMenu > li > ul {top: 60px; }

	/* MOBILE SIDENAV */
	.mobileNav {display: none;}

	#sidenav {
		 position: fixed; 
		 /* switch "right" to "left" to switch sides: */
		 left: calc(-100vw - 10px); transition: left 0.5s;
		 top:0; bottom: 0;
		 width: 100vw; max-width: 500px; /* full screen on small screens */
		 z-index: 99999999999; box-shadow: 0 0 10px #0008;
		 background: var(--white); color: var(--ec-red);
		 font-size:1.2rem;
	 }
	 #sidenav.active { left: 0; } /* switch "right" to "left" */
	 #sidenav-header {margin: 20px 0 0 40px; width: 140px;}
	 #sidenav-header img { display: block; width:100%; }
	 #sidenav ul { 
	     padding: 0; 
             margin:0;
	 }
         #sidenav > ul { max-height: calc(100vh - 100px); margin: 30px 0 0 10px; padding-bottom: 150px; overflow: auto; border-top: 1px solid #444;}
         #sidenav li { list-style-type: none; margin: 0; padding: 5px 2rem; }
	 #sidenav > ul > li { border-bottom: 1px solid #444; }
	 #sidenav a, #sidenav a:visited, #sidenav a.active { color: var(--ec-red); text-decoration: none; }
	 #sidenav-close { 
		 /* reposition within the sidenav as needed */
		 position: absolute; 
		 right: 1rem; top:1rem; 
		 cursor: pointer; 
		 font-size:1.5em;
		 transition: all 0.2s; 
	 }
	 #sidenav-close:hover, #sidenav-close:active { color: white; text-shadow: 2px 2px 8px #0008; transform: translate(-2px, -2px); }
	 #sidenav-footer { position:absolute; bottom:0; left:0; right:0; height: 100px; display: flex; justify-content: center; align-items: center; background: var(--white); text-align: center; font-size: .8rem; color: var(--ec-black)}
 
	 .sidenav-request {margin: 40px;}
    
    /* TEXT */
	.textWhite {color: var(--white);}
	.textBlack {color: var(--ec-black);}
	.textRed {color: var(--ec-red);}
	
	.fontTitle {font-family: 'Goldman', trebuchet ms, arial, verdana, sans-serif;}
	
	/* BACKGROUND COLORS */
	.bgRed {background-color: var(--ec-red);}

	/* BUTTONS */
	button.buttonRed {font-size: 1rem; background-color: var(--ec-red); color: var(--white); padding: 5px 20px; border: 0;}
	button.buttonRed:hover {background-color: var(--ec-black); color: var(--white); cursor: pointer;}
	
	a.buttonWhite {font-size: 1rem; background-color: var(--white); color: var(--ec-red); padding: 5px 20px; border: 2px solid var(--ec-red); text-decoration: none;}
	a:visited.buttonWhite {font-size: 1rem; background-color: var(--white); color: var(--ec-red); padding: 5px 20px; border: 2px solid var(--ec-red); text-decoration: none;}
	a:hover.buttonWhite {background-color: var(--ec-red); color: var(--white); border: 2px solid var(--ec-red); text-decoration: none;}
	
	a.buttonRed {font-size: 1rem; background-color: var(--ec-red); color: var(--white); padding: 5px 20px; border: 2px solid var(--ec-red); text-decoration: none;}
	a:visited.buttonRed {font-size: 1rem; background-color: var(--ec-red); color: var(--white); padding: 5px 20px; border: 2px solid var(--ec-red); text-decoration: none;}
	a:hover.buttonRed {background-color: var(--white); color: var(--ec-red); border: 2px solid var(--ec-red); text-decoration: none; cursor: pointer;}

	/* LINKS */


	/* HEADINGS */
	
	h1.sectionTitle {font-size: 2.2rem; margin: 0; padding: 0; line-height: 1.2; text-transform: uppercase;}
	h2.sectionTitle2 {font-size: 2.2rem; margin: 0; padding: 0; line-height: 1.2; text-transform: uppercase;}
	
	h2.sectionTitle {font-size: 2rem; margin: 0; padding: 0; line-height: auto;}
	h3.sectionSubtitle {font-size: 1.4rem; margin: 0; padding: 0; line-height: auto;}
	
	h1.projectTitle {font-size: 2rem; margin: 0; padding: 0; line-height: 2rem; text-transform: uppercase;}
	h3.projectAreaTitle {font-size: 1.6rem; margin: 0; padding: 0; line-height: 1.6rem; text-transform: uppercase;}
	
	h3.personTitle {font-size: 1.2rem; margin: 0; padding: 0; line-height: 1.2rem; text-transform: uppercase; margin: 20px 0 5px 0;}
	h4.personDesc {line-height: 1rem;}
	
	h3.areaTitle {font-size: 1.6rem; margin: 0; padding: 0; line-height: 1.6rem; text-transform: uppercase;}
	.areaSubtitle {font-size: 1.4rem; margin: 0px 0 20px 0;}

	/* HEADER */
	.m-headerContainer {display: none;}
	.m-headerSectionPic {display: none;}

	.headerMount {width: 100%; position: fixed; z-index: 99999;}
	.headerWrapper {width: 100%; z-index: 99999; transition: .2s all; background-color: var(--ec-red);}
	.headerContainer {display: grid; grid-template-columns: 1fr 280px 1fr; grid-column-gap: 20px; padding: 0px 0; transition: .2s all; align-items: center;}
	
	.buttonHome {font-size: .8rem; background-color: var(--ec-black); color: var(--white); padding: 5px; position: absolute; width: 40px; text-align: center; top: 0; left: 0;}
	.buttonSolutions {font-size: .8rem; background-color: var(--ec-black); color: var(--white); padding: 5px; position: absolute; width: 120px; text-align: center; top: 0; right: 0;}
	
	.headerBottomBlackLine {width: 100%; height: 1px; background-color: var(--ec-black); margin: 5px 0;}
	
	.headerLogo {width: 260px; position: absolute; top: 0%; left: 50%; transform: translate(-50%, 0%); background-color: var(--white); padding: 10px 40px; border-bottom: 10px solid var(--ec-red); transition: .2s all;}
	.headerLogo img {width: 100%; transition: .2s all;}
	
	.headerLinks-left {text-align: right; justify-content: end; display: grid;}

	.scrolled .headerWrapper {background-color: var(--ec-red); border-bottom: 5px solid #fff;}
	.scrolled .headerContainer {grid-template-columns: 1fr 180px 1fr;}
	.scrolled .headerBottomBlackLine {margin: 0;}
	
	.scrolled .headerLogo {width: 180px; padding: 10px 30px;}

	ul.navRightul {justify-self: end;}
	ul.navLeftul {justify-self: start;}

	.scrolled ul.navRightul {border: 0px;}
	.scrolled ul.navLeftul {border: 0px;}
	.scrolled .headerLogo img {margin: 6px 0 0 0;}

	.headerSectionPic {width: 100%; height: 300px; background: var(--white) url('images/sectionpic-1.jpg') no-repeat top right; border-top: 82px solid #fff; position: relative; z-index: 888;}
	.sectionTitle-container {position: absolute; top: 50%; left: 10%; transform: translate(-10%, -50%);}

	/* LAYOUT */
	.content {font-family: "Source Sans 3", sans-serif; font-size: 1rem; line-height: 1.4rem;}
	p {margin: 20px 0 0 0;}
	.titleHolder-Center {width: 100%; margin: 0 auto; text-align: center;}
	.pageWrapper {width: 90%; margin: 100px auto;}
	
	.gridAlignCenter {align-items: center;}
	
	.buttonHolder {margin: 20px 0 0 0;}
	.buttonsHolder2 {margin: 20px 0 0 0; display: grid; grid-template-columns: auto; grid-row-gap: 20px;}
	
	.contentGrid-1-1 {display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 80px;}
	.contentGrid-1-1-1 {width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-column-gap: 50px; margin: 50px 0 0 0;}
	
	.eSeparator {margin: 100px auto; width: 90%; display: grid; grid-template-columns: 1fr 50px 1fr; grid-column-gap: 10px; align-items: center;}
	.eSepartor-icon {width: 100%; text-align: center;}
	.eSeparator-line {height: 5px; background-color: var(--ec-red);}
	
	.fpHeroWrapper {width: 100%; max-height: 581px; aspect-ratio: 16 / 9; /*background: #fff url('images/hero-1.jpg') no-repeat top; background-size: cover; */ position: relative; z-index: 7777; border-top: 81px solid #fff;}
	
	.fpBanner {position: absolute; bottom: -85px; left: 50%; transform: translate(-50%, -50%); background-color: var(--white); padding: 20px; font-size: 1.8rem; text-transform: uppercase; width: 60%; text-align: center; z-index: 8888;}
	
	.fpSect2Wrapper {width: 100%; display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 10px; margin: 10px 0;}
	.fpSect2-Holder {padding: 100px; color: var(--white);}
	.fpSect2-text {margin: 30px 0 0 0;}
	
	.fpSect3Wrapper {width: 90%; margin: 80px auto;}
	.fpSect3-Features {width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-column-gap: 50px; margin: 50px 0 0 0;}
	.fpSect3-FeatureHolder {border: 1px solid var(--midgray); padding: 40px; border-bottom: 10px solid var(--ec-red);}
	.fpSect3-Feature-text {margin: 20px 0 0 0;}
	
	.fpSect4Wrapper {width: 100%; background: #e1e1e1 url('images/fp-sect4-bg.jpg') no-repeat top;}
	.fpSect4-Container {width: 90%; margin: 0 auto; padding: 150px 0; display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 100px; align-items: center;}

	/* CONTENT PAGE CUSTOM STYLES */
	.gridTimeline {width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-column-gap: 60px; grid-row-gap: 60px; margin: 100px 0 0 0;}

	.profilesContainer {width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-column-gap: 50px; grid-row-gap: 50px; margin: 80px 0;}
	.personHolder {width: 100%; text-align: center;}
	.profile-pic-wrapper {width: 250px; height: 250px; border-radius: 100%; overflow: hidden; display: flex; align-items: center; justify-content: center; margin: 0 auto;}
	.profile-pic {width: 100%; height: 100%; object-fit: cover;}
	
	.solutionsGrid {display: grid; width: 100%; grid-template-columns: 1fr 1fr; grid-column-gap: 30px; grid-row-gap: 30px;}
	.solutionsHolder {border: 1px solid var(--midgray); padding: 40px; border-bottom: 10px solid var(--ec-red);}

	/* SUBNAV */
	.subNavContainer {width: 100%; border-top: 2px solid var(--dkgray); border-bottom: 2px solid var(--dkgray); margin: 0 0 50px 0;}
	ul.subnav {margin: 0; padding: 0;}
	ul.subnav li {display: inline-block; margin: 0; padding: 5px 10px; font-size: 1rem; text-transform: uppercase; font-weight: 600; color: var(--dkgray);}
	ul.subnav li:hover {background-color: var(--dkgray); color: #fff !important; cursor: pointer;}
	ul.subnav li a {color: var(--dkgray); text-decoration: none;}
	ul.subnav li a:visited {color: var(--dkgray); text-decoration: none;}
	ul.subnav li a:hover {color: var(--white); text-decoration: none;}

	/* FOOTER */
	.footerLogos {width: 90%; margin: 0 auto 50px auto;}
	.footerLogos-title {text-align: center;}
	
	.footerTestimonials {width: 70%; margin: 0 auto; text-align: center; font-family: "Source Sans 3", sans-serif; font-size: 1.4rem; line-height: 1.8rem;}
	.testimonialPerson {font-size: 1rem; margin: 20px 0 0 0;}
	
	.footerMain {width: 100%; background-color: var(--ec-red); padding: 100px 0; margin: 140px 0 0 0; position: relative;}
	.footerMain-Container {width: 90%; margin: 0 auto; padding: 0; display: grid; grid-template-columns: 500px auto; align-items: center;}
	.footerMain-Logos {display: grid; grid-template-columns: 140px 140px; grid-column-gap: 30px; align-items: center;}
	.footerMain-Info {text-align: right; display: grid; grid-template-columns: 180px 150px 150px; grid-column-gap: 20px; justify-self: end;}
	.footerMain-Text {color: var(--white); text-align: left;}
	.footerText-Heading {text-transform: uppercase; margin: 0 0 20px 0;}
	
	.footerCopyright {width: 100%; background-color: var(--ec-black); padding: 20px 0;}
    .footerCopyright-Container {width: 90%; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; align-items: center;}
    .copyright {color: #ccc; text-transform: uppercase; font-size: .8rem;}
    
    .ecBadge {position: absolute; top: 0px; left: 50%; transform: translate(-50%, -50%); width: 140px; text-align: center;}
    
	/* PROJECT STYLES */
	.projectArchive-container {width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px;}
	.projectArchive-Holder {border: 1px solid #ccc; padding: 5px; border-bottom: 5px solid var(--ec-red);}
	.projectArchive-Image {width: 100%; position: relative;}
	.projectArchive-ImageLabel {position: absolute; font-size: .7rem; font-weight: 400; letter-spacing: 0; text-transform: uppercase; background-color: var(--ec-red); color: #fff; padding: 5px 10px; right: 0; top: 0;}
	.projectArchive-Image img {width: 100%; height: fit-content;}
	.projectArchive-Title {font-size: 1rem; line-height: 1.2rem; font-weight: 600; width: 85%; margin: 15px auto;}
	.projectArchive-Location {width: 85%; margin: 0 auto 10px auto;}
	
	.projectContainer-Top {display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 80px; align-items: center;}
	
	/*
    .project {display: grid; grid-template-columns: repeat(2, 1fr); gap: 3rem; @media ( width < 1024px ) { display: block; padding: 0em; }}
    .project-gallery { aspect-ratio: 4 / 3; position:relative;}
    .project-gallery .envira-gallery-wrap { position: absolute !important; top:50% !important; left:50% !important;transform:translate(-50%,-50%) !important;}
    .project-gallery .envira-gallery-item:not(:first-child) { display: none;} 
    .project-content h1 { color: #800; text-transform: uppercase; }
    .project-location, .project-scope, .project-label { text-transform: uppercase; font-weight: bold; margin-top: 1em; }
    .project-data { }
    */
    
    .projectFeaturedImg img {height: fit-content;}
    .envira-gallery-wrap .envira-gallery-public .envira-gallery-item img { width: 100% !important; }
    
    .projectInfo-Container {display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 20px; grid-row-gap: 20px; margin: 20px 0;}
    .projectCity {font-size: 1.4rem; margin: 0px 0 0 0;}
    .projectLabel {font-weight: 800;}
    
    .projectContentMain {margin: 60px auto;}
    .projectAreaSubtitle {font-size: 1.4rem; margin: 0px 0 20px 0;}
    
    @media only screen and (max-width: 1440px) {
		
		.fpBanner {font-size: 1.6rem; text-transform: uppercase; width: 80%; text-align: center;}
		.fpSect3-Features {width: 100%; display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 50px; grid-row-gap: 50px; margin: 50px 0 0 0;}

		ul.iiMenu > li {position: relative; padding: 25px 15px 25px 15px; height: 70px; margin: 0;}
		
		.buttonSolutions {font-size: .7rem; background-color: var(--ec-black); color: var(--white); padding: 5px; position: absolute; width: 90px; text-align: center; top: 0; right: 0;}

	}

	@media only screen and (max-width: 1199px) {
		.headerContainer {grid-template-columns: 1fr 220px 1fr;}
		.headerLogo {width: 220px; padding: 15px 40px;}
		
		ul.iiMenu > li {position: relative; padding: 25px 15px 25px 15px; height: 70px; margin: 0;}
		ul.iiMenu > li > a {font-size: .8rem; color: var(--white); text-decoration: none; text-transform: uppercase; font-weight: 500; }

		.buttonSolutions {font-size: .6rem; background-color: var(--ec-black); color: var(--white); padding: 5px; position: absolute; width: 90px; text-align: center; top: 0; right: 0;}
		
		.footerMain-Container {width: 90%; margin: 0 auto; padding: 0; display: grid; grid-template-columns: 400px auto; align-items: center;}

	}

	@media only screen and (max-width: 1023px) {
	.buttonHome {display: none;}
	.buttonSolutions {display: none;}
	
	.headerContainer {display: none;}
	.m-headerContainer {display: grid; grid-template-columns: 200px auto;}
	.m-headerNav {text-align: right; font-size: 1.6rem; color: #fff; padding: 10px 0;}
	.mMenu {margin: 0 30px 0 0;}
	.headerLogo {width: 200px; position: absolute; top: 0%; left: 0%; transform: translate(0%, 0%); background-color: var(--white); padding: 15px 40px; border-bottom: 10px solid var(--ec-red); transition: .2s all;}
	.fpHeroWrapper {width: 100%; max-height: 1081px; aspect-ratio: 16 / 9; background: #fff url('images/hero-1.jpg') no-repeat top; background-size: cover; position: relative; z-index: 8888; border-top: 70px solid #fff;}
	
	.headerSectionPic {display: none;}
	.sectionTitle-container {display: none;}
	
	.m-headerSectionPic {display: block; width: 100%; border-top: 70px solid #fff; z-index: 888;}
	.m-sectionTitle-container {display: block; width: 90%; margin: 50px auto 0 auto;}
	
	.pageWrapper {margin: 50px auto;}
	.contentGrid-1-1 {display: grid; grid-template-columns: 1fr; grid-column-gap: 0px; grid-row-gap: 40px;}
	.contentGrid-1-1-1 {width: 100%; display: grid; grid-template-columns: 1fr; grid-column-gap: 0px; grid-row-gap: 40px; margin: 50px 0 0 0;}
	
	.gridTimeline {width: 100%; display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 60px; grid-row-gap: 40px; margin: 50px 0 0 0;}
	
	.footerMain-Container {width: 90%; margin: 0 auto; padding: 0; display: grid; grid-template-columns: 1fr; align-items: center;}
	.footerMain-Logos {margin: 0 auto; grid-template-columns: 1fr 1fr 1fr 1fr;}
	.footerMain-Logos img {width: 80%; margin: 0 auto;}
	.footerMain-Info {text-align: right; display: grid; grid-template-columns: 180px 150px 150px; grid-column-gap: 20px; justify-self: none; margin: 50px auto 0 auto;}
	.footerMain-Text {text-align: center;}
	.footerCopyright-Container {width: 90%; margin: 0 auto; display: grid; grid-template-columns: 1fr; align-items: center;}
	.copyright {text-align: center;}
	
	ul.subnav li {display: inline-block; margin: 0; padding: 5px 10px; font-size: .8rem; text-transform: uppercase; font-weight: 600; color: var(--dkgray);}
	
	h3.areaTitle {font-size: 1.2rem; margin: 0; padding: 0; line-height: 1.2rem; text-transform: uppercase;}
	
	.fpSect2Wrapper {width: 100%; display: grid; grid-template-columns: 1fr; grid-column-gap: 0px; grid-row-gap: 10px; margin: 10px 0;}
	.fpSect2-Holder {padding: 50px 100px; color: var(--white);}
	.fpBanner {position: absolute; bottom: -75px; left: 50%; transform: translate(-50%, -50%); background-color: var(--white); padding: 20px; font-size: 1.2rem; text-transform: uppercase; width: 80%; text-align: center;}
	.mExtraPadding {padding-top: 80px;}
	
	.fpSect3-Features {width: 100%; display: grid; grid-template-columns: 1fr; grid-column-gap: 50px; grid-row-gap: 50px; margin: 50px 0 0 0;}
	
	.fpSect4-Container {width: 90%; margin: 0 auto; padding: 80px 0; display: grid; grid-template-columns: 1fr; grid-column-gap: 0px; grid-row-gap: 60px; align-items: center;}
	.fpSect4-text {text-align: center;}
	
	.projectArchive-container {width: 100%; display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px;}
	
	.projectContainer-Top {display: grid; grid-template-columns: 1fr; grid-column-gap: 0px; grid-row-gap: 40px; align-items: center;}
	
		@media only screen and (max-width: 1023px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
	
	
		}

	}

	@media only screen and (max-width: 767px) {
		.headerLogo {width: 160px; position: absolute; top: 0%; left: 0%; transform: translate(0%, 0%); background-color: var(--white); padding: 16px 30px; border-bottom: 10px solid var(--ec-red); transition: .2s all;}
		
		.scrolled .headerLogo {width: 150px; padding: 10px 30px;}
		
		h1.sectionTitle {font-size: 1.8rem; margin: 0; padding: 0; line-height: .8; text-transform: uppercase;}
		h2.sectionTitle2 {font-size: 1.8rem; margin: 0; padding: 0; line-height: .8; text-transform: uppercase;}
	
		h2.sectionTitle {font-size: 1.6rem; margin: 0; padding: 0; line-height: auto;}
		h3.sectionSubtitle {font-size: 1rem; margin: 0; padding: 0; line-height: auto;}
	
		h1.projectTitle {font-size: 1.6rem; margin: 0; padding: 0; line-height: 1.6rem; text-transform: uppercase;}
		h3.projectAreaTitle {font-size: 1.2rem; margin: 0; padding: 0; line-height: 1.2rem; text-transform: uppercase;}
	
		h3.personTitle {font-size: 1rem; margin: 0; padding: 0; line-height: 1rem; text-transform: uppercase; margin: 20px 0 5px 0;}
		h4.personDesc {line-height: .8rem;}
	
		h3.areaTitle {font-size: 1.2rem; margin: 0; padding: 0; line-height: 1.2rem; text-transform: uppercase;}
		.areaSubtitle {font-size: 1rem; margin: 0px 0 20px 0;}
		
		.footerTestimonials {width: 80%; margin: 0 auto; text-align: center; font-family: "Source Sans 3", sans-serif; font-size: 1rem; line-height: 1.4rem;}
		
		.footerMain-Logos {margin: 0 auto; grid-template-columns: 1fr; grid-column-gap: 0; grid-row-gap: 20px;}
		.footerMain-Logos img {width: 50%; margin: 0 auto;}
		.footerMain-Info {text-align: right; display: grid; grid-template-columns: 1fr; grid-column-gap: 0px; grid-row-gap: 20px; justify-self: none; margin: 50px auto 0 auto;}
		
		.copyright {font-size: .6rem;}
		
		.fpSect2-Holder {padding: 50px 50px; color: var(--white);}
		.fpBanner {position: absolute; bottom: -45px; left: 50%; transform: translate(-50%, -50%); background-color: var(--white); padding: 10px; font-size: .7rem; text-transform: uppercase; width: 90%; text-align: center;}
		
		.projectArchive-container {width: 100%; display: grid; grid-template-columns: 1fr; grid-column-gap: 0px; grid-row-gap: 40px;}
	
	}

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

/* A CSS Reset */
@layer reset {
    *, *::before, *::after { box-sizing: border-box; }
    * {margin: 0; }
    @media (prefers-reduced-motion: no-preference) {
        html { interpolate-size: allow-keywords; }
    }
    body { line-height: 1.5; -webkit-font-smoothing: antialiased; }
    img, picture, video, canvas, svg { display: block; max-width: 100%;  }
    input, button, textarea, select { font: inherit; }
    p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
    p { text-wrap: pretty; }
    h1, h2, h3, h4, h5, h6 { text-wrap: balance; }
    #root, #__next { isolation: isolate; }
}