/* MediaQueries*************************************/



@media screen and (max-width: 900px){
   
    .headerClass h1{
        display: block;
        text-align: center;
        margin: 0;
        padding: 0.3em;
    }

    .headerClass h3{
        display: block;
        text-align: center;
        padding-bottom: 0.3em;
    }

    .lat{
        display: none;
    }
    
}

@media screen and (max-width: 820px){
   
    .comment h2{
        font-size: 1.3em;
    }

    .comment p{
        font-size: 0.9em;
    }
    
}

@media screen and (max-width: 730px){
    th,td{
        padding: 0.7em 2.5em;
    }
}


@media screen and (max-width: 650px){
    .contact h4{
        font-size: 1.2em;
    }

    .contact p{
        font-size: 1em;
    }

    .contact{
        flex-basis:  49.5%;
        height: 22em;
    }
    
    
}


@media screen and (max-width: 600px){
    
    .comment h2{
        font-size: 1em;
        text-align: center;
    }

    .comment p{
        font-size: 0.9em;
        text-align: center;
    }
    
    th,td{
        padding: 0.7em 1.5em;
    }

    
}

@media screen and (max-width: 520px){
    
    .headerClass h1{
        font-size: 2em;
    }

    .headerClass h3{
        font-size: 1.2em;
    }

    .btn p{
        padding: 0.4em 0;
    }

    
}

@media screen and (max-width: 420px){
    
    .btn{
        top: 88%;
    }

    .btn p{
        padding: 0.4em 0;
    }

    .headerClass h1{
        font-size: 1.6em;
    }

    .headerClass h3{
        font-size: 1em;
    }

    li{
        font-size: 0.8em;
    }

    table{
        font-size: 0.8em;
    }

    th, td {
        padding: 0.7em 1em;
    }

    .contact{
        height: 22em;
    }
    
}

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

    .contact{
        height: 30em;
    }
    
}