*{
	-webkit-font-smoothing: antialiased;
	font-feature-settings: "liga""dlig";
	text-rendering: optimizeLegibility;
	font-variant-ligatures: common-ligatures discretionary-ligatures historical-ligatures contextual;
	-webkit-font-variant-ligatures: common-ligatures discretionary-ligatures historical-ligatures contextual;
	-ms-font-variant-ligatures: common-ligatures discretionary-ligatures historical-ligatures contextual;
	-o-font-variant-ligatures: common-ligatures discretionary-ligatures historical-ligatures contextual;
	
	
	hanging-punctuation: allow-end;
}

.inconsolata-body {
  font-family: "Inconsolata", monospace;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

.instrument-serif-regular {
  font-family: "Instrument Serif", serif;
  font-weight: 400;
  font-style: normal;
}

.instrument-serif-regular-italic {
  font-family: "Instrument Serif", serif;
  font-weight: 400;
  font-style: italic;
}


html, body {
	background-color: #282A2E;
	padding: 0 24px 0 24px;
	margin: 0;
}

	
#main {
	padding: 164px 0 0 0;
	margin: 0 auto 0 auto;
	max-width: 1320px;
	hanging-punctuation: allow-end;
	border: 1px solid rgba(255,255,255,.05);
	height: 100%;
}	

a:link, a:visited, a:active, a:hover{
	color: #eee;
	text-decoration: none:
}

a:hover{
	color: #fff;
}




.head{
	
	display: flex;
	justify-content: flex-start;
	
	
	border: 1px solid rgba(255,255,255,.05);
	border-width: 1px 0px 0px 1px;
	
	width: 1fr;
	z-index: 2;

	animation: 3s linear 1s slide-in;
}

h1{

	font-size: 154px;
	line-height: 80%;
	color: #eee;
	
	padding: 0;
	margin: 0;
	font-weight: normal;
	z-index: 2;
}


.subhead{
	display: flex;
	justify-content: flex-end;
	
	border: 1px solid rgba(255,255,255,.05);
	border-width: 1px 0px 1px 0px;
	text-align: right;
	width: 100%;
	padding: 60px 0 0 0;
	
	color: #eee;
	
	
	font-size: 64px;
	line-height: 100%;
	text-align: right;
	hanging-punctuation: allow-end;
}

.subhead p{
	max-width: 65%;
	padding: 0;
	margin: 0;
	z-index: 3;
	
}


.img-container{
	/* 315, 395 */
	width: 315px;
	height: 395px;
	overflow: hidden;
	position: relative;
	top: -80px;
	margin-left:110px;
	margin-top: -160px;
	z-index: 0;
}

.img-container img{
	object-fit: cover;
	margin: -10px 0 0 -70px;
}

.desc{
	font-size: 18px;
	
	
	display: flex;
	justify-content: flex-start;
	color: #eee;
	
	border: 1px solid rgba(255,255,255,.05);
	border-width: 1px 0px 0px 1px;
	
	line-height: 150%;
	padding: 140px 0 20px 0;
	margin-left:110px;
	z-index: 1;
}

.desc p{
	max-width: 540px;
	
	
	padding: 0;
	margin: 0;
}

.desc a:link, a:visited, a:active, a:hover{
	color: #eee;
	text-decoration: none:
}

.desc a:hover{
	color: #fff;
	text-decoration: none:
}



.foot{
	font-size: 18px;
	height: 140px;
	
	display: flex;
	justify-content: flex-start;
	color: #eee;
	
	border: 1px solid rgba(255,255,255,.05);
	border-width: 1px 0px 0px 0px;

	z-index: 1;
}

.copy{
	
	position: relative;
	width: 100px;
	left: -36px;
	top: -330px;
	padding: 0;
	margin 0;
	
	letter-spacing: 1px;
	rotate: 90deg;
	
}

.copy p{
	
	color: #eee;
	padding: 0;
	margin 0;
}


.patent{
	display: flex;
	justify-content: flex-end;
	text-align: right;
	border: none;
	font-size: 12px;
	color: #555;
}
.patent p {

	text-align: right;
	max-width: 200px;
}

@media (max-width: 960px) {

	#main {
		padding: 84px 0 0 0;
	}

	html, body {
  		/*background-color: #282A20;*/
  		padding: 0 20px 0 20px;
  	}
  
  	.subhead{
  		font-size: 44px;
  	}
  
  	.subhead p{
  		max-width: 64%;
  		z-index: 2;
 	 }
  
 	 h1{
  		font-size: 92px;
 	 }
  
  
	 .img-container{
		/* 315, 395 */
		width: 188px;
		height: 220px;
		top: -16px;
		margin-left: 48px;
		}
	
	.img-container img{
		object-fit: cover;
		margin: 0 0 0 -32px;
		width: 280px;
	}
	
	.desc{
		padding: 140px 0 20px 0;
		margin-left:48px;
		z-index: 1;
	}
	
	.copy{
		top: 92px;
		left: -44px;
	
	}
}


@media (max-width: 600px) {

 	 h1{
  		font-size: 78px;
		}
 	 html, body {
 	 	/*background-color: #28202A;*/
 	 	padding: 0 12px 0 12px;
 	 }

	.desc{
	
		padding: 80px 0 20px 0;
		z-index: 2;
		margin-left:40px;
	}
	
	.desc p{
		max-width: 540px;
	}

	.img-container{
		top: 12px;
		margin-left:40px;
		margin-top: -100px;
		z-index: 0;
	}

	.img-container img{
		margin: 0 0 0 -40px;
		width: 280px;
	}

	.subhead{
  		font-size: 32px;
 	 }

	.subhead p{
		max-width: 65%;
		padding: 0;
		margin: 0;
		z-index: 2;
	
	}


}


@media (max-width: 480px) {
	html, body {
 	 	/*background-color: #28202A;*/
 	 	padding: 0 8px 0 8px;
 	 }
	h1{
  		font-size: 62px;
		}
		
	.subhead p{
		max-width: 75%;
		padding: 0;
		margin: 0;
		z-index: 2;
	
	}
	
	.img-container{
		top: 12px;
		margin-left:16px;
		margin-top: -100px;
		z-index: 0;
	}
	
	.desc{
	
		padding: 60px 0 20px 0;
		z-index: 2;
		margin-left:16px;
	}
}


@media (max-width: 420px) {
	html, body {
 	 	background-color: #28202A;
 	 	padding: 0 8px 0 8px;
 	 }
	h1{
  		font-size: 62px;
		}
		
	.subhead p{
		max-width: 80%;
		padding: 0;
		margin: 0;
		z-index: 2;
	
	}
	
	.img-container{
		top: 12px;
		margin-left:0px;
		margin-top: -100px;
		z-index: 0;
	}
	
	.desc{
	
		padding: 60px 0 20px 0;
		z-index: 2;
		margin-left:0px;
	}
}