html, body, h1, h2, p, ul, div {
	margin:0px; 
	padding:0px;
}

html {
	margin:1%;
}

body {
	margin:0% auto;
	background-color:#ffffff;
	height:100%;
}

#logo{
	position:fixed;
	width:25%;
	margin-top:1%;
	margin-left:10%;
}

#logo img{
	width:50%;
	height:50%;
}



/* B A N N E R */

#banner {
	background-color:#ffffff;
	padding:1% 0% 1% 1%;
	margin:0% auto;
	width:50%;
	margin-bottom:2em;;
}

#banner a{
	color:#3399cc;
	font-size: 3em;
}

#banner h1{
	text-align:center;
}

#banner h2{
	margin-bottom:1em;
	text-align:center;
}







/* N A V I G A T I O N */
#navigation{
	position:fixed;
	float:left;
	margin-left:10%;
	font-size:1.5em;

}

#navigation a{
	text-decoration:none;
	color:#ffffff;
	display: block;
	padding:0.5em;
}

#navigation li{	
	list-style-type:none;	
	margin: 2px;
	background-color:#696969;	
}

#navigation a:hover{
	text-decoration:underline;
}

#navigation li:hover{
	background-color:#3399cc;
}


/* T O T O P */
#up{
	margin-left:80%;
	position:fixed;
	bottom: 0%;
}

#totop{
	margin-left:75%;
	position:fixed;
	bottom: 1%;
}


#totop a{
	color:#000000;
}

#totop a:hover{
	color:#3399cc;
}






/* W R A P P E R */

#wrapper {
	background-color:#ffffff;
	font-family:Arial;
	font-size:1.0em;
	margin:0% auto;
	width:50%;
}


/* C O N T E N T */

#content h2{
	border-bottom: 3px solid #696969;
	margin-bottom:0.5em;
	font-size:2.2em;
}

#content h3{
	margin-top: 4%;
	margin-left: 2.5%;
}

#content h4{
	margin-left: 8.5%;
}

#content p{
	margin:3% 25% 0% 5%;
	text-align:justify;
}

#content video{
	margin:3% 25% 5% 5%;
	width:85%;
}

#content ul{
	margin:0% 25% 0% 5%;
}

#content ol{
	margin:0% 25% 0% 5%;
}

#content li{
	margin-top:1em;
	margin-left:5%;
}

#content img{
	margin-left:10%;
	width:55%;
	height:55%;
}


/* F O O T E R */

#footer {
	text-align:right;
	margin-top:3%;
	border-top: 3px solid #696969;
	padding-right:2%;
	font-size:1.4em;
	color:#000000;
}

#footer a{
    text-decoration:none;
	font-size: 0.8em;
	color:#696969;	
}

#footer a:hover{
	text-decoration:underline;
	color:#3399cc;
}

.impressum{
	font-family:Arial;
	font-size:0.8em;
	color:#3399cc;
}

h2:target {
	-webkit-animation: mymove 3s;
    animation: mymove 3s;
}

@-webkit-keyframes mymove {
    0%   {color: #000000;width: 5%;}
	25%  {color: #3399cc;width: 100%;}
	75%  {color: #3399cc;}
    100% {color: #000000;}
}

@keyframes mymove {
    0%   {color: #000000;width: 5%;}
	25%  {color: #3399cc;width: 100%;}
	75%  {color: #3399cc;width: 100%;}
    100% {color: #000000;width: 100%;}
}

@media (min-width:1701px){
	#up{
		display:none;
	}
	
	#comment{
		width:75%;
		text-align:left;
	}
}


@media (min-width:901px) and (max-width:1700px) {
	#logo{
		margin-left:0%;
	}
	
	#logo img{
		width:70%;
		height:70%;
	}
	
	#wrapper{
		width:70%;
		margin-right:10%;
		
	}
	

	
	
	
	
	/***BANNER****/

	#banner{
		font-size:0.6em;
		width:70%;
		margin-right:10%;
		
	}

	/***NAVIGATION****/

	#navigation{
		margin-left:0%;
		width:17%;
	}

	#totop{
	margin-left:89%;
	}

	#up{
		display:none;
	}
	
	#comment{
		width:75%;
		text-align:left;
	}
	
	#content img{
	margin-left:10%;
	width:80%;
	height:80%;
	}
	
}


@media (max-width:900px){
	#logo{
		display:none;
	}

	#wrapper{
		width:95%;
	}

	/***BANNER****/

	#banner{
		font-size:0.5em;
		width:100%;
		
	}

	/***NAVIGATION****/

	#navigation{
		position:relative;
		padding:0%;
		float:none;
		width:98%;
		margin:0%;
		margin-bottom:1em;
	}

	#navigation a{
		text-align:center;
	}

	
	
	/***TOTOP***/
	
	#totop{
		display:none;
	}

	#up img{
	width:60%;
	height:60%;
	}


	/****CONTENT****/

	#content{
		padding:0%;
		margin:0%;
		width: 100%;
	}
	
	#content video{
		width: 90%;
		margin-right:0;
	}
	
	#content h2{
		font-size:1.5em;
	}
	
	#content h3{
		margin-top:2em;
	}
	
	#content h4{
		margin-left:5%;
	}
	
	#content p{
		margin-left:2.5%;
		width: 95%;
		text-align:justify;
	}
	
	#content ul{
		width:85%;
	}

	#content ol{
		width:85%;
		margin-left:0%;
	}
	
	#content img{
	margin-left:0%;
	width:100%;
	height:100%;
	}
	
	#comment{
		width:100%;
	}
	
	#footer a{
		float:left;
		margin-bottom:5.5%;
	}

	.impressum{
		float:left;
		margin-bottom:5.5%;
	}
}


/****PRINT****/

@media print{	
	#up{
		display:none;
	}

	#banner a{
		font-size:3.5em;
		color:#000000;
		text-align:center;
		font-weight:bold;
		text-decoration:underline;
	}

	#navigation{
		display:none;
	}

	#content{
		font-size: 12pt; 
		color:#000000;
		width:100%;
		margin:0;
		padding:0; 
	}

	#content video{
		display:none;
	}
	
	#content a{
		display:none;
	}
	
	#video{
		display:none;
	}
	
	#content h3{
		display:none;
	}

	#content form{
		display:none;
	}
	
	.print{
		display:none;
	}
	
	#footer{
		display:none;
	}
}