html { font-family:"Jura", Courier, monospace;
		font-weight:600; }

.hover_group:hover {
  opacity: 1;
}

#projectsvg {
  position: relative;
  width: 100%;
  padding-bottom: 77%;
  vertical-align: middle;
  margin: 0;
  overflow: hidden;
}

#projectsvg svg {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}

body:before {
  content: "";
  display: block;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -999;
  background: url(../img/slowart_bg.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }

#countdown {
	font-size:21px;
	color:#333;
	text-align:center;
	}

#canvas { position: fixed; z-index: -888; }

.container {
	width:720px;
	margin:0px auto;
	min-height:100%;
	margin-top:100px;
}

h1 { text-align:center; color:#fff; margin-top:50px; }

p {
	font-size:18px;
	line-height:2em;
	padding:10px 20px;
	}
a {	color:#fff; text-decoration:none !important; }

.menu {
	left: 0;
	top: 0;
	background:rgba(0, 0, 0, 0.4);
	line-height:50px;
	width:100%;
	position: fixed;
	z-index: 999; }

.centered {
	width:400px;
	margin:0px auto;
	text-align:center;
}

.btn {
	width:420px;
	margin:0px auto;
	border:1px solid #888;
	text-align:center;
	font-family:"Jura", Courier, monospace;
	color:#888;
	font-size:21px;
	line-height:50px;
	margin-top:20px;
	}
	
.btn a {
	text-decoration:none !important;
	}
	
.btn:hover {
	color:#444;
	text-decoration:none;
	background:rgba(0, 0, 0, 0.1);
	}

.quest {	
	width:100%;
	background:rgba(0, 0, 0, 0.1);
	border-left: 5px solid #aaa;
	font-family: Arial Black, Arial, Helvetica, sans-serif;
	letter-spacing:-1px;
	color:#888;
	font-size:21px;
	margin-top:40px;
	padding:5px 20px;
	}
	
.answ a { border:1px solid #888; padding:2px; }
	
.answ {	
	width:100%;
	font-family:"Jura", Courier, monospace;
	color:#444;
	border-left: 5px solid #bbb;
	font-size:18px;
	line-height:1.5em;
	margin-top:5px;
	padding:5px 20px;
	}
	
footer {
	background:rgba(0, 0, 0, 0.4);
	font-size:14px;
	line-height:24px;
	text-align:center;
	width:100%;
	color:#ccc;
	margin-top:50px;
	}
	
footer a { color:#ccc; }
footer a:hover { color:#fff; }

audio {
	width:300px;
	z-index:9999;
/*	position:fixed;
	right:20px;
	top:20px; */
	opacity:0.5;
	-moz-border-radius:20px 20px 20px 20px ;
	-webkit-border-radius:20px 20px 20px 20px ;
	border-radius:20px 20px 20px 20px ;
	}
	
.menu_01 {
	background:url(../img/menu_01.svg);
	width:50px; height:50px; margin:10px;
	float:left;
	}

.menu_02 {
	background:url(../img/menu_02.svg);
	width:50px; height:50px; margin:10px;
	float:left;
	}

.menu_03 {
	background:url(../img/menu_03.svg);
	width:50px; height:50px; margin:10px;
	float:left;
	}

.menu_04 {
	background:url(../img/menu_04.svg);
	width:50px; height:50px; margin:10px;
	float:left;
	}

.menu_05 {
	background:url(../img/menu_05.svg);
	width:50px; height:50px; margin:10px;
	float:left;
	}
	
	
@media screen and (max-width : 1281px ){
	audio		{ width:0px; height:0px; position:relative; }
	.container	{ width:100%; }
	.btn		{ width:90%; }
	img			{ width:100%; }
}
