@charset "utf-8";

img, object, embed, video {    max-width: 100%;}


   
.handy{
    visibility:visible;
    display:block;
    float:left
}

.balken{
    float:left;
    width: 100%;
    color: white;
    text-align: center;
    Text-transform: uppercase;
    box-shadow: 10px 10px 53px -15px rgba(0,0,0,0.75);
    }
   
.balken1{
    min-height: 100px;
    background-color: rgba(40,40,40,0.7);
    float:left;
    width: 100%;
    color: white;
    line-height: 92px;
    font-size: 220%;
    text-align: center;
    Text-transform: uppercase;
    box-shadow: 10px 10px 53px -15px rgba(0,0,0,0.75);
    font-family: Abel, Arial, sans serif;   
}
.abstand{
    margin-top:40px
}
.m60{
    max-width:60px;
    margin-right:12px
}
.seite {
    width: 100%;
    top: 0;
    background-color: white;
    margin-bottom: 135px;
    box-shadow: 10px 10px 53px -15px rgba(0,0,0,0.75);
    }
.container_1_1,.container_1_2,.container_1_3,.container_1_3_footer,.container_2_3,.container_1_4,.container_3_4,.container_1_5,.container_2_5,.container_3_5,.container_4_5,.container_1_6,.container_5_6, .footer, .mitte, .header, .seite, .links, .rechts{
    float:left;
    display: block;
    z-index: 0;
    }

.rechts{float:right}
.header{
    width: 100%;
    float: left;
    display: block;
    background-color: #e8dfb8;
    background: white;
    background: #f8ca4a;
    background: -moz-linear-gradient(304deg, #f2c137 0%,white 28%, #e5c06f  60%, #f2bd1b 90%, #f7c24d  100%);                     /* ff3.6+ */
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #f2c137), color-stop(28%, white 28%), color-stop(60%, #e5c06f), color-stop(93%, #f2bd1b ), color-stop(100%, #f7c24d ));             /* safari4+,chrome */
    background: -webkit-linear-gradient(304deg, #f2c137 0%, white 28%,#e5c06f 60%, #f2bd1b 90% ,#f7c24d  100%);                 /* safari5.1+,chrome10+ */
    background: -o-linear-gradient(304deg,#f2c137 0%, white 28%, #e5c06f 60%, #f2bd1b 90%, #f7c24d  100%);                         /* opera 11.10+ */
    background: -ms-linear-gradient(304deg, #f2c137 0%, white 28%, #e5c06f 60%, #f2bd1b 90%, #f7c24d  100%);                     /* ie10+ */
    background: linear-gradient(146deg, #f2c137 0%, white  38%,#e5c06f 60%, #f2bd1b 90%, #f7c24d 100%);                             /* w3c */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2c137', endColorstr='#f7c24d',GradientType=0 );             /* ie6-9 */
    border-bottom:2px #ccc solid;
    height: 100px;
    color:white;
    box-shadow: 10px 10px 53px -15px rgba(0,0,0,0.75);
}

.header img{
    max-width: 220px;
    }

.logo{
    /* width: 50%; */
    float: left;
    /* margin-left: 10%; */
    /* margin-top:25px; */
    min-width: 260px;
}
.logo1 { right: 260px; float: right }
.slogan{
    width: 80%;
    margin-top:15px;
    margin-left: 10%;
    float: left;
    font-size: 500%;
    font-family: 'Ubuntu Condensed', sans-serif;
    color: white;
    text-shadow: 2px 2px 6px rgba(0,0, 0, 1);
    line-height:16px;
    font-weight: 600
}
.slogan p{
    line-height:59px}


.mitte {
    width: 66%;
    margin-left: 17%;
}
.wrapper {
    margin: 40px 0;
    }



.container_3_4{
    width: 72%;
}

.container_1_1 {
    width: 100%;
   
}

.container_1_2 {
    width: 48.75%;
}

.rechts {
    width: 26.4%;
    margin-bottom: 44px;
    margin-right: 4%;
    }

.container_1_3 {
    width: 28.6%;
    margin-right: 7%;
    margin-bottom: 44px;
    }

.container_2_3, .links {
    width: 64.6%;
}

.container_1_4 {
    width: 23.996%;
    margin-right: 1%;
}

.container_3_4 {
    width: 71.4%;
}

.container_1_5{
    width: 12.86%;
}
.container_2_5 {
    width: 35.91%;
}

.container_3_5 {
    width: 55.57%;
}

.container_4_5 {
    width: 73.79%;
}

h1, h2, h3, h4, h5, h6{
    margin-bottom: 5px;
    margin: 40px 0 20px 0;
    font-family: Abel, Arial, sans serif;   
    font-weight:400;
    color:#c93;

}

h1{
    font-size: 180%;
    text-transform: uppercase;
    text-shadow: 2px 2px 6px rgba(0,0, 0, 0.2);
    }
   
h2{
        font-size: 160%;
        text-shadow: 2px 2px 6px rgba(0,0, 0, 0.2);
        }
       
h3{
    font-size: 140%;
    text-transform: uppercase;
    text-shadow: 2px 2px 6px rgba(0,0, 0, 0.1);
   
}
h4{
    font-size: 120%;
    text-transform: uppercase;
    }
h5{   
        font-size: 120%;
    font-style: italic;
    font-weight:bold
    }
   
h6{
    font-size: 140%;
    border-bottom: 1px solid #c93;}
.index, .index a {color:#333}
.index .footer a {color:#ccc}
.logo{
    color: #333;
    font-size:160%;
    }
.logo1 { color: #000; font-size: 160% }
.logo img{
    max-width: 120px;
    margin-top:8px;
    margin-bottom:8px;
    }
.logo img1 { margin-top: 8px; margin-bottom: 28px; width: 120px }
.kontakt {
    width: 24%;
    float: right;
    text-align: right;
    padding: 25px 0 0 0;
    line-height:20px;
    min-width: 240px;
    font-family: Abel, Arial, sans serif;
    font-size:120%;
    }
   

.footer{
    margin-top:15px;
    width:100%;
    background-color: #444;
    color: #ccc;
    padding-bottom: 25px;
    box-shadow: 10px 10px 53px -15px rgba(0,0,0,0.75);
}
.footer .mitte{
    background-color: transparent;
}
.footer .container_1_4{
    box-shadow: none;
}
.rechts        {
    float:right;
    margin-right: 0;
    }
   
@media only screen and (max-width: 1828px) {

.mitte {
    width: 80%;
    margin-left: 10%;
}

}

@media only screen and (max-width: 1628px) {

.slogan{
    width: 92%;
    }
}

@media only screen and (max-width: 1500px) {
#name{
        font-size:170%;
        line-height: 155px;
        }

.container_1_3 {
    width: 46%;
    margin-right: 4%;
    margin-bottom: 44px;
    min-width: auto;
    }
.rechts{float: right;}
.zwei{clear:both}
.container_1_1 {width: 96%;}
}

@media only screen and (max-width: 1290px) {

.logo{

    }
.mitte {
    width: 90%;
    margin-left: 5%;
}

}

@media only screen and (max-width: 1100px) {
    #name{
        font-size:160%;
        }
       
.slogan{
    margin-top: 15px;
    max-height: 220px;
    }
    .logo{
    min-width:280px;
    margin-top: 12px;
    }
   
h6{
    font-size:140%
    }

   
.header{
    margin-top:0;
    width: 100%;
    padding: 0;
    margin: 0;
    }
.container_1_4 {
    width: 100%;
}
.footer .container_1_4 {
    width: 48%;
}
.container_3_4{
    width: 100%;
}

.logo img{max-width:80px}
    }

/* ======================================================
Layout für Tablet: 799 px oder weniger.
=========================================================*/
@media only screen and (max-width: 799px) {

.balken{
    line-height:34px;
    font-size:140%;

    }
    .balken1{
    line-height:34px;
     padding-top:20px;
    font-size:140%;
    min-height:50px;
    }
    .rechts{float:left;
        width:100%
    }
   
 .handy{
    display:none;
    visibility:hidden;
    height:0px
}
.clear1{
    clear:both
}
.hoehe{
    height:15px
    }
h1{
    font-size: 180%;
    }
   
h2{
    font-size: 140%;
    }
   
h3{   
    font-size: 110%;
    }
   
h6{
    font-size: 140%;
     }
h1, h2, h3, h4, h5, h6{
   
    margin: 30px 0 10px 0;   

}
.seite{
    width: 100%;
    }
.kontakt{padding:0}

.mitte{
    width: 96%;
    margin-left: 0;
    padding: 2%;
}

.logo{
    margin-top: 0;
    /* width: 100%; */
    min-width: 230px;
}
.slogan{
    font-size: 473%;
    margin-left: 2%;
}
.container_1_1 {
    width: 98%;
}

.container_1_2 {
    width: 95.74%;
}

.container_1_2 {
    width: 46.4%;
    margin-right:3%
}


.container_1_3 {
    width: 48%;
    margin-right: 2%;
    margin-bottom: 24px;
    min-width: auto;
}
.container_2_3, .links {
    width: 100%;
}



.container_1_5 {
    width: 99.04%;
}

.container_2_5 {
    width: 45.7%;
}

.container_3_5 {
    width: 95.74%;
}
.container_4_5 {
    width: 95.74%;
}

.container_1_6 {
    width: 28.83%;
}

.container_5_6 {
    width: 62.27%;
}
.footer{
 padding:4%;
 width: 92%;
 }

}

@media only screen and (max-width: 600px) {
.slogan{
        width: 62%;
        font-size: 350%;
        }
.slogan p {
    line-height: 39px;
}
.footer .container_1_4 {
    width: 100%;
}

}

@media only screen and (max-width:540px) {
.slogan{
    margin-top: 45px;
    }
.kontakt {
    padding:   0;
    margin-right:5px;
    margin-top: 28px;
    }
}
@media only screen and (max-width: 500px) {
.kontakt {
 margin-top: 0;
 }
    }

@media only screen and (max-width: 499px) {
.kontakt {
 margin-top: -42px;
 }
    }
@media only screen and (max-width: 480px) {
.rechts{
    float:left
    }

h1{
    font-size: 150%;
    text-transform: uppercase;
    }
   
h2{font-size: 144%;}

h3{
    font-size: 110%;
    /* color: #999; */
    }
   
h4{
    font-size: 100%;
    }

h5{
    font-size: 130%;
    font-style: italic;
    color: #39c;
    float:right;
    margin-right:5%;
    }
   
h6{
    font-size: 110%;
    text-transform: uppercase;
    }



.seite {
    float: left;
    }

.header{
    width: 100%;
    float:left;
    margin-bottom: 5px;
    }

.logo{
    /* width: 21%; */
    float: left;
    margin-left:4%;
    margin-top: 0;
    }

.slogan{
    width: 92%;
    margin-top: 0;
    float: left;
    margin-left: 4.5%;
    font-size: 270%;
        }
.kontakt{
    margin-left:5%;
    /* margin-top: -19px; */
}
.mitte {
    float:left;
    display: block;
}

.container_1_1,.container_1_2,.container_1_3,.container_2_3,.container_1_4,.container_3_4,.container_1_5,.container_2_5,.container_3_5,.container_4_5,.container_1_6,.container_5_6, .links, .rechts{
    width: 100%;
}

 .footer{
 width: 92%;
}


}