/*####################################################
##													##
## CECILIA											##
## 													##
## GLOBAL.CSS										##
## 													##
## 													##
## Estilo CSS										##
## Estilos globales para el frontend				##
##													##
##													##
####################################################*/

@charset "utf-8";

/*** RESET ***/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, form, label, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { /* HTML5 en navegadores viejos */
	display: block;
}

body {
	line-height: 1.5em;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

h1, h2, h3, h4, h5, h6 {
	line-height: normal;
}

/*** ESTILOS GLOBALES ***/

html {
}

	body {
		cursor: default;
		font-size: 15px;
	}

div {
	box-sizing: border-box;
}

a {
	color: #111;
	text-decoration: none;
}

	a:hover {
		color: #222;
		text-decoration: none;
	}

/*** INPUTS ***/

input,
textarea {
	outline: none;
}

input[type="radio"] {
	position: relative;
	top: 1px;
}
	
/*** ESTILOS GENERALES ***/

	/* Imágenes */

	img {
		
	}

		img:hover {
			
		}

	/* Listas */

	ul {
		list-style-type: disc;
		list-style-position: inside;
	}

		ul li {
			
		}

			ul li a {
				
			}

	/* Headings */

	h1 {
		font-size: 2em;
	}

	h2 {
		font-size: 1.8em;
	}

	h3 {
		font-size: 1.6em;
	}

	h4 {
		font-size: 1.4em;
	}

	h5 {
		font-size: 1.2em;
	}

	h6 {
		font-size: 1em;
	}

/*** NOSCRIPT ***/

noscript {

}

	noscript div {
		width: 100%;
		height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

/*** FLOATS ***/

.left {
	float: left;
}

.right {
	float: right;
}

.clear {
	clear: both;
}

/*** ESTILOS RÁPIDOS ***/

.center {
	text-align: center;
}

.mayus {
	text-transform: uppercase;
}

.minus {
	text-transform: lowercase;
}

.align-left {
	text-align: left;
}

.align-right {
	text-align: right;
}

.padding-5 {
	padding: 5px;
}

.padding-10 {
	padding: 10px;
}

.padding-15 {
	padding: 15px;
}

.padding-20 {
	padding: 20px;
}

.padding-25 {
	padding: 25px;
}

.destacado {
	width: 100%;
	position: fixed; 
	top: 0;
	z-index: 10000;
}

.margin-lr-20 {
	margin: auto 20px;
}

.margin-top-10 {
	margin-top: 10px;
}

.margin-top-15 {
	margin-top: 15px;
}

.margin-top-25 {
	margin-top: 25px;
}

.margin-bottom-15 {
	margin-bottom: 15px;
}

.margin-bottom-25 {
	margin-bottom: 25px;
}

.margin-bottom-45 {
	margin-bottom: 45px;
}

.margin-bottom-55 {
	margin-bottom: 55px;
}

.margin-left-25 {
	margin-left: 25px;
}

.margin-zero {
	margin: 0 !important;
}

.two-columns {
	column-count: 2;
}

.three-columns {
	column-count: 3;
}

.four-columns {
	column-count: 4;
}

.grid {
	display: grid;
}

.grid-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.grid-4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr)
}

.align-center {
	margin: auto;
	position: absolute; 
	top: 0; 
	left: 0; 
	bottom: 0; 
	right: 0;
}

.indent-10 {
	text-indent: 10px;
}

.hightlight {
	background: #ffca65;
}

.bold {
	font-weight: bold;
}

.required {
	color: red;
	font-weight: bold;
}

.opacity-mid {
	opacity: 0.5;
}

.opacity-full {
	opacity: 1;
}

.visible {
	display: inline-block !important;
}

.invisible,
.hide {
	display: none;
}

.sticky {
	position: -webkit-sticky;
	position: sticky; 
	top: 0;
	z-index: 10;
}

.fixed {
	position: fixed;
	top: 0;
	z-index: 10;
	box-sizing: border-box;
}

.full-width {
	width: 100%;
}

.vacio {
	color: #111;
}

.mobile {
	display: none;
}

.icon-active {
	color: #EC4744;
}

/*** ANCHOS ***/

.max-1280 {
	max-width: 1280px;
}

.max-1024 {
	max-width: 1024px;
}

.max-768 {
	max-width: 768px;
}

.max-640 {
	max-width: 640px;
}

.max-480 {
	max-width: 480px;
}

/* DELIMITADOR DE SECCIÓN */

.section {
	background: #f5f5f5;
	border-left: 1px solid #eaeaea;
	border-right: 1px solid #eaeaea;
}

/* POSICIONAMIENTOS */

.pull-left-2px {
	position: relative;
    left: -2px;
}

/*** COLORES ***/

.gray666 {
	color: #666;
}

.gray999 {
	color: #999;
}

.red {
	color: red;
}

.green {
	color: green;
}

.blue {
	color: blue;
}

.blue-v1 {
	color: #00A4D5;
}

/*** BOTONES ***/

.button {

}

/*** ÍCONO DE CARGA ***/

.loading {
	margin: auto;
	width: 40px;
	height: 40px;
	background: url('../imgs/loading.svg') no-repeat center left;
	background-size: contain;
	vertical-align: middle;
	display: none;
}

/*** ESTILOS DE INTERFAZ ***/

.body-overlay,
.loading-overlay,
.overlay {
	width: 100%;
	height: 100%;
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}

.body-overlay {
	background-color: rgba(0, 0, 0, 0.5);
}

.loading-overlay {
	background-color: rgba(255, 255, 255, 0.7);
	z-index: 9;
}

	.loading-overlay .loading {
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

.overlay {
	background-color: rgba(255, 255, 255, 0.5);
}

/* ARRIBA */

.up {
	width: 48px;
	height: 48px;
	color: #333;
	font-size: 48px;
	position: fixed;
	z-index: 999;
	left: 20px;
	bottom: 20px;
	display: none;
}

	.up:hover {
		color: #666;
	}

/*** PESTAÑAS (TABS) ESTILO PREDETERMINADO ***/

.tabs-menu {
	list-style-type: none;
	position: relative;
	top: 1px;
}

	.tabs-menu li {
		width: 100%;
		background-color: #f7f7f7;
		border: 1px solid #d4d4d1;
		border-right: none;
		-webkit-box-shadow: inset 0 -10px 25px -25px rgba(0,0,0,0.5);
		box-shadow: inset 0 -10px 25px -25px rgba(0,0,0,0.5);
		box-sizing: border-box;
		transition: 0.2s all;
	}

		.tabs-menu li:last-child {
			border-right: 1px solid #d4d4d1;
		}

		.tabs-menu li:hover {
			background: #f5f5f5;
		}

	.tabs-menu li.current {
		background-color: #fff;
		border-bottom: 1px solid #fff;
		-webkit-box-shadow: 0 -5px 15px -15px rgba(0,0,0,0.5);
		box-shadow: 0 -5px 15px -15px rgba(0,0,0,0.5);
		position: relative;
		z-index: 5;
	}

		.tabs-menu li a {
			padding: 10px;
			text-transform: uppercase;
			text-decoration: none;
			text-align: center;
			font-weight: bold;
			color: #333;
			display: block;
		}

			.tabs-menu .current a {
				color: #2e7da3;
			}

	.tabs {
		border: 1px solid #d4d4d1;
		background-color: #fff;
	}

		.tabs * {
			box-sizing: border-box;
		}

			.tab-content {
				width: 100% !important;
				min-height: 200px;
				padding: 15px;
				display: none;
			}

				#tab-1 {
					display: block;
				}

/*** ICONOS DE AYUDA ***/

.help {
    width: 19px;
    height: 19px;
    font-size: 18px;
    font-weight: bold;
    font-family: 'FontAwesome';
    color: #666;
    cursor: help;
    display: inline-block;
    overflow: hidden;
    vertical-align: text-bottom;
    position: relative;
    top: 0;
    left: 3px;
}

	.help:before {
		padding: 0 2px;
		content: "\f059";
	}

	.help:hover {
		color: #999;
	}

/*** MENSAJES DEL SISTEMA ***/

#logout {	
	min-height: 50vh;
	padding: 25px;
	text-align: center;
}

#mensajes .section-title,
#logout .section-title {
	margin-bottom: 25px;
}

#mensajes.grid,
#logout.grid {
	align-items: center;
}

#mensajes .section-info .button {
	margin-top: 25px;
}

/*** 404 ***/

#error404 {
	padding: 50px;
	text-align: center;
}

	#error404 h1 {
		font-size: 2em;
		font-weight: 400;
	}

	#error404 h3 {
		font-weight: 300;
	}

	#error404 img {
		margin: auto;
		margin-bottom: 25px;
		width: auto;
		max-width: 600px;
		border: 10px solid #f8f8f8;
		box-shadow: 0px 25px 25px rgba(0, 0, 0, 0.1);
	}

/* ELEMENTO NO ENCONTRADO */

.not-found {
	padding: 25px;
	font-size: 1.5em;
	font-weight: 300;
}

/*** SITIO EN MANTENIMIENTO ***/

#mantenimiento {
	height: 100vh;
	padding: 15px;
	display: flex;
	align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

	#mantenimiento #contenido {
		text-align: center;
	}

		#mantenimiento #contenido h1 {
			margin-top: 25px;
		}

/*** AVISO DE INCOMPATIBILIDAD ***/

#incompatible {
	display: none;
}

/*** AJUSTES PARA FANCYBOX ***/

.compensate-for-scrollbar {
    margin-right: 0 !important;
}

/*** DIRECTIVAS PARA IMPRESIÓN ***/

@media print {
    html, body {
       display: none;
    }
}