* {margin: 0; padding: 0; user-select: none;}

@font-face {
    font-family: 'slab';
    src: url('/css/slab/RobotoSlab-Bold-webfont.eot');
    src: url('/css/slab/RobotoSlab-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/slab/RobotoSlab-Bold-webfont.woff') format('woff'),
         url('/css/slab/RobotoSlab-Bold-webfont.ttf') format('truetype'),
         url('/css/slab/RobotoSlab-Bold-webfont.svg#roboto_slabbold') format('svg');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'slab';
    src: url('/css/slab/RobotoSlab-Regular-webfont.eot');
    src: url('/css/slab/RobotoSlab-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/slab/RobotoSlab-Regular-webfont.woff') format('woff'),
         url('/css/slab/RobotoSlab-Regular-webfont.ttf') format('truetype'),
         url('/css/slab/RobotoSlab-Regular-webfont.svg#roboto_slabregular') format('svg');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'slab';
    src: url('/css/slab/RobotoSlab-Light-webfont.eot');
    src: url('/css/slab/RobotoSlab-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/slab/RobotoSlab-Light-webfont.woff') format('woff'),
         url('/css/slab/RobotoSlab-Light-webfont.ttf') format('truetype'),
         url('/css/slab/RobotoSlab-Light-webfont.svg#roboto_slablight') format('svg');
    font-weight: 300;
    font-style: normal;

}
@font-face {
    font-family: 'slab';
    src: url('/css/slab/RobotoSlab-Thin-webfont.eot');
    src: url('/css/slab/RobotoSlab-Thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/slab/RobotoSlab-Thin-webfont.woff') format('woff'),
         url('/css/slab/RobotoSlab-Thin-webfont.ttf') format('truetype'),
         url('/css/slab/RobotoSlab-Thin-webfont.svg#roboto_slabthin') format('svg');
    font-weight: 100;
    font-style: normal;

}

html, body {
	height: 100%;
	background: #161616;
	font: 300 normal 0/0 'slab';
	/*cursor: cell;*/
}

canvas {
	display: block;
	position: fixed;
	z-index: 1;
}

main{
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -33px;
	position: relative;
	z-index: 2;
}

main h1{
	font: 100 normal 48px/80px 'slab';
	color: rgba(80,200,280,0.88);
	padding:16px 32px 0 32px;
}

main h2{
	font: 100 normal 24px/40px 'slab';
	color: rgba(80,200,280,0.88);
	padding:16px 32px 0 32px;
}
main h2 a{
	color: rgba(255,255,255,0.88);
}

section{
	border-top: 1px solid rgba(80,200,280,0.48);
	margin:32px;
	text-align: left;
}

section:last-child{
	padding:0 0 32px 0;
}

section h3{
	text-align: right;
	font: 300 normal 16px/32px 'slab';
	color: rgba(80,200,280,0.48);
}

section a{
	vertical-align: top;
	border: 1px solid rgba(80,200,280,0.48);
	display: inline-block;
	margin:	32px 32px 32px 0;
	position: relative;
	vertical-align: middle;
	cursor: pointer;
	text-align: center;
	font: 300 normal 20px/20px 'slab';
	color: rgba(80,200,280,0.88);
	padding: 16px;
	vertical-align: middle;
	text-decoration: none;
}

section a:hover{
	border: 1px solid rgba(80,200,280,0.48);
	background-color: rgba(80,200,280,0.88);
	color: rgba(0,0,0,0.64);
}
section h4{
	font: 100 normal 24px/40px 'slab';
	color: rgba(80,200,280,0.88);
	padding:16px 0 32px 0;
}
section form{
	width: auto;
	max-width: 100%;
	display: inline-block;
}
section form label{
	font: 300 normal 16px/32px 'slab';
	color: rgba(80,200,280,0.48);
	margin: 0 16px 0 0;
	display: block;
	vertical-align: top;
	width: 96px;
	text-align: left;
}
section form div{
	vertical-align: top;
}
section form div input,
section form div textarea,
section form div button{
	margin:0 0 16px 0;
	font: 300 normal 20px/32px 'slab';
	padding:16px;
	max-width: calc(100% - 32px);
	width: 400px;
	min-height: 32px;
	cursor: text;
	background-color: transparent;
	border: 1px solid rgba(80,200,280,0.48);
	color: rgba(80,200,280,0.88);
	outline: none;
}
section form div input:focus,
section form div textarea:focus,
section form div button:focus{
	border: 1px solid rgba(80,200,280,0.88);
}
section form div textarea{
	height: 128px;
	resize: none;
}

section form button{
	vertical-align: top;
	border: 1px solid rgba(80,200,280,0.48);
	display: inline-block;
	margin:	16px 0 16px 0;
	position: relative;
	cursor: pointer;
	background-color: transparent;
	color: rgba(80,200,280,0.88);
	text-align: center;
	font: 300 normal 20px/20px 'slab';
	color: rgba(80,200,280,0.88);
	padding: 16px;
	outline: none;
}

section form button:hover{
	border: 1px solid rgba(80,200,280,0.48);
	background-color: rgba(80,200,280,0.88);
	color: rgba(0,0,0,0.64);
}

section form button.sent{
	background-color: rgba(0,255,155,0.88);
	transition: background-color 320ms linear;
}

section form input.error,
section form textarea.error,
section form button.error{
	border: 1px solid rgba(255,155,155,0.88);
	transition: border 320ms linear;
}

section form button.error{
	background-color: rgba(255,155,155,0.88);
	transition: background-color 320ms linear;
}

footer{
	z-index: 2;
	margin:0 32px;
	border-top: 1px solid rgba(80,200,280,0.48);
	display:block;
	height: 32px;
	text-align: left;
}

footer label{
	font: 100 normal 12px/32px 'slab';
	color: rgba(80,200,280,0.48);
}

div#google_translate_element{
	display: inline-block;
	float: right;
	margin: 0;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    rgba(0,160,240,0.16);;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    rgba(0,160,240,0.16);;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    rgba(0,160,240,0.16);;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
   color:    rgba(0,160,240,0.16);;
}
