@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: 'Jura';
  src: url('Jura-Light.otf');
}

body {
	background: #000000;
}

#menu {
	font-family: Jura;
}

#menu, #subWho, #subWhat, #subHow, #subHowMany {
    background-image: url(images/backgroundBlack90.png); 
	background-repeat: repeat;
	position: fixed;
}

#menu {
	width: 15%;
	left: 5%;
	height: 100%;
	top: 0%;
}

#menu header, nav {
	position: fixed;
	width: 15%;
	left: 5%;
}

#menu header {
	position: fixed;
	top: 3.2%;
	padding-top: 1.5%;
	padding-bottom: 0.8%;
	color: #ffffff;
}

#menu header img {
	width: 59%;
	margin-left: 20%;
}

#menu nav {
	padding: 0%;
	text-align: center;
	display: block;
	padding-top: 3%;
	top: 20%;
	position: fixed;
}

#menu nav .title{
	letter-spacing: normal;
	font-size: 30px; /*200%;*/
}

#menu a {
	text-decoration: none;
	color: #606060;
}

#menu a:hover {
	text-decoration: none;
	color: #e8e8e8;
	cursor: pointer;
	cursor: hand;
}

#menu nav #what, #how, #howMany, #why, #contact {
	margin-bottom: 0%;
	margin-top: 0%; /*11.8%;*/
}

#menu nav .title {
	cursor: pointer;
	cursor: hand;
	padding-top: 0%;
}

#menu nav .description {
	color: #e8e8e8;
	font-size: 18px; /*110%;*/
	margin-top: -3%;
	margin-bottom: 11.6%;
	opacity: 0.0;
}

/* chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) { 
	#menu nav .description {
		padding-bottom: 4%;
	}
}

/* ie 10 & 11 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#menu nav .description {
		padding-bottom: 1%;
	}
	#menu #who {
		margin-top: 2.5%;
	}
}

#subWho a, #subWhat a, #subHow a, #subHowMany a{
	margin-left: 3%;
}

#subWho, #subWhat, #subHow, #subHowMany {
	padding-top: 1.5%;
	padding-bottom: 1.5%;
	visibility: hidden; 
	opacity: 0;
	width: 75%;
	position: fixed;
	left: 20%;
	display: block;
	text-align: left;
	font-size: 18px; /*110%;*/
	top: 25.8%;
}

#subWhat {
	margin-top: 5.5%; 
}

#subHow {
	margin-top: 11%; 
}

#subHowMany {
	margin-top: 16.5%; 
}