@charset "utf-8";
/* Einfache fließende Medien
   Hinweis: Für fließende Medien müssen Sie die Attribute 'height' und 'width' des Medium aus dem HTML-Code entfernen
   http://www.alistapart.com/articles/fluid-images/ 
*/

img, object, embed, video, audio {
	max-width: 100%;
	margin-top: 8px;
	margin-right: auto;
	margin-left: 5px;
}
/* IE 6 unterstützt keine maximale Breite, verwenden Sie daher eine Standardbreite von 100% */
.ie6 img {
	width:100%;
}

/*
----------------------------------------------------------------------------
ALLGEMEINE STYLES
---------------------------------------------------------------------------

 /*Textfarbe*/
.red {color:#EC4E4E; }
.red-big {color:#EC4E4E;font-size:1.2em; }
.big {font-size:1.2em;}
.h2weiss { 
	color:#FFF;
	font-size:0.6em;
	float:right;
	line-hight:0;
	margin-top:15px;
}

/*Text-Hintergrund*/
.text-hg{background: #000; border-radius: 5px;}

.flrt{float:right;}
.fllt{float:left; margin: 0 5px 5px 0;}
 
 /*Bilder*/
 .block {display:block; }
.flag {padding-left:20px;}
.picmobil{width:100%;}

 h1,h2{ font-size: 1.6em;font-weight:600; color:#fff; margin-left: 10px; margin-bottom: 0px; margin-top: 0px; text-transform:uppercase;
} 

h3,h4{ font-size: 1.1em; color:#fff; margin-left: 20px; margin-top: 25px; margin-bottom:0px; font-weight:600;text-transform:uppercase;

}

p{ padding:5px 20px; line-height:22px; font-size:1.1em; font-weight:100; text-align:justify; 
}

 a {color:#EC4E4E; text-decoration:none;outline:none; }
 a:active {color:#EC4E4E; text-decoration:none;outline:none; }
 a:hover {color:#FFF;outline:none;}
 
dl {color:#fff; margin-left:10px; margin-bottom:30px;}
dt {padding-left:20px;} 
dd {color:#fff; margin-left:0;}

audio { vertical-align: middle;}

.boxstyle_music { margin-bottom:10px; margin-top: 15px; background:rgba(0,0,0,.4);}

/* Layout für Mobilgeräte: 480 px oder weniger. */
body{  background:#000 ;
font-family:'Lato', Verdana, Geneva,sans-serif; color:#fff;
}
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	/*width: 86.45%;*/
	width: 99%;
	/*padding-left: 2.275%;
	padding-right: 2.275%; */
	padding-left: 0;
	padding-right:0;
	padding-top: 0px;
	padding-bottom:5px;
	font-size: 0.8em;
	/*border-left:#333 1px solid;
	border-right:#333 1px solid;*/
	background: rgba(0,0,0,.5);
}
header{
	clear:both;
	width:100%;
	min-height:16%;
	margin-left: auto;
	margin-right: 0;
	margin-top:0;
	background:#000;
	z-index:1;
	position:fixed;
	background-attachment:fixed;
}
header h1{ font-size: 18px; color:#C00; display:none;
	}
header h2{font-size:3em;font-weight:300;color:#EC4E4E;margin-top:7px;margin-right:50px;float:right;display:none;}
header h3{font-size:3em;font-weight:300;color:#EC4E4E;margin-top:7px;margin-right:20px;float:right;}
header h4{ 
	color:#FFF;
	font-size:1.5em;
	margin-top:5px;
	margin-right:20px;
	float:right;
}

nav{ background: none; margin:0; clear:both;padding-top:1px; padding-bottom:1px;margin-bottom:5px;background-attachment:fixed;
}
nav ul{ list-style:none; font-size:1.4em;font-weight:100;line-height:10px; text-transform:uppercase; padding-left: 25px;
}
nav ul li{float:none;}
nav ul li a{ color:#FFF; text-decoration:none; padding: 0 8px  0 0; 
}
nav ul li a:active{ color:#EC4E4E; text-decoration:none; padding: 0 8px  0 0; 
}
nav ul li a:hover{ color:#EC4E4E; text-decoration:none; padding: 0 8px  0 0; 
}

#content {
	float: left;
	margin-top:5px;
	margin-bottom:5px;
	margin-left: 0;
	width: 100%;
	display: block;
	background: rgba(255,255,255,.1);
	margin-top:20%;
}

#boxre h1{ font-size: 3.0em;font-weight:300; color:#fff; padding-left: 10px; margin-bottom: 5px; margin-top: 0px; text-transform:uppercase;
}
#boxre h2{ font-size: 1.5em;font-weight:300; color:#fff; padding-left: 10px; margin-bottom: 5px; margin-top: 0px; text-transform:uppercase;
}
#boxre{ width: 100%;float:left; padding: 5px 0; margin-right:5px; 
background:#000;}

#boxre p{
padding-bottom:15px; padding-top:0px;margin-top:0px; text-align:start; font-size:1.1em;
}

#boxre p:first-child{padding:0px;}

#boxre img {
	max-width: 100%;
	margin-top: 0px;
	margin-right: auto;
	margin-left: 0px;
}
#link_outside {border-top:#666 1px solid;}
.link_left {width:35%; float:left;margin-left: 20px;}
.link_left ul, .link_right ul{padding-left:0px;}
.link_left ul li, .link_right ul li {list-style:none;padding-bottom:8px;}
.link_right {width:35%; float:left;padding-left:20px;}
video{ padding:1px; width:96%;background: rgba(250,208,201,.1);  
}
#boxre dl{margin:10px;}
.footer_outside {background:#000;  margin:0; clear:both;
		padding-top:4px; padding-bottom:4px;}
.footer_right { width:35%;float:left;
}
.footer_right ul {line-height:30px;}

.footer_left ul{ list-style:none; font-size:1.0em; text-transform:uppercase; margin: 0; line-height:30px;
}
.footer_right ul li a{ color:#fff; text-decoration:none; padding: 0 12px  0 0;
}
.footer_right ul{ list-style:none; font-size:12px; text-transform:uppercase; margin: 0;
}
.footer_left ul li a{ color:#fff; text-decoration:none; padding: 0 12px  0 0;
}
.footer_right ul li a:hover{color:#EC4E4E;padding: 0 12px  0 0;}
.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}
audio { margin:0px 0 0px 5px; width:350px;}




/* Layout für Tablet-PCs: 481 bis 768 px. Erbt Stile vom: Layout für Mobilgeräte. */

@media only screen and (min-width: 481px) {
	
.gridContainer {
	width: 100%;
	/*padding-left: 1.1625%;
	padding-right: 1.1625%; */ 
	padding-left: 0;
	padding-right: 0;
  	background: rgba(0,0,0,0);
}
header{min-height:auto;}
header h2{font-size:4em;margin-left:20px;float:none;border-bottom:rgba(255, 255, 255, 0.2) 1px solid;display:block;}
header h3{display:none;}
header h4{display:none;}
nav{margin-bottom:0px;}
nav ul{ font-size:1.4em; height:1.0em; 
}
nav ul li{float:left;}
nav ul li a{ padding: 0 15px  0 0; 
}
nav ul li a:active{ color:#EC4E4E; text-decoration:none; padding: 0 15px  0 0; 
}
nav ul li a:hover{ color:#EC4E4E; text-decoration:none; padding: 0 15px  0 0; 
}
#content {background:none;}
#boxre h1{font-size:3.0em;}
#boxre{ width: 50%; float:right; margin-right: 20px; border-left:rgba(0, 0, 0, .2) 1px solid; background: rgba(255,255,255,.1); 
}
#boxre p:first-child {display:none;}
#boxre img {
	max-width: 100%;
	margin-top: 8px;
	margin-right: auto;
	margin-left: 5px;
}
#boxre > img {display:none;}
#link_outside { margin-right: 10px;}
.footer_outside {background:none;  margin:0; clear:both;
		padding-top:4px; padding-bottom:4px;}
.footer_right { width:90%;float:right;margin-right:10px;
}
.footer_right ul{float:right;}
.footer_right ul li{ display:inline;
}


/* Desktoplayout: 769 bis maximal 1232 px.  Erbt Stile von: den Layouts für Mobilgeräte und Tablet-PCs. */

@media only screen and (min-width: 769px) {
.gridContainer {
	width: 100%;
	padding-left: 0;
	padding-right: 0;
	margin: auto;
}
#content{ margin-top:8px;
}
#boxre h1{ margin-bottom: 10px;
}
#link_outside { margin-right: 20px;}
.footer_left { width:50%;float:left;
}
.footer_right { margin-right:100px;
}
nav ul{ font-size:1.6em; 
}
nav ul li{ display:inline; 
}
nav ul li a{ padding: 0 15px  0 0; 
}
#boxre{ float:right; width: 40%; margin-right:100px; padding-top:12px; margin-top:14%;
}
#boxre video{ margin-left:10px;}
audio { margin:0px 0 0px 40px; width:400px; }
}
