/*family=Open+Sans');
family=Enriqueta');
family=Abel');
family=PT+Sans:400,700');
family=Kurale');
*/
@charset "utf-8";

/* pt-sans-regular - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../include/fonts/pt-sans-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../include/fonts/pt-sans-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../include/fonts/pt-sans-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../include/fonts/pt-sans-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../include/fonts/pt-sans-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../include/fonts/pt-sans-v17-latin-regular.svg#PTSans') format('svg'); /* Legacy iOS */
}

/* pt-sans-700 - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../include/fonts/pt-sans-v17-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../include/fonts/pt-sans-v17-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../include/fonts/pt-sans-v17-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../include/fonts/pt-sans-v17-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../include/fonts/pt-sans-v17-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../include/fonts/pt-sans-v17-latin-700.svg#PTSans') format('svg'); /* Legacy iOS */
}

/* enriqueta-regular - latin */
@font-face {
  font-family: 'Enriqueta';
  font-style: normal;
  font-weight: 400;
  src: url('../include/fonts/enriqueta-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../include/fonts/enriqueta-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../include/fonts/enriqueta-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../include/fonts/enriqueta-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../include/fonts/enriqueta-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../include/fonts/enriqueta-v15-latin-regular.svg#Enriqueta') format('svg'); /* Legacy iOS */
}



html{
    margin:0;
    padding:0;
}

body{
    max-width:1450px;
    margin:auto;
    color:#585551;
    font-family: 'PT Sans', sans-serif;
}

a{
    color:#F48043;
}

input {
    
} 
/* hauptbestandteile */

#main{
    width:100%;
    float:left;
/*    background-color:red;*/
    line-height:1.4;
}

#header{
    width:90%;
    float:left;
/*    background-color:yellow;*/
    margin-left:5%;

}

#inhalt{
    width:100%;
    float:left;
/*    background-color:#F8F8F8;*/
    background-color:#E6E7EB;
/*    margin-left:5%;*/
    font-family: 'PT Sans', sans-serif;
    font-size:90%;
}

#footer{
    width:90%;
    float:left;
    margin-left:5%;
    height:250px;
}

#footer_inhalt1{
    margin-top:4%;
    float:left;
    width:30%;
    font-family: 'PT Sans', sans-serif;
}

#footer_inhalt2{
    margin-top:4%;
    float:left;
    width:30%;
    margin-left:15%;
}

#footer_inhalt3{
    margin-top:8%;
    float:left;
    width:20%;
    margin-left:5%;
}
#footer_inhalt3 img{
    width:15%;
    float:left;
    margin-left:2%;
}

/* kopf und navi */

#kopfundlogo{
    width:100%;
    float:left;
/*    background-color:lime;*/
}

#logo{
    width:35%;
    float:left;
/*    background-color:tomato;*/
}

#navi{
    float:left;
    margin-left:-2%;
    background-color:white;
    margin-top:10%;
    width:65%;
    font-family: 'PT Sans', sans-serif;
    font-weight:bold;
}

#navi ul{
    list-style-type: none;
    padding:0;
    margin:0%;
}

#navi li:last-child{
    border-right:0px solid black;
}

#navi li{
    float:left;
    padding-left:2.5%;
    padding-right:2.5%;
    border-right:1px solid #585551;
}

#navi li a {
    color:#585551;
    text-decoration:none;
    font-size:110%;
}

#navi li a:hover {
    color:#EB763E;
}

#subnavi{
    width:20%;
    float:left;
    margin-left:0%;
    margin-top:-0%;
    display:none;
    font-family: 'Enriqueta', serif;
    padding:3%;
    padding-top:1%;
    font-weight:bold;
}

#subnavi a{
    text-decoration:none;
    color:#585551;
}

#subnavi a:first-child{
    text-decoration:none;
    border-bottom:1px solid #585551;
    margin-left:0%;
    padding-left:8%;
    padding-right:8%;
}

#subnavi a:hover{
    color:#EB763E;
}

.aktiv{
    color:#EB763E;
    display:block;
}

.mobile-menu{
    display:none;
}

/* inhalt der seiten */

#bild{
    width:111%;
    float:left;
    margin-left:-5.5%;
    margin-top:1%;
}

#bild img{
    width:24.25%;
    float:left;
    margin-left:1%;
    margin-top:2%;
    height:530px;
}

#bild img:first-child{
    margin-left:0%;
}

#icon{
    width:24.25%;
    float:left;
    margin-left:1%;
/*    margin-top:-5%;*/
    background-color:#EB763E;
    max-height:45px;
    text-align:center;

}

#icon img{
    width:10%;
    height:30px;
    margin-right:1%;
    text-align:center;
    margin-left:10%;
}

#icon h4{
    color:#F8F8F8;
    font-size:180%;
    margin-top:0%;
}

#content{
    float:left;
    width:80%;
    margin-left:9.5%;
}

#slogan{
    width:100%;
    float:left;
    border-bottom:1px solid #d3d3d3;
    font-size:120%;
    font-family: 'PT Sans', sans-serif;
}

#border{
    border-bottom:1px solid #d3d3d3;
    text-transform:uppercase;
    font-family: 'PT Sans', sans-serif;
}

#einseitig{
    float:left;
    width:50%;
    margin-left:50%;
}

#einseitig_r{
    float:left;
    width:50%;
    margin-left:50%;
}

#einseitig_r_gross{
    float:left;
    width:70%;
    margin-left:30%;
    font-family: 'PT Sans', sans-serif;
    margin-bottom:4%;
}

#einseitig_l{
    float:left;
    width:60%;
}

#referenzen{
    width:100%;
    float:left;
}

#referenzen1{
    width:24.25%;
    float:left;
}

#referenzen1 img{
    width:100%;
    float:left;
    margin-bottom:4%;
}

#referenzen2{
    width:24.25%;
    float:left;
    margin-left:1%;
}
#referenzen2 img{
    width:100%;
    float:left;
    margin-bottom:4%;
}

#platzhalter{
    width:27%;
    float:left;
    height:50px;
}

#team{
    width:22%;
    height:33%;
    margin-left:2%;
    float:left;
    position: relative;
    margin-bottom:10%;
}

#team img{
    margin-left:5%;
    width: 17vw;
    height:17vw;
    float:left;
    border-radius:50%; 
    margin-right:15%;
    margin-bottom:3%;
}

#team h3{
    color:#EB763E;
    text-align:center;
    margin-bottom:3%;
    font-size:140%;
}

#team b{
    color:grey;
}

#team > #strich{
    width:30%;
    float:left;
    margin-left:35%;
    border-bottom:1px solid #EB763E;
    margin-bottom:3%;
}

#kontakt{
    width:100%;
    float:left;
}

#kontakt img{
    width:111%;
    float:left;
    height:300px;
    margin-bottom:4%;
    margin-left:-5.5%;
}

#formular{
    width:70%;
    float:left;
    margin-bottom:4%;
}

#buttonformular{
    width:115%;
    padding:1.5%;
    border:3px solid #F48043;
    color:white;
    background-color:#F48043;
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
    font-size:100%;
    margin-left:34.5%;
}

#buttonformular:hover{
    border:3px solid #585551;
    background-color:white;
    cursor:pointer;
    color:#585551;
}

#kontaktbild{
    float:left;
    text-align:right;
    font-size:110%;
}

#kontaktbild ul{
    list-style-type:none;
    color:#F48043;
}


#kontaktbild img{
    height:130px;
    margin-top:3%;
    margin-right:4%;
}

#innen{
    width:100%;
    float:left;
}

#innen img{
    width:111%;
    float:left;
    max-height:400px;
    margin-bottom:1%;
    margin-left:-5.5%;
}

#aussen{
    width:100%;
    float:left;
}

#aussen img{
    width:111%;
    float:left;
    max-height:400px;
    margin-bottom:1%;
    margin-left:-5.5%;
}

#leistungen{
    cursor:pointer;
}

#leistungen:hover{
    color:#EB763E;
}

#notdienst{
    float:left;
    margin-top:15%;
    margin-left:-49%;
}

#footer_inhalt1 a{
    color:#585551;
}

#footer_inhalt1 a:hover{
    color:#EB763E;
    text-decoration:none;
}

@media only screen and (max-width:940px) {
    #subnavi{
        width:40%;
    }
    #navi{
        width:62%;
    }
}
@media only screen and (max-width:750px) {
    #header{
        width:100%;
        margin-left:0%;
    }
    #navi{
        width:100%;
        margin-left:0%;
        margin-top:0%;
    }
    .mobile-menu{
        position:relative;
        display:block;
        width: 100%;
/*         background: #5578BC; */
        background: #EB763E;
        padding: 2%;
        text-decoration: none;
/*         border: 1px solid #5578BC; */
        border: 1px solid #EB763E;
    }
    a.mobile-menu{
        font-weight: normal;
        color: #FFFFFF;
    }
    
    a.mobile-menu img{
        height: 1em;
    }
    
    nav{
        margin: 0;
        display: none;
        width: 100%;
        padding: 0;
        text-decoration: none;
        float: none;
    }
    
    ul#navi, nav ul {
        display:block;
        position:relative;
        top:0;
        left:0;
        width:100%;
        padding: 0%;
        margin: 0%;
    }
    
    #navi li{
        margin-top:2.5%;
        float:left;
        width:86%;
        margin-left:7%;
        font-size:95%;
        margin-bottom:1.2%;
        margin-bottom:2.5%;
    }
    
    #logo{
        width:100%;
        float:left;
    }
    
    #formular{
        width:100%;
        float:left;
    }
    
    #platzhalter{
        width:0%;
        float:left;
        height:50px;
    }
    
    #team{
        width:100%;
    }
    
    #kontaktbild{
        width:100%;
    }
    #kontaktbild img{
        width:50%;
    }
    #einseitig_r{
        width:100%;
        margin-left:0%;
    }
    #einseitig_r_gross{
        width:100%;
        margin-left:0%;
    }
    #einseitig_l{
        width:100%;
    }
    
    #footer{
        width:90%;
        margin-left:5%;
        height:250px;
    }

    #footer_inhalt1{
        margin-top:4%;
        width:90%;
        font-family: 'PT Sans', sans-serif;
        margin-left:6%;

    }

    #footer_inhalt2{
        margin-top:4%;
        width:90%;
        margin-left:6%;
    }

    #footer_inhalt3{
        margin-top:8%;
        float:left;
        width:90%;
        margin-left:6%;
    }
    #footer_inhalt3 img{
        width:10%;
        float:left;
        margin-left:0%;
    }

    #team > #strich{
        width:70%;   
    }
    
    #team p{
        width:50%;
        margin-left:40%;
    }
    
    #team b{
        width:70%;
        margin-left:28%;
    }
    
}