*{margin:0; padding:0; text-decoration: none; list-style: none;}
body {width: 100%; margin: 0 auto; background-color: #ffffff;font-family: arial;}
#banner {width: 100%; height: 110px; overflow: hidden;}
#nombre {position: absolute; width: 20%; left: 330px;}
#contenedor {width: 68%; margin: 0 auto; align-content: center;}
/*Encabezado*/
header {width: 11%; height: 100px; position: relative; float: left; margin: 30px 30px 0 0; padding-left: 20px;}
.botonp {position: relative; float:right; margin: 0 0 5px 0; width: 100%; text-align: center;display: block; background-color:#e61818; padding: 8px; list-style: none;color: #000; font-size: 9px; font-weight: bold;}
.botonp:hover {color:#e61818; background-color: #fff;}
.botonpv {color:#000000; background-color: #fff; display: block; padding: 8px; list-style: none; font-size: 9px; font-weight: bold; position: relative; float:right; margin: 0 0 5px 0;}
.equipo {position: relative; float:right; width: 100%; text-align: center;display: block; background-color:#ffffff; padding: 8px; list-style: none;color: #e61818; font-size: 9px; font-weight: bold;}
.equipo:hover {text-decoration: underline;}
.equipo2 {position: relative; float:right; width: 100%; text-align: center;display: block; background-color:#ffffff; padding: 8px; list-style: none;color: #e61818; font-size: 9px; font-weight: bold; margin-bottom: 20px;}
.equipo2:hover {text-decoration: underline;}
h5 {font-size: 11px; font-weight: bold; position: relative; float: right; color:#e61818; text-align: center; width: 100%; margin: 20px 5px 10px 0;}
h6 {font-size: 11px; font-weight: bold; position: relative; float: right; color:#e61818; text-align: center; width: 100%; margin: 0 5px 10px 0;}

/*Principal*/
main {width: 60%; overflow: hidden; position: relative; float: left; margin: 30px 0 0 0; align-content: center;}
.vilomale {width: 70%;}
.vilomaleo {width: 35%;}
#propuestamale {width: 80%;}

/*Costado izquierdo*/
aside {width: 37%; float: left; position: relative; float: left;}
aside img {width: 100%; border-radius: 100%;}
.estudiante {font-size: 15px; margin-top: 10px; text-align: center; font-weight: bold;}
#portfolio {text-align: center; margin-top: 27px;}
#behance {color:#e61818; font-size: 12px; border: 1.5px; border-color:#e61818; border-style: dashed; padding: 7px;}
#behance:hover {color:#000000; border: none;}

/*Centro*/
.materias {width: 23%; position: relative; float: left; margin-left: 30px;}
h3 {font-size: 16px; font-style: bold; color:#e61818; margin-bottom: 20px;}
h4 {font-size: 14px; font-style: bold; color:rgb(230, 24, 24); margin-bottom: 10px; margin-top: 15px;}
section ul li {font-size: 10px; font-style: normal; color: #646464; margin-top: 2px;}

/*Derecha*/
.propuesta {width: 31%; position: relative; float: right;}
.dgpc {font-size: 11px; text-align: left; margin-bottom: 10px; color: #646464;}
h7 {font-size: 14px; text-align: left; font-weight: bold; color: rgb(230, 24, 24);}

/*Pie de página*/
footer {width: 100%; height: 50px; border-top: solid 1px; border-top-color: #d3d3d3; position: relative; float: left; margin-top: 60px;}
.foot {text-align: center;font-size: 7px; color: #b5b5b5; width: 100%; height: 50px; border-top: 20px; border-top-color: black; margin: 20px auto 0 auto;}

@media screen and (max-width: 938px) {
                transition: 1s;
                #nombre {width: 80%; position: absolute; left: 200px;}
                .botonp {list-style: none; text-align: right; color: #000; font-size: 9px; font-weight: bold; background-color: #fff;}
                .botonp:hover {color:#e61818; background-color: #fff;}
                .equipo {list-style: none; text-align: right; color: #e61818; font-size: 9px; font-weight: bold; background-color: #fff;}
                .equipo:hover {color:#e61818; background-color: #fff;}
                .equipo2 {list-style: none; text-align: right; color: #e61818; font-size: 9px; font-weight: bold; background-color: #fff;}
                .equipo2:hover {color:#e61818; background-color: #fff;}
                aside p {font-size: 13px;}
    .materias {width: 54%;}
    .propuesta {width: 90%; position: relative;float: left; margin-top: 20px;}
    h6 {text-align: right;}
}

@media screen and (max-width: 827px) {
                transition: 1s;
                body {width: 436px;}
                #contenedor {width: 68%; margin: 0 auto;}
                #banner {display: none;}
                #nombre {position: relative; width: 70%; float: left; left: 60px;}
                header {width: 100%; height:600px; padding: 0;margin-right: 0;}
    nav {width: 100%;}
    aside {width: 100%; margin: 250px auto 0 auto; align-content: center; ma}
    img {width: 100%;}
                .botonp {position: relative; float:left; margin: 0 0 15px 0;display: block; padding: 20px; list-style: none; text-align: center; color: #000; font-size: 15px; font-weight: bold; background-color: #e61818; justify-content: center;}
                .botonp:active {color:#ffffff; background-color: #6d0808;}
                .equipo {position: relative; float:left; margin: 0 20px 15px 0; display: block; padding: 20px; list-style: none; text-align: center; color: #e61818; font-size: 12px; font-weight: bold; background-color: #ffffff; justify-content: center;}
                .equipo:active {text-decoration: underline;}
                .equipo2 {position: relative; float:left; margin: 0 20px 15px 0;display: block; padding: 20px; list-style: none; text-align: center; color: #e61818; font-size: 12px; font-weight: bold; background-color: #ffffff; justify-content: center;}
                .equipo2:active {text-decoration: underline;}
                .materias ul li {font-size: 13px;}
                main {width: 100%; margin-bottom: 100px;}
                aside {width: 100%; margin: 0px;}
                .estudiante {font-size: 25px;}
                #portfolio {margin-top: 70px;}
                #behance {color:#e61818; font-size: 20px; border: 3px dashed; padding: 12px;}
                .materias {width: 100%; margin-top: 70px; margin-left: 0;}
                .propuesta {width: 100%; margin-top: 70px;}
                h3 {font-size: 22px; margin-bottom: 40px;}
                h7 {font-size: 17px;}
                h4 {font-size: 17px; margin-bottom: 15px; margin-top: 30px;}
                h5 {display: none;}
                h6 {display: none;}
                .dgpc {font-size: 13px;}
                materias ul li {font-size: 15px; color: #000000; margin-top: 7px;}
                footer {display: none;}
                #propuestamale {width: 100%; margin-bottom: 100px;}
                .vilomale {margin-left: 70px;}
                
}