@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: #fff;
    margin: 0;
    height: 760px;
      
}

div#carilla{
    width: 1024px;
    margin: auto;
    height: 730px;
        }

header {
    background-color: rgb(175, 173, 173);
   top: 20px;
    margin:auto;
    width: 960px;
    height: 260px;
    position: relative;
   
}

div#nombre{
     font-family: 'ralewaysemibold';
    color: rgb(236,65,111);
position: absolute;
margin-left: 500px;
margin-top: 115px;
width: 200px;}

div#logo{
    position: absolute;
    top:30px;
    left: 780px;
}

div#gigi {
    position: absolute;
    top:30px;
    left: 300px;
    height: 180px;
    width: 180px;
}

header nav#botonera{
    position:absolute;
    width: 500px;
    float: left;
    margin-left:200px;
    margin-top: 240px;
   
     
        
}

nav#botonera ul{
    margin: 0;
    padding: 0;
    font-family: 'ralewaythin';
    height: 20px;;
    list-style: none;

    
}

nav#botonera ul li{
float: left;
margin-left: 8px;}

nav#botonera ul li a{
    text-decoration: none;
    color: #000000;
    padding-right: 10px;
    padding-left: 10px;
    margin-bottom: 10px;
    text-align: center;
 }

nav#botonera ul li a:hover{ 
    color: #fff;
    background-color: rgb(236,65,111);
  
}

div#logogrupal{
    position:absolute;
    width: 140px;
   margin-left: 40px;
top:40px;}

div#modulo1{
    font-family: 'ralewaysemibold';
    width: 145px;
    position: absolute;
    left: 780px;
    top: 107px;

}

header div#modulo1 h1{
      font-family: 'ralewaymedium';
    font-size: 12px;

}


header div#modulo1 h2{
    font-family: 'ralewaythin';
    font-size: 11px;
   
    
}

header div#modulo1 h3{
    font-family: 'ralewaythin';
    font-size: 11px;
 
}

main{  position:absolute;
        width: 960px;
        height: 500px;
     margin-top: 40px;
    margin-left: 35px;
              }


main div#contenedor{
position: absolute;
 color: rgb(175, 173, 173);
width: 150px;
height: 180px;
   margin-left: 775px;
    top:40px;}


main div#contenedor h1{
    position: absolute;
font-size: 25px;
}


main div#contenedor h2{
    position: absolute;
font-size: 22px;
    margin-top: 50px;
}


main div#contenedor h3{
    position: absolute;
font-size: 17px;
     margin-top:75px;
}

main div#contenedor h4{
    font-size: 11px;
      margin-top: 100px;
}


main div#materiasaprobadas{
    margin-top: 50px;
        width: 200px;
        margin-left: 80px;
    position: absolute;
}

main div#materiasaprobadas h1{
    color: rgb(236,65,111);
      font-family: 'ralewayextrabold';
      font-size: 15px;
      width: 100x;
}

main div#materiasaprobadas h2{
     font-family: 'ralewayextrabold';
    font-size: 13px;
    margin-left: 50px;
  
    
}

main div#materiasaprobadas p{
 font-family: 'ralewayregular';
    font-size: 12px;
    margin-left: 50px;
    margin-bottom: 10px;
    
 }
    
main div#linea{
    position: absolute;
    margin-left: 90px;
    top:35px;
    margin-top: 50px;}

main div#linea2{
    position: absolute;
    margin-left:430px;
    top:35px;
    margin-top: 50px;}


main div#materiasactuales{
    margin-top:50px;
        width: 200px;
    margin-left:420px;
    position: absolute;}


main div#materiasactuales h1{
    color: rgb(236,65,111);
    font-family: 'ralewayextrabold';
      font-size: 15px;}


main div#materiasactuales h2{
        font-family: 'ralewayextrabold';
    font-size: 13px;
    margin-left: 50px;}


main div#materiasactuales p{
 font-family: 'ralewayregular';
    font-size: 12px;
    margin-left: 50px;
    margin-bottom: 10px;}


footer{
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.28);
    position: absolute;
    background-color:#000000;
    width:1024px;
    height: 55px;
    margin-left: 145px;
    top:700px;
    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;
    ;
  
   }