*{
    padding: 0;
    margin: auto;
}

body,  html{
    height: 100%;
}

header{
    /*background: green;*/
    height: 20%;
}

#menubar {
    background: gray;
    height: 4.3%;
}

main{
    /*background: red;*/
    height: 55.7%;
}

/* *** FORMULARIO *** */

.contenido{
    width: 100%;
    height: 100%;
    padding: 10px;
    overflow:auto;
}

.contenido h1{
    text-align: center;
    margin-top: 30px;    
    color: royalblue;
}

.contenido h2{
    text-align: center;
}



/* *** FORMULARIO *** */

footer{
    background: blue;
    height: 24%;
}



@media only screen and (min-width : 200px) and (max-width : 800px)
{
    
    body, html {
        width: 100%;
    }
    
    /*.header_section{
        z-index: 5;
        background: url(../imagenes/headerresize.jpg);
        height: 100%;
    }*/
    
    
    .logo{
        width: 100%;
    }
    
    header{
        height: 8.5%;
    }  
    
    .contenido{
    }
    
    main{
        height: 67.2%;
    }