/* HTML5 DEFINITIONEN */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
/* Base */
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; }
body, button, input, select, textarea { font-family: sans-serif; }
/* Typography */
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
small { font-size: 75%; }
/* Lists */
nav ul { list-style: none; list-style-image: none; }
/* Embedded content */
img { border: 0; -ms-interpolation-mode: bicubic; }
svg:not(:root) { overflow: hidden; }
form { margin: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; }
table { border-collapse: collapse; border-spacing: 0; }

/* AB HIER LAYOUT */
	
@font-face {
    font-family: 'Thesis';
    src: url('../font/TheSansOsF-Bold.otf');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: "Rotis";
    font-style: normal;
    font-weight: normal;
    src: url("../font/Rotis.otf") format("opentype");
}
* { margin: 0; padding: 0; border:none; }
body { background:#000; height:100%; font-family: 'Rotis', Tahoma, Arial, Helvetica, sans-serif; font-size:12px; color:#1b1b1b; line-height:18px;}
a {text-decoration:none; -webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;}
*:focus { outline: 0; }
.clear {clear:both;}

/* body */
.alert {position:absolute;left:5%;top:0;z-index:10;padding:5px;background:red;color:#fff;}
.js .nojavascript { display:none; }
/* navigation */
#nav_box{ position:fixed; width:100%; bottom:50px; z-index:100; font-family: 'Thesis', Tahoma, sans-serif; letter-spacing:1px;}
.nav_back { position:absolute; left:0; top:0; width:100%; height:20px; background:#fff; -moz-opacity: 0.9; opacity: 0.9; filter:alpha(opacity=90);}
.logo {position:absolute; left:20px; top:14px; display:none; }
.logo a {display:inline-block;font-family: 'Rotis', Arial sans-serif; letter-spacing:0.5px; font-size:20px;color:#1b1b1b;  }
.btn_navbar { position:absolute; right:0; top:4px; background:url(../img/nav_button.png) no-repeat; width:60px; height:34px; cursor:pointer; display:none; }
#main_nav { position:absolute;left:20px; }
#service_nav { position:absolute;right:5%; }
.level_1  li { position:relative; list-style:none; height:20px; line-height:20px; font-size:12px; float:left; display:block;}
.level_1  li a { display:inline-block; padding:0 5px; background:#333; height:20px; color:#ccc; text-decoration:none; }
.level_1  li.active a, .level_1  li.trail a { color:#333; background:#fff; }
.level_1  li.active .level_2 li a, .level_1  li.trail .level_2 li a { color:#999; background:#333; }
.level_1  li.active .level_2 li.active a, .level_1  li.trail .level_2 li.active a { color:#333; background:#fff;  }
.level_1  li a:hover, .level_1  li.active .level_2 li a:hover, .level_1  li.trail .level_2 li a:hover { color:#333; background:#fff; }

.level_2 { visibility:hidden; position:absolute;left:0; text-align:left}
.level_1 li:hover .level_2 { visibility:visible; }
.level_1  li .level_2 li {float: none; width:300px;}
.level_1  li .level_2 li a {height:20px;line-height:20px;}
#nav_2{ margin-left:70px; }
#nav_3, #nav_4, #nav_5 { margin-left:30px; }
#nav_7 { margin-left:30px; }

/* Content */
.content, .projekt_content {position:absolute;left:0;top:20px; width:400px; z-index:10;}
.content:focus, .projekt_content:focus, .scroll-pane {outline:none;}
.content a, .projekt_content a {color:#1b1b1b;text-decoration:none; }
.content a:hover, .projekt_content a:hover {text-decoration:underline; }
.content_oben {position:absolute;left:0;top:70px; width:400px;}
.scroll-pane {width:400px; height:350px; overflow: auto;}
.trans_back {position:absolute; top:0; left:0; width:100%;height:100%;background:#fff;opacity:0.9;filter:alpha(opacity=90);-moz-opacity:0.9;}
/* scroller */
.jspContainer {overflow: hidden;position: relative;}
.jspPane{position: absolute;}
.jspVerticalBar{position: absolute;top: 0;right: 0;width: 15px;height: 100%;margin: 0;padding: 0;}
.jspHorizontalBar{display:none;}
.jspTrack{background:transparent;position: relative;}
.jspDrag{background: #e1e1e1;position: relative;top: 0;left: 0;cursor: pointer;}
.jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag {float: left;height: 100%;}
.jspArrow{background: #50506d;text-indent: -20000px;display: block;cursor: pointer;}
.jspArrow.jspDisabled{cursor: default;background: #80808d;}
.jspVerticalBar .jspArrow{height: 10px;}
.jspHorizontalBar .jspArrow{width: 10px;float: left;height: 100%;}
.jspVerticalBar .jspArrow:focus{outline: none;}
.jspCorner{	background: #eeeef4;float: left;height: 100%;}

.text {width: 350px; padding:5px 0 0px 20px; font-family: 'Rotis', Arial, sans-serif; font-size:13px;}
.text h1 {font-weight:normal; font-size:20px; margin:15px 0 20px 0; font-family: 'Thesis', Tahoma, sans-serif; letter-spacing:0.5px; padding-right:30px;}
.text h2 {font-weight:normal; font-size:17px; margin:10px 0; font-family: 'Thesis', Tahoma, sans-serif;}
.abstand {height:20px;}

#show_info {position:absolute; z-index:5; right:5%; top:50%; margin-top:35px;height:34px; width:34px;background:#434343;}
#show_info:hover {background:#000;}
#show_info .show {display:block; height:34px; width:34px;}

#close_info {position:absolute;right:15px;top:15px;height:30px; width:30px;cursor:pointer;background:#999 url('../img/close.png') no-repeat 0 0;}
#close_info:hover {background-color:#434343; }

/* kontakt */
#kartenbox {position:relative;margin-top:20px;height:340px;width:350px;}
#karte, #googlemap {position:absolute;top:0;left:0;}
#scg_map {cursor:pointer;}
#karte img {position:absolute;top:1px;left:1px;}
#karte img:hover {border:1px solid #ccc;top:0px;left:0px;}

/* Prev-Next */
#prevslide, #nextslide{ position:absolute; height:34px; width:34px; top:50%; cursor:pointer;}
#prevslide{ right:5%; background:#434343 url('../img/prev.png') no-repeat 0 0; margin-top:-35px;}
#nextslide{ right:5%; background:#434343 url('../img/next.png') no-repeat 0 0; }			
#prevslide:hover, #nextslide:hover{background-color:#000;}
/* 	Supersized  */	
#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../img/progress.gif) no-repeat center center;}
#supersized {  display:block; position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
#supersized img { width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/
#supersized li { display:block; list-style:none; z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111; }
#supersized a { width:100%; height:100%; display:block; }
#supersized li.prevslide { z-index:-20; }
#supersized li.activeslide { z-index:-10; }
#supersized li.image-loading { background:#111 url(../img/progress.gif) no-repeat center center; width:100%; height:100%; }
#supersized li.image-loading img{ visibility:hidden; }
#supersized li.prevslide img, #supersized li.activeslide img{ display:inline; }
/* Media queries */
@media (max-width: 850px) {
	#nav_2{ margin-left:30px; }
	#service_nav { right:20px; }
}
@media (max-width: 768px) {
	.startlogo{display:none;}
	.content, .projekt_content {top:50px; }
	#nav_box{ position:absolute; top:0; bottom:auto;  }
	.btn_navbar, .logo {display:block;}
	.nav_back { position:absolute; left:0; top:0; width:100%; height:40px; background:#fff; -moz-opacity: 0.9; opacity: 0.9; filter:alpha(opacity=90);}
	#main_nav, #service_nav  { position:relative;left:auto; right:auto; background:#333;}
	#nav_box .navigation  {position:relative;top:40px;display:none;}
	.level_1  li { position:relative; list-style:none; height:auto; line-height:30px; font-size:16px; float:none; display:block; text-align:center; }
	.level_1  li a { display:block; padding:0; background:#333; height:30px; color:#fff; text-decoration:none; }
	.level_1  li.trail a { background:#666; color:#fff;}
	.level_1  li.active .level_2 li a, .level_1  li.trail .level_2 li a { color:#fff; background:#333; }
	.level_1  li.active .level_2 li.active a, .level_1  li.trail .level_2 li.active a { color:#333; background:#fff;  }
	.level_1  li a:hover, .level_1  li.active .level_2 li a:hover, .level_1  li.trail .level_2 li a:hover { color:#333; background:#fff; }
	.level_2 { top:0 !important; visibility:visible; position:relative;left:0; text-align:center; display:none;}
	.level_1 li.active .level_2, .level_1 li.trail .level_2 { display:block; padding-bottom:10px; }
	.level_1  li .level_2 li {float: none; width:100%; font-size:12px;}
	.level_1  li .level_2 li a {height:30px;line-height:30px;}
	#nav_2, #nav_3, #nav_4, #nav_5 , #nav_7{ margin-left:0; }
	.scroll-pane {height:auto; position:relative;}
	.jspVerticalBar {display:none;}
	#show_info,#prevslide, #nextslide {right:20px;}
}
@media (max-width: 480px) {
	.content, .projekt_content {width:100%;}
	#close_info {right:20px;}
	.text {width:auto; padding: 5px 20px 0 20px;}
	.scroll-pane {width:100%;}
}