/* RESET */

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

@font-face {font-family: 'favorit-regular';src: url('../webfonts/favorit-regular.woff') format('woff');}




/* BASICS */

body, html 				{
						height: 100%;

						}


html 					{  
						}


body 					{font-family: favorit-regular, sans-serif;
						font-size: 22px;
						font-weight: normal;
						-webkit-text-size-adjust: 100%;
					    -ms-text-size-adjust: 100%;
					    -webkit-font-smoothing: antialiased;
					    -moz-osx-font-smoothing: grayscale;
						height: 100%;
						color: #fff;
						background-color: #000;
						line-height: 1.4;
						letter-spacing: 0.5px;

						}
		

.black 					{background-color: #fff;
						color: #000;}

.black a 				{color: #000;}

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

header 					{
						width: 100%;
						position: fixed;
						right: 0;
					    left: 0;
					    margin-right: auto;
					    margin-left: auto;
						height: 30px;
						text-align: left;
						font-family: favorit-regular, sans-serif;
						font-size: 32px;
						text-transform: uppercase;
												line-height: 30px;
												overflow: visible;
												padding: 30px;
												box-sizing: border-box;
												letter-spacing: 1px;
						}



.section 				{width: 90%;
						top: 120px;
						text-align: center;
						}

#content 				{padding-top: 70px;}

#content img 			{
						display: inline-block;

						}

.content-img 			{width: 100%; height: 90vh;
						margin-bottom: 20px;
						padding: 30px;
						box-sizing: border-box;
						}

.content-img img			{height: 95%; max-height: 1400px;}

.center 				{text-align: center;}

.left 					{text-align: left;}

.right 					{text-align: right;}


.margin-1 				{margin-left: 440px;}

.margin-2 				{margin-right: 450px;}

#lightsout 				{position: fixed;
						right: 30px;
						top: 30px;}

.invert 				{  -webkit-filter: invert(1);
   						filter: invert(1);}

h4						{ 
						letter-spacing: 2px;
						margin-bottom: 60px;
						margin-top: 20px;
						display: block;
						font-size: 14px;
						} 				

#zip 					{position: fixed;
						left: 30px;
						bottom:30px;
						width: 80px;
						height: 80px;
						}
#zip img 				{height: 100%;
}


img {
  opacity: 0;
  transition: opacity .3s ease-in;
} 



.first {opacity: 1;}

@media only screen and ( max-width: 768px ) /* 640 */
 {
.center 				{text-align: left;}

.left 					{text-align: left;}

.right 					{text-align: left;}


img 					{
						max-width: 100vw;
						height: auto;}

#lightsout 				{display: none;}

header 					{position: absolute;}

.content-img 			{height: auto;}

.content-img img			{width: 100%;
						height: auto;}


#content 				{padding-top: 80px;}


h4 						{margin-bottom: 5px;}

/* Styles */
}