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



/************************************************************************************
RESET CSS
*************************************************************************************/
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
    margin: 0;
    padding: 0;
}
 
img, fieldset {
    border: 0;
}
img {
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
    margin: 0;
}


/************************************************************************************
TERMINA RESET CSS
*************************************************************************************/

    	* {
		    margin: 0;
		    padding: 0;
		}
		
		body {
		    background-color: #f5f4f3;
			overflow-x:hidden;
		
		}
		header {
		    max-width: 100%;
		    margin: auto;
			height:110px;
		}
		
		#container{
			max-width:1000px;
			}
			
		p{
			font-size:14px;
			line-height:22px;
			font-family: Arial, Helvetica;
			}
		
		footer{
			border:green 0px solid;
			background:#d6d7d6;
			}
			
		#footer_contenedor{
			max-width:1000px;
			border:red 0px solid;
			margin:auto;
			background:#f5f4f3;
			height:148px;
			}
				
		#f_cuaed{
			width:30%;
			height:148px;
			border:green 0px solid; 
			float:left;
			background:url(../img/footer_01.png) no-repeat;
			background-position:right;
			}
					
		#f_txt{
	float: left;
	position: relative;
	background: url(../img/footer_02.png) no-repeat;
	width: 70%;
	height: 148px;
		}
		
		.txt_footer{
	font-size: 10px;
	color: #909090;
	text-align: center;
	font-family: Verdana, Geneva, sans-serif;
	padding-top: 40px;
	padding-right: 30px;
	padding-bottom: 30px;
	padding-left: 40px;
			}
		
		#cuaedFooter{
			position:relative;
			background:url(../img/logo_cuaed.svg) no-repeat;
			background-position:bottom;
			height:70px;
			width:150px;
			margin-left:auto;
			margin-right:auto;
			font-size:10px;
			color:#909090;
			text-align:center;
			margin-top:40px;
			font-family:Verdana, Geneva, sans-serif;
			}

		/*** Menu superior ***/
		
		#menu, nav{
    display: block;
}
		nav {
		    background-color: #264d68;
		    height: 57px;
			z-index:10001;

		    
		}
		
/***Logos***/		
		#contenedorLogos{
			margin:auto;
			width:1000px;
			}
		
		#logo_unam{
			background:url(../img/EscudoUNAM-01.svg) no-repeat;
			height:100px;
			width:30%;
			border:red 0px solid;
			background-position:center;
			position:relative;
			float:left;	
			background-position:center;
			display:block;
			background-size:auto;
			margin-top:8px;	
		}
		
		#logo_fca{
			background:url(../img/logoAdministracion.svg) no-repeat;
			height:90px;
			width:30%;
			border:red 0px solid;
			background-position:center;
			float:left;
			position:relative;
			background-position:center;
			display:block;
			background-size:auto;
			margin-top:8px;
		}
		
		#logo_santander{
			background:url(../img/logo_santander.svg) no-repeat;
			height:80px;
			width:40%;
			margin-top:5px;
			border:red 0px solid;
			background-position:center;
			float:left;
			position:relative;
			background-position:center;
			display:block;
			background-size:contain;
			margin-top:12px;
		}
		
	.txt_login{
		padding-top:30px;
		color:#fff;
		font-family:'Century Gothic';
		src:url(http://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext);
		font-size:16px;
		
		}
		
		/***accesible***/


#contenedorAcesibilidad{
	width:27%;
	position:relative;
	margin:auto;
	height:50px;
	padding-top:10px;
	}
	
#imprimir {
	background:url(../img/accesible/accesible06.png);
	background-position: center center;
	background-repeat: no-repeat;
	height: 25px;
	width: 25px;
	margin: 13px 58px 2px 0px;
	/*margin: 10px 10px 2px 30px;*/
	border:red 0px solid;
	float:right;
}
#imprimir:hover {
	background:url(../img/accesible/accesible06_2.png);
	background-position: center center;
	background-repeat: no-repeat;
	border:red 0px solid;
}
#A {
	background:url(../img/accesible/accesible05.png);
	background-position: center center;
	background-repeat: no-repeat;
	height: 25px;
	width: 25px;
	margin: 13px 10px 2px 2px;
	float:right;
	border:red 0px solid;
}
#A:hover {
	background:url(../img/accesible/accesible05_2.png);
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
}
#a1 {
	background:url(../img/accesible/accesible03.png);
	background-position: center center;
	background-repeat: no-repeat;
	height: 25px;
	width: 25px;
	margin: 13px 10px 2px 2px;
	float:right;
	border:red 0px solid;
}
#a1:hover {
	background: url(../img/accesible/accesible03_2.png);
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
}
#altoContraste {
	background:url(../img/accesible/accesible02.png);
	background-position: center center;
	background-repeat: no-repeat;
	height: 29px;
	width: 29px;
	margin: 13px 10px 2px 2px;
	float:right;
}
#altoContraste:hover {
	background:url(../img/accesible/accesible02_2.png);
	background-position: center center;
	background-repeat: no-repeat;
}
#bajoContraste {
	background:url(../img/accesible/accesible01.png);
	background-position: center center;
	background-repeat: no-repeat;
	height: 25px;
	width: 25px;
	margin: 13px 10px 2px 2px;
	float:right;
}
#bajoContraste:hover {
	background:url(../img/accesible/accesible01_2.png);
	background-position: center center;
	background-repeat: no-repeat;
}



/***Contenidos***/	
		#show{
			max-width:1000px;
			margin:auto;
			border:blue 0px solid;
		}
		
			h1 {
		    font-family:'Century Gothic';
			src:url(http://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext);
		    font-size: 28px;
		    margin: 10px 0 10px 0;
			font-weight:normal;
			color:#24346a;
		}
	/*Botón subir */
		#back-top {
			position: fixed;
			bottom: 30px;
			left:93%;
			}
			
		#back-top a {
			width: 50px;
			display: block;
			text-align: center;
			font: 12px/100% Arial, Helvetica, sans-serif;
			text-decoration: none;
			color: #e30513;
	/* background color transicion */
			-webkit-transition: 1s;
			-moz-transition: 1s;
			transition: 1s;
			}
		
		#back-top a:hover {
			color: #264d68;
			}
	/* icono flecha  (span tag) */
		#back-top span {
			width: 50px;
			height: 50px;
			display: block;
			margin-bottom: 7px;
			background: #9b9b9b url(../img/up-arrow.png) no-repeat center center;
	/* redondear borde */
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			border-radius: 10px;
	/* background color transicion */
			-webkit-transition: 1s;
			-moz-transition: 1s;
			transition: 1s;
			}
		
		#back-top a:hover span {
			background-color: #777;
			background: #9b9b9b url(../img/up-arrow2.png) no-repeat center center:
			}

/*** Estilos cursos***/

#cotenido_externo{
	padding:20px;
	}


#divContenedor{
	position: relative;
	margin:auto;
	max-width: 1000px;
	top: 0px;
	border:red 0px solid;
	width:100%;
	margin-top:20px;
}
	.clsImagen2{
	border: solid 0px #fff;
	border-radius: 3px;
	background: #fafafa;
	box-shadow: 2px 2px 5px #ccc;
	min-height:230px;
	width:98%;
	display: block;
	top:0px;
}
	.clsImagen2 img{
		margin: 0px;
		
	}
	.clsImagen2:hover .clsContenedor2{
		width: 98%;	
	}
	.clsContenedor2{
		-webkit-transition: all 0.5s ease-out;
		-moz-transition: all 0.5s ease-out;
		-o-transition: all 0.5s ease-ou;
		transition: all 0.5s ease-out;
		
		background-color: rgba(255, 255, 255, 0.7);
		width: 0;
		height: 100%;
		overflow: hidden;
		box-shadow: 0 0 2px #ccc;
		color: #fff;
		top:0px;
		max-width:1000px;
		position:absolute;
		border:blue 0px solid;
		float:left;
		
	}
		.clsEspacio{
			width: 308px;
			top:0px;
			position:relative;
			border:green 0px solid;
			float:left;
			max-height:230px;
			min-width:215px;
			height:230px;
			
		}
			
/* Form Estilos */
#contenedorLogin{
	position:relative;
	float:left;
	width:90%;
	background:url(../img/ico_entrar.png) no-repeat;
	background-position:center;
	background-size:contain;
	padding-left:50px;
	color:#fff;
	font-size:16px;
	margin-left:20px;
	padding-top:15px;
	font-family:'Century Gothic';
	src: url(http://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext);
	}

	.form-2{
    width:600px;
	padding: 0px 20px 0 20px;
	padding-top:12px;
	float:right;
	position:relative;
	}
	
	.btnLogin01{
		border:none; 
		width:100px; 
		font-size:16px; 
		padding:5px;
		background-color:#e30513;
		color:#fff; 
		cursor:pointer;
		margin-left:10px; 
		border-radius: 2px 2px 2px 2px; 
		box-shadow: 1px 1px 1px #9b9b9a;
		font-family:'Century Gothic';
		src: url(http://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext);
		position:relative;
		
		}
	
	
		
		h2 {
		    font-family:'Century Gothic';
			src:url(http://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext);
		    font-size: 22px;
		    margin: 10px 0 10px 0;
			font-weight:normal;
			color:#1654a2;
		}
		
		#barra{
			margin:auto;
			width:90%;
			border:0px solid red;
			}
		
		.input{
			width:150px; 
			border:none; 
			font-size:15px; 
			background-color:#fff; 
			opacity: 0.6; 
			filter: alpha(opacity=60);
			}
		
	

@media only screen and (max-width: 768px) {
	
	#container{
			width:100%;
			}
			
	#contenedorLogos{
			width:100%;
			}
	
	#logo_unam{
			background-size:contain;
			margin-left:1%;	
		}
	#logo_fca{
			background-size:contain;
			width:25%;
		}
		
	#logo_cuaed{
			background-size:contain;
			width:34%;
		}	
	#menu ul {
			width:100%;
		}	
		#menu ul li {
		   
			padding-right:13px;
			font-size:13px;
		
		}
		#santander{
			padding-top:0px;
			background:url(../img/logo_santander02.png) no-repeat;
			}
			
		.seguimiento{
			margin-left:2%;
  
			}
			
		#divContenedor{
			width:100%;
			margin-left:1%;
			}
			
		#contenedorLogin{
			width:55%;
			background-size:auto;
			padding-top:14px;
			padding-left:0px;
			}
				
		#contenedorLogin02{
			width:55%;
			background-size:auto;
			padding-top:14px;
			padding-left:0px;
			}
		#contenedorLogin03{
			width:55%;
			background-size:auto;
			padding-top:14px;
			padding-left:0px;
			}
			
		#back-top {
			position: fixed;
			bottom: 30px;
			left:90%;
			}
		#footer_contenedor{
			width:100%;
			}
			
		#f_txt{
			width: 70%;
			}
		#f_cuaed{
			width:30%;
			background-position:right;
			}
		#contenedorAcesibilidad{
			width:40%;
			}
		#barra{
			width:95%;
			}
}

@media only screen and (max-width: 480px) {
 #nav-mobile{
        display: block;

    }   

/* Fijamos nuestro nav en 100% ancho y dejamos de flotarlo  */
 #menu{
	 width: 100%;
	 float: none;
	 position:relative;
	 
    }
/* Convertimos nuestra lista de enlaces en un menú horizontal */
	#menu ul{
		-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.5);
		-moz-box-shadow: 0 1px 2px rgba(0,0,0,.5);
		box-shadow: 0 1px 2px rgba(0,0,0,.5);
		max-height: 0;
		overflow: hidden;
		margin-left:0;
		opacity: 0.8;
    
		}
		
		
		#menu ul li {
			border-top:#FFF 1px solid;
		
		}
/* estilos para los LI del menu */
		#menu li{
			background: #5D5D5D;
			float: none;
			width:100%;
            }

/* Quitamos el borde del ultimo item del menú */
        #menu li:last-child{ border-bottom: 0; display:none;}
                
		#menu li a{
			padding: 15px;
			height: auto;
			line-height: normal;
			color:#31949A;
			width:100%;
			}
			#menu li a:hover{
				padding: 0px 15px;
			}

/* Agregamos una animación al despligue del menú */

        #menu ul.open-menu{
            max-height: 400px;
            -webkit-transition: max-height .4s;
            -moz-transition: max-height .4s;
            -ms-transition: max-height .4s;
            -o-transition: max-height .4s;
            transition: max-height .4s;
			}
	}
	
	@media only screen and (max-width: 380px) {
		
		header {
			height:60px;
			padding:15px;
		}
		
		#logo_unam{
			background:url(../img/logo_unam2.png) no-repeat;
			height:55px;
			width:15%;
			background-position:center;
			position:relative;
			float:left;	
			background-position:center;
			background-size:contain;
			margin:5px 10px 0 0;
		}
		
		#logo_fca{
			background:url(../img/logoAdministracion2.png) no-repeat;
			height:55px;
			width:15%;
			margin-left:5%;
			margin-right:4%;
			background-position:center;
			display:block;
			background-size:contain;
		}
		
		#logo_santander{
			width:57%;
			margin-top:0px;
			height:55px;
			
		}
		
		nav {
		    height: auto;
			z-index:10001;
			padding-bottom:7px;

		    
		}
		
		#f_cuaed{
			background:#D6D7D6;
			width:100%;
			float:none;
			height:100px;
			padding-top:10px;
			}
		
		#f_txt{
			float: left;
			background:#D6D7D6;
			height:auto;
			width:100%;
			float:none;
			padding-top:0px;
		}
		
		.txt_footer{
			padding-top:0px; 
			}
			
		 #cuaedFooter{

			height:70px;
			margin-top:20px;
			}
			
		#contenedorLogin{
			position:relative;
			float:left;
			height:250px;
			width:100%;
			margin-left:0px;
			}
		
		#back-top {
			left:80%;
			}
		
		
		#contenedorAcesibilidad{
			width:90%;
			}
		#barra{
			width:100%;
			border:1px solid #264d68;
			}
			
		.form-2{
    width:90%;
	padding: 0px 20px 0 20px;
	padding-top:12px;
	float:left;
	position:relative;
	}
	
	.btnLogin01{
		float:right;
		position:relative;
		margin-top:5px;
		
		}
	.input{
			width:100%; 
			}
	

			
		}