.hide{
    display: none;
}

body {
    background-color:rgba(255, 255, 0, 0.7);
    font-family: 'Heebo', sans-serif;
    color: #293462;
}

main, header, footer{
    /*background:blue;*/
    /*Tamaño*/
    width: 90%;
    /*Centrar*/
    margin:25px auto;
}

h1{
    font-size: 35px;
    text-align: center;
}

h3{
    font-size: 20px;    
}

.caja-central{
    /*Tamaño*/
    background:#FFFFFF;
    width: 30%; /*CUANDO COLOCAS EN %, quiere decir tomará de cualquier tamaño de la pantalla su 30 %*/
    height: 500px; /*CUANDO COLOCAS EN PX, es estatico, no es responsive*/
    margin: auto; /*Centrar la caja*/
    
    /*Borde*/
    border-style: solid;
    border-color: #B8AFAF;
    border-width: 3px;
    /*Espacio entre lineas*/
    line-height: 45px;
    /*Centrado*/
    text-align: center;
    /*Fuente*/
    color: #216583;
}
.intro-fin{
    height: 370px;
}
.cabecera{
    /*Tamaño*/
    background: #293462;
    width: 100%;
    height: 50px;
    /*Para H2: Fuente*/  
    font-size: 20px;
    color: #F7BE16;
}
.button-central{
    /*Tamaño*/
    background: #216583;
    width:200px;
    height: 30px; 
    /*Fuente*/
    color: #F7BE16;
    font-family: 'Heebo', sans-serif;
    font-size: 15px;
    /*Borde*/   
    border: none;
    /*Para que salga la manito*/
    cursor: pointer;  
}
.agrupacion{
    /*Tamaño*/
    width: 90%;
    margin: auto;
    /*Borde*/
    border-style: solid;
    border-color:#C12727;
    border-width: 2px;
    border-radius: 15px;
}
input{
    /*Tamaño*/
    width: 90%;
    height: 30px;
    /*borde*/  
    border: 1px solid #B8AFAF;
    border-radius: 4px; 
    /*Fuente*/
    font-family: 'Heebo', sans-serif;
    font-size: 16px;
}
.resultado{
    color: #C12727;
}
.button-cambio{
    /*Tamaño*/
    background: #293462;
    width:100px;
    height: 20px; 
    /*Fuente*/
    color: #F7BE16;
    font-family: 'Heebo', sans-serif;
    font-size: 13px;
    /*Borde*/   
    border: none;
    /*Para que salga la manito*/
    cursor: pointer;  
}
a{
    color:#C12727;
    font-weight: bold;
    text-decoration: none;    
}
.mensaje{
    font-size: 35px;
    margin: 45px 15px;
}
.pie{
    font-size: 15px;
    text-align: center;
}