
	html, body{
		margin: 0;
		height:100%;
		font-family:Verdana, Geneva, sans-serif;
	}
	.page{
		height:100vh;
		background:#FFF;
	}
	#Encabezado{
	  	height:65px;
	  	background-color:#2C3E50;
	  	color:#FFF;
	}
	#Titulo{
		padding-top:10px;
		font-size:12px;
	}
	#Menu{
		/*padding-top:10px;*/
		color: #333333;
		font-size:13px;
	}
	#Menu a{
		text-decoration:none;
		color:black;
	}

	#Bottom{
		background-color:#ECF0F1;
		height:25px;	
		color:#666;
		padding-top:8px;
	}
	#Contenido{
		min-height:85%;
		font-size:15px; /* 13px */
		padding-top:15px;
		background-color: #dcdcdc; /*778899*/
		/*color: #FFFFFF;*/
	}
	
	.listadotabla{
		width:95%
	}
	.listapar{
		background-color:#E4E4E4;
	}
	.canceladoa{
		background-color:#ffa8a8;
	}
	.facturc{
		background-color:#BDD5E7;
	}
		
	.listadotabla th{
		font-size:15px;
		background:#FFF;
		color:#003;
		border-top: 0;
		border-bottom-width: 2px;
		border: 1px solid #ecf0f1;
		vertical-align: bottom;
		padding: 8px;
    	line-height: 1.42857;
		text-align: left;
		box-sizing: border-box;
		font-weight: bold;
		display: table-cell;
	}
	.listadotabla tr: {	
		
	}
	.listadotabla tr:hover {
       background-color: #ECF0F1;
	}
	.listadotabla td{
		border: 1px solid #ecf0f1;
		padding: 8px;
    	line-height: 1.42857;
    	vertical-align: top;
	    display: table-cell;
	}

	.listadotabla_c{
		width:95%
	}
	
	
	.listadotabla_c th{
		font-size:13px; /* 12px*/
		background:#FFF;
		color:#003;
		border-top: 0;
		border-bottom-width: 2px;
		border: 1px solid #ecf0f1;
		vertical-align: bottom;
		padding: 3px;
    	line-height: 1.42857;
		text-align: left;
		box-sizing: border-box;
		font-weight: bold;
		display: table-cell;
	}

	.listadotabla_c .cancelado{
		background-color:#FF6A6A;
	}

	.listadotabla_c tr: {	
		
	}
	.listadotabla_c tr:hover {
       background-color: #ECF0F1;
	}
	.listadotabla_c td{
		border: 1px solid #ecf0f1;
		padding: 3px;
		font-size:14px; /* 13px*/
    	line-height: 1.42857;
    	vertical-align: top;
	    display: table-cell;
	}

	.titulos{
		background-color:#95A5A6;
		font-size:14px;
		font-weight:bold;
		height:30px;
		color:#FFF;
		border-radius:8px;
		padding-top:10px;
	}
	.titulos_ama{
		background-color:#fdb913;
		font-size:14px;
		font-weight:bold;
		height:30px;
		color:#000;
		border-radius:8px;
		padding-top:10px;
	}
	.titulos_azu{
		background-color:#0069C8;
		font-size:14px;
		font-weight:bold;
		height:30px;
		color:#FFF;
		border-radius:8px;
		padding-top:10px;
	}
	.titulos_ver{
		background-color:#4CCC7F;
		font-size:14px;
		font-weight:bold;
		height:30px;
		color:#FFF;
		border-radius:8px;
		padding-top:10px;
	}
	.titulos_nar{
		background-color:#F44611;
		font-size:14px;
		font-weight:bold;
		height:30px;
		color:#FFF;
		border-radius:8px;
		padding-top:10px;
	}


/*#dbody{
  margin:0 auto;
  margin-top:10px;
  margin-bottom:10px;
  position:relative;
}*/

/*#contenido{
  text-align:justify;
  height: auto;
}*/

.sobreverde{
	
	font-style: normal;
	font-weight: normal;
	color: #FFFFFF;
}
/*link="#333333" vlink="#000000" alink="#003300"*/
a {
	color:#333333;
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}
td{
	
	color: #333333;
}
th{
	background-color: #2C3E50;
	color: #FFFFFF;
}
.cafe {
	background-color: #CCCC99;
	color: #333333;
}
.naranja {
	background-color: #FFCC33;
	color: #003333;
}
.gris {
	background-color: #acadad;
	color: #003333;
}
.azul {
	background-color: #ECF0F1;
	color: #3F3B33;
}

.cverde{
	border-radius: 10px;
	background-color: #4CCC7F;
	color: #FFF;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.cverde_s{
	border-radius: 8px;
	background-color: #4CCC7F;
	color: #FFF;
	padding: 4px;
	width: 200px;
	text-align: center;
}
.crojo{
	border-radius: 10px;
	background-color: #FF1414;
	color: #FFF;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.crojo_s{
	border-radius: 8px;
	background-color: #FF1414;
	color: #FFF;
	padding: 4px;
	width: 200px;
	text-align: center;
}
.cazul{
	border-radius: 10px;
	background-color: #0069C8;
	color: #FFF;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.cazul_s{
	border-radius: 8px;
	background-color: #0069C8;
	color: #FFF;
	padding: 5px;
	width: 200px;
	text-align: center;
}
.camarillo{
	border-radius: 10px;
	background-color: #D5A000;
	color: #FFF;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.camarillo_s{
	border-radius: 8px;
	background-color: #D5A000;
	color: #FFF;
	padding: 4px;
	width: 200px;
	text-align: center;
}
.cmicaja{
	border-radius: 10px;
	background-color: #fdb913;
	color: #FFF;
	padding: 8px;
	width: 250px;
	text-align: center;
	font-weight: bold;
}
.cmicaja:hover{
	background-color: #D5A000;
}
.cgris{
	border-radius: 10px;
	background-color: #A4A4A4;
	color: #FFF;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.clgris{
	border-radius: 10px;
	background-color: #D3D3D3;
	color: #000;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.csky{
	border-radius: 10px;
	background-color: #87CEEB;
	color: #000;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.caqua{
	border-radius: 10px;
	background-color: #66CDAA;
	color: #000;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.ckaki{
	border-radius: 10px;
	background-color: #F0E68C;
	color: #000;
	padding: 8px;
	width: 200px;
	text-align: center;
}
.tamarillo{
	color: #C8AC00;
}
.tazul{
	color: #0069C8;
}
.trojo{
	color: #FF1414;
}
.tverde{
	color: #4CCC7F;;
}

INPUT {
	/*font-size: 11px;
	font-family: geneva, verdana, arial, sans-serif; 
	color: #626953; */
	padding:4px;
	border: 1px;
	border-color: #7A8367;
	border-style: solid;
}
SELECT {
	/*FONT-size: 11px;
	font-family: Verdana, Arial, san-serif; 
	COLOR: #766d5b; */
	BACKGROUND-COLOR: #ffffff;
}
textarea { 
	/*font: 9px geneva, verdana, arial, sans-serif; 
	color: #626953; */
	border: 1px;
	border-color: #7A8367;
	border-style: solid; 
	padding-bottom: 0px; 
	padding-left: 3px; 
	padding-right: 0px; 
	background-color: #f2f2f2;
}



.btn-sm{
    padding: 6px 9px;
    font-size: 13px;
    line-height: 1.5;
    border-radius: 3px;
}

.btn-default {
    color: #fff;
    background-color: #95a5a6;
    border-color: #95a5a6;
}

.btn-default:hover{
    color: #fff;
    background-color: #798D8F;
    border-color: #798D8F;
}

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 5px 8px;
    font-size: 12px;
    line-height: 1.42857;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    
}
.btn-primary {
    color: #fff;
    background-color: #2c3e50;
    border-color: #2c3e50;
}
.btn-primary:hover {
    color: #fff;
    background-color: #1A252F;
    border-color: #1A252F;
}

.btn-cancel {
    color: #fff;
    background-color: #f23c50;
    border-color: #f23c50;
}
.btn-cancel:hover {
    color: #fff;
    background-color: #851c28;
    border-color: #851c28;
}

.btn-regre {
    color: #fff;
    background-color: #4CC97E;
    border-color: #4CC97E;
}
.btn-regre:hover {
    color: #fff;
    background-color: #01913A;
    border-color: #01913A;
}


/***** Estilo para Detalle *******/

.det-style {
    max-width: 90%;
    padding: 10px 20px;
    background: #f4f7f8;
    margin: 10px auto;
    padding: 20px;
    background: #f4f7f8;
    border-radius: 8px;
    /* font-family: Georgia, "Times New Roman", Times, serif; */
}
/*.det-style table {
	width: 95%;
	
}*/

.det-style-asig {
    max-width: 99%;
    padding: 10px 10px;
    background: #f4f7f8;
    margin: 10px auto;
    padding: 5px;
    background: #f4f7f8;
    border-radius: 8px;
    /* font-family: Georgia, "Times New Roman", Times, serif; */
}

/***** Estilos para formularios *****/

.form-style-5{
	max-width: 90%; /*500px;*/
	padding: 10px 20px;
	background: #f4f7f8;
	margin: 10px auto;
	padding: 20px;
	background: #f4f7f8;
	border-radius: 8px;
	/*font-family: Georgia, "Times New Roman", Times, serif;*/
}
.form-style-5 fieldset{
	border: none;
}
.form-style-5 legend {
	font-size: 1.4em;
	margin-bottom: 10px;
}
.form-style-5 label {
	display: block;
	/*margin-bottom: 8px;*/
}
.form-style-5 .asig{
	width: 40% !important; 
}

.form-style-5 input[type="text"],
.form-style-5 input[type="date"],
.form-style-5 input[type="datetime"],
.form-style-5 input[type="email"],
.form-style-5 input[type="number"],
.form-style-5 input[type="search"],
.form-style-5 input[type="time"],
.form-style-5 input[type="url"],
.form-style-5 textarea,
.form-style-5 select {
	/*font-family: Georgia, "Times New Roman", Times, serif;*/
	background: rgba(255,255,255,.1);
	border: none;
	border-radius: 4px;
	font-size: 15px;
	margin: 0;
	outline: 0;
	padding: 8px; /*10px;*/
	width: 100%;
	box-sizing: border-box; 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; 
	background-color: #e8eeef;
	color:#8a97a0;
	-webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.03) inset;
	box-shadow: 0 1px 0 rgba(0,0,0,0.03) inset;
	margin-bottom: 15px; /*30px;*/
}
.form-style-5 input[type="text"]:focus,
.form-style-5 input[type="date"]:focus,
.form-style-5 input[type="datetime"]:focus,
.form-style-5 input[type="email"]:focus,
.form-style-5 input[type="number"]:focus,
.form-style-5 input[type="search"]:focus,
.form-style-5 input[type="time"]:focus,
.form-style-5 input[type="url"]:focus,
.form-style-5 textarea:focus,
.form-style-5 select:focus{
	background: #d2d9dd;
}
.form-style-5 select{
	-webkit-appearance: menulist-button;
	height:35px;
}
.form-style-5 .number {
	background: #95A5A6; /*acadad;*/ /*2c3e50;*/ /*1abc9c;*/
	color: #fff;
	height: 30px;
	width: 30px;
	display: inline-block;
	font-size: 0.8em;
	margin-right: 4px;
	line-height: 30px;
	text-align: center;
	text-shadow: 0 1px 0 rgba(255,255,255,0.2);
	border-radius: 15px 15px 15px 0px;
}

.form-style-5 input[type="submit"],
.form-style-5 input[type="button"]
{
	position: relative;
	display: inline-block; /*block;*/
	padding: 12px 20px 12px 20px;
	color: #FFF;
	margin: 0 auto;
	background: #3b5c7d; /*1abc9c;*/
	font-size: 16px;
	text-align: center;
	font-style: normal;
	/*width: 30%;*/
	border: 1px solid #2c3e50; /*16a085*/
	border-width: 1px 1px 3px;
	margin-bottom: 10px;
}
.form-style-5 input[type="submit"]:hover,
.form-style-5 input[type="button"]:hover
{
	background: #2c3e50; /*109177;*/
}


.form-style-5 .cancelar 
{
	background: #f23c50 !important; /*109177;*/
}

.form-style-5 .cancelar:hover
{
	background: #851c28 !important; /*109177;*/
}

.form-style-5 .confirmar 
{
	background: #4CCC7F !important; /*109177;*/
}

.form-style-5 .confirmar:hover
{
	background: #2d9e5a !important; /*109177;*/
}



.form-style-5 .regre 
{
	background: #4CC97E !important; /*109177;*/
}

.form-style-5 .regre:hover
{
	background: #01913A !important; /*109177;*/
}

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}


.divDatos{

	background-color: #E4E4E4; 
	padding: 10px;"
}

/* LOGIN */

.wrapper {
  display: flex;
  align-items: center;
  flex-direction: column; 
  justify-content: center;
  width: 100%;
  min-height: 100%;
  padding: 20px;
}

#formContent {
  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;
  background: #fff;
  padding: 30px;
  width: 90%;
  max-width: 450px;
  position: relative;
  padding: 0px;
  -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
  box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
  text-align: center;
}

#formFooter {
  background-color: #f6f6f6;
  border-top: 1px solid #dce8f1;
  padding: 25px;
  text-align: center;
  -webkit-border-radius: 0 0 10px 10px;
  border-radius: 0 0 10px 10px;
}

/* ANIMATIONS */

/* Simple CSS3 Fade-in-down Animation */
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

/* Simple CSS3 Fade-in Animation */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fadeIn {
  opacity:0;
  -webkit-animation:fadeIn ease-in 1;
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  animation-duration:1s;
}

.fadeIn.first {
  -webkit-animation-delay: 0.4s;
  -moz-animation-delay: 0.4s;
  animation-delay: 0.4s;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;

}

.fadeIn.second {
  -webkit-animation-delay: 0.6s;
  -moz-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

.fadeIn.third {
  -webkit-animation-delay: 0.8s;
  -moz-animation-delay: 0.8s;
  animation-delay: 0.8s;
}

.fadeIn.fourth {
  -webkit-animation-delay: 1s;
  -moz-animation-delay: 1s;
  animation-delay: 1s;
}

/* Simple CSS3 Fade-in Animation */
.underlineHover:after {
  display: block;
  left: 0;
  bottom: -10px;
  width: 0;
  height: 2px;
  background-color: #56baed;
  content: "";
  transition: width 0.2s;
}

.underlineHover:hover {
  color: #0d0d0d;
}

.underlineHover:hover:after{
  width: 100%;
}


button.btn-cont-w3 {
    background:#2c3e50; /*#174c81;*/
    color: #ffffff;
    padding: 11px 25px;
    margin-top: 25px;
    letter-spacing: 1px;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -o-border-radius: 0px;
    -moz-border-radius: 0px;
    -ms-border-radius: 0px;
    font-size: 16px;
    max-width: 140px;
}



.pro_container {
      /*width: 900px;*/
      margin: 0 auto; 
  }
  .progressbar li {
      list-style-type: none;
      width: 20%;
      float: left;
      font-size: 12px;
      position: relative;
      text-align: center;
      color: #7d7d7d;
  }
  .progressbar li:before {
      width: 30px;
      height: 30px;
      content: "";
      line-height: 30px;
      border: 2px solid #7d7d7d;
      display: block;
      text-align: center;
      margin: 0 auto 10px auto;
      border-radius: 50%;
      background-color: white;
      /*z-index: 0;*/
  }
  .progressbar li:after {
      width: 92%; /* 100%*/
      height: 2px;
      content: '';
      position: absolute;
      background-color: #7d7d7d ;
      top: 15px;
      left: -50%;
      /*z-index: -1;*/ /* -1 */
  }
  .progressbar li:first-child:after {
      content: none;
  }
  .progressbar li.active {
      color: #55b776 ; /*green;*/
  }
  .progressbar li.active:before {
      border-color: #55b776;
      background-color: #55b776;
  }
  .progressbar li.active + li:after {
      background-color: #55b776;
  }
  .progressbar li.done:before {
      border-color: #55b776;
      background-color: #55b776;
  }
  .progressbar li.done + li:after {
      background-color: #55b776 ;

  }
  .progressbar li.inactive:before {
      border-color: #7d7d7d;
      background-color: #7d7d7d;
  }
  .progressbar li.inactive + li:after {
      background-color: #7d7d7d;
  }

  .progressbar li.alerta:before {
      border-color: #cece51;
      background-color: #cece51;
  }
  .progressbar li.alerta + li:after {
      background-color: #cece51;
  }


/* MENU DE ACCIONES DETALLE ASIGNACION */

#menuasig {
    padding: 0;
    margin: 0;
    border: 0; 
}
 
#menuasig ul, li {
    list-style: none;
    margin: 0;
    padding: 0; 
}
 
#menuasig ul {
    position: relative;
    z-index: 597;
    float: left; 
}
 
#menuasig ul li {
    float: left;
    min-height: 1px;
    line-height: 1em;
    vertical-align: middle; 
}
 
#menuasig ul li.hover,
#menuasig ul li:hover {
    position: relative;
    z-index: 599;
    cursor: default; 
}
 
#menuasig ul ul {
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 598;
    width: 100%; 
}
 
#menuasig ul ul li {
    float: none; 
}
 
#menuasig ul li:hover > ul {
    visibility: visible; 
}
 
#menuasig ul ul {
    top: 0;
    left: 100%; 
}
 
#menuasig ul li {
    float: none; 
}
 
#menuasig {
    width: 255px; /* 255px;*/ 
}
 
#menuasig span, #menuasig a {
    display: inline-block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-decoration: none; 
}
 
#menuasig:after, #menuasig ul:after {
    content: '';
    display: block;
    clear: both; 
}
 
#menuasig ul, #menuasig li {
    /*width: 100%;*/ 
}
#menuasig li {
    background: #fdb913; /*#dddddd;*/
}
#menuasig li:hover {
    background: #eba600; /*#f6f6f6;*/ 
}
#menuasig a {
    color: #000; /*666666;*/
    line-height: 160%;
    padding: 3px; /*11px 28px 11px 28px;*/
    width: 115px; /*253px;*/ 
}
#menuasig ul ul li {
    background: #F0E68C; /*f6f6f6;*/ 
}
#menuasig ul ul li:hover {
    background: #ded268; /*dddddd;*/ 
}
#menuasig ul ul li:hover a {
    color: #000000; /*666666;*/ 
}
#menuasig ul ul li ul li {
    background: #dddddd; 
}
#menuasig ul ul li ul li:hover {
    background: #b7b7b7; 
}
#menuasig .has-sub {
    position: relative; 
}
 
#menuasig .has-sub:after, #menuasig .has-sub > ul > .has-sub:hover:after {
    content: '';
    display: block;
    width: 10px;
    height: 9px;
    position: absolute;
    right: 5px;
    top: 50%;
    margin-top: -5px;
}
 
#menuasig .fa-angle-right {
    float: right;
}


/* TABS DETALLE ASIGNACION */

.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
  width: 94%;
  margin: 0 2.5rem;
/*padding: 1rem;*/
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 0px; /*12px;*/
  border: 1px solid #ccc;
  border-top: none;
  width: 94%;
  margin: 0 2.5rem;
}

.tabcontent {
  animation: fadeEffect 1s; /* Fading effect takes 1 second */
}

/* Go from zero to full opacity */
@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}