@charset "utf-8";
/* CSS Document */

@font-face {

    font-family: 'Montserrat';
    src: url('fonts/Montserrat-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;


}
 *{         
               	-webkit-box-sizing: border-box;
  	            -moz-box-sizing: border-box;
                -o-box-sizing: border-box;
  	            box-sizing: border-box; 
                margin: 0px;
                padding: 0px;
/*background-color:#fff;*/

                 font-family: 'Montserrat';
             /*   font-optical-sizing: auto;*/
                /*font-stretch: expanded;*/
                font-weight: 300;
                font-style: normal;
                font-size:1.6vw;
      line-height:44px;
     
     color:#000;

  /*  font-variation-settings: 'wght' 500; */
  }


body{
        background-color:#fff; 
}


 









i,em{
   font-style: italic;
   /* font-size:1.6vw;*/
     font-size:1.4vw;
   
}
.schieb{
   font-size:1.6vw;
}
strong{
   font-weight: 600;

}
    nav{
        width:65%;
        min-height: 10px;
        background-color:#fff;
        float:left;
        text-align: center;
        }
        .logo{
            width:10%;
            min-height: 10px;
            background-color:#fff;
            margin:20px 20px 20px 40px;
            float:left;
        }

	ul{
		margin:20px;

	}
        li{
            list-style-type: none;
            display:inline;
            text-decoration: none;
            margin:4px 40px;
        }
            li a{
                color:#000;
                text-decoration: none;
                font-weight: 600;
            }
            li a:link{
                color:#000;
                text-decoration: none;
                font-weight: 600;
            }
            li a:visited{
                color:#000;
                text-decoration: none;
                font-weight: 600;
            }
            li a:hover{
                color:#01afc4;
                text-decoration: none;
            } 
a {
  text-decoration: none;
}
header{
    width:100%;
    height: 80%;
    float:left;
    display:block;
      } 
.uberbilder{

    min-width:10%;
    min-height:4%;
    /*background-color:#f00;*/
    background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:100px;
    left:24px;
}
.uberbilder_2{

    min-width:10%;
    min-height:3.5%;
    /*background-color:#f00;*/
    background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:175px;
    left:24px;
}
.telefon{
    top:100px;
    right: 0px;
    width: 50px;
    min-height: 50px;

    position: fixed;
    z-index:998;
}
        #wrapper{
            width:80%; 
            margin:auto;
            overflow:hidden;
        }       


        article{
        width:100%;
       min-height: 100px;
  
        background-color:#fff;
            padding:4%;

        float:left;
        }
span{
    color:#01afc4;
  /*  font-size:1.6vw;*/
      font-size:1.6vw; 

    line-height: 2.4vw;
}


.span2{
    color:#01afc4;
    font-size:1.6vw;
    font-weight: 600;
}
.span3{
    color:#01afc4;
    font-size:2.3vw;
    font-weight: 600;
}
   /*  aside{
         width:200px;
         height: 300px;
         background-color:#A8CC21;
         float:left;
        }*/
.spanh1{
   font-size:3vw;
    color:#000;
    font-weight:600;
    font-stretch: expanded;
    margin-bottom:1.6vw; 
}
h1{
font-size:3vw;
    color:#000;
    font-weight:600;
    font-stretch: expanded;
    margin-bottom:1.6vw;
    line-height: normal;
}
h2,strong{
font-size:1.6vw;
    font-weight: 600;
    color:#000;
}
h3{
font-size:1.8vw;
    font-weight: 600;
    color:#000;
}
p{
  font-size:1.6vw; 
    margin:5px 0px 0px 0px;
    float:left;
    background:rgba(0,0,0,0.00);
    line-height: 2.4vw;

    /* font-stretch: expanded;*/
}
.zup{
      font-weight: 600;

    line-height:40px;
}
#zup{
      font-weight: 600;

    line-height:40px;
}

.icon_traeger{
  /*  background-color:#fff;*/
    width:100%;
    float:left;   
    display: flex;
    justify-content: center;

}

    .icon{
      width: 20%;
      margin:0px 12%;
     /* background-color:#fff;*/
      text-align: center;
    }
.bildgrund{

    width:100%;
    min-height:300px;
    background-image:url("bilder/hintergrund_1.gif");
    background-size: 100%;
    float:left;
    background-repeat: no-repeat;
    margin-top:40px;
  
    
}
    .uberbild{
       width: 100%;
        height: 20%;
        margin-top:0.5%;
        float:left; 
    }

        .mittelarticle{
           width: 80%;
           background-color:#eee; 
           margin:0% 10%;
           border: 14px solid #fff;
           text-align: center;

        }
        .mittelarticle_zieh{
           width: 80%;
           background-color:#fff; 
           margin:0px 10%;
        /*   border: 14px solid #fff;*/
           text-align: center;

        }

.erfolgicon{
    width: 100%;
    height: 20%;
    margin-top:5%;

    float:left; 
    text-align: center;
}

.weiter{
    margin:20px 40%;
    width:20%;
    height: 50px;
    float:left;
    text-align: center;
    font-size:1.6vw;
   /* background-color:#f00;*/
}

    footer{
        margin-top:0px;
        padding-left:36px;
        width:100%;
        min-height: 100%;
        background-color:#eee;
        float:left;
        } 
.fussplatz1{
    width: 40%;
    min-height: 20%;
    margin-top:1%;
    padding:20px;
    float:left;  
}
.fussplatz2{
    width: 40%;
    min-height: 20%;
    margin-top:1%;
    padding:20px;
    float:left;   
}
.fussplatz3{
    width: 10%;
    min-height: 20%;
    margin-top:1%;
    padding:20px;
    float:left;   
}
.karte{
    width: 58%;
        float:left;
    margin-right:2%;
}
.formular{
    width: 38%;
    min-height: 18%;
    float:left;
    margin-left:2%; 
}

form label{
    font-size:1.2vw;
}
input{
    width: 100%;
    heigth:10px;
    text-align:left;  
}
textarea{
    width: 100%;
    height: 220px;
    display:block;
}
button{
   margin-top:20px;
    color:#fff;
    background-color:#01afc4;
    border-color: #fff;
    padding:0px 10px;
      border: none;
  outline: none;
    
  /*  border-radius: 9999px;*/
}
.labeltext{
  font-size: 1.6vw;  
}

@media all and (max-width: 1100px), all and (max-device-width:1100px)
{
      i,em{
   font-style: italic;
    font-size:2.2vw;
}  
 .labeltext{
  font-size: 2vw;  
}   
    
    /*
    i,em{
   font-style: italic;
    font-size:2.2vh;
}
    */
    #wrapper{
            width:90%; 
            margin:auto;
        } 
    h1{
font-size:3vw;
    color:#000;
}
h2,strong{
font-size:2.4vw;
font-weight: 600;
    color:#000;

}
    h3{
font-size:2.4vw;
    font-weight: 600;
    color:#000;
}
p{
  font-size:2vw; 
    margin:5px 0px ;
}
    span{
          font-size:2vw; 
    color:#01afc4;
 /*   font-size:2vw;*/
}
    .span2{
    color:#01afc4;
    font-size:2.4vw;
font-weight: 600;
}
    
 .zup{


    line-height:30px;
}
#zup{


    line-height:30px;
}  
    
    
.uberbilder{

    min-width:10%;
    min-height:4%;
    background-color:rgba(255,255,255,0.8);
    
    z-index:999;
    position: absolute;
    top:85px;
    left:24px;
}
.uberbilder_2{

    min-width:10%;
    min-height:3%;
    /*background-color:#f00;*/
    background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:130px;
    left:24px;
}    
    
 .weiter{
    margin:20px 40%;
    width:20%;
    height: 50px;
    float:left;
    text-align: center;
      font-size:3vw;
   /* background-color:#f00;*/
}   
    
 	ul{
		margin:15px;

	}
        li{
            list-style-type: none;
            display:inline;
            margin:0px 30px;
            font-size:2.0vw;
        }
            li a{
                color:#000;
                text-decoration:none;
                font-size:2.0vw;
            }

            li a:hover{
                color:#777;
                text-decoration:underline;
                font-size:2.0vw;
            }       
 .icon{
     font-size:2vw;
     text-align:center;
    }
   
}
@media all and (max-width: 900px), all and (max-device-width:900px)
{
    
        *{
       line-height:3vw;  
    }
/*
    i,em{
   font-style: italic;
    font-size:2.4vh;
}    
 */ 
  .zup{


    line-height:30px;
}
#zup{


    line-height:30px;
}    
    
    
  .uberbilder{
    min-width:10%;
    min-height:2%; 
    top:80px;
    left:10px;

    }
    .uberbilder_2{
    min-width:10%;
    min-height:2%;    
    top:120px;
    left:10px;   
    }
    
.karte{
    width: 100%;
        float:left;
    margin:2%;
}
.formular{
    width: 100%;
    min-height: 15%;
    float:left;
    margin:2%; 
}
form label{
    font-size:3vw;
}    
 .labeltext{
  font-size: 3vw;  
}   
    
}


@media all and (max-width: 580px), all and (max-device-width:580px)
{
    *{
       line-height:3.2vw;  
    }
    
 .labeltext{
     font-size:3vw;
    }    
  form label{
    font-size:3vw;
} 
    
    
  .zup{
      font-weight: 600;

    line-height:30px;
}
#zup{
      font-weight: 600;

    line-height:30px;
}
/*    
        i,em{
   font-style: italic;
    font-size:3.2vh;
}*/
        .logo{
            width:100%;
            min-height: 10px;
            background-color:#fff;
            margin:40px 0px 10px 0px;
            padding:0px 34% 0px 34%;
            float:left;
        }
        nav{
        width:100%;
        min-height: 10px;
        background-color:#fff;
        float:left;
        text-align: center;
        }
            #wrapper{
            width:100%; 
            margin:auto;
        } 
    h1{
font-size:3.4vw;
    color:#000;
}
h2,strong{
font-size:4vw;
font-weight: 600;
    color:#000;
}
    h3{
font-size:3vw;
    font-weight: 600;
    color:#000;
}
p{
  font-size:3vw; 
    margin:5px 0px;
    line-height: 3.2vw;
}
        span{
            line-height: 3.2vw;
          font-size:3vw; 
    color:#01afc4;
 /*   font-size:2vw;*/
}
    
.uberbilder{

    min-width:10%;
    min-height:2%;
    /*background-color:#f00;*/
    background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:305px;
    left:10px;
}
.uberbilder_2{

    min-width:10%;
    min-height:1.8%;
    /*background-color:#f00;*/
    background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:335px;
    left:10px;
}     
 .weiter{
    margin:20px 40%;
    width:20%;
    height: 50px;
    float:left;
    text-align: center;
      font-size:6vw;
   /* background-color:#f00;*/
}     
    


.span2{
    color:#01afc4;
    font-size:4vw;
font-weight: 600;
} 
.span3{
    color:#01afc4;
    font-size:2.8vw;
font-weight: 600;
} 
     	ul{
		margin:15px;

	}
        li{
            list-style-type: none;
           display:block;
            margin:30px 0px;

        }
            li a{
                color:#000;
                text-decoration:none;
                font-size:5vw;
            }

            li a:hover{
                color:#01afc4;
                text-decoration:none;
                font-size:5vw;
            } 
     .icon{

     font-size:2.2vw;
    text-align:center;
           

    }
    .fussplatz1{
        width: 100%;
        padding:4% 12%;

    }
    .fussplatz2{
        width: 100%;
        padding:4% 12%;
  
    }
    .fussplatz3{
        width: 100%;
        padding:4% 12%;
 
    }
 .untenlink{
     font-size:2vw;
    }
}
@media all and (max-width: 420px), all and (max-device-width:420px)
{
     span{
    color:#01afc4;
  /*  font-size:3vw;*/
}   
.labeltext{
  font-size: 6vw;  
} 

.acc label {

 /* font-size: 5.1em;*/
  font-size: 6vw;  
    
 }    
    .uberbilder{

    min-width:10%;
    min-height:2%;
    /*background-color:#f00;*/
    background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:270px;
    left:10px;
}
.uberbilder_2{

    min-width:10%;
    min-height:1.8%;

   background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:295px;
    left:10px;
} 
  .untenlink{
     font-size:2vw;
    }
   p {
      font-size:3vw;    
    line-height: 3.2vw;
    }

 
 #kleinst{
     font-size:5vw;   
    }   
    
    
}
@media all and (max-width: 360px), all and (max-device-width:360px)
{
    
 form label{
    font-size:8vw;
}    
 .labeltext{
  font-size: 8vw;  
}    
  

     span{
    color:#01afc4;
         line-height: 4.5vw;
  /*  font-size:3vw;*/
}



/*.acc label {

  font-size: 6.1em;
    
 }*/
    .uberbilder{

    min-width:10%;
    min-height:2%;
    /*background-color:#f00;*/
    background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:260px;
    left:10px;
}
.uberbilder_2{

    min-width:10%;
    min-height:1.8%;
   
    background-color:rgba(255,255,255,0.8);
    z-index:999;
    position: absolute;
    top:280px;
    left:10px;
} 
  
    
       p {
      font-size:3vw;        
    line-height: 4vw;
    }
    
#kleinst{
     font-size:6vw;   
    }
    
}