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

.nf{
	clear: both;
}
.titulo{
	float: left;
	background-color: beige; 
	width: 100%;
	height: 50px;
	border: 3px groove bisque;
	box-shadow: 5px 0px 5em #000;
}
.titulo ul{
	list-style: none;
	text-align: center;
	text-transform: uppercase;
}
.content{
}
#foto{
	z-index: 2;
	float: left;
	width: 15%;
	border: 2px seagreen solid;
	height: 150px;
	opacity:.9;
	margin-top: 20px;
	background: #fff;	
	transition-duration: 2s;
	-webkit-	transition-duration: 2s;
	-ms- 	transition-duration: 2s;
	-o- 	transition-duration: 2s;
}
#foto:hover{	
	box-shadow: 5px 0px 5px #000;
}
#foto img{
	height: 100%;
	width: 100%;
  float:left;
}
#nombre{
	position: absolute;
	margin-left:50px;
	z-index: 1;
	top: 200px;
	color: #fff;
	}
#biografia{
	width: 80%;
	height: 150px;
	float: left;
	margin-left: 25px;
	border: 2px gold inset;
	margin-top: 20px;	
	text-align: justify;
	padding-left: 5px;
	padding-right: 5px;
	transition-duration: 2s;
	-webkit-	transition-duration: 2s;
	-ms- 	transition-duration: 2s;
	-o- 	transition-duration: 2s;
}
#biografia:hover{
		box-shadow: 5px 0px 5px #000;
}
#biografia h1{
		text-decoration: underline;
		text-decoration-style: double; 
		text-decoration-color: antiquewhite;
		color: darkolivegreen;		
}
#biografia p{
	font-kerning: auto;
	font-size: 14px;
}
#recursos{
	width: auto;
	height: auto;
	float: left;
	-webkit-transform: rotate(-90deg);
	    -ms-transform: rotate(-90deg);
	    -o-transform: rotate(-90deg);
	    transform: rotate(-90deg);
	padding-top:  1px;
	margin-top: 29px;
	margin-bottom: 6px;
	margin-right: -20px;
	border: 2px groove green;
	background-color: goldenrod;
	font-size: 70%;
	text-transform: uppercase;
	text-align: center;
}
#programas{
	margin-top: 5px;
	float:left;
	border: 2px inset chocolate;
	width: 85%;
	padding: 5px;
	text-align: center;
	transition-duration: 2s;
	-webkit-	transition-duration: 2s;
	-ms- 	transition-duration: 2s;
	-o- 	transition-duration: 2s;
	}
#programas:hover{	
		box-shadow: 5px 0px 5px #000;
}
#programas img{
	height: 50px;
}
#videos{
	float: left;
	margin-top: 5px;
	margin-left: 41px;
	width: 85%;
	border: 2px inset chocolate;
	background-color: #000;
	text-align: center;
		transition-duration: 2s;
	-webkit-	transition-duration: 2s;
	-ms- 	transition-duration: 2s;
	-o- 	transition-duration: 2s;
}
#videos:hover{	
		box-shadow: 5px 0px 5px #000;
}
#prefooter{
	float: left;
	width: 100%;
	margin-top: 30px;
	text-align: center;	
	border: 3px groove bisque;
}
#calculoarea{
	float: left;
	width: 100%;
	margin-top: 30px;
	border: 3px groove bisque;	
	text-align: center;
	font-size: 18px;
	color: #934A15;
}
#capital{
	color: #000;
	font-weight: bold ;
}