/* Fuente Montserrat */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&display=swap');

/* Estilos Generales */

p {
    font-family: 'Montserrat', sans-serif; font-weight: 600;
    font-size:1.2em; color:#111111; line-height:1.7em; text-align:center;
    }
span {
    font-family: 'Montserrat', sans-serif; font-weight: 700;
    font-size:2em; display: inline-block;  vertical-align:middle; padding-left: 10px; padding-bottom: 40px;
    }
.logo { max-width:100%; height:auto; margin:20px auto; display:block; }
.info { width:60%; height:auto; margin:3% auto 4% auto; }
.contacto { width:60%; height:auto; margin:4% auto; }
.bloque-izquierda { float:left; width:40%; height:auto; margin:0 auto; text-align: left; }
.bloque-derecha { float:right; width:40%; height:auto; margin:0 auto; text-align: right; }

/* Media Queries para PANTALLA GRANDE */

@media screen and (min-width: 1024px) and (max-width: 1280px) {

span { font-size:1.7em; }
.info { width:70%; height:auto; margin:3% auto 4% auto; }
.contacto { width:70%; display:block; margin: 50px auto 0 auto; padding: 0; }
.bloque-izquierda { float:left; width:35%; height:auto; margin:0 auto; text-align: left; }
.bloque-derecha { float:right; width:35%; height:auto; margin:0 auto; text-align: right; }

}

/* Media Queries para PANTALLA MEDIANA */

@media screen and (min-width: 480px) and (max-width: 1024px) {
 
span { font-size:1.6em; }
.info { width:90%; height:auto; margin:3% auto 4% auto; }
.contacto { width:90%; display:block; margin: 50px auto 0 auto; padding: 0; }
.bloque-izquierda { display: flex; justify-content: center; float: none; width:60%; height:auto; margin:0 auto; text-align: left; }
.bloque-derecha { display: flex; justify-content: center; float: none; width:60%; height:auto; margin:0 auto; text-align: left; } 
  
}

/* Media Queries para PANTALLA PEQUEÑA */

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

  p { font-size:0.9em; }
  span { font-size:1.1em; }
  .logo { max-width:60%; }
  .info { width:90%; height:auto; margin:3% auto 4% auto; }
  .contacto { width:100%; display:block; margin: 50px 0 0 0; padding: 0; }
  .bloque-izquierda { display: flex; justify-content: center; float: none; width:90%; height:auto; margin:0 auto; text-align: left; }
  .bloque-derecha { display: flex; justify-content: center; float: none; width:90%; height:auto; margin:0 auto; text-align: left; }   

}