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

*{padding: 0; margin: 0;box-shadow: border-box; transition: 1s all; }

/* estilo index*/
/* Estilos generales */
body{ font-family: Arial; }
header{ color: #1F618D; background-color: transparent; background-image: url(https://hypermedia.aq.upm.es/wp-content/uploads/2020/04/abstract-background-colors.jpg);}
    
    
    padding-left: 1rem;padding-top: 1rem;padding-bottom: 1rem} 


main section aside{ background: #e7a9f5; padding: 0.5rem; }

h1 { font-family: 'Quicksand', sans-serif; font-size: 2.5rem; font-weight: 700; padding: 4rem;}
h2{ font-family: 'Quicksand', sans-serif; font-size: 1.2rem; font-weight: 500;padding:0.5rem 0 0.8rem 0.3rem}
h3 { font-family: 'Quicksand', sans-serif; font-size: 1.5rem; font-weight: 500;padding-left: 1rem}
h4 { font-family: 'Quicksand', sans-serif; font-size: 0.9rem; font-weight: 500;padding-bottom: 0.2rem}

.inicio{ display: flex; }
.columna-1{ background: #b0dfeb; width: 33%; }
.columna-2{ background: #b0ebc2; width: 33%; }
.columna-3{ width: 33%; }
.estudiantes {padding-left: 0.5rem;}
.datos p {padding: 1rem; font-size:1rem}
 .datoscatedra {padding-left: 0.3rem; }
  h4{font-size:1.2rem;font-weight: 700;}
        .datoscatedra p{font-size:1rem;padding: 0.5rem;} 


footer{ background: #ffcce6; padding: 1rem; }
footer p{ font-size: 0.8rem; color: #7d7b85; font-family: 'Quicksand', sans-serif; font-weight: 700; text-align: center; }

/* Menú */
nav{ background: #e7a9f5; padding: 1rem; } 
nav ul li{ display: inline-block;} 
nav ul li a{ font-size:1.4rem;color: #1F618D; text-decoration: none; padding: 1rem;}
.link-activo{ background: #c0cdfa; } 
.estudiantes p {font-size:1.2rem;padding: 0.5rem;}


/*estilo plan*/
 .plan h2 {font-size:1.6rem;font-weight: 700; padding-left:2.5rem; padding-top: 1rem; background: rgba(230, 204, 235, 0.87);}
 .app{font-size:1.2rem;padding: 1.5rem 0 1.5rem 1.5rem;}
  .objetivo {font-weight: 700;}
    
/*estilo mapa*/

.mapa h2{font-size:1.6rem;font-weight:700; background: rgba(230, 204, 235, 0.87); padding-left: 2.5rem;padding-top: 1rem;}
img {padding-top: 0.5rem;padding-left: 0.2rem; width: 25rem;height: 30rem;}
.linkmiro{ text-decoration: none; padding: 1rem; padding-top: 1rem; font-size: 1.8rem; font-weight: 700; color: #ff20a9;} 
.titulomapa{font-size: 1.5rem; background-color: #c080ff; margin-bottom: 1rem;}

/*estilo index mayor a 768px*/
    @media screen and (min-width:48rem) {
        .columna-1{ width: 33.33%; background-color: #d495fc; }
        h1 {font-size:4rem;text-align: center; color: #7feded; }
        nav{ background: #b5b0e0;text-align: center; } 
        nav ul li a{font-size:1.3rem;padding:1rem; }
            .columna-2{ width: 33.33%; background-color: #89dddd; }
        h2 {font-size:1.rem; font-weight: 700; padding: 1rem; padding-left: 1rem; }
      .estudiantes {padding-left: 0.5rem;} 
        .estudiantes p {font-size: 1.5rem; font-size: 1.5rem; padding: 1.5rem; padding-left: 1rem; color: #ff00c4;font-family: 'Quicksand', sans-serif; }
        .estud1 {color:#ff00aa;}
        .estud2 {color:#9d00ff;}
        .estud4 {color:#ff5c06;}
        
        
         h3{font-size:1.5rem;font-weight: 700;padding: 0.8rem; }
    .datos {padding-left: 0.5rem; }
    .datos p {padding: 0.5rem;font-size:1.2rem;}
         .columna-3{ width: 33.33%; height: 24rem; padding-top: 1rem; background-color: #d495fc;}
    .datoscatedra {padding-left: 0.3rem; }
        h4{font-size:1.5rem;font-weight: 700;}
        .datoscatedra p{font-size:1rem;padding: 0.3rem;} 
        
}
/*estilo plan - *mayor a 768px*/
        @media screen and (min-width:48rem) {
        .plan h2 {font-size:2.5rem;font-weight: 700; padding-left:2rem; background: rgba(137, 98, 199, 0.69);}
       .app {font-size:1.4rem; padding: 1.5rem 1.5rem 1.5rem 1.5rem; background-color: #f8a9ff;}
        .objetivo {font-weight: 700; font-size: 1.5rem;}
            .video {display: block; width: 100%; height: 0; padding-bottom: 56.25%; position: relative; }
            .video iframe{ display: block; position: absolute; height: 100%; width: 100%;}
            
            
            
        }
/*estilo mapa - *mayor a 768px*/
@media screen and (min-width:48rem) {
.mapa h2{font-size:2rem;font-weight:700; background: rgba(230, 204, 235, 0.87);padding-left: 2rem; }
img {width: 38rem;height:48rem; padding-left: 10rem;padding-top: 2rem; }
}

        
/* estilo index menor a 400px*/
@media screen and (max-width:25rem) {
    .columna-1 { width: 30%; }
    h1{font-size:2.5rem; } 
    h2 {font-size:0.7rem;padding:0.5rem; }
    .estudiantes {padding-left: 0.5rem; }
.estudiantes p {padding: 0.5rem;font-size:0.8rem;}
    .columna-2{ width: 40%; }
    h3{font-size:1rem;font-weight: 500;padding-left: 0.8rem;padding-top: 0.5rem;}
    .datos {padding-left: 0.3rem; }
    .datos p {padding: 0.5rem;font-size:0.8rem}
    h4 {font-size:0.9rem;font-weight: 500; }
 
    .columna-3{ width: 30%;}
    .datoscatedra {padding-left: 0.3rem; }
    .datoscatedra p{font-size:0.9rem;padding: 0.3rem;} 
    footer{background: rgba(244, 139, 192, 0.65); padding: 0.3rem;}
    
    footer p { font-size: 0.7rem; text-align:justify; }
}
    
/*estilo plan - menor a 400px*/
    @media screen and (max-width:25rem) {
     .plan h2 {font-size:2rem;font-weight: 700; padding-left:2rem; background: rgba(230, 204, 235, 0.68);}
       .app{font-size:1.1rem;padding: 1rem 1rem 1.5rem 1.5rem;;text-align: justify}
        .objetivo {font-weight: 700;}
     footer{background: rgba(244, 139, 192, 0.65); padding: 0.3rem;}
    
}
/*estilo mapa - menor a 400px*/
 @media screen and (max-width:25rem) {
     .mapa h2{font-size:1.6rem;font-weight:700; background: rgba(230, 204, 235, 0.68); padding-left: 2.5rem;padding-top: 1rem;}
img {padding-top: 0.5rem;padding-left: 0.2rem; width: 23rem;height: 25rem;}
}