﻿/*
 _____   _____        ___  ___   _____   _____   _____    _____
/  ___| |  _  \      /   |/   | /  ___| /  _  \ |  _  \  | ____|
| |     | |_| |     / /|   /| | | |     | | | | | |_| |  | |__
| |     |  _  /    / / |__/ | | | |     | | | | |  _  /  |  __|
| |___  | | \ \   / /       | | | |___  | |_| | | | \ \  | |___
\_____| |_|  \_\ /_/        |_| \_____| \_____/ |_|  \_\ |_____|

Hoja principal de estilo de onCustomer.
URL de referencia: corecss.isyc.com

*/

/******************* Estilos generales **********************/

@import "fonts/materialdesignicons.css";
@import "fonts/font-opensans.css";
@import "fonts/font-robotocondensed.css";
@import 'print.css') print;
@import "fonts.css";

* {
	margin: 0;
	padding: 0;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

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;
	background: inherit no-repeat;
	text-decoration: none;
}

a:hover {
	color: #7bc6e9;
	background: inherit no-repeat;
	text-decoration: none;
}

.float_left {
	float: left;
}

.float_right {
	float: right;
}

.float_center { /* No uso .center pq lo usa jmesa y rompe todo */
	text-align: center;
	display: block;
}

.align-top {
  vertical-align: top;
}

.align-middle {
  vertical-align: middle;
}

.align-bottom {
  vertical-align: bottom;
}

.hide {
	display: none;
}

.pointer {
	cursor: pointer;
}

.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;
}
.touchable{
    -webkit-touch-callout: auto;
    -webkit-user-select: auto;
    -khtml-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
    pointer-events: auto;
}

/* Display */


.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-inline-flex {
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
}

/* Spacing */

.m-0 {
  margin: 0 !important;
}

.mt-0,
.my-0 {
  margin-top: 0 !important;
}

.mr-0,
.mx-0 {
  margin-right: 0 !important;
}

.mb-0,
.my-0 {
  margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
  margin-left: 0 !important;
}

.m-1 {
  margin: 0.25rem !important;
}

.mt-1,
.my-1 {
  margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
  margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
  margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
  margin-left: 0.25rem !important;
}

.m-2 {
  margin: 0.5rem !important;
}

.mt-2,
.my-2 {
  margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
  margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
  margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
  margin-left: 0.5rem !important;
}

.m-3 {
  margin: 1rem !important;
}

.mt-3,
.my-3 {
  margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
  margin-right: 1rem !important;
}

.mb-3,
.my-3 {
  margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
  margin-left: 1rem !important;
}

.m-4 {
  margin: 1.5rem !important;
}

.mt-4,
.my-4 {
  margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
  margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
  margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
  margin-left: 1.5rem !important;
}

.m-5 {
  margin: 3rem !important;
}

.mt-5,
.my-5 {
  margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
  margin-right: 3rem !important;
}

.mb-5,
.my-5 {
  margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
  margin-left: 3rem !important;
}

.p-0 {
  padding: 0 !important;
}

.pt-0,
.py-0 {
  padding-top: 0 !important;
}

.pr-0,
.px-0 {
  padding-right: 0 !important;
}

.pb-0,
.py-0 {
  padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
  padding-left: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.pt-1,
.py-1 {
  padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
  padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
  padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
  padding-left: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.pt-2,
.py-2 {
  padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
  padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
  padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
  padding-left: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.pt-3,
.py-3 {
  padding-top: 1rem !important;
}

.pr-3,
.px-3 {
  padding-right: 1rem !important;
}

.pb-3,
.py-3 {
  padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
  padding-left: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.pt-4,
.py-4 {
  padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
  padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
  padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
  padding-left: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.pt-5,
.py-5 {
  padding-top: 3rem !important;
}

.pr-5,
.px-5 {
  padding-right: 3rem !important;
}

.pb-5,
.py-5 {
  padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
  padding-left: 3rem !important;
}

.m-auto {
  margin: auto !important;
}

.mt-auto,
.my-auto {
  margin-top: auto !important;
}

.mr-auto,
.mx-auto {
  margin-right: auto !important;
}

.mb-auto,
.my-auto {
  margin-bottom: auto !important;
}

.ml-auto,
.mx-auto {
  margin-left: auto !important;
}

/* End spacing */

hr {
	border-right: 0;
	border-left: 0;
	border-top: 0;
	border-bottom: 1px dotted #ccc;
}

h2,
h3,
h4 {
	font-weight: normal;
	margin-bottom: 5px;
}

h2 {
	font-size: 21px;
	color: #666;
	font-family: 'roboto_condensedregular';
}

h2 span {
	font-size: 15px;
	color: #666;
    font-family: 'robotolight';
	margin-left: 5px;
}

h2.ico .mdi,
h3.ico .mdi,
h4.ico .mdi {
    border-radius: 50%;
    background: #7bc6e9;
    color: #fff !important;
    display: inline-block;
    margin: 0px 5px 0 0;
}

h2.bg2.ico .mdi,
h3.bg2.ico .mdi,
h4.bg2.ico .mdi  {
    background: #d2d2d2;
	color: #888 !important;
}

h2.ico .mdi {
    font-size: inherit;
	min-width: 36px;
	height: 36px;
	line-height: 36px;
	text-align: center;
}

h3.ico .mdi {
    font-size: 17px;
	min-width: 28px;
	line-height: 28px;
	text-align: center;
}

h4.ico .mdi {
    font-size: 13px;
	min-width: 22px;
	line-height: 22px;
	text-align: center;
}

h2.sep,
h3.sep,
h4.sep {
	border-bottom: 1px solid #ccc;
	padding-bottom: 2px;
	margin-bottom: 7px;
}

h2.sep.line1-color::after,
h3.sep.line1-color::after,
h4.sep.line1-color::after {
    content: "";
    display: block;
    position: relative;
    left: 0;
    bottom: -4px;
    width: 20%;
    height: 3px;
    background: #7bc6e9;
}

h2.sep.line2-color,
h3.sep.line2-color,
h4.sep.line2-color {
	border-bottom: 1px solid #7bc6e9
}

h2.color,
h3.color,
h4.color {
	color: #42a4d1;
	border-bottom: 1px solid #7bc6e9;
}

h2.bg1,
h3.bg1,
h4.bg1 {
	background: #7bc6e9;
	color: #fff;
}

h2.bg2,
h3.bg2,
h4.bg2 {
	background: #f5f5f5;
	color: #888;
}

h2.bg1,
h3.bg1,
h4.bg1,
h2.bg2,
h3.bg2,
h4.bg2 {
	width: 100%;
	padding: 5px 10px;
	box-sizing: border-box;
}

h3 {
	font-size: 19px;
	color: #666;
    font-family: 'roboto_condensedregular';
}

h3 span {
	font-size: 14px;
	color: #666;
    font-family: 'robotolight';
	margin-left: 5px;
}

h4 {
	font-size: 17px;
	color: #666;
	font-family: 'roboto_condensedregular';
}

h4 span {
	font-size: 13px;
	color: #666;
    font-family: 'robotolight';
	margin-left: 5px;
}

h2 .float_right,
h3 .float_right,
h4 .float_right {
	font-size: 12px;
}

h2.bg1 .float_right,
h3.bg1 .float_right,
h4.bg1 .float_right {
	color: #fff;
	font-size: 12px;
}

h2.bg2 .float_right,
h3.bg2 .float_right,
h4.bg2 .float_right {
	font-size: 12px;
}

pre {
	font-family: inherit;
	white-space: pre-wrap;
 	word-wrap: break-word;
}

.nowrap {
	white-space: nowrap;
}

input[type="text"],
input[type="name"],
input[type="number"],
input[type="address"],
input[type="email"],
input[type="password"],
textarea,
select {
	border: 1px solid #c1c1c1;
	color: #373737;
	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:focus[type="text"],
input:focus[type="name"],
input:focus[type="number"],
input:focus[type="address"],
input:focus[type="email"],
input:focus[type="password"],
textarea:focus,
select:focus {
	border: 1px solid #aaa;
}

input[type="text"].readonly,
input[type="text"]:disabled,
input[type="name"].readonly,
input[type="name"]:disabled,
input[type="number"].readonly,
input[type="number"]:disabled,
input[type="address"].readonly,
input[type="address"]:disabled,
input[type="email"].readonly,
input[type="email"]:disabled,
input[type="password"].readonly,
input[type="password"]:disabled,
textarea.readonly,
textarea:disabled,
select.readonly,
select:disabled {
	background: #eee;
	border: 0;
	cursor: default;
	border: 0;
    text-indent: 1px;
    text-overflow: '';
}

select.readonly,
select:disabled {
    -webkit-appearance: none;
    -moz-appearance: none;
	padding: 4px 5px !important; /* El SELECT disabled en Chrome necesita 1px más */		
}

@-moz-document url-prefix() { /* FF HACK */
select.readonly,
select:disabled {
	padding: 3px 5px !important;
}
}

textarea {
	padding: 5px;
	box-sizing: border-box;
	resize: vertical; /* A petición de un cliente. */
	width: 100%;
}

/* Iconos (El important es para sobreescribir los class="info") de los fieldsets deplegables */

.mdi { /* Para que los MDI funcionen dentro de los popups, el path no debe de incluir el div #content */
	font-size: 20px;
	color: #939292;
	vertical-align: middle;
}

.mdi:hover {
	  color: #000;
}

.mdi.light-blue {
	color: #b0def4 !important;
}

.mdi.blue {
	color: #68bde5 !important;
}

.mdi.dark-blue {
	color: #408fcb !important;
}

.mdi.light-green {
	color: #abe760 !important;
}

.mdi.green {
	color: #6dbe89 !important;
}

.mdi.dark-green {
	color: #3a9359 !important;
}

.mdi.light-yellow {
	color: #f1e9a7 !important;
}

.mdi.yellow {
	color: #e6d761 !important;
}

.mdi.dark-yellow {
	color: #cfbe3b !important;
}

.mdi.light-orange {
	color: #ecba8e !important;
}

.mdi.orange {
	color: #eaa05e !important;
}

.mdi.dark-orange {
	color: #d5853d !important;
}

.mdi.light-red {
	color: #ef8795 !important;
}

.mdi.red {
	color: #e16778 !important;
}

.mdi.dark-red {
	color: #c24355 !important;
}

.mdi.light-brown {
	color: #d1bfaa !important;
}

.mdi.brown {
	color: #b19572 !important;
}

.mdi.dark-brown {
	color: #8e6e45 !important;
}

.mdi.light-pink {
	color: #ed9edb !important;
}

.mdi.pink {
	color: #dc6dc3 !important;
}

.mdi.dark-pink {
	color: #ae3292 !important;
}

.mdi.light-purple {
	color: #ae9dcf !important;
}

.mdi.purple {
	color: #846db4 !important;
}

.mdi.dark-purple {
	color: #5b3b9c !important;
}

.mdi.light-grey {
	color: #dadada !important;
}

.mdi.grey {
	color: #c0c0c0 !important;
}

.mdi.dark-grey {
	color: #7c7c7c !important
}

.mdi.white {
	color: #ffffff !important;
	text-shadow: 0px 0px 2px #767676, 0px 0px 2px #767676, 0px 0px 1px #767676;
}

.mdi.black {
	color: #000 !important;
}

mark {
	background-color: #faef65;
	color: #000;
	padding: .15em .5em;
	font-weight: bold;
}

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;
}

.mdi.info, /* Iconos de info solo en la parte central. No menú. No sidebar. No cabecera. No Navbar. */
.mdi.info:hover{
    color: #9cd0e7;
}

.mdi.opacity{
	opacity: 0.5;
}

.mdi.opacity:hover {
	opacity: 1;
}

.mdi[class*="flip"]{
    display: inline-block;
}

.mdi.flip-horizontal{
    transform: scale(-1, 1);
}

.mdi.flip-vertical{
    transform: scale(1, -1);
}

.mdi[class*="rotate"]{
    display: inline-block;
}

.mdi.rotate90{
    transform: rotate(90deg);
}

.mdi.rotate180{
    transform: rotate(180deg);
}

.mdi.rotate270{
    transform: rotate(270deg);
}

.mdi.outline {
	text-shadow: 0px 0px 2px #000, 0px 0px 2px #000, 0px 0px 1px #000;
}

/******************* Login **********************/

#login_contenedor {
	background: #ececec;
}

#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 #caja .campos {
	padding: 50px 0 20px 0;
	box-sizing: content-box;
}

#login_contenedor #caja .campos p {
	line-height: 19px;
	padding: 0 0 0 0;
}

#login_contenedor #caja .campos p.error {
	color: #c10003;
	font-size: 12px;
}

#login_contenedor #caja .campos p.session {
	color: #363636;
	font-size: 12px;
}

#login_contenedor #caja .campos form p {
	clear: both;
	margin: 0 0 15px 0;
}

#login_contenedor #caja .campos form fieldset {
	padding: 1em;
	font: 80%/1 sans-serif;
}

#login_contenedor #caja .campos form label {
	float: left;
	width: 80px;
	margin-right: 10px;
	text-align: right;
	font-weight: bold;
}

#login_contenedor #caja .campos form input,
#login_contenedor #caja .campos form select {
	border: 1px solid #bbb;
	color: #606060;
	width: 219px;
	padding: 12px 0;
	border-radius: 0;
	font-size: 15px;
	transition: all 0.2s ease-in-out;
	outline: none;
	padding-left: 15px;
	padding-right: 15px; /* Para IE10 */
	box-sizing: border-box;
}

#login_contenedor #caja .campos form select{
	display: table-cell;
}

#login_contenedor #caja .campos form select {
	padding: 2px 0;
	width: 270px; /* Para Chrome */
	text-align-last: center; /* Para Chrome */
}

#login_contenedor #caja .campos form input:-webkit-autofill {
	-webkit-box-shadow: 0 0 0 1000px white inset;
}

#login_contenedor #caja .campos form input.extension {
	/* Para la extensión */
	width: 270px;
}

#login_contenedor #caja .campos form .entrar {
	border: 1px solid #1c91c4;
	background: #2aa7de;
	color: #fff;
	padding: 12px 0;
	margin: 0 0 10px 0;
	width: 270px;
	outline: 0;
	cursor: pointer;
	text-transform: uppercase;
	font-weight: 600;
	font-size: 15px;
	text-indent: 0;
}

#login_contenedor #caja .campos form .entrar:hover {
	background: #1c91c4;
}

#login_contenedor #caja .campos form .input-group {
	border-collapse: separate;
	display: table;
	position: relative;
	margin: 0 auto 10px;
}

#login_contenedor #caja .campos form .input-group-addon {
	display: table-cell;
	background-color: #eee;
	color: #555;
	font-size: 20px;
	width: 50px;
	border-left: 1px solid #bbb;
	border-bottom: 1px solid #bbb;
	border-top: 1px solid #bbb;
}

#login_contenedor #caja .campos form .input-group-addon .mdi {
	margin: 10px 0 0 0;
}

#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;
}

/******************* 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 {
	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 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;
}

/* Bandas de colores */

#main .alert.alert-danger.show,
#main .alert.alert-dangerJS.show,
#main .alert.alert-success.show,
#main .alert.alert-warning.show,
#main .alert.alert-info.show,
#main .alert.alert-description.show {
	display: table;
}

#main .alert {
	width: 100%;
	text-align: left;
	margin: 0 auto 15px auto;
	display: none;
	position: relative;
}

#main .alert p {
	float: left;
	margin: 6px 20px 4px 10px;
	padding: 0;
}

#main .alert .close {
	float: right;
	margin: 8px 10px 0 0;
	text-decoration: none;
}

#main .alert a {
	text-decoration: underline;
}

#main .alert.alert-danger p:before,
#main .alert.alert-dangerJS p:before,
#main .alert.alert-success p:before,
#main .alert.alert-warning p:before,
#main .alert.alert-info p:before {
	font: 22px "Material Design Icons";
	float: left;
	margin: -2px 10px auto auto;
}

#main .alert.alert-danger p:before,
#main .alert.alert-dangerJS p:before {
	content: "\f028";
}

#main .alert.alert-danger,
#main .alert.alert-dangerJS {
	background-color: #f2dede;
	color: #a94442;
	border: 1px solid #ebcccc;
}

#main .alert.alert-danger a,
#main .alert.alert-dangerJS a {
	color: #a94442;
}

#main .alert.alert-description {
	margin: -5px 0 20px 8px;
	color: #a22525;
	display: none;
	width: 100%;
}

#main .alert.alert-description p {
	width: calc(100% - 36px);
	padding: 0;
	margin: 0 0 0 36px;
}

#main .alert.alert-description p:before {
	content: "-";
	margin-right: 5px;
}

#main .alert.alert-success p:before {
	content: "\f133";
}

#main .alert.alert-success {
	background-color: #dff0d8;
	color: #3c763d;
	border: 1px solid #d0e9c6;
}

#main .alert.alert-success a {
	color: #3c763d;
}

#main .alert.alert-warning p:before {
	content: "\f02a";
}

#main .alert.alert-warning {
	background-color: #fefccf;
	color: #8a6d3b;
	border: 1px solid #efecac;
}

#main .alert.alert-warning a {
	color: #8a6d3b;
}

#main .alert.alert-info p:before {
	content: "\f2fd";
}

#main .alert.alert-info {
	background-color: #d9edf7;
	color: #31708f;
	border: 1px solid #bcdff1;
}

#main .alert.alert-info a {
	color: #31708f;
}

#main input.has-danger,
#main textarea.has-danger,
#main select.has-danger,
#main .selectize-control.cssCombo.has-danger {
	border: 1px solid #ebcccc;
	background: #f2dede;
	color: #a94442;
}

#main input.has-success,
#main textarea.has-success,
#main select.has-success,
#main .selectize-control.cssCombo.has-success {
	border: 1px solid #d0e9c6;
	background: #dff0d8;
	color: ##3c763d;
}

#main input.has-warning,
#main textarea.has-warning,
#main select.has-warning,
#main .selectize-control.cssCombo.has-warning {
	border: 1px solid #efecac;
	background: #fefccf;
	color: #8a6d3b;
}

/******************* Estilos de texto **********************/

.font-weight-bold {
	font-weight: 700 !important;
}

.font-weight-normal {
    font-weight: 400 !important;
}

.font-weight-light {
    font-weight: 300 !important;
}

.font-italic {
    font-style: italic !important;
}

.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

/* Colores de texto y fondo */ 

.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-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-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-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-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-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: #8e6e45 !important;											
}

.bg-dark-brown {
	background: #8e6e45 !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-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-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-white {
	color: #fff;
}

.text-black {
	color: #000;
}

/******************* Esquema principal **********************/

#header_container {
	width: 100%;
	height: 80px;
	background: #2aa7de;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
	margin: 0 0 10px 0;
}

#header {
	width: 1300px;
	margin: 0 auto;
	color: #fff;
	position: relative;
	padding-right: 10px;
}

#container {
	margin: 0 auto;
	padding: 0 0 20px 0;
	color: #000;
	display: table; /* Este div contiene toda la estructura al 100% y sirve para dar sombra */
	min-height: 100%;
	height: 100%;
	width: 1300px;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* IE 11 & EDGE HACK */
	#container {
		table-layout: fixed;
	}
}

#container #column {
	float: left;
	width: 250px;
	margin-right: 25px;
	background: #edecec;
}

#content {
	float: left;
	width: 1015px;
	/* 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 10px;
}

#content .noFlexIE#flex_container {
	display: inherit;
}

#content #main {
	padding: 10px;
	color: #000;
	background: #fff;
	flex-grow: 1;
	position: relative;
}

#sidebar {
	max-width: 250px;
	min-width: 250px;
	padding: 20px 2px 10px 10px;
	/* 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;
}

/******************* Sidebar **********************/

#sidebar .icons {
	margin: 0;
}

#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: 15px;
	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 .content {
	margin: 0 0 15px 0;
}

#sidebar .content li {
	list-style: none;
	padding: 5px 10px;
	font-size: 11px;
	border-left: 1px solid #d0cfcf;
	border-right: 1px solid #d0cfcf;
}

#sidebar .content li:last-child {
	border-bottom: 1px solid #d0cfcf !important;
}

#sidebar #infor.content li:nth-child(even) {
	/* Caso especial, caja información */
	background: #f1f1f1;
}

#sidebar #infor.content li { /* Caso especial, caja información */
	border-bottom: 0;
}

#sidebar .content li {
	border-bottom: 1px solid #d0cfcf;
}

#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 .content {
	display: none;
}

#sidebar .actions {
	display: none;
	color: #aaa;
}

#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 {
	text-align: left;
	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 {
	font-size: 15px;
	display: inline-block;
	vertical-align: top;
	text-align: right;
	margin: 0;
	color: #000;
}

#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 .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 {
}

#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 .openUp .mdi,
#sidebar .header.empty:hover .openUp .mdi {
	color: #666;
	cursor: initial;
}

#sidebar .header .plus_icon {
	float: right;
	margin: -5px 0 0 0;
}

@media screen and (-webkit-min-device-pixel-ratio:0){ /* CSS HACK CHROME */
#sidebar .header .plus_icon {
	margin: -4px 0 0 0;
}
}

#sidebar .header .plus_icon .mdi { /* Los iconos de la derecha */
	color: #fff;
	float: right;
	font-size: 23px !important;
}

#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;
	margin-top: -4px;
}

#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 {
	line-height: 22px; /* Lo mismo que #main label */
}

#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;
}

#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;
	 -ms-flex-pack: justify;
}

#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;
    -ms-flex-pack: right;	
}

#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;
}

#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 */

#content #menu_tabs.fixed {
	width: 1015px;
	position: fixed;
	top: 0px;
	z-index: 70;
}

#content #header_object.fixed {
	width: 995px;
	position: fixed;
	top: 40px;
	z-index: 70;
	margin: 0px 10px;
}

#content #main.fixed,
#content #sidebar.fixed {
	margin-top: 90px; /* #header_container + #navbar */
}

/* 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 #spanSearchMenu {
	margin: 0;
	border-bottom: 0;
}

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: inline-flex;
   display: -ms-inline-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: 1290px;
	width: 100% !important;
}

body.maximize #header_object {
	width: calc(100% - 20px) !important;
	margin: 0 15px;
}

body.maximize #header_object.fixed {
	max-width: 1270px;
}

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.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 contenido **********************/

#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;
}

#header #info .user .mdi {
	font-size: 40px !important;
}

#header #info .user .mdi:hover {
	color: #fff !important;
}

#header #info .mdi:hover {
	color: #eee !important;
}

#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() { /* FF HACK */
	#header #info #UTNButton span,
	#header #info #NotesButton span {
		top: 3px;
	}
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* IE HACK (lo mismo de arriba) */
	#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 a,
#header #info #HistoryButton.click a,
#header #info #UTNButton.click a,
#header #info #NotesButton.click a,
#header #info #BellButton.click .bell {
	background: #7bbfdf;
}

#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 .back 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 ul {
	position: absolute;
	list-style-type: none;
	padding-right: 100px;
}

#menu_tabs li {
    float: left;
    color: inherit;
    margin: 0;
    padding: 2px 0 2px 0;
    height: 40px;
    text-align: center;
    cursor: pointer;
}

#menu_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: -26px 0 0 0;
}

@media screen and (-webkit-min-device-pixel-ratio:0){ /* CSS HACK CHROME */

	#menu_tabs .controles .despliega ul {
		top: 15px !important;
	}
}

#menu_tabs .controles #prev,
#menu_tabs .controles #next {
	cursor: pointer;
	float: left;
	font-size: 20px;
}

#menu_tabs .controles #prev {
	margin: 0 0 0 -80px;
}

/* HACK FF */
@-moz-document url-prefix() {
#menu_tabs .controles #prev {
	margin: -9px 0 0 -80px;
}
}

#menu_tabs .controles #next {
	margin: 0 0 0 -57px;
}

/* HACK FF */
@-moz-document url-prefix() {
#menu_tabs .controles #next {
	margin: -9px 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: -3px;
	list-style: none;
	cursor: pointer;
	margin: 0;
}

#menu_tabs .controles .despliega #down {
	font-size: 20px;
	margin: -5px 0 0 10px;
	float: left;
}

/* HACK FF */

@-moz-document url-prefix() {
#menu_tabs .controles .despliega #down {
	margin: -13px 0 0 10px;
}
}

#menu_tabs .controles .despliega ul {
	display: none;
	width: 200px;
	position: absolute;
	top: 12px;
	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: 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 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;
	display:inline-block;
}

#menu_tabs .controles .despliega ul.row { /* Cuando hay más de 15 opciones */
	width: 400px;
	left: auto !important;
	margin-right: 10px;
}

#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:hover {
	color: #eee;
}

#menu_tabs .controles .mdi.disabled,
#menu_tabs .controles .mdi.disabled:hover{
	opacity: 0.5 !important;
	color: #fff !important;
	cursor: default;
}

#menu_tabs .controles {
	position: relative;
	float: right;
	margin: -40px 0 0 0;
}

#menu_tabs .controles ul{
	left: auto !important;
	right: 0;
}

@media screen and (-webkit-min-device-pixel-ratio:0){ /* CSS HACK CHROME */


	#menu_tabs .controles .despliega ul {
		top: 15px !important;
	}
}

#menu_tabs .controles #prev,
#menu_tabs .controles #next {
	cursor: pointer;
	float: left;
	font-size: 20px;
}

#menu_tabs .controles #prev {
	margin: 0 0 0 -80px;
}

/* HACK FF */
@-moz-document url-prefix() {
#menu_tabs .controles #prev {
	margin: -9px 0 0 -80px;
}
}

#menu_tabs .controles #next {
	margin: 0 0 0 -57px;
}

/* HACK FF */
@-moz-document url-prefix() {
#menu_tabs .controles #next {
	margin: -9px 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: -3px;
	list-style: none;
	cursor: pointer;
	margin: 0;
}

#menu_tabs .controles .despliega #down {
	font-size: 20px;
	margin: -5px 0 0 10px;
	float: left;
}

/* HACK FF */

@-moz-document url-prefix() {
#menu_tabs .controles .despliega #down {
	margin: -13px 0 0 10px;
}
}

#menu_tabs .controles .despliega ul {
	display: none;
	width: 200px;
	position: absolute;
	top: 12px;
	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: 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%;
}

#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;
	display:inline-block;
}

#menu_tabs .controles .despliega ul.row { /* Cuando hay más de 15 opciones */
	width: 400px;
	left: auto !important;
	margin-right: 10px;
	padding-right: 0;
}

#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: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;
	color: #676767;
	margin: 0 10px 0 10px;
	border-bottom: 1px solid #d4cbc7;
	height: 50px;
	position: relative;
}

#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: 10px 17px 0 4px;
}

#content #header_object {
	background: #fff;
	margin: 0 10px 0 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#content #header_object h2.ico{
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
	display: -ms-flexbox;
    display: flex;
    white-space: nowrap;
}

#content #header_object h2.ico .mdi {
	margin: -3px 10px 6px 0;
}

#content #header_object h2.ico span {
    text-overflow:ellipsis;
    width: auto;
	overflow: hidden;
	-ms-overflow-style: none;
	line-height: 31px;
}

@media screen and (-webkit-min-device-pixel-ratio:0){ /* CSS HACK CHROME */
    #content #header_object h2.ico span {
        line-height: 32px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* Hack para IE10 para simular la elipsis */
    #content #header_object h2.ico span {
        width: 650px;
        display: inline-block;
        margin-top: -1px;
    }
}

#content #header_object h2.ico strong {
	padding: 0 5px;
}

/* Aplica el estilo al p del segundo div con id #header_object dentro de #content */
#content div:nth-child(0n+2)#header_object p {
	font-size: inherit;
}

#content #header_object .icons {
	margin: 1px 0 0 0;
	max-width: 250px;
    min-width: 250px;
	float: right;
}

#content #header_object .icons .mdi.mdi-star {
	color: #7bc6e9;
}

#header_object .controles {
	position: relative;
	float: right;
	margin: -26px 0 0 0;
}

#header_object .controles #prev,
#header_object .controles #next {
	cursor: pointer;
	float: left;
	font-size: 20px;
}

#header_object .controles #prev {
	margin: -8px 0 0 -80px;
}

#header_object .controles #next {
	margin: -8px 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: 15px;
	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 **********************/
/* (NOTA, de aquí para abajo no se incluye la ruta completa, ya que puede estar en contenedor -> contenedor_locator & content - contenido_locator) */

table.table {
	border-spacing: 0;
	border: 0;
	margin: 0 auto 15px auto;
	width: 100%;
	font-size: inherit;
}

table.table caption {
	height: 23px;
	text-align: left;
	font-weight: bold;
	color: #000;
	margin: 0 auto;
}

table.table td,
table.table th {
	padding: 4px;
	text-align: left;
}

table.table td.left,
table.table th.left {
	text-align: left;
}

table.table td.right,
table.table th.right {
	text-align: right;
}

table.table td.center,
table.table th.center {
	text-align: center !important;
}

table.table thead th {
	background: #fff;
	color: #4e4e4e;
	padding: 5px;
}

table.table.bg1 thead th,
table.table tbody tr.bg1 {
	background: #42a3d1;
	color: #fff;
}

table.table.bg1.opacity thead th,
table.table tbody tr.bg1.opacity,
table.table tbody tr.bg1.opacity td {
	background-color: rgba(66, 163, 209, 0.3);
}

table.table.bg2 thead th,
table.table tbody tr.bg2 {
	background: #bbb;
	color: #fff;
}

table.table.bg2.opacity thead th,
table.table tbody tr.bg2.opacity,
table.table tbody tr.bg2.opacity td {
	background-color: rgba(187, 187, 187, 0.3);
}

table.table tr.bg0 td,
table.table td.bg0,
table.table th.bg0 {
	background: #fff !important;
	color: #000 !important;
}

table.table tbody td { /* No poner vertical-align - Si es necesario se añadirá la clase CSS al TD */
	background-color: inherit;
	color: #000;
	padding: 5px;
}

table.table > tbody > tr:nth-child(even) {
	background: #f4f4f4;
}

table.table > tbody > tr:nth-child(odd) {
	background: #fff;
}

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;
	background: inherit no-repeat;
	text-decoration: none;
}

table.table tbody a:hover {
	background: inherit no-repeat;
}

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 .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 {
	font-size: 10px;
}

#main fieldset.alertas .mdi-checkbox-blank-circle,
#main .jmesa #CASES tbody.tbody .mdi.mdi-checkbox-blank {
	font-size: 16px;
}

#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 label {
	line-height: 22px; /* Lo mismo que en #main p */
	margin: 0;
}

#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;
}

/* 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;
}

/******************* 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;
}

/******************* Caja de información **********************/

#main fieldset.info {
	background: #f5f5f5;
	padding: 0;
}

#main fieldset.info .titulo {
	width: calc(100% - 11px);
	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;
}

#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*/
}

/* 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 */
}

/* MAQUETACIÓN RESPONSIVE */

.row {
   display: flex;
   flex-wrap: wrap;
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
	position: relative;
	width: 100%;
	min-height: 1px;
}

.col {
	flex-grow: 1;
	flex-basis: 0;
    max-width: 100%;
}

.col-1 {
	width: 8.33%;
}

.col-2 {
	width: 16.66%;
}

.col-3 {
	width: 25%;
}

.col-4 {
	width: 33.33%;
}

.col-5 {
	width: 41.66%;
}

.col-6 {
	width: 50%;
}

.col-7 {
	width: 58.33%;
}

.col-8 {
	width: 66.66%;
}

.col-9 {
	width: 75%;
}

.col-10 {
	width: 83.33%;
}

.col-11 {
	width: 91.66%;
}

.col-12 {
	width: 100%;
}

.offset-1 {
  margin-left: 8.333333%;
}

.offset-2 {
  margin-left: 16.666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.333333%;
}

.offset-5 {
  margin-left: 41.666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.333333%;
}

.offset-8 {
  margin-left: 66.666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.333333%;
}

.offset-11 {
  margin-left: 91.666667%;
}

.form-group {
	padding: 0 5px;
	margin-bottom: 10px;
}

.form-row { /* No definir el border-bottom aquí, ya que no es obligatorio */
	display: flex;
	display: -ms-flexbox;
	width: 100%;
}

.input-group {
	display: flex;
	display: -ms-flexbox;
}

.input-group input {
	margin-right: 3px;
}

.input-group .ui-datepicker-trigger {
	display: inline-flex;
	display: -ms-inline-flexbox;
}

/**/

.form-check {
    position: relative;
    display: block;
    padding-left: 1.25rem;
}

.form-check input[type=checkbox][disabled] ~ label,
.form-check input[type=radio][disabled] ~ label {	
	color: #6c757d;
	cursor: default;
}

.form-check.form-check-inline {
    display: inline-flex;
    display: -ms-inline-flexbox;	
    margin-right: .75rem;
}

.form-check.form-check-inline input[type="checkbox"],
.form-check.form-check-inline input[type="radio"],
.form-check input[type="checkbox"],
.form-check input[type="radio"] {
    position: absolute;
    margin-top: .3rem;
    margin-left: -1.25rem;
	cursor: pointer;
}

.form-check.form-check-inline input[type="checkbox"][disabled],
.form-check.form-check-inline input[type="radio"][disabled],
.form-check input[type="checkbox"][disabled],
.form-check input[type="radio"][disabled] {
	cursor: default;
}

.form-check.form-check-inline label,
.form-check label {
	cursor: pointer;
}

/**/

.custom-control.form-check {
	padding-left: 0;
}

.custom-control.form-check label {
	cursor: pointer;
}

.custom-control.form-check input[type="checkbox"],
.custom-control.form-check input[type="radio"]{
	position: absolute;
	right: 9000px;
}

.custom-control.form-check input[type="checkbox"] + label:before,
.custom-control.form-check input[type="radio"] + label:before {	
	font-family: "Material Design Icons";	
	speak: none;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing:antialiased;
	width: 1em;
	display: inline-block;
	margin-right: 5px;
	font-size: 18px;	
	color: #7bc6e9;	
}

.custom-control.form-check input[type="checkbox"][disabled] + label:before,
.custom-control.form-check input[type="radio"][disabled] + label:before,
.custom-control.form-check input[type="checkbox"]:checked[disabled] + label:before,
.custom-control.form-check input[type="radio"]:checked[disabled] + label:before {	
	color: #ccc;
}

.custom-control.form-check input[type="checkbox"] + label:before {	
	content: "\f131";
}

.custom-control.form-check input[type="checkbox"]:checked + label:before {	
	content: "\f135";
}

.custom-control.form-check input[type="radio"] + label:before {
	content: "\f130";
}

.custom-control.form-check input[type="radio"]:checked + label:before {	
	content: "\f134";
}

/**/

.form-group[class*='col'] {
	box-sizing: border-box;
}

.form-group span { /* No poner display:flex ya que rompe los iconos de CKEDITOR */
}

.form-group[class*='col'] input,
.form-group div[class*='col'] input,
.form-group[class*='col'] select,
.form-group div[class*='col'] select,
.form-group[class*='col'] textarea,
.form-group div[class*='col'] textarea {
	width: 100%;
	min-width: 1%;	/* Para las p de 25 */
	box-sizing: border-box;
}

.form-group.border-bottom input[type=text],
.form-group.border-bottom select,
.form-group.border-bottom textarea {
	border: 0;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
	background: white no-repeat;
	background-image: linear-gradient(to bottom, #2aa7de, #2aa7de), linear-gradient(to bottom, silver, silver);
	background-size: 0 2px, 100% 1px;
	background-position: 50% 100%, 50% 100%;
	transition: background-size 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
}

.form-group.border-bottom input:focus,
.form-group.border-bottom select:focus,
.form-group.border-bottom textarea:focus {
	background-size: 100% 1px, 100% 1px;
	outline: none;
}

.form-inline .form-group {
	display: inline-flex;
	display: -ms-inline-flexbox;
	margin-bottom: 0;
	vertical-align: middle;
}

.form-inline .form-group label {
	margin-right: 5px !important;
}

.form-control-plaintext {
  display: block;
  border: 1px solid transparent !important;
}

p.form-control-plaintext {
	padding: 0 5px;
}

/**/

.float-label {
	position: relative;
}

.float-label label {
	position: absolute;
	left: 5px;
	top: -16px;
	cursor: text;
	font-size: 75%;
	-webkit-transition: all .2s;
	transition: all .2s;
	color: #2aa7de;
}

.float-label input,
.float-label textarea {
	font-size: inherit;
    margin-bottom: 2px;
    border-radius: 0;
    border-bottom: 1px solid rgba(0,0,0,.1);
	border: 0;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
	background: white no-repeat;
	background-image: linear-gradient(to bottom, #2aa7de, #2aa7de), linear-gradient(to bottom, silver, silver);
	background-size: 0 2px, 100% 1px;
	background-position: 50% 100%, 50% 100%;
	transition: background-size 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
}

.float-label input::placeholder,
.float-label textarea::placeholder {
	-webkit-transition: all .2s;
	transition: all .2s;
}

.float-label input:placeholder-shown:not(:focus)::placeholder,
.float-label textarea:placeholder-shown:not(:focus)::placeholder {
	opacity: 0;
}

.float-label input:placeholder-shown:not(:focus) + *,
.float-label textarea:placeholder-shown:not(:focus) + * {
	font-size: 100%;
	top: 0;
	color: #999;
}

.float-label input:focus,
.float-label textarea:focus {
	background-size: 100% 1px, 100% 1px;
	outline: none;
	border: 0;
}

/* FIN MAQUETACIÓN RESPONSIVE */

/******************* 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) { /* IE 11 & EDGE HACK */
	#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;
}

/******************* 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 {
	background: #eaf7ff;
}

#main fieldset.bg2 {
	background: #f5f5f5;
}

#main fieldset.border {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

#main fieldset .mini {
    padding: 0px;
    font-size: 11px;
}

#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-left: 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: #373737;
	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%;
}

#procesando {
	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: 666;
	box-sizing: content-box;
}

#procesando {
	border: 1px solid #B7B7B7;
}

.popup #procesando {
	display: none !important;
}

#main button.ui-multiselect {
	height: 26px;
}

/***************** Boton NEWCORE ********************/

#main .btn {
	color: #fff;
	background: #4cb1e1;
	cursor: pointer;
	position: relative;
	font-weight: bold;
	border: 0;
	text-transform: uppercase;
	width: auto;
	margin-right: 5px;
	margin-bottom: 5px;
	/* No añadir display pq se puede ocultar con .hide y este display tiene prioridad */
}

#main .btn.mini {
	text-transform: none;
	font-size: 13px;
}

#main .btn:hover span {
	background: rgba(0, 0, 0, 0.1) !important;
}

#main .btn span {
	padding: 7px 20px;
	display: block;
}

#main .btn.mini span {
	padding: 4px 15px;
}

#main .btn.left {
	float: left;
}

#main .btn.center {
	margin: 0 auto;
	display: block;
}

#main .btn.right {
	float: right;
}

#main .btn.disabled, /* Disabled no tiene on-off */
#main .btn[disabled] {
	background: #ccc;
}

#main .btn.disabled:hover *, /* Para Chrome y FF con * y sin él */
#main .btn[disabled]:hover *,
#main .btn.disabled:hover,
#main .btn[disabled]:hover {
    cursor: not-allowed !important;
}

#main .btn.disabled:hover span,
#main .btn[disabled]:hover span {
	background: #ccc !important;
}

#main .btn.disabled::before,
#main .btn[disabled]::before {
	background: #ccc;
}

#main .btn.error {
	background: #f2797e;
}

#main .btn.ok {
	background: #78c63f;
}

#main .btn.warning {
	background: #ea9d06;
}

#main .btn.alt1 {
	background: #4c9cca;
}

#main .btn.ico .mdi {
	font-size: 20px !important;
	color: #fff !important;
	position: absolute;
	top: 0;
	line-height: 100%;
	background: rgba(255, 255, 255, 0.25) none;
	font-weight: normal;
	padding: 6px;
}

#main .btn.mini.ico .mdi {
	font-size: 16px !important;
	padding: 5px 6px;
}

#main .btn.ico.icoLeft {
	padding-left: 32px;
	padding-right: 0;
}

#main .btn.ico.mini.icoLeft {
	padding-left: 26px;
	padding-right: 0;
}

#main .btn.ico.icoLeft .mdi {
	left: 0;
	right: auto;
}

#main .btn.ico.icoRight {
	padding-right: 32px;
	padding-left: 0;
}

#main .btn.ico.mini.icoRight {
	padding-right: 28px;
	padding-left: 0;
}

#main .btn.ico.icoRight .mdi {
	right: 0;
	left: auto;
}

#main .btn.mini span {
	padding: 4px 20px;
}

#main .btn.ico.mini.icoLeft {
	padding-left: 28px;
}

button::-moz-focus-inner {
	margin: 0;
	padding: 0;
	border-width: 0;
}

/******************* Tooltips **********************/

/* No ponemos el border-bottom: 1px dotted #666 si existe la clase tooltip */
/* No gusta y da problemas */

.tip {
	display: none;
	position: absolute;
	border: 1px solid #d7edf2;
	background: #e2f6fb;
	border-radius: 10px;
	padding: 5px 10px;
	color: #000;
	max-width: 300px;
	z-index: 669;
}

.tip ul li {
	list-style: none;
	padding: 0 0 0 10px;
}

.tip ul li:before {
	font-size: 16px;
    content: "- ";
}

.tooltip, .tooltip div {
	/* .tooltip div es para jmesa, ya que el tooltip se pone a nivel de <td> */
	cursor: help !important;
}

a .mdi.tooltip {
	cursor: pointer !important;
}

/* 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;
}

/* 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;
}

body.widgets #content form #header_object {
	border: 1px solid #d9d8d8;
	margin-left: 0;
	width: 100% !important;
}

body.widgets #content #flex_container {
	border-top: 0;
	margin: 0;
}

body.widgets #content #main {
	background: #edecec;
	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 {
	height: 38px !important;
}

body.widgets #header_object .ui-multiselect {
	margin: 7px;
	padding: 3px;
}

/* HACK FF */
@-moz-document url-prefix() {
	body.widgets #header_object {
	height: 39px !important;
	}
	body.widgets #header_object .ui-multiselect {
	padding: 4px ;
	}
}

/* Widget genérico */

#widgetcontainer {
	list-style-type: none;
}

#widgetcontainer {
	margin: -5px 0 0 0;
}

#widgetcontainer li {
	float: left;
}

#widgetcontainer .ui-state-highlight {
	width: 100%;
	height: 300px;
	margin: 10px 0 5px 0;
	background: url('../../images/fnd_max.gif') repeat;
	border: 1px solid #ccc;
}

/* Widget TIPO 0 */

#widgetcontainer .widget0 {
	width: 100%;
	height: 300px;
	margin: 6px 0 5px 0;
	border: 1px solid #d9d8d8;
	background: #fff;
	padding: 7px 0px 0px 0px;
}

#widgetcontainer .widget0 div {
	background: #fff;
}

#widgetcontainer .widget0 iframe {
	width: 100%;
	height: 250px; /* TOTAL -30px */
	border: 0;
}

#widgetcontainer .widget0 .widgetTitle {
	background: #fff;
	border: 0;
	border-bottom: 1px solid #d0cfcf;
	cursor: move;
	color: #666;
	width: 97%;
	margin: 0 auto;
	padding: 5px 7px 5px 10px;
}

#widgetcontainer .widget0 .widgetTitle .spanTitle {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 16px;
}

#widgetcontainer .widget0 .widgetTitle .mdi {
	margin: -2px 4px 0 0;
}

/* Widget TIPO 1 */

#widgetcontainer .widget1 {
	width: 50%;
	height: 300px;
	margin: 10px 0 5px 5px;
	border: 1px solid #d9d8d8;
	-webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.1);
	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.1);
}

#widgetcontainer .widget1 div {
	background: #fff;
}

#widgetcontainer .widget1 iframe {
	width: 50%;
	height: 250px; /* TOTAL -30px */
	border: 0;
}

#widgetcontainer .widget1 .widgetTitle {
	background: #fff;
	border: 0;
	border-bottom: 1px solid #d0cfcf;
	cursor: move;
	color: #5b5b5b;
	width: 96%;
	margin: 0 auto;
	padding: 5px 0 5px 10px;
}

#widgetcontainer .widget1 .widgetTitle .spanTitle {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 16px;
}

/* Widget TIPO 2 */

#widgetcontainer .widget2 {
	width: 100%;
	height: 350px;
	margin: 10px 0 5px -1px;
	border: 1px solid #d9d8d8;
	-webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.1);
	box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.1);
}

#widgetcontainer .widget2 div {
	background: #fff;
}

#widgetcontainer .widget2 iframe {
	width: 100%;
	height: 320px; /* TOTAL -30px */
	border: 0;
}

#widgetcontainer .widget2 .widgetTitle {
	background: #fff;
	border: 0;
	border-bottom: 1px solid #d0cfcf;
	cursor: move;
	color: #5b5b5b;
	width: 96%;
	margin: 0 auto;
	padding: 5px 0 5px 10px;
}

#widgetcontainer .widget2 .widgetTitle .spanTitle {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 16px;
}

/* Widget TIPO 3 y 4 Gráficos */

#widgetcontainer .widget3 iframe,
#widgetcontainer .widget4 iframe {
    padding: 40px 4% 2% 4%;
    width: 92%;
    height: 240px;
    border: 0;
}

#widgetcontainer .widget3 iframe body,
#widgetcontainer .widget4 iframe body{
	background: transparent;
}

#widgetcontainer .widget3 .widgetTitle,
#widgetcontainer .widget4 .widgetTitle {
	cursor: move;
    width: 96%;
    padding: 12px 0 5px 10px;
    position: absolute;
    margin-left: 15px;
}

#widgetcontainer .widget3 .widgetTitle .mdi,
#widgetcontainer .widget4 .widgetTitle .mdi {
	color: #fff;
}

#widgetcontainer .widget3 .widgetTitle .spanTitle,
#widgetcontainer .widget4 .widgetTitle .spanTitle {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 13px;
	display: none;
}

/* Widget TIPO 3 Gráfico */

#widgetcontainer .widget3 {
	width: 100%;
	height: 300px;
	margin: 6px 0 5px 0;
	border: 1px solid #d9d8d8;
	background: url("../images/widgets/widget3.png") no-repeat;
}

/* Widget TIPO 4 Gráfico */

#widgetcontainer .widget4 {
	width: 100%;
	height: 300px;
	margin: 6px 0 5px 0;
	border: 1px solid #d9d8d8;
	background: url("../images/widgets/widget4.png") no-repeat;
}

/* Shortcut Template */

.shortcutBody{
	background: transparent;
    margin: 0;
    overflow: hidden;
    height: 240px;
}

.shortcutBody h1{
	font-size: 25px;
	padding-bottom: 20px;
}

.shortcutBody span{
	font-size: 16px;
	padding-bottom: 20px;
}

.shortcutBody button{
    width: auto;
    min-width: 175px;
    height: 85px;
    padding: 0px 10px 0px 10px;
    margin-right: 10px;
    background: rgba(213, 234, 243, 0.7);
    border: 1px solid rgba(41, 104, 140, 0.30);
    border-radius: 2px;
}

.shortcutBody button:hover{
    background: rgba(213, 234, 243, 1);
	cursor: pointer;
}

.shortcutBody button .mdi,
.shortcutBody button .mdi:hover{
    display: block;
    font-size: 36px;
    margin-bottom: 10px;
	color: #29688c;
}

.shortcutBody button strong{
	font-size: 16px;
	padding-bottom: 20px;
	color: #29688c;
}

.shortcutBody .interactionShortcutButtons,
.shortcutBody .dashboardShortcutButtons {
    position: absolute;
    bottom: 0;
}

/* Interaction Shortcut */

.shortcutBody .interactionShortcutContent h1,
.shortcutBody .interactionShortcutContent span{
	color: #fff;
}

/* Dashboard Shortcut */

.shortcutBody .dashboardShortcutContent h1,
.shortcutBody .dashboardShortcutContent span{
	color: #29688c;
}

/* 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 sencillas */

#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 #b7b7b7;
	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 #b7b7b7;
	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 12px;
}

#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_campaigns:before {
	content: "\f5dd";
}

#main .integral_view .tabContent.tab_summary .left span.ico_products:before {
	content: "\f3d7";
}

#main .integral_view .tabContent.tab_summary .left hr {
	margin: 10px 20px 10px 0;
}

/******************* 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 0 55px;
}

#alertdialog:before,
#dialog-confirm:before {
	content: "\f02a";
}

#okdialog:before {
	content: "\f5e1";
}

/******************* Menú **********************/

#column #spanSearchMenu{
    border-collapse: separate;
    display: table;
    position: relative;
    margin-bottom: 10px;
    width: 100%;
    text-align: center;
}

#column #spanSearchMenu #iconSearchMenu{
	display: table-cell;
	background-color: #eee;
	color: #555;
	font-size: 20px;
	width: 50px;
	border-left: 1px solid #d9d8d8;
	border-bottom: 1px solid #d9d8d8;
	border-top: 1px solid #d9d8d8;
}

#column #spanSearchMenu #iconSearchMenu .mdi {
	color: #939292;
}

#column #spanSearchMenu input{
 	border: 1px solid #d9d8d8;
	color: #606060;
   	width: 100%;
	padding: 9px 0;
	border-radius: 0;
	font-size: 15px;
	transition: all 0.2s ease-in-out;
	outline: none;
	padding-left: 15px;
}

#column #spanSearchMenu #iconSearchMenu .mdi {
	color: #939292;
}

#column #services .console a .mdi{
	font-size: 18px;
}

/* Para que no salten las opciones del menú desplegable */
/* Al ser genérico puede dar problemas, cuidado */

.ui-menu .ui-menu-item a {
	border: 1px solid #fff;
}

.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: 5px;
	margin-bottom: 10px;
	border: 1px solid #d9d8d8;
}

#column #services .console {
	padding: 4px 6px;
}

#column #services .console.conconnected {
	background: #8bd041;
	border: 1px solid #8bd041;
	color: #fff;
}

#column #services .console.condisconnected {
	background: #eee none repeat scroll 0 0;
	border: 1px solid #b7b7b7;
	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: -1px 0 0 5px;
}

#column #services .console a#loginConsoleButton,
#column #services .console a#logoutConsoleButton {
	margin: 0 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 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%;
	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 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: 10px;
	border-top: 1px solid #ccc;
	float: left;
	clear: both;
	width: calc(100% - 20px);
	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;
}

/******************* 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: #c1c1c1 !important;
}

.cke_fake {
	border-top: 1px solid #c1c1c1 !important;
	border-left: 1px solid #c1c1c1 !important;
	border-right: 1px solid #c1c1c1 !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;
}

/******************* Checklists **********************/

#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: #373737;
}

#main #CheckList .undone a:hover {
	color: #373737;
}

#main #CheckList .done a {
	color: #318a00 !important;
}

/******************* Tree **********************/
/* (Usado en ARCHIVO para mostrar tipologías en árbol) */

#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;
}

/******************* Histórico 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;
}

/******************* Colores de estado **********************/
/* (Principalmente para CASO, grupo de CASOS y TAREAS) */

#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.border {
	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 tag **********************/

#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;
}

/* Botón 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;
}

/* Upload */

#progress {
	display: none;
}

#progress .bar {
	width: 0%;
	height: 5px;
	margin: 5px 0 0 5px;
	background: green;
}

.seleccionados {
	display: none;
	margin: 0 0 10px 0 !important;
}

/* Panel lateral */

.ShowIfRightPanelIsOpen {
	display: none;
}

.rightPanel #flex_container {
	display: initial !important;
}

body.rightPanel #navbar .mdi-eye-off {
	display: block !important;
}

/* Labels */

.badge {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 85%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
}

/***********************************************************************************/
/***************************** REGLAS DE OBJETOS CONCRETOS *************************/
/***********************************************************************************/

/* 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;
}
/* OBJETO: Cases */

/* Edición */

.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;
}

/* OBJETO: 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 .fromm span {
    float: right;
    margin: 33px -28px 0 0;
    position: absolute;
}

.object_type_1056 #main fieldset.inline .fromm .cc,
.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 #main table#archives {
	width: 95%;
	margin: 0 auto;
}

/* 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 {
	color: #fff;
	padding: 3px 2px 3px 8px;
	margin: 0 10px 0 0;
	background-color: #5290bf;
	border-radius: 3px;
}

#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: #68bde5;
}

/* Tipología, archivos */

.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: 90%;
    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 */

/* No nos sirve ni el size3, size4 ni el size 5 - El cliente nos ha pedido aumentarlo al máximo y en el modo responsive saltan los iconos */
/* Hemos tenido que forzarlo de esta forma que está MUY MAL. Eliminarlo inmediatamente cuando haya otra alternativa */

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;
}

/* Seguridad -> Rol -> 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 Modeler */

.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;
}

/* Gestión de 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 de elementos */

.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;
}

/* Progress bar stacked */

.progress {
	overflow: hidden;
	background-color: #eee;
	border-radius: 3px;
	box-shadow: inset 0px 1px 1px rgba(0,0,0,.1);
}

.progress .progress-bar {
	 float: left;
	 width: 0%;
	 height: 100%;
	 font-size: 12px;
	 line-height: 20px;
	 color: #fff;
	 text-align: center;
	 background-color: #337ab7;
	 /*box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);*/
	 transition: width .6s ease;
}

.progress .progress-bar-success {
	background-color: #5cb85c;
}

.progress .progress-bar-warning {
	background-color: #f0ad4e;
}

.progress .progress-bar-danger {
	background-color: #d9534f;
}

/* DataTables: css propio */

table.dataTable thead th input[type="text"] {
    width: 100%;
}

label.dataTable_title {
    position: absolute;
    margin: 7px 0 0 0;
}

/* DataTables: sobrescrituras */

table.dataTable thead .sorting {
  background-image: url("../images/jquery.dataTables/sort_both.png") !important;
}
table.dataTable thead .sorting_asc {
  background-image: url("../images/jquery.dataTables/sort_asc.png") !important;
}
table.dataTable thead .sorting_desc {
  background-image: url("../images/jquery.dataTables/sort_desc.png") !important;
}
table.dataTable thead .sorting_asc_disabled {
  background-image: url("../images/jquery.dataTables/sort_asc_disabled.png") !important;
}
table.dataTable thead .sorting_desc_disabled {
  background-image: url("../images/jquery.dataTables/sort_desc_disabled.png") !important;
}

table.dataTables tbody th,
table.dataTables tbody td {
  padding: 8px 0px !important;
}

table.dataTables thead th.th-search {
  padding: 8px 2px;
}
