@import 'https://fonts.googleapis.com/css?family=Dosis';

/* Coding General */
body { background: #eaeaea; font-family: sans-serif; color: gray; }

header {text-transform: uppercase; padding: 0.9rem; background: white; text-align: center; border-bottom: 0.08333rem solid #e0e0e0; position: fixed; z-index:99!important; width:100%; top:0px; left: 0px;  }
header a {text-decoration: none; color: white; transition-duration: 1s; font-family: dosis; float:left; display: block; padding: 0rem 5rem; background: #708b7d; margin-left: 5rem;}
header a:hover {background: gray; transition-duration: 1s; color: white;}

nav {margin-right: 5rem; margin-top:1.7rem;}
nav ul {
    list-style-type: none;
    overflow: hidden;
}
nav ul li {
    float: right;
}
nav ul li a {
    display: block;
    margin: 0.15rem 0.5rem;
    padding: 0.5rem;
    background-color: #e0e0e0;
	color: white;
	font-family: biryani;
	font-size:0.47rem;
    text-decoration: none;
}

nav ul li a:hover {background: gray; color: white;}

section {font-size:0.8333rem; width: 55rem; margin:auto; background: white; padding: 2rem; text-align:center; margin-top: 5rem;}
section img {float:left; margin:0 1.2rem;}

section p {text-align:justify; font-size:0.75rem;}

section h1 { border-bottom: 0.1rem solid grey; padding:1rem; font-family: dosis; color: #708b7d; font-size: 1.4rem; font-weight: bolder;text-transform:uppercase;}
section h2 {text-align:left; font-family: dosis; margin:0; font-size:1.2rem;color: #708b7d;text-transform:uppercase;}

table {text-align:left; font-size:0.7rem;}
td {width: 18rem;}

footer {font-size:0.5rem; text-transform:uppercase; background: white; border: 0.08333rem solid #e0e0e0; padding: 2rem; text-align: justify; width: 55rem; margin:auto; font-family: biryani; color: gray;} 

::-webkit-scrollbar{ width:0.25rem; }
::-webkit-scrollbar-track{ background: white;}
::-webkit-scrollbar-thumb{ height: 0.3333rem; width:0.25rem; border: 0; background-color: #708b7d; }

/* Rótulo de Rocío */
#personalro {width: 12.5rem; height: 12.5rem; display: inline-block; margin:0.14285714rem; -webkit-filter: grayscale(100%);filter:grayscale(100%); transition-duration: 1s; background:url(http://www.catedraocampo.com.ar/vn08/img/ro.png); background-color: #333;background-size:100% auto;}
#personalro:hover {filter:grayscale(0%);-webkit-filter: grayscale(0%); transition-duration: 1s;}
#personalro:hover .info {opacity: 1; transition-duration: 1s;}

.info {opacity: 0; transition-duration: 1s; text-align:center; padding-top: 4rem;}
.info a {background: white; font-family:biryani; font-size: 0.25rem; text-transform:uppercase; padding:0.25rem; margin:  0.4167rem; text-decoration: none; letter-spacing: 0.1667rem; color: gray; }
.nombre {font-family: dosis; color: white; font-size: 1.3rem; text-shadow: 0.05rem 0.05rem #ccc; padding: 0 0.5rem 0.3333rem 0.5rem; border-bottom: 0.08333rem solid white; text-transform:uppercase;}

/* Rótulo de Jeniffer */
#personaljeniffer {width: 12.5rem; height: 12.5rem; display: inline-block; margin:0.14285714rem; -webkit-filter: grayscale(100%);filter:grayscale(100%); transition-duration: 1s; background:url(http://www.catedraocampo.com.ar/vn08/img/jeni.png); background-color: #333;background-size:100% auto;}
#personaljeniffer:hover {filter:grayscale(0%);-webkit-filter: grayscale(0%); transition-duration: 1s;}
#personaljeniffer:hover .info {opacity: 1; transition-duration: 1s;}

/* Rótulo de Iara */
#personaliara {width: 12.5rem; height: 12.5rem; display: inline-block; margin:0.14285714rem; -webkit-filter: grayscale(100%);filter:grayscale(100%); transition-duration: 1s;background:url(http://www.catedraocampo.com.ar/vn08/img/iara.png); background-color: #333;background-size:100% auto;}
#personaliara:hover {filter:grayscale(0%);-webkit-filter: grayscale(0%); transition-duration: 1s;}
#personaliara:hover .info {opacity: 1; transition-duration: 1s;}

/* Rótulo de Belén */
#personalbelu {width: 12.5rem; height: 12.5rem; display: inline-block; margin:0.14285714rem; -webkit-filter: grayscale(100%);filter:grayscale(100%); transition-duration: 1s; background:url(http://www.catedraocampo.com.ar/vn08/img/belu.png); background-color: #333; background-size:100% auto;}
#personalbelu:hover {filter:grayscale(0%);-webkit-filter: grayscale(0%); transition-duration: 1s;}
#personalbelu:hover .info {opacity: 1; transition-duration: 1s;}

/* Tabla */  
.infouba {margin-top: 0.8333rem;text-transform:uppercase; margin-bottom: 0.5333rem; background: url(http://www.catedraocampo.com.ar/vn08/img/fadu.png); padding: 5rem; background-size: 100% auto; background-position: center;}
.material-icons.md-48 { font-size: 48px; color:white;}

.uba {display: inline-block; width:32%; text-align:left; min-height:5rem;}
.uba b {font-family: dosis; font-size:0.8rem; text-transform:uppercase; color: #708b7d;}

/* CONCLUSIONES */ 
.resolucion {margin: auto; width:25rem; margin-top: 3rem; padding: 1rem; background:#f7f7f7;border: 0.1rem solid #e0e0e0;}
.resolucion h3 {font-family: dosis; text-transform:uppercase; color: #708b7d; border-bottom: 0.1rem solid grey; padding-bottom: 0.5rem;}