@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@200;300;400; 500;600;700;800;900&display=swap');


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

/* Estilos generales */
body{ font-family: Roboto; }
header{ color: black; background: #ffffff; padding: 0rem; }

.foto{width: 100% ;border-radius: 0 }
.contenedor1{
    position: relative;
    display: inline-block;
    text-align: center;  display: flex; justify-content: space-around; 
}
 
.centrado1{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-family: 'Roboto';
    font-weight: 200;
    font-size:3rem;
    text-shadow:0.1em 0.1em 0.1em black;
 }
main article {padding: 1rem;   }
main section article{ padding: 1rem;  }


.grupo {text-decoration: none}
.inicio{}
.columna-1{background: #ffffff; display: flex; justify-content: center; margin-top: 3rem;   }
.columna-2{background: black;  justify-content: center; text-align: center  }
.columna-3{background: ; width: 100%; text-align: center; border-top: 0.25px solid; color: black;    }
.columna-4{background: white; width: 100%; text-align: center; border-top: 0.25px solid;  }
.profesion{ display: flex; justify-content: center; margin-bottom: 3rem; margin-top: 0.5rem; letter-spacing: 0px}
.mapa{justify-content: center; text-align: center; color: black; margin-top: rem; font-size: 2rem; font-weight: 900; }
.tp{justify-content: center; text-align: center; color: black; margin-top: 0rem; font-size: 2rem; font-weight: 900; }
.fotomapa{ margin-top: 2rem}
.at{margin-top: 0.8rem}
.at1{margin-top: 0.8rem}
.bt{margin-top: 0.8rem}
.ct{margin-top: 0.8rem}
.dt{margin-top: 0.8rem}
.et{margin-top: 0.8rem}
.ft{margin-top: 0.8rem}
.plan{justify-content: center; text-align: center; color: black; margin-top: 0rem; font-size: 2rem; font-weight: 900;  }
.columna-plan{justify-content: center; text-align: center; border-top: 1rem; border: 1px solid black; border-radius: 2rem; margin: 1rem; padding: 2rem   }
.columna-plan p{border-bottom: 0.25px solid; border-width: 1px; margin-bottom: 1rem   }


section article {}
footer{ background: #a09f99; padding: 1rem; }
footer p{ font-size: 0.7rem; color: white; font-family: 'Roboto', sans-serif; font-weight: 300; text-align: center;}

/* Menu */
nav{ background: #a09f99; padding: 0rem;  }
nav ul {display:flex; justify-content: space-around;}
nav ul li{ display: inline-block; font-size: 1rem; }
nav ul li a{ color: white; text-decoration: none; padding: 1rem; }
.link-activo{background: black;  }


h1 {font-family: 'Roboto', sans-serif; font-size: 1.5rem; font-weight: 900;  }
h1 a{font-family: 'Roboto', sans-serif; font-size: 3rem; font-weight: 200; text-decoration: none; color: white}
h2 {display: flex; justify-content: center; font-family: 'Roboto', sans-serif; font-size: 1.5rem; font-weight: 900; margin-bottom: -1rem; letter-spacing: 5px; color:#041127 }
h3 {display: flex; justify-content: center; font-family: 'Roboto', sans-serif; font-size: 1.2rem; font-weight: 500; color:  white}

.nombret{font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 500; margin-top: -1rem}
.nombrett{color:black;}
h4 {font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 500; margin-top: 1rem; color: black}

h5 {font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 500; margin-top: 1rem;  }

h6{font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 500; margin-top: 2rem;  }

article p {font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 300; margin-bottom: 0rem; }


.descripciont{font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 500; margin-top: 0 }
.destinatariot{font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 500; margin-top: 1rem }
.objetivot{font-family: 'Roboto', sans-serif; font-size: 1rem; font-weight: 500; margin-top: 1rem; }

/* Menú desplegable alumnos */
ul {list-style: none;}
.nav > li {float:left;}
.nav li a { background-color:#a09f99;
			color:white;
			text-decoration:none;
			padding:8px 12px;
			display:block; }

.nav li a:hover { color:#fff; font-size: 105%; transition: all 500ms ease;}
			
.nav li ul {	display:none;
				position:absolute;
				min-width:140px; }
			
.nav li:hover > ul {
				display:block; }
			
.nav li ul li { display: flex; flex-direction: column; 
				position:relative;	}
			
.nav li ul li ul {
				right:-140px;
				top:0px; }

.nav li a:hover {
    background-color:#a09f99;}



/* Cuando es mayor a 768px */

@media screen and (min-width:48rem) {
    
    nav{ background: black; }
    
    .inicio{display: flex; }
    .columna-1{background: #ffffff; }
    .columna-2{background: gray; }
    .columna-3{background: white; width: 50%; color: black}
    h4{color:black;}
    .columna-4{color: white; background:  black
    ; width: 50%; }
    .foto{width: 100% ;border-radius: 0 }
    .link-activo{background: transparent; }
    
.nav li a { background-color:black;
			color:white;
			text-decoration:none;
			padding:10px 12px;
			display:block; }
.columna-plan{justify-content: center; text-align: center; align-items: center; margin-left: 30%; margin-right: 30%; }