@charset "UTF-8";
/* CSS Document */
* {
	padding:0;
	margin-bottom: 0%;
}
.hell{
	font-family:  'Helvetica', sans-serif;
	font-size:100%;
	min-font-size: 8px;
	max-font-size: 16px;
	letter-spacing:auto;
	text-align:left;
	margin-top:4%;
	margin-left:4%;
	margin-right:10%;
	}
.klill_kasten {
	font-family:  'Helvetica', sans-serif;
	font-size:0.85em;
	min-font-size: 5px;
	max-font-size: 10px;
	letter-spacing:auto;
	text-align:left;
	margin-left:4%;
	margin-bottom:20px;
	}


#kleinerteil {
	width:30%;
	height:300px; 
	float:left;
	}
#liniedown { 
	width:5%; 
	height:300px; 
	background-image:url(../images/strichhoch.png); 
	background-repeat:no-repeat; 
	background-size:100%; 
	float:left;
	}
#linieq {
	width:40%; 
	height:5vw; 
	max-height:51px; 
	background-image:url(../images/unliobre.png); 
	background-repeat:no-repeat; 
	background-size:100% 100%; 
	float:left;
	 }

#grteil {
	width:65%; 
	height:300px; 
	float:left;
	}
#platzh {
	width:30%; 
	height:5vw; 
	max-height:51px; 
	float:left;
	}
	
#linieq1 {
	width:40%; 
	height:5vw; 
	max-height:51px; 
	background-image:url(../images/obliunre.png); 
	background-repeat:no-repeat; 
	background-size:100% 100%; 
	float:left;
	}
	
#nebenquerstrich {
 	width:36vw;
	float:left;}
#newsbox{
	width:40%;
	height:40%;
	max-height: 120px;
	min-height: 40px;
	overflow:auto;
	}
#textbox{ 
	width:600px;
	height:600px;
    color:#ffffff;
	z-index:1;
	}

/*für Videos*/


.videoaus  {
	left:60%;
	top:15%;
	position: absolute;
	z-index:4;
	}

#MeinDiv{
  	background-color:black;
	width:600px;
	height:600px;
	}
#lauftext{font-family: 'Helvetica', sans-serif;}
#balken{ 
	width:auto;
	height:auto;
	float:left;
	}
#projects{
	width:auto;
	height:40px;
	float:left;
	background-color:white;
	}
#freeworks{
	width:auto;
	height:auto;
	float:left;
	}
#me{
	width:auto;
	height:auto;
	float:left;
	}
#seite {
	width:100%;
	height:100%;
	margin-left:auto;
	margin-right:auto;
	position:absolute;
	}
#outer-wrap {
    width: 680px; 
    height: 440px;
    margin:0;
   	overflow-x:scroll;
	overflow-style:scrollbar; 
}
#inner-wrap {
	height:400px;
    float:left;
    margin-right:-999em;
    padding-left:20px;
}
.floatbox {
    float:left; /*force into block level for dimensions*/
    width:600px;
    height:400px;
    margin:10px 40px 0 0;
}
.float{
    float:left; /*force into block level for dimensions*/
    width:600px;
    height:400px;
    margin:10px 30px 0 0;
}

html>body #header{position:fixed;
	} 


#brimborium {
	width:680px;
	height:440px;
	margin-top:80px; 
}


#detailback{width:1024px;
			height: 768px;
			margin-top:0px;
			}
			

#hintergrundnord{
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-image:url(../images/norden/background.JPG);
  background-repeat:no-repeat;
  background-size:cover;
  
}
#frontnord{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}






@media only screen and (max-height: 954px) { 
#menu #primary_nav_wrap ul li ul li p { 
    display: none; 
  } 
}
@media only screen and (max-width: 439px) { 
#menu #primary_nav_wrap ul li { 
	position:relative;
	float:left;
	width:25vw;
	
  } 
}

/*allles in Wunderschöner Ordnung in der CSS -> zur Erklärung
DiVs IDS (Alphabetisch sortiert 		/*Buchstabe für Ort der Anwendung*/

/* ----------DIVS & IDs für VIDEOANZEIGE (EINZELNES FENSTER) === V------------------------*/

/* ----------DIVS & IDs für ICH (EINZELNES FENSTER)			 === I------------------------*/
body{height:100%;
	margin-top:0px;
	margin-bottom:0px;
	margin-left:0px;
	width:100%;
    overflow:hidden;
	font-family: 'Helvetica', sans-serif;
	}							/*I*/
.button{  
   		float:left; 
   		height:8vmin; 
   		width:8vmin;
  		max-height:50px;
  		max-width:50px;
				} 						/*V*/
#containingBlock{
	width: 80%;
	max-width: 350px;
	position: relative;
}				/*V*/  
.hintergrund{
  position: absolute;
  width: 100%;
  height:100%;
  z-index: 1;
	}					/*I*/
#header {height:30%;
	   min-height:95px;
	   max-height:135px;
	width:100%;
	margin-left:auto;
	margin-top:auto;
	float:left;
	position:relativ;
    z-index: 98;
	}			/*M*/
#helr{	position:absolute; 
		overflow:hidden;
		bottom:0.2em; 
		font:'Helvetica', sans-serif; 
		font-size:small; 
		text-align:right; 
		right:0.2em; 
		z-index:3;}						/*I*/
#home{	margin-top:55%; 
		margin-left:75vmin;
		background-image:url(../images/symbole/home-1.png); 
   		background-repeat:no-repeat;  
   		background-size:100% auto;
			}							/*V*/
#home:hover{
			background-image:url(../images/symbole/home-2.png);
   			background-repeat:no-repeat;  
   			background-size:100% auto;
			}					/*V*/
#ich{
  position:absolute;
  bottom:0;
  right:0;
  width:50vw;
  height:50vh;
  max-width:50vh;
  max-height:50vw;
  background-image:url(../images/lauf.png);
  background-repeat:no-repeat;
  background-size:100% 100%;
  background-position:bottom right;
}							/*I*/
#info{	
		margin-top:55%; 
		background-image:url(../images/symbole/hide.png); 
		background-repeat:no-repeat;
		background-size:100% auto;
			}						/*V*/
#info:hover{
			background-image:url(../images/symbole/see.png);
   			background-repeat:no-repeat;  
   			background-size:100% auto;
			}					/*V*/
#infoaus:hover{
			background-image:url(../images/symbole/watch2.png);
   			background-repeat:no-repeat;  
   			background-size:100% auto;
			}				/*V*/
#infoaus{
		position:absolute;
		margin-top:12%;
		margin-left:70%;
		z-index:2;
		background-image:url(../images/symbole/watch.png); 
   		background-repeat:no-repeat;  
   		background-size:100% auto;
		}						/*V*/
#jura{	
		margin-top:55%; 
		margin-left:55vmin;
		background-image: url(../images/symbole/jura.png); 
   		background-repeat:no-repeat;  
   		background-size:100% auto;
			}						/*V*/
#jura:hover{
			background-image:url(../images/symbole/jura1.png);
   			background-repeat:no-repeat;  
   			background-size:100% auto;
			}					/*V*/
.klickzone{
			display:block;
			width:100%; 
			height: 100%;
			}					/*V*/
#logo {height:100%;
	   min-height:95px; 
	   width:auto;
	   background-image:url(../images/header1.png);
	   background-size:auto 100%;
	   background-repeat:no-repeat; 
	   }			/*M*/
#menu {
	width:100%;
	height:100%;
	min-height:12px;
	min-width:400px;
	max-height:36px;
	position:fixed;
	float:left;
	margin-left:auto;
	margin-top:auto;
	position:relativ;
    z-index: 99;
 	margin-top:0px;
	font-family:  'Helvetica', sans-serif;
	font-height: 0.64ep;
	}			/*M*/
.textdrin {
	width:50%; 
	height: 60%; 
	position: absolute; 
	top: 50%; 
	left: 45%; 
	transform: translateX(-50%)
	translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	color:#FFF; 
	}					/*V*/
.textwindow{
	width: 80vw; 
	height: 80vh; 
	padding-top:5vh;
	min-height:200px; 
	position: absolute; 
	top: 50%; 
	transform: translateY(-50%); 
	-webkit-transform: translateY(-50%);
	margin-left:10vw;
	background:url(../images/popup.png);
	background-size: 100% 100%;
	background-repeat:no-repeat;
	}					/*V*/

#menu a:hover, .topmenu.on a {
	color:#c11d1d;
	background-color:#FFF !important;
}			/*M*/
.videoWrapper div,						/*V*/
.videoWrapper embed, 					/*V*/
.videoWrapper object{
  		position:absolute;
  		width:100%;
 		height:100%;
  		left:0;
 		top:0;
		}			/*V*/
.videoWrapper{
	position: relative;
	padding-top: 10%;
	padding-bottom: 56.25%;
	height: 0;
	}				/*V*/
* html .videoWrapper{
	margin-bot\tom: 0;
	}				/*V*/
#primary_nav_wrap
{ margin-top:0px;
  width:100%;
  min-width:50px;
  max-width:540px;
  text-align:center;
  float:right;
  z-index:1;
  font-height: 0.64ep;
}			/*M*/

#primary_nav_wrap ul
{	list-style:none;
	position:relative;
	float:right;
	margin:0;
	padding:0;
}			/*M*/

#primary_nav_wrap ul a
{
  display:block;
  padding:2px 5px;
  border:1px solid #000;
  border-collapse:collapse;
  color:#ffffff;
  font-weight: normal;
  text-decoration:none;
  background-color:#000000;
  margin:0; 	
  z-index:2; 
}			/*M*/
/*perm.menu*/
#primary_nav_wrap ul li
{
	position:relative;
	float:left;
	width:110px;
  	text-align:center;
	padding:0;	
 	z-index:3;
}			/*M*/

#primary_nav_wrap ul li.current-menu-item
{
	background:#000;
}			/*M*/

#primary_nav_wrap ul li:hover
{
	background:#FFF;
}
/*blöcke 1 Instanz*/			/*M*/
#primary_nav_wrap ul ul
{
	display:none;
	position:absolute;
	top:100%;
	right:0px;
	background:#000;
	padding:0;
	max-height:100%;
}			/*M*/

#primary_nav_wrap ul ul li
{	float:none;
	width:100%;
	min-width:100px;
	max-width:200px;
	z-index:2;
	padding:1px;
}			/*M*/

#primary_nav_wrap ul ul a
{
	line-height:120%;
	padding:10px 15px;
}			/*M*/
/*DIV.container {
    min-height: 10em;
    display: table-cell;
    vertical-align: middle }
	*/
#primary_nav_wrap ul ul ul
{
	top:0;
	right:100%
}			/*M*/

#primary_nav_wrap ul li:hover > ul
{
	display:block;
	background-color:#FFF;
}			/*M*/	
.topmenu a, .submenu a{
  padding:1px 5px;
  border:1px solid #000000;
  border-collapse:collapse;
  font-weight: small;
  text-decoration:none;
  background-color:#000000;
  margin:0;  
}			/*M*/
.videoan{
		  width:100vw; 
		  max-width:140vh; 
		  height:100vh; 
		  max-height:57vw; 
		  margin-left:auto; 
		  margin-right:auto; 
		  margin-top:1%;
		  padding-left:10%;
		  }							/*V*/
.vorhintergrund{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  z-index: 2;
	}				/*I*/