* {margin: 0; padding: 0}
body {background-image: url(imagenes/pattern.jpg); font-family: 'Josefin Sans', sans-serif; max-width: 960px; margin: 0 auto 0 auto;}


header{width: 100%; height: 260px; margin-top: 30px;}
.nombre {background: #FCCEDB; width: 100%; height: 185px; padding-top: 6px}
header h1 {color: #687FA9; width: 26%; height: 45px; margin: 0 auto 0 auto; padding-top: 100px}
header nav {background: #687FA9; margin-top: 15px; height: 31px; padding-top: 10px;width: 100%;}
header nav ul {list-style-type: none;}
header nav ul li {display:inline;}
header nav ul li a { color: #F6CED6; text-decoration: none; font-weight: bold; margin-left: 17%;}
a {text-decoration: none; }


main {background: #fff; width: 100%}
section {background: #fff; height: 800px; width: 80%; position: relative; float: left; }
.sobremi { height: 200px; padding-bottom: 10px; padding-top: 10px; background: #fff; }
.foto {position: relative; float: left; border-radius: 101px; }
.a1 {padding-left: 220px; padding-top: 70px;}
.materias {height: 125px; background: #fff; padding-left: 30px; margin-top: 10px; padding-top: 30px;}
.propuesta {height: 240px; background: #fff; padding-left: 30px; margin-top: 10px; padding-top: 30px; padding-right: 30px}
article li {text-decoration: none; list-style-type: none; margin-top: 20px; box-sizing: border-box; height: 50px;}
article li a {background-color: #FCCEDB; border-radius: 2px; color: #687FA9}

aside {width: 20%;background: #e2e2e2; position: relative; float: right; height: 800px; }
.alumnos {  margin-top: 10%; margin-left: 10%;}
.margintop20 {margin-top: 20%}



.titulogrande {color: #687FA9; font-weight: bold;}
.titulos {color: #B08692; }
.texto {color: #000; font-family: Arial, sans-serif; font-size: 11px; }


.separador {clear: both; width: 100%}
footer { background-color: #fff; text-align: center; font-size: 12px; color: black; font-weight: bold; width: 100%; }



 /*RESPONSIVE TELEFONO*/
@media screen and (max-width: 320px){
    
    *{transition: 1s}
    .r320 {display: none}
    .r320si {display: inline}
    
    header nav ul li a {margin-left: 2%;}
    section {width: 100%}
    .aside-r320 {width: 100%; background: #e2e2e2; height: 293px;}
    
     


}