/******** HOJA DE ESTILOS ********/

@import url(http://fonts.googleapis.com/css?family=Roboto:300);
/*font-family: 'Roboto', sans-serif;*/
@font-face {
    font-family: 'robotolight';
    src: url('../font/roboto-light-webfont.eot');
    src: url('../font/roboto-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto-light-webfont.woff2') format('woff2'),
         url('../font/roboto-light-webfont.woff') format('woff'),
         url('../font/roboto-light-webfont.ttf') format('truetype'),
         url('../font/roboto-light-webfont.svg#robotolight') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotomedium_italic';
    src: url('../font/roboto-mediumitalic-webfont.eot');
    src: url('../font/roboto-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto-mediumitalic-webfont.woff2') format('woff2'),
         url('../font/roboto-mediumitalic-webfont.woff') format('woff'),
         url('../font/roboto-mediumitalic-webfont.ttf') format('truetype'),
         url('../font/roboto-mediumitalic-webfont.svg#robotomedium_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

/******** RESET ********/
* {
    margin: 0;
    padding: 0;
}
    
a {
    text-decoration: none;
}

li {
    list-style: none;
}

body {
    background:#E6F5F2;
}

main,footer {
    width: 60%;
    margin: 20px auto;
    border-left: 0px;
}

/******** ACÁ COMIENZA EL HEADER ********/
main article {
    float: right;
    font-family: 'robotolight';
    width: 60%;
    padding: 3%;
}
main article p {
    margin: 1% 0%;
}

.contenedor:before,
.contenedor:after {
  content: "";
  display: table;
}
.contenedor:after {
  clear: both;
}
.contenedor {
    border:  2px solid #00B7B9;
    clear: both;
    *zoom: 1;
}

header {
    width: 33%;
    height: 1400px;
    background: #00B7B9;
    float: left;
    
}
header hgroup {
    width: 90%;
    margin: 5%;
    height: 150px;
}
header hgroup h1 {
    font-size: 4em;
    color: #fff;
    font-family: 'robotomedium_italic', sans-serif;
    margin-bottom: 0px;
}
header hgroup h2 {
    font-family: 'robotomedium_italic', sans-serif;
    font-size: .7em;
    color: #fff;
}
header hgroup a {
    font-family: robotomedium_italic;
    color: #fff;
    font-size: .7em;
}
nav{
    width: 100%;
    font-family: 'robotolight';
}
nav ul {
    margin-top: 1rem ;
    width: 100%;
}
nav ul li {
    cursor: pointer;
    height: 40px;
    width:95%;
    margin: 5px 0px;
    padding: 10px 0px 0px 5%;
    transition: .5s,
}
nav ul li:hover {
    background:#0d7e80 ;
}
nav ul li a { color: #fff;}

#vacio  {
    height: 110px;
    float: right;
    font-family: 'robotolight';
    width: 60%;
    padding: 3%;
    padding-top: 
}

#vacio h1{
    padding-left: 15%;
    padding-top: 5%;    
}

#individual{
    background: #ffffff;
}

img {
    display: block;
    margin-top: 5%;
    margin-left: 4%;
    width: 42px;
    float: left;
}
    
/*Footer///////////////////////////////////////////////////*/
footer {
    font-family: 'robotomedium_italic', sans-serif;
    font-size: 9px;
    clear: both;
    height: 100px;
}