/*
 _____   _____        ___  ___   _____   _____   _____    _____
/  ___| |  _  \      /   |/   | /  ___| /  _  \ |  _  \  | ____|
| |     | |_| |     / /|   /| | | |     | | | | | |_| |  | |__
| |     |  _  /    / / |__/ | | | |     | | | | |  _  /  |  __|
| |___  | | \ \   / /       | | | |___  | |_| | | | \ \  | |___
\_____| |_|  \_\ /_/        |_| \_____| \_____/ |_|  \_\ |_____|

Hoja principal de estilo de onCustomer.
URL de referencia: corecss.isyc.com

*/

/***************************************/
/************ Generales ****************/
/***************************************/

@import "fonts/materialdesignicons.css";
@import "fonts/font-opensans.css";
@import "fonts/font-robotocondensed.css";
@import "core-icon.css";
@import "extra-icon.css";
@import "print.css" print;

* {
	margin: 0;
	padding: 0;
}

html {
	font-size: 13px;	
}

body {
	background: #edecec;
	color: #000;
}

body,
textarea,
input,
button,
select {	
	font: 13px 'Open Sans', Arial, sans-serif;
}

p[hidden] {
	display: none;
}

img {
	border: 0;
}

.clear {
	clear: both;
}

a:link,
a:visited,
a:active {
    color: #373737;
	text-decoration: none;
}

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

a:link.mdi {
	color: #939292;	
}

a:link.mdi:hover {
  color: #000;
}

.untouchable{
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
}

hr {
	border-right: 0;
	border-left: 0;
	border-top: 0;
	border-bottom: 1px solid #ced4da; /* Dotted ya está el estado readonly */
}

.mdi {
	color: #939292;
}

h1,
h2,
h3,
h4,
h5,
h6 {	
	font-weight: normal;
	color: #666;
	font-family: 'roboto_condensedregular';
	margin-bottom: 1.1rem;
}

h1 {
	font-size: 25px;
}

h2 {
	font-size: 21px;
}

h3 {
	font-size: 19px;
}

h4 {
	font-size: 17px;
}

h5 {
	font-size: 15px;
}

h6 {
	font-size: 13px;
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small {
    font-size: 65%;
}

h1 .mdi.rounded-circle,
h2 .mdi.rounded-circle,
h3 .mdi.rounded-circle,
h4 .mdi.rounded-circle, 
h5 .mdi.rounded-circle, 
h6 .mdi.rounded-circle  {
	background: #7bc6e9;
	color: #fff !important;
	display: inline-block;
	margin: 0px 5px 0 0;
	text-align: center;
}

h1 .mdi.rounded-circle {
	min-width: 41px;
	height: 41px;
	line-height: 41px;	
}

h2 .mdi.rounded-circle {
	min-width: 36px;
	height: 36px;
	line-height: 36px;	
}

h3 .mdi.rounded-circle {
	min-width: 28px;
	height: 28px;
	line-height: 28px;	
}

h4 .mdi.rounded-circle {
	min-width: 23px;
	height: 23px;
	line-height: 23px;
}

h5 .mdi.rounded-circle {
	min-width: 18px;
	height: 18px;
	line-height: 18px;
}

h6 .mdi.rounded-circle {
	min-width: 15px;
	height: 15px;
	line-height: 15px;
}


h1 .mdi {
	font-size: inherit;
}

h2 .mdi {
	font-size: inherit;
}

h3 .mdi {
	font-size: 17px;
}

h4 .mdi {
	font-size: 14px;
}

h5 .mdi {
	font-size: 12px;
}

h6 .mdi {
	font-size: 10px;
}

h1.border-bottom,
h2.border-bottom,
h3.border-bottom,
h4.border-bottom,
h5.border-bottom,
h6.border-bottom {
	border-bottom: 1px solid #ccc;
	padding-bottom: 2px;
}

h1[class^='bg-'],
h2[class^='bg-'],
h3[class^='bg-'],
h4[class^='bg-'],
h5[class^='bg-'],
h6[class^='bg-'] {
	width: 100%;
	padding: 5px 10px;
	box-sizing: border-box;
}

h1.bg-primary,
h2.bg-primary,
h3.bg-primary,
h4.bg-primary,
h5.bg-primary,
h6.bg-primary {
	color: #fff;
}

h1.bg-secondary,
h2.bg-secondary,
h3.bg-secondary,
h4.bg-secondary,
h5.bg-secondary,
h6.bg-secondary {
	color: #fff;
}

h1.bg-light-grey,
h2.bg-light-grey,
h3.bg-light-grey,
h4.bg-light-grey,
h5.bg-light-grey,
h6.bg-light-grey {
	color: #888;
}

.nowrap {
	white-space: nowrap;
}

/* Dividers */

hr.dotted {
	border-bottom: 1px dotted #ddd;
}

hr.dashed {
	border-bottom: 1px dashed #ddd;
}

/* Cursor */

.cursor-alias {
	cursor: alias;
}

.cursor-all-scroll {
	cursor: all-scroll;
}

.cursor-auto {
	cursor: auto;
}

.cursor-cell {
	cursor: cell;
}

.cursor-context-menu {
	cursor: context-menu;
}

.cursor-col-resize {
	cursor: col-resize;
}

.cursor-copy {
	cursor: copy;
}

.cursor-crosshair {
	cursor: crosshair;
}

.cursor-default {
	cursor: default;
}

.cursor-e-resize {
	cursor: e-resize;
}

.cursor-ew-resize {
	cursor: ew-resize;
}

.cursor-grab {
	cursor: -webkit-grab;
	cursor: grab;
}

.cursor-grabbing {
	cursor: -webkit-grabbing;
	cursor: grabbing;
}

.cursor-help {
	cursor: help;
}

.cursor-move {
	cursor: move;
}

.cursor-n-resize {
	cursor: n-resize;
}

.cursor-ne-resize {
	cursor: ne-resize;
}

.cursor-nesw-resize {
	cursor: nesw-resize;
}

.cursor-ns-resize {
	cursor: ns-resize;
}

.cursor-nw-resize {
	cursor: nw-resize;
}

.cursor-nwse-resize {
	cursor: nwse-resize;
}

.cursor-no-drop {
	cursor: no-drop;
}

.cursor-none {
	cursor: none;
}

.cursor-not-allowed {
	cursor: not-allowed;
}

.cursor-pointer {
	cursor: pointer;
}

.cursor-progress {
	cursor: progress;
}

.cursor-row-resize {
	cursor: row-resize;
}

.cursor-s-resize {
	cursor: s-resize;
}

.cursor-se-resize {
	cursor: se-resize;
}

.cursor-sw-resize {
	cursor: sw-resize;
}

.cursor-text {
	cursor: text;
}

.cursor-w-resize {
	cursor: w-resize;
}

.cursor-wait {
	cursor: wait;
}

.cursor-zoom-in {
	cursor: zoom-in;
}

.cursor-zoom-out {
	cursor: zoom-out;
}

/* Opacidad */


.opacity-0 {
  opacity: 0;
}

.opacity-10 {
  opacity: 0.1;
}

.opacity-20 {
  opacity: 0.2;
}

.opacity-30 {
  opacity: 0.3;
}

.opacity-40 {
  opacity: 0.4;
}

.opacity-50 {
  opacity: 0.5;
}

.opacity-60 {
  opacity: 0.6;
}

.opacity-70 {
  opacity: 0.7;
}

.opacity-80 {
  opacity: 0.8;
}

.opacity-90 {
  opacity: 0.9;
}

.opacity-100 {
  opacity: 1;
}

/* Para la maquetación antigua dentro de P */
/* Esto es pq Bootstrap trae definido INPUT sin prefijos */

p input[type="text"],
p input[type="name"],
p input[type="number"],
p input[type="address"],
p input[type="email"],
p input[type="password"],
.scroll input,
table.documento input,
fieldset input[type="text"],
textarea,
select {
	border: 1px solid #ced4da; /* Mismo color de borde que Bootstrap */
	color: #495057;
	transition: all 0.2s ease-in-out;
	box-sizing: border-box;
	padding: 3px 5px;
}

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

input.no-arrows::-webkit-outer-spin-button,
input.no-arrows::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

input.no-arrows[type=number] {
    -moz-appearance:textfield; /* Firefox */
}

textarea {
	padding: 5px;
	box-sizing: border-box;
	resize: vertical; /* A petición de un cliente. */
	width: 100%;
}

/* Esquema principal */

#header_container {
	width: 100%;
	height: 80px;
	background: #2aa7de;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.10);
	margin: 0 0 10px 0;
}

#header {
	max-width: 1140px;
	margin: 0 auto;
	color: #fff;
	position: relative;
	padding-right: 10px;
}

.container {
	margin: 0 auto;
	padding: 0 0 20px 0;
	color: #000;
	min-height: 100%;
	height: 100%;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* HACK IE 11 */
	.container {
		table-layout: fixed;
	}
}

.container #column {
	float: left;
	width: 250px;
	margin-right: 25px;
}

#content {
	float: left;
	max-width: 865px;
	width: 865px;
	/* Importante: Ancho necesario para que funcione el zoom negativo */
	background: #fff;
	border: 1px solid #d9d8d8;
}

#content #flex_container {
	display: flex;
	display: -ms-flexbox;
	position: relative;
	margin: 0;
}

#content .noFlexIE#flex_container {
	display: inherit;
}

#content #main {
	padding: 20px; /* El padding inportante lo de este div que está en todas las páginas */
	color: #000;
	background: #fff;
	flex-grow: 1;
	position: relative;
	max-width: 100%;
}

#sidebar {
	max-width: 250px;
	min-width: 250px;
	padding: 10px 20px 0 0;
	/* Cuidado con estos valores, los iconos de esta zona deben de coincidir con los de #header_object*/
	background: #fff;
}

#sidebar.sidebarIE{
	position: absolute;
	border: 1px solid #d9d8d8;
	border-right: 0px;
	top: 0;
	right: 0;
	padding: 10px 10px 0px 10px;
	z-index: 667;
	box-shadow: -5px 2px 20px -14px rgba(0, 0, 0, 0.5);
	display: none;
	overflow: auto;
}

/* Iconos  */

.round .mdi.text-white {	
	text-shadow: none !important;
}

.round {	
	display: inline-table;
	border-radius: 50%;
	text-align: center;		
}

.round span {	
	display: block;
}

.round .mdi:before,
.round span {
	height: 48px;
	width: 48px;
	line-height: 48px;
	font-size: 24px;
}

.round.round-sm .mdi:before,
.round.round-sm span {
	height: 36px;
	width: 36px;
	line-height: 36px;
	font-size: 18px;	
}

.round.round-lg .mdi:before,
.round.round-lg span {
	height: 72px;
	width: 72px;
	line-height: 72px;
	font-size: 36px;		
}

/* main color */

#content .mdi,
#content .mdi.info,
#content .mdi.info:hover,
.container .mdi,
.container .mdi.info,
.container .mdi.info:hover,
.container-fluid .mdi,
.container-fluid .mdi.info,
.container-fluid .mdi.info:hover,
.popup .mdi,
.popup .mdi.info,
.popup .mdi.info:hover  {
	font-size: 20px;
	color: #6599b0;
	vertical-align: middle;
}

#content .mdi:hover,
.container .mdi:hover { /* container para los nuevos portales */
	  color: #000;
}

/* se fuerza el gris */

/* disabled */

a.disabled:hover .mdi,
.mdi.disabled:hover{
  cursor: not-allowed !important;
}

a.disabled .mdi,
.mdi.disabled,
a.disabled:hover .mdi,
.mdi.disabled:hover {
    color: #e2e2e2 !important;
}

/* tamaños */

.mdi-64px.mdi-set,
.mdi-64px.mdi::before {
    font-size: 64px;
}

.mdi-128px.mdi-set,
.mdi-128px.mdi::before {
    font-size: 128px;
}

.mdi-256px.mdi-set,
.mdi-256px.mdi::before {
    font-size: 256px;
}

.mdi-512px.mdi-set,
.mdi-512px.mdi::before {
    font-size: 512px;
}

/***************************************/
/*************** Login *****************/
/***************************************/

#login_contenedor {
	background: #ececec;
}

#login_contenedor .form-group {
	margin-bottom: 1.5rem;
}

#login_contenedor #caja .campos {
	padding: 3.5rem 2.5rem 2.5rem 2.5rem;
}

#login_contenedor #caja .campos form input { /* Fuera el horrible autofill background */
	filter: none;
    -webkit-box-shadow: 0 0 0px 1000px white inset;	
}

#login_contenedor #caja {
	position: absolute;
	z-index: 5;
	top: 50%;
	left: 50%;
	width: 400px;
	margin-top: -220px;
	margin-left: -200px;
	text-align: center;
	background: #fff;
	padding: 45px 0 0 0;
	/* El padding va aquí y no en .logo por los portales */
	border: 1px solid #d9d8d8;
	box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
}

#login_contenedor #footer {
	background: url('../../theme/images/login_fnd.png') repeat-x;
	width: 100%;
	height: 56px;
	position: absolute;
	bottom: 0;
	z-index: 666;
}

#login_contenedor #footer p.version {
	float: right;
	color: #fff;
	margin: 23px 23px 0 0;
}

#login_contenedor .errors {
	margin: 1em 0 0 0;
	font-size: 12px;
}

/***************************************/
/************** Errores ****************/
/***************************************/

div.error {
	display: block;
	width: 580px;
	height: 580px;
	margin: 1em auto;
	border-radius: 99em;
	border: 7px solid #fff;
	box-shadow: 11px 10px 11px rgba(0, 0, 0, 0.15);
	position: relative;
	background: url('../../images/error_sdw.png') 100% 100% no-repeat, linear-gradient(#68bde5, #2aa7de);
	box-sizing: content-box;
}

div.error.evillapti:before,
div.error.ko:before,
div.error.lovelapti:before,
div.error.ohno:before,
div.error.sad:before,
div.error.verysad:before,
div.error.what:before,
div.error.oh:before,
div.error.happy:before {	
	content:'';
	position: absolute;
	width: 580px;
	height: 580px;
}

div.error.evillapti:before {
  background: url('../../images/error_evillapti.png') center 37% no-repeat;
}

div.error.ko:before {
  background: url('../../images/error_ko.png') center 37% no-repeat;
}

div.error.lovelapti:before {
  background: url('../../images/error_lovelapti.png') center 37% no-repeat;
}

div.error.ohno:before {
  background: url('../../images/error_ohno.png') center 37% no-repeat;
}

div.error.sad:before {
  background: url('../../images/error_sad.png') center 37% no-repeat;
}

div.error.verysad:before {
  background: url('../../images/error_verysad.png') center 37% no-repeat;
}

div.error.what:before {
  background: url('../../images/error_what.png') center 37% no-repeat;
}

div.error.oh:before {
  background: url('../../images/error_oh.png') center 37% no-repeat;
}

div.error.happy:before {
  background: url('../../images/error_happy.png') center 37% no-repeat;
}

div.error h3 {
	font-size: 32px;
	font-family: 'roboto_condensedregular';
	text-align: center;
	color: #fff;
	margin: 400px auto 0;
	width: 390px;
}

div.error p {
	font-size: 17px;
	font-family: 'robotolight';
	text-align: center;
	color: #fff;
	width: 390px;
	margin: 0 auto;
}

div.error.desc {
	box-shadow: none;
	height: auto;
	border: 0;
	margin: 30px auto;
	background: #fff;
}

div.error.desc p {
	color: #666;
	font-size: 15px;
	width: 100%;
}

div.error.desc p.code {
	font-size: 22px;
	font-weight: bold;
}

/***************************************/
/************** Alertas ****************/
/***************************************/

.alert.alert-description {
	margin: -15px 0 0px 0px;
	color: #a22525;
	display: none;
	width: 100%;
}

.alert.alert-description p {
	margin-bottom: 0;
}

.alert-dangerJS {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}

.alert.alert-danger::before,
.alert.alert-dangerJS::before {
    content: "\f028";
}

.alert.alert-success:before {
	content: "\f133";
}

.alert.alert-warning:before {
	content: "\f02a";
}

.alert.alert-info:before {
	content: "\f2fd";
}

.alert.alert-danger::before,
.alert.alert-dangerJS::before,
.alert.alert-success::before,
.alert.alert-warning::before,
.alert.alert-info::before {
    font: 22px "Material Design Icons";
	position: absolute;
	left: 8px;
	top: 5px;
}

.alert.alert-danger,
.alert.alert-dangerJS,
.alert.alert-success,
.alert.alert-warning,
.alert.alert-info {
	padding-left: 3rem;
}


.alertDiv_container.fixed {
    position: fixed;
    top:0;
    z-index: 666;
}

/***************************************/
/************** Colores ****************/
/***************************************/

.text-lighter-blue {
	color: #e5f6fe !important;
}

.bg-lighter-blue {
	background: #e5f6fe !important;
}

/**/

.text-light-blue {
	color: #b0def4 !important;
}

.bg-light-blue {
	background: #b0def4 !important;
}

/**/

.text-blue {
	color: #68bde5 !important;
}

.bg-blue {
	background: #68bde5 !important;
}

/**/

.text-dark-blue {
	color: #408fcb !important;
}

.bg-dark-blue {
	background: #408fcb !important;
}

/**/

.text-darker-blue {
	color: #22699f !important;
}

.bg-darker-blue {
	background: #22699f !important;
}

/**/

.text-lighter-green {
	color: #e1f7c5 !important;
}

.bg-lighter-green {
	background: #e1f7c5 !important;
}

/**/

.text-light-green {
	color: #abe760 !important;
}

.bg-light-green {
	background: #abe760 !important;
}

/**/

.text-green {
	color: #6dbe89 !important;
}

.bg-green {
	background: #6dbe89 !important;		
}

/**/

.text-dark-green {
	color: #3a9359 !important;
}

.bg-dark-green {
	background: #3a9359 !important;		
}

/**/

.text-darker-green {
	color: #206e3b !important;
}

.bg-darker-green {
	background: #206e3b !important;		
}

/**/

.text-lighter-yellow {
	color: #f9f4cd !important;	
}

.bg-lighter-yellow {
	background: #f9f4cd !important;				
}

/**/

.text-light-yellow {
	color: #f1e9a7 !important;	
}

.bg-light-yellow {
	background: #f1e9a7 !important;				
}

/**/

.text-yellow {
	color: #e6d761 !important;				
}

.bg-yellow {
	background: #e6d761 !important;
}

/**/

.text-dark-yellow {
	color: #cfbe3b !important;		
}

.bg-dark-yellow {
	background: #cfbe3b !important;							
}

/**/

.text-darker-yellow {
	color: #96881a !important;		
}

.bg-darker-yellow {
	background: #96881a !important;							
}

/**/

.text-lighter-orange {
	color: #f4e3d3 !important;
}
	
.bg-lighter-orange {
	background: #f4e3d3 !important;						
}

/**/

.text-light-orange {
	color: #ecba8e !important;
}

.bg-light-orange {
	background: #ecba8e !important;						
}

/**/

.text-orange {
	color: #eaa05e !important;			
}

.bg-orange {
	background: #eaa05e !important;											
}

/**/

.text-dark-orange {
	color: #d5853d !important; 						
}

.bg-dark-orange {
	background: #d5853d !important; 												
}

/**/

.text-darker-orange {
	color: #824916 !important; 						
}

.bg-darker-orange {
	background: #824916 !important; 												
}

/**/

.text-lighter-red {
	color: #fedde2 !important;						
}

.bg-lighter-red {
	background: #fedde2 !important;										
}

/**/

.text-light-red {
	color: #ef8795 !important;						
}

.bg-light-red {
	background: #ef8795 !important;										
}

/**/

.text-red {
	color: #e16778 !important; 								
}

.bg-red {
	background: #e16778 !important;									
}

/**/

.text-dark-red {
	color: #c24355 !important;								
}

.bg-dark-red {
	background: #c24355 !important;											
}

/**/

.text-darker-red {
	color: #991c2d !important;								
}

.bg-darker-red {
	background: #991c2d !important;											
}

/**/

.text-lighter-brown {
	color: #d8ccbe !important;								
}

.bg-lighter-brown {
	background: #d8ccbe !important;											
}

/**/

.text-light-brown {
	color: #d1bfaa !important;								
}

.bg-light-brown {
	background: #d1bfaa !important;											
}

/**/

.text-brown {
	color: #b19572 !important;										
}

.bg-brown {
	background: #b19572 !important;												
}

/**/

.text-dark-brown {
	color: #886c48 !important;											
}

.bg-dark-brown {
	background: #886c48 !important;											
}

/**/

.text-darker-brown {
	color: #563f21 !important;											
}

.bg-darker-brown {
	background: #563f21 !important;											
}

/**/

.text-lighter-pink {
	color: #f9d6f1 !important; 													
}

.bg-lighter-pink {
	background: #f9d6f1 !important;
}

/**/

.text-light-pink {
	color: #ed9edb !important; 													
}

.bg-light-pink {
	background: #ed9edb !important;
}

/**/

.text-pink {
	color: #dc6dc3 !important;
}

.bg-pink {
	background: #dc6dc3 !important;																
}

/**/

.text-dark-pink {
	color: #ae3292 !important;
}

.bg-dark-pink {
	background: #ae3292 !important;									
}

/**/

.text-darker-pink {
	color: #82226d !important;
}

.bg-darker-pink {
	background: #82226d !important;									
}

/**/

.text-lighter-purple {
	color: #d9d2e8 !important;														
}

.bg-lighter-purple {
	background: #d9d2e8 !important;																		
}

/**/

.text-light-purple {
	color: #ae9dcf !important;														
}

.bg-light-purple {
	background: #ae9dcf !important;																		
}

/**/

.text-purple {
	color: #846db4 !important;															
}

.bg-purple {
	background: #846db4 !important;																		
}

/**/

.text-dark-purple {
	color: #5b3b9c !important;																
}

.bg-dark-purple {
	background: #5b3b9c !important;																		
}

/**/

.text-darker-purple {
	color: #291750 !important;																
}

.bg-darker-purple {
	background: #291750 !important;																		
}

/**/

.text-lighter-grey {
	color: #e8e8e8 !important;																	
}

.bg-lighter-grey {
	background: #e8e8e8 !important;																		
}

/**/

.text-light-grey {
	color: #dadada !important;																	
}

.bg-light-grey {
	background: #dadada !important;																		
}

/**/

.text-grey {
	color: #c0c0c0 !important;																			
}

.bg-grey {
	background: #c0c0c0 !important;																		
}

/**/

.text-dark-grey {
	color: #7c7c7c !important;																	
}

.bg-dark-grey {
	background: #7c7c7c !important;																					
}

/**/

.text-darker-grey {
	color: #2f2f2f !important;																	
}

.bg-darker-grey {
	background: #2f2f2f !important;																					
}

/**/

.text-white {
    color: #ffffff !important;
}

.mdi.text-white {
	text-shadow: 0px 0px 2px #767676, 0px 0px 2px #767676, 0px 0px 1px #767676; /* Para los iconos se les aplica sombra */
}

.bg-white {
    background: #fff !important
}

/**/

.text-black {
	color: #000 !important;
}

bg-black {
	background: #000 !important;
}

/***************************************/
/*************** Sidebar ***************/
/***************************************/

#sidebar .dropdrown {
position: absolute;
display: block;
background: #fff;
padding: 5px;
width: 120px;
z-index: 1;
border: 1px solid #f1f1f1;
right: -5px;
top: 44px;
box-shadow: -8px 7px 5px -8px rgba(0,0,0,0.25);
}

#sidebar .dropdrown li {
list-style: none;
padding: 5px;
text-indent: 2px;
margin-bottom: 1px solid red;
}

#sidebar .dropdrown li:last-child {
margin-bottom: none
}

#sidebar .dropdrown li a {
font-size: 12px;
display: block;
width: 100%;
}

#sidebar .dropdrown li:hover {
background: #eee;
}

#sidebar .dropdrown li:hover > a {
color: #666;
}

#sidebar .dropdrown:after,
#sidebar .dropdrown:before {
bottom: 100%;
left: 85%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}

#sidebar .dropdrown:after {
border-color: rgba(241, 241, 241, 0);
border-bottom-color: #fff;
border-width: 10px;
margin-left: -10px;
}

#sidebar .dropdrown:before {
border-color: rgba(221, 221, 221, 0);
border-bottom-color: #ddd;
border-width: 11px;
margin-left: -11px;
}

#sidebar .icons {
	margin: 0;
	background: #fff;
}

#sidebar .icons li {
	list-style: none;
	display: inline;
}

#sidebar .icons li a {
	cursor: pointer;
	outline: 0;
}

#sidebar .block {
	margin-bottom: 5%;
	position: relative;
}

#sidebar .header {
	text-align: left;
	padding: 5px;
	background: #68bde5;
	color: #fff;
	font-size: 14px; /* Con 15px no caben los textos en francés */
	border-left: 0;
	border-right: 0;
}

#sidebar .expirationDate{
	color : #fa0237
}

#sidebar .header p {
	margin: 0;
	user-select: none;
	display: inline;
	color: #fff;
}

#sidebar .header .on {
	cursor: pointer;
}

#sidebar .header.empty {
	background: #eee !important;
	color: #777;
}

#sidebar .header.empty p {
	color: #666;
}

#sidebar .header p > span {
	font-size: 12px;
	font-weight: bold;
	margin-left: 2px;
}

#sidebar .collapse {
	margin: 0 0 15px 0;
}

#sidebar .collapse li {
	list-style: none;
	padding: 5px 10px;
	font-size: 11px;
	border-left: 1px solid #d0cfcf;
	border-right: 1px solid #d0cfcf;
}

#sidebar .collapse li:last-child {
	border-bottom: 1px solid #d0cfcf !important;
}

#sidebar #infor li:nth-child(even) {
	/* Caso especial, caja información */
	background: #f1f1f1;
}

#sidebar #infor.content li { /* Caso especial, caja información */
	border-bottom: 0;
}

#sidebar .footer {
	text-align: center;
	border-left: 1px solid #d0cfcf;
	border-right: 1px solid #d0cfcf;
	border-bottom: 1px solid #d0cfcf;
	padding: 5px 0;
}

#sidebar .footer .back a, #sidebar .footer .next a {
	padding: 5px;
	background: #eee;
}

#sidebar .footer .back {
	float: left;
}

#sidebar .footer .next {
	float: right;
}

#sidebar .collapse {
	display: none;
}

#sidebar .collapse li[id^='elementSidebar'] {
	border-bottom: 1px solid #ddd;
}

#sidebar .actions {	
	color: #aaa;
	margin-left: 1%;
	margin-top: 5%;
}

#sidebar .actions .left a,
#sidebar .actions .right a {
	cursor: pointer;
}

#sidebar .actions .left {
	display: inline-block;
	font-size: 20px;
	margin-right: 5px;
	text-align: center;
}

#sidebar .actions .right {
	text-align: center;
	font-size: 20px;
	display: inline-block;
}

#sidebar .links {
	color: #666;
}

#sidebar .links .ico {
	display: inline-block;
	margin: 0 5px 0 0;
	vertical-align: top;
}

#sidebar .links .description {
	font-size: 11px;
	width: auto;
	word-wrap: break-word;
	display: inline-block;
}

#sidebar .links .ico_right,
#sidebar .links .ico_dots {
	vertical-align: top;
	margin: 0;
	color: #000;
	float: right;
	text-align: right;
}

#sidebar .moreInfoTab ul.tabs li.summary{
	border-top: 1px solid #d0cfcf;
    float: left;
   	width: 40%;
}

#sidebar .moreInfoTab ul.tabs li.other{
	border-top: 1px solid #d0cfcf;
}

#sidebar .moreInfoTab ul.tabs li{
	 background: white;
     color: #d0cfcf;
}

#sidebar .moreInfoTab ul.tabs li.active{
	 background: #68bde5;
	 color: white;
}

#sidebar .icons li .mdi {
	font-size: 27px;
	margin: 0 25px 15px 0;
	color: #8c8c8c;
	display: inline-block;
}

#sidebar .icons li:nth-child(5) .mdi { /* El quinto icono sin margin-right, porque no cabe */
	margin: 0 0 15px 0;
}

#sidebar .icons li .mdi:hover {
	color: #7bc6e9;
}

/********** Sidebar -> Zonas desplegables ***********/

#sidebar .header {
	line-height: 20px;
}

#sidebar .header .mdi {
	display: inline;
	color: #fff;
}

#sidebar .header .mdi:first-child { /* Las flechitas */
	font-size: 15px;
}

#sidebar .header .openUp {
	cursor: pointer;
}

#sidebar .header.empty .mdi,
#sidebar .header.empty:hover .mdi {
	color: #666;
}

#sidebar .header .plus_icon {
	float: right;
	margin: 0 0 0 0;
	cursor: pointer;
}

#sidebar .header .plus_icon .mdi { /* Los iconos de la derecha */
	color: #fff;
	float: right;
	font-size: 23px !important;
	margin-left: 3px;
	margin-top: 1px;
}

#sidebar .header .plus_icon .mdi:hover {
	color: #eee;
}

#sidebar .header.empty .plus_icon .mdi {
	color: #7bc6e9;
}

#sidebar .header.empty .plus_icon .mdi:hover {
	color: #68bde5;
}

#sidebar .header .archive_button{
	margin-right: 5px;
}

#sidebar .header:not(.empty) .plus_icon .mdi:hover {
	color: #eee;
}

#sidebar div[id^="liscolumn"] .mdi {
	font-size: 15px;
}

#sidebar span.ico_right {
   float: right;
}

#sidebar div.actions .mdi {
   cursor: pointer;
}

#sidebar .links .description .mdi {
	font-size: 15px;
	float: right;
	cursor: pointer;
}

#sidebar .ico_left .mdi.info,
#sidebar .ico_left .mdi.info:hover,
#sidebar .ico_right .mdi.info,
#sidebar .ico_right .mdi.info:hover {
	color: #939292;
}

/******************* Información **********************/

#main p.titular input[type='checkbox'] {
	vertical-align: middle;
	margin: 0 0 0 3px;
}

#main p.titular {
	/* Para mostrar información textual a un tamaño más grande que el defecto */
	font-size: 12px;
	line-height: 10px;
}

#main p.separe {
	border-bottom: 1px dotted #ccc; /* Para mostrar varias p separadas, por ejemplo una serie de preguntas */
	width: 100%;
	padding: 0 0 10px 0;
}

#main p small {
	color: #666;
	font-style: italic;
}

/* Listas: OJO, el multiselect tiene ul.list, así que hemos tenido que añadir un 1 para que no haya conflicto */
/* En el modo de solo lectura de caso (que va dentro de #spanDescription) hay que poner ul pelado por fuerza */

#main ul.list1 {
	margin: 5px 0 0 0;
	display: table;
}

#main ul.list1 li {
	list-style: none;
	padding: 0 0 8px 0;
	display: table-row;
	line-height: 25px;
}

#main ul.list1 li:before {
	font: 12px "Material Design Icons";
	content: "\f40A";
	padding: 0 5px;
	color: #888888;
	display: table-cell;
	float: left;
	margin: 6px 0;
}

#main ul li.alert-danger:before {
	font: 12px "Material Design Icons";
	content: "\f5ad";
	color: #d23835;
}

#main ul li.alert-success:before {
	font: 12px "Material Design Icons";
	content: "\f12c";
	color: #05b605;
}

#main ul li.alert-warning:before {
	font: 12px "Material Design Icons";
	content: "\f028";
	color: #ddc59d;
}

#main ul li.alert-info:before {
	font: 12px "Material Design Icons";
	content: "\f026";
	color: #9cd0e7;
}

/* Esto de abajo tiene que funcionar en IE10, importante */

#main ul.separe {
	list-style: none;
}

#main ul.separe li {
	border-bottom: 1px dotted #666;
	display: flex;	
	display: -ms-flexbox;
	margin: 5px;	 
}

#main ul.separe li:last-child {
	border-bottom: 0;
}

#main ul.separe li span.message {
	width: auto;
	display: inline-flex;
	display: -ms-inline-flexbox;
	flex-grow: 2;
	justify-content: space-between;
	margin: 3px 0 0;
}

#main ul.separe li .float-left {
	margin-right: 10px;
	float: none;
}

#main ul.separe li .float-right {
	display: flex;
	display: -ms-flexbox;
}

#main ul.separe li .float-right input {
	margin: 0 10px;
	height: 25px;
}

/******************* Mini páginas **********************/

/* (Popup e iframe: Los Popup están creados con jQuery UI-Dialog y dentro hay un iframe en casi todos, en alguno no, por ejemplo encuestas) */

.popup {
	background: #fff;
	overflow-x: auto;
	overflow-y: auto;
	margin: 5px; /* Con 5px el contenido encaja con los márgenes de widgetTitle */
	padding: 15px 15px 0 15px; /* El padding lo da la clase popup, no el contenido, al igual que #content #main */
	min-width: auto;
}

.popup .container {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	box-shadow: none;
}

.popup .container #main {
	padding: 0 !important;
}

.popup .container fieldset {
	width: auto;
	padding-top: 0;
}

.popup .container .alertas {
	width: calc(100% - 15px);
}

.popup caption { /* Eliminado de forma temporal, pendiente de hacer por JAVA */
	display: none;
}

#popup {
	margin: 10px 0 0 0;
	padding: 0;
	width: 100% !important;
	/* height: auto; La alta la da el propio iframe */
}

#popup2 ul {
	margin: 5px 0 0 0;
	display: table;
}

#popup2 ul li {
	list-style: none;
	padding: 0 0 8px 0;
	display: table-row;
	line-height: 25px;
}

#popup2 ul li:before {
	font: 12px "Material Design Icons";
	content: "\f40A";
	padding: 0 5px;
	color: #888888;
	display: table-cell;
}

.iframe {
	background: #fff;
	overflow-x: auto;
	overflow-y: auto;
}

/* Contenido Fixed */

body.fixed #menu_tabs {
	width: 863px;	
	position: fixed;
	top: 0;
	z-index: 70;
}

body.fixed #header_object {
	width: 863px;
	position: fixed;
	top: 0;
	z-index: 666;
}

body.fixed.with_menu #header_object {
	top: 40px !important;
}

body.fixed #main,
body.fixed.with_menu #sidebar {
	margin-top: 50px;
}

body.fixed.with_menu #main,
body.fixed.with_menu #content #sidebar {
	margin-top: 90px;
}

/* Clases que se aplican al BODY */
/* El maximize se aplica con maxView=true o maxView=false de la URL */

body.locator.maximize .mdi-menu {
	display: block;
}

body.locator.maximize #content,
body.locator.maximize #navbar {
	width: 100%;
	max-width: 1290px;
}

body.locator.maximize #navbar .left {
	display: block;
}

body.locator.maximize #column {
	position: absolute;
	z-index: 668;
	box-shadow: 5px 2px 20px -14px rgba(0, 0, 0, 0.5);
	display: none;
}

body.maximize #column #services {
	margin-bottom: 0px;
}

body.maximize .ztree{
	border-top: 0px;
}

body.maximize .container #column {
   display: none;
}

body.maximize #sidebar {
   display: none;
}

body.maximize #navbar {
   display: flex; /* inline-flex no va con IE11*/
   display: -ms-flexbox;   
}

body.maximize #navbar .showMainMenu {
   display: block;
}

body.maximize #navbar .showSidebar {
	display: block;
}

body.maximize #content,
body.maximize #menu_tabs,
body.maximize #menu_tabs.fixed {
	max-width: 1140px;
	width: 100% !important;
}

body.maximize #header_object {
	width: calc(1140px - 2px);
}

body.maximize #header_object.fixed {
	max-width: 1140px;
}

body.maximize .container #sidebar {
	position: absolute;
	border: 1px solid #d9d8d8;
	border-right: 0;
    top: -92px;
    right: -10px;
	padding: 10px 10px 0;
	z-index: 667;
	box-shadow: -5px 2px 20px -14px rgba(0, 0, 0, 0.5);
	display: none;
	overflow: auto;
}

body.maximize #column #spanSearchMenu {
    margin-bottom: 0;
    border: 0 !important;
    margin-top: -1px;
}

body.detail.maximize #column {
	position: absolute;
	display: none;
	z-index: 667;
}

/* Fuera sidebar y se fuerza la hamburguesa */

body.sidebar_closed #sidebar {
	position: absolute;
	border: 1px solid #d9d8d8;
	border-right: 0px;
	top: -92px;
	right: -10px;
	padding: 10px 10px 0px 10px;
	z-index: 667;
	box-shadow: -5px 2px 20px -14px rgba(0, 0, 0, 0.5);
	display: none;
	overflow: auto;
}

body.sidebar_closed .showSidebar {
	display: block !important;
}

/******************* Cabecera estructura **********************/

#header a {
	color: #fff;
}

#header a:hover {
	text-decoration: underline;
}

#header #logo {
	height: 80px;
	float: left;
	position: relative;
}

#header #logo img {
	margin: auto;
	position: absolute;
	bottom: 0;
	top: 0;
}

#header #info {
	float: right;
	margin: 35px 0 0 0;
}

/***************************************/
/*************** Cabecera **************/
/***************************************/

#header .mdi{
    color: #fff;
}

#header .menu .mdi{
    font-size: 14px;
}

#header #info .mdi {
	font-size: 25px;
}

#header #info ul li {
	list-style-type: none;
	float: left;
	padding: 0;
	line-height: 100%;
	margin: 0 3px;
}

#header #info ul li:last-child {
	margin: 0 0;
}

#header #info .user {
	font-size: 15px;
	float: left;
	margin-right: 10px;
}

#header #info .user .mdi {
	font-size: 40px;
}

#header #info .user .mdi:hover {
	color: #fff;
}

#header #info .mdi:hover {
	color: #eee;
}

#header #info .separe {
	padding: 0 10px;
}

#header #info .menu .mdi {
	margin-right: 5px;
}

#header #info .menu #userNotesNumber .mdi {
	margin-left: 5px;
}

#header #info .exit a:hover {
	text-decoration: none;	
}

/* Desplegables: Notificaciones, notas, favoritos, histórico */

#header #info .bell span,
#header #info #UTNButton span,
#header #info #NotesButton span {
	position: absolute;
	background: #fa0237;
	color: #fff;
	font-size: 11px;
	padding: 1px 5px;
	font-weight: bold;
	color: #eee;
	border: 1px solid #ddd;
     -webkit-user-select: none; /* Safari 3.1+ */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */
	display: block;
}

#header #info .bell span {
	right: 0;
	top: -4px;
}

#header #info #UTNButton span,
#header #info #NotesButton span {
	right: 0;
	top: -12px;
}

@-moz-document url-prefix() { /* HACK FF */
	#header #info #UTNButton span,
	#header #info #NotesButton span {
		top: 3px;
	}
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* HACK IE */
	#header #info #UTNButton span,
	#header #info #NotesButton span {
		top: 3px;
	}
}

#header #info #BellButton {
	margin-top: 0;
	float: left;
}

#header #info .bell,
#header #info #UTNButton,
#header #info #NotesButton {
	position: relative;
	cursor: pointer;
}

#header #info #FavoriteButton > a,
#header #info #HistoryButton > a,
#header #info #NotesButton > a,
#header #info #UTNButton > a,
#header #info #BellButton .bell {
	padding: 8px 6px;
	background: transparent;
    margin: -7px 0 0 0;
	float: left; /* Para CHROME si no la zona de click no se marca entera */
	text-decoration: none; /* Para IE */
}

#header #info #FavoriteButton.click .mdi:before,
#header #info #HistoryButton.click .mdi:before,
#header #info #UTNButton.click .mdi:before,
#header #info #NotesButton.click .mdi:before,
#header #info #BellButton.click .mdi:before {
	color: #ddd;
}

#header #info #BellButton .hide {
	display: none !important;
}

#header #info #FavoriteDiv,
#header #info #historyDiv,
#header #info #userNotesDiv,
#header #info #UTNDiv,
#header #info #NotifiDiv {
	display: none;
	background: #fafafa;
	box-shadow: 2px 1px 4px -1px rgba(0, 0, 0, 0.2);
	border: 1px solid #ddd;
	position: absolute;
	z-index: 1666;
	top: 80px;
	width: 300px;
}

#header #info #FavoriteDiv:after,
#header #info #FavoriteDiv:before,
#header #info #historyDiv:after,
#header #info #historyDiv:before,
#header #info #userNotesDiv:after,
#header #info #userNotesDiv:before,
#header #info #UTNDiv:after,
#header #info #UTNDiv:before,
#header #info #NotifiDiv:after,
#header #info #NotifiDiv:before {
	bottom: 100%;
	left: 84%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#header #info #FavoriteDiv:after,
#header #info #historyDiv:after,
#header #info #userNotesDiv:after,
#header #info #UTNDiv:after,
#header #info #NotifiDiv:after {
	border-color: rgba(241, 241, 241, 0);
	border-bottom-color: #fafafa;
	border-width: 10px;
	margin-left: -10px;
}

#header #info #FavoriteDiv:before,
#header #info #historyDiv:before,
#header #info #userNotesDiv:before,
#header #info #UTNDiv:before,
#header #info #NotifiDiv:before {
	border-color: rgba(221, 221, 221, 0);
	border-bottom-color: #ddd;
	border-width: 11px;
	margin-left: -11px;
}

#header #info #FavoriteDiv li,
#header #info #historyDiv li,
#header #info #userNotesDiv li,
#header #info #UTNDiv li,
#header #info #NotifiDiv li {
	list-style: none;
	margin: 0 auto;
	border-bottom: 1px solid #d1d1d1;
	padding: 10px 0;
	width: 95%;
	float: left;
    margin-left: 7px;
	color: #313131;
     -webkit-user-select: none; /* Safari 3.1+ */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */
}

#header #info #FavoriteDiv li.last,
#header #info #UTNDiv li.last,
#header #info #historyDiv li:last-child,
#header #info #userNotesDiv li:last-child,
#header #info #NotifiDiv li:last-child {
	border-bottom: 0;
}

#header #info #FavoriteDiv li:before,
#header #info #historyDiv li:before,
#header #info #userNotesDiv li:before,
#header #info #UTNDiv li:before,
#header #info #NotifiDiv li:before {
	font: 12px "Material Design Icons";
	content: "\f40A";
	padding: 0 5px;
	color: #888888;
	float: left;
}

#header #info #FavoriteDiv li a,
#header #info #historyDiv li a,
#header #info #userNotesDiv li a:not(.new_note),
#header #info #UTNDiv li a {
    color: #313131;
	text-decoration: none;
}

#header #info #UTNDiv li .mdi {
    color: #939292;
	font-size: 15px;
	margin-left: 0;
}

#header #info #UTNDiv li .mdi:hover {
	color: #000 !important;
}

#header #info #FavoriteDiv li a:hover,
#header #info #historyDiv li a:hover
#header #info #UTNDiv li a:hover {
    color: #000;
}

#header #info #FavoriteDiv {
	right: 84px;
}

#header #info #historyDiv {
	right: 41px;
}

#header #info #NotifiDiv {
	right: 170px;
}

#header #info #UTNDiv {
	right: 213px;
}

#header #info #UTNDiv .description { /* Descripción con 2 iconos */
	width: 75%;
	display: inline-block;
}

#header #info #FavoriteDiv .description,
#header #info #historyDiv .description,
#header #info #NotifiDiv .description {  /* Descripción sin iconos */
	width: 90%;
	display: inline-block;
	font-size: 12px;
	line-height: 16px;
}

#header #info #UTNDiv .ico_right {
	font-size: 15px;
	display: inline-block;
	vertical-align: top;
	text-align: right;
	margin: 0;
	color: #000;
	float: right;
}

#header #info #FavoriteDiv .nav,
#header #info #historyDiv .nav,
#header #info #footerUTN .nav {
	width: 100%;
	display: block;
	text-align: center;
	color: #313131;
	padding: 0;
	border-top: 1px solid #ddd;
	box-sizing: border-box;
	float: left;
}

#header #info #FavoriteDiv .nav .back ,
#header #info #historyDiv .nav .back,
#header #info #footerUTN .nav .back {
	float: left;
	padding: 5px 5px 7px;
}

#header #info #FavoriteDiv .nav .next,
#header #info #historyDiv .nav .next,
#header #info #footerUTN .nav .next {
	float: right;
	padding: 5px 5px 7px;
}

#header #info #FavoriteDiv .nav .back:hover ,
#header #info #FavoriteDiv .nav .next:hover,
#header #info #historyDiv .nav .back:hover,
#header #info #historyDiv .nav .next:hover,
#header #info #footerUTN .nav .back:hover,
#header #info #footerUTN .nav .next:hover {
	background: #efefef;
}

#header #info #FavoriteDiv .nav .back a,
#header #info #FavoriteDiv .nav .next a,
#header #info #historyDiv .nav .back a,
#header #info #historyDiv .nav .next a,
#header #info #footerUTN .nav .back a,
#header #info #footerUTN .nav .next a {
	color: #757575;
}

#header #info #FavoriteDiv .nav .pag,
#header #info #historyDiv .nav .pag,
#header #info #footerUTN .nav .pag {
    float: left;
	margin: 6px 0 0 100px;
}

#header #info #FavoriteDiv li.nohref,
#header #info #UTNDiv li.nohref {
	border-bottom: 0;
}

#header #info #FavoriteDiv li.nohref a,
#header #info #UTNDiv li.nohref a {
	text-decoration: none;
	cursor: default;
	border-bottom: 0;
	color: #313131;
}

#header #info #userNotesDiv {
	right: 126px;
}

#header #info #userNotesDiv li.new_note {
	margin: 2px 0 2px 7px
}

#header #info #userNotesDiv li.new_note:before {
	content: '';
}

#header #info #userNotesDiv li.new_note:before .left {
	float: left;
}

#header #info #userNotesDiv li.new_note .left a {
	background: #4cb1e1;
	padding: 5px;
	color: #fff;
}

#header #info #userNotesDiv li.new_note .left a:hover {
	background: #3fa4d4;
	text-decoration: none;
}

#header #info #userNotesDiv li.new_note #userNotesNumber {
	float: right;
	color: #000;
	margin: -10px 0 0 0;
	font-size: 12px;
}

#header #info #userNotesDiv li.new_note #userNotesNumber a.pagLeftNotes .mdi,
#header #info #userNotesDiv li.new_note #userNotesNumber a.pagRightNotes .mdi {
	color: #939292;
	float: right;
	font-size: 16px;
	margin-left: 5px;
}

#header #info #userNotesDiv li.new_note #userNotesNumber a.pagLeftNotes:hover .mdi,
#header #info #userNotesDiv li.new_note #userNotesNumber a.pagRightNotes:hover .mdi {
	color: #000 !important;
}

#header #info .bell.click .mdi {
	color: #fff;
}

#header #info .bell .mdi {
	color: inherit; /* Se sobreescribe en subs */
	font-size: 25px;
	user-select: none;
}

#header #info #NotifiDiv textarea,
#header #info #UTNDiv textarea {
	resize: none;
	margin: 13px 0 0 0;
	padding: 2px 5px;
	border: 0;
	width: 100%;
	height: 130px;
	background: inherit;
	outline: 0;
}

#header #info #NotifiDiv textarea {
	padding: 0 15px !important;
}

#header #info #NotifiDiv .nav {
    border-top: 1px solid #d1d1d1;
    color: #313131;
    display: block;
    padding: 0;
    text-align: center;
    width: 100%;
}

#header #info #NotifiDiv .nav .back {
    float: left;
}

#header #info #NotifiDiv .nav .next {
    float: right;
}

#header #info #NotifiDiv .nav .back,
#header #info #NotifiDiv .nav .next {
    background: #ededed none repeat scroll 0 0;
    color: #757575;
    padding: 9px;
}

#header #info #NotifiDiv .nav .back:hover,
#header #info #NotifiDiv .nav .next:hover {
    background: #e2e2e2 none repeat scroll 0 0;
}

#header #info #NotifiDiv .nav .pag {
    line-height: 30px;
}

#header #FavoriteDiv .nav .mdi,
#header #FavoriteDiv .nav .mdi:hover,
#header #historyDiv .nav .mdi,
#header #historyDiv .nav .mdi:hover,
#header #UTNDiv .nav .mdi,
#header #UTNDiv .nav .mdi:hover {
	color: #888 !important;
}

#header #UTNDiv #remarksUTN {
	margin: 14px 0 5px;
	border-top: 1px solid #d1d1d1;
	padding: 14px 0 0 22px;
}

#header #info #UTNButton span,
#header #info .bell span {
	display: none;
}

/******************* Navegador **********************/

#navbar {
    margin: 0;
	width: calc(100% - 10px);
	padding: 0 0 5px 0;
	display: flex;
	display: -ms-flexbox;
}

#navbar ul {
	margin: 3px 0 0 0;
}

#navbar ul li {
	list-style: none;
	float: left; /* No puede ser display:inline pq se muestran los elementos ocultos (hamburguesas) */
}

#navbar ul.breadCrumbs {
    max-width: calc(1290px - 125px); /* Si la anchura se pone en #navbar hay problemas en IE10 */
}

#navbar ul.breadCrumbs li:not(:last-child):after {
	content: "\f40A";
	font: 15px "Material Design Icons";
	color: #7bc6e9;
	margin: 0 10px;
	vertical-align: top;
}

#navbar ul.iconsLeft{
	display: flex;
	display: -ms-flexbox;
}

#navbar ul.iconsLeft .mdi {
	float: left;
	margin-right: 5px;
}

#navbar ul.iconsRight {
	display: flex;
	display: -ms-flexbox;
    margin-left: auto;
}

#navbar ul.iconsRight .mdi {
	margin-left: 5px;
}

#navbar .mdi{
	font-size: 22px;
	display: block;
}

#navbar .iconsLeft,
#navbar .iconsRight {
	float: left;
	margin: -3px 0 0 0;
}

#navbar .mdi-eye-off.hide {
	display: none !important;
}

#navbar .showMainMenu {
   display: none;
}

#navbar .showSidebar {
	display: none;
}

/******************* Menú de pestañas **********************/

#menu_tabs {
	background: #7bc6e9;
	width: 100%;
}

#menu_tabs {
	position: relative;
	height: 40px;
}

#menu_tabs .tabs {
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 40px;
}

#menu_tabs .tabs ul {
	position: absolute;
	list-style-type: none;
	padding-right: 100px;
	margin-bottom: 0;
}

#menu_tabs .tabs li {
    float: left;
    color: inherit;
    margin: 0;
    padding: 2px 0 2px 0;
    height: 40px;
    text-align: center;
    cursor: pointer;
}

#menu_tabs .tabs li:hover a {
	color: #fff;
	text-decoration: underline;
}

#menu_tabs a {
	display: block;
	color: #fff;
	background: inherit;
	text-decoration: none;
	padding: 4px;
	font-size: 13px;
	margin: 5px 10px 0 10px;
	font-weight: 600;
}

#menu_tabs a:hover {
	color: #fff;
}

#menu_tabs .seleccionado {
	float: left;
	background: #fff;
	color: #676767;
	height: 40px;
	padding: 0;
}

#menu_tabs .seleccionado p {
	margin: 12px 15px 0 15px;
	font-size: 14px;
	font-weight: 700;
}

#menu_tabs .seleccionado:hover {
	background: #fff;
	height: 40px;
}

#menu_tabs li.disabled a,
#menu_tabs li.disabled:hover a {
	opacity: 0.7;
	color: #fff;
	text-decoration: none;
}

#menu_tabs .controles {
	position: relative;
	float: right;
	margin: -35px 0 0 0;
}

#menu_tabs .controles #prev,
#menu_tabs .controles #next {
	cursor: pointer;
	float: left;
	font-size: 20px;
}

#menu_tabs .controles #prev {
	margin: -15px 0 0 -80px;
}

#menu_tabs .controles #next {
	margin: -15px 0 0 -57px;
}

#menu_tabs .controles .mdi:hover {
	color: #eaeaea;
}

#menu_tabs .controles .despliega {
	color: inherit;
	border-radius: 5px 5px 0 0;
	padding: 8px 0 2px 0;
	height: 32px;
	z-index: 666;
	width: 40px;
	text-align: center;
	position: absolute;
	right: 0;
	top: -8px;
	list-style: none;
	cursor: pointer;
	margin: 0;
}

#menu_tabs .controles .despliega #down {
	font-size: 20px;
	margin: 0 0 0 10px;
	float: left;
}

#menu_tabs .controles .despliega ul {
	display: none;
	width: 200px;
	position: absolute;
	top: 15px;
	z-index: 0;
	left: auto;
	right: -1px;
	background: #fff;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	margin: 28px 0 0 0;
}

#menu_tabs .controles .despliega ul a { /* Nos pidieron que se pudiera pulsar en toda la zona al 100%, no solo en el link */
	text-decoration: none;
	color: #000;
	margin: 0;
	padding: 8px 0;
	display: block;
	width: 100%;
	font-weight: normal;
}

#menu_tabs .controles .despliega ul.row { /* Cuando hay más de 15 opciones */
	width: 400px;
	left: auto !important;
	right: -11px;
	margin-right: 10px;
	box-sizing: content-box;	
}

#menu_tabs .controles .despliega ul.row li {
	float: left;
	width: 200px;
}

#menu_tabs .controles .despliega ul li:first-child {
	border-top: 0;
}

#menu_tabs .controles .despliega ul.row li:nth-child(1),
#menu_tabs .controles .despliega ul.row li:nth-child(2) {
	border-top: 0;
}

#menu_tabs .controles .mdi {
	color: #fff;
}

#menu_tabs .controles .mdi.disabled,
#menu_tabs .controles .mdi.disabled:hover{
	opacity: 0.5 !important;
	color: #fff !important;
	cursor: default;
}

#menu_tabs .controles ul{
	left: auto !important;
	right: 0;
}

#menu_tabs .controles .mdi:hover {
	color: #eaeaea;
}

#menu_tabs .controles .despliega ul li {
	list-style: none;
	text-align: left;
	border-top: 1px solid #d1d1d1;
	text-indent: 5px;
}

#menu_tabs .controles .despliega ul li:hover {
	background: #f5f5f5;
}

#menu_tabs .controles .despliega ul li.border { /* Esto y lo de abajo es para cuando el número de elementos es impar, añadir un ítem vacío */
	border-top: 1px solid #d1d1d1;
}

#menu_tabs .controles .despliega ul li.border:before {
	content: '' !important;
}

#menu_tabs .controles .despliega ul li a:before {
	font: 12px "Material Design Icons";
	content: "\f40A";
	color: #8d8d8d;
	margin-right: 5px;
	margin-left: 4px;
	margin-top: 2px;
	float: left;
	display: inline-block;
}

#menu_tabs .controles .mdi {
	color: #fff;
}

#menu_tabs .controles .mdi:hover {
	color: #eee;
}

#menu_tabs .controles .mdi.disabled,
#menu_tabs .controles .mdi.disabled:hover{
	opacity: 0.5 !important;
	color: #fff !important;
	cursor: default;
}

#header_object {
	background: #fff;
	padding: 4px 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	border-bottom: 1px solid #d4cbc7;	
}

#header_object p {
	color: #676767;
	margin: 0 15px 0 0;
	padding: 15px 0 0 5px;
	font-size: 18px;
	font-weight: 600;
	text-align: left;
    white-space: nowrap;
    text-overflow:ellipsis;
    width: auto;
	overflow: hidden;
}

#content #header_object p span {
	float: left;
}

#header_object p strong {
	margin: 0 5px 0 0;
}

#header_object h2 {
	margin: 0 0 0 15px;
	font-size: 18px;
	display: flex;
}

#header_object h2 div {
	text-overflow: ellipsis;
	width: auto;
	overflow: hidden;
}

#content #header_object .ico {
	margin-left: 5px;
}

#content #header_object .info {
	-ms-flex: 1;
	flex: 1;
	min-width: 0;
}

#content #header_object .name {
	width: 100%;
	margin: 2px 0 0 15px;;
	color: #777;
	white-space: nowrap;
	text-overflow: ellipsis;
	width: auto;
	overflow: hidden;
}

#content #header_object .object {	
	width: 100%;
	white-space: nowrap;	
}

#content #header_object .ico .mdi {
	border-radius: 50%;
	background: #7bc6e9;
	display: inline-table;
	min-width: 40px;
	height: 39px;
	line-height: 37px;
	text-align: center;
	color: #fff !important;
}

#content #header_object .ico mdi:before {
	color: #fff !important;
	font-size: inherit;	
}

#content #header_object .icons {
	max-width: 250px;
    min-width: 250px;
}

#content #header_object .icons .mdi.mdi-star {
	color: #7bc6e9;
}

#content #header_object .icons button {
	padding: 0;
	margin: 3px 0 0 -5px;
}

#content #header_object .icons button.btn:focus {
	outline: none;
	box-shadow: none;
}

#content #header_object .icons button .mdi:before {
	font-size: 22px;
}

#header_object .controles {
	position: relative;
	float: right;
	margin: -21px 0 0 0;
}

#header_object .controles #prev,
#header_object .controles #next {
	cursor: pointer;
	float: left;
	font-size: 20px;
}

#header_object .controles #prev {
	margin: -25px 0 0 -80px;
}

#header_object .controles #next {
	margin: -25px 0 0 -57px;
}

#header_object .controles .mdi:hover {
	color: #eaeaea;
}

#header_object .controles .despliega {
	color: inherit;
	border-radius: 5px 5px 0 0;
	padding: 8px 0 2px 0;
	height: 32px;
	z-index: 666;
	width: 40px;
	text-align: center;
	position: absolute;
	right: 0;
	top: -6px;
	list-style: none;
	cursor: pointer;
	margin: 0;
}

#header_object .controles .despliega #down {
	font-size: 20px;
	margin: -10px 0 0 10px;
	float: left;
}

#header_object .controles .despliega ul {
	display: none;
	width: 200px;
	position: absolute;
	top: 7px;
	z-index: 0;
	left: auto;
	right: -11px;
	background: #fff;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	margin: 17px 0 0 0;
	box-sizing: content-box;
}

#header_object .controles .despliega ul a { /* Nos pidieron que se pudiera pulsar en toda la zona al 100%, no solo en el link */
	text-decoration: none;
	color: #000;
	margin: 0;
	padding: 8px 0;
	display: block;
	width: 100%;
}

#header_object .controles .despliega ul li {
	list-style: none;
	text-align: left;
	border-top: 1px solid #d1d1d1;
	text-indent: 5px;
}

#header_object .controles .despliega ul li:hover {
	background: #f5f5f5;
}

#header_object .controles .despliega ul li.border { /* Esto y lo de abajo es para cuando el número de elementos es impar, añadir un ítem vacío */
	border-top: 1px solid #d1d1d1;
}

#header_object .controles .despliega ul li.border:before {
	content: '' !important;
}

#header_object .controles .despliega ul li a:before {
	font: 12px "Material Design Icons";
	content: "\f40A";
	color: #8d8d8d;
	margin-right: 5px;
	display:inline-block;
}

#header_object .controles .despliega ul.row { /* Cuando hay más de 15 opciones */
	width: 400px;
}

#header_object .controles .despliega ul.row li {
	float: left;
	width: 200px;
}

#header_object .controles .despliega ul li:first-child {
	border-top: 0;
}

#header_object .controles .despliega ul.row li:nth-child(1),
#header_object .controles .despliega ul.row li:nth-child(2) {
	border-top: 0;
}

#header_object .icons ul {
	float: right;
	margin: 3px 0 0 0;
}

#header_object .icons ul li {
	list-style: none;
	display: inline;
}

#header_object .icons .mdi {
	font-size: 25px;
	color: #8c8c8c;
	padding: 0 12px 0 0;
	float: left;
	margin: -3px 5px;
}

#header_object .icons li:last-child .mdi {
	padding: 0 0 0 0;
}

#header_object .icons .mdi:hover {
	color: #7bc6e9;
}

#header_object .icons li .mdi {
	float: left;
	height: 22px;
	margin: 5px 0 0 0;
}

#header_object .icons li:first-child .mdi {
	border-left: 0;
}

#content form #header_object .icons a {
	outline: 0;
}

#header_object .controles .mdi {
	color: #fff;
}

#header_object .controles .mdi:hover {
	color: #eee;
}

#header_object .controles .mdi.disabled,
#header_object .controles .mdi.disabled:hover{
	opacity: 0.5 !important;
	color: #fff !important;
	cursor: default;
}

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

table.table {
	border-spacing: 0;
	border: 0;
	margin: 0 auto 15px auto;
	width: 100%;
	font-size: inherit;
}

table.table caption {
	text-align: left;
	font-weight: bold;
	color: #000;
	margin: 0 auto;
}

table.table thead th {
	background: #fff;
	color: #4e4e4e;
}

table.table tbody .subnivel {
	background: #F6F7F7;
	color: #000;
}

table.table tbody#a1 {
	display: none;
}

table.table tbody .subnivel td {
	border-bottom: 1px solid #EBEBEB;
}

table.table tbody a:link,
table.table tbody a:visited,
table.table tbody a:active {
	color: #000;
	text-decoration: none;
}

table.table tfoot td {
	background-color: #fff;
	color: #5c5c5c;
	font-size: 10px;
	text-align: right;
}

table.table .centro {
	text-align: center;
}

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

table.table input {
	padding: 1px 5px;
}

table.table select {
	padding: 0px 5px !important;
}

table.table .ui-datepicker-trigger {
	margin: -2px 0 0 5px;
}

table.table .error {
	background: #fdd3c7;
	color: #a22525;
}

table.table thead .minimizar {
	text-align: right;
}

table.table td.shrink { /* Este tipo de td se encogen al mímino pero los otros mantienen su tamaño */
	width: 1px;
}

table.table td.nospace,
table.table th.nospace {
	padding: 0;
}

input.warning-highlight,
select.warning-highlight {
	background-color: #FEEFB3 !important;
	border-color: #9F6000 !important;
	color: #9F6000 !important;
}

.warning-highlight {
	color: #9F6000 !important;
}

table.table .number {
	display: block;
	height: 20px;
	width: 20px;
	line-height: 20px;
	-moz-border-radius: 10px; /* or 50% */
	border-radius: 10px; /* or 50% */
	background-color: #858585;
	color: white;
	text-align: center;
	font-size: 1em;
	font-weight: bold;
	cursor:default;
}

table.table .ignored {
	font-style: italic;
	color:  #666;
}

/* Gestión Documental -> Documento EDM. Preparado para tener SCROLL de forma opcional */
#main .documento table.table {
	width: auto !important;
}

#main table.table.documento td.simple {
	text-align: right !important;
	width: 1px;
	white-space: nowrap;
}

#main table.table.documento td.simple.top {
	vertical-align: top;
	line-height: 20px;
}

#main .documento table.table thead th {
	/* color: #000 !important; */
	/* font-weight: normal; */

}

#main .documento table.table {
	float: left !important;
	width: 100% !important;
}

/* fixed header tables */

.fixed-table-container {
	height: 200px;
	margin: 10px auto;
	position: relative;
	padding-top: 30px;
}

.fixed-table-container .table {
	table-layout: fixed;
}

.fixed-table-container .table thead th {
	border-bottom: 0;
}

.fixed-table-container td,
.fixed-table-container .table thead th {
	border-top: 0 ;
}

.fixed-table-container .header-background.bg1 table.table.bg1 thead th {
	color: #fff !important;
}

.fixed-table-container .fixed-table-container-inner {
	overflow-x: hidden;
	overflow-y: auto;
	height: 100%;
}

.fixed-table-container .header-background.bg1 {
	height: 30px; /* height of header */
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	background: #42a3d1;
}

.fixed-table-container .th-inner {
	position: absolute;
	top: 0;
	line-height: 30px; /* height of header */
	text-align: left;
	padding-left: 5px;
	margin-left: -5px;
	color: #fff;
}

/******************* Página inicial de resumen **********************/

#main #inicio #tareas {
	float: left;
	width: calc(100% - 260px);
}

/******************* Campos de formulario **********************/

#main fieldset {
	width: auto;
	margin: 0 0 15px 0;
	border: 0;
	padding: 0 10px 10px 10px; /* Los fieldsets blancos no tienen que tener padding por arriba. Los de color sí. */
}

#main fieldset p { /* No cortar textos largos con word-break: break-all; de forma genérica. Muchas incidencias previas derivadas de esto */
	float: left;
	margin: 0 5px 0 0;
	text-indent: 0;
	padding: 5px 0 5px 0;
	text-align: left;
}

/* Estas divisiones se usan en Alertas, leyenda, checkbox y fieldsets sueltos (por ejemplo en el modo lectura de caso) */
/* Para dividir en columnas los FIELDSET hay que resetear los width de las P, porque no interesan */

#main fieldset[class*="cols"] fieldset p {
	width: auto;
}

#main fieldset.cols1 p,
#main fieldset.cols1 fieldset {
	width: calc(100% - 20px);
}

#main fieldset.cols2 p,
#main fieldset.cols2 fieldset {
	width: calc(50% - 20px);
}

#main fieldset.cols3 p,
#main fieldset.cols3 fieldset {
	width: calc(33% - 20px);
}

#main fieldset.cols4 p,
#main fieldset.cols4 fieldset {
	 width: calc(25% - 20px);
}

#main fieldset.cols5 p,
#main fieldset.cols5 fieldset {
	 width: calc(20% - 20px);
}

#main fieldset.cols6 p,
#main fieldset.cols6 fieldset {
	 width: calc(15% - 20px);
}

#main fieldset.sep {
    border-bottom: 1px dotted #ddd;
}

#main fieldset.ico {
	margin: 10px 0 0 0;
	padding: 10px 0 0 5px;
}

#main fieldset.ico > .mdi { /* Esto solo afecta al icono del lateral, no a los interiores del fieldset */
	width: 30px;
	float: left;
	padding-top: 5px;
	color: #9cd0e7;
}

#main fieldset.ico .separe {
	border-left: 2px solid #c9e5f2;
	padding: 0 0 0 10px;
	margin: 0;
}

#main fieldset.ico .separe.no_border {
	border-left: 0px;
	border-right: 0px;
	margin: 0 0 0 35px;
}

#main fieldset.ico .separe div[id^=datetine]{
	float: left;
    margin: 0 5px 0 5px;
    text-indent: 0;
    padding: 5px 0 5px 0;
    text-align: left;
}

#main fieldset.ico fieldset.inline.tree {
    padding: 5px 0;
	margin: 0;
}

#main fieldset.nospace { /* El nospace tiene prioridad ante todo */
	padding: 0 !important;
	margin: 0 !important;
}

#main fieldset.nospace-bottom {
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
}

#main fieldset.nospace-left {
	padding-left: 0 !important;
	margin-left: 0 !important;
}

#main fieldset.nospace-top {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

#main fieldset.nospace-right {
	padding-right: 0 !important;
	margin-right: 0 !important;
}

#main fieldset.alertas p {
	padding: 3px 0 3px 0;
}

/* Ojo, el icono .mdi-checkbox-blank-circle sale en 4 sitios */

#main fieldset.a .mdi-checkbox-blank-circle,
#main fieldset.b .mdi-checkbox-blank-circle,
#main fieldset.c .mdi-checkbox-blank-circle,
#main fieldset.d .mdi-checkbox-blank-circle,
#main fieldset.e .mdi-checkbox-blank-circle,
#main fieldset.f .mdi-checkbox-blank-circle,
#main fieldset.g .mdi-checkbox-blank-circle,
#main fieldset.h .mdi-checkbox-blank-circle,
#main fieldset#priorities .mdi-checkbox-blank-circle,
#main #legend .card .mdi-checkbox-blank-circle {
	font-size: 10px;
}

#main fieldset.alertas .mdi-checkbox-blank-circle,
#main .jmesa tbody.tbody .mdi.mdi-checkbox-blank {
	font-size: 15px;
}

#main fieldset.alertas .mdi-checkbox-blank-circle ,
#main .jmesa tbody.tbody .mdi-checkbox-blank-circle {
	font-size: 11px;
}

#main #relatedDocumentalValidations .mdi-checkbox-blank-circle {
	margin-left: 10px;
}

#main .jmesa #CASES tbody.tbody td {
	min-width: 50px;
}

#main p input[type='checkbox'] {
	vertical-align: middle;
	margin: 3px;
}

#main fieldset p span.mini {
	font-size: 10px;
	font-style: italic;
	color: #666;
}

#main .required {
	color: #c10003;
	padding: 5px 0 0 0;
}

#main fieldset .featured {
    background: #fff none repeat scroll 0 0;
    padding: 5px;
	width: 100%;
}

/******************* Cajas de alerta **********************/

#main fieldset.alertas {
	background: #f5f5f5;
	padding: 3px 10px;
	margin: 5px 0 10px;
	position: relative;
	display: table-cell;
}

#main fieldset.alertas[class*="cols"] p span {
	padding-right: 10px;
}

#main fieldset.alertas[class*="cols"] p {
	padding: 5px;
	box-sizing: border-box;
	display: inline-flex;
	display: -ms-inline-flexbox;
	float: none;
}

#main fieldset.alertas p.titulo {
	display: block;
}

/******************* Caja de checkbox / radio **********************/

#main fieldset.checkboxs,
#main fieldset.radio {	
	display: table-cell;
}

#main fieldset.checkboxs p,
#main fieldset.radio p {
	line-height: inherit;
	position: relative;
	display: inline-block;
	vertical-align: top;
	float: none;
}

#main fieldset.checkboxs label,
#main fieldset.radio label {
	float: left;
	line-height: inherit;
	padding-left: 30px;
	margin-bottom: 5px;
}

#main fieldset.checkboxs input[type="checkbox"],
#main fieldset.checkboxs input[type="radio"] {
	width: 30px;
	position: absolute;
	left: 0;
}

#main fieldset.checkboxs input[type="radio"] {
	top: 8px;
}

/******************* Caja de leyenda **********************/

#main fieldset.legend {
	background: #f5f5f5;
	padding: 5px 10px;
	margin: 15px auto;
}

#main fieldset.legend p {
	box-sizing: border-box;
    display: inline-flex;
	display: -ms-inline-flexbox;
    float: none;
    padding: 5px;
}

#main fieldset.legend[class*="cols"] p span,
#main fieldset.legend[class*="cols"] p strong {
    padding-right: 10px;
}

#main fieldset.legend[class*="cols"] p strong {
	display: block;
}

#legend p {
	margin-bottom: 0; /* HACK BOOTSTRAP */
}

/******************* Caja de información **********************/

#main fieldset.info {
	background: #f5f5f5;
	padding: 0;
}

#main fieldset.info .titulo {
	width: 100%;
	background: #ddd;
	padding: 6px;
	float: left;
	border: 0;
	text-indent: 5px;
	font-weight: bold;
}

#main fieldset.info p {
	padding: 7px;
}

#main fieldset.info ul {
	margin: 40px 15px 15px 15px;
}

#main fieldset.info li {
	width: 100%;
	list-style: none;
	margin: 5px 0 5px 0;
	display: inline-table;
}

#main fieldset.info.notice .btn {
	margin-left: 5px;
	margin-right: 5px;
}

/* Esto es para la caja de Utilidades > Nota */

#main fieldset.info.notice {
	background: #fffde6 !important;
}

#main fieldset.info.notice pre {
	margin: 1em 20px;
	line-height: 20px;
	white-space: pre-wrap;	
	font-family: 'Open Sans', Arial, sans-serif;
	font-size: 12px;
}

#main fieldset.info.notice .underline {
	background: #faf6cc !important;
}

/******************* Elementos de formulario **********************/
/* (Están ajustados para que el texto empiece por la izq. a los mismos px) */

#main fieldset #newSolution textarea {
	padding: 0;
}

#main fieldset select {
	padding: 2px;
}

#main fieldset .radio span { /* form:radiobuttons de spring */
	float: left;
	clear: both;
}

#main fieldset .counter {
	font-size: 10px;
	color: #666;
	font-style: italic;
	width: 100%;
	text-align: right;
	display: block;
	margin: 5px 0 0 0;
}

/* Selector de archivos */

input[type="file"] {
	border: 0 !important;
	padding: 0 !important;
}

#main input:not (.size12 ),
#main select:not (.size12 ){
	margin-right: 5px;
}

#main fieldset .textarea {
	/* No meter border-bottom ya que en los textareas dentro de tablas hace que los td generen espacios extra*/
}

#main fieldset .textarea.autosize label {
	display: inherit; /* Bootstrap FIX */
}

/* Especificación de tamaños para INPUT y SELECT */
/* Los select son 6px más anchos en todos los navegadores */
/* En los locator los JMESA no van metidos en FIELDSET */

/* SIZE1 */

#main fieldset input.size1,
#main .jmesa input.size1 {
	width: 50px;
}

#main fieldset select.size1,
#main .jmesa select.size1 {
	width: 50px;
}

#main fieldset p.ck.size1 {
	width: 50px;
}

#main fieldset .textarea.size1,
#main .jmesa .textarea.size1{
	width: 8.33%;
}

.selectize-control.size1 {
	width: 50px;
}

.ui-multiselect.size1 {
	width: 50px;
}

/* SIZE2 */

#main fieldset input.size2,
#main .jmesa input.size2 {
	width: 100px;
}

#main fieldset select.size2,
#main .jmesa select.size2 {
	width: 100px;
}

#main fieldset p.ck.size2 {
	width: 100px;
}

#main fieldset .textarea.size2,
#main .jmesa .textarea.size2 {
	width: 16.66%;
}

.selectize-control.size2 {
	width: 100px;
}

.ui-multiselect.size2 {
	width: 100px;
}

/* SIZE3 */

#main fieldset input.size3,
#main .jmesa input.size3 {
	width: 130px;
}

#main fieldset select.size3,
#main .jmesa select.size3 {
	width: 130px;
}

#main fieldset p.ck.size3 {
	width: 130px;
}

#main fieldset .textarea.size3,
#main .jmesa .textarea.size3 {
	width: 25%;
}

.selectize-control.size3 {
	width: 130px;
}

.ui-multiselect.size3 {
	width: 130px;
}

/* SIZE4 */

#main fieldset input.size4,
#main .jmesa input.size4 {
	width: 180px;
}

#main fieldset select.size4,
#main .jmesa select.size4 {
	width: 180px;
}

#main fieldset p.ck.size4 {
	width: 180px;
}

#main fieldset .textarea.size4,
#main .jmesa .textarea.size4 {
	width: 33.33%;
}

.selectize-control.size4 {
	width: 180px;
}

.ui-multiselect.size4 {
	width: 180px;
}

/* SIZE5 */

#main fieldset input.size5,
#main .jmesa input.size5 {
	width: 240px;
}

#main fieldset select.size5,
#main .jmesa select.size5 {
	width: 240px;
}

#main fieldset p.ck.size5 {
	width: 240px;
}

#main fieldset .textarea.size5,
#main .jmesa .textarea.size5 {
	width: 41.66%;
}

.selectize-control.size5 {
	width: 240px;
}

.ui-multiselect.size5 {
	width: 240px;
}

/* SIZE6 */
#main fieldset input.size6,
#main .jmesa input.size6 {
	width: 300px;
}

#main fieldset select.size6,
#main .jmesa select.size6 {
	width: 300px;
}

#main fieldset .textarea.size6,
#main .jmesa .textarea.size6 {
	width: 50%;
}

#main fieldset p.ck.size6 {
	width: 300px;
}

.selectize-control.size6 {
	width: 300px;
}

.ui-multiselect.size6 {
	width: 300px;
}

/* SIZE7 */

#main fieldset input.size7,
#main .jmesa input.size7 {
	width: 350px;
}

#main fieldset select.size7,
#main .jmesa select.size7 {
	width: 350px;
}

#main fieldset .textarea.size7,
#main .jmesa .textarea.size7 {
	width: 58.33%;
}

#main fieldset p.ck.size7 {
	width: 350px;
}

.selectize-control.size7 {
	width: 350px;
}

.ui-multiselect.size7 {
	width: 350px;
}

/* SIZE8 */

#main fieldset input.size8,
#main .jmesa input.size8 {
	width: 395px;
}

#main fieldset select.size8,
#main .jmesa select.size8 {
	width: 395px;
}

#main fieldset .textarea.size8,
#main .jmesa .textarea.size8 {
	width: 66.66%;
}

#main fieldset p.ck.size8 {
	width: 395px;
}

.selectize-control.size8 {
	width: 395px;
}

.ui-multiselect.size8 {
	width: 395px;
}

/* SIZE9 */

#main fieldset input.size9,
#main .jmesa input.size9 {
	width: 450px;
}

#main fieldset select.size9,
#main .jmesa select.size9 {
	width: 450px;
}

#main fieldset .textarea.size9,
#main .jmesa .textarea.size9 {
	width: 75%;
}

#main fieldset p.ck.size9 {
	width: 450px;
}

.selectize-control.size9 {
	width: 450px;
}

.ui-multiselect.size9 {
	width: 450px;
}

/* SIZE10 */

#main fieldset input.size10,
#main .jmesa input.size10 {
	width: 500px;
}

#main fieldset select.size10,
#main .jmesa select.size10 {
	width: 500px;
}

#main fieldset .textarea.size10,
#main .jmesa .textarea.size10 {
	width: 83.33%;
}

#main fieldset p.ck.size10 {
	width: 500px;
}

.selectize-control.size10 {
	width: 500px;
}

.ui-multiselect.size10 {
	width: 500px;
}

/* SIZE11 */

#main fieldset input.size11,
#main .jmesa input.size11 {
	width: 560px;
}

#main fieldset select.size11,
#main .jmesa select.size11 {
	width: 560px;
}

#main fieldset .textarea.size11,
#main .jmesa .textarea.size11 {
	width: 91.66%;
}

#main fieldset p.ck.size11 {
	width: 560px;
}

.selectize-control.size11 {
	width: 560px;
}

.ui-multiselect.size11 {
	width: 560px;
}

/* SIZE12 */

#main fieldset input.size12,
#main .jmesa input.size12 {
	width: 630px;
}

#main fieldset select.size12,
#main .jmesa select.size12 {
	width: 630px;
}

#main fieldset .textarea.size12,
#main .jmesa .textarea.size12 {
	width: 100%;
}

#main fieldset p.ck.size12 {
	width: 630px;
}

.selectize-control.size12 {
	width: 630px;
}

.ui-multiselect.size12  {
	width: 630px;
}

/* AUTOSIZE */

#main fieldset select.autosize,
#main .jmesa select.autosize {
	width: auto;
}

.selectize-control.autosize {
	width: auto;
}

/* script autosize */

textarea.autosize {
	padding: 3px 5px; /* Esto son 26px de height = a un input normal */
}

table textarea.autosize {
	padding: 1px 5px; /* Esto son 22px de height = a un input dentro de tabla */
}

.textareaAutosize {
    min-height: 29px;
    overflow:hidden;
    resize: none;
}

/******************* Especificación alternativa de campos. INLINE **********************/
/* PENDIENTE: En IE 8 y 9 no pilla la separación entre <p> ni los sizes */

#main fieldset.inline {
	display: table;
	width: auto;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* HACK IE11 */
	#main fieldset.inline {
		display: block;
	}
}

#main fieldset.inline p {
	display: table-row;
	float: none;
}

#main fieldset.inline span.required {
	display: inline;
}

#main fieldset.inline label {
	display: table-cell;
	margin: 0 3px 3px 0;
	text-align: left;
}

#main fieldset.inline input,
#main fieldset.inline select,
#main fieldset.inline textarea {
	display: inline-block; /* No puede ser display: table-cell por IE */
}

#main fieldset.inline .entre {
	/* El SPAN es para "ENTRE" que aparecen 2 campos uno debajo de otro */
	margin: -27px 0 0 240px;
}

#main fieldset.inline input,
#main fieldset.inline select,
#main fieldset.inline .selectize-control {
	margin-bottom: 10px;
}

#main fieldset.inline select {
	margin-bottom: 10px;
}

#main fieldset.inline label {
	padding: 0 6px 4px 0;
	vertical-align: top;
}

#main fieldset.inline p textarea {
	margin-top: 1px
}

#main fieldset.inline.right label {
	text-align: right;
}

#main fieldset.inline.float fieldset.inline {
	width: auto !important;
	float: left;
	padding: 0;
	margin: 0 10px 0 0;
	/* Cuando dentro de un fieldset inline float, hay inlines para alinear algo en bloques, a estos les sobra el margin y padding, ya que ya */
	/* lo tiene especificado el fieldset principal. Dejamos 10px a la derecha para separar, por si hay varios inlines dentro del principal
	/* Por ejemplo 2 o 3 árboles */
}

#main fieldset.inline .datepicker {
	display: inline;
}

#main fieldset.inline .btn {
	margin-top: 4px;
}

#main fieldset.float-left.separe {
    border-right: 1px solid #d9d8d8;
}

#main fieldset.float-right.separe {
    border-left: 1px solid #d9d8d8;
}

#main fieldset.inline.right.horizontal {
	padding: 0
}

#main fieldset.inline.right.horizontal p {
	float: left;
}

#main fieldset.inline.right.horizontal center {
	float: left;
}

#main fieldset.inline.right.horizontal select {
	width: 150px !important;
}

#main fieldset.horizontal label {
	margin-right: 5px;
}

#main fieldset.horizontal2 p {
	float: left;
}

#main fieldset.horizontal2 label {
	float: none;
	display: inherit;
	text-align: left;
}

#main fieldset.tree {
	/* El árbol no lleva padding, el padding se lo da el fieldset de fuera */
	padding: 0;
}

#main fieldset.inline.tree {
    padding: 10px 0;
}

/* Tree */
#main fieldset.inline.right.horizontal {
	float: left !important;
}

#main fieldset.inline.right.horizontal label {
	display: inline;
}

/******************* Locator **********************/

#main fieldset.locator {
	width: 680px !important;
	/* En modo maximizado necesitamos que siga siendo 600px */
	margin: 0 auto;
	padding: 0 0 10px 0;
}

#main fieldset.locator label {
	float: left;
	width: 160px;
	text-align: right;
	margin: 5px 10px 0 0;
}

#main fieldset.locator p {
	padding: 0 0 5px 0;
}

#main fieldset.locator select {
	margin: 3px 10px 0 0;
	width: 190px; /* Igual que el valor de jquery.multiselect.min.js */
}

#main fieldset.locator .mini {
	width: 85.5px;
}

#main fieldset.locator #advancedSearchButton {
	clear: both;
	display: block;
	margin: 10px 0 0 250px;
	cursor: pointer;
}

#main fieldset.locator .bumensaje {
	border: 0;
	font-size: 11px;
	font-style: italic;
	margin-top: 5px;
	cursor: default;
}

#main fieldset.locator .bumensaje:focus {
	border: 0;
	outline: none;
}

#main fieldset.locator .ui-multiselect {
	margin: 3px 0 0 0 !important;
	float: right;
}

#main fieldset.locator .size3 {
	width: 182px; /* Lo igualo a los 190px del select y multiselect */
}

#main fieldset.locator .size5 {
	width: 396px; /* Curro 2016.05.25 */
}

#main fieldset.locator .treeLevelFilter { /* Para los �rboles */
	clear: both;
}

#main fieldset.locator .twodate { /* Para fecha de inicio, entre */
	margin: 3px 0 0 366px !important;
}

#main fieldset.locator .timepicker  {
	margin: 3px 0 0 -5px;
}

#main fieldset.locator_filters .predefinedFilter_container {
	text-align: center;
}

#main fieldset.locator_filters .predefinedFilter_container {
	width: 100%;
}

#main fieldset.locator_filters .predefinedFilter_container .filter .mdi {
	color: #4cb1e1;
	font-size: 60px;
	line-height: 60px;
}

.filter-separator{
    position: relative;
    text-align: center;
	padding: 10px;
	width: 680px;
	margin: 0 auto 20px;
}

.filter-separator label{
    background-color: #fff;
    padding: 0 1em;
    position: relative;
	font-size: 15px;
	font-weight: bold;
}

.filter-separator:before{
    content: '';
    border-style: solid;
    border-width: 0 0 1px 0;
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    border-color: #d4cbc7;
}

#main fieldset.locator_filters .predefinedFilter_container .filter {
	display: inline-table;
	text-align: center;
	margin-right: 10px;
	width: 15%;
}

#main fieldset.locator_filters .predefinedFilter_container span {
	display: block;
	color: #4cb1e1;
	font-size: 15px;
}

#main .no_results {
	/* Sin resultados en la búsqueda (no va dentro de un fieldset) */
	text-align: center;
	font-weight: bold;
	color: #4e4e4e;
	margin: 30px 0;
}

/* Scroll */
#main .scroll {
	overflow-x: auto;
	position: relative;
	margin: 0 0 15px 0;
	width: 690px;
}

body.maximize #main .scroll {
	width: 1250px;
}

#main .scroll th,
#main .scroll td {
	white-space: nowrap;
}

#main .scroll caption {
	width: 100% !important;
}

#main .scroll .table thead th {
	border-top: 0; /* Bootstrap */
	border-bottom: 0; /* Bootstrap */
}

/******************* Estilizado de fieldsets **********************/

#main fieldset.bg1,
#main fieldset.bg2 {
	padding: 10px;	/* En el bg1 sin número no tiene padding por arriba */
}

#main fieldset.bg1,
div.bg1 {
	background: #eaf7ff;
}

#main fieldset.bg2,
div.bg2 {
	background: #f5f5f5;

}

#main fieldset.border {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 0 !important; /* Bootstrap */
}

#main fieldset.border_box {
	border: 1px solid #ccc;
}

#main .block {
	/* Cada zona maximizable (titulo + fieldset) va dentro de un block */
	margin-bottom: 10px;
}

#main .block.level1 {
	width: 100%;
	clear: both;
}

#main .block.level2 {
	width: 95%;
	float: right;
}

#main .block.level3 {
	width: 90%;
	float: right;
}

#main .block.level4 {
	width: 85%;
	float: right;
}

#main .block fieldset {
	padding: 10px;	/* En zonas desplegables TODOS los fieldset tienen 10px por todos los lados */
					/* En casos normales, los simples no tienen 10px por arriba */
}

#main .block fieldset,
#main .block table.table,
#main .block .scroll,
#main .block .jmesa,
#main fieldset.bg1 fieldset {
	/* Elimino los 15px inferiores en cajitas maximizables */
	margin-bottom: 0 !important; /* o fieldset dentro de fieldset */
}

#main .tit {
	width: auto;
	padding: 5px 5px 5px 0; /* Grupo de casos necesita padding 0 a la izq. */
	font-size: 15px;
	font-family: roboto_condensedregular;	
}

#main .tit .mdi { /* El tamaño de los iconos dentro de .tit tiene que ser el mismo siempre, ya que sino la caja varía de altura */
	line-height: 19px;
}

#main .tit.bg1 {
	background: #7bc6e9;
	color: #fff;
}

#main .tit.bg1 .mdi {
	color: #fff;
}

#main .tit.bg2 {
	background: #eeeeee;
}

#main .tit .medium {
	font-size: 14px;
}

#main .tit .mini {
	font-size: 12px;
}

#main .tit.underline {
	border-bottom: 1px solid #ccc;
}

#main .tit.border {
	border: 1px solid #ccc;
}

#main .tit.border .mdi:first-child {
margin: 5px;
}

#main .tit,
#main .tit a {
	/* Hay cajas sin a (las dynamic=false) */
	color: #555;
}

#main .tit.bg1 a {
	color: #fff;
}

#main .tit.bg1:hover .mdi,
#main .tit.bg1:hover span {
    color: #eee !important;
}

#main .tit.bg1:hover .mdi.mdi-chevron-right,
#main .tit.bg1:hover .mdi.mdi-chevron-down,
#main .tit.bg1:hover a,
#main .tit.bg1:hover span,
 #main .tit.bg1:hover .mini {
	color: #f8f8f8;
}

#main .tit.bg2:hover .mdi.mdi-chevron-right,
#main .tit.bg2:hover .mdi.mdi-chevron-down,
#main .tit.bg2:hover a,
#main .tit.bg2:hover span,
#main .tit.border:hover a,
#main .tit.border:hover span {
	color: #000;
}

#main .tit .boton {
	background: none;
	border: 0;
	margin: -15px 0 0 0;
	padding: 0 4px 0 0;
	cursor: pointer;
}

#main .tit span.derecha {
	float: right;
	text-align: right;
	/* Aquí no se puede forzar la fuente */
}

#main .tit span.derecha input[type="text"] {
	padding: 1px 5px;
	margin: 0 0 0 5px;
	border: 1px solid #ccc
}

#main .tit .message {
    word-break: break-all;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
    flex-grow: 2;
	margin: 0 5px;
	width: 1px;
}

#main .tit .message * { /* A veces hay un span u otras etiquetas dentro */
	cursor: pointer;		    
}

#main .tit .mdi {
	margin: 0;
}

#main fieldset.title {
	padding: 0;
	width: 675px;
}

#main fieldset.title p {
	margin: 0 0 0 15px;
}

#main fieldset legend {
	font-weight: bold;
}

/******************* Roles **********************/

#main #roles {
	margin: 0 0 0 70px;
}

#main #roles p {
	margin: 0 0 10px 12px;
}

#main #roles select {
	color: #ced4da;
	background: #fff;
	width: 130px;
}

#main .posibles {
	float: left;
	width: 175px;
}

#main .botones {
	float: left;
	width: 225px;
	margin: 40px 0 0 0;
}

#main .botones input {
	width: 180px;
	float: left;
	margin: 0 0 10px 10px;
}

#main .asignados {
	float: left;
	width: 175px;
}

/* Específico para NOTA */

#main ul.gravedad {
	float: left;
	margin: 20px 0 0 5px;
}

#main ul.gravedad li {
	list-style: none;
	font-size: 10px;
	line-height: 17px;
	width: 475px;
	color: #555;
	font-style: italic;
}

/******************* Generico para pantallas internas **********************/

#main .columna_izquierda {
	float: left;
	width: 50%;
	border-right: 1px dashed #ccc;
}

#main .columna_izquierda fieldset,
#main .columna_derecha fieldset {
	width: 97%;
	margin: 0 auto;
	border: 0;
	padding: 2% 15px 2% 15px; /* Cambia para I.E. */
	text-align: center;
}

#main .columna_derecha {
	float: left;
	width: 47%;
}

#procesing_container {
	padding: 20px;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	color: #000;
	background: white;
	position: fixed;
	width: 300px;
	height: 70px;
	top: 0%;
	left: 50%;
	margin-left: -150px;
	margin-top: 220px;
	filter: alpha(opacity = 70);
	opacity: .9;
	display: none;
	z-index: 6666;
	box-sizing: content-box;
}

#procesing_container {
	border: 1px solid #c3c3c3;
}

.popup #procesing_container {
	display: none !important;
}

#main button.ui-multiselect {
	height: 30px;
}

/***************************************/
/************ Back to top **************/
/***************************************/

.backto {
	bottom: 58px;
	right: -8px;
	position: fixed;
	width: 50px;
}

.backto.chat {
  bottom: 60px;
  left: 17px;
}

.backto a.top,
.backto a.bottom {
	background-color: #ccc;
	color: #fff;
	display: none;
	padding: 4px 6px;
	text-align: center;
	text-decoration: none;
	transition: all 0.3s ease 0s;
	font-size: 1.1em;
	opacity: 0.75;
}

.backto a.bottom.disabled,
.backto a.bottom.disabled:hover {
	opacity: 0.25;
	cursor: default;
	transition: none;
	background-color: #ccc;
}

.backto a.top:hover {
	background-color: #aaa;
	color: #fff;
}

.backto a.bottom {
	position: absolute;
	top: 35px;
	left: 0;
}

.backto a.bottom:hover {
	background-color: #aaa;
	color: #fff;
}

body.popup .backto {
	right: 20px;
	bottom: 50px;
	width: 15px;
}

body.popup .backto a.top, body.popup .backto a.bottom {
	padding: 4px 6px;
	font-size: 10px;
}

body.popup .backto a.bottom {
	top: 25px;
}

body.popup .container.locator {
	max-width: 100%;
}

/***************************************/
/************ Cronología ***************/
/***************************************/

.timeline {
	position: relative;
	margin: 0 0 0 20px;
}

.timeline .timeline-block {
	position: relative;
	min-height: 16px;
	padding-left: 35px;
	padding-right: 35px;
}

.timeline .timeline-block::before {
	content: "";
	position: absolute;
	height: 100%;
	left: 0;
	top: 0;
}

.timeline .timeline-block:last-child::before {
	display: none
}

.timeline .timeline-block::after{
	content: "";
	display: table;
	clear: both
}

.timeline .timeline-ico .mdi {
	display: block;
	color: #fff !important;
}

.timeline .timeline-ico{
	position: absolute;
	min-width: 1px;
	min-height:1px;
	left:0;
	top:0;
}

.timeline .timeline-block::before {
    width: 4px;
    background: rgba(0, 0, 0, 0);
    margin-left: -2px;
    background-image: linear-gradient(#7bc6e9 80%, rgba(255, 255, 255, 0) 0%);
    background-position: right;
    background-size: 4px 8px;
    background-repeat: repeat-y;
}

.timeline .timeline-block {
    padding-bottom: 50px;
}

.timeline .timeline-ico {
    padding: 0;
    top: -10px;
    width: 25px;
    height: 58px;
    color: #fff;
    text-align: center;
    font-size: 24px;
    transform: rotate(180deg);
}

.timeline .timeline-ico span {
    position: relative;
    display: block;
    background: #42a4d1;
    width: 40px;
    height: 40px;
    border: 4px solid #7bc6e9;
    border-radius: 0 50% 50% 50%;
    transform: rotate(-45deg);
	box-sizing: content-box;
}

.timeline .timeline-ico .mdi {
    display: block;
    line-height: 23px;
    transform: rotate(-135deg);
    font-size: 1em;
    position: relative;
    top: 8px;
}

.timeline .timeline-ico {
    margin-right: -31px;
}

.timeline .timeline-content {
	width: 100%;
}

.timeline .timeline-content .timeline-content-inner {
    margin-left: 20px;
}

.timeline-content-inner {
	width: 175px;
}

.timeline-content-inner h2 {
    margin: 0 0 5px;
    font-weight: 800;
    color: #595959;
    font-size: 14px;
	font-weight: bold;
    text-transform: uppercase;
}

.timeline-content-inner p {
    margin: 0;
    font-size: 13px;
    color: #000;
	line-height: 20px;
}

/***************************************/
/************** Widgets ****************/
/***************************************/

body.widgets #content {
	border: 0;
	background: transparent;
}

body.widgets #header_object {
    border: 1px solid #d9d8d8;
    width: 100% !important;
    padding: 0;
    height: 41px;
    align-items: center;
    margin-bottom: 5px !important;
	padding-left: 4px;	
}

body.widgets #content #flex_container {
	border-top: 0;
	margin: 0;
}

body.widgets #content #main {
	background: transparent;
	padding: 10px 0 !important;
	min-width: 100%;
	max-width: 100%;
	width: 100%;
}

body.widgets #navbar .iconsLeft .mdi-home {
	display: block;
    pointer-events: none;	
}

body.widgets #navbar .iconsLeft .mdi-home:hover {
	cursor: default;

}

body.widgets #header_object .ui-multiselect {
	padding: 2px 0 1px 0;
	text-indent: 5px;
	height: 25px;
	margin: 6px 0 0 -5px !important;
}

/* Leyenda especial, dentro de widgets en la página inicial */

#main #legend.widget {
	display: none;
	top: 10px;
	right: 15px;
	position: fixed;
	background: #f5f5f5;
	padding: 10px 0 10px 15px;
	box-shadow: 2px 1px 4px -1px rgba(0, 0, 0, 0.2);
	border: 1px solid #DDD;
}

#main #legend.widget p {
	float: left;
	margin: 0 5px 0 0;
}

#main #legend.widget:after,
#main #legend.widget:before {
	bottom: 100%;
	left: 89%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#main #legend.widget:after {
	border-color: rgba(241, 241, 241, 0);
	border-bottom-color: #f5f5f5;
	border-width: 10px;
	margin-left: -10px;
}

#main #legend.widget:before {
	border-color: rgba(221, 221, 221, 0);
	border-bottom-color: #ddd;
	border-width: 11px;
	margin-left: -11px;
}

#main #legend.widget fieldset.alertas {
	border: 0;
	float: left;
	font-size: 10px;
	margin: 2px 0 0 5px;
	padding: 0;
	width: 130px;
}

#main #legend.widget .alertas p {
	width: 120px;
	padding: 0 0 5px 0;
}

#main #legend.widget .mdi-checkbox-blank-circle { /* Este icono también aparece grande en la gestión documental */
	font-size: 9px;
}

#main #legend.widget .mdi-checkbox-blank-circle {
	font-size: 9px;
	display: inline-block;
	margin: 0;
}

/* Lobipanel */

#lobiWidgets .lobipanel {
/*min-height: 300px; Si se especifica altura, hay mucho espacio inutilizado, mejor que se AUTOAJUSTEN al contenido */
}

#lobiWidgets .lobipanel.widget1:before,
#lobiWidgets .lobipanel.widget2:before,
#lobiWidgets .lobipanel.widget3:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
	opacity: 0.3;
}

#lobiWidgets .lobipanel.widget1 .card:hover {
	background-color: rgba(238, 238, 238, 0.9) !important
}

#lobiWidgets .lobipanel.widget1 {
}

#lobiWidgets .lobipanel.widget1 .card-title h4,
#lobiWidgets .lobipanel.widget1 .dropdown-menu-right .mdi:before {
	color: #fff;
}

#lobiWidgets .lobipanel.widget2 .card-title h4,
#lobiWidgets .lobipanel.widget2 .dropdown-menu-right .mdi:before {
	color: #fff;
}

#lobiWidgets .lobipanel.widget3 .card-title h4,
#lobiWidgets .lobipanel.widget3 .dropdown-menu-right .mdi:before {
	color: #fff;
}

/***************************************/
/************** Ribbon *****************/
/***************************************/

.ribbon_container {
	position: relative;
	background: #eee;
}

.ribbon {
	position: fixed;
	left: -5px;
	top: -5px;
	z-index: 665;
}

body.maximize .ribbon{
	position: relative;
    left: -5px;
    top: -5px;
    z-index: 665;
}

.ribbon span {
	font-size: 10px;
	font-weight: bold;
	color: #FFF;
	text-transform: uppercase;
	text-align: center;
	line-height: 20px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	width: 100px;
	display: block;
	background: #79A70A;
	background: linear-gradient(#9BC90D 0%, #79A70A 100%);
	box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
	position: absolute;
	top: 19px;
	left: -21px;
}

.ribbon span::before {
	content: "";
	position: absolute;
	left: 0px;
	top: 100%;
	z-index: -1;
	border-left: 3px solid #79A70A;
	border-right: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-top: 3px solid #79A70A;
}

.ribbon span::after {
	content: "";
	position: absolute;
	right: 0px;
	top: 100%;
	z-index: -1;
	border-left: 3px solid transparent;
	border-right: 3px solid #79A70A;
	border-bottom: 3px solid transparent;
}

.ribbon span.blue,
.ribbon span.red,
.ribbon span.gray,
.ribbon span.cian,
.ribbon span.orange {
	font-size: 10px;
	font-weight: bold;
	color: #FFF;
	text-transform: uppercase;
	text-align: center;
	line-height: 20px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	width: 100px;
	display: block;
	position: absolute;
	top: 19px;
	left: -21px;
	box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
}

.ribbon span.blue::before,
.ribbon span.blue::after,
.ribbon span.red::before,
.ribbon span.red::after,
.ribbon span.gray::before,
.ribbon span.gray::after,
.ribbon span.cian::before,
.ribbon span.cian::after,
.ribbon span.orange::before,
.ribbon span.orange::after {
	content: "";
	position: absolute;
	left: 0px;
	top: 100%;
	z-index: -1;
}

.ribbon span.blue {
	background: #79A70A;
	background: linear-gradient(#2989d8 0%, #1e5799 100%);
}

.ribbon span.blue::before {
	border-left: 3px solid #1e5799;
	border-right: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-top: 3px solid #1e5799;
}

.ribbon span.blue::after {
	border-left: 3px solid transparent;
	border-right: 3px solid #1e5799;
	border-bottom: 3px solid transparent;
}

.ribbon span.red {
	background: #79A70A;
	background: linear-gradient(#F70505 0%, #8F0808 100%);
}

.ribbon span.red::before {
	border-left: 3px solid #8F0808;
	border-right: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-top: 3px solid #8F0808;
}

.ribbon span.red::after {
	border-left: 3px solid transparent;
	border-right: 3px solid #8F0808;
	border-bottom: 3px solid transparent;
}

.ribbon span.gray {
	background: #79A70A;
	background: linear-gradient(#B6BAC9 0%, #808080 100%);
}

.ribbon span.gray::before {
	border-left: 3px solid #808080;
	border-right: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-top: 3px solid #808080;
}

.ribbon span.gray::after {
	border-left: 3px solid transparent;
	border-right: 3px solid #808080;
	border-bottom: 3px solid transparent;
}

.ribbon span.cian {
	background: #79A70A;
	background: linear-gradient(#05EFF7 0%, #087F8F 100%);
}

.ribbon span.cian::before {
	border-left: 3px solid #087F8F;
	border-right: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-top: 3px solid #087F8F;
}

.ribbon span.cian::after {
	border-left: 3px solid transparent;
	border-right: 3px solid #087F8F;
	border-bottom: 3px solid transparent;
}

.ribbon span.orange {
	background: #79A70A;
	background: linear-gradient(#F79E05 0%, #8F5408 100%);
}

.ribbon span.orange::before {
	border-left: 3px solid #8F5408;
	border-right: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-top: 3px solid #8F5408;
}

.ribbon span.orange::after {
	border-left: 3px solid transparent;
	border-right: 3px solid #8F5408;
	border-bottom: 3px solid transparent;
}

/***************************************/
/************ Encuestas ****************/
/***************************************/

#questionsDiv #encabezado {
	margin: 5px 0 5px 0;
	width: 420px;
	font-size: 15px;
}

#questionsDiv .ok {
	display: block;
	padding: 0 0 0 25px;
	color: green;
	height: 16px;
}

#questionsDiv .ok:before {
	font: 22px "Material Design Icons";
	content: "\f133";
}

#questionsDiv span.question_question p {
	float: none !important;
}

/***************************************/
/*************** Tabs ******************/
/***************************************/

#main ul.tabs {
	float: left;
	list-style: none;
	height: 19px;
	width: 100%;
	border-radius: 5px 0 -50px 0;
	margin: 20px 0 0 0;
	padding: 0;
}

#main ul.tabs li {
	float: left;
	height: 30px;
	line-height: 30px;
	border: 1px solid #c3c3c3;
	overflow: hidden;
	position: relative;
	background: #e7e7e7;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	margin: -10px 5px -1px 0;
	padding: 0;
}

#main ul.tabs li a {
	text-decoration: none;
	color: #000;
	display: block;
	border: 1px solid #fff;
	outline: none;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	padding: 0 20px;
}

#main ul.tabs li a:hover {
	background: #d6d6d6;
}

#main ul.tabs li.active, #main ul.tabs li.active a:hover {
	background: #fff;
	border-bottom: 1px solid #fff;
}

#main .tabContainer {
	border: 1px solid #c3c3c3;
	overflow: hidden;
	clear: both;
	float: left;
	width: 100%;
	background: #fff;
	border-radius: 5px;
	border-top-left-radius: 0;
	margin: 0;
	padding: 0 0 20px;
}

#main .tabContainer fieldset {
	padding: 0;
}

#main .tabContent {
	padding: 20px;
	min-height: 30px;
}

#main .tabContent textarea.size12 {
	width: 100%
}

/* Tabs sencillas adaptadas a la vista integral */

#main #integral_view, /* Esto va por encima del .integral_view pero es variable */
#main #integral_view .block {
	padding: 0;
	margin: 0;
}

#main #integral_view > fieldset { /* La vista integral no tiene espacio por arriba, las tabs simples sí */
	padding: 0;
}

#main .integral_view ul.tabs li {
	margin: -10px 5px -1px 0 !important;
}

#main .integral_view ul.tabs li a {
	padding: 0;
}

#main .integral_view ul.tabs li strong {
	padding: 0 12px;
	color: #939292;
}

#main .integral_view ul.tabs li .mdi {
	padding: 2px 8px;
	color: #989797;
}

#main .integral_view ul.tabs li a:hover .mdi {
	color: #939292;
}

#main .integral_view ul.tabs li.active .mdi,
#main .integral_view ul.tabs li.active strong,
#main .integral_view ul.tabs li.active a:hover .mdi,
#main .integral_view ul.tabs li.active a:hover strong {
	color: #000;
}

#main .integral_view div[id^='tab_cases'] .slide p,
#main .integral_view div[id^='tab_task'] .slide p {
	margin-left: 65px;
}

#main .integral_view div[id^='tab_cases'] .slide p a,
#main .integral_view div[id^='tab_task'] .slide p a {
	margin-left: -15px;
}

/* Los slides pueden salir en la pestaña principal o en las interiores, no les pongo prefijo */

#main .integral_view .tabContent .slide {
	width: 100%;
	margin: 5px 0 -20px 0;
}

#main .integral_view .tabContent .sub {
    display: block;
    margin: 0 0 0 30px;
    width: 100%;
}

#main .integral_view .tabContent p {
	width: 100%;
}

#main .integral_view .tabContent .slide span {
	display: block;
	clear: both;
	cursor: default;
	font-size: 12px;
}

#main .integral_view .tabContent.tab_summary .slide span {
	margin: 5px 0 5px 35px; /* El primer TAB más tabulado */
}

#main .integral_view .tabContent .slide span {
	margin: 5px 0 5px 5px;
}

#main .integral_view .tabContent .slide span.closed,
#main .integral_view .tabContent .slide span.opened {
	cursor: pointer;
	margin-left: 20px;
}

#main .integral_view .tabContent .slide span:before {
	font: 10px "Material Design Icons";
	content: "\f5b0";
	padding-right: 5px;
	color: #989797;
}

#main .integral_view .tabContent .slide span[class^='estado'] {
	display: initial;
	clear: initial;
	margin: initial;
	font-weight: bold;
}

#main .integral_view .tabContent .slide span[class^='estado']:before {
	content: initial;
}

#main .integral_view .tabContent .slide span.opened:before {
	font: 15px "Material Design Icons";
	content: "\f140";
}

#main .integral_view .tabContent .slide span.closed:before {
	font: 15px "Material Design Icons";
	content: "\f142";
}

#main .integral_view .tabContent .slide p {
    clear: both;
    float: left;
    width: 80%;
    margin-left: 50px;
    margin-right: -115px;
}

#main .integral_view .tabContent .slide p .mdi,
#main .integral_view .tabContent .slide p .mdi:hover {
    font-size: 10px;
}

#main .integral_view .tabContent .slide p a {
	overflow-wrap: break-word;
}

#main .integral_view .tabContent .slide p a:before {
	font: 10px "Material Design Icons";
	content: "\f5b0";
	padding-right: 5px;
	color: #989797;
}

#main .integral_view .tabContent .slide p strong {
	padding: 0 0 0 20px;
	margin: 0 0 0 -20px;
	word-break: break-all;
}

/**/

#main .integral_view .tabContent.tab_summary .left {
	float: left;
	width: calc(59% - 20px);
	margin: 0 0 10px 0;
}

#main .integral_view .tabContent.tab_summary .right {
	float: left;
	width: 40%;
	border-left: 1px solid #dedede;
	padding-left: 20px;
	margin-bottom: 20px;
}

#main .integral_view .tabContent.tab_summary .left span[class*="ico_"] {
	font-size: 12px;
	padding: 0 10px;
	line-height: 20px;
	display: block;
	font-weight: bold;
	color: #393939;
}

#main .integral_view .tabContent.tab_summary .left span[class*="ico_"]:before {
	font: 20px "Material Design Icons";
	padding-right: 5px;
	color: #989797;
}

#main .integral_view .tabContent.tab_summary .left span.ico_interactions:before {
	content: "\f182";
}

#main .integral_view .tabContent.tab_summary .left span.ico_cases:before {
	content: "\f224";
}

#main .integral_view .tabContent.tab_summary .left span.ico_tasks:before {
	content: "\f14d";
}

#main .integral_view .tabContent.tab_summary .left span.ico_attachments:before {
	content: "\f39b";
}

#main .integral_view .tabContent.tab_summary .left span.ico_paymentAgreement:before {
	content: "\fa4f";
}

#main .integral_view .tabContent.tab_summary .left span.ico_campaigns:before {
	content: "\f5dd";
}

#main .integral_view .tabContent.tab_summary .left span.ico_products:before {
	content: "\f3d7";
}

#main .tabContent.tab_summary .left span.ico_contracts:before {
	content: "\f3EA";
}

#main .integral_view .tabContent.tab_summary .left hr {
	margin: 10px 20px 10px 0;
}

#main .tabContent.tab_summary .left span.ico_debt:before {
	content: "\f5e4";
}

/***************************************/
/************** Dialogs ****************/
/***************************************/

#alertdialog:before,
#dialog-confirm:before,
#okdialog:before {
	position: absolute;
	left: 8px;
	top: 8px;
	color: #999;
	font: 30px "Material Design Icons";
}

#alertdialog.ui-widget-content,
#dialog-confirm.ui-widget-content,
#okdialog.ui-widget-content {
	padding: 15px 10px 10px 55px;
}

#alertdialog:before,
#dialog-confirm:before {
	content: "\f02a";
}

#okdialog:before {
	content: "\f5e1";
}

/***************************************/
/**************** Menú *****************/
/***************************************/

/* Para que no salten las opciones del menú desplegable */
/* Al ser genérico puede dar problemas, cuidado */

.ui-menu .ui-menu-item a .mdi {
	position: absolute;
	right: 0;
	cursor: pointer;
	font-size: 14px;
	padding: 0 5px;
}

/***************************************/
/********** Notificaciones *************/
/***************************************/

#column #services {
	background: #fff;
	padding: 4px;
	margin-bottom: 15px;
	border: 1px solid #d9d8d8;
}

#column #services .console {
	padding: 5px 6px;
}

#column #services .console.conconnected {
	background: #8bd041;
	border: 1px solid #8bd041;
	color: #fff;
}

#column #services p {
	margin-bottom: 0; /* Bootstrap Fix */
}

#column #services .console.condisconnected {
	background: #eee none repeat scroll 0 0;
	border: 1px solid #c3c3c3;
	color: #747474;
}

#column #services .console.condisconnected .mdi {
	color: #747474;
}

#column #services .console em {
	margin: 4px 0 0 5px;
	float: left;
}

#column #services .console em, #column #services strong {
	font-size: 14px;
}

#column #services .console a {
	float: right;
	font-size: 18px;
	margin: -3px 0 0 5px;
}

#column #services .console a#loginConsoleButton,
#column #services .console a#logoutConsoleButton {
	margin: -2px 0 0 5px;
}

#column #services .console a#logOutService {
	margin: -4px;
}

#column #services .console .listservices {
	margin: 5px 0 0 0;
	padding: 5px 10px;
	position: relative;
	display: none;
	background: #fff;
	color: #333;
}

#column #services .console .listservices p {
	padding: 7px 0 7px 0;
	border-bottom: 1px dotted #ddd;
	font-weight: normal;
}

#column #services .console .listservices p em {
	float: none;
	margin: 0;
}

#column #services .console .listservices p.connected {
    color: #68a951;
    font-style: italic;
}

#column #services .console .listservices p.disconnected {
	color: #000;
	font-weight: normal !important;
	font-style: italic;
}

#column #services .console .listservices p:last-child {
	border: 0;
}

#column #services .console .listservices p.connected span,
#column #services .console .listservices p.disconnected span {
	width: 180px;
	display: inline-flex;
	display: -ms-inline-flexbox;
	font-size: 12px;
}

#column #services .notifications {
	position: relative;
	display: none;
	margin: 5px 0 0 0;
	padding: 0;
}

#column #services .notifications .notibox {
	background: #fff;
	border: 1px solid #c3c3c3;
	margin-bottom: 5px;
}

#column #services .notifications .notibox .close { /* Bootstrap Fix */
	line-height: inherit;
	text-shadow: inherit;
	opacity: 1;
}

#column #services .notifications .notibox span i { /* Esta i no es un icono */
	float: left;
	word-break: break-all;
	margin: 7px 10px 8px;
	font-weight: bold;
	font-style: normal;
	color: #434343;
	padding: 0;
	font-size: 12px;
}

#column #services .notifications .notibox span i.servicio { /* Esta i no es un icono */
	background: #f2f2f2;
	margin: 0;
	width: 100%;
	border-bottom: 1px solid #c3c3c3;
	border-top: 1px solid #c3c3c3;
	padding: 5px 4px 5px 10px;
	font-weight: normal;
	font-style: italic;
}

#column #services .notifications .notibox:last-child {
	margin-bottom: 0;
}

#column #services .notifications .notibox p {
	width: 100%;
	margin: 0;
	color: #333;
	display: table;
	padding: 0;
	background: #2aa7de;
	cursor: pointer;
}

#column #services .notifications .notibox p .mdi {
	font-size: 20px;
	text-align: center;
	color: #FFF;
	float: left;
	margin: 2px 0 0 2px;
}

#column #services .notifications .notibox p .titulo {
	width: 85%;
	color: #FFF;
	margin: 5px 0;
	float: left;
}

#column #services .notifications .notibox p .titulo.largo {
	width: 135px; /* Cuando hay 3 iconos */
}

#column #services .notifications .notibox p .titulo:hover {
	color: #fff;
}

#column #services .notifications .notibox span {
	display: table; /* Antes era display:none; */
	font-size: 11px;
	color: #000;
	font-style: italic;
	position: relative;
	word-break: break-all;
	height: auto;
	width: 100%;
}

#column #services .notifications .notibox span.buttons {
	width: 100%;
	background-color: #edecec;
	border-bottom: 0;
	margin: 0;
}

#column #services .notifications .notibox span.buttons ul {
	width: 100%;
	border-top: 0;
	margin: 0;
	padding: 0;
	display: flex;
	display: -ms-flexbox;
	float: left;
}

#column #services .notifications .notibox span.buttons ul li {
	font-size: 11px;
	text-decoration: none;
	color: #666;
	float: left;
	background: none;
	padding: 0;
	margin: 0;
	clear: none;
	list-style: none;
	border-right: 1px solid #c3c3c3;
	flex: auto;
	 -ms-flex: auto;
}

#column #services .notifications .notibox span em {
	border-top: 1px solid #ccc;
	float: left;
	width: 100%;
	display: flex;
	display: -ms-flexbox;
}

#column #services .notifications .notibox span em a {
	flex: auto;
	-ms-flex: auto;
}

#column #services .notifications .notibox span em a:last-child {
	flex: initial;
	-ms-flex: initial;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	#column #services .notifications .notibox span em {
		right: 10px; /* Chrome*/
	}
}

#column #services .notifications .notibox span[id^='info'] ul {
     margin-bottom: 0;	
}

#column #services .notifications .notibox span[id^='info'] ul li {
	margin: 0 10px;
	list-style: none;
	margin: 0 15px 0 10px; /* A petición de FCO. Más espacio x la derecha */
	list-style: none;
	display: flex;
	display: -ms-flexbox;
}

#column #services .notifications .notibox span[id^='info'] ul li:before {
	content: "\f12e";
	font: 7px "Material Design Icons";
	color: #2aa7de;
	padding: 5px;
	margin: 0;
}

#column #services .notifications .notibox span.buttons ul li:last-child {
	border-right: 0px;
}

#column #services .notifications span .sep {
	height: 16px;
	width: 2px;
}

#column #services .notifications .ok,
#column #services .notifications .go,
#column #services .notifications .postpone,
#column #services .notifications .transfer {
	cursor: pointer !important;
	vertical-align: top;
	width: 100%;
	display: table-cell;
	float: left;
}

#column #services .notifications .transferbox {
	padding: 13px 0 0;
	border-top: 1px solid #ccc;
	float: left;
	clear: both;
	width: 100%;
	margin: 0 auto;
}

#column #services .notifications .transferbox input[type=text] {
	width: 100px;
	padding: 2px;
	border: 1px solid #ccc;
	background: #fff;
	margin: 0 10px 0 0;
}

#column #services .notifications .transferbox .mdi {
	color: #2aa7de;
	font-size: 18px;
	margin-top: 5px;
}

#column #services .notifications .countdown {
	float: left;
	clear: both;
	border-top: 1px solid #ccc;
	width: 207px;
	padding: 10px 0 0 8px;
	margin: 10px 0 10px 10px;
	font-style: normal;
}

#column #services .notifications .countdown b {
	background: #0982ca;
	padding: 2px 4px;
	color: #fff;
	border-radius: 5px;
	margin: 0 2px;
	font-style: normal;
	font-weight: normal;
}

#column #services .console.conconnected a .mdi {
	color: #fff;
}

#column #services .console.conconnected a .mdi:hover {
	color: #eee;
}

#column #services .console.condisconnected a .mdi,
#column #services .console div.listservices a .mdi {
	color: #000;
}

#column #services .console.condisconnected a .mdi:hover,
#column #services .console div.listservices a .mdi:hover {
	color: #666;
}

#column #services .notifications .notibox span.buttons ul li .mdi {
	width: 100%;
	font-size: 18px;
	text-align: center;
	color: #888;
	padding: 5px 0px 5px 0px;
	margin: 0;
}

#column #services .notifications .notibox span.buttons ul li .mdi:hover {
	color: #000;
}

#column #services .notifications .notibox span em.eminfo a i { /* Esta i no es un icono */
	font-size: 18px;
	color: #2aa7de;
	float: left;
	clear: none;
}

#column #services .notifications .notibox span em.eminfo a i:hover { /* Esta i no es un icono */
	color: #000;
}

#column #spanSearchMenu {
	margin-bottom: 1.1rem;
}

#column #spanSearchMenu .input-group-lg > .form-control:not(textarea) { /* Para que mida de altura igual que #header_object */
	height: calc(3rem + 2px);
}

/***************************************/
/************** CKEditor ***************/
/***************************************/

.object_type_1041 .ck {
	/* Solo para Solución, para el EMAIL no hace falta */
	margin-top: -9px !important;
}

#main fieldset .ck {
	width: 100%;
	margin: 0 0 0 -1px;
}

#main fieldset .ck .cke_top {
	/*padding: 2px 8px 2px;*/
}

#main fieldset .ck textarea {
	border: 0 !important;
}

.cke_dialog_ui_html { /* Popup */
	border: 0;
}

a.cke_dialog_ui_button {
	padding: 0 !important;
}

a.cke_dialog_ui_button:focus {
	box-shadow: none !important;
}

a.cke_dialog_ui_button_ok {
	background: #4cb1e1 !important;
	border: 1px solid #4cb1e1 !important;
	padding: 4px 1px !important;
}

a.cke_dialog_ui_button_ok:hover {
	background: rgba(76, 177, 225, 0.8) !important;
	border-color: #4cb1e1 !important;
}

#spanDescription p {
	clear: both;
	word-break: break-all;
}

.cke_top,
.cke_bottom,
.cke_chrome {
	border-color: #ced4da !important;
}

.cke_fake {
	border-top: 1px solid #ced4da !important;
	border-left: 1px solid #ced4da !important;
	border-right: 1px solid #ced4da !important;
	background: #f8f8f8;
	width: calc(100% - 18px);
	display: block;
	padding: 6px 8px 19px;
	text-align: right;
}

.cke_fake .button.token {
	background: url("../../js/ckeditor/plugins/crmtemplates/images/icon.png?t=H0CG") no-repeat;
	display: block;
	float: right;
	width: 16px;
	height: 16px;
	margin-top: -1px;
}

.cke_textarea_inline {
	border: 1px solid #bbb;
}

/***************************************/
/************ Checklist ****************/
/***************************************/

#main #CheckList p {
	border-bottom: 1px dotted #818181;
	width: 99%;
}

#main #CheckList p .date {
	font-style: italic;
	color: #888;
	margin: 0 0 0 10px;
	font-size: 10px;
}

#main #CheckList p:last-child {
	border-bottom: 0;
}

#main #CheckList .apply {
	text-decoration: line-through;
	font-style: italic;
	text-indent: 25px;
	color: #191919;
}

#main #CheckList p.apply a:hover {
	color: #ced4da;
}

#main #CheckList .undone a:hover {
	color: #ced4da;
}

#main #CheckList .done a {
	color: #318a00 !important;
}

/***************************************/
/*************** Tree ******************/
/***************************************/

#main .tree, #main .tree ul {
	list-style-type: none;
	margin-left: 0 0 0 10px;
	padding: 0;
	position: relative;
	overflow: hidden;
}

#main .tree li {
	margin: 0;
	padding: 0 12px;
	position: relative;
}

#main .tree li::before, #main .tree li::after {
	content: '';
	position: absolute;
	left: 0;
}

#main .tree li::before {
	border-top: 1px solid #999;
	top: 10px;
	width: 10px;
	height: 0;
}

#main .tree li:after {
	border-left: 1px solid #999;
	height: 100%;
	width: 0;
	top: -10px;
}

#main .tree>li::after {
	top: 10px;
}

#main .tree>li:last-child::after {
	display: none;
}

#main .tree ul:last-child li:last-child:after {
	height: 20px;
}

/* Para que funcione el tree actual con Bootstrap */

.form-row [id^='treeData'] > [class*="col-"] {
	padding-left: 5px !important;
	padding-right: 5px !important;
}

span[id^='treeData'] {
	padding: 0 !important;
}

/***************************************/
/****** Historico de interacciones *****/
/***************************************/

#main .user1,
#main .user2 {
	margin: 20px 0 0 0;
	display: table;
}

#main .user1:last-child,
#main .user2:last-child {
	margin-bottom: 0;
}

#main .user1 {
	width: 80%;
	float: right;
	background: #f5f5f5;
}

#main .user2 {
	width: 100%;
	float: left;
	background: #eaf7ff;
	float: left;
}

#main .user1 .left,
#main .user2 .left {
	width: 120px;
    background-color: rgba(0,0,0,0.03);
	display: table-cell;
	vertical-align: top;
	padding: 10px;
}

#main .user1 .left p,
#main .user2 .left p {
	margin: 0;
	padding: 0;
}

#main .user1 .desc,
#main .user2 .desc {
    margin: 10px;
    float: left;
    width: calc(100% - 160px);
	display: table-cell;
}

#main .user1 .desc p,
#main .user2 .desc p {
	margin: 0;
}

/***************************************/
/*************** Estados ***************/
/***************************************/

#main #read_only_cases fieldset.bg1:first-child {
	border: 0;
}

#main fieldset .estado1,
#main fieldset .estado2,
#main fieldset .estado3,
#main fieldset .estado4,
#main fieldset .estado5,
#main fieldset .estado6,
#main fieldset .estado7,
#main fieldset .estado8 {
	font-weight: bold;
}

#main .border.a,
#main .border.b,
#main .border.c,
#main .border.d,
#main .border.e,
#main .border.f,
#main .border.g,
#main .border.h {
	font-size: 14px;
	font-weight: normal;
}

/* Nuevo */

#main .border.a {
	background: #cfeff2;
}

#main fieldset.a {
	background: #f1feff;
}

#main .estado1 {
	color: #197589;
}

#main #calendar .estado1 {
	background: #94e2e8;
	border: 1px solid #7fadb9;
}

/* En progreso */

#main .border.b {
	background: #e7f398;
}

#main fieldset.b {
	background: #fcfee7;
}

#main .estado2 {
	color: #4d6d08;
}

#main #calendar .estado2 {
	background: #b7ee73;
	border: 1px solid #87b167;
}

/* En espera */

#main .border.c {
	background: #fde290;
}

#main fieldset.c {
	background: #fffce9;
}

#main .estado3 {
	color: #775a00;
}

#main #calendar .estado3 {
	background: #e6d761;
	border: 1px solid #afb168;
}

/* Cancelado */

#main .border.d {
	background: #fcc1c1;
}

#main fieldset.d {
	background: #fff0f0;
}

#main .estado4 {
	color: #ac0101;
}

#main #calendar .estado4 {
	background: #eb8795;
	border: 1px solid #ae6b6c;
}

/* Cerrado */

#main .border.e {
	background: #e3e5c7;
}

#main fieldset.e {
	background: #fafaf0;
}

#main .estado5 {
	color: #4b3f14;
}

#main #calendar .estado5 {
	background: #c1ae97;
	border: 1px solid #887e66;
}

/* Reabierto */

#main .border.f {
	background: #c0d4f2;
}

#main fieldset.f {
	background: #eff5fe;
}

#main .estado6 {
	color: #13448f;
}

/* Validado */

#main .border.g {
	background: #95d55d;
}

#main fieldset.g {
	background: #efffdc;
}

#main .estado7 {
	color: #026a14;
}

/* Pendiente */

#main .border.h {
	background: #fdbe90;
}

#main fieldset.h {
	background: #fff7ed;
}

#main .estado8 {
	color: #c74b00;
}

/* Fin del icono de la hoja de la izquierda */

#main div[id$='Block'] .tit { /* Sin .border pq el "..." tiene q funcionar en todos los casos */
	text-align: justify;
	display: flex;
	display: -ms-flexbox;
	line-height: 22px;
}

#main div[id$='Block'] .tit.border .arrow3,
#main div[id$='Block'] .tit.border .arrow4 {
    width: 30px;
	margin: -5px 0px -5px 0px;
}

#main div[id^='group'][id$='Block'] .tit.border .arrow3 .mdi,
#main div[id^='group'][id$='Block'] .tit.border .arrow3 .mdi:hover,
#main div[id^='group'][id$='Block'] .tit.border .arrow4 .mdi,
#main div[id^='group'][id$='Block'] .tit.border .arrow4 .mdi:hover {
	color: #fff; /* Flechas blancas para grupo de casos */
}

#main div[id$='Block'] .tit.border .arrow3 .mdi {
	position: relative;
	top: 5px;
}

#main div[id$='Block'] .tit.border .arrow4 .mdi {
	position: relative;
	top: 5px;
}

#main div[id$='Block'] .tit.border span.derecha {
	font-size: 11px;
	display: flex;
	display: -ms-flexbox;
}

#main div[id$='Block'] .tit.border span.derecha .mdi {
    margin-left: 5px;
}

#main .border.a .arrow3,
#main .border.a .arrow4,
#main .border.b .arrow3,
#main .border.b .arrow4,
#main .border.c .arrow3,
#main .border.c .arrow4,
#main .border.d .arrow3,
#main .border.d .arrow4,
#main .border.e .arrow3,
#main .border.e .arrow4,
#main .border.f .arrow3,
#main .border.f .arrow4,
#main .border.g .arrow3,
#main .border.g .arrow4,
#main .border.h .arrow3,
#main .border.h .arrow4 {
	margin: -5px 10px -5px 0px !important; /* Para grupo de casos la tabulación es superior*/
}

/* Estado Nuevo */

#main div[id$='Block'] .border.a .arrow3,
#main div[id$='Block'] .border.a .arrow4 {
	background: #7bdde5;
}

#main div[id$='Block'] .border.a.open {
	background: #d7f5f7 !important;
}

#main div[id$='Block'] .estado1 {
	color: #31a8b3;
}

/* Estado en progreso */

#main div[id$='Block'] .border.b .arrow3,
#main div[id$='Block'] .border.b .arrow4 {
	background: #abe760;
}

#main div[id$='Block'] .border.b.open {
	background: #e6f8cf !important;
}

#main div[id$='Block'] .estado2 {
	color: #6cad1c;
}

/* Estado en espera */

#main div[id$='Block'] .border.c .arrow3,
#main div[id$='Block'] .border.c .arrow4 {
	background: #e6d761;
}

#main div[id$='Block'] .border.c.open {
	background: #f7f3cf !important;
}

#main div[id$='Block'] .estado3 {
	color: #a2931d;
}

/* Estado cancelado */

#main div[id$='Block'] .border.d .arrow3,
#main div[id$='Block'] .border.d .arrow4 {
	background: #e16778 ;
}

#main div[id$='Block'] .border.d.open {
	background: #f6d1d6 !important;
}

#main div[id$='Block'] .estado4 {
	color: #9f2132;
}

/* Estado cerrado */

#main div[id$='Block'] .border.e .arrow3,
#main div[id$='Block'] .border.e .arrow4 {
	background: #b19572;
}

#main div[id$='Block'] .border.e.open {
	background: #e7dfd4 !important;
}

#main div[id$='Block'] .estado5 {
	color: #74552d;
}

/* Estado reabierto */

#main div[id$='Block'] .border.f .arrow3,
#main div[id$='Block'] .border.f .arrow4 {
	background: #81ade7;
}

#main div[id$='Block'] .border.f.open {
	background: #d9e6f8 !important;
}

#main div[id$='Block'] .estado6 {
	color: #3b73bc;
}

/* Estado validado */

#main div[id$='Block'] .border.g .arrow3,
#main div[id$='Block'] .border.g .arrow4 {
	background: #6dbe89;
}

#main div[id$='Block'] .border.g.open {
	background: #d3ebdb !important;
}

#main div[id$='Block'] .estado7 {
	color: #278948;
}

/* Estado pendiente */

#main div[id$='Block'] .border.h .arrow3,
#main div[id$='Block'] .border.h .arrow4 {
	background: #eaa05e;
}

#main div[id$='Block'] .border.h.open {
	background: #f9e2ce !important;
}

#main div[id$='Block'] .estado8 {
	color: #a75d1b;
}

/**/

#main fieldset.fieldesc {
	max-width: 680px;
}

/***************************************/
/*********** Treebuttons ***************/
/***************************************/

#main .treestatebuttons {
	margin: 10px 0 0 0;
	display: inline;
}

#main .treestatebuttons .states {
	float: left;
	margin: 0 25px 0 0;
}

#main .treestatebuttons .states label {
	display: block;
}

#main .treestatebuttons .states strong {
	text-transform: uppercase;
	float: left;
	margin: 5px 0 0 0;
}

#main .treestatebuttons .buttons {
	float: left;
}

#main .treestatebuttons .buttons label {
	display: block;
	margin: 0 0 5px 0;
}

/***************************************/
/*************** Yes/No ****************/
/***************************************/

.byn {
    cursor:pointer;
   padding-left: 4px !important;
   padding-right: 4px !important;
   padding-top: 2px !important;
   padding-bottom: 2px !important;
   border-radius: 3px;
   display: initial !important;
   color :black;
   background :white;
}

.byn.positive {
    cursor: pointer;
    background: #83d959 ;
   border-radius: 3px;
   color: white;
}

.byn.negative {
    cursor: pointer;
    background: #df4632 ;
   border-radius: 3px;
   color: white;
}

/* Panel lateral */

.ShowIfRightPanelIsOpen {
	display: none;
}

.rightPanel #flex_container {
	display: initial !important;
}

body.rightPanel #navbar .mdi-eye-off {
	display: block !important;
}

/***************************************/
/************ Interacción **************/
/***************************************/

.object_type_5 .new_interaction .tree label {
	width: 175px;
}

.object_type_5 #sub_interaction_list .user1,
.object_type_5 #sub_interaction_list .user2 {
	background: #fff;
}

.object_type_5 #sub_interaction_list .user1,
.object_type_5 #sub_interaction_list .user2 {
	margin: 0;
}

.object_type_5 #sub_interaction_list .user2 {
	width: 80%;
}

.object_type_5 #sub_interaction_list .user2 .tit {
	background: #ecf6fb;
}

.object_type_5 #sub_interaction_list .block .tit:nth-child(2) .message {
 text-decoration: underline;
 	font-family: 'Open Sans';
 	font-size: 13px;
 	font-weight: 600;
}

.object_type_5 .header_email p span.mini {
    font-style: normal !important;
    position: absolute;
    right: 20px;
}

/***************************************/
/************** Casos ******************/
/***************************************/

.object_type_1040 #main #main fieldset legend {
	text-transform: none;
}

.object_type_1040 #main #soluciones button {
	margin-right: 10px;
	font-size: 12px;
}

.object_type_1040 #main #lastSolutionInfo {
	background: #fff;
    margin-bottom: 10px;
    padding: 10px 17px;
	width: 95%;
	float: left;
}

.object_type_1040 #main #lastSolutionInfo p label,
.object_type_1040 #main #lastSolutionInfo p span {
	word-break: break-all;
}

.object_type_1040 #main #lastSolutionInfo center {
	padding-top: 15px;
	clear: both;
	width: 100%;
	float: left;
}

.object_type_1040 #main #soluciones legend label {
	cursor: pointer;
}

/* Lectura */

#main #read_only_cases,
#main #read_only_cases2,
#main #read_only_archive {
	cursor: url('../../images/pencil.png'), pointer;
}

.object_type_1040 #main table.table tr:first-child td {
	border: none;
}

.object_type_1040 #main {
	position: relative;
}

.object_type_1040 #text ul {
	margin: 0 0 0 30px;
	clear: both;
}

/* Escritura */

#main div[id^='editable_'] span p strong{
	word-break: break-all;
}

/***************************************/
/*************** Email *****************/
/***************************************/

.object_type_1056 #main fieldset.inline textarea {
	width: 555px;
	resize: none;
	height: 1px;
	padding: 4px !important;
	margin: 0 0 5px 0 !important;
}

.object_type_1056 #main fieldset.inline .subject {
	margin: 10px 0 0 0;
	padding: 10px 0 0 0;
	display: table-row;
}

.object_type_1056 #main fieldset.inline input#subject {
	width: 100%;
	margin: 0 0 5px 0 !important;
}

.object_type_1056 #main fieldset.inline .selectize-control {
	width: 530px;
}

.object_type_1056 #main fieldset.inline .cc_cco .cc_cco_links {
	float: right;
    margin: 33px -28px 0 0;
    position: absolute;
}

.object_type_1056 #main fieldset.inline .cc_cco .cc_cco_links a,
.object_type_1056 #main fieldset.inline .fromm .cco {
	font-size: 9px !important;
	cursor: pointer;
	display: block;
	line-height: 15px;
	margin-left: 10px;
}

.object_type_1056.detail .jmesa {
max-width: 575px !important;
margin: 0 auto;
}

body.maximize.object_type_1056 .jmesa {
max-width: 100% !important;
margin: 0;
}

/***************************************/
/***** Base de datos de conocimiento ***/
/***************************************/

.object_type_1087 .cke_toolbar .cke_voice_label {
	display: inline;
	float: left !important;
	width: 100%;
	white-space: normal;
}

.object_type_1087 .cke_skin_isyc .cke_toolbar {
	padding-top: 1px;
	padding-bottom: 1px;
	display: inline-block;
	float: left !important;
	width: 100%;
	white-space: normal;
}

.object_type_1087 .cke_skin_isyc .cke_toolbar_start {
	display: none;
}

.object_type_1087 .cke_skin_isyc .cke_toolgroup {
	display: none;
}

.object_type_1087 table#KNOWLEDGEBASE tr.header {
	display: none;
}

.object_type_1087 table#KNOWLEDGEBASE .highlight td {
	border: 0;
}

.object_type_1087 table#KNOWLEDGEBASE .even td,
.object_type_1087 table#KNOWLEDGEBASE .odd td {
	border: 0;
	padding: 4px;
	background-color: #eee;
}

/***************************************/
/************** Archivo ****************/
/***************************************/

.object_type_1002 .jmesa .tbody td table {
	border-spacing: 0;
}

.object_type_1002 .jmesa .tbody td table td {
	padding: 1px;
	border: 0;
	white-space: nowrap;
}

#upload_archive_from_pc .mdi.mdi-desktop-mac,
#upload_archive_from_pc .mdi.mdi-power,
#select_archive_from_oncustomer .mdi.mdi-desktop-mac,
#select_archive_from_oncustomer .mdi.mdi-power {
	background-color: transparent;
}

#upload_archive_from_pc .mdi.mdi-desktop-mac:hover,
#upload_archive_from_pc .mdi.mdi-power:hover,
#select_archive_from_oncustomer .mdi.mdi-desktop-mac:hover,
#select_archive_from_oncustomer .mdi.mdi-power:hover {
	background-color: transparent;
}

/***************************************/
/************ Tipología ****************/
/***************************************/

.object_type_pdf .container .mdi,
.object_type_pdf .container .mdi.info,
.object_type_pdf .container .mdi.info:hover {
	font-size: 20px;
	vertical-align: middle;	
}

.object_type_pdf .popup {
	float: left;
	width: 55%;
	height: 100%;
	padding: 0;
	margin: 0;
}

.object_type_pdf .pdf {
	float: right;
	width: 45%;
	height: 100%;
}

.object_type_pdf .derecha {
	float: right;
	margin-left: 10px !important;
}

.object_type_pdf .container {
	width: 100%;
}

.object_type_pdf .bg1 {
	background-color: #474747 !important;
	box-shadow: inset 1px 0 0 hsla(0, 0%, 100%, .08), inset 0 1px 1px hsla(0, 0%, 0%, .15), inset 0 -1px 0 hsla(0, 0%, 100%, .05), 0 1px 0 hsla(0, 0%, 0%, .15), 0 1px 1px hsla(0, 0%, 0%, .1);
	color: #fff;
	position: fixed;
	width: calc(55% - 35px) !important;
	z-index: 99;
    padding: 5px 10px !important;
    color: #d9d9d9;
}

.object_type_pdf .bg1 .mdi {
    color: #e1e1e1 !important;
	float: right;
	margin-right: 5px;
	padding: 2px 3px;
}

.object_type_pdf .bg1 .mdi:hover {
	padding: 1px 2px;
    background-color: hsla(0, 0%, 0%, .12);
    background-image: linear-gradient(hsla(0, 0%, 100%, .05), hsla(0, 0%, 100%, 0));
    background-clip: padding-box;
    border: 1px solid hsla(0, 0%, 0%, .35);
    border-color: hsla(0, 0%, 0%, .32) hsla(0, 0%, 0%, .38) hsla(0, 0%, 0%, .42);
    box-shadow: 0 1px 0 hsla(0, 0%, 100%, .05) inset, 0 0 1px hsla(0, 0%, 100%, .15) inset, 0 1px 0 hsla(0, 0%, 100%, .05);
}

.object_type_pdf .bg1:nth-child(odd) {
	background-color: #ddd;
}

.object_type_pdf .bg1 a {
	color: #fff;
}

.object_type_pdf .bg1 p:not(.icons) {
    padding: 0 !important;
    font-size: inherit;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
	width: 90%;
}

.object_type_pdf .bg1 p.icons {
    width: 80px;
    position: absolute;
    float: right !important;
    top: 0;
    right: 0;
    z-index: 1;
}

.object_type_pdf [id^=pdf_title][id$="Block"] {
	margin: 0 15px;
}

.object_type_pdf #main [id^=pdf_title][id$="Block"]>.block>div.tit.border{
    text-align: justify;
    position: relative;
    width: 100%;
    padding-left: 4%;
    padding-right: 5.8%;
    line-height: 22px;
}

.object_type_pdf #main [id^=pdf_title][id*="Block"]>.block>div.tit.border .arrow3,
.object_type_pdf #main [id^=pdf_title][id*="Block"]>.block>div.tit.border .arrow4{
    margin: 0;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 20px;
    padding: 0 5px;
}

.object_type_pdf #main [id^=pdf_title][id*="Block"]>.block>div.tit.border span.derecha {
    position: absolute;
    top: 0;
    padding-top: 5px;
    right: 0;
    height: 95%;
    margin-right: 5px;
    font-size: 11px;
}

.object_type_pdf [id^=pdf_title] .block {
	padding-left: 0 !important;
}

.object_type_pdf [id^=pdf_title] #status .derecha {
	margin-right: 0 !important;
}

.object_type_pdf [id^=pdf_title] #status strong, /* Compartido también para el objeto "Archivo" */
.object_type_1002 #status strong {
	background: #eee;
	padding: 2px 10px;
	color: #333;
}

.object_type_pdf #pdf_titleBlock .border {
	background: #858585 !important;
	padding: 12px 0;
	line-height: 17px;
}

.object_type_pdf #pdf_titleBlock .border .arrow3,
.object_type_pdf #pdf_titleBlock .border .arrow4 {
	color: #fff;
}

.object_type_pdf #pdf_title .border .arrow3,
.object_type_pdf #pdf_title .border .arrow4 {
	color: #4d4d4d;
}

.object_type_pdf  #pdf_titleBlock .border a {
	color: #fff;
}

.object_type_pdf [id^=pdf_title] .border span.derecha .mdi {
	color: #939292 !important;
}

.object_type_pdf [id^=pdf_title] .border span.derecha .mdi:hover {
	color: #000 !important;
}

.object_type_pdf [id^=pdf_title] fieldset .scroll {
	width: 100% !important;
}

.object_type_pdf #pdf_title fieldset {
	padding: 0 !important;
}

.object_type_pdf #pdf_title fieldset.bg2.data {
	border-right: 0;
	border-left: 0;
	width: 95%;
	margin: 0 auto;
}

.object_type_pdf #pdf_title .border {
	background: #fff !important;
	border-left: 0;
	border-right: 0;
	border-style: dashed;
}

.object_type_pdf #tipologyBlock .border {
	border-top: 0;
}

.object_type_pdf  #pdf_title .border a {
	color: #000 !important;
}

.object_type_pdf .file {
	float: left;
	margin-left: 25px;
	height: 30px;
	line-height: 30px !important;
	clear: both;
	font-weight: bold;
    width: calc(100% - 50px);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.object_type_pdf ul {
	clear: both;
}

.object_type_pdf ul.docs li {
	float: left;
	clear: both;
	margin: 0 0 0 65px;
	list-style: none;
	padding: 0 0 0 10px;
}

.object_type_pdf ul.docs li:before {
	font-size: 16px;
    content: "- ";
}

.object_type_pdf #pdf_dataBlock {
	width: 95%;
	margin: 0 auto;
}

.object_type_pdf #main fieldset .counter {
	float: left;
}

.object_type_pdf #main .scroll {
	width: 100%;
}

.object_type_pdf #main fieldset .scroll {
	width: 100%;
}

.object_type_pdf #main table td input[type="text"].autofillCellLocator,
#main fieldset input[type="text"].autofillCellLocator {
	width: calc(100% - 110px);
}

.object_type_pdf #main table td input[type="text"].autofillCell,
#main fieldset input[type="text"].autofillCell {
	width: 100%;
}

.object_type_pdf #main fieldset select.size8 {
	width: 100%;
}

.object_type_pdf #main fieldset textarea.size12 {
	width: 100%;
}

.object_type_pdf #main fieldset .counter {
	width: 100%;
}

.object_type_pdf #main table td.simpleParam {
	text-align: right !important;
	width: 1%;
	white-space: nowrap;
}

.object_type_pdf #main table td.multiParam {
	width: 100%;
	white-space: nowrap;
}

.object_type_pdf .border .derecha {
	float: right;
	margin-right: 10px;
}

.object_type_pdf .border .derecha  a.clickArchive {
	color: #858585 !important;
	line-height: 21px;
	padding: 0 10px;
	font-weight: bold;
	font-size: 14px;
}

.object_type_pdf #esquema {
	display: none;
	margin: 10px 0 0 0;
}

.object_type_pdf #status {
	float: right;
	margin: 10px 10px 0 0;
}

.object_type_pdf #tipologyBlock .border .derecha {
	background: #fff;
	padding-top: 0;
	margin: -3px 10px 0 0 !important;
}

.object_type_pdf #tree1 {
	margin: 25px 0 0 25px;
}

.object_type_pdf #pdf_title fieldset.bg2.data {
	border: 0;
}

.object_type_pdf .ztree2 {
	float: left;
}

.object_type_pdf #tipology0Block .border {
	border-bottom: 0;
}

.object_type_pdf #analyze {
	padding: 12px 0 20px 0;
	float:left;
}

.object_type_pdf #status {
	padding: 5px 0 18px 0;
	float:right;
}

.object_type_pdf #analyze .size1 {
	width: 30px;
}

.object_type_pdf #verify {
	background: #858585;
	color: #fff;
	font-weight: bold;
	padding: 4px;
	border-radius: 5px;
}

.object_type_pdf #verify:hover {
	background: #4e4e4e;
}

/***************************************/
/************** Tarea ******************/
/***************************************/

body.object_type_11 #related_object_related_object_name_value.size5 {
	width: 210px;
}

.object_type_11 #eventContent fieldset .float {
	float: left;
	margin: 0 30px 0 0;
}

.object_type_11 #eventContent fieldset p {
	display: block;
	margin: 0 0 10px 0;
}

/***************************************/
/*************** Vistas ****************/
/***************************************/

.object_type_1042 .fixed:not(#menu_tabs, #header_object, #main, #sidebar) {
	position: fixed;
	display: none;
	top: 0;
	border-spacing: 0;
	z-index: 666;
}

.object_type_1042 #ROLEVIEW td .mdi:not(.disabled) {
	cursor: pointer;
}

/***************************************/
/**************** BPM ******************/
/***************************************/

.object_type_1123 #modeler,
.object_type_1258 #modeler {
	width: 100% !important;
	height: 870px !important;
}

.object_type_1123 #canvas,
.object_type_1258 #canvas {
	width: 100% !important;
	height: 870px !important;
	float: left;
}

.object_type_1123 .combo,
.object_type_1258 .combo {
	padding: 10px 0 10px 0;
}

.object_type_1123 .sit_on_top,
.object_type_1258 .sit_on_top {
	z-index: 1000;
}

.object_type_1123 .dialog,
.object_type_1258 .dialog {
	position: fixed;
	padding-top: 100px;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0, 0, 0, 0.4);
}

.object_type_1123 .dialogHeader,
.object_type_1258 .dialogHeader {
	background-color: #bbb;
	font-size: 14px;
	color: white;
	margin: auto;
	padding: 10px 20px;
	width: 395px;
}

.object_type_1123 .dialogContent,
.object_type_1258 .dialogContent {
	background-color: #fefefe;
	margin: auto;
	padding: 20px;
	width: 395px;
}

.object_type_1123 #deployDialogContent p,
.object_type_1258 #deployDialogContent p {
	padding: 10px 0;
}

.object_type_1130 #canvas {
	width: 100% !important;
	height: 600px !important;
	float: left;
}

.object_type_1123 tr td:last-child .mdi-check-circle,
.object_type_1123 tr td:last-child .mdi-close-circle,
.object_type_1258 tr td:last-child .mdi-close-circle,
.object_type_1258 tr td:last-child .mdi-close-circle {
	cursor:pointer;
}

.object_type_1123 .bpmZoomPosition,
.object_type_1130 .bpmZoomPosition,
.object_type_1258 .bpmZoomPosition {
    position: absolute;
    top: 20px;
    right: 25px;
	background: #FAFAFA;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
	padding: 2px 8px;
	border: solid 1px #CCC;
}

.object_type_1123 .bpmZoomPosition .mdi,
.object_type_1130 .bpmZoomPosition .mdi,
.object_type_1258 .bpmZoomPosition .mdi {
    font-size: 25px;
    margin-right: 10px;
}

/***************************************/
/************ Proyectos ****************/
/***************************************/

.projects fieldset {
	padding: 0 15px !important;
}

.projects fieldset:last-child {
	padding-right: 0 !important;
}

.projects fieldset:first-child {
	padding-left: 0 !important;
}

.projects fieldset label {
	white-space: no-wrap;
}

.projects fieldset .total {
	background: #eaf7ff;
	padding: 2px 0 0 10px;
}

.projects.cols2 fieldset {
	width: 46% !important;
}

.projects.cols2 fieldset:nth-child(2){
	border-right: 0 !important;
}

/***************************************/
/************ Comparador ***************/
/***************************************/

.popUpHtmlElementCompare,
.popUpHtmlBodyElementCompare {
    width: 100%;
    height: 100%;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

iframe[class="popUpIframeElementCompare"] {
    width: calc(50% - 5px);
    height: calc(100% - 5px);
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

.popUpIframeElementCompare #header_container,
.popUpIframeElementCompare #navbar,
.popUpIframeElementCompare #menu_tabs,
.popUpIframeElementCompare .icons {
    display: none;
}

/***************************************/
/**************** Bot  *****************/
/***************************************/

body .ico_chat {
	bottom: 16px;
	right: 16px;
	position: fixed;
	background-color: #2aa7de;
	color: #fff !important;
	font-size: 32px;
	border-radius: 50%;
	padding: 7px 13px;
	z-index: 1;
	opacity: .6;
	border: 3px solid #fff;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
    transition: all 0.5s ease;
}

body .ico_chat:hover {
	opacity: 1;
	transform: translate3d(0, -5px, 0);
}

body .ico_chat.space {
	right: 55px;
}

/***************************************/
/************** Switch *****************/
/***************************************/

.switch {
  position: relative;
  display: inline-block !important; /* Para la visualización correcta en fieldset inline */
  width: 55px;
  height: 22px;
  padding: 0 !important; /* Para la visualización correcta en fieldset inline */
 }

 .switch * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
 }

.switch input {
	display:none;
}

.switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #929292;
  -webkit-transition: .4s;
  transition: .4s;
}

.switch .slider:hover {
	background-color: #7c7c7c;
}

.switch .slider:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

.switch input:checked + .slider {
  background-color: #42a4d1;
}

.switch input:checked + .slider:hover {
  background-color: #3695c1;
}

.switch input:checked + .slider:before {
  -webkit-transform: translateX(33px);
  -ms-transform: translateX(33px);
  transform: translateX(33px);
}

.switch .on {
  display: none;
}

.switch .on,
.switch .off {
  color: white;
  position: absolute;
  transform: translate(-50%,-50%);
  top: 44%;
  font-size: 11px;
  font-family: Verdana, sans-serif;
  user-select: none;
}

.switch .on {
  left: 32%;
}

.switch .off {
  left: 62%;
}

.switch input:checked+ .slider .on {
	display: block;
}

.switch input:checked + .slider .off {
	display: none;
}

.switch .slider.round {
  border-radius: 34px;
}

.switch .slider.round:before {
  border-radius: 50%;
}

.switch.readonly {
    pointer-events: none;
    opacity: 0.5;
}

/***************************************/
/************ Datatables ***************/
/***************************************/

table.dataTable thead th input[type="text"] {
    width: 100%;
}

label.dataTable_title {
    position: absolute;
    margin: 7px 0 0 0;
}

/***************************************/
/************** Checks *****************/
/***************************************/

.status0 {
	background-color: #efefef;
	color: #6a6a6a;
	border: 1px solid #cbcbcb;
	padding: 3px 10px 3px 0 !important;
	margin: 0 20px 0 0;
}

.status0:before {
	font: 17px "Material Design Icons";
	content: "\f2d7";
	float: left;
	margin: 2px 5px 0 10px;
}

.status1 {
	background-color: #e0f2cb;
	color: #4b6d21;
	border: 1px solid #ccebac;
	padding: 3px 10px 3px 0 !important;
	margin: 0 20px 0 0;
}

.status1:before {
	font: 17px "Material Design Icons";
	content: "\f133";
	float: left;
	margin: 2px 5px 0 10px;
}

.status2 {
	background-color: #fdd3c7;
	color: #a22525;
	border: 1px solid #efb6a7;
	padding: 3px 10px 3px 0 !important;
	margin: 0 20px 0 0;
}

.status2:before {
	font: 17px "Material Design Icons";
	content: "\f028";
	float: left;
	margin: 2px 5px 0 10px;
}

.status3 {
	background-color: #fffccc;
	color: #4d4b42;
	border: 1px solid #f8e3ac;
	padding: 3px 10px 3px 0 !important;
	margin: 0 20px 0 0;
}

.status3:before {
	font: 17px "Material Design Icons";
	content: "\f542";
	float: left;
	margin: 2px 5px 0 10px;
}

.data_validation.status0 {
	background-color: #d0eefc;
    color: #17485e;
    border: 1px solid #a3cbdc;
	padding: 3px 10px 3px 0 !important;
	margin: 0 20px 0 0;
}

.data_validation.status0:before {
	font: 17px "Material Design Icons";
	content: "\f2d7";
	float: left;
	margin: 2px 5px 0 10px;
}

.data_validation.status1 {
	background-color: #e0f2cb;
	color: #4b6d21;
	border: 1px solid #ccebac;
	padding: 3px 0 3px 0 !important;
	margin: 0 20px 0 0;
}

.data_validation.status1:before {
	font: 17px "Material Design Icons";
	content: "\f133";
	float: left;
	margin: 2px 5px 0 10px;
}

.data_validation.status2 {
	background-color: #fdd3c7;
	color: #a22525;
	border: 1px solid #efb6a7;
	padding: 3px 0 3px 0 !important;
	margin: 0 20px 0 0;
}

.data_validation.status2:before {
	font: 17px "Material Design Icons";
	content: "\f028";
	float: left;
	margin: 2px 5px 0 10px;
}

.data_validation.status3 {
	background-color: #efefef;
	color: #6a6a6a;
	border: 1px solid #cbcbcb;
	padding: 3px 0 3px 0 !important;
	margin: 0 20px 0 0;
}

.data_validation.status3:before {
	font: 17px "Material Design Icons";
	content: "\f7fb";
	float: left;
	margin: 2px 5px 0 10px;
}

.status0, .status1, .status2, .status3 {
	margin: 0px 10px 10px 0 !important;
	width: 107px;
}

.status0.hover:hover {
	background: #e2e2e2;
}

.status1.hover:hover {
	background: #ccdeb6;
}

.status2.hover:hover {
	background: #eebeb0;
}

.status3.hover:hover {
	background: #efecc4;
}

.data_validation.status0.hover:hover {
	background: #c0e3f3;
}

.data_validation.status1.hover:hover {
	background: #ccdeb6;
}

.data_validation.status2.hover:hover {
	background: #eebeb0;
}

.data_validation.status3.hover:hover {
	background: #e2e2e2;
}

.data_validation_container .size2 {
	width: 85px !important;
	margin-bottom: 10px;
	display: inline-block;
	padding-right: 37px;
}

/* Token */	

.token-selector {
    box-sizing: border-box !important;
    padding: 10px !important;
    cursor:pointer !important;
    border-radius: 4px !important;
    margin-bottom: 10px !important;
}

/***************************************/
/*********** Full screen ***************/
/***************************************/

.fullscreen .container,
.fullscreen #content {
    width: 100%;
}

/***************************************/
/************** Steps ******************/
/***************************************/

.steps {
  border-collapse: separate;
  display: table;
  margin-left: 0px;
  position: relative;
  table-layout: fixed;
  text-align: center;
  vertical-align: middle;
  padding-left: 0;
  padding-top: 20px;
  width: 100%;
}

.steps li {
  display: table-cell;
  position: relative;
  float: none;
  padding: 0;
  width: 1%;
}

.steps li:after {
  background-color: #e0e0e0;
  content: "";
  display: block;
  height: 2px;
  position: absolute;
  width: 100%;
  top: 32px;
}

.steps li .step .mdi:before {
	color: #aaa;
	font-size: 30px;
}

.steps li:after {
	left: 50%;
}

.steps li:last-child:after {
	display: none;
}

.steps li.active .step {
	border: 2px solid #68b0d3;
	background: #8dcdec !important;
}

.steps li.active .caption {
	color: #42a4d1;	
}

.steps li.active .step .mdi:before {
	color: #fff;
}

.steps li.active .caption {
	color: #4388a9;
}
	
.steps li.disabled .step {
	border: 2px solid #cdcdcd;
	background: #e0e0e0 !important;
}

.steps li.disabled .step .mdi:before {
	color: #717171;
}

.steps li.disabled .caption {
	color:#333;
}

.steps li.disabled .step a:hover {
	background: #d4d4d4 !important;
}

.steps li.active .step a:hover {
	background: #7dbddc !important;
}

.steps li .step a:hover {
	background: #f2f2f2 !important;
}

.steps li .step a {
	height: 60px;	
    width: 60px;
	border-radius: 50%;
	display: block;	
}

.steps .step {
	background-color: #fff;
	border-radius: 50%;
	border: 2px solid #e0e0e0;
	color: #eee;
	font-size: 24px;
	height: 64px;
	line-height: 61px;
	margin: 0 auto;
	position: relative;
	width: 64px;
	z-index: 1;
}

.steps .caption {
	color: #aaa;
	padding: 11px 16px;
	text-align: center;	
}

.steps.vertical li {
	display: table;	
}

.steps.vertical {
	display: inline-table;
	width: calc(100% - 64px);
}
	
.steps.vertical li {
	display: inherit;
	width: 100%;
}
	
.steps.vertical .caption {
	position: absolute;
	left: calc(50% + 30px);
	top: 30px;
	margin: 10px 0 0 15px;
	padding: 0;
	width: auto;
	text-align: left;
}
	
.steps.vertical .step {
	margin: 15px auto;
}
	
.steps.vertical li::after {
	width: 1px;
	height: 100px;
}	

/***************************************/
/************** Notas ******************/
/***************************************/

.notes #fieldset {
	max-height: 432px !important;
	height: auto;
}

.highlighter {
   animation: fadeoutBg 3s;
}

@keyframes fadeoutBg {
   from { background-color: #fff3cd; }
   to { background-color: #fff; }
}

/***************************************/
/************ Valoración ***************/
/***************************************/

.rating {
  float:left;
}

.rating:not(:checked) > input {
    position:absolute;
    top:-9999px;
    clip:rect(0,0,0,0);
}

.rating:not(:checked) > label {
    float:right;
    width:1em;
    /* padding:0 .1em; */
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    font-size:160%;
    /* line-height:1.2; */
    color:#ddd;
}

.rating:not(:checked) > label:before {
    content: '★ ';
}

.rating > input:checked ~ label {
    color: dodgerblue;

}

.rating:not(:checked) > label:hover,
.rating:not(:checked) > label:hover ~ label {
    color: dodgerblue;

}

.rating > input:checked + label:hover,
.rating > input:checked + label:hover ~ label,
.rating > input:checked ~ label:hover,
.rating > input:checked ~ label:hover ~ label,
.rating > label:hover ~ input:checked ~ label {
    color: dodgerblue;

}

.rating > label:active {
    position:relative;
    top:2px;
    left:2px;
}

/***************************************/
/*********** Split screen **************/
/***************************************/

.splitScreenContainer {
    display: flex;
    flex-direction: row;
    height: 100%;
    width: 100%;
}

.splitScreenArchivesContainer,
.splitScreenViewerContainer {
    box-sizing: border-box;
}

.splitScreenArchivesContainer {
    background: #fff;
    overflow-x: auto;
    overflow-y: auto;
    position:relative;
    float:left;
    height:100%;
    width:55%;
}

.splitScreenHandler {
    width: 9px;
    height: 100%;
    padding: 0;
    cursor: ew-resize;
}

.splitScreenHandler::before {
    content: '';
    display: block;
    width: 9px;
    height: 100%;
    background: #474747;
    margin: 0 auto;
}

.splitScreenViewerContainer {
    flex: 1;
}