@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/roboto-v18-latin-100.eot'); 
  src: local('Roboto thin'), local('Roboto-thin'),
  	url('fonts/roboto-v18-latin-100.eot?#iefix') format('embedded-opentype'), 
       url('fonts/roboto-v18-latin-100.woff2') format('woff2'), 
       url('fonts/roboto-v18-latin-100.woff') format('woff'), 
       url('fonts/roboto-v18-latin-100.ttf') format('truetype'), 
       url('fonts/roboto-v18-latin-100.svg#Roboto') format('svg');        
}
/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/roboto-v18-latin-300.eot');
  src: local('Roboto Light'), local('Roboto-Light'),
       url('fonts/roboto-v18-latin-300.eot?#iefix') format('embedded-opentype'), 
       url('fonts/roboto-v18-latin-300.woff2') format('woff2'), 
       url('fonts/roboto-v18-latin-300.woff') format('woff'), 
       url('fonts/roboto-v18-latin-300.ttf') format('truetype'), 
       url('fonts/roboto-v18-latin-300.svg#Roboto') format('svg'); 
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/roboto-v18-latin-900.eot');
  src: local('Roboto Bold'), local('Roboto-bold'),
       url('fonts/roboto-v18-latin-900.eot?#iefix') format('embedded-opentype'), 
       url('fonts/roboto-v18-latin-900.woff2') format('woff2'), 
       url('fonts/roboto-v18-latin-900.woff') format('woff'), 
       url('fonts/roboto-v18-latin-900.ttf') format('truetype'), 
       url('fonts/roboto-v18-latin-900.svg#Roboto') format('svg'); 
}

/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/roboto-v18-latin-regular.eot');
  src: local('Roboto'), local('Roboto-Regular'),
       url('fonts/roboto-v18-latin-regular.eot?#iefix') format('embedded-opentype'), 
       url('fonts/roboto-v18-latin-regular.woff2') format('woff2'), 
       url('fonts/roboto-v18-latin-regular.woff') format('woff'), 
       url('fonts/roboto-v18-latin-regular.ttf') format('truetype'), 
       url('fonts/roboto-v18-latin-regular.svg#Roboto') format('svg'); 
}

.schriften{
font-weight: 100; 
font-weight: 300; 
font-weight: 400; 
}

html {
width: 100%; 
height: 100%;  
padding: 0px; 
margin: 0px; 
}

body {
background-color: #000000; 
font-family: 'Roboto', sans-serif;
font-size: 1em; 
font-weight: 100; 
line-height: 1.5em; 
width: 100%; 
height: 100%; 
padding: 0px; 
margin: 0px; 
}
/*background-image: url(images/sys/background_2.jpg);
background-repeat: repeat-x;
background-attachment: fixed; 
background-position: bottom; */


.responsive{
display: none; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
position: relative; 
top: 0px; 
margin: 0px; 

}
ul.responsive{
width: 70%; 
padding: 50px 15% 0px 15%; 
list-style-type: none; 
background-image: url(images/sys/nav_resp.png);
background-position: 90% 7px;
background-repeat: no-repeat;
background-size: auto 40px; 
}
ul.responsive li{
display: block; 
width: 100%; 
}
ul.responsive li a:link, ul.responsive li a:visited{
text-decoration: none; 
color: #000000; 
font-weight: 500; 
padding: 10px 0px 10px 0px; 
display: block; 
width: 100%; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
}

ul.responsive li a:hover, ul.responsive li a:focus{
color: #BFD5E3; 
}


ul.nav{
margin: 0px; 
padding: 0px 15% 0px 15%; 
/*display: table; 
table-layout: fixed; */
width: 70%; 
height: 70px; 
list-style-type: none; 
background-image: url(images/sys/eab033.png);
background-repeat: repeat;
}
ul.nav li{
height: 70px; 
float: left; 
padding: 0px 0px 0px 0px; 
margin: 0px; 
}
ul.nav li a{
color: #FFFFFF; 
text-decoration: none; 
font-weight: 400;
font-size: 1.3em; 
line-height: 70px; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
height: 70px; 
display: inline-block; 
padding: 0px 15px 0px 15px; 
}
ul.nav li a:hover, ul.nav li a:focus{
color: #BFD5E3; 
}

#totop{
position: fixed; 
bottom: 100px; 
right: 5%; 
width: 40px; 
height: 40px; 
overflow: hidden; 
}

#totop img{
position: absolute; 
top: 0px; 
left: 0px; 
/*-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out;*/
}

#totop img:hover, #totop img:focus{
top: -40px; 
}

#zentrieren{
width: 70%; 
height: 100%; 
padding: 0px 15% 0px 15%; 
margin: 0px; 
}
#logo{
width: 70%; 
padding: 50px 15% 50px 15%; 
margin: 0px; 
}
/*#kopf_oben{
background: rgb(2,0,36);
background: radial-gradient(circle, rgba(2,0,36,1) 0%, rgba(255,255,255,1) 0%, rgba(129,181,219,0.529832001159839) 100%);
}
*/

#texte{
padding: 0px 0px 150px 0px; 
margin: 0px; 
color: #CCCCCC;	
font-weight: 300; 
display: inline-block; 
}

#texte a:link, #texte a:visited{
font-weight: 400; 
color: #EEEEEE; 
text-decoration: none;	
}

#texte a:hover{
font-weight: 400; 
color: #EEEEEE; 
text-decoration: underline;	
}


#texte h1{
color: #CCCCCC; 
display: block; 
font-weight: 600; 
line-height: 1.8em; 
padding: 30px 0px 30px 0px; 
margin: 0px; 
}


#texte h3{
color: #CCCCCC; 
display: block; 
font-weight: 600; 
line-height: 1.3em; 
padding: 30px 0px 30px 0px; 
margin: 0px; 
}


#texte .textblock{
margin: 0px; 
padding: 20px 0px 30px 0px; 
border-bottom: 1px solid #999999; 
display: inline-block; 
}


.bildlinks{
float: left; 
width: 50%; 
max-width: 50%; 
padding: 0px; 
margin: 0px 0px 20px 20px; 

}
.bildlinks img{
width: 100%; 
height: auto; 
border: 0px; 
}


#texte .linkhub{
border: #CCCCCC 1px solid;
}	


#nav_legal{
text-align: right;
}	
#nav_legal a{
color: #CCCCCC; 
font-size: 0.8em; 	
line-height: 1em; 		
font-weight: 500;
text-decoration: none;		
}	
#nav_legal a:hover, #footer a:focus{
color: #EEEEEE; 
}



#footer{
width: 90%; 
height: 55px; 
/*line-height: 60px; */
padding: 0px 0px 0px 15% ; 
margin: 0px; 
position: fixed; 
right: 0px;
bottom: 0px; 
border-top: 1px solid #555; 
border-left: 0px solid #555;
border-right: 0px solid #555; 
border-bottom: 0px solid #555; 
background-image: url(images/sys/000000_100.png);
background-repeat: repeat; 
font-size: 0.8em; 	
line-height: 1em; 	
color: #CCCCCC; 
}
#footer a{
color: #CCCCCC; 
font-weight: 500;
text-decoration: none; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out; 
}
#footer a:hover, #footer a:focus{
color: #EEEEEE; 
}

b.hline{
padding: 20px 1% 10px 0px; 
margin: 20px 1% 0px 0px; 
display: inline-block; 
width: 97%; 
}

@media screen and (max-width: 1200px) {
.nav{display: none; }
.mobil{background-image: url(images/sys/04151f_100.png);
background-repeat: repeat;}
.responsive{
display: block; 
height: 0px; 
overflow: hidden; 
/*background-color: #DFDFDF; */
}

}

@media screen and (max-width: 980px) {
#logo img{
max-width: 90%; 
}
div.ort{
width: 92%; 
}
.bildlinks {
width: 99%; 
max-width: 100%;
border: 0px solid #FF0000; 
display: block; 
}
#texte h1{
font-size: 1.5em;
}
	
#texte h3{
font-size: 1.2em;
}	

}
@media screen and (max-width: 560px) {
#zentrieren{
width: 90%;
padding: 0px 5% 0px 5%;
}
	
#texte h1{
font-size: 1.5em;
}
	
#texte h3{
font-size: 1.2em;
}	
	
#footer{
font-size: 0.8em; 
}
#footer #kont_ausblenden{display: none; }

#totop{display:none; }

}