@font-face {
	font-family: 'head';
	src: url('TGSPerfectCondensed.woff') format(woff);
	font-display: swap;
}
@font-face {
	font-family: 'lato-reg';
	src: url('Lato-Regular.woff') format(woff);
	font-display: swap;
}
@font-face {
	font-family: 'man';
	src: url('Manuella.woff') format(woff);
	font-display: swap;
}
:root {
	--dark:#181b1d;
	--light:#223483;
	--yellow:#5ac9e2;/*c2b19a*/
	--black:#121216;
	--white:#fff;
}
* {box-sizing:border-box;}
* {scrollbar-width: none;  /* Firefox */}
*::-webkit-scrollbar {display: none;}
* {-ms-overflow-style: none;  /* IE and Edge */}
body {padding:0;margin:0;font-size:20px;width:100vw !important;overflow-x:hidden;background-color:var(--dark);isolation:isolate;font-family: 'lato-reg';line-height:2;color:var(--white);transition:all 0.3s;}
.skip-link {position: absolute;top: -60px;left: 0;background: #000;color: #fff;padding: 8px 16px;z-index: 100;text-decoration: none;transition: top 0.3s;}
.skip-link:focus {top: 0;}
.visually-hidden {position: absolute;left: -9999px;width: 1px;height: 1px;overflow: hidden;clip: rect(0 0 0 0);white-space: nowrap;}
#custom-scrollbar {position: fixed;top: 10vh;right: 47px;height: 80vh;width: 8px;background: rgba(255, 255, 255, 0.1);z-index: 8;border-radius: 4px;mix-blend-mode: difference;}
#scroll-thumb {position: absolute;top: 0;left: 0;width: 100%;background: #fff;border-radius: 4px;cursor: grab;height:60px}
h2 {font-family: 'head';font-size:6em;margin:1em 0 0.5em;line-height:1;text-transform:uppercase;overflow:hidden;line-height:1.25;perspective: 80rem;transform-style: preserve-3d;margin-top:0;}
h3 {font-family: 'head';font-size:2.25em;margin:1em 0 0.5em;text-transform:uppercase;color:#5ac9e2;letter-spacing:1px;}
p {margin:1em 0;}
a {text-decoration:none;color:inherit;}
.grads {position:fixed;width:100vw;height:100vh;z-index:0;background-image:url('../images/noise2.webp');background-color:#1d2042;}
#one {display:none;position:absolute;right:-10%;width:100vw;height:100vh;background-image:linear-gradient(rgba(139,189,255,0.8) 0,rgba(139,189,255,0) 40%);mix-blend-mode:hard-light;animation:down 20s infinite;opacity:0.4;filter:blur(200px)}
#two {display:none;position:absolute;left:-10%;top:-10%;width:100vw;height:100vh;background-image:linear-gradient( rgba(100, 159, 236, 0.8) 0,rgba(74,111,255,0) 40%);mix-blend-mode:hard-light;animation:circledown 30s infinite;opacity:0.6;filter:blur(200px)}
#three {display:none;position:absolute;right:0;bottom:0;width:100vw;height:100vh;background-image:radial-gradient(circle at 10% 30%, rgba(100,220,255,0.8) 0,rgba(100,220,255,0) 40%);mix-blend-mode:hard-light;animation:circle 30s reverse infinite;opacity:0.4;filter:blur(160px)}
@keyframes circledown{
	0% {
	transform:rotate(0deg);
	top:-10%;
	}
	50% {
	transform:rotate(180deg);
	top:-50%;
	}
	100% {
	transform:rotate(360deg);
	top:-10%;
	}
  }
 
 @keyframes circle{
	0% {
	transform:rotate(0deg);
	
	}
	50% {
	transform:rotate(180deg);
	
	}
	100% {
	transform:rotate(360deg);
	
	}
  }
  
  @keyframes down{
	0%, 100%{
		top:0px;
		left:10vw;
	}
	50%{
		top:30vh;
		left:30vw;
	}
  }
.center {text-align:center;}
.cursor {position: fixed;left: 0;top: 0;width: 10rem;height: 10rem;padding:10px;overflow: hidden;z-index: 11;pointer-events: none;will-change: transform;mix-blend-mode: difference;}
.cursor__holder {position: relative;display: flex;align-items: center;justify-content: center;width: 100%;height: 100%;}
.cursor__bg {position: absolute;width: 100%;height: 100%;background-color: #fff;border-radius: 50%;scale: 0.2;transition: all .3s ease-in-out 0s;}
.cursor__bg2 {background-color:#fff;scale: 0;}
.cursor__text {color:#000;line-height:1;position: absolute;text-align: center;font-size: 1.5rem;font-weight: 600;letter-spacing: -0.05rem;opacity: 0;transition: all .2s ease-in-out 0s;padding:5px;box-sizing: border-box;}
.cursor.is-hovering {mix-blend-mode: unset;}
.cursor.is-hovering .cursor__bg {scale:1;background-color:#000;} 
.cursor.is-hovering .cursor__bg2{scale:0.95;background-color:#fff;}
.cursor.is-hovering .cursor__text {opacity:1;}
#sidenav {position:fixed;top:0;right:0;height:100vh;margin-right:-100%;transition:all 1s;background-color:var(--black);color:var(--white);width:100%;padding:100px 40px 0;z-index:9;text-transform:uppercase;mix-blend-mode: difference;font-family: 'head';font-size:4em;text-transform: uppercase;}
#sidenav a {color:#fff;mix-blend-mode: difference;}
#sidenav li {font-size:1em;}
#sidenav .submenu li {font-size:0.6em;}
.submenu {position:absolute;top:111px;left:850px;}
.dropdown-toggle i {margin-left: 20px;cursor: pointer;font-size:0.8em;}
.submenu {max-height: 0;overflow: hidden;transition: all 0.5s;padding: 0;}
.has-dropdown.open .submenu {max-height:90vh;padding: 10px 0;}
#brand {position:fixed;top:40px;left:40px;z-index: 10;mix-blend-mode:difference;text-transform:uppercase;}
#brand svg {width:auto;height:45px;}
#brand p {width:max-content;font-size:24px;line-height:1;margin:0;position:absolute;top:0;left:45px;}
.mobilemenu {position:fixed;top:30px;right:30px;z-index: 10;mix-blend-mode:difference}
#menubtn {position:absolute;top: 0px;right: 40px;z-index:999;color:#fff;cursor: pointer;z-index:2;font-size:24px;text-transform:uppercase;}
.c-hamburger {background-color:transparent;display: block;position: absolute;top: 12px;right: 0px;overflow: hidden;margin: 0;padding: 0;width: 44px;height: 50px;font-size: 0;text-indent: -9999px;appearance: none;border: none;cursor: pointer;transition: background 0.3s;z-index:999;}
.c-hamburger:focus {outline: none;}
.c-hamburger span {display: block;position: absolute;top: 10px;left: 12px;right: 12px;height: 3px;background-color:#fff;}
.c-hamburger span::before, .c-hamburger span::after {position: absolute;display: block;left: 0;width: 100%;height: 3px;background-color:#fff;content: "";transition: all 1s;}
.c-hamburger span::before {top: -10px;}
.c-hamburger span::after {bottom: -10px;}
.c-hamburger--htx span {transition: all 0.3s;}
.c-hamburger--htx span::before, .c-hamburger--htx span::after {transition-duration: 0.3s, 0.3s;transition-delay: 0.3s, 0s;}
.c-hamburger--htx span::before {transition-property: top, transform;}
.c-hamburger--htx span::after {transition-property: bottom, transform;}
.c-hamburger--htx.is-active {background-color:transparent;}
.c-hamburger--htx.is-active span {background: none;}
.c-hamburger--htx.is-active span::before {top: 0;transform: rotate(45deg);}
.c-hamburger--htx.is-active span::after {bottom: 0;transform: rotate(-45deg);}
.c-hamburger--htx.is-active span::before, .c-hamburger--htx.is-active span::after {transition-delay: 0s, 0.3s;background-color:#fff;}
#content {transition:all 0.3s;width:100vw;overflow-x:hidden;}
.tagline, #reelholder video {cursor:none;}
.char {will-change: transform;}
section {position:relative;z-index:1;}
#tagintro {font-size:4.5em;overflow:hidden;line-height:1;margin:0;font-family: 'head';text-transform:uppercase;color:var(--white);text-shadow:1px 1px 3px #121216;position:absolute;left:100px;bottom:100px;margin-bottom:2em;}
.tagline {font-size:9em;overflow:hidden;line-height:1;margin:0;font-family: 'head';text-transform:uppercase;color:var(--white);text-shadow:1px 1px 3px #121216;position:absolute;left:50%;transform:translateX(-50%);width:max-content;bottom:100px;}
.hero {display:grid;height:100vh;margin-top:0px;width:100vw;padding:100px;justify-items:center;}
.hero h1 {text-transform:uppercase;font-size:1.25em;z-index:1;}
.hero #tagintro {font-size:4.5em;overflow:hidden;line-height:1;margin:0;font-family: 'head';text-transform:uppercase;color:var(--white);text-shadow:1px 1px 3px #121216;position:relative;left:unset;bottom:unset;z-index:1;top:120px;}
.hero .tagline {font-size:9em;overflow:hidden;line-height:1;margin:0;font-family: 'head';text-transform:uppercase;color:var(--white);text-shadow:1px 1px 3px #121216;position:absolute;z-index:1}
.hero #darkimghold {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);padding-top:0;z-index:0;}
.hero #darkimg {opacity:0.5;}
#contacthead {height:70vh;}
.projecthead {height:90vh;}
#introvid {position:absolute;top:0;left:0;width:100vw;height:100vh;}
#reel {width:100vw;height:100vh;display:grid;place-items:center;}
#reelholder {width:60vw;height:600px;overflow:hidden;transition:all 1s;clip-path:inset(20px round 20px);background-color:var(--white);}
#reelholder.fullscreen {width:90vw;height:90vh;}
#reelholder video {width:auto;height:100vh;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);object-fit: cover;top:0;}
#reelholder.fullscreen video {width:auto;height:100vh;}
.project #reelholder.fullscreen video {width:100%;height:auto;}
#about {position:relative;padding:150px 150px 0;}
#about p {font-size:1.6em;color:var(--black);margin:0 auto;width:90%;font-weight:400;margin-bottom:100px;}
#map {width:100%;max-width:1200px;margin:0 auto;transform:rotate(-10deg);transform-origin:left;position:relative;}
.marker svg {width:32px;height:32px;}
#coastline {width:100%;}
#fv-marker {position: absolute;top: 32%;left: 31%;}
#hb-marker {position: absolute;top: 40%;left: 18%;}	
#cm-marker {position: absolute;top: 41%;left: 33%;}
#nb-marker {position: absolute;top: 54%;left: 37%;}
.marker{opacity: 0;pointer-events: auto;text-decoration: none;}
.tooltip {position: absolute;bottom: 120%;left: 50%;transform: translateX(-50%);background: #5ac9e2;color:var(--black);padding: 4px 8px;border-radius: 6px;font-size: 16px;
	white-space: nowrap;opacity: 0;transition: opacity 0.3s;pointer-events: none; }
#seointro p {font-size:1.6em;padding:100px;color:var(--black);margin:0 auto;}
#desintro {font-size:1.6em;padding:100px;color:var(--black);margin:0 auto 200px;}
#abthold {z-index: 1;}
#seointro p {margin-bottom:150px;}
#outdated, #invisible {font-family: 'head';font-size:9em;padding:0 100px;text-transform: uppercase;}
#outdated .word {line-height:1;overflow:hidden;}
#highlights {padding:100px}
.line1 {display:flex;align-self: flex-start;line-height:1;overflow:hidden;}
.line2 {display: flex;align-self: flex-end;line-height:1;overflow:hidden;}
#outdated p, #invisible {overflow:hidden;line-height:1.25;width:90%;perspective: 80rem;transform-style: preserve-3d;}
#darkimghold {width:100vw;text-align: center;padding-top:200px;perspective: 80rem;transform-style: preserve-3d;}
#darkimg {filter:brightness(0);transform:translateZ(-200px);perspective:1000px;transform-style: preserve-3d;width:50%;height:auto;}
#darkimgglow {background: #5ac9e2;filter:blur(200px);height:50vh;position:absolute;bottom:10vh;width:60vw;left:20vw;z-index: 0;perspective:1000px;transform-style: preserve-3d;transform:translateZ(-250px);opacity:0}
#design2 {width:100vw;margin:-20px 0 50px;display:grid;grid-template-columns: 1fr 1fr;padding:150px 100px;}
#design {padding-top:0px;}
#design2 > div {position:relative;}
#design2 .imgholder {position:absolute;width:50%;}
#design2 .imgholder img {width:100%;height:auto;box-shadow: 1px 1px 5px 3px rgba(0,0,0,0.3);}
#design2 h3 {line-height:1;}
#desimg1 {left:30%;top:20%;}
#desimg2 {left:10%;top:80%;}
#desimg3 {left:50%;top:150%;}
#svg-section1 {position:relative;padding:100px;}
#svg-content1 {width:100%;height:auto;}
.container {display: flex;width: 100%;max-width: 1600px;margin: 0 auto;box-sizing: border-box;position: relative;}
.container .pin-spacer {width:800px !important;max-width:800px !important;}
.left {width:800px;max-width:800px;height:100vh;display: flex;align-items: center;justify-content: center;font-weight: bold;position: relative;box-sizing:border-box;}
.left h2 {position:absolute;top:0;}
.right {width:100%;display: block;padding-left: 50px;position: relative;padding-top:165px;}
.reason {padding:0 150px;font-size: 1.5rem;height:100vh;display:grid;align-content: center;}
#svg-content1, #svg-content2, #svg-content3, #svg-content4 {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:70%;height:auto;opacity:0;}
.mobsvg {display:none;opacity:0;}
#process {position:relative;height:100vh;}
#process h2 {position:absolute;top:100px;left:100px;}
.processsteps {position:absolute;top:300px;width:300px;height:auto;left:50%;transform:translateX(-50%);}
.stage {width:100%;height:100vh;display:grid;align-content:center;justify-content:center;position:absolute;top:0;left:0;padding-top:100px}
.stage h3, .stage p {width:90%;max-width:1000px}
.spacer {height: 100vh;background: transparent;}
#study.ocs {padding-bottom:250px;}
#study .icon {padding:0;float:none;margin-left:10px;position:relative;top:5px;}
#itext, #stext {font-size:1.6em;padding:0 0 200px;color:var(--black);margin:0 auto;width:90%;}
.igrid {display:grid;grid-template-columns:1fr 1fr 1fr;width:90%;max-width:1200px;gap:60px;margin:0 auto;padding-bottom:150px;}
.igrid div {position:relative;border-radius:10px;overflow:hidden;}
.igrid img, .igrid video {width:100%;height:auto;}
.igridname {position:absolute;width:100%;bottom:0;text-align:center;background-color:#121216;color:#fff;margin:0;}
#details {padding:0 100px;}
#details h2 {overflow:hidden;line-height:1.25;perspective: 80rem;transform-style: preserve-3d;}
#details h3 {margin:0;}
#details hr {width:100%;margin:0;}
#details > div {display:grid;grid-template-columns:1fr 1fr;padding:50px 100px;transition:all 0.3s;}
#study {padding:100px;}
#study #itext {padding:50px 0 100px;}
#study img {float:right;padding-bottom:100px}
#studytxt {padding:0 100px;}
#work {position:relative;padding:100px;}
#work h2 {font-family: 'head';font-size:2em;margin:1em 0 0.5em;text-transform:uppercase;color:#fff;letter-spacing:1px;}
#formholder {position:relative;height:100vh;display:grid;align-content:center;justify-content: center;}
#work .scrolls {position:absolute;top:14vh;transform:rotate(-5deg);}
#contact .scrolls {position:absolute;top:17vh;transform:rotate(-5deg);}
.hero .scrolls {position:absolute;top:20vh;}
.scrolls ul {width:max-content;}
.rscroll, .lscroll {font-family: 'head';font-size:12em;margin:0;display:inline-block;padding-right:100px;line-height: 1.2;color:var(--white);text-transform: uppercase;opacity:0.4}
form {width:90%;max-width:800px;backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);background-color:#5ac9e214;border-radius:20px;box-sizing: border-box;padding:25px;box-shadow: 1px 1px 5px 3px rgba(0,0,0,0.3);}
.fleft {width:45%;margin-right:10%;display:inline-block;margin-bottom:20px;float:left}
.fright {width:45%;display:inline-block;margin-bottom:20px;}
.ffull {width:100%;display:inline-block;margin-bottom:20px;}
input {padding:5px;width:100%;box-sizing:border-box;border-radius:5px;border:1px solid #f9f9f9;}
input[type='radio'] {width:auto;display:inline-block;}
input, select, option, textarea {font-family: 'lato';font-size:20px;}
option:hover {background-color:#5ac9e2;}
select {padding:5px;border-radius:5px;width:100%;}
textarea {padding:5px;width:100%;box-sizing:border-box;border-radius:5px;border:1px solid #f9f9f9;height:100px;}
.req {color:#ff9797;font-size:14px;position:relative;top:-5px;left:5px;margin-right:20px;}
input[type='submit'] {background-color:#5ac9e2;border-color:#5ac9e2;color:var(--white);font-size:1.25em;padding:10px 0;font-family: 'head';letter-spacing:1px;text-transform:uppercase;text-shadow:1px 1px 3px #121216;}
.budgethold {padding-top:24px}
#study h2 {width:90%;max-width:1000px;text-align:center;margin:100px auto;}
#faq {padding:100px;position:relative;}
#faq h2 {overflow:hidden;line-height:1.25;perspective: 80rem;transform-style: preserve-3d;margin-top:0;margin-bottom:100px}
#faq h3 {margin:40px 0 0;line-height:1;color:#fff;}
.icon {transition:all 0.5s;}
.faqholder {width:90%;max-width:1200px;margin:30px auto;position:relative;}
.accordion {position:relative;cursor: pointer;margin:0;width: 100%;border: none;text-align: left;transition: 0.4s;}
.faqpanel {max-height: 0;overflow: hidden;transition: max-height 0.2s ease-out;}
.panel p {margin-top:10px;}
.faqholder .icon {float: right;margin-left: 5px;position:absolute;top:3px;right:20px;transition:all 0.3s;}
.accordion.open .icon {transform:rotate(180deg)}
#reviews {padding-top:0px;position:relative;width:100vw;overflow-x:hidden;}
#reviewsection {position:relative;width:100vw;height:100vh;overflow:hidden;}
#reviews h2 {overflow:hidden;line-height:1.25;perspective: 80rem;transform-style: preserve-3d;margin-top:0;margin-bottom:50px;}
.line {overflow:hidden;display:block;white-space: nowrap;}
.word {display:inline-block;}
.reviewholder {height:100vh;display:grid;grid-template-columns:1fr 1fr;width:100vw;position:absolute;}
.reviewtext {display:grid;padding:100px;align-content:center;}
.reviewimage {height:100vh;overflow:hidden;padding:100px;}
.reviewimage img {width:100%;height:auto;box-shadow: 1px 1px 5px 3px rgba(0,0,0,0.3);}
.dropdown-toggle .icon {width:60px;height:auto;position:relative;top:3px;}
.reviewer {text-align:right;}
#project-intro {width:100vw;height:100vh;display:flex;align-items:center;flex-direction:column-reverse;justify-content:flex-start;}
#project-intro img {position:absolute;top:10%;left:50%;transform:translate(-50%, -0%);z-index:-1;}
#project-intro h1, #project-intro #ptype {font-family:'head';font-size:7em;text-transform:uppercase;text-align:center;text-shadow:2px 2px 6px #121216;line-height:1;overflow:hidden;}
#pname {font-family:'head';font-size:7em;text-transform:uppercase;text-align:center;text-shadow:2px 2px 6px #121216;line-height:1;line-height:1;overflow: hidden;margin:0;margin-bottom:20vh;}
#project-details, #project-brief {padding:0 100px;}
#overview {font-size:1.6em;color:var(--black);margin:0 auto;width:100%;font-weight:400;margin-bottom:150px;}
#project-details img, #project-brief img {border-radius:20px;margin:150px auto;width:100%;height:auto;display:block;box-shadow: 1px 1px 5px 3px rgba(0,0,0,0.3);}
#project-details .icon {width:24px !important;height:24px !important;display:inline-block !important;margin:0 !important;margin-left:10px !important;box-shadow:unset !important;position:relative;top:5px;}
#project-review {width:90%;max-width:1000px;margin:0 auto;font-size:1.5em;line-height:1.5}
.projectgrid {width:100%;padding:100px;display:grid;grid-template-columns:1fr 1fr;gap:30px;}
.projectgrid img {width:100%;height:auto;box-shadow: 1px 1px 5px 3px rgba(0,0,0,0.3);border-radius:20px;}
#others {padding:0 100px;}
#others h3 {color:#fff;}
#others img {border-radius:20px;box-shadow: 1px 1px 5px 3px rgba(0,0,0,0.3);margin-right:20px;}
#contact {margin-top:-50px;}
#contacthead #tagintro {top:-20px;}
#policy {padding:100px;max-width:1200px;margin:0 auto;position:relative;}
#policy h2 {font-size:3em;margin-top:2em;text-align:left !important;}
#policy p, #policy div, #policy ul {position:relative;}
footer {position:relative;font-size:0.9em;padding:100px 100px 10px;}
#copyright {text-align:center;}
footer .icon {margin-right:10px;position:relative;top:5px}
#abtag {text-align:center;font-size:3.5em;text-transform: uppercase;font-family: 'head';letter-spacing:1px;line-height:1;}
#fgrid {display:grid;grid-template-columns:calc(100% - 320px) 320px;width:90%;max-width:1200px;margin:0 auto;align-items:end;}
#fabout {width:90%;}
#flinks ul li {display:inline-block;}
.jiRkQU {bottom:13px !important;}
@media screen and (max-height:775px) {
	.hero .tagline {top:unset !important;bottom:60px;}
	#work .scrolls {top:2vh;}
	
}


@media screen and (max-width:1600px) {
	.hero #tagintro {font-size:3.5em;}
	.hero .tagline {font-size:7.5em;}
	#outdated, #invisible {font-size:6.5em;}
	h2 {font-size:5em;}
}

@media screen and (max-width:1400px) {
	#sidenav {font-size:3em;}
	.submenu {top:105px;left:640px;}
	#project-intro h1, #pname {font-size:5em;}
	#details > div {padding:0;}
	#details h2 {font-size:3.5em;}
	.dropdown-toggle .icon {width:45px;top:2px;}
}

@media screen and (max-width:1100px) {
	#sidenav {font-size:2.5em;}
	.dropdown-toggle .icon {width:40px;}

	.submenu {top:102px;left:550px;}
	#project-intro h1, #pname {font-size:4em;}
	#overview a {display:unset !important;}
	#cm-marker {top:39%;left:32%;}
	#nb-marker {left:38%;}
	#fv-marker {top:31%;left:29%;}
	#hb-marker {top:39%;}
	#outdated, #invisible {font-size:5em;}
	
	.reason {padding:0 75px;font-size:1.25rem;}
	.processsteps {top:240px;}
	.stage {width:90%;left:10%;}
	.reviewtext, .reviewimage {padding:50px;}
	.reviewtext h3 {line-height:1;}
	.reviewimage {display:grid;align-items:center;}
	.faqholder .fa-caret-down {right:-15%;}
	#faq h3 {width:85%;}
}

@media screen and (max-width:1000px) {
	#sidenav {font-size:2.5em;}
	.submenu {top:102px;left:550px;}
	#project-intro h1, #pname {font-size:4em;}
	#fgrid {grid-template-columns:1fr;}
	#details > div {grid-template-columns:1fr;padding:0;margin-bottom:100px;}
}

@media screen and (max-width:900px) {
	.submenu {position:relative;top:unset;left:unset;}
}

@media screen and (max-width:600px) {
	.content {overflow-x:hidden;}
	.c-hamburger {top:-15px;right:-25px;}
	#menubtn {top:-27px;right:15px;}
	#sidenav {padding:100px 20px 20px;font-size:1.5em;letter-spacing:1px;}
	.submenu {font-size:1.5em;}
	.dropdown-toggle .icon {width:30px;top:3px;}
	#custom-scrollbar {right:20px;}
	#brand {top:10px;left:10px;}
	#brand p {display:none;}
	.hero {padding:20px;}
	.hero h1 {left:0px;line-height:1.2;top:15vh;max-width:calc(100vw - 40px);position:relative;text-align: center;}
	
	.hero #tagintro {font-size:2.25em;top:15vh;}
	.hero .tagline {font-size:3em;bottom:unset;top:72vh !important;}
	#contacthead .tagline {top:45vh !important;}
	#contacthead #tagintro {top:8vh;}
	#darkimg {width:95%;}
	#darkimgglow {width:100vw;left:0;bottom:0;height:45vh;}
	#about, #desintro {padding: 40px 40px 0;}
	#about p, #seointro p, #itext, #desintro, #overview, #stext {font-size:1.2em;width:100%;line-height:1.5;}
	#map {width:130%;}
	.marker svg {width:24px;height:24px;}
	#hb-marker {top:34%;}
	#fv-marker {top:30%;left:27%;}
	#cm-marker {top:36%;left:31%;}
	#nb-marker {top:48%;left:35%;}
	#outdated, #highlights, #invisible {font-size:2.75em;padding:20px;}
	#outdated p, #invisible p {margin-bottom:unset;}
	#design h2 {width:90%;margin:0 auto;}
	h2 {font-size:2.5em;}
	h3 {font-size:1.8em;}
	#design2 {grid-template-columns:1fr;padding:20px;}
	#design2 .texthold {padding-bottom:200px;}
	.imgholder {width:50vw;}
	#desimgs {height:50vh;top:0;}
	#desimg1 {left:25%;top:0%;}
	#desimg2 {left:10%;top:50%}
	#desimg3 {left:unset;right:10%;top:100%;}
	#seointro p {padding:40px;margin-bottom:50px}
	#seo .left {display:none;}
	.right {width:100vw;overflow:hidden;padding:0;}
	.reason {padding:40px 20px;font-size:1em;height:auto;}
	.reason h3 {line-height: 1;text-align: center;}
	.mobsvg {display:block;}
	.reason svg {width:60%;margin:40px auto;}
	#process {padding:20px !important;}
	#process h2 {top:40px;left:40px;line-height:1;}
	.processsteps {top:150px;}
	.stage {padding:130px 20px 20px;box-sizing:border-box;width:100%;left:0;}
	.stage h3 {line-height:1;margin-bottom:0;}
	.stage p {margin-top:0;}
	#itext {padding:40px;}
	#stext {padding:0px 0px 60px;}
	.igrid {grid-template-columns:1fr;padding-bottom:0;}
	.reviewholder {grid-template-columns:1fr;}
	.reviewtext {padding:20px;height:100vh;display:flex;align-content:flex-end;flex-wrap: wrap;}
	.reviewtext h3 {line-height:1;margin-top:0;text-shadow:1px 1px 3px #121216;}
	.reviewtext p {line-height: 1.5em;text-shadow:1px 1px 3px #121216;}
	.reviewimage {margin-top:-100vh;padding:40px;z-index:-1;opacity:0.6;display:grid;align-items: start;}
	#work {padding:100px 0px 150px;}
	#work .scrolls {overflow:hidden;}
	#workholder {height:unset;}
	form {padding:20px;margin:0 auto;}
	.fleft, .fright {width:100%;}
	.budgethold {padding-top:0;}
	.budgethold .fleft {margin-bottom:0;}
	#faq {padding:0px 20px 50px;}
	#faq h3 {width:calc(100% - 10px);}
	.faqholder .icon {float:none;margin-left:0;right:-10px;}
	#study.ocs {padding-bottom:50px;}
	footer {padding:20px 20px 10px;}
	#fgrid {grid-template-columns:1fr;}
	#fgrid img {width:100%;height:auto;}
	#fgrid .icon {width:24px;}
	#abtag {font-size:2.5em;line-height:1.25;}
	#study {padding:40px;}
	#study img {width:100%;height:auto;}
	#study .icon {width:24px;}
	#studytxt {padding:0 0 100px;}
	#project-intro img {width:90%;height:auto;}
	#project-intro h1, #pname {font-size:3em;}
	#project-details, #project-brief {padding:40px;}
	
	#details {padding:0;}
	
	.projectgrid {padding:20px;gap:20px;grid-template-columns:1fr;}
	#others {padding:0 40px;}
	#others img {margin-bottom:20px;}
}

@media screen and (max-width:400px) {
	.hero #tagintro {font-size:2em;}
	.hero .tagline {font-size:2.75em;}
	#desimgs {top:40vh;}
	.stage {line-height:1.25;}
	#studytxt h3 {line-height:1;}
}

@media (hover: none){
	.cursor {display: none;}
}