/* MIXED */

*
{
	cursor: default !important;
	font-family: Roboto, sans-serif;
}

input[type=text],
input[type=search],
input[type=number],
input[type=email],
input[type=password],
input[type=tel],
input[type=url],
textarea
{
	cursor: text !important;
}

input[disabled],
input[readonly]
{
	cursor: default !important;
}

body
{
	background-color: #333;
	color: #333;
	-webkit-transition: background-color 0.5s ease-out 0s;
	-o-transition: background-color 0.5s ease-out 0s;
	-moz-transition: background-color 0.5s ease-out 0s;
	transition: background-color 0.5s ease-out 0s;
	--text-color: #333;
	--kairos-primary-color: #E1BF78;
	--primary-color: #0096C8;
	--panel-head-bgcolor: #fafafa;
	--panel-head-color: #333;
}

body.loading,
body.loading *
{
	cursor: wait !important;
}

body.user-logged
{
	background-color: #EEEEEE;
}

a, a.list-group-item
{
	color: var(--primary-color);
}

a:focus, a:hover,
a.list-group-item:focus, a.list-group-item:hover
{
	color: #007297;
}

hr
{
	border-top: 1px solid #ddd;
}

.loading-layer
{
	display: none;
	z-index: 999999;
}

.small-x
{
	font-size: 75%;
}

.form-control[type=date]:focus,
.form-control[type=time]:focus
{
	align-items: stretch;
}

.form-control:focus
{
	border-color: #007297;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 86, 98, 0.6);
}

.btn:focus,
.btn:active,
.btn.active
{
	border-color: #007297;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 86, 98, 0.6);
	outline-color: #1daabe;
}

.btn.border-bottom-double,
.table tbody > tr > td.border-bottom-double
{
	border-bottom: 2px solid #1daabe !important;
}

.form-control.error {
	background-color: rgba(255,200,200,.2);
	border-color: #A94442;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.form-control.error:focus {
	border-color: #843534;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #CE8483;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #CE8483;
}

.form-control.text-nocase
{
	text-transform: none !important;
}

.selectable
{
	-moz-user-select: initial;
	-webkit-user-select: initial;
	-ms-user-select: initial;
	user-select: initial;
}

.no-selectable
{
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.text-normal
{
	font-weight: normal;
}

.text-bold
{
	font-weight: bold;
}

.white-space-initial
{
	white-space: initial;
}

.margin-sm
{
	margin: 10px;
}

.margin-sm-left
{
	margin-left: 10px;
}

.margin-xs
{
	margin: 10px;
}

.margin-xs-top
{
	margin-top: 5px;
}

.margin-sm-top
{
	margin-top: 10px;
}

.margin-md-top
{
	margin-top: 20px;
}

.cursor-pointer
{
	cursor: pointer !important;
}

.cursor-default,
body.cursor-default,
body.cursor-default *
{
	cursor: default !important;
}

.cursor-disabled,
.cursor-disabled *
{
	cursor: not-allowed !important;
}

.no-border-rounded *
{
	border-radius: 0;
}

.top-square
{
	border-top-right-radius: 0;
	border-top-left-radius: 0;
}

.bottom-square
{
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}

.no-border-top
{
	border-top:  none;
}

.no-border-bottom
{
	border-bottom:  none;
}

.bg-primary
{
	background-color: var(--primary-color) !important;
}

.bg-primary .text-secundary
{
	color: #cfcfcf;
}

.bg-danger
{
	color: #FFF !important;
	background-color: #d9534f !important;
	border-color: #d43f3a !important;
}

.bg-inverse
{
	color: #FFF !important;
	background-color: #222 !important;
	border-color: #080808 !important;
}

.bg-yellow {
	color: #000 !important;
	background-color: #FFF000 !important;
}

.bg-green {
	background-color: #00AA00 !important;
}

.bg-dark-warning
{
	background-color: #F5EAA7 !important;
}

.badge.bg-primary
{
	color: #fff;
	background-color: #337ab7;
}

.badge.bg-info
{
	color: #fff;
	background-color: #5bc0de;
}

.badge.bg-warning
{
	color: #fff;
	background-color: #f0ad4e;
}

.badge.bg-success
{
	color: #fff;
	background-color: #5cb85c;
}

.badge.bg-danger
{
	color: #fff;
	background-color: #d9534f;
}

.inline-block
{
	display: inline-block;
}

.timeago
{
	display: inline;
	cursor: help;
	border-bottom: 1px dotted rgb(119, 119, 119);
	box-sizing: border-box;
}

.text-middle,
.table > thead > tr > td.text-middle,
.table > thead > tr > th.text-middle,
.table > tbody > tr > td.text-middle,
.table > tbody > tr > th.text-middle,
.table > tfoot > tr > td.text-middle,
.table > tfoot > tr > th.text-middle,
.text-middle *
{
	vertical-align: middle;
}

.text-top,
.table > thead > tr > td.text-top,
.table > thead > tr > th.text-top,
.table > tbody > tr > td.text-top,
.table > tbody > tr > th.text-top,
.table > tfoot > tr > td.text-top,
.table > tfoot > tr > th.text-top,
.text-top *
{
	vertical-align: top;
}

.ui-autocomplete
{
	box-shadow: 0px 0px 2px rgba(0, 0, 0, .9);
	max-height: 150px;
	overflow: auto;
}

.jqui .ui-menu .ui-menu-item a
{
	border-color: var(--primary-color);
	border-left-width: 3px;
}

.tooltip,
.ui-autocomplete
{
	z-index: calc(9999 + var(--base-z-index, 0)) !important;
}

.tooltip
{
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.tooltip .tooltip-inner
{
	box-shadow: 0 0 2px rgba(255, 255, 255, .8);
}

.btn
{
	background-image: url(../img/btn-circle-bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 0%;
	-webkit-transition: background-size  0s ease-in 0s;
	-o-transition: background-size  0s ease-in 0s;
	-moz-transition: background-size  0s ease-in 0s;
	transition: background-size  0s ease-in 0s;
}

.btn:hover,
.btn:focus
{
	background-size: 300%;
	-webkit-transition: background-size  0.6s ease-in 0s;
	-o-transition: background-size  0.6s ease-in 0s;
	-moz-transition: background-size  0.6s ease-in 0s;
	transition: background-size  0.6s ease-in 0s;
}

.btn:hover .glyphicon,
.btn:hover .caret,
.btn:focus .glyphicon,
.btn:focus .caret
{
	animation: scaleBtnIcon 0.5s ease-out 1 forwards;
	animation-delay: 0.2s;
}

@keyframes scaleBtnIcon
{
	0% { transform: scale(1); }
	50% { transform: scale(1.5); }
	100% { transform: scale(1); }
}

.btn-default .highlight
{
	color: #44B0FE;
}

.margin-sm-v
{
	margin-top: 15px;
	margin-bottom: 15px;
}

.margin-xs-v
{
	margin-top: 5px;
	margin-bottom: 5px;
}

.panel-heading-xs
{
	display: none;
}

.block-actions
{
	display: none;
}

.clear
{
	clear: both;
}

.visible-inline
{
	display: inline !important;
}

.visible-inline-block
{
	display: inline-block;
}

.visible-block
{
	display: block;
}

.block
{
	display: block;
}

.inline-block
{
	display: inline-block;
}

.text-primary
{
	color: var(--primary-color);
}

.text-secundary
{
	color: #999;
}

.active .text-secundary
{
	color: #CCC;
}

.display-none
{
	display: none;
}

.display-inline
{
	display: inline;
}

.no-visibility
{
	visibility: hidden;
}

.visibility
{
	visibility: visible;
}

.form-control
{
	text-transform: uppercase;
	background-color: #fafafa;
	-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .30s;
	-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .30s;
	-moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .30s;
	transition: border-color ease-in-out .15s, box-shadow ease-in-out .30s;
}

.form-control.highlight,
.panel.highlight
{
	transition: background-color 0.5s ease-out 0s;
}

.form-control[type=email]
{
	text-transform: lowercase;
}

.form-control.text-no-transform
{
	text-transform: none;
}

.form-control.no-readonly-bg,
.form-control.no-disabled-bg
{
	background: #FFF;
}

.form-control.click-to-clear
{
	background-image: url(../img/icono-limpiar-texto.png), url(../img/icono-limpiar-texto-bg.png);
	background-repeat: no-repeat, repeat-y;
	background-position: right;
	padding-right: 45px;
}

.form-control.click-to-clear.click-to-clear-clickable
{
	background-image: url(../img/icono-limpiar-texto-sobre.png), url(../img/icono-limpiar-texto-bg-sobre.png);
}

.lowercase
{
	text-transform: none;
}

a.text-color-simple
{
	color: #000;
}

.no-margin
{
	margin: 0;
}

.no-padding
{
	padding: 0;
}

.no-padding-y,
.table > tfoot.no-padding-y > tr > th,
.table > tfoot.no-padding-y > tr > td,
.table > tfoot > tr.no-padding-y > th,
.table > tfoot > tr.no-padding-y > td
{
	padding-top: 0;
	padding-bottom: 0;
}

.padding-xs
{
	margin: 5px;
}

.padding-sm
{
	margin: 10px;
}

.modal-header .close
{
	color: #FFF;
	opacity: 1;
}

.modal-header .close:hover
{
	opacity: .7;
}

.list-group .divider
{
	position: relative;
	display: block;
	padding: 0;
	background-color: #DDDDDD;
	height: 1px;
}

.list-group-item.active,
.list-group-item.active:hover
{
	border-color: #DDD;
}

a.list-group-item
{
	color: #337AB7;
}

a.list-group-item:focus,
a.list-group-item:hover
{
	color: #23527C;
}

.jqui
{
	transition: all 0.2s ease-out 0s;
}

.jqui.autocomplete-in
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .2);
}

.jqui .ui-widget
{
	font-size: .9em;
}

.jqui .ui-state-active, .jqui .ui-widget-content .ui-state-active, .jqui .ui-widget-header .ui-state-active
{
	border-color: #007297;
	background: var(--primary-color);
	font-weight: normal;
	color: #fff;
}

textarea.form-control
{
	min-height: 30px;
	max-height: 200px;
	resize: vertical;
}

textarea.form-control.input-sm
{
	height: 30px;
}

textarea.form-control.no-resize
{
	resize: none;
}

.form-group-checkboxes label
{
	display: block;
}

.form-group-checkboxes .checkbox-option
{
	font-weight: normal;
}

.form-group-checkboxes .checkbox-option + .checkbox-option
{
	margin-top: 8px;
}

.form-group-checkboxes hr
{
	margin-top: 8px;
	margin-bottom: 8px;
}

.form-group-checkboxes .checkbox-option input[type=checkbox]
{
	-webkit-transition: all 0.2s ease-out 0s;
	-o-transition: all 0.2s ease-out 0s;
	-moz-transition: all 0.2s ease-out 0s;
	transition: all 0.2s ease-out 0s;
}

.form-group-checkboxes .checkbox-option:hover input[type=checkbox]
{
	margin-right: 3px;
}

.form-group-checkboxes .checkbox-option:hover input[disabled]
{
	margin-right: 0;
}

.truncate-text
{
	opacity: 0;
	-webkit-transition: opacity 0.5s ease-out 0s;
	-o-transition: opacity 0.5s ease-out 0s;
	-moz-transition: opacity 0.5s ease-out 0s;
	transition: opacity 0.5s ease-out 0s;
}

.truncate-text.no-truncated
{
	opacity: 1;
}

.truncate-text.truncated
{
	opacity: 1;
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

*.text-overflow
{
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

*.text-overflow,
*.text-overflow-xs
{
	max-width: 100px;
}

*.text-overflow-sm
{
	max-width: 200px;
}

*.text-overflow-static-sm
{
	width: 200px;
}

*.text-overflow-md
{
	max-width: 300px;
}

*.text-overflow-lg
{
	max-width: 500px;
}

*.text-overflow-85perc
{
	width: 80%;
}

.text-overflow-v2
{
	overflow: hidden;
}

.text-overflow-v2 > .text
{
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.text-hscroll
{
	overflow: scroll;
}

.text-hscroll::-webkit-scrollbar
{
	display: none;
}

.text-hscroll > .text
{
	display: inline-block;
	white-space: nowrap;
}

.pos-relative
{
	position: relative;
}

.pos-absolute
{
	position: absolute;
}

.width-200px
{
	width: 200px;
}

.width-40px
{
	width: 40px;
}

.popover .popover-content
{
	max-height: 320px;
	overflow: auto;
}

.bg-default
{
	background: #DEDEDE;
}

.text-line-through,
.text-line-through .badge
{
	text-decoration: line-through;
}

.text-line-height-sm
{
	line-height: 2em;
}

.opacity-50
{
	opacity: .5;
}

.badge.reverse
{
	color: #333333;
	background-color: #fff;
}

.full-width
{
	width: 100% !important;
}

.jqui .ui-state-highlight,
.jqui .ui-widget-content .ui-state-highlight,
.jqui .ui-widget-header .ui-state-highlight
{
	background: #fcefa1;
}

.ui-helper-hidden-accessible
{
	display: none;
}

.dropdown-header
{
	color: var(--primary-color);
	font-weight: bold;
}

.dropdown-menu
{
	z-index: calc(1000 + var(--base-z-index, 0));
}

.dropdown-menu .divider + .divider
{
	display: none;
}

.divider.small
{
	margin: 4px 0;
}

textarea.form-control.textarea-min-height-xs
{
	min-height: 34px;
}

textarea.form-control.textarea-min-height-sm
{
	min-height: 74px;
}

textarea.form-control.textarea-min-height-md
{
	min-height: 114px;
}

textarea.form-control.textarea-min-height-lg
{
	min-height: 204px;
}

* > .show-over,
tr .show-tr-over
{
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity 0.5s ease-out 0s;
	-o-transition: opacity 0.5s ease-out 0s;
	-moz-transition: opacity 0.5s ease-out 0s;
	transition: opacity 0.5s ease-out 0s;
}

*:hover > .show-over,
tr:hover .show-tr-over
{
	visibility: visible;
	opacity: 1;
}

.icono-desglose
{
	-webkit-transition: transform 0.1s ease-out 0s;
	-o-transition: transform 0.1s ease-out 0s;
	-moz-transition: transform 0.1s ease-out 0s;
	transition: transform 0.1s ease-out 0s;
}

.icono-desglose.expandir
{
	transform: rotate(90deg);
}



/** LOADING SPLASH */

body .ajax-layer
{
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2030;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .1);
}

.splash
{
	position: absolute;
	top: 50%;
	left: 50%;
}

.splash *
{
	cursor: default;
}

.splash.up
{
	z-index: 3030;
}

.toast-notification
{
	position: fixed;
	left: 0;
	right: 0;
	bottom: 20px;
	display: block;
	text-align: center;
}

.toast-notification > .toast-content
{
	display: inline-block;
	width: 350px;
	padding: 12px 8px;
	background: rgba(0, 0, 0, .9);
	border-radius: 4px;
	text-align: center;
	color: #ffffff;
}

.reload-system-content a,
.reload-system-content a > *
{
	cursor: pointer !important;
}

.splash > .content
{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 250px;
	height: 220px;
	margin-top: -110px;
	margin-left: -125px;
	text-align: center;
	background: rgba(0, 0, 0, .6);
	border-radius: 10px;
}

.splash > .content > .message
{
	display: block;
	margin-top: 15px;
	margin-bottom: 11px;
	font-size: 18px;
	color: #FFF;
	text-shadow: -1px -1px 1px #000;
}

.bars-loader {
	display: flex;
	justify-content: center;
	align-items: end;
	gap: 2px;
	height: 60px;
	margin-bottom: 20px;
}

.bars-loader > .bar {
	width: 6px;
	height: 100%;
	background: var(--kairos-primary-color);
	border-radius: 20%;
	opacity: 1;
	animation: bounce 1s ease-in-out infinite;
	transform: scaleY(0.4);
}

.bars-loader > .bar:nth-child(1) { animation-delay: 0s; }
.bars-loader > .bar:nth-child(2) { animation-delay: 0.1s; }
.bars-loader > .bar:nth-child(3) { animation-delay: 0.2s; }
.bars-loader > .bar:nth-child(4) { animation-delay: 0.3s; }
.bars-loader > .bar:nth-child(5) { animation-delay: 0.4s; }

@keyframes bounce
{
	0%
	{
		transform: scaleY(0.4);
		opacity: .6;
	}
	
	50%
	{
		transform: scaleY(1);
		width: 7px;
		opacity: 1;
	}

	100%
	{
		transform: scaleY(0.4);
		width: 6px;
		opacity: .6;
	}
}

.ajax-layer .top-loading-bar
{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
}

.ajax-layer .progress
{
	height: 3px;
	border-radius: 0;
}

.ajax-layer .progress .progress-bar
{
	width: 100%;
}

.ajax-layer .progress.active .progress-bar,
.ajax-layer .progress-bar.active
{
	background-image: -webkit-linear-gradient(90deg, rgba(255, 255, 255, .40) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .40) 50%, rgba(255, 255, 255, .40) 75%, transparent 75%, transparent);
	background-image:      -o-linear-gradient(90deg, rgba(255, 255, 255, .40) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .40) 50%, rgba(255, 255, 255, .40) 75%, transparent 75%, transparent);
	background-image:         linear-gradient(90deg, rgba(255, 255, 255, .40) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .40) 50%, rgba(255, 255, 255, .40) 75%, transparent 75%, transparent);
	background-size: 30%;
	-webkit-animation: progress-bar-stripes 0.8s ease-in-out infinite;
	-o-animation: progress-bar-stripes 0.8s ease-in-out infinite;
	animation: progress-bar-stripes 0.8s ease-in-out infinite;
}

@keyframes progress-bar-stripes
{
	from {
		background-position: 50% 0;
	}
	50% {
		background-position: 0 0;
	}
	to {
		background-position: 50% 0;
	}
}



/** LOGIN */

#AppInstanceConfig
{
	position: absolute;
	top: 5px;
	right: 5px;
	display: inline-block;
	text-align: right;
}

#KioskModeClose
{
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 999888;
	width: 40px;
	height: 40px;
	padding: 0.3em 0.5em;
	background: #E53935;
	box-shadow: -2px 2px 5px 2px rgb(0 0 0);
	border-radius: 0 0 0 4px;
	font-size: 1.5em;
	color: rgba(255, 255, 255, 0.9);
	text-shadow: 1px 1px 1px #000;
	text-align: center;
	-webkit-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
}

#KioskModeClose:hover
{
	background: #B71C1C;
}

#EnableKioskMode
{
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 999888;
	width: 40px;
	height: 40px;
	padding: 0.3em 0.5em;
	background: #8BC34A;
	box-shadow: -2px 2px 5px 2px rgb(0 0 0);
	border-radius: 0 0 0 4px;
	font-size: 1.5em;
	color: rgba(255, 255, 255, 0.9);
	text-shadow: 1px 1px 1px #000;
	text-align: center;
	-webkit-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
}

#EnableKioskMode:hover
{
	background: #558B2F;
}

#BackgroundWrapper
{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: -999999;
	background-color: #333;
	-webkit-transition: background-color 0.3s ease-out 0s;
	-o-transition: background-color 0.3s ease-out 0s;
	-moz-transition: background-color 0.3s ease-out 0s;
	transition: background-color 0.3s ease-out 0s;
}

#BackgroundOverlap
{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: -999996;
	opacity: 1;
	background-color: #333;
	-webkit-transition: opacity 0.3s ease-in-out 0s;
	-o-transition: opacity 0.3s ease-in-out 0s;
	-moz-transition: opacity 0.3s ease-in-out 0s;
	transition: opacity 0.3s ease-in-out 0s;
}

#BackgroundOverlap.fade-out-opacity
{
	opacity: 0;
}

#BackgroundBlurImage
{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: -999997;
	width: 100%;
	height: 100%;
	opacity: 1;
	background-position: center;
	background-size: cover;
	-webkit-transition: opacity 0.3s ease-in-out 0s;
	-o-transition: opacity 0.3s ease-in-out 0s;
	-moz-transition: opacity 0.3s ease-in-out 0s;
	transition: opacity 0.3s ease-in-out 0s;
}

#BackgroundBlurImage.fade-out-opacity
{
	opacity: 0;
}

#BackgroundImage
{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: -999998;
	background-position: center;
	background-size: cover;
}

#DateTimeLogin
{
	position: fixed;
	bottom: 0px;
	left: 0px;
	display: inline-block;
	height: 9em;
	padding-left: 2em;
	opacity: 0;
	-webkit-transition: none;
	-o-transition: none;
	-moz-transition: none;
	transition: none;
}

#DateTimeLogin.show
{
	opacity: 1;
	-webkit-transition: all 0.9s ease-out 0.2s;
	-o-transition: all 0.9s ease-out 0.2s;
	-moz-transition: all 0.9s ease-out 0.2s;
	transition: all 0.9s ease-out 0.2s;
}

#DateTimeLogin .login-time
{
	color: #FFF;
	font-size: 3em;
	text-shadow: 2px 1px 1px #111;
}

#DateTimeLogin .login-date
{
	color: #FFF;
	font-size: 2em;
	opacity: 0.8;
	text-shadow: 2px 1px 1px #111;
}

.unsplash-attribution,
.unsplash-attribution a
{
	margin-top: 10px;
	color: #FFF;
	text-shadow: 0px 1px 1px #111;
	font-size: .8em;
}

.unsplash-attribution a
{
	cursor: pointer !important;
	text-decoration: underline;
}

.unsplash-attribution a:hover
{
	opacity: .7;
}

#Login
{
	padding: 0;
	width: 320px;
	opacity: 0;
	-webkit-transition: opacity 0.8s ease-out 0s;
	-o-transition: opacity 0.8s ease-out 0s;
	-moz-transition: opacity 0.8s ease-out 0s;
	transition: opacity 0.8s ease-out 0s;
}

@media (max-height: 414px)
{
	#Login
	{
		margin-top: 25px;
		margin-bottom: 25px;
	}
}

#Login.show
{
	opacity: 1;
}

#BrandInLoginScreen
{
	text-align: center;
}

#Login .header .copyright
{
	display: inline-block;
	padding: 0 6px;
	margin-top: 12px;
	color: #FFF;
	font-size: .8em;
	text-shadow: 0px 1px 1px #111;
	text-align: right;
	background: rgba(0, 0, 0, .3);
	border-radius: 8px;
}

#Login > .header > hr
{
	border-top: 1px solid rgba(0, 0, 0, .7);
	border-bottom: 1px solid rgba(255, 255, 255, .85);
	opacity: 0.45;
}

#Login > .header > h1
{
	display: block;
	margin: 0 0 20px 0;
	padding: 0;
	font-size: 1.5em;
	color: #FFF;
	text-shadow: -1px -1px 1px #000;
	text-align: center;
}

#Login > .body
{
	text-align: center;
}

#Login > .body > .inner-body
{
	display: inline-block;
	width: 300px;
}

#Login > .body > form
{
	padding: 5px 20px 5px 20px;
	background: rgba(0,0,0,0.5);
	border-radius: 6px;
	margin-bottom: 20px;
}

#Login > .body > form .form-group
{
	margin-top: 1.5em !important;
	margin-bottom: 1.5em !important;
}

#Login > .body > form .form-control
{
	height: 3.1em;
	margin-top: 8px !important;
	margin-bottom: 8px !important;
	font-size: 1em;
	font-weight: normal;
	text-align: center;
	border-color: rgba(0,0,0,0.45);
	box-shadow: inset 2px 2px 6px rgba(0,0,0,0.75);
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

#Login > .body > form .form-control:focus
{
	background-color: rgba(255,255,255,0.85);
	box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85);
}

#Login > .body > .inner-body .btn-primary
{
	box-shadow: 2px 2px 3px rgba(0,0,0,0.8);
}

#Login .input-group-addon
{
	min-width: 150px;
}

#Login .input-group
{
	margin-bottom: 15px;
}



/** NAVBAR */

.user-logged .navbar-fixed-bottom,
.user-logged .navbar-fixed-top
{
	z-index: 1080;
}

.user-logged .navbar-default
{
	background-color: #111;
	background: -webkit-linear-gradient(#333, #000); /* For Safari 5.1 to 6.0 */
	background:      -o-linear-gradient(#333, #000); /* For Opera 11.1 to 12.0 */
	background:    -moz-linear-gradient(#333, #000); /* For Firefox 3.6 to 15 */
	background:         linear-gradient(#333, #000); /* Standard syntax */
	color: #FFF;
	border-color: transparent;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	transition: background .3s ease;
}

.user-logged .navbar-default .navbar-header > .navbar-button
{
	position: relative;
	padding: 0;
	margin-top: 8px;
	margin-right: 15px;
	margin-bottom: 8px;
	width: 42px;
	height: 34px;
	background-color: transparent;
	border: 1px solid #CCC;
	border-radius: 4px;
	color: #888;
	font-size: 18px;
	text-align: center;
}

.user-logged .navbar-default .navbar-header > .navbar-button > .glyphicon
{
	line-height: 32px;
}

.user-logged .navbar-default .navbar-header > .navbar-button:focus,
.user-logged .navbar-default .navbar-header > .navbar-button:hover
{
	outline: 0;
	background: #DDD;
}

.user-logged .navbar-default .navbar-right
{
	margin-right: 0;
}

.user-logged .navbar-default .navbar-brand
{
	padding: 5px 8px 0 8px;
}

.logo-wrapper
{
	width: 40px;
	height: 40px;
}

.logo
{
	position: relative;
	width: 100%;
	height: 100%;
	border: 10px solid var(--kairos-primary-color);
	border-radius: 50%;
	animation: logoNavbarIntro 6s ease-out 1;
	animation-fill-mode: forwards;
	transform-origin: center;
	transform: scale(.8);
	transition: border .5s ease;
}

.logo.animate-on
{
	animation: logoNavbarLoading 2s ease-out infinite;
}

.arrow,
.logo-end
{
	position: absolute;
	top: -14px;
	left: 50%;
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid var(--kairos-primary-color);
	transform: rotate(-0deg);
	transition: border .5s ease;
}

.logo-end
{
	border-left: 10px solid #000;
	transform: translateX(5px);
}

body.no-internet .logo
{
	border-color: #999;
}

body.no-internet .arrow
{
	border-left-color: #999;
}

body.no-internet .logo-end
{
	border-left-color: #555;
}

body.no-internet.user-logged .navbar-default
{
	background-color: #666;
	background: -webkit-linear-gradient(#666, #666); /* For Safari 5.1 to 6.0 */
	background:      -o-linear-gradient(#666, #666); /* For Opera 11.1 to 12.0 */
	background:    -moz-linear-gradient(#666, #666); /* For Firefox 3.6 to 15 */
	background:         linear-gradient(#666, #666); /* Standard syntax */
	border-bottom: 1px solid #333;
}

body.no-internet header
{
	background-color: #666;
}

@keyframes logoNavbarIntro
{
	0%
	{
		transform: rotate(0deg) scale(.8);
	}

	20%
	{
		transform: rotate(360deg) scale(1);
	}

	100%
	{
		transform: rotate(360deg) scale(.8);
	}
}

@keyframes logoNavbarLoading
{
	0%
	{
		transform: rotate(0deg) scale(.8);
	}

	50%
	{
		transform: rotate(180deg) scale(1);
	}

	100%
	{
		transform: rotate(360deg) scale(.8);
	}
}

.user-logged .navbar-default .navbar-nav > li > a
{
	box-sizing: border-box;
	height: 50px;
	padding-right: 7px;
	padding-left: 7px;
	color: #CCC;
	text-shadow: -1px -1px 1px #000;
	-webkit-transition: background-color .3s ease-out;
	-o-transition: background-color .3s ease-out;
	-moz-transition: background-color .3s ease-out;
	transition: background-color .3s ease-out;
}

.user-logged .navbar-default .navbar-nav li > a
{
	cursor: default;
}

.user-logged .navbar-default .navbar-nav li > a[href]
{
	cursor: pointer;
}

.user-logged .navbar-default .navbar-nav > li > a .glyphicon
{
	margin-left: 5px;
	margin-right: 5px;
	color: var(--kairos-primary-color);
}

.user-logged .navbar-default .navbar-nav > li > a .badge-group .badge
{
	position: relative;
	top: -10px;
}

.user-logged .navbar-default .navbar-nav > li > a .badge-group .glyphicon
{
	margin-left: -6px;
}

.user-logged .navbar-default .navbar-nav > li > a:hover,
.user-logged .navbar-default .navbar-nav > li > a:focus,
.user-logged .navbar-default .navbar-nav > .active > a,
.user-logged .navbar-default .navbar-nav > .active > a:hover,
.user-logged .navbar-default .navbar-nav > .active > a:focus,
.user-logged .navbar-default .navbar-nav > li:hover > a
{
	color: #FFF;
	background: #444;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.user-logged .navbar-default .navbar-nav > li.divider
{
	padding: 0;
	margin: 0;
	width: 0;
	height: 50px;
	border-left: 1px solid rgba(0, 0, 0, .3);
	border-right: 1px solid rgba(255, 255, 255, .2);
}

.user-logged .navbar-default .navbar-nav ul
{
	display: none;
	overflow: hidden;
	position: fixed;
	top: 50px;
	z-index: 1;
	padding: 0;
	margin: 0;
	/*max-height: 400px;*/
	background: #444;
	border: 1px solid #222;
	box-shadow: 0 0 4px 1px #111, 0 0 2px #FFF;
}

.user-logged .navbar-default .navbar-nav ul > li,
.user-logged .navbar-default .navbar-nav ul > li.divider
{
	margin: 0;
	padding: 0;
	list-style: none;
}

.user-logged .navbar-default .navbar-nav > li li > a
{
	position: relative;
	display: block;
	height: 30px;
	margin: 0;
	padding: 0 10px;
	color: #CCC;
	line-height: 30px;
	text-decoration: none;
	cursor: default;
	-webkit-transition: background-color .3s ease-out;
	-o-transition: background-color .3s ease-out;
	-moz-transition: background-color .3s ease-out;
	transition: background-color .3s ease-out;
}

.user-logged .navbar-default .navbar-nav .navbar-nav-text
{
	display: inline-block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 100%;
	padding-right: 15px;
}

.user-logged .navbar-default .navbar-nav li > a:hover,
.user-logged .navbar-default .navbar-nav li.active > a,
/*.user-logged .navbar-default .navbar-nav > li li > a:hover,
.user-logged .navbar-default .navbar-nav > li li.active > a,*/
.user-logged .navbar-default .navbar-nav > li:hover li:hover > a
{
	background: #222;
	color: var(--kairos-primary-color);
}

.user-logged .navbar-default .navbar-nav li > a > .pull-right
/*.user-logged .navbar-default .navbar-nav > li li > a > .pull-right*/
{
	position: absolute;
	right: 8px;
	font-size: 8px;
	line-height: 30px;
	margin-right: 5px;
	margin-left: 5px;
}

.user-logged .navbar-default .navbar-nav ul > li.divider
{
	border-top: 1px solid rgba(0, 0, 0, .4);
	border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.user-logged .navbar-default .navbar-right
{
	margin-right: 10px;
}

.collapse .backdrop
{
	display: none;
	visibility: hidden;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.4);
	opacity: 0;
	filter: alpha(opacity=0);
	-webkit-transition: all .3s ease-in;
	-o-transition: all .3s ease-in;
	-moz-transition: all .3s ease-in;
	transition: all .3s ease-in;
}

.navbar-nav-mobile-header
{
	padding: 10px 0;
	background: rgba(0, 0, 0, 0.4);
}

.navbar-nav-mobile-header .glyphicon.user-image
{
	border-radius: 50%;
	width: 1.5em;
	height: 1.5em;
	border: 1px solid #FFF;
	font-size: 3em;
	line-height: 1.3em;
	box-shadow: 0 0 10px rgba(255, 255, 255, .3);
	margin-bottom: 10px;
}

@media (max-width: 767px) {
	.navbar-default #NavbarCollapseMenu.navbar-collapse,
	#NavbarCollapseMenu.navbar-collapse
	{
		position: fixed;
		top: 0;
		left: -85%;
		width: 80%;
		height: 100%;
		background: #444;
		display: block;
		visibility: visible;
		border: none;
		-webkit-transition-timing-function: ease-out;
		-o-transition-timing-function: ease-out;
		transition-timing-function: ease-out;
		-webkit-transition-duration: .1s;
		-o-transition-duration: .1s;
		transition-duration: .1s;
		-webkit-transition-property: left;
		-o-transition-property: left;
		transition-property: left;
	}

	.navbar-fixed-top #NavbarCollapseMenu.navbar-collapse
	{
		max-height: 100%;
		min-height: 100%;
	}

	.collapse.in
	{
		display: block !important;
		visibility: visible !important;
		left: 0 !important;
	}

	.navbar-nav li > ul
	{
		background: rgba(0,0,0,.2) !important;
	}

	.collapse.in .backdrop {
		display: block;
		visibility: visible;
		opacity: 1;
		filter: alpha(opacity=1);
	}
}



/** NOTIFICACIONES */

.user-logged .navbar-default .navbar-nav .lst-notificaciones
{
	overflow: auto;
	height: 400px;
	width: 300px;
	border: 3px solid #444;
	border-radius: 0 0 6px 6px;
	margin: 0;
	padding: 0;
	box-shadow: 0 0 6px #CCC;
}

.user-logged .navbar-default .navbar-collapse > .lst-notificaciones
{
	height: auto;
	margin: 0;
	padding: 0;
}

.user-logged .navbar-default .navbar-nav .lst-notificaciones li.empty
{
	margin-top: 160px;
	text-align: center;
}

.user-logged .navbar-default .navbar-collapse > .lst-notificaciones li.empty
{
	text-align: center;
	margin-top: 10px;
	margin-bottom: 10px;
}

.lst-notificaciones li.empty .glyphicon
{
	font-size: 40px;
	color: #44B0FE;
}

.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li
{
	display: block;
}

.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.notificacion.first-child
{
	margin-top: 30px;
}

.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.notificacion.first-child
{
	padding-top: 35px;
}

.lst-notificaciones li.notificacion + li.notificacion
{
	margin-top: 3px;
}

.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.notificacion > a,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.notificacion > a
{
	display: block;
	background: #FFF;
	color: #000;
	line-height: normal;
	text-decoration: none;
	width: auto;
	height: auto;
	padding: 10px;
	margin: 0;
	box-shadow: 0 0 2px #000;
	-webkit-transition: background 1s ease-out;
	-o-transition: background 1s ease-out;
	-moz-transition: background 1s ease-out;
	transition: background 1s ease-out;
}

.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.notificacion:hover > a,
.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.notificacion > a:hover,
.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.notificacion.highlight > a,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.notificacion.highlight > a,
.row.notificacion.highlight
{
	background: #EEDBB5 !important;
}

.lst-notificaciones .usuario
{
	font-weight: bold;
	/*color: #44B0FE;*/
	color: #2178b7;
}

.lst-notificaciones .descripcion
{
	color: #000;
}

.lst-notificaciones .fecha-hora
{
	color: #666;
}

.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.top,
.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.top:hover,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top:hover
{
	position: fixed;
	z-index: 1;
	width: 277px;
	background: #444;
}


.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top:hover
{
	left: 0;
	right: 0;
	width: 100%;
	background: #111;
	box-shadow: 0 0 6px rgba(0, 0, 0, .7);
}

.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top > a
{
	padding: 10px;
}

.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.top > a,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top > a
{
	display: inline-block;
}

.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.top:hover > a,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top > a,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top > a:link,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top > a:focus,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top > a:active,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top > a:visited,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top:hover > a
{
	background: transparent !important;
	color: #CCC !important;
}

.user-logged .navbar-default .navbar-nav .lst-notificaciones > li.top > a:hover,
.user-logged .navbar-default .navbar-collapse > .lst-notificaciones > li.top > a:hover
{
	background: #222 !important;
	color: var(--kairos-primary-color) !important;
	border-radius: 3px 3px 0 0;
}

#NavbarCollapseNotificaciones
{
	background: #444;
}

#NavbarCollapseNotificaciones .backdrop
{
	z-index: -1;
	-webkit-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	transition: all .2s ease-out;
}



/** HEADER */

header
{
	background-color: #333;
	width: 100%;
	min-height: 70px;
	margin: 50px 0 0 0;
	padding: 0 0 15px 0;
	color: #FFF;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   transition: background .5s ease;
}

header h1,
.fab-menu h1
{
	display: inline-block;
	margin: 0;
	padding: 0;
	color: #FFF;
	text-shadow: -1px -1px 1px #000;
}

.fab-menu h1
{
	text-align: center;
	margin-bottom: 25px;
}

header h1 > .square-brackets,
header h1 > .text-overflow > .square-brackets
{
	color: #00838F;
}

header h1 > .subheader,
.fab-menu h1 > .subheader,
header h1 > .text-overflow > .subheader,
.fab-menu h1 > .text-overflow > .subheader
{
	font-size: medium;
	color: var(--kairos-primary-color);
}

.fab-menu h1 > .subheader
{
	font-size: large;
	font-weight: bold;
}

header h1 > .header,
.fab-menu h1 > .header,
header h1 > .text-overflow > .header,
.fab-menu h1 > .text-overflow > .header
{
	font-size: large;
}

.fab-menu h1 > .header
{
	font-size: x-large;
}

header h1 > .text-overflow
{
	display: inline-block;
}

header h1 > .text-overflow > .square-brackets,
header h1 > .text-overflow > .subheader
{
	display: inline;
}

header > *:last-child
{
	margin-bottom: 15px !important;
}

header.fixed-on-scroll > *:last-child
{
	margin-bottom: 10px !important;
}

header .metadata
{
	float: right;
	display: inline-block;
	list-style: none;
	line-height: 50px;
	padding: 0;
	margin: 0;
}

header .metadata > li
{
	float: right;
	display: inline-block;
	white-space: nowrap;
	padding: 0;
	margin: 0;
}

header .metadata > li .label
{
	font-weight: bold;
}

header #TopNav,
header .TopNav
{
	display: block;
	padding: 0;
	margin: 0 10px 10px 10px;
	clear: both;

	display: flex;
}

header .flex-row
{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	flex-direction: row;
	margin: 0 auto;
	padding: 0 15px;
}

header .flex-row > .flex-item.item-1,
header .flex-row > .flex-item.item-2
{
	flex: 1 0 50%;
	order: 0;
}

header .flex-row > .flex-item.item-3
{
	flex: 1 0 100%;
	order: 1;
}

.modal-header .TopNav
{
	display: block;
	padding: 0;
	margin: 0;
}

header #TopNav > *,
header .TopNav > *,
.TopNav > *
{
	display: inline-block;
	vertical-align: middle;
	margin-top: 5px;
	margin-bottom: 5px;
}

.input-group-pagination
{
	width: 260px;
}

.input-group-pagination .form-control
{
	text-align: center;
	width: 50%;
	padding: 5px;
}

.input-group-search
{
	width: 100%;
}

.input-group-custom
{
	display: inline-block;
}

.input-group-custom.w260
{
	width: 260px;
}

#TopNav .nav-tabs,
.TopNav .nav-tabs
{
	overflow: hidden;
	width: 100%;
	white-space: nowrap;
	margin: 10px 0 -10px 0;
	border: none;

	overflow: auto hidden;
	width: auto;
	flex-grow: 1;
	order: 1;
}

.modal-header .TopNav .nav-tabs
{
	margin: 10px 0 -16px 0;
}

#TopNav > .pull-right,
.TopNav > .pull-right
{
	flex-shrink: 0;
	order: 2;
	text-align: right;
	float: none !important;
}

#TopNav .nav-tabs > li,
.TopNav .nav-tabs > li
{
	display: inline-block;
	float: none;
}

#TopNav .nav-tabs > li > a,
.TopNav .nav-tabs > li > a
{
	color: #FFF;
	background-image: url(../img/btn-circle-bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 0%;
	-webkit-transition: background-size  0s ease-in 0s;
	-o-transition: background-size  0s ease-in 0s;
	-moz-transition: background-size  0s ease-in 0s;
	transition: background-size  0s ease-in 0s;
}

#TopNav .nav > li > a:hover,
#TopNav .nav > li > a:focus,
#TopNav .nav-tabs > li.active > a:focus,
.TopNav .nav > li > a:hover,
.TopNav .nav > li > a:focus,
.TopNav .nav-tabs > li.active > a:focus
{
	color: #1D5E7D;
	background-color: #EEEEEE;
}

#TopNav .nav-tabs > li > a:active,
#TopNav .nav-tabs > li.active > a,
.TopNav .nav-tabs > li > a:active,
.TopNav .nav-tabs > li.active > a
{
	color: #1D5E7D;
	background-color: #EEEEEE;
	/*border-color: #666666;*/
	/*box-shadow: inset 0 3px 2px -2px #222;*/
	background-image: url(../img/btn-circle-bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 0%;
	-webkit-transition: background-size  0s ease-in 0s;
	-o-transition: background-size  0s ease-in 0s;
	-moz-transition: background-size  0s ease-in 0s;
	transition: background-size  0s ease-in 0s;
}

#TopNav .nav-tabs > li > a:hover,
#TopNav .nav-tabs > li.active > a:hover,
.TopNav .nav-tabs > li > a:hover,
.TopNav .nav-tabs > li.active > a:hover
{
	background-size: 300%;
	-webkit-transition: background-size  0.6s ease-in 0s;
	-o-transition: background-size  0.6s ease-in 0s;
	-moz-transition: background-size  0.6s ease-in 0s;
	transition: background-size  0.6s ease-in 0s;
}


/** NAV TABS */
.nav.nav-tabs.scroll-content
{
	margin: 0 !important;
}

.scrollbar-macosx-static > .scroll-element .scroll-bar
{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)" !important;
	filter: alpha(opacity=70) !important;
	opacity: 0.7 !important;
}

#TopNav .nav-tabs > li.top-nav-alert,
.TopNav .nav-tabs > li.top-nav-alert
{
	display: none;
	float: right;
	margin: 0;
	padding: 5px;
	font-size: 85%;
}

.fixed-tab-nav,
.fixed-tab-nav-button
{
	position: fixed;
	z-index: calc(1 + var(--base-z-index, 0));
	left: 15px;
	min-width: 250px;
	opacity: 0;
	-webkit-transition: opacity 0.5s ease-out 0s;
	-o-transition: opacity 0.5s ease-out 0s;
	-moz-transition: opacity 0.5s ease-out 0s;
	transition: opacity 0.5s ease-out 0s;
}

.show
{
	opacity: 1;
}



/** BOTTOM BAR */
.bottom-bar
{
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 100;
	width: 100%;
	background: #FFF;
	border-top: 1px solid #CCC;
	box-shadow: 0 0 3px rgba(0, 0, 0, .2);
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.bottom-bar .btn
{
	border-top-color: transparent;
	border-radius: 0;
}

.bottom-bar .btn + .btn
{
	border-left-color: transparent;
}



/* PAGE CONTENT */
#Page .container-fluid
{
	overflow: auto;
	background: #EEEEEE;
	border-radius: 6px 6px 0 0;
	color: var(--text-color);
	box-shadow: 0px -2px 4px rgba(0, 0, 0, .75);
	width: 100%;
	padding-top: 15px;
	padding-bottom: 15px;
	margin-top: -20px;
}

#Page .container-fluid.no-padding
{
	padding: 0;
}

#Page header.hidden + .container-fluid
{
	margin-top: 51px;
}

.bg-page
{
	background: #EEEEEE;
}

.panel-title .btn-group
{
	margin-top: -11px;
}

.panel-title .btn-group > .btn-group
{
	margin-top: 0px;
}

.panel-title-editable
{
	position: relative;
	color: #FFF;
}

.panel-title-editable > .pull-right,
.panel-title-editable > .pull-left
{
	position: absolute;
	top: 0;
	z-index: calc(1 + var(--base-z-index, 0));
}

.panel-title-editable > .pull-right
{
	right: 0;
}

.panel-title-editable > .pull-left
{
	left: 0;
}

.panel-title-editable .form-control[readonly]:not(.error)
{
	background-color: #F0F0F0;
	border-color: transparent;
	outline-color: transparent;
	box-shadow: none;
	font-size: 14px;
	cursor: default;
}

.panel-title-editable .form-control.error
{
	background-color: rgba(255,200,200,1) !important;
}

.panel-subheading,
.panel-subheading td,
.panel-subheading th,
.table > tbody > tr td.panel-subheading,
.table > tbody > tr th.panel-subheading
{
	background: #666;
	color: #FFF;
	padding: 3px 5px;
	font-weight: bold;
}

.panel-subheading-dark,
.panel-subheading-dark td,
.panel-subheading-dark th,
.table > tbody > tr td.panel-subheading-dark,
.table > tbody > tr th.panel-subheading-dark
{
	background: #007297;
	color: #FFF;
	padding: 3px 5px;
	font-weight: bold;
}

.panel-subheading-light,
.panel-subheading-light td,
.panel-subheading-light th,
.table > tbody > tr td.panel-subheading-light,
.table > tbody > tr th.panel-subheading-light
{
	background: var(--primary-color);
	color: #FFF;
	padding: 3px 5px;
	font-weight: bold;
}

.row-condensed > *
{
	padding: 1px;
}

.scroll-wrapper > .panel-body
{
	height: inherit !important;
}

.panel-body.padding-fix
{
	padding-top: 0;
	padding-bottom: 0;
}

.panel-body.list-group
{
	padding: 0;
}

.fg-bordered .panel-body,
.fg-bordered .list-group
{
	padding: 0;
}

.fg-bordered .panel-body .form-group,
.fg-bordered .list-group .list-group-item
{
	padding: 10px 15px 10px 12px;
	margin: 0;
	border-left: 3px solid transparent;
	-webkit-transition: border-left-color .15s ease-in 0s;
	-o-transition: border-left-color .15s ease-in 0s;
	-moz-transition: border-left-color .15s ease-in 0s;
	transition: border-left-color .15s ease-in 0s;
}

.fg-bordered .panel-body .form-group + .form-group,
.fg-bordered .list-group .list-group-item + .list-group-item
{
	border-top: 1px solid #ddd;
}

.fg-bordered .list-group .list-group-item
{
	border-bottom: none;
}

.fg-bordered .panel-body .form-group + h4,
.fg-bordered .panel-body h4 + .form-group,
.fg-bordered .list-group .list-group-item + h4,
.fg-bordered .list-group h4 + .list-group-item
{
	border-top: 1px solid #ddd;
	/* border-bottom: none; */
}

.fg-bordered .panel-body .form-group:hover,
.fg-bordered .panel-body .form-group.selected,
.fg-bordered .list-group .list-group-item:hover,
.fg-bordered .list-group .list-group-item.selected
{
	border-left-color: var(--primary-color);
}

/* TODO
.fg-bordered .panel-body .form-control,
.fg-bordered .panel-body .form-control:focus
{
	background: transparent;
	border: none;
	box-shadow: none;
}

.fg-bordered .panel-body .form-group:focus-within
{
	background-color: #fafafa;
}
*/

.fg-bordered .panel-body > h4,
.fg-bordered .list-group > h4
{
	background-color: #F0F0F0;
	border-left: 2px solid var(--primary-color);
	margin: 0;
	padding: 10px 15px;
}

.panel-busqueda
{
	height: 300px;
	overflow: hidden;
	padding: 0;
}

.panel-busqueda > select
{
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}

.panel-table,
.panel-scrollable
{
	margin: 0;
}

.panel-table .panel-heading .pull-right,
.panel-scrollable .panel-heading .pull-right,
{
	margin-top: -7px;
}

.panel-table .panel-heading > .row
{
	font-size: 16px;
	line-height: 1.1em;
}

.panel-table .panel-body
{
	overflow: auto;
	padding-top: 0;
	padding-bottom: 0;
}

.panel-table.max-height .panel-body
{
	overflow: visible;
}

.panel-scrollable .panel-body
{
	overflow: auto;
}

.panel-table .panel-body > .row
{
	padding-top: 8px;
	padding-bottom: 8px;
	border-bottom: 1px solid #ddd;
	-webkit-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	transition: all .2s ease-out;
}

.panel-table .panel-body > .row:not(.no-hover):not(.active):hover
{
	background: #F5F5F5;
}

.panel-table .panel-body > .row.active
{
	background: #DEDEDE;
}

/* Buttons Fade-in and Fade-out */
.buttons-fifo-row .buttons-fifo-col
{
	position: relative;
}

.buttons-fifo-row .buttons-fifo
{
	position: absolute;
	top: 0;
	right: 15px;
	opacity: 0;
	z-index: calc(-1 + var(--base-z-index, 0));
	transition-property: all;
	transition-duration: 0.3s;
}

.buttons-fifo-row:hover .buttons-fifo
{
	opacity: 1;
	z-index: initial;
	transition-property: all;
	transition-duration: 0.3s;
}

/* TO REMOVE */
/*.panel-table .panel-body > .row:hover > .hidden
{
	display: block !important;
	visibility: visible !important;
}*/

/*.panel-table .panel-body > .row:hover > .to-hide
{
	display: none !important;
	visibility: hidden !important;
}*/

/*.panel-table .btn + .btn*/
.panel-table .panel-heading .btn
{
	margin-top: 5px;
}

.btn-group .btn + .btn
{
	margin-left: 0;
}

.input-group-addon.bg-default
{
	background-color: #FFF;
}

.input-group-addon.bg-danger
{
	color: #FFF;
	background-color: #d9534f;
	border-color: #d9534f;
}



/** TECLADO */

.teclado .panel-title
{
	overflow: hidden;
	min-height: 1.05em;
	max-height: 1.05em;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.modalHost .teclado
{
	min-width: 300px;
}


/** FLOATING ACTION BUTTOM (FAB) */
.fab
{
	display: block;
	position: fixed;
	bottom: 25px;
	right: 25px;
	z-index: calc(1091 + var(--base-z-index, 0));
}

.fab > .btn
{
	width: 60px;
	height: 60px;
	border-radius: 50%;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, .6);
}

.fab-menu-wrapper
{
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: calc(1090 + var(--base-z-index, 0));
	background-color: rgba(0, 0, 0, .7);
}

.fab-menu-wrapper.show
{
	display: block;
}

.fab-menu
{
	display: flex;
	width: 100%;
	height: 100%;
	padding: 25px 25px 90px 25px;
	flex-direction: column;
	justify-content: flex-end;
	align-items: stretch;
}

.fab-menu > *
{
	margin-top: 10px;
	margin-bottom: 10px;
}

.fab-menu > .btn
{
	font-size: 1.5em;
	box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
}

.fab-menu > hr
{
	border-top: 2px dashed rgba(255, 255, 255, .6);
	width: 100%;
	margin: 20px 0;
}

.fab-menu h1 .badge
{
	white-space: initial !important;
}



/** FLEXBOX */
.flex-box
{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.flex-box > .flex-col
{
	flex-grow: 1;
	display: block;
	text-align: center;
	border-color: #ccc;
	border-right-width: 1px;
	border-right-style: solid;
	padding-top: 6px;
	padding-bottom: 6px;
}

.flex-box > .btn.flex-col
{
	border-top-width: 0;
	border-bottom-width: 0;
	border-left-width: 0;
	/*border-width: 0;*/
	border-radius: 0;
}

.flex-box.col-padding-lg > .flex-col
{
	padding-top: 12px;
	padding-bottom: 12px;
}

.flex-box > .flex-col:last-child
{
	border-right-width: 0;
}

.flex-box > .flex-col.flex-grow-1
{
	flex-grow: 1;
}

.flex-box > .flex-col.flex-grow-2
{
	flex-grow: 2;
}

.flex-box.flex-box-2-1
{
	flex-wrap: wrap;
}

.flex-box.flex-box-2-1 > .flex-col
{
	border-bottom-width: 1px;
	border-bottom-style: solid;
}

.flex-box.flex-box-2-1 > .flex-col:nth-child(odd)
{
	width: 66.6666%;
}

.flex-box.flex-box-2-1 > .flex-col:nth-child(even)
{
	width: 33.3333%;
	border-right-width: 0;
}

select.flat-select
{
	background: transparent;
	border-color: transparent;
	box-shadow: none;
	padding: 0;
	margin: 0;
	border-width: 0;
	font-weight: normal;
}


/** TABLE */

.table-white
{
	background: #FFF;
}

.table-border-radius
{
	overflow: hidden;
	border-radius: 6px;
}

.border-right
{
	border-right: 1px solid #666 !important;
}

.table-shadow
{
	box-shadow: 0 0 3px #333;
}

.table-padding-sm td,
.table-padding-sm th
{
	padding: 10px !important;
}

.table-cell-middle td,
.table-cell-middle th
{
	vertical-align: middle !important;
}

.table > tfoot > tr:first-child > td,
.table > tfoot > tr:first-child > th
{
	border-top-width: 2px;
}

.table-report > thead > tr > th,
.table-report > thead > tr > td
{
	background: #F5F5F5;
	color: #000;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
}

.table > tbody > tr.selected > td
{
	background: #F5F5F5;
}

.table-hover > tbody > tr.no-hover.active:hover td,
.table-hover > tbody > tr.no-hover.active:hover th
{
	background: #f5f5f5;
}

.table > thead > tr.text-center td,
.table > thead > tr.text-center th,
.table > tbody > tr.text-center td,
.table > tbody > tr.text-center th,
.table > tfoot > tr.text-center td,
.table > tfoot > tr.text-center th
{
	text-align: center;
}

.table > thead > tr.text-middle td,
.table > thead > tr.text-middle th,
.table > tbody > tr.text-middle td,
.table > tbody > tr.text-middle th,
.table > tfoot > tr.text-middle td,
.table > tfoot > tr.text-middle th
{
	vertical-align: middle;
}

.table > thead > tr > th,
.table > thead > tr > td,
div.table > div.thead > div.tcol
{
	background-color: #F0F0F0;
	border-bottom-color: var(--primary-color);
	color: #000;
	vertical-align: middle;
	-webkit-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	transition: all .2s ease-out;
}

.table > thead > tr.selected > th,
.table > thead > tr.selected > td
{
	background-color: var(--primary-color);
	border-bottom-color: #005571;
	color: #FFF;
}

.table > thead > tr.selected a,
.table > thead > tr.selected a:hover
{
	color: #FFF;
}

.table > thead > tr.selected > th .text-secundary,
.table > thead > tr.selected > td .text-secundary
{
	color: rgba(255, 255, 255, .7);
}

.plantilla-de-reporte .table > tbody:last-child > tr:last-child > td,
.plantilla-de-reporte .table > tbody:last-child > tr:last-child > th
{
	border-bottom: 2px solid var(--primary-color);
}

.table > tfoot > tr:first-child > th,
.table > tfoot > tr:first-child > td
{
	border-top-color: var(--primary-color);
	color: #000;
}

.input-cell
{
	position: relative;
}

.input-cell > *
{
	position: absolute;
	top: 1px;
	left: 1px;
	right: 1px;
	bottom: 1px;
	height: initial;
}

.table > * > tr > *.grid-form-control
{
	position: relative;
	padding: 0;
}

*.grid-form-control .form-control
{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	width: 100% !important;
	/*height: 100% !important;*/
	height: initial;
	border-radius: 0;
	border: none;
}

*.grid-form-control .form-control:focus
{
	background: #EFEFEF;
}

div.table
{
	width: 100%;
}

div.table div.thead
{
	display: grid;
	grid-template-columns: var(--grid-template-rows, 1fr);
}



/** TABLE SCROLLABLE */
.table-scrollable
{
	/* width: 100%; */ /* Optional */
	/* border-collapse: collapse; */
	border-spacing: 0;
	/*border: 2px solid black;*/
}

.table-scrollable-fade-in
{
	visibility: hidden;
}

.table-scrollable tbody,
.table-scrollable thead
{
	display: block;
}

.table-scrollable thead tr th
{
	/*height: 30px;*/
	/*line-height: 30px;*/
	/* text-align: left; */
}

.table-scrollable tbody
{
	height: 300px; /* It can be setting by style attribute */
	overflow-y: auto;
	/*overflow-x: hidden;*/
}

/*.table-scrollable tbody
{
	border-top: 2px solid black;
}*/

.table-scrollable tbody td, thead th
{
	/* width: 20%; */ /* Optional */
	/*border-right: 1px solid black;*/
	/* white-space: nowrap; */
}

.table-scrollable tbody td:last-child, thead th:last-child
{
	/*border-right: none;*/
}

.table-vh-scrollable
{
	display: block;
	overflow: auto;
}

.table-vh-scrollable > table
{
	width: initial;
	max-width: initial;
	height: initial;
	max-height: initial;
}



/** MODAL DIALOG */

.messageBox
{
	overflow: hidden;
}

.messageBox > *:first-child
{
	border-radius: inherit;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}

.messageBox .modal-header,
.messageBox.success .modal-header
{
	background: #333;
	color: #FFF;
}

.messageBox.error .modal-header
{
	background: #D9534F;
	color: #FFF;
}

.messageBox.warning .modal-header
{
	background: #F0AD4E;
	color: #FFF;
}

.modal-body-overflow-sm
{
	max-height: 400px;
	overflow: auto;
}

.modal-body button.close
{
	position: fixed;
	top: 25px;
	right: 25px;
	float: none;
	z-index: calc(1 + var(--base-z-index, 0));
}

button.close
{
	background-color: rgba(255, 255, 255, 0.1);
	padding: 6px 10px;
	border: 1px solid transparent;
	border-radius: 4px;
	opacity: 1;
	-webkit-transition: border-color, background-color 0.5s ease-out 0s;
	-o-transition: border-color, background-color 0.5s ease-out 0s;
	-moz-transition: border-color, background-color 0.5s ease-out 0s;
	transition: border-color, background-color 0.5s ease-out 0s;
}

button.close:hover
{
	background-color: rgba(255, 255, 255, 0.4);
	border-color: rgba(0, 0, 0, .6);
}

button.close:focus,
button.close:active
{
	background-color: rgba(255, 255, 255, 0.8);
	border-color: #000;
	color: #000;
}

/*** MAPS */
.map-fixed
{
	width: 100%;
	z-index: calc(1 + var(--base-z-index, 0));
}

.map-fixed .height-400px
{
	height: 400px;
}

.custom-map-control-button {
	background-color: #fff;
	border: 0;
	border-radius: 2px;
	box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.3);
	margin: 10px;
	padding: 0 0.5em;
	font: 400 18px Roboto, Arial, sans-serif;
	overflow: hidden;
	height: 40px;
	cursor: pointer;
}
.custom-map-control-button:hover {
	background: rgb(235, 235, 235);
}



/*** ESTILOS VARIOS */
.panel-default
{
	box-shadow: 0 0 3px 0 #bbb;
	border: 1px solid #bbb;
}

.panel-default > .panel-heading
{
	background: var(--panel-head-bgcolor);
	border-color: #ccc;
	box-shadow: 0 1px 3px #eee;
	color: var(--panel-head-color);
	font-weight: 500;
}

.panel-default > .panel-heading .panel-title label,
.panel-default > .panel-heading .panel-title span
{
	color: inherit;
	font-size: inherit;	
	font-weight: inherit;	
}

.no-border-top-radius,
.no-border-top-right-radius
{
	border-top-right-radius: 0 !important;
}

.no-border-top-radius,
.no-border-top-left-radius
{
	border-top-left-radius: 0 !important;
}

.no-border-bottom-radius,
.no-border-bottom-right-radius
{
	border-bottom-right-radius: 0 !important;
}

.no-border-bottom-radius,
.no-border-bottom-left-radius
{
	border-bottom-left-radius: 0 !important;
}

.row.selected,
.row.selected:hover
{
	border-radius: 4px 0 0 4px;
	border-left: 2px solid var(--primary-color);
	background-color: #E9E9E9 !important;
}

.btn-primary,
.btn-primary.disabled, .btn-primary.disabled.active, .btn-primary.disabled.focus, .btn-primary.disabled:active, .btn-primary.disabled:focus, .btn-primary.disabled:hover, .btn-primary[disabled], .btn-primary[disabled].active, .btn-primary[disabled].focus, .btn-primary[disabled]:active, .btn-primary[disabled]:focus, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary, fieldset[disabled] .btn-primary.active, fieldset[disabled] .btn-primary.focus, fieldset[disabled] .btn-primary:active, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary:hover
{
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}

.btn-primary.active, .btn-primary.focus,
.btn-primary:active, .btn-primary:focus,
.btn-primary:hover, .open > .dropdown-toggle.btn-primary
{
	background-color: #007297;
	border-color: #007297;
	color: #eee;
}

.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover
{
	background-color: #EEE;
	color: #000;
}

.list-group-item.active .text-secundary, .list-group-item.active:focus .text-secundary, .list-group-item.active:hover .text-secundary
{
	color: #999;
}

.list-group-item.fade-bg-color
{
	-webkit-transition: background-color 0.5s ease-out 0s;
	-o-transition: background-color 0.5s ease-out 0s;
	-moz-transition: background-color 0.5s ease-out 0s;
	transition: background-color 0.5s ease-out 0s;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:focus,
.dropdown-menu > .active > a:hover
{
	background-color: var(--primary-color) !important;
}

/** AJAX Uploader Drag & Drop */
.upload-area
{
	position: relative;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 200px;
	border: 2px dashed #999;
	border-radius: 4px;
	margin: 0;
	text-align: center;
	overflow: hidden;
	-webkit-transition: background-color 0.5s ease-out 0s;
	-o-transition: background-color 0.5s ease-out 0s;
	-moz-transition: background-color 0.5s ease-out 0s;
	transition: background-color 0.5s ease-out 0s;
}

.upload-area:hover
{
	background: #DEDEDE;
}

.upload-area.blur-image-loaded:hover .blur-image,
.upload-area.image-loaded:hover .image
{
	opacity: .1;
}

.upload-area.image-loaded:hover .title-area
{
	opacity: 1;
}

.upload-area .blur-image
{
	position: absolute;
	top: 0;
	left: 0;
	max-width: 100%;
	max-height: 100%;
	opacity: 0;
	-webkit-transition: opacity 0.2s ease-out 0s;
	-o-transition: opacity 0.2s ease-out 0s;
	-moz-transition: opacity 0.2s ease-out 0s;
	transition: opacity 0.2s ease-out 0s;
}

.upload-area .image
{
	position: absolute;
	opacity: 0;
	-webkit-transition: opacity 0.2s ease-out 0s;
	-o-transition: opacity 0.2s ease-out 0s;
	-moz-transition: opacity 0.2s ease-out 0s;
	transition: opacity 0.2s ease-out 0s;
}

.upload-area.blur-image-loaded .blur-image,
.upload-area.image-loaded .image,
.preview-area.blur-image-loaded .blur-image,
.preview-area.image-loaded .image
{
	opacity: 1;
}

.upload-area .action-panel
{
	position: absolute;
	top: 4px;
	right: 4px;
	opacity: 0;
	-webkit-transition: opacity 0.2s ease-out 0s;
	-o-transition: opacity 0.2s ease-out 0s;
	-moz-transition: opacity 0.2s ease-out 0s;
	transition: opacity 0.2s ease-out 0s;
}

.upload-area.image-loaded .action-panel
{
	opacity: 1;
}

.upload-area .title-area
{
	position: absolute;
	top: 50%;
	left: 50%;
	width: inherit;
	height: inherit;
	opacity: 0;
	-webkit-transition: opacity 0.5s ease-out 0s;
	-o-transition: opacity 0.5s ease-out 0s;
	-moz-transition: opacity 0.5s ease-out 0s;
	transition: opacity 0.5s ease-out 0s;
}

.upload-area.show-title-area .title-area
{
	opacity: 1;
}

.upload-area.no-image .title-area
{
	opacity: 1;
}

.upload-area.image-loaded .title-area
{
	opacity: 0;
}

.upload-area .title-area .title
{
	position: absolute;
	left: -50%;
	display: none;
	width: inherit;
	margin: 0;
	padding: 0;
	text-align: center;
}

.upload-area .title-area .title.title-idle span.text
{
	display: block;
}

.upload-area .title-area .title.title-idle span.text + span.badge
{
	margin-top: 20px;
}

.upload-area .progress
{
	display: inline-block;
	width: 80%;
	margin-top: 10px;
}

/** Image preview area */
.preview-area
{
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.preview-area .image
{
	position: absolute;
	opacity: 0;
	-webkit-transition: opacity 0.2s ease-out 0s;
	-o-transition: opacity 0.2s ease-out 0s;
	-moz-transition: opacity 0.2s ease-out 0s;
	transition: opacity 0.2s ease-out 0s;
}

.preview-area .image.initial-position
{
	position: initial;
}

.preview-area.image-loaded .image,
.preview-area.blur-image-loaded .blur-image
{
	opacity: 1;
}

.preview-area .blur-image
{
	position: absolute;
	top: 0;
	left: 0;
	max-width: 100%;
	max-height: 100%;
	opacity: 0;
	-webkit-transition: opacity 0.2s ease-out 0s;
	-o-transition: opacity 0.2s ease-out 0s;
	-moz-transition: opacity 0.2s ease-out 0s;
	transition: opacity 0.2s ease-out 0s;
}

/*.preview-area .blur-image
{
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
}*/

/** EMAIL BOX CONTAINER */

.emails-box-container
{
	--chip-bg: #eef2ff;
	--chip-border: #c7d2fe;
	--chip-text: #1f2937;
	--invalid-bg: #ffeef0;
	--invalid-border: #fca5a5;
	--focus: #6366f1;
}

.emails-box-container .label
{
	font-weight: 600;
	margin-bottom: 8px;
	display: block;
}

.emails-box-container .email-box
{
	border: 1px solid #d1d5db;
	border-radius: 8px;
	min-height: 48px;
	padding: 6px 8px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	cursor: text;
}

.emails-box-container .email-box:focus-within
{
	border-color: #007297;
	outline: 0;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 86, 98, 0.6);
}

.emails-box-container .email-box-input
{
	outline: none;
	min-width: 150px;
	flex: 1;
}

.emails-box-container .email-container
{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--chip-bg);
	border: 1px solid var(--chip-border);
	color: var(--chip-text);
	border-radius: 999px;
	padding: 4px 8px;
	margin: 2px;
	user-select: none;
}

.emails-box-container .email-container.invalid
{
	background: var(--invalid-bg);
	border-color: var(--invalid-border);
}

.emails-box-container .email-container input
{
	background: transparent;
	border: none;
	outline: none;
	margin: 0;
	padding: 0;
}

.emails-box-container .email-container input:invalid
{
	color: var(--invalid-border);
}

.emails-box-container .email-container .remove
{
	cursor: pointer;
	font-size: 14px;
	border: none;
	background: none;
	line-height: 1;
}

.emails-box-container .hint
{
	color: #6b7280;
	font-size: 13px;
	margin-top: 8px;
}

.emails-box-container .actions
{
	margin-top: 12px;
	display: flex;
	gap: 8px;
}

.emails-box-container .btn
{
	border: none;
	border-radius: 8px;
	padding: 8px 14px;
	cursor: pointer;
	background: var(--focus);
	color: white;
}

.emails-box-container .btn.secondary
{
	background: transparent;
	color: #374151;
	border: 1px solid #e5e7eb;
}


/** EXTRA-SMALL DEVICE */

@media (max-width: 767px) {
	/** MIXED: extra-small device */

	.clear-xs
	{
		clear: both !important;
	}

	.no-padding-xs
	{
		padding: 0 !important;
	}

	.no-margin-xs
	{
		margin: 0 !important;
	}

	.full-width-xs
	{
		width: 100% !important;
	}

	.panel-heading-xs
	{
		display: block;
	}

	.timeago
	{
		font-size: 80%;
	}

	.panel-table .panel-body > .row
	{
		border-bottom: 1px solid #DDD;
	}

	.panel-table .panel-body
	{
		overflow: hidden !important;
	}

	.panel-table .panel-body .row .text-secundary
	{
		color: #999;
	}

	.margin-y-xs
	{
		margin-top: 4px;
		margin-bottom: 4px;
	}



	/** NAVBAR: extra-small device */
	
	.user-logged .navbar-default
	{
		/* background: #111; */
		display: flex;
		width: 100%;
	}

	.user-logged .navbar-default .navbar-nav li.divider
	{
		display: none;
	}

	.user-logged .navbar-default .navbar-nav ul
	{
		display: none;
		overflow: auto;
		position: relative;
		top: 0;
		padding: 0;
		margin: 0;
		background: none;
		border: none;
		box-shadow: none;
	}

	.user-logged .navbar-default .navbar-nav ul
	{
		border-bottom: 1px solid rgba(255, 255, 255, .2);
		border-top: 1px solid rgba(0, 0, 0, .2);
	}

	.user-logged .navbar-default .navbar-nav::before
	{
		border-bottom: 1px solid rgba(0, 0, 0, .2);
		width: 100%;
	}

	.user-logged .navbar-default .navbar-nav::after
	{
		border-top: 1px solid rgba(255, 255, 255, .2);
		width: 100%;
	}

	.user-logged .navbar-default .navbar-nav li
	{
		border-bottom: 1px solid rgba(0, 0, 0, .2);
		border-top: 1px solid rgba(255, 255, 255, .2);
	}

	.user-logged .navbar-default .navbar-nav > li > a .glyphicon
	{
		color: #CCC;
	}

	.user-logged .navbar-default .navbar-nav > li:hover > a,
	.user-logged .navbar-default .navbar-nav > li:hover > a .glyphicon
	{
		color: var(--kairos-primary-color);
	}

	.user-logged .navbar-default .navbar-nav > li li > a
	{
		display: inline-block;
		width: 100%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.user-logged .navbar-header
	{
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex: 1;
		width: 100%;
	}

	.user-logged .navbar-default .navbar-brand
	{
		padding: 0;
		height: auto;
	}

	.user-logged .navbar-header h1
	{
		font-size: 1.4em;
		margin: 4px;
		flex: 2;
	}

	.user-logged .navbar-header h1.marquee > .text
	{
		overflow: initial;
		text-overflow: initial;
		/* animation: marquee 10s ease-in-out infinite; */
	}

	@keyframes marquee {
		0% {
			transform: translateX(0) translateY(0);
		}
		48% {
			transform: translateX(-105%) translateY(0);
		}
		49% {
			transform: translateX(-105%) translateY(-100%);
		}
		50% {
			transform: translateX(100%) translateY(-100%);
		}
		51% {
			transform: translateX(100%) translateY(0);
		}
		100% {
			transform: translateX(0) translateY(0);
		}
	}

	.user-logged .navbar-header .navbar-toggle
	{
		position: initial;
		float: initial;
		margin: 0 8px;
	}

	.user-logged .navbar-header .navbar-button
	{
		position: initial;
		float: initial !important;
		margin: 0 8px;
		padding: 0;
	}

	.user-logged .navbar-header > *
	{
		text-align: center;
	}



	/** HEADER: extra-small device */

	header #TopNav,
	header .TopNav
	{
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: column;
	}

	header .TopNav2
	{
		flex-direction: row;
	}

	header .TopNav2 .pull-right
	{
		display: block !important;
	}
	
	header .TopNav2 .pull-right > *:not(.btn-dropdown-menu)
	{
		display: none;
	}

	header h1
	{
		display: block;
		line-height: normal;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	header h1 .header
	{
		display: block;
	}

	header h1 .subheader
	{
		display: none;
	}

	header .metadata
	{
		float: none;
		display: block;
		line-height: normal;
	}

	header .metadata > li
	{
		float: none;
		display: block;
		margin: 3px 0;
	}

	header .flex-row > .flex-item.item-1,
	header .flex-row > .flex-item.item-2
	{
		display: none;
	}

	header .flex-row > .flex-item.item-3
	{
		width: 100%;
	}

	.input-group-search
	{
		width: 100%;
		margin: 0;
	}

	.input-group-search
	{
		width: 100%;
		margin: 0;
	}

	.mobile-datepicker .ui-datepicker-inline
	{
		width: 100%;
	}

	.mobile-datepicker .ui-datepicker-inline th a,
	.mobile-datepicker .ui-datepicker-inline td a
	{
		/*padding: 10px;*/
		font-size: larger;
	}


	/** NAV TABS: extra-small device */
	.TopNav .nav-tabs
	{
		margin-top: 15px;
	}

	.nav-tabs > li > a
	{
		padding-bottom: 15px;
	}


	/** CONTAINER: extra-small device */
	#Page .container-fluid
	{
		padding: 0;
	}

	#Page .container > .row
	{
		margin-right: 0;
		margin-left: 0;
	}

	#Page .container > .row > .col-sm-12
	{
		padding-right: 0;
		padding-left: 0;
	}
}



/** SMALL DEVICE */

@media (min-width: 768px) {
	.pull-right-sm
	{
		float: right !important;
	}
}

/** SLIDE ACTIONS */
.slide-actions > div
{
	-webkit-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	transition: all .2s ease-out;
}

.slide-actions-btns > .btn
{
	flex-grow: 1;
	height: inherit;
	margin-right: 5px;
	font-size: 2em;
}



/** REPORTS */
.vista-previa
{
	display: inline-block;
	text-align: center;
}

.vista-previa > .rpt
{
	display: inline-block;
	background: #FFF;
	border-radius: 4px;
	border: 1px solid rgba(0, 0, 0, .3);
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, .4);
	padding: 10px;
	text-align: initial;
}

@media print
{
	.modalBlockout,
	.modalHost
	{
		display: none;
	}

	.vista-previa
	{
		text-align: initial;
	}
	
	.vista-previa > .rpt
	{
		background: transparent;
		border-radius: 0;
		border: none;
		box-shadow: none;
		padding: 0;
	}

	#Page .container-fluid
	{
		overflow: initial;
		width: initial;
		height: initial;
		padding: 0;
		margin: 0;
	}

	[class*="col-"]
	{
		padding: 0;
	}
}

.report-container
{
	text-align: center;
}

.plantilla-de-reporte
{
	display: inline-block;
	margin: 0 15px 0 0;
	padding: 0 15px;
	background: #FFF;
	border-radius: 4px;
	border: 1px solid rgba(0, 0, 0, .3);
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, .4);
	width: auto;
	min-height: var(--container-height, initial);
}

.plantilla-de-reporte .margin-right-xs
{
	margin-right: 5px;
}

.plantilla-de-reporte .active .text-secundary
{
	color: #999;
}

.plantilla-de-reporte .text-normal
{
	font-weight: normal;
}

.plantilla-de-reporte th.sortable-column:hover
{
	background: #E0E0E0;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.plantilla-de-reporte th.sortable-column:active
{
	/*box-shadow: inset 0 1px 3px rgba(0, 0, 0, .2);*/
	color: #555555;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.plantilla-de-reporte .sortable-column-control
{
	display: flex;
	justify-content: space-between;
}

#PlantillaDinamica
{
	display: inline-block;
}

.sticky
{
	position: sticky;
	top: 0;
}

.no-printable-alert
{
	display: none;
	font-size: 22px;
	color: #000000;
}

.no-printable-alert h3
{
	font-size: 28px;
	color: #FF0000;
}

.no-printable-alert a
{
	font-size: 14px;
	text-decoration: underline;
}

@media print {
	body
	{
		background: #FFF;
		overflow: auto !important;
	}

	header,
	nav,
	.navbar *,
	.fixed-tab-nav-button
	{
		display: none !important;
	}

	#Page
	{
		border-radius: 0;
		height: inherit !important;
	}

	.container-fluid
	{
		height: inherit !important;
	}

	.no-printable-alert,
	.printable
	{
		display: inherit !important;
	}

	.no-printable,
	.bottom-bar,
	.timeago,
	.visible-xs
	{
		display: none !important;
	}

	.printable .row
	{
		display: table-row;
	}

	.printable .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12
	{
		display: table-cell;
	}

	.visible-print-table
	{
		display: table !important;
		width: 100%;
	}

	.visible-print-row
	{
		display: table-row !important;
		width: 100%;
	}

	.visible-print-row > *
	{
		padding: 10px 15px;
		margin-bottom: -1px;
		border: 1px solid #ddd;
	}

	.print-width-auto
	{
		width: auto !important;
	}

	.container-fluid.printable
	{
		overflow: hidden !important;
		width: 100%;
		height: 100% !important;
	}

	.printable .container
	{
		display: table !important;
		width: 100% !important;
		height: 100% !important;
	}

	.printable .panel-table
	{
		display: table !important;
		width: 100%;
		border-collapse: collapse;
		border: none;
	}

	.printable .panel-table > .panel-heading
	{
		display: table-header-group !important;
	}

	.printable .panel-table > .panel-heading.visible-xs
	{
		display: none !important;
	}

	.printable .panel-table > .panel-body
	{
		display: table-row-group !important;
		padding: 0;
		height: 100% !important;
	}

	.printable .panel-table .row > div
	{
		display: table-cell !important;
		border-bottom: 1px solid #DDD;
	}

	.printable .panel-table > .panel-heading > .row > div
	{
		border: 1px solid #DDD;
		font-weight: bold;
	}

	.no-printable
	{
		display: none !important;
	}

	*,
	.table-bordered > tbody > tr > td,
	.table-bordered > tbody > tr > th,
	.table-bordered > tfoot > tr > td,
	.table-bordered > tfoot > tr > th,
	.table-bordered > thead > tr > td,
	.table-bordered > thead > tr > th
	{
		border-color: black !important;
	}

	.table-bordered
	{
		border-color: transparent !important;
	}

	.table td.panel-subheading,
	.active th,
	.active td
	{
		background: #DDD !important;
	}

	.panel-heading,
	.panel-heading span,
	.panel-heading .panel-title,
	.panel-heading .panel-title span
	.panel-heading td,
	.panel-heading th,
	.printing-bg-primary,
	.printing-bg-primary td,
	.printing-bg-primary th
	{
		background: #21687C !important;
		color: #FFF !important;
	}

	{
		color: #FFF !important;
	}

	.table td.panel-subheading,
	.panel-subheading span,
	.panel-subheading td,
	.panel-subheading th,
	.printing-bg-secundary,
	.printing-bg-secundary td,
	.printing-bg-secundary th
	{
		background: #f0f0f0 !important;
		color: #222 !important;
	}

	@page
	{
		margin: 1cm;
	}

	html,
	body,
	#applicationHost,
	.durandal-wrapper,
	#Page,
	.container-fluid,
	.container,
	.row
	{
		display: block;
		margin: 0 !important;
		padding: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 100% !important;
	}

	body
	{
		font-size: 10px;
	}

	h1
	{
		font-size: 2.8em;
	}

	h2
	{
		font-size: 2.4em;
	}

	h3
	{
		font-size: 2em;
	}

	h4
	{
		font-size: 1.8em;
	}

	h5
	{
		font-size: 1.5em;
	}

	h6
	{
		font-size: 1.2em;
	}

	span + h3
	{
		margin-top: 5px;
	}

	.plantilla-de-reporte
	{
		display: block;
		background: transparent;
		border: initial;
		border-radius: initial;
		box-shadow: initial;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.plantilla-de-reporte .table thead th,
	.plantilla-de-reporte .table thead td
	{
		border-top: 3px double #000 !important;
		border-bottom: 3px double #000;
	}
}

.pdf-viewer
{
	position: absolute;
	top: 50px;
	left: 1;
	z-index: -1;
	visibility: hidden;
	width: 1px;
	height: 1px;
}
