@font-face{
	font-display:optional;
	font-family:system;
	font-style:normal;
	font-weight:100;
	src:local('.SFNSText-Light'),
		local('.HelveticaNeueDeskInterface-Light'),
		local('.LucidaGrandeUI'),
		local('Ubuntu Light'),
		local('Segoe UI Light'),
		local('Roboto-Light'),
		local('DroidSans'),
		local('Tahoma')
}
@font-face {
	font-display:optional;
	font-family:'hand-written';
	font-style:normal;
	font-weight:normal;
	src:url('hand.woff2') format('woff2'),
		url('hand.woff') format('woff')
}


/* Reset----------------------------------------- */
*,
*:after,
*:before{
	box-sizing:border-box;
	list-style-type:none;
	margin:0;
	outline:none;
	padding:0;
	position:relative;
	-webkit-touch-callout:none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-tap-highlight-color:transparent
}
:focus:not(:focus-visible) {
	outline:0
}
:focus-visible{
	outline:3px solid dodgerblue
}


/* Base------------------------------------------ */
html{
	background:#000;
	color:#fff;
	font-size:100%;
	font-feature-settings:'kern' 1;
	font-kerning:normal;
	line-height:1em;
	min-height:100vh;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	scroll-behavior:smooth;
	text-rendering:optimizeLegibility;
	width:100%
}
body{
	font-family:-apple-system,system,sans-serif;
	font-size:1.8rem;
	max-height:100vh;
	min-height:100vh;
	max-height:-webkit-fill-available;
	min-height:-webkit-fill-available;
	line-height:1.8em;
	overflow:scroll;
	overflow-x:hidden;
	text-rendering:optimizeLegibility
}


a{
	color:#fff
}
a:hover{
	text-decoration:underline
}


a,
button,
input,
select,
textarea{
	-ms-touch-action:manipulation;
	touch-action:manipulation
}


abbr{
	cursor:help
}


.u-fontSerif,
.os--ios .u-fontSerif{
	font-family:Georgia,serif
}
h1,
h2,
h3,
h4,
h5,
h6,
.u-fontSansSerif{
	word-break:normal;
	font-family:-apple-system,BlinkMacSystemFont,system,sans-serif;
	font-weight:100;
	line-height:1.4em;
	text-rendering:optimizeLegibility
}


img,
img.loaded{
	opacity:1;
	transition:opacity .3s;
	will-change:opacity
}
img.loading{
	opacity:0
}


hr{
	border:0;
	height:0;
	margin:0;
	overflow:visible
}
hr::after{
	background-image:linear-gradient(to right,rgba(255,255,255,0),rgba(255,255,255,.05) 10%,rgba(255,255,255,.8) 50%,rgba(255,255,255,.05) 90%,rgba(255,255,255,0));
	background-size:100% 3px;
	content:'';
	display:block;
	height:1px;
	width:100%;
	z-index:3
}
@media (min-width:1024px) {
	hr.crosshair::before{
		background-image:linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, .05) 10%, rgba(255, 255, 255, .8) 50%, rgba(255, 255, 255, .05) 90%, rgba(255, 255, 255, 0));
		background-size:100% 3px;
		content:'';
		display:block;
		height:1px;
		left:calc(25% - .01em);
		position:absolute;
		transform:rotate(90deg);
		width:50%;
		z-index:3
	}
}
hr.dark::after{
	background-image:linear-gradient(to right,rgba(0,0,0,0), rgba(0,0,0,.03) 10%,rgba(0,0,0, .4) 50%,rgba(0,0,0,.03) 90%,rgba(0,0,0,0));
}


li{
	line-height:1.2em;
	list-style-type:circle;
	margin-left:1.2em
}


.inline_video{
	height:100%;
	width:auto;
	object-fit:cover
}
.header_video{
	height:110%;
	left:0;
	pointer-events:none;
	position:absolute;
	top:0;
	width:100%;
	z-index:-1
}


.yard_slug{
	background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,1));
	bottom:0;
	display:none;
	font-weight:400;
	left:0;
	padding:60px 20px 20px;
	position:absolute;
	text-shadow:1px 1px 0 rgba(0,0,0,1);
	width:100%;
	z-index:2
}


.block{
	background:no-repeat center center;
	background-size:cover;
	height:96vh;
	overflow-x:hidden;
	width:100%
}
@media (min-width:1024px){
	.block{
		display:inline-block;
		width:50%; /* TODO: flex or grid */
		vertical-align:top
	}
}


.sub_block{
	background:no-repeat center center;
	background-size:cover;
	display:inline-block;
	height:50%;
	width:50%; /* TODO: flex or grid */
	vertical-align:top
}


.column{
	display:inline-block;
	padding:0 40px 60px;
	vertical-align:top
}
@media (max-width:1024px){
	.column{
		width:100%
	}
}
@media (min-width:1024px){
	.column{
		padding:0 80px 80px
	}
}


.main_header{
	background:#000;
	padding:18vh 10vw 0;
	overflow:visible;
	z-index:4
}


.main_header > h1{
	font-size:1.4rem;
	font-weight:900;
	text-transform:uppercase;
	z-index:2
}
.main_header > h1::before{
	background:transparent url(logo_64.png) no-repeat;
	background-size:cover;
	border:1px rgba(255,255,255,.2) solid;
	border-top:1px rgba(255,255,255,.7) solid;
	border-radius:4px;
	content:'';
	display:inline-block;
	height:30px;
	left:-40px;
	position:absolute;
	width:30px;
	top:2px
}

.main_header > h2{
	font-size:4.2rem;
	font-weight:100;
	line-height:1em;
	padding-bottom:.26em;
	z-index:2
}
@media (min-width:1024px){
	.main_header > h2{
		font-size:6rem
	}
}


.main_header > p{
	font-size:1rem;
	line-height:1.6em;
	padding-right:13vw;
	z-index:2
}


.main_header > .inline_video{
	height:100%;
	left:0;
	position:absolute;
	width:100vw;
	top:0
}


.main_header_page{
	left:0;
	overflow:hidden;
	padding:20px;
	position:fixed;
	top:0;
	width:100%
}
.main_header_page > h2{
	font-size:1.4rem;
	font-weight:900;
	text-transform:uppercase;
	z-index:2
}


.main_nav{
	overflow:hidden;
	z-index:2
}
.homepage .main_nav{
	z-index:4
}
@media (max-width:1024px){
	.main_nav{
		display:none
	}
}


.main_nav img,
.main_nav picture{
	height:100%;
	object-fit:cover;
	width:100%
}
.main_nav .showcase--junkyard img,
.main_nav .showcase--junkyard picture{
	border-radius:12px 0 0 0
}


.main_nav video{
	/* filter:contrast(3) */
}


.main_nav_page{
	background:rgba(0,0,0,.9);
	border-radius:20px 0 0 20px;
	font-size:1rem;
	padding:10px 20px 20px 60px;
	position:fixed;
	right:0;
	top:20px;
	z-index:18
}
.ua--safari .main_nav_page{}
.is-wireframe_mode .main_nav_page{
	border-radius:255px 15px 225px 45px/15px 225px 15px 255px;
	outline:2px #fff solid;
	padding:8px 20px 20px 60px;
}
.is-wireframe_mode .main_nav_page{
	box-shadow:0 0 1px 2px #fff;
	outline:0
}
.homepage .main_nav_page{
	z-index:3
}
@media(max-width:1024px){
	.main_nav_page.main_nav_page{
		padding:4px 20px 20px 0;
		right:0;
		width:100vw;
		text-align:right;
		top:0;
	}
}

.main_nav_page h2 a{
	color:rgba(255,255,255,1);
	font-size:1.2rem;
	font-weight:900;
	text-transform:uppercase
}
.main_nav_page h2 a::after{
	background:transparent url(logo_64.png) no-repeat;
	background-size:cover;
	border:1px rgba(255,255,255,.2) solid;
	border-top:1px rgba(255,255,255,.5) solid;
	border-radius:4px;
	content:'';
	display:inline-block;
	height:30px;
	left:-40px;
	position:absolute;
	width:30px;
	top:-2px
}
.main_nav_page ul{
	line-height:1.2em
}
.main_nav_page li{
	display:inline-block;
	margin:0 12px 0 0
}
.main_nav_page a{
	color:rgba(255,255,255,.7);
	font-size:1rem;
	overflow:visible;
	text-decoration:none
}
@media (max-width:1024px){
	.main_nav_page li{
		margin:0 0 0 12px
	}
	.main_nav_page a{
		color:rgba(255, 255, 255, .7);
		font-size:.7rem
	}
}
.main_nav_page a::before{
	background:#fff;
	border-radius:20px;
	content:'';
	display:inline-block;
	height:2px;
	opacity:0;
	pointer-events:none;
	position:absolute;
	top:140%;
	transition:.25s;
	width:100%
}
.main_nav_page a:focus,
.main_nav_page a:hover{
	color:rgba(255,255,255,1)
}
.main_nav_page a.is-active{
	color:#fff;
	cursor:default;
	text-shadow:0 0 4px #fff
}
.main_nav_page a.is-active::before{
	background:rgba(255,255,255,.7)
}
.main_nav_page a.is-active::before,
.main_nav_page a:focus::before,
.main_nav_page a:hover::before{
	opacity:1;
	top:110%
}

.main_content{
	grid-template-columns: 1fr 1fr
}
.main_content a{
	color:#000
}


.waves--bottom,
.waves--bottom--last,
.waves--top{
	display:none
}
@media (min-width:1024px){
	.waves--bottom,
	.waves--bottom--last,
	.waves--top{
		display:block;
		left:0;
		position:absolute;
		width:100vw;
		pointer-events:none
	}
	.waves--bottom{
		top:99.9%
	}
	.waves--top{
		transform:scaleX(-1)
	}
	.waves--bottom--last{
		bottom:-270px
	}
}


.current_thing{
	background:rgb(34,87,201);
	color:#fff;
	min-height:40vh;
	overflow:hidden;
	padding:8vh 10vw;
	width:100%;
	z-index:4
}
@media (min-width:1024px){
	.current_thing{
		overflow:visible;
		padding:10vh 20vw 0 20vw
	}
}
.current_thing_recently.current_thing_recently{
	padding-bottom:30vh
}


.current_thing > h2{
	font-size:1.4rem;
	font-weight:900;
	text-transform:uppercase
}


.current_thing > h3{
	font-size:5rem;
	font-weight:100;
	line-height:.9em;
	margin:10px 0 20px
}
@media (min-width:1024px){
	.current_thing > h3{
		font-size:9rem
	}
}


.current_thing > h4,
.current_thing > p{
	font-size:1.2rem;
	font-weight:300;
	line-height:1.6em;
	padding-left:6vw;
	padding-right:4vw
}
.current_thing > p{
	padding-top:1em
}
@media (min-width:1024px){
	.current_thing > h4,
	.current_thing > p{
		padding-right:20vw
	}
}


.that_recent_thing{
	/* background:rgb(94, 202, 117); */
	background:#198754;
	color:#fff;
	x--content-visibility:auto;
	min-height:40vh;
	padding:8vh 10vw;
	width:100%;
	z-index:5
}
@media (min-width:1024px){
	.that_recent_thing{
		padding:0 20vw 2vh
	}
	.page .that_recent_thing{
		padding-bottom:25vh
	}
	.that_recent_thing .waves--top{
		top:-172px
	}
}
.that_recent_thing_block + that_recent_thing_block{
	padding-bottom:30vh
}
.that_recent_thing_block:last-child{
	padding-bottom:10vw
}


.that_recent_thing > h2{
	font-size:1.4rem;
	font-weight:900;
	text-transform:uppercase
}


.that_recent_thing > h3{
	font-size:5rem;
	font-weight:100;
	line-height:1.25em
}
@media (min-width:1024px){
	.that_recent_thing > h3{
		font-size:9rem
	}
}


.that_recent_thing > h4,
.that_recent_thing > p{
	font-size:1.2rem;
	font-weight:300;
	line-height:1.6em;
	padding-left:6vw;
	padding-right:4vw
}
.that_recent_thing > p{
	padding-top:1em
}
@media (min-width:1024px){
	.that_recent_thing > h4,
	.that_recent_thing > p{
		padding-right:20vw
	}
}


.teaser{
	x--content-visibility:auto;
	padding:10vh 10vw 0;
	z-index:2
}
@media (max-width:1024px){
	.teaser{
		padding-top:25vh
	}
	.showcase + .teaser{
		background:rgba(0,0,0,.8);
		position:absolute;
		transform:translateY(-100%)
	}
	.teaser + .showcase{
		opacity:.35;
		position:absolute;
		transform:translateY(-100%)
	}
}
@media (min-width:1024px){
	.teaser {
		padding:20vh 10vw 0
	}
}


.teaser > h3{
	font-size:1.4rem;
	font-weight:900;
	text-transform:uppercase;
	z-index:3
}


.teaser > h4{
	font-size:3rem;
	font-weight:100;
	line-height:1em;
	z-index:3
}
@media (min-width:1024px){
	.teaser > h4{
		font-size:4rem
	}
}


.teaser > p{
	font-size:.85rem;
	font-weight:600;
	line-height:1.6em;
	opacity:.7;
	padding:1.8em 14vw 0 0;
	z-index:3
}


.teaser_link .teaser_link_anchor{
	background-color:rgb(28,184,65);
	background-color:#5ECA75;
	background-color:#198754;
	border-radius:1em;
	color:#fff;
	display:inline-block;
	font-size:1rem;
	font-weight:600;
	line-height:1.2em;
	padding:.5em 1em;
	text-decoration:none
}


.teaser > .inline_video{
	height:100%;
	filter:contrast(3);
	left:0;
	position:absolute;
	width:100%;
	top:0
}


.showcase{
	x--content-visibility:auto
}


.teaser--frontyard{}
@media (min-width:1024px){
	.teaser--frontyard{
		padding-top:24vh
	}
	.showcase--frontyard{
		border-radius:1em;
		transform:scale(.422) translateX(50vw) translateY(-9vh)
	}
}
@media (max-width:1024px){
	.teaser--frontyard.teaser--frontyard{
		background:rgba(0,0,0,.9);
		padding-top:15vh
	}
}


.showcase--frontyard{
	background-image:url(frontyard3.jpg)
}


.teaser--backyard{}
@media (min-width:1024px){
	.teaser--backyard{
		padding-top:35vh
	}
}


.showcase--backyard{
	pointer-events:none
}


.teaser--junkyard{}


.showcase--junkyard{
	background-image:url(junkyard.jpg);
	border-radius:12px 0 0;
	overflow:hidden
}


.teaser--graveyard{}


.teaser--graveyard .inline_video{
	filter:none
}


.showcase--graveyard{
	background-image:url(graveyard.jpg)
}


.member_berries{
	background:#fff;
	color:#222;
	padding:10vh 10vw;
	z-index:3
}
.recent_member_berries{
	padding-top:20vh;
	z-index:9
}
.member_berries:focus-within{
	z-index:12
}
.page .recent_member_berries{
	padding-top:40px
}


.member_berries > h3{
	font-size:1.4rem;
	font-weight:900;
	text-transform:uppercase
}


.member_berries > h4{
	display:inline-block;
	font-size:4rem;
	font-weight:100;
	line-height:1em;
	width:50vw;
	vertical-align:middle
}


.button.member_berries_trigger_contact_form{
	border:2px #222 solid;
	border-radius:1.6em;
	color:#222;
	display:inline-block;
	font-size:2rem;
	margin:60px 0 0 0;
	padding:0.1em 0.8em;
	text-decoration:none;
	text-transform:uppercase;
	vertical-align:middle
}
@media (min-width:1024px){
	.member_berries_trigger_contact_form{
		margin:-48px 0 0 20px
	}
}


.member_berries strong{
	font-weight:400
}


.contact_form{
	align-items:center;
	animation-name:xanimation_contact_view;
	animation-duration:30s;
	animation-fill-mode:forwards;
	animation-iteration-count:infinite;
	background:rgba(255,255,255,.9);
	background-image:radial-gradient(circle at 66% 40%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 3%,transparent 3%, transparent 100%),radial-gradient(circle at 48% 3%, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.02) 3%,transparent 3%, transparent 100%),radial-gradient(circle at 64% 14%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 3%,transparent 3%, transparent 100%),radial-gradient(circle at 28% 95%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 3%,transparent 3%, transparent 100%),radial-gradient(circle at 44% 75%, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.02) 3%,transparent 3%, transparent 100%),radial-gradient(circle at 34% 71%, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0.01) 7%,transparent 7%, transparent 100%),radial-gradient(circle at 59% 30%, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0.01) 7%,transparent 7%, transparent 100%),radial-gradient(circle at 2% 90%, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0.01) 7%,transparent 7%, transparent 100%),radial-gradient(circle at 21% 85%, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0.01) 7%,transparent 7%, transparent 100%),radial-gradient(circle at 76% 27%, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.02) 7%,transparent 7%, transparent 100%),radial-gradient(circle at 97% 12%, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0.01) 7%,transparent 7%, transparent 100%),radial-gradient(circle at 55% 89%, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0.01) 7%,transparent 7%, transparent 100%),radial-gradient(circle at 11% 47%, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0.01) 7%,transparent 7%, transparent 100%),radial-gradient(circle at 65% 40%, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.02) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 98% 38%, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.02) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 46% 88%, rgba(255,255,255,0.01) 0%, rgba(255,255,255,0.01) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 47% 39%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 5%,transparent 5%, transparent 100%),linear-gradient(0deg, hsla(278,0%,14%,1),hsla(263,0%,14%,1));
	display:flex;
	height:100vh;
	left:0;
	justify-content:center;
	opacity:0;
	padding:.5em;
	pointer-events:none;
	position:fixed;
	transition:opacity .3s, top 5s;
	transition-delay:.5s;
	width:100vw;
	will-change:opacity;
	z-index:-9
}
.contact_form.is-active,
.contact_form:focus-within{
	opacity:1;
	pointer-events:all;
	top:0;
	transition:opacity .3s, top 0s;
	transition-delay:.25s;
	z-index:9
}


.contact_form fieldset{
	background:rgba(255,255,255,.1);
	border:0;
	border-radius:1em;
	box-shadow:0 2em 2em -1.5em rgba(0,0,0,.5);
	display:inline-block;
	padding:5em 1em 1em;
	pointer-events:all;
	transform:scale(0);
	transition:.5s;
	will-change:transform
}
.contact_form.is-active fieldset,
.contact_form:focus-within fieldset{
	transform:scale(1);
	transition-delay:0s
}
@media (min-width:1024px){
	.contact_form fieldset{
		padding:5em 2em 2em;
	}
}
@media (max-width:1024px){
	.contact_form fieldset{
		padding:1em
	}
}


.contact_form legend{
	color:#fff;
	font-size:4rem;
	position:absolute;
	top:1.2em
}
@media (min-width:1024px){
	.contact_form legend{
		top:.6em
	}
}
@media (max-width:1024px){
	.contact_form legend{
		display:none
	}
}


.contact_form .contact_form_close{
	background:#fff;
	border:2px #000 solid;
	border-radius:1em;
	color:#222;
	display:inline-block;
	font-size:.8rem;
	line-height:1em;
	padding:.5em .8em;
	position:absolute;
	right:.5em;
	text-decoration:none;
	text-transform:uppercase;
	top:1.2em
}
@media (min-width:1024px){
	.contact_form .contact_form_close{
		right:4.5em;
		top:3.6em
	}
}
@media (max-width:1024px){
	.contact_form .contact_form_close{
		top:3em;
		z-index:2
	}
}


.contact_form .form_item{
	margin-bottom:.5em
}


.contact_form .form_item > label{
	color:#fff;
	display:block
}


.contact_form .form_item > input,
.contact_form .form_item > textarea{
	border-radius:.5em;
	border:1px #808080 solid;
	color:#000;
	display:block;
	font-family:system,sans-serif;
	font-size:1.2rem;
	padding:1em;
	transition:.25s;
	width:100%
}
.contact_form .form_item > input:focus,
.contact_form .form_item > textarea:focus{
	border-radius:0
}


.contact_form button{
	background:dodgerblue;
	border-radius:1em;
	border:0;
	color:#fff;
	display:block;
	font-size:1.2rem;
	font-weight:600;
	margin-top:1em;
	padding:.5em 1em;
	text-decoration:none;
	text-transform:uppercase;
	transition:.2s;
	width:100%
}
.contact_form button:focus,
.contact_form button:hover{
	box-shadow:0 1em 1em -1em rgba(0,0,0,.2);
	transform:translateY(-.1em);
}
@media (min-width:1024px){
	.contact_form button{
		display:inline-block;
		width:auto
	}
}


.main_footer{
	x--content-visibility:auto;
	font-size:1rem;
	padding:60px 0 120px
}
@media (min-width:1024px){
	.main_footer{
		padding:86px 0 120px calc(10vw - 80px)
	}
}


@media (min-width:1024px){
	.main_footer .waves--top{
		top:-19px
	}
}

.main_footer h4{
	font-size:1.2rem;
	font-weight:700;
	left:-0.4em;
	letter-spacing:-0.1em;
	padding-bottom:8px;
	text-transform:uppercase
}


.main_footer li{
	list-style-type:none;
	padding-bottom:4px;
	margin-left:0
}


.main_footer a{
	font-size:.8rem;
	opacity:.7;
	text-decoration:none
}
.main_footer a:active,
.main_footer a:focus,
.main_footer a:hover{
	opacity:1;
	text-decoration:underline
}


.main_footer .credits p{
	line-height:1.5em;
	margin:0
}


.main_footer .credits .privacy_statement{
	line-height:1.2em;
	margin-bottom:.7em;
}


.privacy_statement a{
	font-size:.8rem
}


.yard_list{}
@media (max-width:1024px){
	.yard_list{
		x-padding-left:70px;
		width:auto
	}
}


.social_media{}
@media (max-width:1024px){
	.social_media{
		padding-left:0;
		width:auto
	}
}


.credits{}
@media (max-width:1024px){
	.credits{}
}


.is-visually_hidden{
	position:fixed;
	top:-100vh
}


@media (max-width:1024px){
	.is-hidden--mobile{
		display:none
	}
}


/* Ripple effect */
.button{
	background-position:center;
	border:1px #fff solid;
	border-radius:1em;
	cursor:pointer;
	display:inline-block;
	padding:.25em 1em;
	text-decoration:none;
	transition:background 0.8s;
}
.main_content a.button{
	color:#fff
}
.button:focus,
.button:hover{
	background:#47a7f5 radial-gradient(circle, transparent 1%, #47a7f5 1%) center/15000%;
	color:#fff;
	text-decoration:none
}
.button:active{
	background-color:#6eb9f7;
	background-size:100%;
	transition:background 0s
}
/* https://ianlunn.github.io/Hover/ */


/* Contact */


@keyframes animation_contact_view{
	0% {
		background-image:radial-gradient(circle at 25% 56%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 2%,transparent 2%, transparent 100%),radial-gradient(circle at 82% 13%, rgba(0,0,0,0.01) 0%, rgba(0,0,0,0.01) 2%,transparent 2%, transparent 100%),radial-gradient(circle at 83% 72%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 2% 3%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 40% 42%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 65% 1%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 14% 41%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 67% 71%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 11% 31%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 5%,transparent 5%, transparent 100%),linear-gradient(202deg, rgb(71, 230, 233),rgb(16, 29, 178))
	}
	50% {
		background-image:radial-gradient(circle at 25% 56%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 2%,transparent 2%, transparent 100%),radial-gradient(circle at 82% 13%, rgba(0,0,0,0.01) 0%, rgba(0,0,0,0.01) 2%,transparent 2%, transparent 100%),radial-gradient(circle at 83% 72%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 2% 3%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 40% 42%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 65% 1%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 14% 41%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 67% 71%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 11% 31%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 5%,transparent 5%, transparent 100%),linear-gradient(365deg, rgb(71, 230, 233),rgb(16, 29, 178))
	}
	100% {
		background-image:radial-gradient(circle at 25% 56%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 2%,transparent 2%, transparent 100%),radial-gradient(circle at 82% 13%, rgba(0,0,0,0.01) 0%, rgba(0,0,0,0.01) 2%,transparent 2%, transparent 100%),radial-gradient(circle at 83% 72%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 2% 3%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 40% 42%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 65% 1%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 8%,transparent 8%, transparent 100%),radial-gradient(circle at 14% 41%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 67% 71%, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.03) 5%,transparent 5%, transparent 100%),radial-gradient(circle at 11% 31%, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.02) 5%,transparent 5%, transparent 100%),linear-gradient(202deg, rgb(71, 230, 233),rgb(16, 29, 178))
	}
}
@keyframes xanimation_contact_view{
	0%{
		display:none
	}
	100%{
		display:flex
	}
}


.main_header_yard{
	align-items:center;
	background:#000 no-repeat bottom left fixed;
	background-size:cover;
	display:flex;
	min-height:94vh;
	justify-content:center;
	margin-bottom:80px;
	padding:40px 0;
	z-index:12
 }
.junk_yard_page .main_header_yard{
	background:#000 url(junkyard.jpg) no-repeat bottom left fixed;
	background-size:cover
}
.back_yard_page .main_header_yard{
	background:#000 none;
	overflow:hidden
}
.yard_page.is-wireframe_mode .main_header_yard{
	border-bottom:5px #fff solid;
	transition:5s
}
.ua--safari.yard_page.is-wireframe_mode .main_header_yard_skim.wireframe_box{
	box-shadow:0 0 1px 8px #fff;
	border-color:#fff;
	outline:0
}
.yard_page.is-wireframe_mode .main_header_yard[data-header-state='state_0']{
	filter:grayscale(1%) invert(0%) saturate(0)
}
.yard_page.is-wireframe_mode .main_header_yard[data-header-state='state_1']{
	filter:grayscale(1%) invert(10%) saturate(100%)
}
.yard_page.is-wireframe_mode .main_header_yard[data-header-state='state_2']{
	filter:grayscale(0) invert(0) saturate(400%)
}
.yard_page.is-wireframe_mode .main_header_yard[data-header-state='state_3']{
	filter:grayscale(90%) invert(0) saturate(100%)
}
.yard_page.is-wireframe_mode .main_header_yard[data-header-state='state_4']{
	filter:grayscale(1%) invert(0) saturate(70%)
}
.yard_page.is-wireframe_mode .main_header_yard[data-header-state='state_5']{
	filter:grayscale(1%) invert(0) saturate(90%)
}


.main_header_yard_skim{
	background:rgba(0,0,0,.75);
	margin-left:10%;
	margin-right:60%;
	padding:40px;
	transition:.2s!important /* TMP */
}
@media(max-width:1024px){
	.yard_page .main_header_yard{
		padding:100px 0 20px
	}
	.main_header_yard_skim{
		margin-left:70px;
		margin-right:30vw
	}
}
.yard_page .main_header_yard h1{
	font-size:1.4rem;
	font-weight:900;
	text-transform:uppercase
}
.yard_page .main_header_yard h2{
	font-size:4.2rem;
	font-weight:100;
	line-height:1em;
	padding-bottom:.26em;
	z-index:2
}
.yard_page .main_header_yard p{
	font-size:1.1rem;
	line-height:1.6em;
	padding-right:44%;
	z-index:2
}
.yard_page .recent_member_berries{
	padding-top:80px
}


.is-wireframe_mode .main_content{
	margin:-120px auto 0;
	transition:.5s;
	width:92%;
	z-index:12
}
@media (min-width:1024px){
	.is-wireframe_mode .main_content{
		transform:rotate(3deg);
		width:90%
	}
}


.is-wireframe_mode .yard_item{
	background:#fff;
	color:#333;
	margin-bottom:0;
	padding:40px 20px 0;
	outline:8px #000 solid;
	transition:.5s
}
@media (max-width:1024px){
	.is-wireframe_mode .yard_item:last-child{
		margin-bottom:-30px;
		outline:6px #000 solid
	}
}
.is-wireframe_mode.ua--safari .yard_item{
	box-shadow:0 0 1px 2px #fff;
	outline:none
}
@media (min-width:1024px){
	.is-wireframe_mode .yard_item{
		padding:40px 40px 0 40px;
	}
	.is-wireframe_mode .yard_item:nth-child(odd){
		transform:rotate(-4deg)
	}
	.is-wireframe_mode .yard_item:nth-child(even){
		transform:rotate(-1deg)
	}
}
@media (min-width:1600px){
	.yard_item{
		display:inline-block;
		width:49%
	}
	.yard_item:last-child{
		margin-left:45%;
		margin-top:-120px
	}
	.back_yard_page .yard_item:last-child{
		/* margin-top:30px */
	}
	.is-wireframe_mode .yard_item.yard_item{
		margin-bottom:-40px;
		outline:6px #000 solid
	}
	.is-wireframe_mode .yard_item:nth-child(3){
		transform:rotate(1.4deg) translateY(-30px) translateX(-10px)
	}
	.is-wireframe_mode .yard_item:nth-child(4){
		transform:rotate(-5deg) translateY(68px)
	}
}

@media (min-width:1024px){
	.yard_page .yard_item .column.column{
		width:48%;
		padding:10px;
		vertical-align:top
	}
	.yard_page .yard_item .column.column + .column{
		padding-left:40px
	}
}

.is-wireframe_mode .yard_item h3{
	color:#000;
	font-family:'hand-written';
	font-size:3.6rem;
	line-height:1.1em;
	margin-bottom:30px
}
@media (max-width:1024px){
	.is-wireframe_mode .yard_item h3{
		margin-bottom:44px;
		text-align:center
	}
}
.is-wireframe_mode .yard_item .column p{
	font-family:'hand-written';
	margin-top:28px
}
.is-wireframe_mode .yard_item .column p:first-child{
	margin-top:-14px
}
.is-wireframe_mode .yard_item .column p:last-child{
	padding-bottom:60px
}
.yard_page blockquote{
	quotes: "\201C""\201D""\2018""\2019";
}
.yard_page blockquote::before,
.yard_page .yard_item .column blockquote::before{
	color:#ccc;
	content:open-quote;
	font-size:2.5em;
	position:absolute;
	top:10px
}
.yard_page .yard_item .column blockquote p{
	font-family:system;
	font-style:italic;
	font-size:2rem;
	line-height:1.25em;
	padding-left:20px;
	text-align:right
}
.yard_page .yard_item .column blockquote figcaption{
	text-align:right
}

.yard_page .yard_item .column img,
.yard_page .yard_item .column video{
	height:auto;
	margin:0 auto;
	max-width:100%;
	outline:20px rgba(0,0,0,1) solid;
	outline-style:double;
	width:100%
}
.ua--safari.yard_page .yard_item .column img,
.ua--safari.yard_page .yard_item .column video{
	outline:0
}
.is-wireframe_mode .wireframe_box:nth-child(even) img,
.is-wireframe_mode .wireframe_box:nth-child(even) video{
	border-radius:15px 225px 15px 255px/255px 15px 225px 15px
}
.is-wireframe_mode .wireframe_box{
	box-shadow:20px 38px 34px -26px rgba(0,0,0,.2);
	border-color:#000;
	border-radius:255px 15px 225px 15px/15px 225px 15px 255px;
	outline:3px #fff solid;
	transition:.25s
}
.ua--safari.is-wireframe_mode .wireframe_box{
	box-shadow:0 0 1px 8px #000;
	border-color:#fff;
	outline:0
}
.is-wireframe_mode .wireframe_box:nth-child(even){
	box-shadow:-26px 38px 64px 20px rgba(0,0,0,.2);
	border-radius:15px 225px 15px 255px/255px 15px 225px 15px
}
.ua--safari.is-wireframe_mode .wireframe_box:nth-child(even){
	box-shadow:0 0 1px 8px #000;
	border-color:#fff;
	outline:0
}

.autoplay_video:focus-within,
.autoplay_video:hover{
	animation:autoplay_video_anim .01s
}
@keyframes autoplay_video_anim{
	from{opacity:.99999}
	to{opacity:1}
}



.main_header_yard_skim{
	contain:paint;
	page-transition-tag:yard_header
}
::page-transition-outgoing-image(yard_header) {
	animation:600ms ease-out both fling-out
}
::page-transition-incoming-image(yard_header) {
	animation:2500ms ease-in both fling-in
}
@media (max-width:1024px){
	::page-transition-outgoing-image(yard_header) {
		animation:200ms ease-out both fling-out
	}

	::page-transition-incoming-image(yard_header) {
		animation:400ms ease-in both fling-in
	}
}


@keyframes fade-in{
	to{
		opacity:1
	}
}
@keyframes fling-out{
	to{
		transform:translate3d(-100vw,0,0)
	}
}
@keyframes fling-in{
	from {
		color:transparent;
		tranform:translate3d(200vw,0,0)
	}
	to{
		color:#fff;
		tranform:translate3d(0,0,0)
	}
}