@charset "utf-8";

body,div,dl,dt,dd,p,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,blockquote,form{margin:0;padding:0;}
ul,ol{list-style:none;}
img,a img{border:none;}
a{text-decoration:none;}
a:active,a:focus{outline:0;}
label,button{cursor:pointer;}
input,textarea,select{font-family:Arial,Helvetica,sans-serif;font-size:10px;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block;}

::selection				{ background-color: #FFF; color: #090909; }
::-moz-selection		{ background-color: #FFF; color: #090909; }

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face { font-family: "Untld"; src: url('UntitledSansWeb-Regular.eot'); src: url('UntitledSansWeb-Regular.eot?#iefix') format('embedded-opentype'), url('UntitledSansWeb-Regular.woff2') format('woff2'), url('UntitledSansWeb-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-stretch: normal; font-display: swap; }

/*fade in effects*/
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
.layout { opacity:0;-webkit-animation:fadeIn ease-in 1;-moz-animation:fadeIn ease-in 1;animation:fadeIn ease-in 1;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-duration:0.5s;-moz-animation-duration:0.5s;animation-duration:0.5s; }
html { height: 100%; }
body * { transition: all .2s; -moz-transition: all .2s ease; -o-transition: all .2s ease; -webkit-transition: all .2s ease; }
body { background-color: #090909; color: #DDD; font-size: 12px; font-family: "Untld", sans-serif; line-height: 1.2; }
body { height: 100%; background: linear-gradient(40deg, #000, #191919, #292929); background-size: 600% 600%; -webkit-animation: FadeBG 8s ease infinite; -moz-animation: FadeBG 8s ease infinite; animation: FadeBG 8s ease infinite; }
@-webkit-keyframes FadeBG { 0%{background-position:90% 0%} 50%{background-position:11% 100%} 100%{background-position:90% 0%} }
@-moz-keyframes FadeBG { 0%{background-position:90% 0%} 50%{background-position:11% 100%} 100%{background-position:90% 0%} }
@keyframes FadeBG { 0%{background-position:90% 0%} 50%{background-position:11% 100%} 100%{background-position:90% 0%} }

.layout 				{ overflow: hidden; position: absolute; bottom: 30px; left: 30px; text-align: left; }
header					{ margin-bottom: 20px; }

h1						{ margin: 100px 0 10px; }
h1 a					{ color: #FFF; }
h2						{ color: #AAA; font-size: 15px; font-weight: normal; line-height: 22px; margin-bottom: 20px; max-width: 560px; }
h3						{ color: #EEE; font-size: 14px; font-weight: normal; line-height: 26px; }
h3 a                    { color: #EEE; text-decoration: underline; }
h3 a:hover				{ color: #666; text-decoration: underline; }

nav ul 					{ float: left; margin-right: 20px; width: 360px; }
nav ul li 				{ font-size: 12px; line-height: 30px; overflow: hidden; }
nav ul li a				{ border-bottom: 1px solid rgba(255,255,255,0.1); color: #FFF; display: block; padding-top: 4px; }
nav ul li a:hover 		{ border-bottom: 1px solid rgba(255,255,255,0.5); color: #FFF; }

/* MEDIA QUERIES
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 1180px) {
	.layout { margin: 0 auto; padding: 40px 20px 20px; position: relative; bottom: auto; left: auto; width: auto; }
	header { margin-bottom: 20px; }
	img { height: 20px; width: auto; }
	h1 { margin: 0 0 5px; }
	h2 { line-height: 1.6; margin: 0 0 20px; text-align: left; width: 100%; }
	nav ul { float: none; margin: 0 auto; width: 100%; }
}