/*MEDIA QUERIES*/
@media screen and (max-width:1200px) and (min-width:1061px){
    body{max-width:none; margin:0;}

    div#wrapper .main {
        float:left;
        margin:10px 0;
        max-width: 75%;
        height:auto;
        }

        .main .content#sec2{
            width:30% 
            }
        .content#sec3{
            max-width:30%;
            }   
}


@media screen and (max-width:1060px) and (min-width:939px){
    body{max-width:none; margin:0;}

    div#wrapper .main {
        float:left;
        margin:10px 0;
        max-width: 70%;
        height:auto;
        }

    div#wrapper .main .content#sec2{
            max-width:45%;
            }
    div#wrapper    .content#sec3{
            max-width:40%;
            }   
}

@media screen and (max-width:940px) and (min-width:745px){
    body{max-width:none; margin:0;}

    main.main .content#sec2, main.main .content#sec3, main.main .content#sec1{
            float:none;
            width:auto;
            margin:0;}
        
    main.main{width:70%; margin:0;}

    main.main .content#sec3, .content#sec3 p, .content#sec3 h5, .content#sec3 h4{
        float:none;text-align:center;max-width:none;}

    main.main .content#sec3 img, main.main .content#sec5 img{
        text-align:center;
        width:100%;
        outline:none;
        height:auto;
        display:block;
        margin:0;}
    nav.nav{
        margin-top:0;
        width:30%;
        margin:0;}
    /*galerie*/
    section.content#sec3 ul.galery li{
        width:31.8%;
        border-left:1px solid transparent;
        border-bottom:1px solid transparent;
        }
}

@media screen and (max-width:744px) and (min-width:481px){
    body{
        float:none; max-width:none;
        margin:auto;
        }

    main.main .content#sec2, main.main .content#sec3, main.main .content#sec1, nav.nav{
        float:none; width:auto;}
        
    main.main{
        max-width:none;}

    main.main .content#sec3, .content#sec3 p, .content#sec3 h5, .content#sec3 h4{
        float:none;
        text-align:center;
        max-width:none;
        margin:0;}

    main.main .content#sec3 img, main.main .content#sec5 img{
        text-align:center;
        width:100%;
        outline:none;
        height:auto;
        display:block;
        margin:0;}

    nav.nav{
        margin-left:-10px; margin-top:0;}

    h1{ padding-right:20px;
            font-size:1.9em;
        }
    /*Bildergalerie*/
    section.content#sec3 ul.galery li{
        width:31.9%;
        border-bottom:1px solid transparent;
        }

}



@media screen and (max-width:480px){
    html{
        background:#81C4F7
        }
   
    body{
        margin-top:50px;
        background:#81C4F7;
        float:none;
        }

    nav {
        background:#81C4F7;
        position:fixed;
        top:-10px;
        padding-top:10px;
        margin:0;
        left:-10px;
        right:0;
        }

    div#wrapper{
        margin:0;
        padding:0;
        float:none;
        width:100%;
        }

   /*HAMBURGER*/
   nav a.open{
    display:block;
    text-align: right;
    padding-right:20px;
         }

    nav a.close{
     display:none;
     }

    #open:target ~ .close{
     display:block;
     text-align: right;
     padding-right:20px;
     }
    
    #open:target {
     display:none;}
    
    /*Navi verstecken*/
    #open:target ~  #resp-menu,
    #resp-menu{
     overflow:hidden;
     max-height:0;
     transition: 0.5s ease-in; 
     width:auto;
     border:none;
     }

    /*Navi einblenden*/
    #open:target ~  #resp-menu{
     max-height:50em;transition: all 1s ease-in-out;
     }

    /*-------------*/

    .main{float:none;
    margin:0;
    padding:0;
    width:100%;
    height:auto;}

    main.main .content#sec2{
        float:none;
        width:auto;
    }
    
    main.main .content#sec3{
        float:none;
        text-align:center;
        max-width:none;
        /* margin-top:0px; */
        margin:0;
        height:auto;
    }

    main.main .content#sec3 img, .content#sec3 p, .content#sec3 h4, .content#sec3 h5, main.main .content#sec5 img{
        text-align:center;
        width:100%;
        outline:none;
        height:auto; 
        display:block;
        margin:0;
        }

    h1{ padding-right:20px;
        font-size:1.7em;
    }
    div.requiredvalidate p.required {
        padding-left:0px;
        }
    section.content table{
        width:auto;
        font-size:.9em;
        }
}