/*
	Estilos del sistema SUDI V4
	Elaborado por: Hector Hugo Acosta Garza
	Fecha: Julio 2019
		
	Menú
	
	A) FONTS.- Tipografías del sistema
	B) GENERAL.- html & body
	C) LOGIN
	D) INFO CONTAINER
	E) MAIN MENU
	F) LIST
	G) SUB CONTROLS
	H) CURTAIN
	I) MANAGE
	J) R-PANEL / COMMENTS
	K) REPORTS
*/

/* A) FONTS */

@font-face {
    font-family: 'sf_pro_textbold';
    src: url('../_fonts/sf-pro-text-bold-webfont.woff2') format('woff2'),
url('../_fonts/sf-pro-text-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sf_pro_textmedium';
    src: url('../_fonts/sf-pro-text-medium-webfont.woff2') format('woff2'),
url('../_fonts/sf-pro-text-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sf_pro_textregular';
    src: url('../_fonts/sf-pro-text-regular-webfont.woff2') format('woff2'),
url('../_fonts/sf-pro-text-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sf_pro_textsemibold';
    src: url('../_fonts/sf-pro-text-semibold-webfont.woff2') format('woff2'),
url('../_fonts/sf-pro-text-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sf_pro_textthin';
    src: url('../_fonts/sf-pro-text-thin-webfont.woff2') format('woff2'),
url('../_fonts/sf-pro-text-thin-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


/* SUDI_ICONS */
.icon { display:inline-flex; font-size: .9em; align-items: center; }

.icon-sudi-2x { font-size:1.8em !important; }

.fa-close{ cursor:pointer; }

/* B) GENERAL */

/* Loading */
	
		.loader_wrapper {
			margin: auto;
			text-align: center;
			display: block;
			width: 100%;
			}
		
		.sudi_loading {
		  	display: inline-block;
			/* padding: 30px 0px; */ 
				
		}
	
		.sudi_loading:before {
			content: " ";
			display: block;
			width: 30px;
			height: 30px;
			margin: 8px;
			border-radius: 50%;
			border: 6px solid #30b297;
			border-color: #cacaca transparent #cacaca transparent;
			animation: sudi_loading_a 1.5s linear infinite;
			
		}		

		@keyframes sudi_loading_a {
		  0% {
			transform: rotate(0deg);
		  }
		  100% {
			transform: rotate(360deg);
		  }
		}

/* SUDI BTN */

.align-left { justify-content: start; }
.align-center { justify-content: center; }
.align-right { justify-content: end;}

.sudi_btn_container{ display: flex;}
.sudi_std_btn {
	display: inline-flex;
	height: 50px;
    border-radius: 5px;
    padding: 0px 10px;
    background-color: var(--btn-upbar-bg);
    color: var(--btn-upbar-color);
    cursor: default;
    align-content: center;
    flex-wrap: wrap;
    margin: 0px 5px;
}
	.sudi_std_btn i {
		opacity: .5;
    	font-size: 1.5em !important;
    	flex: 0 0 20px;
    	margin: 0px 10px 0px 0px;	
	}

	.sudi_std_btn:hover{
		background-color: var(--btn-upbar-bg-hover);
   	 color: var(--btn-color-dark);
	}

* { margin:0px; padding:0px; -webkit-tap-highlight-color:transparent; }
ul, li { list-style:none; }
#silence_ajax { display:none !important; } /*<-- Solo para cargar contenido de forma oculta*/
#msg_sudi {
	z-index:3000;
	position:fixed;
	bottom:0px;
	left:0px;
	width:100%;
	height:auto;
	padding:15px 0px;
	background-color:rgba(0,0,0,.8);
	color:#FFF;
	transition:bottom 1s ease-in-out;
}

	#msg_sudi.hidden { bottom:-100px; }
	#msg_sudi.none { display:none; }
	#msg_sudi p{ 
		font-size:1.5;
		margin:0px 30px;
		text-align: center;
	}

	#msg_sudi span { 
		position:absolute;
		right:20px;
		top:50%;
		margin-top:-10px;
	}

html, body { height:100%; min-height:100% !important; max-width: 100%; overflow-x: hidden; }
body { font-family: var(--font-regular); background-color: var(--body-bg); overflow-y: scroll; /* has to be scroll, not auto */ -webkit-overflow-scrolling: touch; }
#state_bar { display:none; position:fixed; }

#main_blur_container {
	height: inherit;
	/*padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);*/
	/*box-sizing: border-box;*/
}

	/* JQUERY-UI */
	
	
	
	.ui-widget-header {
		color:#FFF;
		background-color: var(--main-color);		
	}
	.ui-dialog-titlebar-close { display:none !important; }
	.ui-state-default { border:#CACACA solid thin; background-color:#FEFEFE; box-sizing:border-box; }
		.ui-state-default:hover { opacity:.7; }
	.ui-state-active { border: 1px solid #3b92cf; }
	.deleteClassBtn { background-color:#F00; color:#FFF;}
	
	.ui-autocomplete { z-index:3000 !important; overflow:auto; max-height:150px; }
	
	.pointer {cursor: pointer; opacity: .8; }
		.pointer:hover { opacity: 1; }
	.elipsis {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	
/* INPUTS */
	input:focus,
	select:focus,
	textarea:focus,
	button:focus {
		outline: none;
	}
	
	input, select, textarea, button { 
		/*box-sizing:border-box;
		-moz-appearance: none; 
		-webkit-appearance: none; 
		appearance: none;*/
	}
	
	/* CHECKBOX y RADIO */
	
	/* CheckBox and Radio Buttom */
	.aCheckbox {
		width: 100%;
		padding: 10px 0px;
		border: #e5e6ec solid thin;
		border-radius: 5px;	
	}
		.aCheckbox .check_label { display:inline-block; margin:5px 10px; }
		
		input[type="checkbox"], input[type="radio"] { display:none !important;  }
		
		input[type="checkbox"] + label span, 
		input[type="radio"] + label span {
			transition:all .5s ease;
			box-sizing:border-box;
			vertical-align:middle;
			display:inline-block;
			margin:-2px 5px 0 0;
			cursor:pointer;
			height:16px;
			width:16px;
		}

		input[type="checkbox"] + label span{ /* border-radius:4px; */ }
		input[type="radio"] + label span { border-radius:50%; }
		
		input[type="checkbox"]:checked + label span, 
		input[type="radio"]:checked + label span { background-color:var(--color-blue); border:#607081 solid thin; }
	
	
	.input_required { border:rgba(255,0,0,.3) solid 1px; }
	
	
	input[type="checkbox"] + label span, input[type="radio"] + label span {
	  display: inline-block;
	  box-sizing: border-box;
	  border: #607081 solid thin;
	  width: 16px;
	  height: 16px;
	  margin: -2px 5px 0 0;
	  vertical-align: middle;
	  cursor: pointer;
	  transition: all .5s ease;
	}
	
	input[type="checkbox"] + label, input[type="radio"] + label { font-size:.9em; }
	

			
		input[type="checkbox"]:checked + label span, input[type="radio"]:checked + label span {
		  background-color: var(--color-blue);
		  border: var(--color-blue) solid thin;
		}
		
		input[type=color] {
			background-color: transparent;
			border: none;
		}	

/* C) LOGIN */

	#sudi_main_login {
		position: relative;
		display: flex;
		height: inherit;
		min-height: 100%;
		align-items: center;
	}
		#login_form_container {
			display: block;
			width: 350px;
			height: auto;
			margin: 0px auto 0px auto;
			box-sizing: border-box;
		}

			#login_main_logo{ 
				display: block;
				width: 100px;
				height: 100px;
				background-color: var(--sq-logo-bg);
				margin: 0px auto 15px auto;
				border-radius: 28px;
				background-image: var(--sq-logo);
					background-position: center;
					background-repeat: no-repeat;
					background-size: cover;
			}

			#login_main_welcome{
				color:#5D6772;
				text-align: center;
				display: block;
				font-size: 1em;
				margin: 15px 0px 15px 0px;
			}
			#login_main_sign {
				font-size: 1.5em;
				color: #FFF;
				text-align: center;
				margin: 15px 0px 7px 0px;
			}	
			
			.input_password_box input:-webkit-autofill,
			.input_password_box input:-webkit-autofill:hover, 
			.input_password_box input:-webkit-autofill:focus, 
			.input_password_box input:-webkit-autofill:active {
				-webkit-text-fill-color: #FFF;
				-webkit-box-shadow: 0 0 0 40px #222931 inset;
				-webkit-appearance: none !important;
			}
			
			.input_password_box{
				display: block;
				position: relative;
				border-radius: 7px;
				margin: 7px 0px 13px 0px;
				overflow: hidden;
			} 

			.input_password_box #login_password.closed {
				max-height: 0px;
				transition: max-height .5s ease-out;
			}

				.log_i_con {
					position: absolute;
					left: 0px;
					top: 0px;
					background-color: #607081;
					width: 60px;
					height: 100%;
					display: flex;
					justify-content: center;
					align-items: center;
				}

					.log_i_con i {
						color:#FFF;
						font-size: 1.5em;
					}
				#sudi_login_user, #login_password {
					display: block;
					position: relative;
					width: 100%;
					background-color: #222931 !important;
					color: #FFF !important;
					height: 60px;
					padding-left: 75px;
					box-sizing: border-box;
					border: none !important;
					font-size: 1em;
				}
					#sudi_login_user::placeholder, #login_password::placeholder { color:#FFF; }
					#sudi_login_user:focus, #login_password:focus { outline: none; }

		.error_msg { display:block; font-size:.7em; margin: 0px 0px 0px 0px; color:#FFF; text-align:center; opacity: 0; transition:opacity 1s ease; }
			
		.error_msg.show { 
			opacity: 1;
		}


		.login_buttons { text-align: center; color:#5D6772; }
			.login_buttons section { display: inline-block; vertical-align: middle; width: 48%; }
		.login_buttons a
		{ 
			display:block;
			margin: 15px 0px 20px 0px;
			width:100%;
			vertical-align:top;
			padding: 19px 0px 19px 0px;
			background-color:#2B3845;
			font-size: 1em;
			border-radius: 7px;
			text-decoration:none;
			color:#FFF;
			text-align:center;
			cursor:pointer;
		}


/* D) INFO CONTAINER */

		#info_container {
			display: inline-block;
			vertical-align: top;
			margin-top: 0px;
			box-sizing: border-box;
			margin-left: 330px;
			width: calc(100% - 330px);
			height: calc(100vh - 100px);
			z-index:99;
			
			padding-top: 75px;

		}
			#info_container.info_show {	
				width: calc(100% - 680px);
			}
			#info_container.closed {
				margin-left: 80px;
				width: calc(100% - 80px);
			}
			#info_container.hidden {
				margin-left:0px;
				width:100%;
				margin-top: 0px;
				padding: 0px;
				height: 100%;
				background-color: #1D2329;
			}

			#info_container h1, #info_container h2, #info_container h3 {
				color: var(--font-color-soft);
				margin: 10px auto; 
			}

/* E) MAIN MENU */

	#main_menu {
		position:fixed;
		top:0px;
		left:0;
		display:inline-block;
		box-sizing:border-box;
		width:330px;
		z-index:102;
		/*background-color: var(--main-menu-bg);
		/*box-shadow: inset rgba(0,0,0,.1) -5px 0px 10px;*/
		white-space: nowrap;
		height: 100%;	

		-webkit-user-select: none; 
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;

		transition:left .5s ease;
	}

	/* Menu .Closed */
		#main_menu.closed { width: 80px; }
		
		
		#main_menu.hidden {
			left:-330px;
		}

		#bar_logo{
			display: block;
			width: 56px;
			height: 66px;
			background-color: var(--sq-logo-bg);
			border-radius: 8px;
			margin-bottom: auto;
			background-size: contain;
			background-position: center center;
			background-repeat: no-repeat;
			
			/*temp*/
			background-image: var(--sq-logo);
			
		}
		
		/* E.1 - BAR_MENU */
		#main_menu #bar_menu{
			display: inline-flex;
			flex-direction: column;
			width: 80px;
			box-sizing: border-box;
			vertical-align: top;
			margin: 0px;
			height: 100%;
			background-color: var(--main-color);
    		align-items: center;
    		justify-content: flex-end;
    		padding: 20px 0px 25px;
			position: relative;
			z-index: 2;
			
			transition: all .5s;
		}		
		#bar_elements_container{
			display: block;
			width: 100%;
			box-sizing: border-box;
		}
			.bar_element {
				display: flex;
				margin: 5px auto;
				width: 50px;
				height: 50px;
				border-radius: 8px;
				cursor: default;
				justify-content: center;
				align-items: center;
			}
				.bar_element i { color:#FFF; font-size: 1.5em; }

				.bar_element:hover, .bar_element.selected  { background-color: rgba(255,255,255, .1); }
			#user_photo {
				display: block;
				width: 54px;
				height: 54px;
				background-color: #FFF;
				border-radius: 50%;
				background-position: center center;
				background-size: cover;
				border: var(--bar-icon-color) solid 2px;
				margin: 20px 0px;
			}  

		/* E.2 - main_nav */	
		#main_nav {
			display: inline-block;
			vertical-align: top;
			text-align:left;
			width:245px;
			flex-direction: column;
			position: relative;
			background-color: var(--main-menu-bg);
			height: 100vh;
			overflow: auto;
			
			transition: all .5s;
			z-index: 1;	
		}
			#main_menu.closed #main_nav { margin-left: -245px; }
			
			.nav_group {
					width:100%;
					max-height: 50px;
					overflow:hidden;
					transition: max-height .5s, background-color .5s;
				}
				
					.nav_group.opened {
						max-height: 1000px;
    					transition: max-height .5s, background-color .5s;
					}
					
					.group_title { color:#898989; }
								
					.nav_group.opened .group_title { color:#000; }

					.nav_group.opened .group_title i {color:var(--select-color);;}
					
										
					.nav_group.opened .nav_alone { color:#8acfff; }
						.nav_alone:not(.nav_title):hover span {color:#000;} 
						.nav_alone:not(.nav_title):hover .nav_title_icon{color:var(--select-color);;}
						.group_title:hover .nav_title_icon {color:var(--select-color);;}
					
				.module_title{
					height: 70px;
					font-size: 1.2em;
					display: flex;
					align-items: center;
					text-transform: uppercase;
				}

				.group_title, .nav_alone {
					height:50px;
					cursor:pointer;
					position: relative;
				}
				
				.nav_title_icon { color:#898989; font-size:1.1em; }
					.module_title .nav_title_icon { color: var(--select-color); margin: 0px 10px; }
				
				.nav_icon { float:left; }
				
					
				
					.group_title .nav_title_icon, .nav_alone .nav_title_icon { 
						margin: 0px 0px 0px 25px;
						position: absolute;
						top: 50%;
						-webkit-transform: translateY(-47%);
						transform: translateY(-47%);
					}
					
					.nav_item .nav_icon {
						top: 50%;
						margin-left: -25px;
						font-size: 1.2em;
						-webkit-transform: translateY(-50%);
						transform: translateY(-45%);
						position: absolute;			
					 }
						.nav_icon_arrow{
							position: absolute;
							right: 25px;
							top: 4px;
							transition: all .5s ease;
						}
							.nav_group.opened .group_title i.nav_icon_arrow {transform: rotate(180deg); top: 0px; color:#000; }
				
						
							
				
				.nav_item {
					position: relative;
					font-size:.85em;
					height:45px;
					transition: background-color .5s ease;
					cursor:pointer;
					width:85%;
					margin-left:30%;
					padding-left:10px;
					color: #898989;
				}

					.nav_item:last-child {
					margin-bottom: 20px;
					}
				.nav_group .nav_item:first-child { margin-top:10px; }
				
					.nav_item:hover { color:#000; }
						.nav_item:hover .nav_icon { color:var(--select-color);; }
				
					.nav_item span, .group_title span, .nav_alone span {
						display:block;
						position: relative;
						top: 50%;
						-webkit-transform: translateY(-50%);
						transform: translateY(-50%);
						
					}
					
						.group_title span { margin-left: 60px; }
					
					.nav_alone span { margin-left:60px; color:#898989; }
						.nav_alone span i { color:#c3b1dc; }
			.nav_title {
				height: 70px;
				cursor: default;
				color:#000;
				margin: 10px 0px 30px 0px;
			}
				.nav_title  span { color:#000; }
				.nav_title i{ color: var(--select-color);; font-size:1.2em; }

	
/* F) LIST */

	.sudi_lpath, .sudi_cpath {display: inline-block; width: auto; color:#33496F; font-size: 1.1em; padding-left: 30px; margin: 30px 0px; font-family: var(--font-bold); opacity: .8; }
		.sudi_cpath{ padding-left: 0px; font-size: 1.2em; opacity: 1; }

	.list_input_container { padding: 0px 30px; }

	/* NEW SUDI TB */
	.sudi_tb_container {
		display: block;
		position: relative;
		width: 100%;
		box-sizing: border-box;
		height: auto;
		overflow: auto;
		font-size: 1em;
		padding-bottom: 50px;
	}
		/* Variantes SUDI V4 */
		.sudi_tb_container.tb_height_auto{ max-height: calc(100% - 100px); overflow: auto; }
		.sudi_tb_container.tb_borders{}
		
		
			.st_notxt i { 
			    margin: 0px !important;
			}
	
	.sudi_tb_item_container {
		display: block;
		box-sizing: border-box;
		min-width: 700px;
	}
	.sudi_tb_container .st_row {
		display: flex;
		flex-direction: row;
		/*justify-content: center;*/
		min-height: 70px;
		align-items:stretch;
	}
	
	.sudi_tb_container .st_head .st_item, .sudi_tb_container .st_row .st_item {
			position:relative;
			flex: 1 1 20%;
			display: inline-flex;
			justify-content: center;
			align-items:center;
			font-size: .9em;
			text-align: center;
			color: var(--btn-color-light);
				;
			box-sizing: border-box;
	}
		.sudi_tb_container .st_head {
			display: flex;
			flex-direction: row;
			justify-content: center;
			height: 40px;
			align-items:stretch;
			background-color: #FFF;
			color:var(--btn-color-light);
			box-sizing: border-box;
			min-width: 700px;
		}
		
		.st_head .st_item{
			font-size: 1em !important;
			color: #B6BED9;
			text-transform: uppercase;
		}
		
		.st_head .st_item i { 
			/*color: var(--btn-confirm);*/
    		font-size: 1.1em;
			margin: 0px 5px 0px 0px;
		}

		/* @2021 Clases y elementos para celdas especiales*/

		.st_item:not(.st_special) { min-width: 120px !important; }
		.st_item.stcolumn { flex-direction: column; }
			.st_item.st10 { flex: 0 0 10px !important; min-width: auto !important; }
			.st_item.st20 { flex: 0 0 20px !important; min-width: auto !important; }
			.st_item.st50 { flex: 0 0 50px  !important; min-width: auto !important; }
			.st_item.st75 { flex: 0 0 75px  !important; min-width: auto !important; }
			.st_item.st100 { flex: 0 0 100px  !important; min-width: auto !important; }
			.st_item.st150 { flex: 0 0 150px  !important; min-width: auto !important; }
			.st_item.st200 { flex: 0 0 200px  !important; min-width: auto !important;}


			.st_item_img{ background-repeat: no-repeat; background-size: cover; background-position: center center; } 
			.st_item img {width:auto; height: auto; max-height: 90%; max-width: 90%;}
		.st_row:nth-child(odd) {
			background-color:#F8F9FA;
		}

		.sudi_tb_container .st_row .st_item i:not(.icon_visible) { 
			display: none;
			color: var(--btn-confirm);
			font-size: .9em;
			margin: 0px 5px 5px 0px;
		}

		.icon_visible {
			font-size: 1.5em;
			color: var(--color-blue);
		}
		
	.st_item:last-child {
		border:none !important;
	}

		/* LIST - PROGRESS BARR */
		.mini_progress_bar{
			display: flex;
			width: 90%;
			height: 20px;
			border: #CACACA solid thin;
			margin: 5px auto;
			overflow: hidden;
			position: relative;
			font-size: .8em;
			justify-content: center;
			align-items: center;
			color: rgba(0,0,0,.7);
			z-index: 0;
		}
		.mini_progress_bar span {
			display: block;
			position: absolute;
			width: 0;
			background-color: #d5b8e4;
			height: inherit;
			top: 0; left: 0;
			z-index: -1;
		}


	/* btn de opciones */
	.st_row_option span { font-size: .8em; }
	.st_row_option_btn i { 
			color:rgba(255,255,255,.8) !important;
			display: block !important;
			font-size: 1.5em; 
		} 


	/* List row Options */
				
				#list_row_options {
					position:absolute;
					display:none;
					width: auto;
					top:0px;
					height:auto;
					padding:0px;
					background-color:#FFF;
					border-radius:4px;
					border:#CACACA solid thin;
					
					transition:opacity .5s ease;
					
					-webkit-user-select: none; 
					-moz-user-select: none;
					-ms-user-select: none;
					user-select: none;
					
					z-index:102;
					
				}
			
					
				#list_row_options.opened 
				{ display:inline-block; opacity:1; }
				
			
					#list_row_options li {
						display:block;
						width: auto;
						height:auto;	
						padding:10px;
						text-align:left;
						min-width:150px;
						position:relative;
						padding-right:35px;
						max-width:100%;
						cursor:pointer;
					}
					
						#list_row_options li:hover { background-color:#3b92cf; color:#FFF; }
						
						#list_row_options li i {
							position:absolute;
							top: 50%;
							-webkit-transform: translateY(-50%);
							transform: translateY(-50%);
							right:10px;	
						
						}

		/* Paginación LIST */
				
				.no_results {
					text-align: center;
					font-size: 2em;
					color: #747474;	
				}

				#nav_list { 
					position:fixed;
					bottom:0px;
					right:100px;
					width:auto;
					background-color:rgba(255,255,255,.9);
					border-radius: 10px;
					border-bottom-left-radius: 0px;
					border-bottom-right-radius: 0px;
					border:#d3d9e7 solid thin;
					color:var(--btn-color-light);
					padding: 10px 0px 12px;
					z-index:1;
					font-size: 1.1em;
					
					
					-webkit-user-select: none; 
					-moz-user-select: none;
					-ms-user-select: none;
					user-select: none;
				 }

					.info_show #nav_list { right:350px; }
					
					#page_num { 
						display:inline-block;
						vertical-align:middle;
						width:auto;
						padding:0px 5px;
					}
					
					.nav_list_btn { 
						display: inline-block;
						vertical-align:middle;
						width:auto;
						padding:0px 10px;
						cursor:pointer;
						border-right:rgba(255,255,255,.3) solid thin;
					}
						.nav_list_btn:hover { 
							color: var(--btn-confirm);
						}
						
						.nav_list_btn.disabled { 
							color:rgba(0,0,0,.2);
							cursor:default;
						}
						
						#page_info { 
							font-size:.8em;
							display:inline-block;
							vertical-align:middle;
							padding:0px 10px; 
						}
						
						#page_info .list_search_clean { 
						    cursor: pointer;
							padding: 5px 10px;
							background-color: rgba(231,49,49,1);
							color: #FFF;
							margin: 0px 10px;
							border-radius: 4px;	
						}
						
						.list_generator_current_page {
							position:absolute;
							z-index:-1;
							color:rgba(240,240,240,.2);
							font-size:3em;
							top:10px;
							right:10px;	
						}
	
/* G) HEADER y SUB CONTROLS */


header {
	display: flex; height: 75px;
	left: 330px;
	width: calc(100vw - 330px);
	position: relative;
	position: fixed;
	top: 0;
	
	z-index: 1;
	background-color: rgba(255,255,255,.5);
    backdrop-filter: blur(10px);
}
	header.closed {
		left: 80px;
		width: calc(100vw - 80px);
	}
#small_main { 
	width: 75px;
	height: 75px;
	font-size: 1.5em;
	justify-content: center;
	align-items: center;
	display: none;
}

#small_sub_c { 
	width: 75px;
	height: 75px;
	font-size: 1.5em;
	justify-content: center;
	align-items: center;
	display: none;
}


#sub_controls {
		
		padding:0px 30px 0px 0px;
	   	display: inline-flex;
    	align-items: center;
		justify-content: right;
		height: 75px;
		box-sizing: border-box;
		width: inherit;	
	}

header.hidden { display: none; }
		#welcome_txt { font-size: 1.5em; margin-right: auto; }
			#sub_controls h2 { margin-left: 30px; color:#33496F; display: inline-flex; align-items: center; text-transform: uppercase; font-size: 1.4em;  }
				#sub_controls h2 i{ margin-right: 10px; color: var(--select-color); }
			.push-left{ margin-left: auto; }
			#sub_controls span.loadContent, #sub_controls .opt_btn, #sub_controls .loadRContent {
				    height: 50px; border-radius: 5px; padding: 0px 10px; background-color: var(--btn-upbar-bg); color: var(--btn-upbar-color); cursor: pointer; display: flex; align-content: center; flex-wrap: wrap; margin: 0px 5px; }

				#sub_controls span.loadContent:hover, #sub_controls span.opt_btn:hover { background-color: var(--btn-upbar-bg-hover); color: var(--btn-color-dark); }
			#sub_controls span i {
				opacity:.5;
				font-size:1.5em !important; 
				/* flex: 0 0 20px; */
				margin: 0px 10px 0px 0px; 
			}
			
			#sub_controls span.uplabel {
				height: 50px; border-radius: 5px; padding: 0px 10px; background-color: var(--color-white); color: var(--btn-upbar-color); display: flex; align-content: center; flex-wrap: wrap; margin: 0px 5px;
			}

			/* B Ú S Q U E D A */
			.list_search_options_container{
				display: flex;
				height: 100%;
				justify-content: center;
				align-items: center;
				width: 0px;
				overflow: hidden;
				transition: .5s ease all;
			}
				.list_search_options_container.on { width: 250px;}
				.list_search_options_container .list_filter select, .list_search_options_container .upbar_filter input{
					height: 50px; box-sizing: border-box; border: #EFEFEF solid thin; width: 90px; margin: 0px 5px 0px 0px; color: var(--btn-color-light);
				}
					.list_search_options_container .upbar_filter input{ width: 150px;     padding-left: 5px; }


/* H) CURTAIN*/

.blur_effect.on {
		/*-webkit-filter: blur(7px);
		-moz-filter: blur(7px);
		-o-filter: blur(7px);
		-ms-filter: blur(7px);
		filter: blur(7px);*/
	}
	
	#curtain_container {
		display:block;
		position:absolute;
		min-height:100%;
		height:auto;
		width:100%;
		margin:0px auto;
		top:0;
		left:0;
		z-index:1000;
		
		
	}
		#curtain_container.hidden { display:none !important; }
		.curtain{
		    background-color: rgba(0,0,0,.5);
			padding-top:1px;
			position:fixed;
			height:100%;
			min-height:100%;
			top:0;
			width:100%;
			overflow:auto;
			
			display: flex;
   			justify-content: center;
			align-items: center;
			
			/* B L U R */
			-webkit-filter: blur(7px);
			-moz-filter: blur(7px);
			-o-filter: blur(7px);
			-ms-filter: blur(7px);
			filter: blur(7px);
		}
		.curtain:first-child{ backdrop-filter: blur(10px); }
		
		.curtain:last-child {
			-webkit-filter: none;
			-moz-filter: none;
			-o-filter: none;
			-ms-filter: none;
			filter: none;
			
			transition: width .5s ease;
		}

			#curtain_container.r_panel_show .curtain { width: calc(100% - 350px); }

				.close_curtain {
					    position: absolute;
						top: 10px;
						right: 10px;
						color: var(--color-red);
						background-color: var(--color-white);
						padding: 0px 9px;
						border-radius: 50%;
						font-size: 1.5em;
				}		
	
			/* IFRAME CURTAIN */

			.load_new_page {
				display: block;
				width: 90%;
				max-width: 1000px;
				height: 99%;
				margin: 0px auto;
				text-align: center;
				border: none;
			}
		
/* I) M A N A G E */

	.form_manage {
		background-color: #FFF;
		display: block;
		width: 95%;
		max-width: 1000px;
		height: auto;
		overflow: auto;
		border: #ebebeb solid thin;
	    border-radius: 12px;
		max-height: 95vh;
		box-sizing: border-box;
			
	}
		.form_title{
			display: block;
			padding: 20px 30px;
			background-color: #fbfbfb;
			font-family: 'sf_pro_textthin';
			position: relative;
			border-bottom: #ebebeb solid thin;
		}

			.form_title h1{
			    width: 95%;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.manage_title_icon{
				margin-right: 20px;
			}

			.form_title .close_curtain{
				position: absolute;
				right: 30px;
				top: 30px;
				font-size: .8em;
			}

.form_submit {
    opacity: 0; height: 1px; width: 1px; display: none; -webkit-appearance: none;
}

.span_form_btns{
	display: flex;
	position: absolute;
	bottom: 0px;
	right: 20px;
}
.span_form_btn {
	border: none;
    border-radius: 10px !important;
    font-size: 1.2em;
    margin: 10px 15px;
    cursor: pointer;
    transition: opacity .5s ease;
    box-sizing: border-box;
    width: auto;
    opacity: .85;
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0px 10px;
}
	.span_form_btn.icon_span{ padding-left: 0px; }
	
	.span_form_btn i {
		opacity: .5;
		margin: 0px 10px;
	}
.span_form_btn:hover{ opacity: 1; }
	.span_submit {
		background-color: var(--btn-confirm);
		color: #FFF;
		justify-content: center;
	}
		.span_submit.comment_save {
			background-color: var(--btn-upbar-bg);
			color: var(--btn-upbar-color);
		}

	.span_manage_cancel{
		background-color: var(--btn-reject);
		color: #FFF;
	}

.main_input_container{ 
	padding: 10px 20px; 
	max-height: calc(95vh - 123px);
	overflow: auto;
	padding-bottom: 95px;
	box-sizing: border-box;
}

	#r_panel_content .form_manage .main_input_container{
		max-height: calc(100vh - 88px);
	}


	/* M U L T I P L E  T A B L E S */

	.multiple_tb_container {
		border: var(--color-blue) solid 2px;
   		padding: 20px;
		box-sizing: border-box;
	}
		.multiple_tb_container .recordb:not(:first-child) { border-top: var(--color-blue) double 2px; }

	.mt_btn_container{ text-align: center; }
	.multiple_tb_btn {
		position: relative;
		display: inline-block;
		width: auto;
		text-align: center;
		background-color: #416eef;
		color: #FFF;
		text-decoration: none;
		height: 40px;
		line-height: 2.5;
		margin: 10px;
		padding-left: 50px;
		padding-right: 30px;
		border-radius: 5px;
		opacity: .8;
	}
	.multiple_tb_btn:hover{ opacity: 1; }
	
		.multiple_tb_btn i {
			position:absolute;
			left:15px;
			font-size:1.2em;
			opacity:.3;
			top:-3px;
		}
		
		.recordb {
			position:relative;	
		}
		
			.recordb_delete {
				color:#F00;
				padding: 5px 8px 2px;
				transition: all .5s ease;
				font-size: 1.2em;
				cursor:pointer;
				margin:0px;
				z-index:1;
				position:absolute;
				right:10px;
				opacity:.5;
				
			}
			
				.recordb_delete:hover {
					opacity:.1;
				}

			.recordb_new {
					position: absolute;
					cursor: pointer;
					color: #626262;
					right: 0px;
					top: 0px; 
				}
				recordb_new:hover {
					color: #88a4d3;
				}

	/* I N P U T S */

/* Tooltip */
	#tooltip_container {
		color: #323232;
		position: absolute;
		display: none;
		padding: 5px 20px 5px 20px;
		max-width: 35%;
		z-index:3001;
		box-shadow:rgba(0,0,0,.3) -1px 1px 2px;
		
		border:#EAEBEC solid thin;
		font-size: .8em;
		text-align:left;
		background-color:rgba(255,255,255,.9);
		
		max-height:300px;
		overflow:auto;
	}
	
.tooltip-source-html { display: none; }
	
	.tooltipQuestion {
		font-size:1em;
		float:right;
		margin: -3px 5px 0px 0px;
		color:#C3C3C3;
		width:16px;
		height:16px;
		cursor:pointer;
		text-align:center;
	}
		.tooltipQuestion:hover {
			color:#0B189A;	
		}
	
	

	.inputError { font-size:.7em; color:#CCC; }
		.inputError i { color:#CC0000; }
	
	.input_section {
		position:relative;
		display:inline-block;
		height:auto;
		margin:20px 0px;
		vertical-align:top;
		box-sizing:border-box;
	}
	
		.input_1x { width:98%; }
		.input_2x { width:44%; margin-right:1%; }
		.input_3x { width:31%; margin-right:1%; }
		.input_4x { width:24%; margin-right:5px; }
		.input_5x { width:19%; margin-right:10px; }
		.input_6x { width:15%; margin-right:10px; }
	
	
			/* Para Manage en r_panel*/

	.errorMessage {
		position:absolute;
		right:0px;
		font-size:.7em;
		text-align:right;
	}
	
	label.label_spry {
		font-family: var(--font-regular); 
		font-size: .9em !important;
		color: #B6BED9 !important;
		text-transform: uppercase;
		display: block;
	}
	
	/* INPUT - TEXTFIELD */
	.aTextField {
		font-family: var(--font-regular); 
		background-color: #ffffff;
		border: #E5E5EE solid thin !important;
		border-radius: 10px;
		cursor: pointer;
		-webkit-appearance: none;
		box-sizing: border-box;
		padding: 0px 20px;
		font-size: 1em;
		color: var(--btn-confirm);
		height:40px;
		width:100%;	
	}

	/* INPUT - TEXTAREA */
	.aTextArea {
		font-family: var(--font-regular);
		background-color: #ffffff;
		border: #E5E5EE solid thin !important;
		border-radius: 10px;
		-webkit-appearance: none;
		box-sizing: border-box;
		padding: 10px 20px;
		font-size: 1em;	
		color: var(--btn-confirm);
		resize: none;
		height: 80px;
		width: 100%;
	}

	/* INPUT - DATEPICKER */
	
	.date_calendar {
			position: absolute;
			font-size: 1.5em;
			color: var(--color-blue);
			right: 15px;
			top: 33px;
		}
	
	/* S W I T C H */

	.switch_cont {
			display:block;
			margin: 5px;
		}
			.switch_cont p {
				font-size:.6em;
				text-align:center;
				font-family: var(--font-medium);	
			}

		.switch {
			display:block;
			width:40px;
			height:20px;
			background-color:#F3F3F3;
			border-radius:10px;
			margin:0px auto;
			box-shadow:rgba(0,0,0,.2) 1px 1px 1px inset;
			cursor:pointer;
			overflow:auto;

			-webkit-user-select: none; 
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
		}

			.switch span {
				display:block;
				width:18px;
				height:18px;
				margin-top:1px;
				border-radius:50%;
				background-color:#EAEAEA;
				transition:all .5s ease;
				box-shadow:rgba(0,0,0,.5) 1px 1px 1px;


			}


				.switch.on span {
				margin-left:21px;
				background-color:#41CA52;

			}

			.switch.canceled { opacity:.8; }

				.switch.canceled span { display:none; }

	/* INPUT - SELECT  */
	.aSelect {
		background-image: url(../_img/themes/main/arrow_select.jpg);
		background-repeat: no-repeat;
		font-family: var(--font-regular);
		background-position: right;
		background-color: #ffffff;
		border: #E5E5EE solid thin !important;
		border-radius: 10px;
		-webkit-appearance: none;
		box-sizing: border-box;
		padding: 10px 20px;
		margin: 0px auto;
		font-size: 1;
		color: #725091;
		display:block; 
		overflow: hidden;
		height: 40px;
		width: 100%;
	}

	/* UPLOAD FILES */
	
		div.upload {
			display: flex;
			width: 250px;
			background-color: var(--btn-confirm);
			overflow: hidden;
			cursor: pointer;
			position: relative;
			margin: 10px auto;
			border-radius: 10px;
			align-items: center;
			padding: 10px 5px;
			font-size: 1.2em;
			color: var(--font-color-light);
			opacity: .8;
		}

		.upload_text { 
			width: 100%;
    		text-align: center;
    		
		} 
			div.upload i { margin: 0px 10px; }

			div.upload:hover { opacity: 1; }
	
	div.upload input {
		position:absolute;
		cursor:pointer;
		margin:0px;
		display: block !important;
		width: 100%!important;
		height: 100% !important;
		opacity: 0 !important;
		overflow: hidden !important;
	}
	
	.upload_container {
		box-sizing: border-box;
    	border: #dadada dashed thin;
    	border-radius: 15px;
		display: inline-block;
		background-color: #fbfbfb;
	}
	
	.upload_container .fileName {
	position:relative;
	width:600px;
	text-align:center;
	height:auto;
	
	min-height:100px;
	margin: 10px auto;
	overflow:hidden;
		
		-webkit-transition:all.5s ease-in-out;
		-moz-transition:all.5s ease-in-out;
		-o-transition:all.5s ease-in-out;
		transition:all.5s ease-in-out;
	}
	
	
	/* FILE LIST */
	
	.files_container{
		height:auto;
		max-height:500px;
		overflow:auto;	
	}
	
		.file_loading {
			display:none;
			width:227px;
			margin:0px auto;	
		}
			.file_loading.on {
				display:block;	
			}
			
			
			/* FILE LOADED LIST ROW */
			
			.loaded_item_row {
				display:block;
				width:100%;
				text-align:left;
			}

	.loaded_item_row:nth-child(even) {
			background-color:rgba(255,255,255,.3);
	}

.loaded_item_row div { display:inline-block; vertical-align:middle; box-sizing:border-box; text-align:center; }


	.loaded_img {
		width:150px;
		height:auto;
		background-size:cover;
		background-position:center;
	}
			.loaded_img img {
				    max-width: 150px;
					margin: 5px auto;
					width: auto;
					height: auto;
					max-height: 150px;
			}
			
			.loaded_img i {
				font-size:2em;
				color:#CACACA;		
			}

	.loaded_file_name {
		width: 250px;
	}
	
		.loaded_file_name p { font-size:.9em; text-align:left;
			width:100%;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			padding:0px;
		
		 }
	.loaded_file_options { 
		cursor:pointer;
		width:100px; 
	}
		.loaded_file_options i {
			    color:var(--font-color-light);
				padding: 10px;
				border-radius: 5px;
				font-size: 1.5em;
				background-color:var(--btn-confirm);
				opacity: .8;
		}
				.loaded_file_crop:hover i, .loaded_file_delete:hover i { opacity: 1; }

	/*.upload_container */
	.fileName p, .fileName a { 
		display:inline-block;
		font-weight:lighter;
		margin:15px 5px;
		height:30px;
		padding-left:35px;
		text-align:left;
		font-size:.85em;
		background-position:left top;
		background-repeat:no-repeat;
		background-size:contain;
		text-decoration:none;
		color:#323232;
		line-height:2;
		box-sizing:border-box;
	
	}
	
	.upload_container .fileName span.Spry { border-top:#CACACA dotted thin; width:50%; display:block; margin:0px auto; padding:3px 0px;}/*Fondo azul para checkbox eliminar galeria*/
	
		.upload_container .fileName span.Spry label { color:#323232; } /*Color blanco para checkbox eliminar galeria*/
			
		
		.thumbnailImage {display: inline-block; margin:5px; width:90px; height:90px; border:#BABABA solid thin; background-position:center; background-repeat:no-repeat; background-size:cover; 
		
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		box-sizing: border-box;
		}
		
		.imageElement { height:90px; width:inherit; border:#BABABA solid thin;  margin:5px 0px 5px 5px;}


/* J) R-PANEL / COMMENTS */
	
	.transition {
			-webkit-transition: all .3s ease-out;
			-moz-transition: all .3s ease-out;
			-o-transition: all .3s ease-out;
			transition: all .3s ease-out;
		}

	#r_panel{
			position:fixed;
			padding-top: 0px;
			right:0px;
			top:0px;
			background-color: #FFF;
			width: 350px;
			height: 100%;
			margin-right:-350px;
			z-index: 1999;
			box-sizing:border-box;
			overflow:auto;
		    border-left: #e2e7f0 solid thin;
		}
		.r_panel_show{
				margin-right: 0px !important;
			}
	
	#r_panel_content{
		height: calc(100vh - 88px);
    	overflow: auto;	
	}

	#r_panel .form_manage {
			margin: 0px;
			width: 100%;
			height: auto;
			background-color: var(--color-white);
			display: block;
		}

			#r_panel .input_section { margin: 0px auto; }
				/*#r_panel .textfieldHintState input { color: #010101 !important; font-size: .9em !important;}*/
	
		.comment{
				position: relative;
				height: auto;
				margin:8px 0px;
			}
		
		#history_comment {
				display: block;
				width:100%;
				position: relative;
				margin-top: 25px;
				padding: 0px 10px;
				min-height:200px;
				box-sizing: border-box;
			}
		
		.day_comment {
				text-align:center !important;
				display:block;
				font-size:.7em;
				color:#D2D2D2;
				border-bottom:#C2C2C2 dotted thin;
				margin-top:20px;	
			}
			
			.day_comment:first-letter {
				text-transform: capitalize;
			}
		
			#r_panel .comment p { 
				font-size: .85em;
				line-height: 1.5;
				padding: 0px 10px 0px 50px;
			}
		
		.comment_name {
				color: #010101;
				margin-left: -35px;
				font-size: 1.2em;
			} 
			.comment_name img { display: inline-block; vertical-align: middle; width: 30px; height: 30px; margin-right: 4px; border-radius: 50%; }
		.comment_name.actual_user {
			color:#d3d3d3;
		}
		.clear_comment { 
			display:block;
			clear:both;
		}
		
		#r_panel .comment sup{
				color: #C2C2C2;
				display: block;
				font-size: 0.6em;
				margin-left: 50px;
			}
			#r_panel .form_submit {
				top: 130px;
				bottom: inherit;
				right: inherit;
				padding: 10px 90px;
				margin: 0px 21px;
				display: none;
				background-color: rgba(1, 144, 214, 0.45);
			}
				.comment_out p {
					color: #717171;
					text-transform: uppercase;
					text-align: center;
				}

			.comment_input {
				display: block;
				border-radius: 5px;
				width: 80%;
				color:#010101 !important;
				margin: auto;
				border: none !important;
				background-color: #f5f8fa;
			}
		
			#r_panel .errorMessage {
				    right: 10px;
    				bottom: 5px;
			}

		/* "RETRACT" Section: #acción generica para mostrar u ocultar un contenido  */

	.retract_resume {
			display: block;
			width: 100%;
			color: #010101;
			text-align: center !important;
			border-bottom:#e4e6ec solid thin;
		}
		
			.retract_resume span {
				display: inline-block;
				cursor: pointer;
				font-size: 1.3em;
				color: #34d9f8;
				padding: 5px 8px;
				text-align: center;
				vertical-align: middle;
			}
					
		.retract_options {
			display:block;
			width:100%;
			height:0px;
			overflow:hidden;
			margin-bottom: 15px;
		}
		
		.comm_target_img {
			    display: block;
				max-width: 150px;
				margin: 15px auto;
				max-height: 150px;
				width: auto;
				height: auto;
		}
		
		#r_panel h4 {
			display:block;
			text-align:center;
			color:#725091;	
		}
		
		#close_comments {
			position: absolute;
			float: right;
			right: 20px;
			color: #f00024;
			cursor: pointer;
			top: 25px;
			font-size: 1.5em;
		}
			#close_comments:hover {
				color:#725091;
			}
		#reload_time {
				text-align: center;
				font-size: .6em;
				color: #717171;	
			}

	/* R-panel resume CC */

	.sudi_cc_title {
			display: block;
			box-sizing: border-box;
			border-bottom: #e2e7f0 solid thin;
			height: 50px;
			color: var(--btn-color-light);
		}
			.sudi_cc_title .cc_title_icon { 
				display: inline-flex;
				vertical-align: top;
				width:50px;
				height: inherit;
				align-items: center;
				justify-content:center;
				color:#adaeb9; 
				font-size: 1.4em;
			}
			.sudi_cc_title .title_txt { 
				display: inline-flex;
				vertical-align: top;
				width: calc(100% - 110px);
				height: inherit;
				align-items: center;
			}
			.sudi_cc_close{
				cursor: pointer;
				display: inline-flex;
				vertical-align: top;
				width:50px;
				height: inherit;
				align-items: center;
				justify-content:center;
				box-sizing: border-box;
			}
				.sudi_cc_close:hover { color:#e84b37; }

	.sudi_cc_container {
		display: block;
		height: auto;
		padding: 10px;
	}
		.sudi_cc_container p { margin: 10px 0px; color: var(--btn-color-light); }
	.sudi_cc_hr {
		border: #e4e6ec solid thin;
		box-shadow: none;
		border-top: none;
		width: 80%;
		margin: 5px auto;
		float: right;
	}
		.sudi_cc_hr.hr_100 { width: 100%; float: none; display: block; margin: 15px 0px; box-sizing: border-box; }
	.st_item_photo { display: inline-block; width: 30px; height: 30px; border-radius: 50%; }

	.sudi_cc_subtitle { color:var(--btn-color-light); width: 90%;  margin: auto; text-align: center; border-bottom:#e4e6ec solid thin;}
	.sudi_cc_resume {column-count: 1; font-size: .9em; width: 100%; max-width: 850px; margin: 10px auto; }
	.sudi_cc_resume p { margin: 5px; margin-left: 10px; font-size: .8em; }
		.sudi_cc_resume p a { color:#34d9f8; text-decoration: underline; }
	
	.sudi_cc_resume p span { display: inline-block; width:75px; color: #c4c4c4; font-size: 1.1em; margin-top: 6px; margin-bottom: 2px; }

	.sudi_cc_resume pre {
			padding: 1em;
			color: #353535;
			background: hsla(0,0%,78%,.3);
			border: 1px solid #c4c4c4;
			border-radius: 2px;
			text-align: left;
			direction: ltr;
			tab-size: 4;
			white-space: pre-wrap;
			font-style: normal;
			min-width: 200px;	
	}

	.sudi_cc_resume .table table tbody tr td { border: 1px solid #c4c4c4; padding: 0px 5px; }

	.sudi_cc_options {display: block; width: 100%; margin: 20px auto; text-align: center; }
	
		.sudi_cc_options span:not(.switch) { 
			cursor: pointer;
			margin: 5px;
			font-size: .9em;
			text-align: center !important;
			width: 20%;
			display: inline-block;
			vertical-align: middle;
			color: var(--btn-color-light);
		}
			.sudi_cc_options span i { display: block; font-size: 1.5em; color: var(--btn-confirm); }
		.sudi_cc_options span:hover { opacity: .7; }
		.sudi_cc_options span a { text-decoration: none; color: #010101; }


/* K) REPORTS */

	/* REPORT LIST */

	#report_items_container {
			display:block;
			width:90%;
			margin:20px auto;
			text-align:center;
		}
			.report_item {
				display:inline-block;
				vertical-align:top;
				margin:30px 2px;
				width:250px;
				min-height:50px;
				box-sizing:border-box;
				background-color:#FFF;
				border-radius:5px;
				overflow:hidden;
				border:#E2E2E2 solid 1px;
			}

				.report_item_info {
					display:block;
					height:120px;
					box-sizing:border-box;
					width:100%;
					padding-top: 1px;
					margin-top: -1px;
					cursor:pointer;

				}

					.report_item_info h3 {
						display:block;
						color:var(--color-red);
						text-align:center;
						margin:0px 10px 10px 10px;	
					}

					.report_item_info .icon {
						font-size:3em;
						margin:20px 0px 0px 0px;	
						display:block;
						text-align:center;
						background: -webkit-linear-gradient(rgba(202, 76, 59, 1) 0%, rgba(106, 81, 142, 1) 35%, rgba(137, 182, 85, 1) 65%, rgba(104, 181, 199, 1));
						-webkit-background-clip: text;
						-webkit-text-fill-color: transparent;	
					}

						.report_item_info:hover { background-color:#FAFAFA; }
						.report_item_info:hover h3{ color:#CACACA;}

				.report_item_resume {
					display:block;
					height:180px;
					box-sizing:border-box;
					width:100%;
					background-color:#FAFAFA;
					padding-top:1px;
					margin-top:-1px;
				}

					.report_item_resume .icon {

						display:block;
						text-align:center;
						margin:60px 0px 0px 0px;
						font-size:4.5em;
						color:#EAEAEA;				
					}

							.report_item_resume:hover .icon {
								color:#FAFAFA;
							}

/* REPORT DETAIL */

#report_list_container {
	padding:30px;
}

	#report_list_container .option_btn {
		float:right;
		cursor:pointer;
		margin-right:20px;
		font-size:1.5em;
	}
		#report_list_container .option_btn i {
			background: -webkit-linear-gradient(rgba(202, 76, 59, 1) 0%, rgba(106, 81, 142, 1) 35%, rgba(137, 182, 85, 1) 65%, rgba(104, 181, 199, 1));
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
		}

	#report_list_container h1 {
		color:var(--color-red);
		font-size:1.6em;	
	}
	
	#report_list_container h2.subtitle {
		display:block;
		position:relative;
		color:var(--sec-color);
		font-size:1.2em;
		margin:50px auto 10px auto;
		padding-left:50px;
		text-align:left;
		width:75%;
	}
	
		 #report_list_container h2.subtitle:after {
			content: " ";
			display: block;
			border-bottom:rgba(114,80,145,.3) solid thin;
			height: 1px;
			width: 90%;
			margin:0px auto 20px auto;
		}​
	
		.report_description span { font-family: 'montserratsemi_bold'; }
		
	#chart_container {
	width:90%;
	max-width:1000px;
	margin:10px auto;
}
	#chart_container canvas {
		width:100%;
	}


.report_table_container {
	display:block;
	width:95%;
	max-width:1200px;
	margin:30px auto;
}
	.report_table_container .table_title {
		display:block;
		text-align:center;
		font-size:.8em;
		margin:2px 0px;	
	}
	.report_table_title_row {
		height:auto;
		background-color:#ca4b3b;
		display: flex; /* Igualamos el alto de lo 'children'*/
	}
	
		.report_table_title_row div {
			display:block;
			height:auto;
			text-align:center;
			padding:8px 0px 8px 0px;
			color:#FFF;
			font-size:.9em;
		}	
		
	.report_table_rows_container {
		border:#b3b3b3 solid thin;
		border-top:none;
		max-height:500px;
		overflow:auto;
		background-color:#FFF;
	}
	
		/* ALT */
		
		.report_table_rows_container.table_alt {
			background-color:rgba(255,255,255,.4);
			border:none;
			border-radius:none;
		}
	
		/* 1000px HEIGHT*/
		
		.report_table_rows_container.table_2x {
			max-height:1000px;
		}
		
		/* NO OVERFLOW */
			
		.report_table_rows_container.no_wrap{
			max-height:none;
			overflow:visible;
		}	
		
	.report_table_row {
		display: flex; /* Igualamos el alto de lo 'children'*/
	}
			
		.report_table_row div {
			position:relative;
			display:inline-block;
			text-align:center;
			padding:18px 0px 18px 0px;
			color:#3c3c3b;
			font-size:.8em;
			box-sizing:border-box;
			
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}	
			
			.line_report_table_row {
				display:block;
				width:85%;
				margin:5px auto;
				height:2px;
				border-bottom:#eaeaea solid thin;
					
			}
	
			.report_table_row_result div {
				padding-top:8px;
				font-size:1.1em;
			}
	
			/* HEADER CONTROLS */
			
			.header_content .input_section {
				margin-top:0px;
				max-width:140px;
			}
			
				.header_content .tooltipQuestion {
					font-size:.6em;	
				}
				
				.header_content .Spry {
					width:100% !important;
				}
					.header_content .Spry label {
						margin:2px 0px 0px 0px;
						text-align:center;
						font-size:.7em;
						
						color:rgba(255,255,255, .85);
					    font-family: 'montserratregular';
					}
					
					.header_content .aTextField { height:30px; border-radius:14px; background-color:rgba(255,255,255,.7); }
					.header_content .date_calendar { top:29px; }
					
			.header_content .report_upbar_btn {
				display:inline-block;
				height:36px;
				width:auto;
				padding:10px 10px;
				border:rgba(255,255,255,.8) solid 2px;
				box-sizing:border-box;
				margin:7px 25px;
				border-radius:6px;
				color:rgba(255,255,255,.8);
				font-size:.8em;
				cursor:pointer;
				transition:all .5s ease;
			}
			
				.header_content .report_upbar_btn:hover {
					background-color:rgba(255,255,255,.9);
					border:rgba(255,255,255,.9) solid 2px;
					color:#6cc04a;	
				}
				
			.report_btn_container {
				display:flex;
				width:80%;
				max-width:600px;
				margin:20px auto;	
			}
			
				.report_detail_btn {
					display:inline-block;
					width:40%;
					margin:5px auto;
					color:#FFF;
					padding:10px 5px;
					text-align:center;
					border-radius:6px;
					cursor:pointer;
					transition:all .5s ease;
					box-sizing:border-box;
					opacity:.8;
					
				}
				
					.report_detail_btn.red {
						background-color:rgba(232,75,55, .8);
						border-color:var(--color-red);
					}
		
					.report_detail_btn.green {
						background-color:rgba(108,192,74, .8);
						border-color:#6cc04a;
					}	
			
						.report_detail_btn:hover {
							opacity:1;
						}
				
			/* DETALLE - CURTAIN*/
			
			.reporte_detail_container {
				display:block;
				width:90%;
				margin:20px auto;
				padding:10px;	
				
			}
			


	/* REPORT LIST */

	#report_items_container {
			display:block;
			width:90%;
			margin:20px auto;
			text-align:center;
		}
			.report_item {
				display:inline-block;
				vertical-align:top;
				margin:30px 2px;
				width:250px;
				min-height:50px;
				box-sizing:border-box;
				background-color:#FFF;
				border-radius:5px;
				overflow:hidden;
				border:#E2E2E2 solid 1px;
			}

				.report_item_info {
					display:block;
					height:120px;
					box-sizing:border-box;
					width:100%;
					padding-top: 1px;
					margin-top: -1px;
					cursor:pointer;

				}

					.report_item_info h3 {
						display:block;
						color:var(--color-red);
						text-align:center;
						margin:0px 10px 10px 10px;	
					}

					.report_item_info .icon {
						font-size:3em;
						margin:20px 0px 0px 0px;	
						display:block;
						text-align:center;
						background: -webkit-linear-gradient(rgba(202, 76, 59, 1) 0%, rgba(106, 81, 142, 1) 35%, rgba(137, 182, 85, 1) 65%, rgba(104, 181, 199, 1));
						-webkit-background-clip: text;
						-webkit-text-fill-color: transparent;	
					}

						.report_item_info:hover { background-color:#FAFAFA; }
						.report_item_info:hover h3{ color:#CACACA;}

				.report_item_resume {
					display:block;
					height:180px;
					box-sizing:border-box;
					width:100%;
					background-color:#FAFAFA;
					padding-top:1px;
					margin-top:-1px;
				}

					.report_item_resume .icon {

						display:block;
						text-align:center;
						margin:60px 0px 0px 0px;
						font-size:4.5em;
						color:#EAEAEA;				
					}

							.report_item_resume:hover .icon {
								color:#FAFAFA;
							}