/* roboto-300italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/roboto-v18-latin-300italic.eot');
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
       url('fonts/roboto-v18-latin-300italic.eot?#iefix') format('embedded-opentype'), 
       url('fonts/roboto-v18-latin-300italic.woff2') format('woff2'), 
       url('fonts/roboto-v18-latin-300italic.woff') format('woff'), 
       url('fonts/roboto-v18-latin-300italic.ttf') format('truetype'), 
       url('fonts/roboto-v18-latin-300italic.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'); 
}

/* 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'); 
}

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

/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/roboto-v18-latin-700.eot');
  src: local('Roboto Bold'), local('Roboto-Bold'),
       url('fonts/roboto-v18-latin-700.eot?#iefix') format('embedded-opentype'), 
       url('fonts/roboto-v18-latin-700.woff2') format('woff2'), 
       url('fonts/roboto-v18-latin-700.woff') format('woff'), 
       url('fonts/roboto-v18-latin-700.ttf') format('truetype'), 
       url('fonts/roboto-v18-latin-700.svg#Roboto') format('svg'); 
}
/***
-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-image: url(../../images/weiss_100.png);
  background-repeat: repeat; 


**/
/*****SCHRIFTGROESSEN-700-400-400i-300-300i*****/

html, body{
padding: 0px; 
margin: 0px; 
width: 100%; 
height: 100%;
font-family: 'Roboto', Arial, Helvetica, sans-serif;
font-weight: 300; 
font-size: 1.0em; 
color: #000000; 
hyphens: auto; 
}

body{
background: #FFFFFF; 
}

ul.sprachwahl{
list-style-type: none; 
width: 180px; 
border: 1px solid #FFFFFF; 
position: absolute; 
top: 10px; 
right: 10%; 
}

ul.sprachwahl li{
float: left; 
margin: 0px 0px 0px 10px; 
}

ul.sprachwahl li img{
opacity: 0.4; 
width: 40px; 
height: auto; 
-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.sprachwahl li a img{
opacity: 1.0; 
width: 40px; 
height: auto; 
}
ul.sprachwahl li img:hover,ul.sprachwahl li img:focus {
width: 50px; 
margin: 0px 0px 0px 5px; 
}


#zentrieren{
width: 70%; 
padding: 0px; 
margin: 0px 15% 0px 15%; 
border: 0px solid #FFFFFF; 
position: relative; 
}
#kopfbereich{
width: 100%; 
height: 160px; 
margin: 0px; 
padding: 20px 0px 20px 0px; 
background-image: url(images/start-pferde.jpg);
background-repeat: no-repeat; 
background-position: center center;
background-size: cover; 
float: left; 
border: 1px solid #999999; 
}

.headpix{
height: 120px; 
width: auto; 
border: 0px solid #999999; 
float: left; 
margin: 0px; 
padding: 10px 50px 30px 0px; 
}
.slogan{
border: 0px solid #FF0000; 
width: auto; 
float: left; 
height: 120px; 
line-height: 208px; 
font-size: 1.3em; 
}

ul.nav{
display: block; 
float: left; 
width: 100%; 
display: table; 
list-style-type: none; 
padding: 0px; 
margin: 0px 0px 40px 0px; 
font-size: 1.0em; 
}

ul.nav li.first{
display: table-cell; 
margin: 0px 0px 0px 0px; 
padding: 8px; 
border-bottom: 1px solid #999999;
border-right: 0px solid #999999; 
border-top: 0px solid #999999; 
border-left: 1px solid #999999; 
}
ul.nav li.last{
display: table-cell; 
margin: 0px 0px 0px 0px; 
padding: 8px; 
border-bottom: 1px solid #999999;
border-right: 1px solid #999999; 
border-top: 0px solid #999999; 
border-left: 1px solid #999999; 
}

ul.nav li a:link, ul.nav li a:visited{
text-decoration: none; 
color: #000000; 
font-weight: 400; 
-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.nav li a:hover, ul.nav li a:focus{
color: #C78200; 
}
ul.responsive{
display: none; 
}

#texte{
width: 100%; 
float: left;  
margin: 0px 0px 100px 0px; 
padding: 0px 0px 100px 0px; 
}
#texte a:link, #texte a:visited, 
#footer a:link, #footer a:visited{
-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-decoration: underline; 
color: #333333; 
font-weight: 400; 
}
#texte a:hover, #texte a:focus, 
#footer a:hover, #footer a:focus
{
color: #C78200; 
}

.bild_border_links{
float: left; 
border: 1px solid #999999; 
padding: 2px; 
margin: 5px 10px 5px 0px; 
}
.bild_border_rechts{
float: right; 
border: 1px solid #999999; 
padding: 2px; 
margin: 5px 0px 5px 10px; 
}
.bild_border_links{
float: left; 
border: 1px solid #999999; 
padding: 2px; 
margin: 5px 10px 5px 0px; 
}

#footer{
border-bottom: 0px solid #FF0000; 
border-top: 1px solid #999999; 
border-left: 0px solid #FF0000; 
border-right: 0px solid #FF0000; 
background-image: url(images/sys/weiss_90.png);
  background-repeat: repeat; 
text-align: center; 
position: fixed; 
bottom: 0px; 
height: auto; 
line-height: 40px; 
width: 100%; 
}

strong, b{
font-weight: 400; 
color: #000000; 
}

h1{font-weight: 700; font-size: 1.4em; }
h2{font-weight: 700; font-size: 1.3em; }
h3{font-weight: 700; font-size: 1.2em; }
h4{font-weight: 700; font-size: 1.1em; }
h5{font-weight: 700; font-size: 1.0em; }
h6{font-weight: 700; font-size: 0.9em; }

/*Bildschirm < 117*/
@media screen and (max-width: 1170px) {
ul.nav{
font-size: 0.9em; 
}
}

@media screen and (min-width: 320px) and  (max-width: 1169px){
.headpix{
margin: 0px; 
padding: 0px; 
border: 0px solid #FF0000; 
display: block; 
height: 120px; 
}

ul.sprachwahl{
list-style-type: none; 
width: 180px; 
border: 1px solid #FFFFFF; 
position: absolute; 
top: 35px; 
left: 0px; 
}


.slogan{
font-size: 0.8em; 
margin: 0px; 
padding: 0px 0px 30px 0px; 
border: 0px solid #FF0000; 
height: 30px; 
line-height: 30px; 
display: block; 
width: 100%; 
}
#kopfbereich{
height: 120px; 
margin: 0px 0px 30px 0px; 
display: block;  
width: 100%; 
}

#texte img{
max-width: 100%; 
height: auto; 
}

ul.nav{
display: none; 
}
ul.responsive{
display: block; 
}
ul.responsive{
font-size: 1.2em; 
list-style-type: none; 
font-weight: 300;
display: block; 
border: 0px solid #FF0000; 
width: 90%; 
position: fixed; 
left: 0px; 
top: 0px; 
padding: 50px 5% 0px 5%; 
margin: 0px; 
float: left; 
background-color: #C78200;
overflow: hidden; 
background-image: url(images/sys/nav_resp.png);
background-repeat: no-repeat; 
background-position: right 0px; 
z-index: 10000; 
height: 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; 
}
ul.responsive ul{
font-size: 0.9em; 
padding: 0px 0px 10px 10px; 
margin: 0px; 
border: 0px solid #FF0000; 
list-style-type: none; 
}
ul.responsive li.last{
padding: 0px 0px 40px 0px; 
}
ul.responsive li a:link, ul.responsive li a:visited{
display: inline-block; 
width: 100%; 
text-decoration: none; 
color: #000000; 
font-weight: 500; 
border-top: 0px solid #000000; 
border-left: 0px solid #000000; 
border-right: 0px solid #000000; 
border-bottom: 1px solid #000000; 
padding: 8px 0px 8px 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; 
}
ul.responsive li.last a:link, ul.responsive li.last a:visited{
border-top: 0px solid #000000; 
border-left: 0px solid #000000; 
border-right: 0px solid #000000; 
border-bottom: 0px solid #000000; 
}
ul.responsive li a:hover, ul.responsive li a:focus{
color: #FFFFFF; 
}

#footer{
height: auto; 
padding: 10px 0px 10px 0px; 
font-size: 0.9em; 
line-height: 1.0em; 
}

.headpix{
margin: 80px 0px 0px 0px; 
}


}