﻿body
{
background-position:0em 0em;
background-attachment: fixed;
background-color: #909AAB;
background-size: 100% auto;
padding:0;
margin:0;
font-family: sans-serif;
font-weight:lighter;
text-transform:uppercase;
font-size:0.7em;
}

a, a:hover, a:focus, a:visited, a:active, a:link
{
color:#0275E8;
font-weight:bold;
text-decoration:none;
border:none;
}

a:hover{color:#1AB8FB;}

b 
{
font-size: 1.5em;
text-decoration: none;
position: relative;
display: inline-block;
margin: 2% 2% 2% 2%;
width: 2%;
height: 3%;
overflow: hidden;
margin-right: 20em;
}

b::before 
{
content: "";
position: absolute;
top: 0em;
left: 0;
bottom: 0em;
width: 1.1em;
height: 0.25em;
border-top: 0.6em double blue;
border-bottom: 0.20em solid blue;
}

nav b 
{
display: block;
padding: 0.5em;
text-decoration: none;
font-weight: bold;
text-align: center;
transition: all .25s ease-in;
    width: 1%;
}

nav b:focus,
nav b:hover,
nav li[aria-current] b:focus,
nav li[aria-current] b:hover 
{
color: darkblue;
background-color: #2e92e8;
}
/*     submenu navigation links      */

nav .submenu 
{
visibility: hidden;
height: 1em;
z-index: 1000;
margin-top: 0;
}

nav .submenu li 
{
display: block;
width: 10em; 
max-width:20em;
border-radius: 2px;
color: #ff00e2;
background-color: #c9c9d9;
transition: all .25s ease-in;
text-align: center;
width: 100%;
top: 1em;
margin-top: -1em;
display: flex;
align-items: center;
justify-content: center;  
}
/**     Show the submenu on hover, focus     **/

nav li:hover .submenu,
nav li:active .submenu,
nav li:focus .submenu 
{
visibility: visible;
height:auto;   
}

nav li:focus-within .submenu 
{
visibility: visible;
height: auto;
}


p{margin:0;}




.two td 
{
list-style-type:none;
font-family: sans-serif;
font-size:0.70em;
font-weight:normal;
color:#ffffff;
width: 1%;
}

li 
{   
list-style-type:none;    
margin-bottom:0%;
}

nav li 
{
margin: 0.5em;
padding: 0;
font-size: 1.1rem;
}

ul
{
margin:0;

letter-spacing: 0.0em;
list-style-type:disc; 
text-align: left;
list-style: none;
padding: 0;
display: flex;
flex-direction: column;
}

li#Navi
{
margin:-5px 10px 0 0.5%;
float:left;
letter-spacing: 0.1em;
}

ul#Navi
{
list-style:none;
margin:0;
line-height: 180%;
}

#content_container 
{
height:95%;
overflow:auto;
}

#footer 
{
background:rgba(0, 0, 0, 0.8);
position:fixed; 
width:100%;
bottom: 0;
z-index:1;
}

.ktext
{
font-family: sans-serif;
font-size:1.0em;
font-weight:normal;
color:#ffffff;
}


.ltext
{
font-family: sans-serif;
//font-size:1.5em;
font-weight:normal;
color:#000;
text-shadow:1px 1px 1px rgba(0,0,0,0.5);
margin-right:0; 
margin-left:0;
max-width:100%;
}

.ntext
{
font-family: sans-serif;
text-align:justify;
text-transform:none;
font-size:1.5em;
font-weight:normal;
color:#000;
margin-right:50; 
margin-left:50;
}

.rtext
{
text-align:center;
font-family: sans-serif;
font-size:1em;
font-weight:normal;
color:#fff;
text-shadow:1px 1px 1px rgba(0,0,0,0.5);
margin-right:50; 
margin-left:50;
}

.stext
{
text-align:justify;
text-transform:none;
font-size:1.1em;
font-weight:normal;
color:#000;
display: block;
margin-left:50;
}

.ttext
{
font-family: sans-serif;
text-align:justify;
text-transform:none;
font-size:1.5em;
font-weight:normal;
color:#fff;
margin-right:50; 
margin-left:50;
}

.atext
{
font-family: sans-serif;
text-align:center;
font-size:1.3em;
font-weight:bold;
color:#000;
text-shadow:1px 1px 1px rgba(0,0,0,0.5);
}

.index_text
{
text-transform:none;
font-size:1.1em;
font-weight:normal;
color:#000;
margin: 0px auto;
}

#container 
{
	margin: 0 auto;
}

#content {padding:0;}

#main {  }

#sidebar {  }




@media screen and (min-width:1024px) 
{

	#content 
    {
		display:-webkit-flex;
		display:flex;
	}
	
	#main 
    {
		-webkit-flex:2;
		flex:2;	
		-webkit-order:2;
		order:2;
        margin-right:0; 
        margin-left:0;   
	}
	
	#sidebar 
    {
		-webkit-flex:1;
		flex:1;	
		-webkit-order:3;
		order:3;
	} 
    
}

@media (min-width: 45em) 
{
    nav ul 
    {	
        flex-direction: row;  
    }
    nav li 
    {
        font-size: 1em;
    }  
    .rtext
    {
        font-size:1.5em;
    }
    .ltext
    {
        margin-right:25; 
        margin-left:25;
        font-size:1.2em;
    }
    div#vor_bilder
    {
        margin-left: 1em; 
        margin-right: 1em; 
    }
   
    
 
}

@viewport
{
    zoom: 1.0;
    width: device-width;
    margin-right:0; 
    margin-left:0;
}


#box0 
{ 	
position: absolute;        
right: 0px; 
top: 0px;
max-width: 40%; 
max-height: 40%; 
}

#box1 
{ 	
position: absolute;        
right: 50px; 
top: 170px;
max-width: 40%; 
max-height: 40%; 
}

#box2 
{ 
position: absolute;        
right: 50px; 
top: 800px;
max-width: 40%; 
max-height: 40%; 
}

#box3 
{ 	
position: absolute;        
right: 50px; 
top: 1430px;
max-width: 40%; 
max-height: 40%; 
}

#box4 
{ 
position: absolute;        
right: 50px; 
top: 2060px;
max-width: 40%; 
max-height: 40%; 
}

#box5 
{ 	
position: absolute;        
right: 10%; 
top: 170px;
max-width: 30%; 
max-height: 30%; 
}

#box6 
{ 	
position: absolute;        
left: 50px; 
top: 170px;
max-width: 40%; 
}

#box_presse_1 
{ 
position: absolute;        
left: 50px; 
top: 170px;
max-width: 20%; 
max-height: 20%;
}

#box_presse_2 
{ 
position: absolute;        
top: 170px;
left: 39%;
max-width: 20%; 
max-height: 20%;
}

#box_presse_3 
{ 
position: absolute;        
right: 50px; 
top: 170px;
max-width: 20%; 
max-height: 20%;
}

.bild_beschriftung 
{
z-index:1;
position: relative;
}

.bild_beschriftung img 
{
display: block;
}

.bild_beschriftung span
{
background-color: hsla(0, 0%, 100%, 0.5);
position: absolute;
bottom: 15;
width: 100%;
line-height: 2em;
text-align: center;
font-weight: normal;
color:#fff;
font-size:1.2em; 
}

.bild_beschriftung_index 
{
z-index:1;
position: relative;
width: 11.7em; 
padding-top: 10px; 
}

.bild_beschriftung_index img 
{
display: block;
}

.bild_beschriftung_index span
{
background-color: hsla(0, 0%, 100%, 0.5);
position: absolute;
bottom: 0;
width: 100%;
line-height: 2em;
text-align: center;
font-weight: normal;
color:#fff;
font-size:1.2em; 
}

.bild_beschriftung_zer 
{
z-index:1;
position: relative;
    
}

.bild_beschriftung_zer img 
{
display: block;
height:300;
}

.bild_beschriftung_zer span
{
background-color: hsla(0, 0%, 100%, 0.8);
position: absolute;
bottom: 0;
width: 216px;
line-height: 2em;
text-align: center;
font-weight: normal;
color:#000;
font-size:1em; 
}

.bild_beschriftung_partner 
{
z-index:1;
position: relative;
}

.bild_beschriftung_partner  img 
{
display: block;
}

.bild_beschriftung_partner  span
{
background-color: hsla(0, 0%, 100%, 0.8);
position: absolute;
bottom: 0;
width: 300px;
line-height: 2em;
text-align: center;
font-weight: normal;
color:#000;
font-size:0.66emem; 
}

.bild_beschriftung_auszeichnung span
{
z-index:10;
background-color: hsla(140, 100%, 50%, 0.5);
left:82%;
top: 5%;
height: 35%;
width: 18%;
font-weight: bold;
font-size:0.8em; 
}

.bild_beschriftung_auszeichnung_liste span
{
background-color: hsla(140, 100%, 50%, 0.5);
position: absolute;
width: 60px;
line-height: 2em;
text-align: center;
font-weight: bold;
color:#fff;
font-size:0.66em; 
margin: -168px 0 0 49px;
}

.bild_beschriftung_auszeichnung_liste_2 span
{
background-color: hsla(140, 100%, 50%, 0.5);
position: absolute;
width: 60px;
line-height: 2em;
text-align: center;
font-weight: bold;
color:#fff;
font-size:0.66em; 
margin: -295px 0 0 49px;
}

div#vor_bilder
{
float:left;
padding-top: 1em;
padding-bottom: 1em;
margin-right: 0; 
}

div#vor_bilder_index
{
padding-top: 0;
padding-bottom: 0;
padding-right: 0; 
margin-left: 0; 
}

.zentriert 
{
text-align: center;
}


#menu-bar 
{
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
box-shadow: 0px 0px 0px #666666;
border: solid 0px #6D6D6D;
z-index:999;
}

#menu-bar li 
{
float: left;
position: relative;
list-style: none;
}

#menu-bar a 
{
font-weight: bold;
font-size: 1.1em;
color: #0a0a0a;
text-decoration: none;
padding: 14px 30px 14px 30px;
}

#menu-bar li ul li a 
{
margin: 0;
}

#menu-bar .active a, 
#menu-bar li:hover > a 
{
background: #0399D4;
color: #FFFFFF;
border-radius: 4px;
-webkit-border-radius: 0;
-moz-border-radius: 0;
text-shadow: 2px 2px 3px #FFFFFF;
width: 100%;
}

#menu-bar ul a:hover ,
{
background: #0399D4 !important;
background: linear-gradient(top,  #04ACEC,  #0186BA) !important;
background: -ms-linear-gradient(top,  #04ACEC,  #0186BA) !important;
background: -webkit-gradient(linear, left top, left bottom, from(#04ACEC), to(#0186BA)) !important;
background: -moz-linear-gradient(top,  #04ACEC,  #0186BA) !important;
color: #FFFFFF !important;
border-radius: 4px;
-webkit-border-radius: 0;
-moz-border-radius: 0;
text-shadow: 2px 2px 3px #FFFFFF;
width: 100%;
    z-index:1;
}

#menu-bar li:hover > ul 
{
display: block;
}

#menu-bar ul 
{
display: none;
margin: 0;
padding: 0;
width: 100%;
position: absolute;
top: 30px;
left: 0;
    z-index:1;
}

#menu-bar ul li 
{
float: none;
margin: 0;
padding: 0;
}

#menu-bar ul a 
{
color:#424242 !important;
    z-index:1;
}

#menu-bar:after 
{
content: ".";
display: block;
clear: both;
line-height: 0;
height: 0; 
}

html[xmlns] #menu-bar 
{
display: block;
}

* html #menu-bar 
{
height: 10%;
}