@charset "UTF-8";
/* CSS Document */

body { width:60%; height:auto; margin: 0 auto; border: solid 1px #CCC; border-radius:0 0 15px 15px; border-top:none;
font-family: 'Lato', sans-serif; transition: all 0.4s; }

header { width:100%; height:150px;
		background-image: url(images/unam_red_logos.png);
		background-size: auto;
		background-position: 40px bottom;
		background-repeat: no-repeat; transition: all 0.4s;}
		
	div.titulo { margin:0 40px;}
	
	div.redes { width:40px; height:40px; 
			margin:10px;
			padding:0; background-color:#838383;
			border-radius:21px; 
			display:inline-block; transition: all ease-in 0.3s;}
			
	div.redes:hover {background-color:#6fb28d;}
		
main { width:70%; height:885px; margin:0 15%; padding:0; display:table; 
		/*border: solid 3px #09C;*/}
		
	div.contenido { width:100%; height:auto; 
				margin:0; padding:0;
				position:relative; top:-50px;
				/*border: solid 1px #C6C;*/}

	div.cuenca {margin:0; padding:0;  
			background-image: url(images/cuenca-01.png); 
			background-repeat:no-repeat; 
			background-size:100%; 
			background-position:center top; 
			width:100%; padding-bottom:52%;
			position:absolute; 
			left:-1px; top:-10px;}
			
/*Divs de Infos*/		
div.info {margin:38% auto; padding:0 0 3% 0;
			width:99%; height:auto;
			position:absolute; left:0;
			background-color: #D7F1FF;
			border-radius:0 0 30px 30px; border: inset 1px #06C;}

/*Divs de Iconos*/
	div.icono {margin:0; padding:0; background-color:#D7F1FF;
			width:60px; height:60px;
			position:absolute;
			border-radius:33px; border: dotted 1px #003398;
			opacity:100%;
			transition: all 0.4s;}

	div.icono:nth-child(1) {left:88%; top:48%;}/*Souza*/
	div.icono:nth-child(2) {left:70%; top:22%;}/*Magaña*/
	div.icono:nth-child(3) {left:28%; top:50%;}/*Espejo*/
	div.icono:nth-child(4) {left:38%; top:40%;}/*Aguire*/
	div.icono:nth-child(5) {left:53%; top:50%;}/*Labiaga*/
	div.icono:nth-child(6) {left:62%; top:35%;}/*Galicia*/
	div.icono:nth-child(7) {left:5%; top:28%;}/*Barradas*/
	div.icono:nth-child(8) {left:62%; top:60%;}/*Luna*/
	div.icono:nth-child(9) {left:19%; top:37%;}/*Maass*/
	div.icono:nth-child(10) {left:43%; top:20%;}/*Mazzari*/
	div.icono:nth-child(11) {left:73%; top:43%;}/*Avila*/
	div.icono:nth-child(12) {left:40%; top:58%;}/*FGV*/
	div.icono:nth-child(13) {left:1%; top:52%;}/*icmyl_ruiz*/
	div.icono:nth-child(14) {left:12%; top:65%;}/*icmyl_elva*/
	div.icono:nth-child(15) {left:50%; top:78%;}/*icmyl3_soto*/
	div.icono:nth-child(16) {left:29%; top:25%;}/*icmyl4_lopez*/
	div.icono:nth-child(17) {left:30%; top:70%;}/*icmyl5_alcocer*/
	div.icono:nth-child(18) {left:55%; top:20%;}/*icmyl6_merino*/	
		
	div.icono:hover {background-color:#036; opacity:85%;}

footer {text-align:center; font-size:11px;
		margin:0 6%; padding:2% 25%; border-top:solid 1px #CCC;}

/*-------------Estilos de Texto ---------------*/

p { font-size:17px; line-height:1.5em; text-align:justify;
	/*margin:3% 6%; padding:0; border: solid 1px #CCC;*/ }
	
strong { font-weight:bold; color:#4F976D;}

blockquote { text-align:left; font-style:italic; font-weight:bolder;
			margin:0;}

div.fLetf {margin:0 4% 0 0; padding:0; width:50%; 
			float:left; /*border: solid 4px #0F6;*/}
			
	#ftInv {width:100%; height:100%;} 
	#nombre { text-align:right; font-size:111%; font-style:italic; font-weight:bolder; line-height:1.2em;
				margin-right:3%;}

div.txtI {margin:17% 6% 0 6%; padding:0;}

div.cerrar { width:25px; height:25px; 
			background-image:url(images/cerrar.png); background-repeat:no-repeat;
			margin:0 6% 0 88%;}

h1 { font-size:30px; text-align:right; line-height:.8em; 
	 color:#6fb28d; font-weight:bold;
	 padding:40px 0 0 0; margin:0;
	 transition: all 0.4s;}
	 
h3 { margin:5px 0; padding:0; 
	 font-size:18px; line-height:1.2em; text-align:right; font-weight:lighter; color:#838383;
	 transition: all 0.4s;}
	 
#clear { clear:both;}
	 
/*Media Queries*/

@media screen and ( max-width: 1280px ) {

header {background-position: 30px bottom;}

div.contenido { width:100%; height:auto; top:-65px;}

div.icono {width:50px; height:50px;border-radius:26px;}

}

@media screen and ( max-width: 1024px ) {

header {background-size:40px 104px; background-position: 20px center;}

h1 { font-size:25px; padding:20px 0 0 0;}

h3 { font-size:16px;}

div.info {margin:34% 0;}

div.icono {width:40px; height:40px;border-radius:21px;}

}

@media screen and ( max-width: 800px ) {

body { width:80%;}

div.contenido {width:100%; height:auto; top:-63px;}

}

@media screen and ( max-width: 600px ) {

body {width:95%; border:hidden;}

header {background-size:35px 91px; background-position: 20px 10px;}

	div.titulo { margin:0 10px;}

h1 { font-size:19px; padding:10px 0 0 0;}

h3 { font-size:15px;}

main { width:98%; margin:0 auto;}

div.contenido {width:100%; height:auto; top:-50px;}

div.info {margin:32% 0;}

div.fLetf {margin:0; padding:0; width:100%; 
			clear:left; /*border: solid 4px #0F6;*/}

div.icono {width:32px; height:32px; border-radius:17px;}

				
p { font-size:16px; line-height:1.6em; text-align:justify;
	margin:3% 2%; padding:0; /*border: solid 1px #CCC;*/ }
	
strong { font-weight:bold;color:#4F976D;}

blockquote { text-align:left; font-style:italic; font-weight:bolder;
			margin:0;}
			
#nombre {font-size:109%; font-weight:bolder; line-height:1.2em;
			margin-right:7%;}
			
			

#float_l { float:left; margin:0 5px 2px 0; padding:0;}

#float_r { float:right; margin:-1% 0;}
	}