@import url(http://fonts.googleapis.com/css?family=Raleway);

@font-face {
    font-family: 'ralewayheavy';
    src: url('../font/raleway-heavy-webfont.eot');
    src: url('../font/raleway-heavy-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-heavy-webfont.woff2') format('woff2'),
         url('../font/raleway-heavy-webfont.woff') format('woff'),
         url('../font/raleway-heavy-webfont.ttf') format('truetype'),
         url('../font/raleway-heavy-webfont.svg#ralewayheavy') format('svg');
    font-weight: normal;
    font-style: normal;}


@font-face {
    font-family: 'ralewayextralight';
    src: url('../font/raleway-extralight-webfont.eot');
    src: url('../font/raleway-extralight-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-extralight-webfont.woff2') format('woff2'),
         url('../font/raleway-extralight-webfont.woff') format('woff'),
         url('../font/raleway-extralight-webfont.ttf') format('truetype'),
         url('../font/raleway-extralight-webfont.svg#ralewayextralight') format('svg');
    font-weight: normal;
    font-style: normal;}


@font-face {
    font-family: 'ralewaylight';
    src: url('../font/raleway-light-webfont.eot');
    src: url('../font/raleway-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-light-webfont.woff2') format('woff2'),
         url('../font/raleway-light-webfont.woff') format('woff'),
         url('../font/raleway-light-webfont.ttf') format('truetype'),
         url('../font/raleway-light-webfont.svg#ralewaylight') format('svg');
    font-weight: normal;
    font-style: normal;}


@font-face {
    font-family: 'ralewayextrabold';
    src: url('../font/raleway-extrabold-webfont.eot');
    src: url('../font/raleway-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-extrabold-webfont.woff2') format('woff2'),
         url('../font/raleway-extrabold-webfont.woff') format('woff'),
         url('../font/raleway-extrabold-webfont.ttf') format('truetype'),
         url('../font/raleway-extrabold-webfont.svg#ralewayextrabold') format('svg');
    font-weight: normal;
    font-style: normal;}


@font-face {
    font-family: 'ralewaybold';
    src: url('../font/raleway-bold-webfont.eot');
    src: url('../font/raleway-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-bold-webfont.woff2') format('woff2'),
         url('../font/raleway-bold-webfont.woff') format('woff'),
         url('../font/raleway-bold-webfont.ttf') format('truetype'),
         url('../font/raleway-bold-webfont.svg#ralewaybold') format('svg');
    font-weight: normal;
    font-style: normal;}


@font-face {
    font-family: 'ralewaymedium';
    src: url('../font/raleway-medium-webfont.eot');
    src: url('../font/raleway-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-medium-webfont.woff2') format('woff2'),
         url('../font/raleway-medium-webfont.woff') format('woff'),
         url('../font/raleway-medium-webfont.ttf') format('truetype'),
         url('../font/raleway-medium-webfont.svg#ralewaymedium') format('svg');
    font-weight: normal;
    font-style: normal;}


@font-face {
    font-family: 'ralewaysemibold';
    src: url('../font/raleway-semibold-webfont.eot');
    src: url('../font/raleway-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-semibold-webfont.woff2') format('woff2'),
         url('../font/raleway-semibold-webfont.woff') format('woff'),
         url('../font/raleway-semibold-webfont.ttf') format('truetype'),
         url('../font/raleway-semibold-webfont.svg#ralewaysemibold') format('svg');
    font-weight: normal;
    font-style: normal;}


@font-face {
    font-family: 'ralewayregular';
    src: url('../font/raleway-regular-webfont.eot');
    src: url('../font/raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-regular-webfont.woff2') format('woff2'),
         url('../font/raleway-regular-webfont.woff') format('woff'),
         url('../font/raleway-regular-webfont.ttf') format('truetype'),
         url('../font/raleway-regular-webfont.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;}


@font-face {
    font-family: 'ralewaythin';
    src: url('../font/raleway-thin-webfont.eot');
    src: url('../font/raleway-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/raleway-thin-webfont.woff2') format('woff2'),
         url('../font/raleway-thin-webfont.woff') format('woff'),
         url('../font/raleway-thin-webfont.ttf') format('truetype'),
         url('../font/raleway-thin-webfont.svg#ralewaythin') format('svg');
    font-weight: normal;
    font-style: normal;}



body {
    background-color: #d4d4d4;
    margin:0;}

div#carilla{
    width: 960px;
    margin: auto;}


header {
    margin:auto;
    margin-top: 20px;
    width: 960px;
    height: 240px;
    position: relative;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.28);}


div#fondo{
    position: absolute;}


div#logomorfo{
    position: absolute;
    margin-left: 350px;
    top:55px;}


div#link{
    position: absolute;
    margin-left: 810px;
    top:200px;}


div#link a{
    margin: 5px;
    list-style: none;}


div#contenedor{
    position: absolute;
    height: 50px;
    font-family:'ralewaybold';
    width: 780px;
    background-color: rgba(51, 51, 153, 0.38);
    box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.28);}

  
nav#botonera ul li{
    display: block;
    list-style: none;
    float: left;
    margin-left: 10px;
    text-decoration: none;}


nav#botonera ul li a{
    padding:15px;
    text-decoration: none;
    margin-right:25px;
    color: rgb(255, 255, 255);}
nav#botonera ul li a: webkit-any-link {
color: webkit-link;
text-decoration: underline;
cursor: auto;}

nav#botonera ul li a:hover{
    color: rgb(204,102,102);}


div#contenedor1{
    position: absolute;
    z-index: 10;
    margin-left: 780px;
    width: 180px;
    height: 50px;
    background-color: rgba(51, 51, 153, 0.65);
    box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.28);}


nav#posgrado{
    height: 20px;
    text-align: center;
    padding: 15px;}


nav#posgrado a{
    text-decoration: none;
    font-family:'ralewaybold';
    color: #ffffff;}


nav#posgrado a:hover{
    color: rgb(204,102,102);}


aside{
    width: 960px;
    height: 700px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.28);}


main#bloque{
    position: relative;
    width: 960px;
    height: 600px;}


div#bloque1{
    position: absolute;
    margin-left: 25px;}


div#bloque1 h1{
font-family: 'ralewayextrabold';
color: rgb(204, 51,51);}



div#bloque2{
    position: relative;
    top:60px;
    margin-left: 25px;}


div#flechas{
    position: absolute;
    z-index: 2;}


div#visor{
    position: absolute;}


article{
    width: 910px;
    height: 200px;
    position: relative;
    margin-left: 25px;
    float: left;
    margin-top:480px;}


article div#caja1{
    position: absolute;
    background-color: rgba(204, 102, 102, 0.42);
    height: 200px;}


article div#caja2{
    position: absolute;
    margin-left: 320px;
    background-color: rgba(204, 102, 102, 0.42);
    height: 200px;}


article div#caja3{
    width: 290px;
    height: 200px;
    position: absolute;
    margin-left: 620px;}


div#aceptar{
    font-family:'ralewaybold';
    float: left;
    margin-left: 190px;}


div#aceptar a{
    text-decoration: none;
    color:#000000;}


div#aceptar a:hover{
    color: rgb(175, 173,173);}


.fondocuadro{
    position: absolute;
    z-index: -10;}


.titulocuadro1 h1{
    margin-left: 8px;
    font-family: 'ralewayregular';
    color: #000000;
    font-size: 25px;}

.titulocuadro a{
    font-family: 'ralewaybold';
    display: block;
    text-decoration: none;
    margin-left: 8px;
    margin-top: 25px;
    color: #fff;
    font-size: 25px;}



.subtitulocuadro h2{
    margin:8px;
    font-family: 'ralewaysemibold';
    font-size: 17px;
    color: #fff;}


.descripcioncuadro p{
    margin:10px;
    margin-top:px;
    font-size: 15px;
    color: #fff;
    width: 270px;}


footer{
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.28);
    position: relative;
    background-color:#000000;
    width:960px;
    height: 55px;
    margin-left: 165px;
    margin: auto;
    clear: both;}


footer p{
    width: 800px;
    font-family: 'ralewaythin';
    font-size: 10px;
    color: rgb(236, 65, 111);
    text-align: center;
    padding: 10px;
    margin-left: 100px;}


div#bloque3{
    position: relative;
    top:60px;
    margin-left: 25px;
    width: 910px;
    height: 540px;}


div#bloque3 a{
    text-decoration: none;
    position: }



div#tp1{
    position: absolute;}


div#tp2{
    position: absolute;
    margin-left: 330px;}

div#tp3{
    position: absolute;
    margin-left: 655px;}

div#tp4{
    position: absolute;
    margin-top: 280px;}

div#tp5{
    position: absolute;
    margin-left: 330px;
    margin-top: 280px;}

div#tp6{
    position: absolute;
    margin-left: 655px;
    margin-top: 280px;}


.titulotp{
    font-family: 'ralewayextrabold';
    font-size: 15px;
    color: #fff;
    margin-top: -80px;
    margin-left: 5px;}


.titulotp: hover{
    color: #000000;}



div#bloque3 h5{
     font-family: 'ralewayregular';
     color: rgb(204,51,51);
     width: 195px;
     margin-top: -5px;
     margin-left: 5px;
     color: rgb (102,102,153)}


div#bloque4{
    margin-top: 30px;
    margin-left: 60px;
    position: absolute;
    width:400px;
    height: 500px;}


div#bloque5{
    position: absolute;
    margin-top:60px;
    margin-left: 610px;
    width: 300px;
    height:600px;
    float: left;}


div#bloque4 h1{
    font-family: 'ralewaysemibold';
    color: rgb(48,168,237);
        font-size: 40px;}


div#bloque4 p{
    margin-top: 40px;
    font-family: 'ralewayregular';
    width: 400px;
    font-size: 15px;}


div#bloque4 h2{
     font-family: 'ralewaybold';
    font-size: 17px;}


div#bloque4 ul li{
    font-family: 'ralewayregular';}


main#bloque6 {position: absolute;
    background-color:rgba(204,51,51,0.50) ;
    width: 600px;
    height: 80px;
top:840px;}


main#bloque6 ul li{
    text-align: left;
    float: left;
    margin-left: 45px;
    list-style: none;}

main#bloque6 ul li a{
text-decoration: none;}


main#bloque6 ul li a h1{
    font-family: 'ralewayextrabold';
    color: #ffffff;
    font-size: 15px;
    margin-top: -8px;}


main#bloque6 ul li a h2{
    font-family: 'ralewayregular';
    color:#ffffff;
    font-size: 15px;}



main#bloque6 ul li a:hover{
    color:rgb(51,51,153);}

main#grupodocente{
    margin-left: 540px;
    width: 170px;
    height: 270px;
  margin-top: -200px;
padding: 8px;
background-color: rgba(204,51,51,0.28)}

div#titulodocente{
    width: 110px;
   font-family: 'ralewayextrabold';
    font-size: 20px;
    color: #000000;
 color: #ffffff;}


main#grupodocente ul li{
    margin-left: -25px;
list-style: none; 
    font-size: 15px;
width: 150px;}

main#taller{
    width: 450px;
    height: 600px;
    margin-left: 25px;}



main#taller img{
    margin-top: 60px;}


div#barra{
    position:absolute;
    margin-top: 60px;
    width: 450px;
    height: 100px;
    background-color: rgba(51,51,153,0.42)}


main#taller h1{
    margin-left: 8px;
    position: absolute;
     font-family:'ralewaybold';
    font-size: 25px;
    color:#fff; }


main#taller h2{
    margin-left: 8px;
    font-family: 'ralewaythin';
    color: #ffffff;
    font-size: 15px;
    margin-top: 50px;
    }

main#taller h3{
   font-family:'ralewaybold';
    color: #fff;
    font-size: 15px;
    background-color: rgba(204,102,102,0.42);
    padding: 5px;}

main#propedagogica{
    top:60px;
    width: 345px;
    height: 300px;
    position: absolute;
    margin-left: 540px;}


main#propedagogica h1{
     color: rgb(105,171,209);
    font-family: 'ralewayextrabold';
    font-size: 20px;}



main#propedagogica p{
    font-size: 15px;
    padding: 15px;}


main#diseño{
    margin-top: -295px;
    width: 140px;
    height: 280px;
    margin-left: 740px;}


main#diseño a h1{
    text-decoration: none;
    font-family: 'ralewayregular';
    font-size: 14px; 
    color: rgb(204,51,51);}


main#diseño a{
text-decoration: none;}

main#diseño h2{
    font-family: 'ralewaythin';
    font-size: 12px;
    margin-left: 4px;}

main#diseño img{
    margin-left: 100px;}


div#ubicacion{
    position: absolute;
    width: 390px;
height: 340px;
    top:-300px;
    margin-left: 60px;}

div#bloque4 h1{
    margin-top: -550px;
     font-family: 'ralewayregular';
    font-size: 20px;
    }