html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-family:sans-serif}
body{margin:0; cursor: crosshair;}
footer,menu,summary{display:block}
video{vertical-align:baseline;display:inline-block}[hidden]{display:none}
a{background-color:transparent; cursor: crosshair;}
a:active,a:hover{outline:0}
b{font-weight:700}
h1{margin:.67em 0;font-size:2em}
img{border:0}
svg:not(:root){overflow:hidden}
html[data-w-dynpage] [data-w-cloak]{color:transparent!important}
h1,h2,h3,h4,h5,h6{margin-bottom:10px;font-weight:700}
h1{margin-top:20px;font-size:38px;line-height:44px}
h2{margin-top:20px;font-size:32px;line-height:36px}
h3{margin-top:20px;font-size:24px;line-height:30px}
h4{margin-top:10px;font-size:18px;line-height:24px}
h5{margin-top:10px;font-size:14px;line-height:20px}
h6{margin-top:10px;font-size:12px;line-height:18px}
.w-embed:after,.w-embed:before{content:" ";grid-area:1/1/2/2;display:table}
.w-embed:after{clear:both}
body{color:var(--swatches--elderberry);font-family:Inter,sans-serif;font-size:16px;line-height:1.5em}
h1{margin-top:20px;margin-bottom:20px;font-family:"Overpass Mono",sans-serif;font-size:80px;font-weight:700;line-height:1.2em}
h2{margin-top:20px;margin-bottom:20px;font-family:"Overpass Mono",sans-serif;font-size:48px;font-weight:700;line-height:1.2em}
h3{margin-top:20px;margin-bottom:20px;font-family:calluna,sans-serif;font-size:40px;font-weight:700;line-height:1.2em}
h4{margin-top:20px;margin-bottom:20px;font-family:calluna,sans-serif;font-size:32px;font-weight:700;line-height:1.2em}
h5{margin-top:20px;margin-bottom:20px;font-family:calluna,sans-serif;font-size:28px;font-weight:700;line-height:1.2em}
h6{letter-spacing:.1em;text-transform:uppercase;margin-top:20px;margin-bottom:20px;font-family:"Overpass Mono",sans-serif;font-size:20px;font-weight:700;line-height:1.2em}
p{margin-top:10px;margin-bottom:10px}
a{text-decoration:underline}
img{max-width:100%;display:inline-block}
.scroll-frame{flex-direction:column;justify-content:center;align-items:center;min-height:100svh;display:flex;position:relative;overflow:hidden}
.scroll-frame.sticky{position:-webkit-sticky;position:sticky;top:0}
.scroll-frame.full{align-items:stretch}
.mega-wrap{flex-direction:column;justify-content:start;align-items:center;width:100svw;height:100svh;margin-top:-50svh;margin-left:-50svw;display:flex;position:absolute;top:50%;left:50%;transform:rotate(0)}
.mega-wrap._2{transform:rotate(-6deg)}
.mega-wrap._3{transform:rotate(6deg)}
.mega-wrap._4{transform:rotate(-15deg)}
.container{width:100%;max-width:2880px;position:relative}
.scroll-path{min-height:100svh;position:relative}
.scroll-path.bow-flight{min-height:200svh}
.p{letter-spacing:normal;text-transform:none;margin-top:10px;margin-bottom:10px;font-size:16px;font-weight:400;line-height:1.5em}
.narrow-wrap{width:100%;max-width:600px;margin-left:auto;margin-right:auto;padding:20px;position:relative}
.bow-wrap{position:absolute;transform:translateY(15svh) rotate(15deg)}
.label{padding:0 4px;letter-spacing:.1em;font-family:"Overpass Mono",sans-serif;font-size:12px;font-weight:700;line-height:1.5em;color:#82929e;background-color:#fff}
.label a, .label a:active, .label a:visited { color:#82929e; text-decoration:none; }
.label a:hover { color:#000; text-decoration:none; }
.hidden{display:none}
.fit-cover{object-fit:cover;width:100%;height:100%;transition:all .2s;transform:scale(1)}
.super-cover{background-color:v3ar(--swatches--fades--black-50);width:100%;height:100%;position:relative;overflow:hidden}
.super-card{flex-direction:column;justify-content:center;align-items:stretch;width:100%;max-width:1960px;margin-left:auto;margin-right:auto;padding:0;font-size:20px;line-height:1.5em;text-decoration:none;display:flex;position:relative}
.v-wrap{padding-top:40px;padding-bottom:40px}
.h-wrap{padding-left:40px;padding-right:40px}
.h1{letter-spacing:normal;text-transform:none;margin-top:20px;margin-bottom:20px;font-family:"Overpass Mono",sans-serif;font-size:80px;font-weight:700;line-height:1.2em}
.h2{letter-spacing:normal;text-transform:none;margin-top:20px;margin-bottom:20px;font-family:"Overpass Mono",sans-serif;font-size:48px;font-weight:600;line-height:1.2em}
.h3{letter-spacing:normal;text-transform:none;margin-top:20px;margin-bottom:20px;font-family:calluna,sans-serif;font-size:40px;font-weight:700;line7height:1.2em}
.h4{letter-spacing:normal;text-transform:none;margin-top:20px;margin-bottom:20px;font-family:calluna,sans-serif;font-size:32px;font-weight:700;line-height:1.2em}
.h5{letter-spacing:normal;text-transform:none;margin-top:20px;margin-bottom:20px;font-family:calluna,sans-serif;font-size:28px;font-weight:700;line-height:1.2em}
.h6{letter-spacing:.1em;text-transform:uppercase;margin-top:20px;margin-bottom:20px;font-family:"Overpass Mono",sans-serif;font-size:20px;font-weight:700;line-height:1.2em}
.sh{letter-spacing:-.02em;text-transform:none;margin-top:20px;margin-bottom:20px;font-family:"Overpass Mono",sans-serif;font-size:62px;font-weight:700;line-height:1em;color:#232426;}
.super-card-name{z-index:1;margin-bottom:-36px;padding-left:10%;padding-right:5%;position:relative}
.super-card-title{z-index:2;margin-top:-80px;padding-left:260px}
.no-mrg{margin:0}
.bold-link{color:var(--swatches--elderberry);font-weight:700;text-decoration:none}
.bold-link:hover{text-decoration:underline}
.btn{border:1px solid var(--swatches--lighter-gray);background-color:var(--swatches--white);box-shadow:0 5px 5px 0 var(--swatches--fades--elderberry-5);color:var(--swatches--dark-gray);text-align:center;border-radius:30px;padding:15px 30px;font-weight:700;text-decoration:none;transition:all .2s;position:relative;transform:scale(1)}
.btn:hover{border-top-color:var(--swatches--light-gray);border-right-color:var(--swatches--light-gray);border-bottom-color:var(--swatches--light-gray);border-left-color:var(--swatches--light-gray);box-shadow:0 5px 5px 0 var(--swatches--fades--elderberry-10);color:var(--swatches--elderberry);transform:scale(1.1);text-decoration:none!important}
.btn.wf{grid-column-gap:4px;grid-row-gap:4px;border-radius:2px;justify-content:center;align-self:flex-start;align-items:center;padding:10px 20px;font-size:14px;font-weight:500;line-height:1.5em;display:flex}
.btn.wf:hover{color:var(--webflow-blue)}
.outro-wrap{grid-column-gap:40px;grid-row-gap:40px;grid-template-rows:1fr auto;grid-template-columns:1fr;grid-auto-columns:1fr;width:100%;min-height:100svh;display:grid}
.footer-wrap{background:url(./img/intBgFooter.svg);background-size:72px;grid-column-gap:40px;grid-row-gap:40px;grid-template-rows:auto;grid-template-columns:1fr 1fr 1fr;grid-auto-columns:1fr;padding:20px;display:grid}
.footer-link{opacity:.5;color:var(--swatches--elderberry);letter-spacing:.1em;text-transform:uppercase;font-family:"Overpass Mono",sans-serif;font-size:16px;font-weight:700;line-height:1.5em;text-decoration:none;transition:all .2s}
.footer-link:hover{opacity:1}
.footer-chunks{grid-column-gap:20px;grid-row-gap:20px;flex-direction:column;display:flex}
.footer-chunks:first-child{order:1}
.footer-chunks:nth-child(2){order:3}
.footer-chunks:last-child{order:2}
.color-track,.mono-track{position:relative}
.label-wrap{color:var(--swatches--dark-gray);font-size:14px;line-height:1.5em}
.fit-fill{object-fit:fill}
.dark-bg{background-color:var(--swatches--elderberry);color:var(--swatches--white)}
.card{background-color:var(--swatches--fades--black-50);flex-direction:column;width:100%;max-width:400px;height:540px;text-decoration:none;display:flex;position:relative}
.cards-list{grid-column-gap:80px;grid-row-gap:80px;grid-template-rows:auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;margin-top:-80px;padding-left:40px;padding-right:40px;display:grid}
.card-wrap{flex-direction:column;justify-content:flex-start;align-items:flex-start;display:flex;position:relative}
.card-wrap:nth-child(odd){align-items:flex-end;margin-top:-80px}
.card-cover{width:100%;height:400px;position:relative}
.card-text{grid-column-gap:10px;grid-row-gap:10px;flex-direction:column;padding:40px;display:flex;position:absolute;bottom:0;left:0;right:0}
.card-name{letter-spacing:normal;text-transform:none;font-family:"Overpass Mono",sans-serif;font-size:48px;font-weight:700;line-height:1.2em}
.card-title{font-size:20px;line-height:1.5em}
.align-center{text-align:center}
.frame-bg{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden}
.text-wrap{width:100%;max-width:720px;margin-left:auto;margin-right:auto;position:relative}
.btn-wrap{grid-column-gap:20px;grid-row-gap:20px;justify-content:flex-start;align-items:flex-start;width:100%;max-width:720px;margin-left:auto;margin-right:auto;display:flex;position:relative}
.video-wrap{flex-direction:column;margin-left:auto;margin-right:auto;display:flex;position:relative;overflow:hidden}
._wf-icon{width:26px;height:16px}
.super-card-frame{flex-flow:column;justify-content:center;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}
@media screen and (min-width:1280px){
	body{font-size:20px;line-height:1.5em}
	h1{font-size:96px;line-height:1.2em}
	h2{font-size:54px;line-height:1.2em}
	h3{font-size:48px;line-height:1.2em}
	h4{font-size:36px;line-height:1.2em}
	h5{font-size:30px;line-height:1.2em}
	h6{font-size:24px;line-height:1.2em}
	p{margin-top:20px;margin-bottom:20px}
	.p{margin-top:20px;margin-bottom:20px;font-size:20px;line-height:1.5em}
	.narrow-wrap{max-width:720px}
	.super-cover{height:100%}
	.super-card{max-width:1120px;font-size:24px;line-height:1.5em}
	.h1{font-size:96px;line-height:1.2em}
	.h2{font-size:54px;line-height:1.2em}
	.h3{font-size:48px;line-height:1.2em}
	.h4{font-size:36px;line-height:1.2em}
	.h5{font-size:30px;line-height:1.2em}
	.h6{font-size:24px;line-height:1.2em}
	.sh{font-size:62px;line-height:1em}
	.sh em{font-size:72px}
	.super-card-name{margin-bottom:-248px}
	.super-card-title{padding-left:320px}
	.btn.wf{font-size:16px;line-height:1.5em}
	.outro-wrap{grid-column-gap:60px;grid-row-gap:60px}
	.footer-wrap{grid-column-gap:60px;grid-row-gap:60px;padding:0 80px}
	.label-wrap{font-size:16px;line-height:1.5em}
	.card{max-width:480px;height:660px}
	.cards-list{grid-column-gap:100px;grid-row-gap:100px;margin-top:-100px;padding-left:100px;padding-right:100px}
	.card-wrap:nth-child(odd){margin-top:-100px}
	.card-cover{height:480px}
	.card-name{font-size:54px;line-height:1.2em}
	.card-title{font-size:24px;line-height:1.5em}
}
@media screen and (min-width:1440px){
	.narrow-wrap{max-width:760px}
	.super-card{max-width:2202px;padding:0}
	.v-wrap{padding-top:60px;padding-bottom:60px}
	.h-wrap{padding-left:60px;padding-right:60px}
	.footer-contact{grid-column-gap:60px;grid-row-gap:60px}
	.card{height:660px}
	.cards-list{grid-column-gap:160px;grid-row-gap:160px;margin-top:-160px;padding-left:160px;padding-right:160px}
	.card-wrap:nth-child(odd){margin-top:-160px}
}
@media screen and (max-width:991px){
	h1{font-size:72px;line-height:1.2em}
	h2{font-size:40px;line-height:1.2em}
	h3{font-size:36px;line-height:1.2em}
	h4{font-size:30px;line-height:1.2em}
	h5{font-size:24px;line-height:1.2em}
	h6{font-size:18px;line-height:1.2em}
	.narrow-wrap{max-width:480px}
	.label{font-size:14px;line-height:1.5em}
	.super-card{max-width:1520px;padding:0;font-size:18px;line-height:1.5em}
	.v-wrap{padding-top:30px;padding-bottom:30px}
	.h-wrap{padding-left:30px;padding-right:30px}
	.h1{font-size:72px;line-height:1.2em}
	.h2{font-size:40px;line-height:1.2em}
	.h3{font-size:36px;line-height:1.2em}
	.h4{font-size:30px;line-height:1.2em}
	.h5{font-size:24px;line-height:1.2em}
	.h6{font-size:18px;line-height:1.2em}
	.sh{font-size:68px;line-height:1em}
	.sh em{font-size:80px:}
	.super-card-name{margin-bottom:-30px;padding-left:30px}
	.super-card-title{margin-top:60px;padding-left:160px}
	.outro-wrap{grid-column-gap:30px;grid-row-gap:30px}
	.footer-wrap{grid-column-gap:30px;grid-row-gap:30px;padding:0px 60px;}
	.footer-contact{grid-column-gap:20px;grid-row-gap:20px;flex-direction:column;align-items:stretch}
	.card{height:480px}
	.cards-list{grid-column-gap:30px;grid-row-gap:30px;margin-top:-60px;padding-left:30px;padding-right:30px}
	.card-wrap:nth-child(odd){margin-top:-60px}
	.card-cover{height:360px}
	.card-text{padding:30px}
	.card-name{font-size:40px;line-height:1.2em}
	.card-title{font-size:16px;line-height:1.5em}
	.btn-wrap{margin-top:30px;margin-bottom:30px}
}
@media screen and (max-width:767px){
	h1{font-size:60px;line-height:1.2em}
	h2{font-size:36px;line-height:1.2em}
	h3{font-size:32px;line-height:1.2em}
	h4{font-size:28px;line-height:1.2em}
	h5{font-size:22px;line-height:1.2em}
	h6{font-size:16px;line-height:1.2em}
	.scroll-path.bow-flight{min-height:150svh}
	.narrow-wrap{max-width:360px}
	.label{font-size:12px;line-height:1.5em}
	.super-card{max-width:960px;padding:0;font-size:16px;line-height:1.5em}
	.v-wrap{padding-top:20px;padding-bottom:20px}
	.h-wrap{padding-left:20px;padding-right:20px}
	.h1{font-size:60px;line-height:1.2em}
	.h2{font-size:36px;line-height:1.2em}
	.h3{font-size:32px;line-height:1.2em}
	.h4{font-size:28px;line-height:1.2em}
	.h5{font-size:22px;line-height:1.2em}
	.h6{font-size:16px;line-height:1.2em}
	.sh{font-size:52px;line-height:1em}
	.sh em{font-size:60px}
	.super-card-name{text-align:center;margin-bottom:-24px;padding-left:0}
	.super-card-title{text-align:center;margin-top:40px;padding-left:0}
	.btn.wf{align-self:center}
	.outro-wrap{grid-column-gap:20px;grid-row-gap:20px}
	.footer-wrap{grid-column-gap:20px;grid-row-gap:20px;grid-template-columns:1fr;padding:20px}
	.footer-link{padding:10px 20px}
	.footer-contact{grid-column-gap:0;grid-row-gap:0}
	.card{height:400px}
	.cards-list{grid-column-gap:10px;grid-row-gap:10px;padding-left:10px;padding-right:10px}
	.card-text{padding:20px}
	.card-name{font-size:28px;line-height:1.2em}
	.card-title{font-size:14px;line-height:1.5em}
	.video-wrap{border-radius:5px}
}
@media screen and (max-width:479px){
	h1{font-size:54px;line-height:1.2em}
	h2{font-size:32px;line-height:1.2em}
	h3{font-size:28px;line-height:1.2em}
	h4{font-size:24px;line-height:1.2em}
	h5{font-size:20px;line-height:1.2em}
	.super-card{padding:0}
	.h1{font-size:54px;line-height:1.2em}
	.h2{font-size:32px;line-height:1.2em}
	.h3{font-size:28px;line-height:1.2em}
	.h4{font-size:24px;line-height:1.2em}
	.h5{font-size:20px;line-height:1.2em}
	.sh{font-size:40px;line-height:1em}
	.sh em{font-size:48px}
	.super-card-name{margin-bottom:-18px}
	.cards-list{grid-template-columns:1fr}
	.card-wrap{align-items:center}
	.card-wrap:nth-child(odd){align-items:center;margin-top:0}
	.card-name{font-size:32px;line-height:1.2em}
	.btn-wrap{flex-direction:column;align-items:stretch}
}

								/* jammin' */

/* Fixed elements */
.nb-fixed-top-left {
	z-index: 1001;
	position: fixed;
	top: 10px;
	left: 10px;
	background-color: transparent;
	padding: 0;
	border: 0;
}

.nb-fixed-top-right {
	z-index: 1002;
	position: fixed;
	top: 10px;
	right: 10px;
	background-color: transparent;
	padding: 0;
	border: 0;
}

.nb-fixed-left {
	z-index: 1003;
	position: fixed;
	top: 50%;
	left: 0px;
	transform: translateX(-55%) rotate(-90deg);
	background-color: transparent;
	padding: 40px 24px 6px;
	border: 1px solid #ccc;
	color: #fff;
	mix-blend-mode: overlay; /* interim */
	transition:1.5s;
}

.nb-fixed-left .interim{
	font-family: "IBM Plex Mono", serif;
	font-weight: 700;
	font-size:32px;
}

.nb-fixed-left:hover{
	transform: translateX(-40%) rotate(-90deg);
}

.nb-fixed-right {
	z-index: 500;
	position: fixed;
	top: 50%;
	right: 12px; /* adapt if button */
	transform: translateX(44%) rotate(90deg); /* adapt if button */
	padding:0;
}

.nb-fixed-right .interim-menu-box {
	display: inline-block;
	vertical-align: middle;
	border-top: 2px solid #fff;
	padding: 8px 16px 4px;
	margin: 0 -3px;
	color: #fff;
	font-family: "IBM Plex Mono", serif;
	font-weight: 700;
	font-size:11px;
	background-color: transparent;
	transition:.5s;
}

.nb-fixed-right .interim-menu-box:hover{
	border-top: 2px solid #fff;
	padding: 12px 16px 0px;
	color: #000;
	background-color: rgba(255, 255, 255, 0.8);
}

.nb-fixed-right .interim-spacer {
	display: inline-block;
	vertical-align: middle;
	margin: 0;
	width: 48px;
	background-color: transparent;
}

.nb-main-fixed-bottom-center {
	z-index: 1005;
	position: fixed;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	background-color: rgba(255, 255, 255, 0.8);
	padding: 10px;
	border: 1px solid #ccc;
}

.nb-fixed-bottom-center {
	z-index: 1005;
	position: fixed;
	left: 50%;
	bottom: 10px;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
}

.nb-fixed-bottom-center div.nb-box {
	margin: 5px 0; 
	padding: 10px;
	background: white;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

/* Scrollable content, if required */
.nb-scrollable {
	background-color: #f9f9f9;
	overflow: auto;
}

/* vignette */
.nb-gradient-border {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	max-height:15%;
	background: linear-gradient(to top, rgba(67,73,84,1), rgba(255,255,255,0)); 
	opacity: 0.5;
	mix-blend-mode: multiply;
	z-index: 998;
	padding: 60px; 
	box-sizing: border-box;
}

.nb-centre {
	align-items:center;
}

.nb-card-text {
	z-index:99;
	padding-left:10%;
	padding-right:5%;
	position:absolute;
}

.nb-card-text h4 {
	z-index: 100;
}

.nb-card-text h4 em {
	font-family: "Arapey", serif;
	font-weight: 400;
	font-style: italic;
	letter-spacing: 2px;
}

.nb-card-text h4::before {
  	background-color: #eed202;
  	opacity: 0.7;
  	content: "";
  	margin: 0 auto;
  	position: absolute;
  	top: -2px;
  	left: 86px;
  	width: 75%;
  	height: 0.8em;
  	z-index: -1;
}

.nb-card-text p {
	padding:0.7%;
	line-height:1.1;
}

.nb-card-text .hilite {
	font-family: "IBM Plex Mono", serif;
	font-weight: 400;
	font-style: italic;
	font-size: 14px;
	background-color: #262930;
	color: #ffffff;
}

.nb-card-text .hilite em {
	  font-style: normal;
}

.nb-card-text .hilite strong {
	  font-weight: 500;
}

@keyframes finch {
	from { transform: scale(1.2,1.2) translateY(90%); }
	to { transform: none; }
}

#finch-house {
	animation-name: finch;
	animation-duration: 1s;
	transition: .5s;
	opacity: 0.8;
}

#finch-house:hover {
	transform: scale(1.15,1.15) rotate(266deg);
	opacity: 1;
}

#finch .intDog{
	fill:#fff;
}

.off-brian {
	background: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA5NiA0OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgOTYgNDg7IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iODBweCIgaGVpZ2h0PSI0MHB4Ij4KCSA8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MCB7ZmlsbDojRTZFN0U4O30KPC9zdHlsZT4KCQk8cG9seWdvbiBjbGFzcz0ic3QwIiBwb2ludHM9Ijc2LjkzLDQ4IDI4LjkzLDAgMTguNTgsMCA2Ni41OCw0OCAiLz4KCQk8cG9seWdvbiBjbGFzcz0ic3QwIiBwb2ludHM9Ijk2LDAuMDIgOTUuOTgsMCA4NS42MywwIDk2LDEwLjM3ICIvPgoJCTxwb2x5Z29uIGNsYXNzPSJzdDAiIHBvaW50cz0iOTYsMjIuMzcgNzMuNjIsMCA2My4yOCwwIDk2LDMyLjcyICIvPgoJCTxwb2x5Z29uIGNsYXNzPSJzdDAiIHBvaW50cz0iOTYsNDQuNzIgNTEuMjgsMCA0MC45MywwIDg4LjkzLDQ4IDk2LDQ4ICIvPgoJCTxwb2x5Z29uIGNsYXNzPSJzdDAiIHBvaW50cz0iNi41OCwwIDAsMCAwLDMuNzcgNDQuMjMsNDggNTQuNTgsNDggIi8+CgkJPHBvbHlnb24gY2xhc3M9InN0MCIgcG9pbnRzPSIwLDE1Ljc3IDAsMjYuMTIgMjEuODgsNDggMzIuMjMsNDggIi8+CgkJPHBvbHlnb24gY2xhc3M9InN0MCIgcG9pbnRzPSIwLDM4LjEyIDAsNDggOS44OCw0OCAiLz4KCTwvc3ZnPg==") 0 0 no-repeat;
	width: 80px;
	height: 40px;
}

/* trail lines */

.nb-trail-container, #tripdick {
display: flex;
justify-content: center;
align-items: center;
width: 100%; 
height: 100%; 
margin: 0;
}

.dales-trailz {
position: absolute;
border: none;
border-right: 2px dotted #E6E7E8;
width: 0px; 
left: 50%; 
transform: translateX(-50%);
opacity:0.8;
}

.fromTop {
height: 100%; 
top: 0;
}

.fromBottom {
height: 100%; 
bottom: 0;
}

#hero-trail {
opacity: 0.6;
animation-name: fromTop;
animation-duration: 2s;
}

.hero-bbb {
	animation-name: bbb;
	animation-duration: 4s;
}

@keyframes fromTop {
	from { transform: translateY(-60%) translateX(-1px); opacity: 0.2; }
	to { transform: translateX(-1px); }
}

@keyframes bbb {
	from { transform: translateY(-100%); opacity: 0.1; }
	to { transform: none }
}

#end-trail {z-index: 101; height: 35%;}

#end-trail::after {
content: ""; /* Required for pseudo-elements */
  position: absolute; /* Position relative to the parent */
  right: -9px; /* Adjust for vertical centering */
  bottom: -12px; /* Position at the end */
  height: 8px;
  width: 8px;
  background-color: transparent;
  border: 4px solid #E6E7E8;
  border-radius: 50%;
}

#coda-top, #coda-bottom {
	z-index: 101; height: 28%;
}

#last-bottom {
	z-index: 101; height: 60%;
}

#coda-top::after {
content: ""; /* Required for pseudo-elements */
  position: absolute; /* Position relative to the parent */
  right: -5px; /* Adjust for vertical centering */
  bottom: -4px; /* Position at the end */
  height: 8px;
  width: 8px;
  background-color: #E6E7E8;
  border-radius: 50%;
}

#coda-bottom::before, #last-bottom::before {
content: ""; /* Required for pseudo-elements */
  position: absolute; /* Position relative to the parent */
  right: -5px; /* Adjust for vertical centering */
  top: -4px; /* Position at the end */
  height: 8px;
  width: 8px;
  background-color: #E6E7E8;
  border-radius: 50%;
}

.kids-quesadilla {
	min-width: 400px;
	position: relative; 
	right: 208px; 
	top: 20%; /* this one can change */
	color:#ffffff; 
	font-family: "Overpass Mono", monospace;
	font-weight: 400;
	font-size: 10px;
	line-height: 10px;
	transform:rotate(-90deg);
}

.baked-bean-bar {
	min-width: 72px;
	position: relative; 
	right: 36px; 
	bottom: -50%; /* this one can change */
}

.scout-badge {
	font-family:serif; 
	font-size: 20px; 
	line-height: 10px; 
	margin-right: 20px;
}

.scroll-dorito {
	bottom: 164px;
	left: 50%;
	margin-left: -14px;
	position: absolute;
	width: 28px;
	height: 14px;
}

.golden-dorito {
	background: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMjggMTQiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI4IDE0OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0UxNzU2NDt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yOCwwTDE0LDguOEwwLDB2NC4xYzAsMC43LDAuNCwxLjMsMC45LDEuN0wxNCwxNGwxMy4xLTguMmMwLjYtMC40LDAuOS0xLDAuOS0xLjdWMHoiLz4KPC9zdmc+Cg==") 0 0 no-repeat;
	width: 28px;
	height: 14px;
	position: absolute;
	opacity: 1;
	-webkit-animation: 'scroll-tip' 0.6s infinite;
	animation: 'scroll-tip' 0.6s infinite;
	animation-delay: 0s;
	animation-direction: normal;
	-webkit-animation-direction: alternate;
	animation-direction: alternate;
}

.golden-dorito:first-child {
	top: -0.6em;
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

.golden-dorito:nth-child(2) {
	animation-delay: 0.4s;
}

.golden-dorito:last-child {
	bottom: -0.6em;
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}

@-webkit-keyframes scroll-tip {
  to {
    opacity: 0;
  }
}
@keyframes scroll-tip {
  to {
    opacity: 0;
  }
}

/* hero shit */

.nb-lead {
	padding-top: 42px;
	font-family: "Overpass Mono", monospace;
	font-weight: 700;
	font-size: 92px;
	line-height: 112px;
	color: #E6E7E8;
	display : inline-block;
}

.nb-lead em {
	font-family: "Arapey", serif;
	font-weight: 400;
	font-style: italic;
	font-size: 108px;
	letter-spacing: 2px;
}

.thats-bars {
	padding: 0;
	margin: 0;
	height:68px;
	background-color: #E6E7E8;
	display : inline-block;
}

.nb-lead #bar1, #bar2, #bar3 {
	width: 0;
	transition: 0.5s;
	background-size: cover;
	background-repeat: no-repeat;
	filter: grayscale(80%);
}

.nb-lead #such-as {
	font-family: "Arapey", serif;
	font-weight: 400;
	font-style: italic;
	font-size: 108px;
	letter-spacing: 2px;
	text-align: right;
	display: none;
	transition: 0.6s;
}

.nb-lead #bar1 {
	background-image: url('./img/intBar1.png');
}
.nb-lead #bar2 {
	background-image: url('./img/intBar2.jpg');
}

.nb-lead #bar3 {
	background-image: url('./img/intBar3.png');
}

.nb-lead:hover #bar1 {
	width: 702px;
	margin-right: 66px;
}

.nb-lead:hover #bar2 {
	width: 190px;
	margin-right: 66px;
}

.nb-lead:hover #bar3 {
	width: 514px;
}

.nb-lead:hover #such-as {
	display:inline;
}

#coda-box {
	z-index:99;
	position:absolute; 
	transform: translate(0, 10%);
}

.trip-dick .st0 {
	fill:#fff;
}

#outro {
	background: url('./img/intBgOutro.svg') no-repeat center top, #584098; 
	background-size: auto 80%; 
	color:#d5fdff;
}

#outro-overlap {
	position: absolute;
	width: 100%; /* Full height for bottom line */
	height: 36px;
	bottom: 0;
	background: url('./img/intBgOverlap.svg');
	background-size: 72px;
	background-blend-mode: screen;
}

/* test 1-2-3 */

.holler-btn {
  position: relative;
  margin: 10px;
  color: #fff;
  background: none;
  border: none;
  overflow: hidden;
  transition: all 0.4s ease;
  z-index: 102;
}

.holler-btn:hover {
	transform: scale(1.2);
}

.holler-neon-pulse {
  background:none;
  border: 0;
  border-radius: 50%;
  height: 72px;
  width: 72px;
  overflow: visible;
}

.holler-neon-pulse:hover {
  background:none;
  border: 2px solid #d5fdff;
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(213, 253, 255, 0.3);
  overflow: visible;
}

.holler-neon-pulse:hover::before,
.holler-neon-pulse:hover::after {
  content: "";
  position: absolute;
  inset: -4px;
  border: 2px solid #d5fdff;
  border-radius: inherit;
  animation: pulseOut 2s ease-out infinite;
  opacity: 0;
}

.holler-neon-pulse:hover::after {
  animation-delay: 1s;
}

@keyframes pulseOut {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

img.handwave {
	animation: handwave 1s infinite;
}

img.handwave:hover {
	animation-play-state: paused;
}

@keyframes handwave {
	0% { rotate: 0deg;}
	50% { rotate: 12deg;}
	100% { rotate: 0deg; }
}

#show-em {
	background: url('./img/intShowEm.svg') no-repeat;
	background-position: center top;
	background-size: auto 100%;
	min-height: 112px;
	transform: translateY(-75%)
}

.chunk-text {
	transform: translateY(-100%)
}

#the-end {
	font-family: "Arapey", serif;
	font-weight: 400;
	font-style: italic;
	font-size: 54px;
	color: #e0ffe3;
	letter-spacing: 3px;
	opacity: 0.3;
}

#holler-caption {
	font-family: "Overpass Mono", monospace;
	font-weight: 400;
	font-size: 18px;
	color: #d5fdff;
	text-decoration: none;
}

.wee-tag {
	background: rgba(255, 255, 255, 0.7);
	max-width: 40%;
	padding: 2px;
	border-radius: 3px;
	border: 1px solid #82929e;
	color: #505960;
	font-family: "IBM Plex Mono", monospace;
	font-style: italic;
	font-weight: 500;
	font-size:10px;
	line-height: 12px;
	position: absolute;
	bottom: 18%;
	z-index: 190;
}

.slide-tag {
	background: #e6e7e8;
	max-width: 30%;
	padding: 2px 2px 1px;
	border-radius: 4px;
	border: 1px solid #82929e;
	color: #82929e;
	font-family: "Overpass Mono", monospace;
	font-weight: 500;
	font-size:7px;
	line-height: 8px;
	opacity: 0.7;
	position: absolute;
	top: 10px;
	left: 50%; /* Center the line horizontally */
	transform: translateX(-50%);
	z-index: 200;
}

/*responsive poging*/

@media screen and (max-width:1279px){
	.nb-lead { font-size: 78px; line-height: 100px; }
	.nb-lead em { font-size: 92px; letter-spacing: 2px; }
	.intBars { height:58px; }
	.nb-lead #such-as { font-size: 92px; letter-spacing: 2px; text-align: right; display: none; transition: 0.6s; }
	.nb-lead:hover #bar1 { width: 596px; margin-right: 32px; }
	.nb-lead:hover #bar2 { width: 162px; margin-right: 38px; }
	.nb-lead:hover #bar3 { width: 420px; }
	.nb-lead:hover #such-as { display:inline; }
	.footer-wrap { padding: 0 60px; }
}

@media screen and (max-width:991px){
	.nb-lead { font-size: 70px; line-height: 84px; }
	.nb-lead em { font-size: 81px; letter-spacing: 2px; }
	.intBars { height:50px; }
	.nb-lead #such-as { font-size: 81px; letter-spacing: 2px; text-align: right; display: none; transition: 0.6s; }
	.nb-lead:hover #bar1 { width: 524px; margin-right: 28px; }
	.nb-lead:hover #bar2 { width: 142px; margin-right: 35px; }
	.nb-lead:hover #bar3 { width: 384px; }
	.nb-lead:hover #such-as { display:inline; }
	#outro { background-size: auto 70%; }
}

@media screen and (max-width:767px){
	.nb-fixed-right { right: 6px; }
	.footer-chunks { text-align:center; }
	.footer-chunks:first-child{order:1}
	.footer-chunks:nth-child(2){order:2}
	.footer-chunks:last-child{order:3}
	#show-em { transform:translateY(-20%); margin-bottom:40px; }
	.trip-dick { transform:scale(1); }
	#outro { background-size: auto 50%; }
}

@media screen and (min-width:1280px){
	.trip-dick { transform:scale(1.5); }
}

@media screen and (min-width:768px){
	.footer-chunks:nth-child(2){ text-align:right; }
}

/* THIS CAN'T STAY LIKE THIS MUCH LONGER! */
.nb-fixed-right {
	visibility: hidden;
}

/* logofolio */
.gallery {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 50vh; /* Adjust height as needed */
	gap: 0; /* No gap between images */
	width: 100%; /* Full viewport width */
	height: 100%; /* Full viewport height */
	overflow: hidden; /* Prevent overflow */
}
.gallery .nest {
	position: relative;
	width: 100%;
	height: 100%;
}

.gallery img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.gallery img.still {
	  filter: grayscale(90%);
	  transition: 0.3s;
}

.gallery img.still:hover {
	filter: grayscale(0%);
}

.gallery img.static {
	z-index:12;
	position: absolute;
	background: whitesmoke; /* this is for testing purposes only, adapt as needed */
	transition: 0.3s;
}
.gallery img.static:hover{
	opacity:0;
}

.gallery img.active{
	z-index: 11;
	position:relative;
}

@media screen and (max-width:1079px) {
	.gallery {
		grid-template-columns: repeat(1, 1fr);
		grid-auto-rows: 50vh; 
	}
}

@media screen and (max-height:479px) {
	.gallery {
		grid-auto-rows: 100vh; 
	}	
}

@media screen and (max-width:1080px) {
	.gallery img.still {
		filter: grayscale(10%);
		transition: 0.1s;
	}
	.gallery img.static {
	display: none;
	}
}

/* interim menu button trick style */
.nb-fixed-right button {
border: none;
background: none;
}

/* interim tab classes, rename */
.fromRight {
	animation: fanny 0.7s;
}

@keyframes fanny {
	0% {
		right: -50%;
		opacity: 0.5;
	}
	100% {
		right: 0;
		opacity: 1;
	}
}

#London, #Paris {
	overflow: hidden;
	height: 100vh;
	width: 100%;
	position: fixed;
	bottom:0;
	z-index: 501;
}

#London {
	color: darkseagreen;
	background-color: salmon;
}

#Paris {
	color: #736c82;
	background-color: #383344;
}

.litter-gang {
	justify-content: center;
	align-items: center;
	padding: 10% 30%;
	font-family: "Overpass Mono", monospace;
}

.big-peenz {
	position: relative;
	top: 10%;
	left: 10%;
	font-size: 66px;
	font-weight: 300;
	transition: all 0.2s;
}

.big-peenz:hover {
	color: #9cfbff;
}

input, textarea {
  border: none;
  border-bottom: 2px solid red;
  outline: none;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  background: transparent;
  font-family: "Overpass Mono", monospace;
}

textarea {
	resize: none;
}

.litter-gang .text{
  text-align: center;
  font-size: 41px;
  font-weight: 600;
  font-family: "Overpass Mono", monospace;
  background: -webkit-linear-gradient(right, #56d8e4, #9f01ea, #56d8e4, #9f01ea);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.litter-gang form{
  padding: 30px 0 0 0;
}
.litter-gang form .form-row{
  display: flex;
  margin: 32px 0;
}
form .form-row .input-data{
  width: 100%;
  height: 40px;
  margin: 0;
  position: relative;
}
form .form-row .textarea{
  height: 70px;
}
.input-data input,
.textarea textarea{
  display: block;
  width: 100%;
  height: 100%;
  border: none;
  font-size: 17px;
  border-bottom: 2px solid #554e65;
  color: #fff;
}
.input-data input:focus ~ label, .textarea textarea:focus ~ label,
.input-data input:valid ~ label, .textarea textarea:valid ~ label{
  transform: translateY(-20px);
  font-size: 14px;
  color: #95fbff;
}
.textarea textarea{
  resize: none;
  padding-top: 10px;
}
.input-data label{
  position: absolute;
  pointer-events: none;
  bottom: 10px;
  font-size: 16px;
  transition: all 0.3s ease;
}
.textarea label{
  width: 100%;
  bottom: 40px;
  background: transparent;
}
.input-data .underline{
  position: absolute;
  bottom: 0;
  height: 2px;
  width: 100%;
}
.input-data .underline:before{
  position: absolute;
  content: "";
  height: 2px;
  width: 100%;
  background: #9cfbff;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.3s ease;
}
.input-data input:focus ~ .underline:before,
.input-data input:valid ~ .underline:before,
.textarea textarea:focus ~ .underline:before,
.textarea textarea:valid ~ .underline:before{
  transform: scale(1);
}
.submit-btn .input-data{
  overflow: hidden;
  height: 45px!important;
  width: 30%!important;
}
.submit-btn .input-data .inner{
  height: 100%;
  width: 300%;
  position: absolute;
  left: -100%;
  background: -webkit-linear-gradient(right, #554e65, #6cf7fd);
  transition: all 0.4s;
}
.submit-btn .input-data:hover .inner{
  left: 0;
}
.submit-btn .input-data input{
  background: none;
  border: none;
  color: #fff;
  font-size: 17px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 1px;
  cursor: pointer;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767px) {
	.litter-gang {
		padding:12% 10%;
	}
	.litter-gang .text{
	    font-size: 30px;
	}
	.litter-gang form{
	    padding: 10px 0 0 0;
	}
	.litter-gang form .form-row{
	    display: block;
	}
	form .form-row .input-data{
	    margin: 35px 0!important;
	}
	.submit-btn .input-data{
	    width: 50%!important;
	}
}