@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,400i');

*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    font-family: 'Roboto', sans-serif;
    }
img {
    width:200px;
    height: auto;
    padding:12px;
}

a {
    text-decoration: none;
    color:#363370;
    font-family: 'Roboto', serif;
    font-weight:;
}

article {
    text-align: center;
    max-width: 50em;
    margin: 0 auto;
}

h1,h2,h4{
    color: #363370;
    font-family: 'Roboto', serif;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
}

.plan h2 {
    margin: 0.5em 0;
    letter-spacing: 0;
}

/*HEADER*/
/*caja contenedora cabecera*/
header {
    display: flex;
    background-color:#f8ba8e;
    width: 100%;
    margin: 0 0;

}

.menu_principal {
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    flex-wrap: wrap;
    padding:0;
    margin: 0;
}

.menu_principal div {
    display: flex;
    margin: 0 0;
}

.menu_principal div a {
    display:flex;
    align-items: center;
    padding: 32px 16px;
}

.menu_principal div a:hover {
    background-color:#363370;
    color:#f8ba8e;
    transition: 0.4s;
}


footer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background: #363370;
    width: auto;
    height: 200%;
    padding: 50px 40px;
}

footer p {;
    color:#f8ba8e;
    text-align: center;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 80%;
}

@media (max-width: 768px){
    header,
    header nav,
    .menu_principal,
    .menu_principal div,
    .menu_principal div a {
    
        display: block !important;
    }
    
    header {
        text-align: center;
    }
    
    .menu_principal {
        text-align: center;
    }
    
    header a {
        padding: 10px 16px !important;
    }
}

/*ROTULO INDIVIDUAL*/
/*MAIN*/
main { 
    margin: 2.9em;
    margin-bottom: 3em;
    max-width: 80em
    }


/*PROFILE*/
/*caja contenedora profile*/
#alumna {
	margin: auto;
	margin-bottom: 2em;
    margin-top: 2em; 
	display: block;
	flex-wrap: wrap;
	justify-content: center;
	max-width: 44em;
	text-align: center;
	padding: 2em;
	color: #CECECE;
	background: #1d1752;
    }

#alumna img {
    width: 100%;
    max-width: 10em;
}

#alumna h2 {
    color:#CECECE;
}
/*imagen profile*/
.profile {
    border-radius: 1em
    }

/*ilana rosenstein*/
h2 {     
    text-align: center;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 900;
    margin-bottom:.5em
    }

/*informacion*/
.edad{
    margin-top: 0.5em;
    font-size: 1.2em
    }


/*MATERIAS AP Y EN CURSO*/
/*caja contenedora materias en curso y aprobadas*/
#estudiantes {
    margin: auto;
    display: block;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 44em;
    text-align: center;
	margin-top: 1em;
	margin-bottom: 2em;
	padding: 2em;
    padding-left: 8em;
    padding-right: 8em;
	color: #CECECE;
	font-style: oblique;
    background: #363370;
    }   

/*titulos materias ap y en curso*/
.encurso, .aprobadas{
    margin-bottom: 0.5em; 
    border-bottom: solid 0.1em; 
    padding-bottom: 0.2em;
    text-align: center; 
    }

/*titulo materias en curso*/
.encurso {
    margin-top: 1.5em
    }

/*texto materias en curso y aprobadas*/
#estudiantes ul li{
	list-style-type: none;
	list-style-image: none;
	color: #CECECE;
	text-align: center;
	font-style: normal;
    font-size: 90%;
    line-height: 1em;
    margin-bottom: 0.5em;
    }


/*EQUIPO DOCENTE Y PAUTAS*/
/*cajas contenedoras equipo docente y pautas*/
#pautas, #docentes { 
    margin: auto;
	display: block;
	flex-wrap: wrap;
	text-align: center;
    margin-top: 3em;
    margin-bottom: 1.5em;
	padding: 2em;
	color: #363370;
	background: #BFBFBF;
    line-height: 1em;
    max-width: 44em;
    }

/*titulo equipo docente y pautas*/
.equipo, .pautas{ 
    margin-bottom: .5em; 
    }

/*textos equipo docente y pautas*/
.docentes, .parrafo { 
    font-size: 1em
    }


/*OTROS ALUMNOS*/
/*caja contenedoras seccion otros alumnos*/
.otrosalumnos {
    max-width: 44em;
    list-style: none;
    padding: 2em;
    text-align: center;
    border-bottom: 1em;
    margin: auto;
    background-color:#363370;
    margin-bottom: 2em;
    }

/*titulo otros alumnos*/
.otros{
    padding: 0.5em;
    margin-bottom: 0.5em;
    font-size: 2em; 
    color: white;
    border: solid 0.1em;
    margin-left: 2em;
    margin-right: 2em;
    text-transform: uppercase
    }

/*cajas contenedoras nombres otros alumnos*/
.otrosalumnos div {
    padding: em;
    border-bottom: 5px;
    margin-bottom: 0.5em;
    background:#fbba8c;
    margin-left: 4em;
    margin-right: 4em;
    }

/*nombres otros alumnos*/
.otrosalumnos div a {
    color:#1d1752;
    font-size: 1.5em;
    text-transform: uppercase;
    font-weight: 600;
    text-decoration: none;
    border-bottom: solid 1
    }




/*MAPA*/
/*caja contenedora imagen mapa*/
.mapa {
    width: 100%;
}


/*PLAN*/
/*caja contenedora main*/
.plan{ 
    
    }

/*titulo pautas para la legibilidad*/
#plan{
    font-size: 2em;
    text-transform: uppercase;
    padding: 0.5em;
    padding-left: 1em;
    padding-right: 1em;
    text-align: center;
    color: #fbba8c;
    border: solid 0.1em #fbba8c;
    }

@media (max-width: 768px) {
    #estudiantes, #otrosalumnos .otrosalumnos {
        padding-left: 1.5em;
        padding-right: 1.5em;
    }
    
    .franco {
        margin: 0 !important;
    }
}