@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 {
color: #000000; 
font-family: 'Roboto', sans-serif;
font-size: 1.0em; 
font-weight: 300; 
line-height: 1.3em; 
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; */

#coronainfo{
position: absolute; 
left: -100%; 
top: 160px; 
width: 60%; 
padding: 30px 20% 30px 20%; 
-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;
background-color: #FFFFFF; 
border-top: 15px solid #990000; 
border-left: 0px solid #990000; 
border-right: 0px solid #990000; 
border-bottom: 15px solid #990000; 
z-index: 2000; 
font-size: 1.5em; 
line-height: 2.0em; 
opacity: 0.95; 
}
#coronainfo.offen{
left: 0%; 
}
#coronainfo #schliessen, #jobpopup #popschliessen{
float: right; 
border: 1px solid #95BB2D; 
border-radius: 10px; 
padding: 0px 20px 0px 20px; 
}
#coronainfo a#schliessen, #jobpopup a#popschliessen
#coronainfo a#schliessen, #jobpopup a#popschliessen, #jobpopup a{
text-decoration: none; 
font-weight: 500; 
color: #95BB2D;
}


#jobpopup{
position: absolute; 
left: -100%; 
top: 160px; 
width: 60%; 
padding: 30px 20% 30px 20%; 
-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;
z-index: 3000; 
background-color: #FFFFFF; 
border-top: 15px solid #999999; 
border-left: 0px solid #990000; 
border-right: 0px solid #990000; 
border-bottom: 15px solid #999999; 
font-size: 1.5em; 
line-height: 2.0em; 
opacity: 0.95; 
}
#jobpopup.offen{
left: 0%; 
}



#totop{
position: fixed; 
top: 70px; 
right: 5%; 
width: 40px; 
height: 40px; 
overflow: hidden; 
z-index: 10000; 
}

#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: 100%; 
height: 100%; 
padding: 0px; 
margin: 0px; 
}


#newsbox a:link, 
#team a:link, 
#footer a:link, 
#newsbox a:visited, 
#team a:visited, 
#footer a:visited 
{
color: #95BB2D; 
text-decoration: none; 
}

#newsbox a:hover, 
#team a:hover, 
#footer a:hover, 
#newsbox a:focus, 
#team a:focus, 
#footer a:focus{
text-decoration: underline; 
}


#kopf_oben, #newsbox, #praxis, #team, #footer{
width: 70%; 
padding: 30px 15% 30px 15%; 
margin: 0px; 
}

#kopf_oben ul.nav, ul.responsive {
position: absolute; 
top: 80px; 
right: 10%; 
} 
ul.responsive, .mobil{
display: none; 
}

#kopf_oben ul.nav{
padding: 0px; 
margin: 0px; 
list-style-type: none; 
width: auto; 
height: auto; 
}
#kopf_oben ul.nav li{
float: left; 
margin: 0px 20px 0px 0px; 
}

#kopf_oben ul.nav li a:link, #kopf_oben ul.nav li a:visited{
text-decoration: none; 
color: #000000; 
-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;
text-transform: uppercase; 
}
#kopf_oben ul.nav li a:hover, #kopf_oben ul.nav li a:focus{
color: #95BB2D; 
text-decoration: underline; 
}


#head{
background-color: #FFFFFF; 
height: 320px; 
text-align: center; 
border-top: 5px solid #95BB2D;
border-bottom: 5px solid #95BB2D; 
}

#head h1{
color: #000000; 
padding: 70px 0px 40px 0px; 
font-size: 4.0em; 
font-weight: 900;
line-height: 1.0em; 
margin: 0px; 
}
#head h2{
color: #333333; 
padding: 20px 0px 0px 0px; 
font-size: 1.5em; 
font-weight: 100;
line-height: 1.0em; 
margin: 0px; 
}


#praxis a:link, #praxis a:visited{
color: #666666; 
}
#praxis a:hover, #praxis a:focus{
color: #FFFFFF; 
}

#newsbox{
width: 70%; 
display: block; 
float: left;  
padding: 0px 15% 0px 15%; 
margin: 0px 0px 50px 0px;  
}

#newsbox .box_1 h3,
#newsbox .box_2 h3,
#newsbox .box_3 h3{
text-align: center; 
}
#newsbox .box_1,
#newsbox .box_2,
#newsbox .box_3
{
width: 32%; 
margin: 0px;  
padding: 120px 1% 0px 0px; 
min-height: 280px; 
border: 0px solid #FF0000; 
float: left; 
display: block; 
-ms-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}
#newsbox h2{
text-align: center; 
font-weight: 900; 
}
#newsbox h4{
text-align: center; 
font-weight: 400; 
color: #666666; 
}

#newsbox .box_1{background-image: url(images/kinder.png);background-repeat: no-repeat; background-position: center top;}
#newsbox .box_2{background-image: url(images/erwachsene.png);background-repeat: no-repeat; background-position: center top;}
#newsbox .box_3{background-image: url(images/beratung.png);background-repeat: no-repeat; background-position: center top;}

#praxis{
background-color: #000000; 
height: auto; 
width: 70%; 
display: block; 
float: left;  
padding: 20px 15% 20px 15%; 
margin: 0px;  
color: #FFFFFF; 
text-align: center; 
}
#praxis h2{}
#praxis h4{color: #666666;font-weight: 400; }

#praxis .bildbox{
width: 23%; 
margin: 20px 1% 20px 0px;
padding: 0px; 
height: auto; 
float: left; 
color: #666666; 
}
#praxis .bildbox .bildbox_1, .bildbox_team .bildbox_1team{
width: 100%; 
height: auto; 
padding: 0px; 
margin: 20px 0px 20px 0px; 
filter: gray; /* For IE6-9 */
filter: grayscale(1); /* For Microsoft Edge and Firefox 35+ */
-webkit-filter: grayscale(1); /* For Google Chrome, Safari 6+ & Opera 15+ */
-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;
}
#praxis .bildbox .bildbox_1:hover, #praxis .bildbox .bildbox_1:focus, 
.bildbox_team .bildbox_1team:hover, .bildbox_team .bildbox_1team:focus
{
filter: none;
-webkit-filter: grayscale(0);
}





#team{
display: block;
float: left;  
height: auto; 
position: relative; 
}

#teamtext{
display: block; 
width: 100%; 
text-align: center; 
}
#teamtext h2{text-align: center;}
#teamtext h4{text-align: center; font-weight: 400; }

.teambox .bildbox_team .bildbox_1team{
margin: 7px 0px 0px 0px; 
}

.teambox{
width: 19.0%; 
min-height: 700px; 
float: left; 
margin: 0px 0px 20px 0px; 
padding: 0px 0.5% 20px 0.5%; 
position: relative; 
}

.teambox h2{
text-align: left;
font-size: 1.1em; 
padding: 10px 0px 0px 0px; 
margin: 0px; 
}
.teambox h6{
text-align: left;
font-size: 0.9em; 
padding: 0px 0px 0px 0px; 
margin: 0px; 
color: #666666; 
}

.profession{
font-weight: 400; 
display: block; 
width: 100%; 
padding: 20px 0px 10px 0px; 
margin: 0px 0px 0px 0px; 
text-align: left; 
position: relative;
bottom: 0px;  
}
.profession_x{display: none;}
.teambox ul{
padding: 0px; 
margin: 0px; 
list-style-type: none; 
}

.teambox ul li{
padding: 0px; 
margin: 0px 0px 10px 0px; 
}


.teambox.even{
background-color: #EEEEEE; 
font-size: 0.9em;
line-height: 1.0em; 
} 
.teambox.odd{
background-color: #E1E1E1; 
font-size: 0.9em; 
line-height: 1.0em; 
} 
 
#footer{
display: block; 
float: left; 
background-color: #000000; 
color: #FFFFFF; 
}
#googlemaps{

width: 100%; 
height: 400px; 
margin: 30px 0px 30px 0px;
padding: 0px; 
}

@media screen and (max-width: 1480px) {
.teambox{
width: 30%; 
}

}

@media screen and (max-width: 1280px) {
#zentrieren{width: 100%; display: block; float: left; border: 0px solid #FF0000;position: relative; }
#logo, #kopf_oben ul.nav{width: 100%; display: block;  position: relative; top: 0px; right: 0px; margin: 0px auto; text-align: center; border: 0px solid #FF0000;}
#kopf_oben ul.nav li{width: 18%; margin: 20px 1% 20px 0px; }
#kopf_oben ul.nav li a:link, #kopf_oben ul.nav li a:visited{
padding: 10px 0px 10px 0px; 
}
#head{width: 100%; display: block; float: left; position: relative; border: 0px solid #0000FF;}
}

@media screen and (max-width: 800px) {
.teambox{
width: 48%; 
}

#kopf_oben ul.nav li{
width: auto; 
margin: 20px 2% 20px 0px; 
}
#logo img{width: 90%; height: auto; }
#praxis .bildbox{
width: 48%; 
}
}

@media screen and (max-width: 600px) {
#newsbox .box_1, #newsbox .box_2, #newsbox .box_3{
width: 98%; 
}

#coronainfo, #jobpopup{
font-size: 1.0em; 
}

}

@media screen and (max-width: 480px) {
#head h1{font-size: 2.0em; }
#head h2{font-size: 1.1em; }
.teambox{
width: 90%; 
}
#praxis .bildbox{
width: 90%; 
}
#adresse{
hyphens: auto;
}

#head{

}

#kopf_oben ul.nav{
padding: 30px 2% 30px 2%; 
margin: 0px 0px 0px 0px; 
display: inline-block; 
height: auto;  
}

#kopf_oben ul.nav li{
width: 100%; 
padding: 10px 0px 10px 0px; 
margin: 0px 0px 0px 0px; 
background-color: #95BB2D; 

}
#kopf_oben ul.nav li a:link,#kopf_oben ul.nav li a:visited{
color: #FFFFFF; 
font-weight: 500; 
display: block; 
padding: 0px 0px 0px 0px;
}
}