* {margin: 0; padding 0; box-sizing: border-box; text-decoration: none;}
body {background-color:#fff;font-family: arial;}
.contenedor {max-width: 80%; margin: 50px auto;}

header {width: 100%; background-color: #fff; max-height: 150px;}
.h1 {font-size: 20px; width: 100%; max-height: 70px; text-align: center; background: rgb(86,51,148); color: #fff; padding: 10px 0;}

nav {width: 100%; height: 35px; background: rgb(176, 166, 195); padding: 10px 0; margin-top: 5px;}
#navtotal {width: 100%; height: 35px; position: relative; float: left;}
#botonera {width: 100%; height: 35px; position: relative; float: left; padding: 0px;}
.navhalf {width: 50%; position: relative; float: left;}
.botoncito {width: 25%; position: relative; float: left; margin: 0 50px; text-align: center;}
.botonp {}
nav ul li {display: inline-block; color: rgb(86,51,148);}
nav ul li a {color: rgb(86,51,148); font-weight: bold; text-decoration: none;}
a:hover {color: #fff;}

main {position: relative; float: left;}
.mainsection {width: 100%; margin-top: 5px;}
.mainsection article {width: 32.64%; position: relative; float: left;}
.mainsectionspecial {margin: 0 1%;}
.mainsection article a img {width: 100%; position: relative; float: left;}
.boton:hover {background-color: rgb(86,51,148);}
.boton {width: 100%; position: relative; float: left; padding: 8px; background: rgb(176, 166, 195); color: #fff; font-size: 15px; text-align: center; text-decoration: none;}

/*MAPA*/
#mapa {width: 100%; height: auto; position: relative; float: left; margin: 20px 0 40px 0;}
#mapita {width: 100%; padding: 0; position: relative; float: left}
#red {background: none; width: 100%; height: auto; position: relative; float: left; align-content: center;}
.inicio {width: 100%; position: relative; float: left; text-align: center; margin-bottom: 20px;}
.inicio h1:hover {text-decoration: underline;}
.sub {width: 100%; position: relative; float: left; text-align: center; margin-bottom: 30px;}
.principales {position: relative; float: left; width: 25%; text-align: center;}
#mapita h1 {width: 100%; color: rgb(86,51,148); font-size: 18px; font-weight: bold; padding: 2px 0; margin-bottom: 5px;}
.secundarios {width: 100%; position: relative; float: left;}
.secundarios h2 {width: 100%; position: relative; float: left; margin-bottom: 10px; font-size: 15px; padding: 2px 0; color: #000;}
.secundarios:hover h2 {text-decoration: underline;}
.terciarios {width: 100%; position: relative; float: left;}
.terciarios h5 {width: 100%; position: relative; float: left; margin-bottom: 10px; font-size: 12px; padding: 2px 0; color: #000;}
.terciarios:hover h5 {text-decoration: underline;}


#facultaddos {width: 100%; margin: 7px auto 0 auto; position: relative; float: left; font-size: 14px; font-weight: bold; text-align: center; color: rgb(86,51,148); padding: 3px;}

#facultad {width: 100%; margin: 7px auto 0 auto; position: relative; float: left; font-size: 10px; font-weight: normal; color: rgb(176, 166, 195); padding: 3px;}
.columna {width: 32.64%%; justify-content: space-between; position: relative; float: left;}
.columnaspecial {width: 32.64%%; margin: 0 1%; justify-content: space-between; position: relative; float: left;}
h2 {color: rgb(176, 166, 195); font-weight: bold; font-size: 10px;}

footer {font-size: 7px; position: relative; float: left; text-align: center; margin: 50px 0 0 125px; width: 70%;}

h3 {color: rgb(86,51,148); font-weight: bold; font-size: 20px; margin: 20px 0 10px 0; position: relative; float: left; width: 100%;}
#propuesta {font-size: 12px; margin-top: 5px; text-align: justify; text-indent: 20px;}
#texto {margin: 5px 0 50px 0; width: 43%; position: relative; float: left;}
#video {width: 55%; position: relative; float: right; margin: 40px 0 0 0;}
video {width: 100%;}

@media screen and (max-width: 1265px) {
    body {font-size: 16px;}
    .contenedor {max-width: 80%; margin: 50px auto;}
    header {width: 100%; background-color: #fff; max-height: 200px;}
    .boton {font-size: 1.25em;}
    #facultaddos {font-size: 1.313em;}
    h2 {font-size: 1.06em;}
    #facultad {font-size: 0.75em; color: rgb(176, 166, 195);}
    }

@media screen and (max-width: 1013px) {
    body {font-size: 16px;}
    .contenedor {max-width: 80%; margin: 50px auto;}
    header {width: 100%; background-color: #fff; max-height: 90px;}
    .h1 {font-size: 1.68em; max-height: 150px; padding: 10px 0;}
    
    nav {height: 150px; background: none;}
    #navtotal {height: 150px;}
    #botonera {height: 150px;}
    .navhalf {width: 100%; margin: 0 0 7px 0;}
    .botoncito {width: 50%; background-color: rgb(176, 166, 195); padding: 20px 0; margin: auto; border-collapse: separate;}
    nav ul li {display: inline-block; color: rgb(86,51,148); width: 100%;}
    nav ul li a {color: rgb(86,51,148); font-size: 25px; font-weight: bold; text-decoration: none; width: 100%;}
    .botoncito:hover {color: #fff; background-color: rgb(86,51,148);}
    .botonp:hover {color: #fff; background-color: rgb(86,51,148);}
       
    .mainsection {width: 100%; margin-top: 130px;}
    .mainsection article {width: 100%; position: relative; float: left; margin: 10px auto;}
    .mainsectionspecial {width: 100%; position: relative; float: left;}
    .mainsection article a img {width: 100%; position: relative; float: left;}
    .boton {width: 100%; position: relative; float: left; padding: 8px; background: rgb(176, 166, 195); color: #fff; font-size: 1.25em; text-align: center; text-decoration: none;}
    
    #facultaddos {font-size: 1.25em; padding: 3px;}
.columna {width: 100%;}
.columnaspecial {width: 100%;}
#facultad {width: 100%; font-size: 15px; padding: 3px; color: rgb(176, 166, 195); text-align: center;}
h2 {font-size: 0.94em;}

footer {font-size: 12px; margin: 50px auto; width: 100%;}
    
h3 {font-size: 30px; margin: 50px 0 10px 0;}
#propuesta {font-size: 20px;}
#texto {width: 100%}
#video {width: 100%}
    
   }

@media screen and (max-width: 800px) {
.principales {width: 50%; margin-bottom: 30px;}
    #mapita h1 {font-size: 20px;}
.secundarios h2 {font-size: 17px;}
    }

@media screen and (max-width: 400px) {
.principales {width: 100%;}
#mapita h1 {font-size: 22px;}
.secundarios h2 {font-size: 19px;}
    }