input:focus { background-color: yellow; }
body{
background-repeat: no-repeat;
}

.height400 {
        height: 400px;
        overflow-x: auto;
        overflow-y: auto;
}


.table-container table { display: flex;
		flex-flow: column;
		border: 1px  solid #778899;  
		height: 100%;
		width: 100%;
		}

.table-container table td {
		padding:  0.1em; /*  0px  */
		border: 1px  solid #778899;  
		overflow:hidden;
		white-space:nowrap;
		text-overflow: ellipsis;
		}
		
.table-container table th {
		padding:  0.1em;  /*  0px;  */
		border: 1px  solid #778899;  
		overflow:hidden;
		white-space:nowrap;
		text-overflow: ellipsis;
		}		
		
		
.table-container table thead { background-color: #8ca9cf; /* #4CAF50; */
			  color: white;
			  flex: 0 0 auto;
			  width: calc(100% - 0.9em); 
		    }

.table-container table tbody { flex: 1 1 auto;
			  display: block;
			  background-color: #F2F2F2;
			  color: black;
			  overflow-y: scroll; 
		    }

.table-container table tbody tr { width: 100%;}

.table-container table thead,
.table-container table tbody tr {
		    display: table;
		     table-layout: fixed;
		      }

			  


table#tbdelega {
        width: 45%;
		/* left: 10%; */
     	border: 1px solid black; 
		height: 70%; /* 16em 20em  40em;   */
		margin-left: 7%;
 
}
			  
table#tbpersonaliza {
        width: 45%;
		/* left: 10%; */
     	border: 1px solid black; 
		height: 70%; /* 16em 20em  40em;   */
		margin-left: 7%;
 
}			  
			  

.table-container td, .table-container th {
	/* appearance */
	border: 1px solid #778899;
	
	/* size 
	padding: 5px; */
	}

.table-container {
	/* text */
	;
	table-layout: fixed;
	width: 100%;
	}			  
			  
			  
.table-container tbody tr:nth-child(even) td {
	/* appearance */
	background-color: #eef2f9;
	background-image: -moz-linear-gradient(
		top,
		rgba(255,255,255,0.4) 0%,
		rgba(255,255,255,0.2) 50%,
		rgba(255,255,255,0.1) 51%,
		rgba(255,255,255,0.0) 100%);
	
	background-image: -webkit-gradient(
		linear, left top, left bottom,
		color-stop(0%,rgba(255,255,255,0.4)),
		color-stop(50%,rgba(255,255,255,0.2)),
		color-stop(51%,rgba(255,255,255,0.1)),
		color-stop(100%,rgba(255,255,255,0.0)));
		
	/* text */
	color: #262c31;
	font-size: 12px;
	}

/* tr.odd */

.table-container tbody tr:nth-child(odd) td {
	/* appearance */
	background-color: #d6e0ef;
	background-image: -moz-linear-gradient(
		top,
		rgba(255,255,255,0.4) 0%,
		rgba(255,255,255,0.2) 50%,
		rgba(255,255,255,0.1) 51%,
		rgba(255,255,255,0.0) 100%);
	
	background-image: -webkit-gradient(
		linear, left top, left bottom,
		color-stop(0%,rgba(255,255,255,0.4)),
		color-stop(50%,rgba(255,255,255,0.2)),
		color-stop(51%,rgba(255,255,255,0.1)),
		color-stop(100%,rgba(255,255,255,0.0)));
		/* text */
	color: #262c31;
	font-size: 12px;
	}
	.table-container tbody tr:nth-child(odd) td.desactivo {
	/* appearance */
	background-color: #F3BCC3;
	color: #000000;
	font-size: 12px;
	}

	.table-container tbody tr:nth-child(even) td.desactivo {
	/* appearance */
	background-color: #BC858D;
	color: #000000;
	font-size: 12px;
	}
	
	.table-container tbody tr:nth-child(odd) td.resaltar {
	/* appearance */
	background-color: #73dcff; 
	color: #8c0023;
	font-size: 12px;
	}

	.table-container tbody tr:nth-child(even) td.resaltar {
	/* appearance */
	background-color:  #00d9a3; 
	color:  #b30000;
	font-size: 12px;
	}
	
	
	
	
	

.table-container tr:hover { background-color: yellow; }	
	

.table-container thead tr th,
.table-container thead tr td,
.table-container tfoot tr th, 
.table-container tfoot tr td {
	/* appearance */
	background-color: #8ca9cf;
	background-image: -moz-linear-gradient(
		top,
		rgba(255,255,255,0.4) 0%,
		rgba(255,255,255,0.2) 50%,
		rgba(255,255,255,0.1) 51%,
		rgba(255,255,255,0.0) 100%);
	
	background-image: -webkit-gradient(
		linear, left top, left bottom,
		color-stop(0%,rgba(255,255,255,0.4)),
		color-stop(50%,rgba(255,255,255,0.2)),
		color-stop(51%,rgba(255,255,255,0.1)),
		color-stop(100%,rgba(255,255,255,0.0)));
		
	/* text */
	color: #121517;
	font-size: 13px;
	font-weight: bold;
    text-shadow: 0 1px 1px #e8ebee;   /* se nota la sombra */ 
	}			  
			  

  
			  
			  
.table-container {
			 overflow:auto;
			height: 75%; /* 16em 20em  40em;   */
			padding: 0.1em;
		}
		

.desactivo{ 
    background: #454545;
		color: #ffffff;
}

.resaltar{
 background: #00d9d9;
		color: #b30000;
}

.delegacion{
	font-size:18px;
	color: #0000ff;
	}
	
.titular{
	font-size: 1.5em;
	color: #00698c;
	}
	

.responsable{
	font-size:12px;
	color: #0000ff;
}	
	
	
.noimput {
	   color: white;
	/*	padding: 0;
		border: 0px solid lightgrey;
		overflow:hidden;
		white-space:nowrap;
		text-overflow: ellipsis;
		background:transparent; */
		background-color: #AAAAAA;
		}  
		
input:required:invalid, input:focus:invalid { background-color: #FF0000; }		

.erronea {
		padding: 0;
		border: 0px solid lightgrey;
		overflow:hidden;
		white-space:nowrap;
		text-overflow: ellipsis;
		background:transparent;
		background-color: #FF0000;
		color: white;
		font-size: 14px;
		}
.aviso {
		padding: 0;
		border: 0px solid lightgrey;
		overflow:hidden;
		white-space:nowrap;
		text-overflow: ellipsis;
		background:transparent;
		background-color: yellow;
		}
.numero {
	  text-align: right;
}		


.error {  color: white; background-color: #FF0000;}

.horas {  color: black; background-color: white; }


.miError {
 display: none;
 background:red;
 color:white ;
 font-size: 1.2em;
 padding: 10px 10px 10px 35px;
 margin: 0 auto; 
 overflow: auto;
 /* top: 0; left: 0; bottom: 0; right: 0; */
 left: 50%;
 top: 50%;
 transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  position: absolute; /* fixed; */
 text-align:left; 
 z-index: 100;
 }


/* a.#desactivo:link, a.#desactivo:visited {
    color: white;
} */		
				


		
	
