body{font-family: 'Nexa Slab Regular' !important;height:100vh;margin:0;width:100vw;background: url(../img/fondo.jpg) no-repeat fixed center;overflow-x: hidden;background-size: cover;}
area{cursor: pointer;}
img#logoUAH{width:18%;position: absolute;left: 2%;top: 7%;}
div#contenedorGeneral{position: relative; top: 13%;}
div#contContenido{background-color: rgba(0, 27, 68, 0.5);border-radius: 60px;opacity: 0;width: 80%;padding: 2%;position: relative;left: 8%;margin-bottom: 2%;color: white;margin-top: 5%;}
div#contCursos{left: 10%;width: 30%;position: absolute;font-size: 1.8vw;}
div#contFormulario{margin-top: 6%;width: 50%;float:left;}
div#contFormulario2{margin-top: 6%;width: 50%;float:right;}
div#contFormulario h2, div#contFormulario2 h2{color: white;text-align: center;font-size: 2vw;}
div#titulo{color: white;font-family: "Nexa Slab Regular";font-size: 2vw;text-align: center;width: 100%;position: relative;top: 40%;opacity:0;}
div#titulo span{font-family: "Nexa Slab Bold";font-size: 3.2vw;}
div.contenidos{display:none;}
div.contenidos h1{text-align: center;width: 100%;margin-bottom: 5%;font-size: 3.5vw;color: #ff6600 !important;}
div.contenidos h2{text-align: center;width: 100%;font-size: 2.5vw;color: #ff6600 !important;}
div.contenidos h5, div.contenidos ul{font-size: 1.3vw;}
div.cursos{font-family: "Nexa Slab Regular";padding: 3%;color: white;border-radius: 60px 60px 60px 60px;cursor:pointer;position: relative; transition-duration: 0.9s;}
div.cursos:hover{background: rgba(0,0,0,0.5);color: white;}
div.cursos span{font-family: "Nexa Slab Bold";}
div.cursos img.flecha{position: absolute;right: 15%;width: 10%;top: 40%;}
form{color: white;width: 70%;font-size: 1.5vw;margin-left: 15%;margin-top: 2%;}
form h4{font-size: 1.2vw;text-align: center;}
img#programa, img#programa1, img#programa2, img#programa3, img#programa4, img#programa5{width: 72%;margin-left: 14%;opacity:0;}
textarea{font-family: 'Nexa Slab Regular' !important; min-height: 29%; max-width: 100%; min-width: 100%;}
.seleccionado{background: rgba(0,0,0,0.6) !important;color: #ff6600 !important;border-radius: 60px 0px 0px 60px !important;}
.seleccionado span{color: white !important;}
.flechaSeleccionado{transition-duration: 0.8s;transform: rotate(-94deg);-webkit-transform: rotate(-94deg);}
.flechaDeseleccionado{transition-duration: 0.8s;transform: rotate(0deg);-webkit-transform: rotate(0deg);}


@import url('https://fonts.googleapis.com/css?family=Inconsolata|Lato:300,400,700');
.links {font-size: 2em;font-weight: 300;}
.links > a {color: white;padding: 4%;font-size: 1.1vw;text-align: center;text-decoration: none;transition: all .5s;}
.links > a:hover {color: #000;}
.links > .line {background: #FFF;height: 3px;pointer-events: none;}
#header {position: fixed;top: 0;left: 0;right: 0;z-index:1;width: 100%;background-color: #FF6600;background-image: linear-gradient(to bottom, #0003, transparent);border-bottom: 1px solid #0003;box-shadow: 0 0 32px #0003;}
.links {display: inline-grid;grid-template-columns: repeat(var(--items), 1fr);position: relative;}
.links > .line {opacity: 0;transition: all .5s;position: absolute;bottom: 0;left: var(--left, calc(100% / var(--items) * (var(--index) - 1)));width: var(--width, calc(100% / var(--items)));--index: 0;}
.links > a:hover ~ .line {opacity: 1;}
.links > a:nth-of-type(1):hover ~ .line { --index: 1; }
.links > a:nth-of-type(2):hover ~ .line { --index: 2; }
.links > a:nth-of-type(3):hover ~ .line { --index: 3; }
.links > a:nth-of-type(4):hover ~ .line { --index: 4; }
.links > a:nth-of-type(5):hover ~ .line { --index: 5; }
.links > a:nth-of-type(6):hover ~ .line { --index: 6; }
.links > a:nth-of-type(7):hover ~ .line { --index: 7; }
.links > a:nth-of-type(8):hover ~ .line { --index: 8; }
.links > a:nth-of-type(9):hover ~ .line { --index: 9; }
.links > a:nth-of-type(10):hover ~ .line { --index: 10; }
.links > a:last-of-type:hover ~ .line { --index: var(--items); }