/**********************************************     Pagina     ***********************************************************/
body
{
	margin:		0px auto;
	font-family:Arial, Helvetica, sans-serif;	
}

.Contenedor
{	
	margin:				0 auto;
	overflow:			hidden;
	background-color:	white;
	padding:			0% 3% 0% 3%;
	justify-content:	center;
}

#divlogoHead
{
	display:		flex;
	justify-content:center;
	align-items:	center;
	padding:		5px 0px 5px 0px;
}

.ContenedorDatosAlumno
{
	max-width:			840px;
	margin:				0 auto;
	display:			flex;
	background-color:	#DCDCDC;
	align-items:		center;
	justify-content:	space-between;
	padding:			3px 12px 3px 12px;
}

.ContenedorDatosAlumno span
{
	display:	flex;
	margin-top:	3px;
}

.ContenedorDatosAlumno span span
{
	display:	block;
	width:		110px;
	font-weight:bold;
}

.divcentrar
{
	display:	flex;
	align-items:center;
}

.expandex:hover
{
	position:absolute;
	right:0;
	width:100%;
	z-index:100;
	padding:5px;
}

.center-item
{
	display:block	!important;
	margin:	0 auto;
}

.sectiontitle
{
	font-size:			1.5em;
	line-height:		3;
	color:				#0072c6;
	text-transform:		uppercase;
}

.Formulario legend, .SuperFormulario legend
{
	padding:	1px 9px 1px 9px;
}

.Formulario div
{
	margin:4px 0px 4px 0px;
}

.Formulario label
{
	display:	flex;
	align-items:center;
}

.Formulario div b
{
	margin-left:5px;
	display:	inline-block;
}

.SuperFormulario legend
{
	font-weight:	normal;
	font-size:		1.2em;
	color:			white;
	background-color:#004085;
}

.AVISOCEUS img
{
	margin:		0 auto;
	opacity:	0.9;
	width:		90%;
	margin-left:5%;
	transition:	all 0.5s ease-in;
}
	
.AVISOCEUS img:hover
{
	opacity:	1;
	margin-left:0%;
	width:		100%;
}

fieldset{margin-bottom:30px}

.Formulario legend
{
	font-size:			1em;
	background-color:	#2072B8;
	color:				white;
}

.textgray
{
	max-width:	800px;
	color:		gray;
	margin:		0 auto;
	text-align:	left;
	padding: 	15px 10px 0px 10px;
}

@media only screen and (max-width: 600px)
{
	.AVISOCEUS img
	{width:100%;}
}

/*********************************************     Encabezado     *********************************************************/

/*estilo 2016-2022*/
.FondoEncabezado	{background-color:#1B3257;}

/*estilo 2022-*/
.DIVFondoEncabezado2022	{background-color:#004A98;}

#Encabezado
{
	max-width:	800px;
	margin:		0 auto;
	color:		white;
	text-align:	right;
}

#logoUASLP{width:	50%;}

.Separador
{
	margin-right:	10px;
	margin-left:	10px;
	height:			60%;
	display:		inline;
	border:			1px solid white;
	float:			left;
}

.Titulo{font-size:	1em;}

.Separador2
{
	padding-left:20%;
	width:	80%;
	margin:	8px 0px 8px 0px;
	border:	1px solid white;
}

.Subtitulo
{
	font-size:	1.2em;
	font-weight:bold;
}

#logoFC{width:	38%;}

@media only screen and (max-width: 799px)
{
	#logoUASLP
	{
		width:	152px;
		height:	66px;
	}
	#logoFC
	{
		width:	113px;
		height:	60px;
	}
	
	.Titulo{font-size:1em;}
}

/**********************************************     Tablas       **********************************************************/

thead tr th/*head fijo*/
{ 
	position: sticky;
	top: 0;
	z-index: 10;
	background-color: #ffffff;
}

.headblue tr ,.headblue th
{
	color:white;
	background-color:#1E72B7 !important;
}

.TBasica,.TResultados
{
	border-collapse:collapse;
	border:			1px solid black;
	margin:			0px auto;
}

.TBasica td,th
{
    border:		1px solid #848484;
    text-align:	center;
}

.TResultados td,th
{
    border:		1px solid #848484;
    text-align:	center;
}

.Horario
{
	border-collapse:collapse;
	border:			1px solid black;
	font-size:		12pt;
	margin:			0px auto;
}

.Horario td,th
{
    border:1px solid black;
    text-align:center;
}

.TAccion tr{cursor: pointer;}

.SPANdark{background-color:black;color:white;}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 599px)
{table	{font-size:0.9em;}}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) 
{table	{font-size:1em;}}

.TInfoSystem
{
	font-size:	0.9em;
	text-align:	left;
	margin-top:	10px;
}

.TInfoSystem tr:nth-child(even)	{background-color: #f2f2f2;}

.TLeft td{text-align:left;}

/**********************************************     Mensajes     **********************************************************/
input.inputMail
{
	max-width:600px;
	min-width:300px;
}

.divInfoSystem
{
	max-width:	450px;
	margin:		0 auto;
}

.Window
{
	position:	fixed;
	text-align:	center;
	z-index:	2;
	max-height:	80%;
	overflow-y:	auto;
}

.fondoNotificacion
{
	display:		inline-block;
	background-color:white;
	border-radius:	20px;
}

.Notificacion
{
	z-index:		5;
	font-size:		1em;
	top:			80px;
	border-radius:	20px;
	position:		fixed;
	text-align:		center;
	max-height:		80%;
	overflow-y:		auto;
	width:			85%;
	padding-left:	15px;
	padding-right:	15px;		
}

.cintilloNotificacion
{
	background-color:	#004A98;
	border-radius:		20px 20px 0px 0px;
	padding:			8px;
	text-align:			left;
	max-height:			50px;
	overflow-y:			hidden;
	display:			flex;
	justify-content:	space-between;
	margin-bottom:		15px;
}

#pieNotificacion
{
	border-radius:	0px 0px 20px 20px;
	margin:			15px 0px 0px 0px;
}

.Cortina
{
	position:			fixed;
	top:				0px;
	width:				100%;
	height:				100%;
	background-color:	gray;
	color:				gray;
	visibility:			hidden;
	opacity:			0.72;
}

.YESNObuttons
{
	margin:			0px auto;
	padding-top:	12px;
	display:		flex;
	justify-content:space-between;
	width:			190px;
}

/**********************************************     Menu Principal     **********************************************************/

.ItemBlueMenu,.BotonSubMenu,.BotonMenu,.X,
.BotSimple,.BotInicio,.etqMiniMenu
{cursor:pointer;}

.fondomenu
{
	margin:				5px 0px 5px 0px;
	background-color:	#DADADA;
}

.MenuPrincipal
{
	max-width:		800px;
	margin:			0px auto;
	padding:		0px 15px 0px 15px;
	display:		flex;
	flex-wrap:		wrap;
	justify-content:space-around;
	align-items:	stretch;
}

.MenuPrincipal form .BotonMenu{height:100%;}

.MenuPrincipal i
{
	font-size:	26px;
	color:		#AAAAAA;
	margin-right:15px;
}

.BotonMenu:hover	{background-color:#BFBFBF;}

.BotonMenu
{
	display:			flex;
	min-width:			140px;
	min-height:			36px;
	padding:			5px;
	border:				none;
	color:				#002F74;
	background-color:	#f1f1f1;
	text-transform:		uppercase;
	font-size:			0.9em;
	justify-content:	center;
	align-items:		center;
}
	
@media only screen and (max-width: 599px)
{
	.BotonMenu			{width:100%;margin:0px;}
	.MenuPrincipal		{padding:0px;}
	.MenuPrincipal form	{width:100%;}
}

/**********************************************     Botones     **********************************************************/
.X
{
	color:				white;
	font-size:			1.5em;
	font-weight:		bold;
	background-color:	#E72512;
	padding:			0px 8px 5px 8px;
	text-align:			center;
	border:				none;
	border-radius:		10px;
	line-height:		20px;
}

.BotInicio
{
	width:		120px;
	height:		30px;
	background: linear-gradient(#B0CDEA,WHITE,#B0CDEA);
	font-weight:bold;
}

.BotSimple
{
	padding:	5px 25px 5px 25px;
	background: linear-gradient(#B0CDEA,WHITE,#B0CDEA);
	font-weight:bold;
	margin:		0px auto;
}

/************************     BlueMenu     **************************/

.BlueMenu
{
	margin-left:5px;
	width:100%;
	color:white;
}

.SubMenuBlue
{
	display:	none;
	visibility:	hidden;
}

.ItemBlueMenu
{	
	background-color:	#1E72B7;
	color:				white;
	padding:			5px;
	min-height:			40px;
	font-size:			0.9em;
	margin-top:			3px;
}

.ItemBlueMenu icon 
{
	display:	block;
	margin:		4px 6px 0px 0px;
	font-size:	20px
}

.ItemBlueMenu span
{
	display:	block;
	margin-left:4px;
}

.punta
{
	width:				0;
	height:				0;
	border-top:			10px solid transparent;
	border-bottom: 		10px solid transparent;
	border-right:		10px solid #FFFFFF;
	position:			relative;
	top:				0px;
	left:				0px;
	-ms-transform:		rotate(-90deg); /* IE 9 */
	-webkit-transform:	rotate(-90deg); /* Chrome, Safari, Opera */
	transform:			rotate(-90deg);
	float:				right;
}

.BotonSubMenu
{
	border:				none;
	color:				#002F74;
	background-color:	#f1f1f1;
	padding:			5px;
	text-transform:		none;
	min-height:			40px;
	font-size:			0.9em;
	display:			flex;
	overflow:			hidden;
	margin-top:			1px;
}

.BotonSubMenu i
{
	float:	left;
	margin:	4px 6px 0px 0px;
	width:	18px;
	height:	18px;
	font-size:18px;
}

.BotonSubMenu span	{display:block;}
.BotonSubMenu:hover	{background-color:#BFBFBF;}

.BlueMenu hr
{
	margin-top:		10px;
	margin-bottom:	10px;
	color:			#999;
	border:			none;
	border-top: 	dotted 2px;
}

.etqBlueMenu
{
	font-size:	0.7em;
	color:		#777777;
	display:	inline-block;
	margin-top:	16px;
	width:		100%;
}

.etqBlueMenu hr	{margin-top:0px;}
.etqMiniMenu	{display:none;}

#Contenido
{
	padding-left:	20px;
	overflow:		auto;
}

@media only screen and (max-width: 599px)
{
	.etqMiniMenu
	{
		display:			block;
		font-weight:		bold;
		padding:			5px 0px 0px 10px;
		background-color:	#1B3257;
	}
	#Contenido{padding:15px 0px 0px 0px;}
} 

/*Otros*/
/*Para el input file de Bootstrap diga Elegir en lugar de Browse*/
.custom-file-input ~ .custom-file-label::after {
    content: "Elegir";
}

/********************     RETICULA     ***********************************/
.Reticula{overflow-x:auto;}

.datosReticula
{
	display:		flex;
	flex-wrap:		wrap;
	justify-content:space-between;
	text-align:		right;
	background-color:#dcdcdc;
	padding:		5px;
	line-height:	1.2;
}

.infReticula
{
	text-align:		right;
	margin-bottom:	15px;
	background-color:#DADADA;
	color:			#002F5B;
	line-height:	1.45;
	padding:		4px;
}

.TablaReticula
{
	font-family:	Arial, Helvetica, sans-serif;
	font-size:		0.9em;
	table-layout:	fixed;
	overflow-x:		auto;
	overflow-y:		visible;
	width:			100%;
	min-width:		840px;
	border-collapse:separate;
}

.Semestre
{
	text-align:	center;
  	font-weight:bold;
	padding:	5px;
	font-size:	0.9em;
}

.TablaReticula .Materia,.Vacio
{
	height:			100px;
	position:		relative;
	border-radius:	9px;
	border:			2px solid transparent;
}

.Materia
{
	color:				black;
	background-color:	#cfe2ff;
	text-align:			center;
	vertical-align:		middle;
	border:				2px solid #323232;
}

.ToolTip
{
	visibility: 	hidden;
    background: 	linear-gradient(#323232,#1E72B7);
    color:			white;
    text-align: 	center;
    border-radius: 	6px;
    padding:		5px 0;
    position:		absolute;
    z-index:		1;
    bottom:			80%;
    left:			20%;
    opacity:		0;
    transition:		opacity 1s;
}

.ToolTip::after
{
    content:		"";
    position:		absolute;
    top:			100%;
    left:			50%;
    margin-left:	-13px;
    border-width:	13px;
    border-style:	solid;
    border-color:	#1E72B7 transparent transparent transparent;
}

.Materia:hover .ToolTip
{
    visibility: visible;
    opacity: 	1;
}

.calificacion	{font-size:			0.8em;}
.Vacio			{background-color:	white;}

.promedio
{
	text-align:			center;
	height:				30px;
	font-size:			1em;
	font-weight:		bold;
	background-color:	#80FF80;
	border-radius:		60px;
}

@media only screen and (max-width: 840px)
{
	.Reticula{font-size:1em;}
	
	.TablaReticula .Materia,.Vacio
	{border:1px solid transparent;}
	
	.TablaReticula	{width:	1200px;}
}

@media only screen and (max-width: 640px)
{
	.Reticula
	{
		padding-top:	100px;
		font-size:		1em;
	}
}

/****************     FOTO ALUMNO     ************************/
.DatosAlumno	{border-collapse:separate;}

.foto
{
	width:			100px;
	height:			120px;
	border-radius:	10px;
	margin-left:	10px;
	border:			1px solid gray;
}

.DatosAlumno
{
	font-size:		0.82em;
	width:			600px;
	display:		inline-block;
	float:			left;
	border-spacing: 3px 3px;
}

/*small*/
@media only screen and (max-width: 840px)
{
	.foto
	{
		width:			80px;
		height:			100px;
		border-radius:	7px;
		margin-left:	2px;
		border:			1px solid gray;
	}
	.DatosAlumno
	{
		width:			400px;
		display:		inline-block;
		float:			left;
	}
}

/*TINY*/
@media only screen and (max-width: 639px)
{
	.foto	{display:none;}
	.subdivdatosReticula{width:100%;}
}

/******************     SIMBOLOGIA DE COLORES RETICULA     ****************/
#Simbologiacol1
{
	background-color:	#80FF80;
	border:				2px solid #008000;
}

#Simbologiacol2
{
	background-color:	#808080;
	border:				2px solid #808080;
}

#Simbologiacol3
{
	background-color:	#cfe2ff;
	border:				2px solid #0000FF;
}

#Simbologiacol4
{
	background-color:	#FCBC05;
	border:				2px solid #BC9B27;
}

#Simbologiacol5
{
	background-color:	#FFA07A;
	border:				2px solid #E9967A;
}

#Simbologiacol6
{
	background-color:	#CC99FF;
	border:				2px solid #CC99FF;
}

.Simbologia
{
	clear:			both;
	margin:			0 auto;
	table-layout:	fixed;
	font-size:		0.85em;
	max-width:		820px;
	min-width:		300px;
}

.colorSimbologia	{width:15px;margin-left:4px;}

.Cursos
{
	background-color:#cfe2ff;
	border:			1px solid gray;
	margin-top:		15px;
}