@import url('themes.css');


@font-face {
    font-family: 'ExoThin';
    src: url('../fonts/Exo-Thin-webfont.eot');
    src: url('../fonts/Exo-Thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Thin-webfont.woff') format('woff'),
         url('../fonts/Exo-Thin-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Thin-webfont.svg#ExoThin') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoThinItalic';
    src: url('../fonts/Exo-Thin-Italic-webfont.eot');
    src: url('../fonts/Exo-Thin-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Thin-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-Thin-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Thin-Italic-webfont.svg#ExoThinItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoExtraLight';
    src: url('../fonts/Exo-ExtraLight-webfont.eot');
    src: url('../fonts/Exo-ExtraLight-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-ExtraLight-webfont.woff') format('woff'),
         url('../fonts/Exo-ExtraLight-webfont.ttf') format('truetype'),
         url('../fonts/Exo-ExtraLight-webfont.svg#ExoExtraLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoExtraLightItalic';
    src: url('../fonts/Exo-ExtraLight-Italic-webfont.eot');
    src: url('../fonts/Exo-ExtraLight-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-ExtraLight-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-ExtraLight-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-ExtraLight-Italic-webfont.svg#ExoExtraLightItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoLight';
    src: url('../fonts/Exo-Light-webfont.eot');
    src: url('../fonts/Exo-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Light-webfont.woff') format('woff'),
         url('../fonts/Exo-Light-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Light-webfont.svg#ExoLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoLightItalic';
    src: url('../fonts/Exo-Light-Italic-webfont.eot');
    src: url('../fonts/Exo-Light-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Light-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-Light-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Light-Italic-webfont.svg#ExoLightItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoRegular';
    src: url('../fonts/Exo-Regular-webfont.eot');
    src: url('../fonts/Exo-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Regular-webfont.woff') format('woff'),
         url('../fonts/Exo-Regular-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Regular-webfont.svg#ExoRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoRegularItalic';
    src: url('../fonts/Exo-Regular-Italic-webfont.eot');
    src: url('../fonts/Exo-Regular-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Regular-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-Regular-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Regular-Italic-webfont.svg#ExoRegularItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoMedium';
    src: url('../fonts/Exo-Medium-webfont.eot');
    src: url('../fonts/Exo-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Medium-webfont.woff') format('woff'),
         url('../fonts/Exo-Medium-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Medium-webfont.svg#ExoMedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoMediumItalic';
    src: url('../fonts/Exo-Medium-Italic-webfont.eot');
    src: url('../fonts/Exo-Medium-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Medium-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-Medium-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Medium-Italic-webfont.svg#ExoMediumItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoDemiBold';
    src: url('../fonts/Exo-DemiBold-webfont.eot');
    src: url('../fonts/Exo-DemiBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-DemiBold-webfont.woff') format('woff'),
         url('../fonts/Exo-DemiBold-webfont.ttf') format('truetype'),
         url('../fonts/Exo-DemiBold-webfont.svg#ExoDemiBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoDemiBoldItalic';
    src: url('../fonts/Exo-DemiBold-Italic-webfont.eot');
    src: url('../fonts/Exo-DemiBold-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-DemiBold-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-DemiBold-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-DemiBold-Italic-webfont.svg#ExoDemiBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoBold';
    src: url('../fonts/Exo-Bold-webfont.eot');
    src: url('../fonts/Exo-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Bold-webfont.woff') format('woff'),
         url('../fonts/Exo-Bold-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Bold-webfont.svg#ExoBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoBoldItalic';
    src: url('../fonts/Exo-Bold-Italic-webfont.eot');
    src: url('../fonts/Exo-Bold-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Bold-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-Bold-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Bold-Italic-webfont.svg#ExoBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoExtraBold';
    src: url('../fonts/Exo-ExtraBold-webfont.eot');
    src: url('../fonts/Exo-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-ExtraBold-webfont.woff') format('woff'),
         url('../fonts/Exo-ExtraBold-webfont.ttf') format('truetype'),
         url('../fonts/Exo-ExtraBold-webfont.svg#ExoExtraBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoExtraBoldItalic';
    src: url('../fonts/Exo-ExtraBold-Italic-webfont.eot');
    src: url('../fonts/Exo-ExtraBold-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-ExtraBold-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-ExtraBold-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-ExtraBold-Italic-webfont.svg#ExoExtraBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoBlack';
    src: url('../fonts/Exo-Black-webfont.eot');
    src: url('../fonts/Exo-Black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Black-webfont.woff') format('woff'),
         url('../fonts/Exo-Black-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Black-webfont.svg#ExoBlack') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ExoBlackItalic';
    src: url('../fonts/Exo-Black-Italic-webfont.eot');
    src: url('../fonts/Exo-Black-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Exo-Black-Italic-webfont.woff') format('woff'),
         url('../fonts/Exo-Black-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Exo-Black-Italic-webfont.svg#ExoBlackItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

* {
	margin: 0;
	padding: 0;
	}

html, body {
	overflow-y: hidden!important;
	}
	
body {
	background:#f1f1f1 url("../graphics/logo_big.png") no-repeat;
	background-position: -55px 38%!important;
	}
	
/* Wraps around each of the #container subpages */
#wrapper {
	/* width == sum of all #containers */
	/* heigth == viewport height */
	display: block;
	background: url("../graphics/wires.png") repeat-x top left;
	}

/* Each individual view/subpage is within one of these */
.container {
	/* width == viewport width */
	/* heigth =~ viewport height - footer height */
	display: table-cell;
	background:red;
	min-width:1024px!important;
	}

/* The content of each subpage is inside this DIV */
.page_wrapper {
	/* heigth =~ #container height - margin-top */
	width: 85%;
	margin: 0 0 0 200px;
	display: block;
	overflow: auto;
	}
	
.page {
	overflow: auto;
	}

h1 {
	font: 40px ExoThin;
	letter-spacing: +0.05em;
	text-transform: uppercase;
	display:inline-block;
	height:79px;
	line-height:79px;
	padding: 4px 20px 0 20px;
	font-kerning: normal;
	border-radius: 2px;
	overflow:hidden;
	}
	
h2 {
	font: 21px ExoLight;
	letter-spacing: +0.1em;
	text-transform: uppercase;
	display:inline-block;
	height:39px;
	line-height:39px;
	font-kerning: normal;
	border-radius: 2px;
	margin-top:0px;
	}
	
p, a, ul li {
	font: 15px ExoLight;
	line-height: 1.5em;
	}
	
p, ul li {
	margin-bottom: 1em;
	}
	
p {
	margin-right:40%;
	}
	
p:last-child { margin-bottom:100px!important; }
	
a {
	font-family: ExoLight;
	padding:2px 5px 3px 5px;
	border-radius: 2px;
	text-decoration: none;
	}
	
#menu li span {
	font: 20px ExoLight;
	letter-spacing: +0.04em;
	}

.landing ul li {
	margin-top:20px;
	margin-left: 20px;
	list-style-type: square!important;
	text-align:right;
	display:block;
	width:370px;
	}

ul li {
	margin-top:20px;
	margin-left: 20px;
	list-style-type: square!important;
	}
	
#menu li span {
	text-transform: uppercase;
	line-height:26px;
	padding: 6px 20px 3px 20px;
	border-radius:2px;
	}
	
#intro {
	display:block;
	position:absolute;
	left:600px;
	width:290px;
}

#intro p {
	margin:-23px 0 0 0;
	font-size:13px;
	text-align:left;
	color:#bbb;
	padding:10px;
	line-height:43px;
}

#menu li span:hover {
	cursor: pointer;
	}
	
#menu li {
	list-style-type: none!important;
	margin-left: 0;
	line-height: 20px;
	text-indent: 0!important;
	}
	
.landing ul, h1 + p {
	margin-top: 20px;
	}

.landing h1 {
	text-align:center;
	margin-left:80px;
	margin-bottom:-4px;
	width:250px;
}

.photo {
	float:left;
	margin:10px 15px 15px 0;
}
	
	
	
/*
 *   FOOTER-RELATED
 */
 
 
#footer {
	background: #151415;
	position: fixed;
	width:100%;
	height: 40px;
	bottom: 0;
	}
	
#footer p {
	margin: 13px 0 0 13px;
	font: 13px ExoLight;
	letter-spacing: +0.08em;
	color: #f1f1f1;
}




/*
 *   NAVIGATION-RELATED
 */


.nav_back {
	display: none;
	position: absolute;
	height: 100%;
	width: 270px;
	opacity: 1;
	overflow:show;
	background:#000;
	margin-left:0px;
	}

.rewind {
	display:block;
	position: absolute;
	height:79px;
	width:109px;
	background: url("../graphics/nav_back.png") no-repeat 10px center;
}

.rewind:hover {
	background: url("../graphics/nav_back_red.png") no-repeat 10px center!important;
}

.nav_menu {
	display:block;
	position:absolute;
	opacity:1;
	margin-top:100px;
	}

.nav_menu p {
	display:block;
	letter-spacing: +0.08em;
	text-align: left!important;
	font: 13px ExoRegular;
	color: #f1f1f1;
	width:257px;
	line-height:24px;
	margin-bottom:0;
	padding-bottom:3px;
	padding-top:3px;
	padding-left:13px;
	text-transform: uppercase;
	}
	
.nav_menu p:hover {
	cursor: pointer;
	color: #151415;
	background:#f1f1f1;
}

.rewind {
	margin-left:0px;
	opacity: 1!important;
}
	
.rewind:hover {
	cursor: pointer;
	}