/***********/
* {
	box-sizing: border-box;
	outline: none;
}

.container
{
	margin: 0;
	padding: 0;
}









h4 {
	margin: 0;
}
/** Para que todo lo pulsable salga con el dedete **/
*[onclick] {
	cursor: pointer;
}

/** SCROLLBAR **/

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.odd
{
	background-color: antiquewhite;
}

/* Centra verticalmente los iconos en las tablas */

.dn-table__cell>.material-icons
{
	vertical-align: middle;
}

.mdl-form--collapsed .mdl-textfield
{
	margin-top: 0;
	margin-bottom: 0;
}

.dyn-mark {
	font-weight: bolder;
}


.dyn-waiting 
{
    background: url( "img/cds_anim_big.png" ) center center no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 2147483647;
    pointer-events: none;
    display: none;
}

.mdl-progress
{
	width: auto !important;
}

.mainBox.mainBoxCli
{
	background-position-x: center;
	background-position-y: center;
	background-size: contain;
}

/********************/
.dyn-indicator__binary 
{

}

.displayBinary
{
}

.dyn-indicator__binary[value='0'] 
{
	
}

.displayBinary[value='0']
{
	
}

.dyn-indicator__binary[value='1']
{
	color: var( --color_1 );
}

.displayBinary[value='1']
{
	color: var( --color_1 );
}


/** MODIFICACIONES A ESTILOS QUE VIENEN DESDE MATERIAL **/

input {
	font-family: var(--fontfamily);
}

/** Arreglos para cards dentro de cards **/
.mdl-card .mdl-card > div:last-of-type.mdl-card--expand 
{
	margin-bottom: 0px;
}

.mdl-card .mdl-card .mdl-card__title
{
	min-height: 0px;
}

/** BADGE en el BUTTON **/
.mdl-button .mdl-badge 
{
    position: absolute;
    top: 0px;
    left: 17px;
    height: 17px;
    width: 17px;
    background: var( --color_4 );
    text-align: center;
    color: var( --color_3 );
    line-height: 16px;
    border-radius: 8px;
    font-size: xx-small;
}

.mdl-float__right {
	float: right;
}

/** Correccion del posicionamiento del boton al lado de un textfield **/
.mdl-textfield + button 
{
    top: -24px;
}

.mdl-scroll {
	overflow-y: auto !important;
}


.dialog-container .mdl-scroll {
	max-height: 70vh;
}



.mdl-hover:hover {
	background: #fafafa;
}

.mdl-hover .mdl-hover-target {
	height: 0;
	transition-duration: 0.2s;
}

.mdl-hover:hover .mdl-hover-target {
	height: 18px;
	transition-duration: 0.2s;
}

.mdl-grid-row__border {
	border-bottom: 1px solid var( --color_3 );
}


/** TEXTAREA **/
.mdl-textfield .mdl-textarea 
{
/*	padding: 0;*/
	margin-top: 14px;
}

.mdl-textfield .mdl-textfield__label
{
	top:0px;
}


/** Color para los elementos con click **/
.fake_formfield[onclick] {
	color: var(--color_1);
}

/** Esto hace funcionar las tablas con el scroll **/
/** Estropea las cards en el grid de forma normal **/
/*
.mdl-grid-row__full-height .mdl-card__supporting-text.mdl-card--expand {
	height: 0px;
}
*/

/** Para poner cells al lado de formfields **/
.mdl-textfield + .mdl-cell:not(.mdl-textfield):not(.mdl-select) {
	display: inline-block;
	top: 8px;
}


.mdl-button__switch 
{
	height: 64px;
	margin: 5px;
}



/** Zona con BOTONES **/
.mdl-textfield__buttons
{
	padding-top: 24px;
}

.mdl-textfield__buttons .mdl-button
{
	position: relative;
}


.mdl-card__toolbox
{
    position: absolute;
    width: calc( 100% - 64px );
    text-align: right;
    margin-top: 36px;
}

.mdl-card__toolbox .mdl-button
{
    min-width: 30px;
    width: 36px;
    padding-left: 8px;
}


.mdl-card__toolbox .material-icons 
{
    font-size: 18px;
}

/*
.mdl-card__toolbox > .mdl-select,
.mdl-card__toolbox > .mdl-textfield
*/

.mdl-card__toolbox .mdl-cell
{
	margin-top: -18px;
	display: inline-table;
}

.mdl-card__toolbox .mdl-switch__label
{
	left: 0;
}

/** Para que quede todo "contenido" **/
.mdl-cell {
	overflow: hidden;
}


/** MODIFICACIONES AL SELECT **/
.mdl-select > input {
	width: 100%;
}

/** Modificacion dentro del Card **/
.mdl-card__supporting-text h1 {
	font-size: 20px;
	margin: 0px;
}

/** Esto es para que deje un margen en los CARD's cuando llega bajo y no tiene actions **/
.mdl-card > div:last-of-type.mdl-card--expand 
{
	margin-bottom: 16px;
}


/** MODIFICACIONES AL SWITCH **/

/*
.mdl-switch__focus-helper {
	left: 10px;
}

.mdl-switch__focus-helper .mdl-switch__label {
	top: -28px;
	left: -32px;
	font-size: 12px;
}
*/

.mdl-switch.mdl-switch--floating-label
{
	top: 24px;
	left: 16px;
}

.mdl-switch.mdl-switch--floating-label>label 
{
	top: -22px;
	left: -43px;
	font-size: 12px;
}


/** Modificaciones al CHECKBOX **/
.mdl-checkbox--vertical
{
	
}

.mdl-checkbox--vertical .mdl-checkbox__label
{
	left: -24px;
	top: 8px;
	color: var( --color_2 );
	font-size: 12px;
}

.mdl-checkbox--vertical .mdl-checkbox__box-outline
{
	top: 40px;
}

/*
.mdl-checkbox__ripple-container {
	top:0 !important;
	left: 0 !important;
}
*/

.dn-table__cell>.mdl-cell {
	margin: 0 0 0 8px;
}


/*
.dyn-minitable
{
	
}

.dyn-minitable .mdl-grid
{
	margin: 0;
	padding: 0;
}

.dyn-minitable .mdl-cell
{
	margin: 0;
	padding: 0 0 0 2px;
}
*/

/** TABLE - NUEVA **/


.mdl-table--actions {
	padding: 0 !important;
	border: 0 !important;
}

.dn-table {
}

.dn-table__header {
	border-collapse: collapse;
	display: table;
	width: calc( 100% - 6px );
	cursor: default;
}

.dn-table__body {
	overflow-y: scroll;
	overflow-x: hidden;
	display: block;
	height: calc( 100vh - 320px );
	width: 100%;
	border-collapse: collapse;
	background-color: #fcfcfc;
}

.dn-table__body > div {
	display: table;
	width: 100%;
}

.dn-table__row {
	display: table-row;
}

.dn-table__cell {
	display: table-cell;
	font-size: 14px;
	line-height: 30px; 
	border: 1px solid #fff;
	padding-left: 3px;
	padding-right: 3px;
	text-overflow: ellipsis;
	overflow: hidden;
/*	
	padding-top: 6px;
	padding-bottom: 16px;
	display: inline-flex;
	line-height: 24px;
*/
}

.dn-table__cell[onclick] {
	color: var(--color_1);
}

.dn-table__header .dn-table__row {
	background-color: #e8e8e8;
}

.dn-table__header .dn-table__cell {
	text-align: center;
	font-weight: bold;
	background-color: var(--color_2a);
	color: var(--color_3);
	padding-bottom: 6px;
}

.dn-table__header--expander {
	float: left;
	padding-top: 5px;
	padding-left: 5px;
}

.dn-table__header--expander::not(.expanded)::before {
	content: "\f0140;";
}

.dn-table__header--expander.expanded::before {
	content: "\f0143;";
}

.dn-table__body .dn-table__row {
	background-color: #fafafa;
}

.dn-table__body .dn-table__row:hover {
	background-color: #eaeaea;
}

.dn-table__body .dn-table__row:nth-child(odd) {
	background-color: #f0f0f0;
}

.dn-table__body .dn-table__row:nth-child(odd):hover {
	background-color: #e0e0e0;
}

.dn-table__body .dn-table__cell {
}


.dn-table__footer {
	background-color: transparent !important;
	font-weight: bolder;
}

.dn-table__footer > .numeric {
	border-top: 2px solid black;
}



.dn-table__row.selected {
	background-color: var( --color_2a ) !important;
}



.dn-table__header .dn-table__cell[sort="0"]::before
{
	content: "\25B2";
}

.dn-table__header .dn-table__cell[sort="1"]::before
{
	content: "\25BC";
}







.dyn-help-button i {
	font-size: 18px;
	left: 12px !important ;
	top: 11px !important ;
}








/**** DATALIST ******/
.dyn-datalist
{
	
}


.dyn-datalist .mdl-grid
{
	padding: 0;
	margin: 0;
	height: 30px;
	line-height: 15px;
}


.dyn-datalist .mdl-grid:nth-child(even)
{
	background-color: #efefef;
}

.dyn-datalist .mdl-grid:nth-child(1)
{
	text-align: center;
	border-bottom: 1px solid var( --color_2 );
	color: var( --color_2 );
}

.dyn-datalist .mdl-grid:nth-last-child(1)
{
	border-top: 1px solid var( --color_2 );
	color: var( --color_2 );
	background: none;
}











.dyn-full_height {
	height: 100%;
}

.dyn-fullframe {
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
}


.mdl-grid-row__full-height {
	height: 100%;
}

/*
.mdl-grid-row__full-height>.mdl-card {
	height: 100%;
}
*/


/*********/


.mainBox {
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 120px;
	text-shadow: -1px -1px #bbb, 1px 1px #bbb, -1px 1px #bbb, 1px -1px #bbb;
	color: black;
}

.mainBox .mdl-card__title {
	display: block;
	padding: 4px;
	min-height: 36px;
}

.mainBox .mdl-card__subtitle-text {
}

.mainBox .mdl-card__supporting-text {
	padding: 12px;
}

.mainBox .mdl-card__actions {
	background: #fff;
/*	background: rgba( 255 , 255 , 255 , 0.75 );*/
}

/*
.mainBox h1 {
	margin: 0;
	font-size: 16px;
	text-align: left;
	line-height: normal;
	padding-top: 10px;
	padding-left: 10px;
}
*/

/*
.mainBox h2 {
	margin: 0;
	font-size: 20px;
	text-align: center;
	line-height: normal;
	padding-top: 8px;
}
*/




.dn-table__cell .mdl-checkbox
{
	width: auto;
	padding-left: 16px;
}






/**************/

.loadingCover {
	background: url("img/cds_anim_2.png") no-repeat center;
}


.dyn-slide {
	display: inline-flex;
}

.mdl-card__actions.dyn-fullframe {
	position: absolute;
	top: auto;
	bottom: 0px;
}

.dyn-fullframe__actions {
	position: absolute;
	top: 0px;
	bottom: 64px;
	left: 0px;
	right: 0px;
}

/***********/

.leaflet-container {
/*	width: 100%; */
}

.leaflet-container.boxed {
	border-radius: 10px;
}


.mdl-card__title-text {
	overflow: hidden;
	height: 1.2em;
}


.mdl-card--expand {
	overflow: hidden;
}


/***********/


@font-face {
	font-family: 'Material Icons';
	font-style: normal;
	font-weight: 400;
	src: url(files/materialicons.woff) format('woff');
}

.material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	-webkit-font-feature-settings: 'liga';
	-webkit-font-smoothing: antialiased;
}

@font-face {
	font-family: 'Material Design Icons';
	font-style: normal;
	font-weight: 400;
	src: url(files/materialdesignicons.woff) format('woff');
}

.mdi {
	font-family: 'Material Design Icons' !important;
}

@font-face {
	font-family: 'Material Design Icons 2';
	font-style: normal;
	font-weight: 400;
	src: url(files/materialdesignicons2.woff) format('woff');
}

.mdi2 {
	font-family: 'Material Design Icons 2' !important;
}

.mdi-plus:before {
	content: "\f415";
    top: 0.5em;
    left: 0.5em;
    position: absolute;
    text-shadow: 1px 0 white, 0 1px white, -1px 0 white, 0 -1px white, 1px 1px white, 1px -1px white, -1px -1px white, -1px 1px white;
}

.mdi-minus:before {
	content: "\f0374";
    top: 0.5em;
    left: 0.5em;
    position: absolute;
    text-shadow: 1px 0 white, 0 1px white, -1px 0 white, 0 -1px white, 1px 1px white, 1px -1px white, -1px -1px white, -1px 1px white;
}

.mdi-next:before {
	content: "\f0055";
    top: 0.5em;
    left: 0.5em;
    position: absolute;
    text-shadow: 1px 0 white, 0 1px white, -1px 0 white, 0 -1px white, 1px 1px white, 1px -1px white, -1px -1px white, -1px 1px white;
}

.mdi-download:before {
	content: "\f0046";
    top: 0.5em;
    left: 0.5em;
    position: absolute;
    text-shadow: 1px 0 white, 0 1px white, -1px 0 white, 0 -1px white, 1px 1px white, 1px -1px white, -1px -1px white, -1px 1px white;
}

.mdi-close:before {
	content: "\f0156";
    top: 0.5em;
    left: 0.5em;
    position: absolute;
    text-shadow: 1px 0 white, 0 1px white, -1px 0 white, 0 -1px white, 1px 1px white, 1px -1px white, -1px -1px white, -1px 1px white;
}

.mdi-edit:before {
	content: "\f03eb";
    top: 16px;
    left: 32px;
    font-size: 16px;
    position: absolute;
    text-shadow: 1px 0 white, 0 1px white, -1px 0 white, 0 -1px white, 1px 1px white, 1px -1px white, -1px -1px white, -1px 1px white;
}

.mdi-config:before
{
	content: "\f493";
	top: 0.5em;
	left: 0.5em;
	position: absolute;
    text-shadow: 1px 0 white, 0 1px white, -1px 0 white, 0 -1px white, 1px 1px white, 1px -1px white, -1px -1px white, -1px 1px white;
}

.mdi-r45 {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.mdi-r90 {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.mdi-r135 {
  -webkit-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  transform: rotate(135deg);
}

.mdi-r180 {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.mdi-r225 {
  -webkit-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  transform: rotate(225deg);
}

.mdi-r270 {
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}

.mdi-r315 {
  -webkit-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  transform: rotate(315deg);
}

.mdi-spin {
	animation: mdi-spin 5s linear infinite;
}

@keyframes mdi-spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(359deg);
	}
}


.material-icons.md-16 { font-size: 16px; }
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-20 { font-size: 20px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }



a {
	text-decoration: none;
}

/*****/

.dyn-selector-list>.mdl-grid:hover {
    background: #f9f9f9;
}

/***** LADDER *****/
.ladder_obj {
	position: absolute;
}

.ladder_obj label {
	position: absolute;
	font-size: 15px;
	height: 17px;
}

.ladder_label {
	border:	1px solid antiquewhite;
	background: antiquewhite;
	border-radius: 5px;
	padding: 2px 5px;
	z-index: 100000;
}

.ladder_obj img {
	position: absolute;
}

/*** CIRCULARES ***/
.ladder_anchor_cir_b {
	position: absolute;
	width: 16px;
	height: 16px;
	margin-left: -8px;
	margin-top: -8px;
	border-radius: 8px;
	background-color: blue;
}

.ladder_anchor_cir_a {
	position: absolute;
	width: 16px;
	height: 16px;
	margin-left: -8px;
	margin-top: -8px;
	border-radius: 8px;
	background-color: green;
}

.ladder_anchor_cir_g {
	position: absolute;
	width: 16px;
	height: 16px;
	margin-left: -8px;
	margin-top: -8px;
	border-radius: 8px;
	background-color: violet;
}

.ladder_anchor_cir_x {
	position: absolute;
	width: 2px;
	height: 2px;
	margin-left: -1px;
	margin-top: -1px;
	background-color: black;
}

.ladder_anchor_con_g , .ladder_anchor_con_x {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
}

/***************** FORMULARIOS SIN SER FORMULARIOS *********************/
.dyn-vis-form {
}


.dyn-vis-form img {
	max-width: 100%;
}

.dyn-vis-form--cell {
}

.dyn-vis-form--cell span {
    display: block;
    border-bottom: 1px solid blue;
    color: blue;
}




.mdl-card__title {
	min-height: 60px;
	padding-bottom: 8px;
}

.mdl-card__flat {
	min-height: 64px !important;
}

main > .mdl-tabs {
	height:	calc(100vh - 130px);
}

main > .mdl-tabs > .mdl-tabs__panel {
	height: 100%;
}



/* Estas no estan en MDL */
.mdl-chip__action {
	float: right;
	margin-top: 4px;
	margin-right: -6px;
	width: auto;
	color: white;
}

.mdl-chip__action:hover {
	color: black;
}

/* Esto mantiene el texto en los chips centrado */
.mdl-chip__action ~ .mdl-chip__text {
	margin-left: 30px;
}

.mdl-chip__contact ~ .mdl-chip__action ~ .mdl-chip__text {
	margin-left: 0;
}

.mdl-chip.mdl-badge[data-badge]:after {
	right: 0px;
}
/****************** CALENDAR ********************/
.dyn-calendar {
	width: calc(100% - 10px);
    border-collapse: collapse;
    margin-left: 5px;
    margin-top: 5px;
    margin-bottom: 10px;
    table-layout: fixed;
}

.dyn-calendar tr {
}

.dyn-calendar th {
    text-align: center;
    border: 1px solid silver;
    height: 40px;
    background-color: silver;
}

.dyn-calendar td {
    text-align: center;
    border: 1px solid silver;
    cursor: pointer;
    white-space: nowrap;
}

.dyn-calendar .dyn-calendar__selector {

}

.dyn-calendar .dyn-calendar__selector tr {
}

.dyn-calendar .dyn-calendar__selector td {
	border: none;
}

.dyn-calendar .mdl-badge[data-badge]:after {
	top: 1px;
	right: 1px;
}

.dyn-calendar .dyn-calendar__targetMonth {
	background-color: linen;
}

.dyn-calendar .dyn-calendar__targetDay {
	color: var(--color_3);
	background-color: var(--color_2);
	font-weight: bolder;
}

.dyn-calendar__title {
}

.dyn-calendar__title >button {
}

.dyn-calendar__title span {
}

.dyn-calendar__title >button >span >button {
}
/******************** TREE **********************/


.dyn-tree-condensed {
	margin: 3px;
	overflow-y: auto;
}

.dyn-tree-condensed .dyn-tree__chip {
	margin: 0px;
	width: calc(100% - 16px);
	display: inline-block;
	text-align: left;
	margin-top: 2px;
	float: right;
}

.dyn-tree-condensed .dyn-tree__chip + div {
	margin-left: 20px;
	margin-bottom: 4px;
}

.dyn-tree-condensed .dyn-tree__chip + .dyn-tree__chip {
}

.dyn-tree__child {
	display: none;
}


.dyn-tree__row {
	width: calc(100% - 20px);
    margin-left: 10px;
    margin-top: 15px;
    text-align: center;
    margin-bottom: -5px;
}

.dyn-tree__row-phone {
    margin-right: 10px;
    margin-left: 10px;
    margin-top: 15px;
    text-align: right;
}

.dyn-tree__row-phone + .dyn-tree__row-phone {
	margin-top: 0px;
}

.dyn-tree__row + .dyn-tree__row {
	margin-top: 0px;
}

.dyn-tree__cell {
}

.dyn-tree__spacer {
}

.dyn-tree__cell-phone {
}

.dyn-tree__spacer-phone {
}

.dyn-tree__row + .dyn-tree__row > .dyn-tree__cell {
    background: url(/img/union.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 3px 10px;
    padding-top: 10px;
}

.dyn-tree__chip,.dyn-tree__chip-phone {
	padding-left: 0px;
	width: calc(100% - 20px);
	text-align: center;
	overflow: hidden;
}

.dyn-tree__chip > .mdl-chip__contact {
	float: left;
}

.dyn-tree__chip-phone > .mdl-chip__contact {
	float: right;
	margin-right: -10px;
}

.dyn-tree__chip > .mdl-chip__contact > i {
	padding-top: 4px;
}

.dyn-tree__chip-phone > .mdl-chip__contact > i {
	padding-top: 4px;
}

.dyn-tree__chip > .mdl-chip__text {

}

.dyn-tree__chip > .mdl-chip__text > div {
	display: none;
}


.dyn-tree__more {
	padding-top: 2px !important;
	height: 18px;
}

/*******************************************/

.mdl-cell {
	position: relative;
}

/*
.mdl-button--fab__bottomrightcorner {
	margin-right: 10px;
	margin-bottom: -32px;
	margin-top: -60px;
	float: right;
	z-index: 10000;
}
*/
.mdl-button--fab__bottomrightcorner {
	position: absolute;
	bottom: 0px;
	right: 0px;
	margin-right: 10px;
	margin-bottom: 10px;
	z-index: 10000;
}

.mdl-button--fab__bottomrightcorner:only-child {
	margin-top: 10px;
}

/*
.mdl-card__actions .mdl-button--fab__bottomrightcorner {
    margin-top: -20px;
    margin-bottom: -20px;
}
*/

.mdl-breadcrumb {
	position: absolute;
	top: 15px;
	left: 50px;
	font-size: 24px;
}

/* Ponemos esto para que no deje tanto margen a la derecha */
div.mdl-card__supporting-text {
	width: auto !important;
}



data {
	display: none;
}


.dyn-panel {
	margin: 5px;
}

#dyn_logo {
	padding-top: 15px;
	text-align: center;
	width: 90%;
}

#dyn_logo img {
	width: inherit;
}




.mdl-card__subtitle {
	margin-top: -28px;
	padding-top: 16px;
	padding-left: 16px;
}


.mdl-menu > .mdl-menu__item > i {
	vertical-align: middle;
}



.boxed {
	border: 1px solid black;
}


.center {
	text-align: center !important;
	justify-content: center;
}

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

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

.calculated {
	font-weight: bolder;
}

.empty {
}

.transparent {
	background: none;
}

.numeric {
	text-align: right;
	justify-content: flex-end;
}

.numeric small {
	font-size: 65%;
	color: var(--color_1);
	font-weight: normal;
}

.warning {
	color: orange;
}

.alarm {
	color: red;
}

.halfText {
	font-size: 65%;
}


.hide {
	display: none;
}


.onSelector:not(.onValue) {
	display: none;
}

.onSelector[value='0']
{
	display: none;
}

.offSelector[value='1']
{
	display: none;
}





.value {
/*	font-family: 'Dosis', sans-serif;*/
}

.value.medium {
	font-size: 65%;
}

.value small {
	font-size: 65%;
	color: var(--color_1);
	font-weight: normal;
}






.dyn-clickable {
	cursor: pointer;
}

.dyn-table-paginator {
	margin: 4px;
}

.dyn-table-paginator--page {
	border: 1px solid white;
    width: 30px;
    height: 30px;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    background-color: #f7f7f7;
}

.dyn-table-paginator .selected {
/*	background-color: #e0e0e0;*/
	border: 1px solid black;
}

.dyn-table-paginator--separator {
    width: 30px;
    height: 30px;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}


/**
 */


.dyn-hide-overflow td {
	overflow: hidden;
	white-space: nowrap;
}

.dyn-table-new {
	margin: 0 0 0 0;
	width: 100%;
	display: table;
	table-layout: fixed;
}

.dyn-table-new > thead > tr {
	display: table-row;
    font-weight: 900;
    color: #ffffff;
    background: #979797;
    height: 26px;
}

.dyn-table-new > thead > tr > th {
}

.dyn-table-new > tbody > tr {
	display: table-row;
	background: #f6f6f6;
    padding: 14px 0 7px;
}

.dyn-table-new > tbody > tr:nth-of-type(odd) {
	background: #e9e9e9;
}

.dyn-table-new > tbody > tr > td {
	padding: 6px 12px;
	display: table-cell;
	color: black;
	font-size: 14px;
}

.dyn-table-new > tbody > tr > th {
	padding: 6px 12px;
	display: table-cell;
    color: #0f0f0f;
    background: #f7f7f7;
    color: grey;
}









.dyn-table	{
	margin-left: 10px;
	margin-right: 10px;
	background-color: #ffffff;
	padding: 10px;
}

.dyn-table > .mdl-card__actions {
	margin-top: 3px;
	padding-top: 6px;
}

.dyn-table-header {
	margin-left: 10px;
	margin-right: 10px;
	padding: 10px;
}

.dyn-table__row {
	padding-top: 5px !important;
}

.dyn-table__row .selected {
	background-color: #969fd6;
}

.dyn-table__cell {

}

.dyn-table__data-cell {
	text-align: right;
}


.dyn-table__data-cell small {
	font-size: 65%;
	color: var(--color_1);
}

.dyn-table__data-cell--header {
	font-weight: bolder;
	border-bottom: 2px solid var(--color_2);
	text-align: left;
	font-size: 80%;
	margin-left: 2px;
}


.dyn-table__data-header {
	border:	1px solid transparent;
}

.dyn-table__data-header:hover {
	border:	1px dotted silver;
}


.dyn-table__header-cell {
	text-align: left;
	font-size: 80%;
	padding-left: 3px;
}

.dyn-table__header-cell > span {
	border-bottom: 2px solid var(--color_1);
	width: 100%;
	display: inline-table;
}







.dyn-card__indicator--value {
	font-size: 90px;
	line-height: 90px;
/*	width: 100% !important; */
	text-align: center !important;
	margin: 0;
}




.dyn-table th {
	text-align: center;
}

.dyn-table__actions {
	width: 50px;
}



.dyn-tree__level-0 > .dyn-table__cell {
	padding-left: 0px;
}

.dyn-tree__level-1 > .dyn-table__cell {
	padding-left: 15px;
}

.dyn-tree__level-2 > .dyn-table__cell {
	padding-left: 30px;
}

.dyn-tree__level-3 > .dyn-table__cell {
	padding-left: 45px;
}

.dyn-tree__level-4 > .dyn-table__cell {
	padding-left: 60px;
}

.dyn-tree__level-5 > .dyn-table__cell {
	padding-left: 75px;
}

.dyn-tree__level-6 > .dyn-table__cell {
	padding-left: 90px;
}

.dyn-tree__level-7 > .dyn-table__cell {
	padding-left: 105px;
}

.dyn-tree__level-8 > .dyn-table__cell {
	padding-left: 120px;
}

.dyn-tree__level-9 > .dyn-table__cell {
	padding-left: 135px;
}



.dyn-icon__rotate {
	-moz-transition: all 0.5s linear;
	-webkit-transition: all 0.5s linear;
	transition: all 0.5s linear;
}

.dyn-icon__rotate.down {
	-ms-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-webkit-transform:rotate(90deg);
	transform:rotate(90deg);
}





.dyn-grTable {
	padding: 1%;
}

.dyn-grTable__actions {
	text-align: right;
	color: black;
}

.dyn-grTable__row {
	border-width: 2px;
	border-style: solid;
}

.dyn-grTable__row:hover {
	background-color: #fefefe !important;
}

.dyn-grTable__row>.mdl-grid {
	padding-top: 6px;
	padding-bottom: 0px;
}

.dyn-grTable__row--header {
	background-color: transparent;
	border: 0;
}

.dyn-grTable__row--header .dyn-grTable__data-cell span {
	text-align: center;
	font-size: 80%;
	border-bottom: 2px solid blue;
}

.dyn-grTable__row--lvl0 {
	background-color: #f4f4f4;
	border-color:#f0f0f0;
}

.dyn-grTable__row--lvl0:nth-child(2) {
	background-color: #e4e4e4;
	border-color: #e0e0e0;
}

.dyn-grTable__row--lvl1 {
	background-color: #d4d4d4;
	border-color: #d0d0d0;
}

.dyn-grTable__row--lvl1:nth-child(2) {
	background-color: #c4c4c4;
	border-color: #c0c0c0;
}

.dyn-grTable__row--lvl2 {
	background-color: #f4f4f4;
	border-color: #f0f0f0;
}

.dyn-grTable__row--lvl2:nth-child(2) {
	background-color: #e4e4e4;
	border-color: #e0e0e0;
}

.dyn-grTable__row--lvl3 {
	background-color: #d4d4d4;
	border-color: #d0d0d0;
}

.dyn-grTable__row--lvl3:nth-child(2) {
	background-color: #c4c4c4;
	border-color: #c0c0c0;
}


.dyn-grTable__data-cell--header {
	font-weight: bolder;
	border-bottom: 2px solid var(--color_2);
	text-align: left;
	font-size: 80%;
	margin-left: 2px;
}

.dyn-grTable__data-cell--subheader {
	text-align: left;
	font-size: 80%;
	margin-left: 2px;
	color: rgb(63, 81, 181);
	padding-top: 10px;
}

.dyn-grTable__data-cell {
/*	display: inline-block; */
/*	width: 100px; */
	text-align: right;
}

.dyn-grTable__data-cell small {
	color: var(--color_1);
}



/* SELECTOR IMAGENES */
.dyn-selector input{
    margin:0;padding:0;
    -webkit-appearance:none;
       -moz-appearance:none;
            appearance:none;
	display: none;
}

.dyn-selector input:active +.dyn-selector--cc{opacity: .9;}
.dyn-selector input:checked +.dyn-selector--cc{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;

    border: 8px solid #eeeeee;
    background-color: #eeeeee;
}

.dyn-selector--cc{
    cursor:pointer;
    background-size:contain;
    background-repeat:no-repeat;
    display:inline-block;
    /* el margen */
    border: 8px solid transparent;
    width:64px;
    height:64px;
    -webkit-transition: all 100ms ease-in;
       -moz-transition: all 100ms ease-in;
            transition: all 100ms ease-in;
    -webkit-filter: brightness(0.8) grayscale(1) opacity(.7);
       -moz-filter: brightness(0.8) grayscale(1) opacity(.7);
            filter: brightness(0.8) grayscale(1) opacity(.7);
}

.dyn-selector--cc:hover{
    -webkit-filter: brightness(1.2) grayscale(.5) opacity(.9);
       -moz-filter: brightness(1.2) grayscale(.5) opacity(.9);
            filter: brightness(1.2) grayscale(.5) opacity(.9);

}


/* MODAL DIALOG */
.dialog-container,
.loading-container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: scroll;
    background: rgba(0, 0, 0, 0.4);
    z-index: 9999;
    opacity: 0;
    overflow: auto;
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
}

.dialog-container > div {
    position: relative;
    min-height: 25px;
    margin: auto;
    z-index: 99999;
    padding: 0;
}

.dialog-button-bar {
    text-align: right;
    margin-top: 8px;
}

.loading-container > div {
    position: relative;
    width: 50px;
    height: 50px;
    margin: 10% auto;
    z-index: 99999;
}

.loading-container > div > div {
    width: 100%;
    height: 100%;
}