.hexa{
  border: 0px;
  float: left;
  text-align: center;
  height: 35px;
  width: 60px;
  /*font-size: 22px;*/
  font-size: 17px;
   background: #f0f0f0;
  color: #3c3c3c;
  position: relative;
  margin-top: 15px;
}

.hexa:before{
  content: ""; 
  position:absolute; 
  left: 0; 
  width: 0; 
  height: 0;
  border-bottom: 15px solid #f0f0f0;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  top: -10px;
  
}

.hexa:after{
  content: ""; 
  position:absolute; 
  left: 0; 
  width: 0; 
  height: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  border-top: 15px solid #f0f0f0;
  bottom: -15px;
}

.timeline {
  position: relative;
  padding: 0;
  width: 100%;
  margin-top: 20px;
  list-style-type: none;
  font-size: 14px;
}

.timeline:before {
  position: absolute;
  left: 50%;
  top: 0;
  content: ' ';
  display: block;
  width: 2px;
  height: 100%;
  margin-left: -1px;
  background: rgb(213,213,213);
  background: -moz-linear-gradient(top, rgba(213,213,213,0) 0%, rgb(213,213,213) 8%, rgb(213,213,213) 92%, rgba(213,213,213,0) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(100%,rgba(125,185,232,1)));
  background: -webkit-linear-gradient(top, rgba(213,213,213,0) 0%, rgb(213,213,213) 8%, rgb(213,213,213) 92%, rgba(213,213,213,0) 100%);
  background: -o-linear-gradient(top, rgba(213,213,213,0) 0%, rgb(213,213,213) 8%, rgb(213,213,213) 92%, rgba(213,213,213,0) 100%);
  background: -ms-linear-gradient(top, rgba(213,213,213,0) 0%, rgb(213,213,213) 8%, rgb(213,213,213) 92%, rgba(213,213,213,0) 100%);
  background: linear-gradient(to bottom, rgba(213,213,213,0) 0%, rgb(213,213,213) 8%, rgb(213,213,213) 92%, rgba(213,213,213,0) 100%);
  z-index: 5;
}

.timeline li {
  padding: 2em 0;
}

.timeline .hexa{
  width: 16px;
  height: 10px;
  position: absolute;
  
  background: #00c4f3;
  z-index: 5;
  left: 0;
  right: 0;
  margin-left:auto;
  margin-right:auto;
  top: -30px;
  margin-top: 0;
}

.timeline .hexa:before {
  border-bottom: 4px solid #00c4f3;
  border-left-width: 8px;
  border-right-width: 8px;
  top: -4px;
}

.timeline .hexa:after {
  border-left-width: 8px;
  border-right-width: 8px;
  border-top: 4px solid #00c4f3;
  bottom: -4px;
}

.direction-l,
.direction-r {
  float: none;
  width: 100%;
  text-align: center;
}

.flag-wrapper {
  text-align: center;
  position: relative;
 
}

/*.flag {
  position: relative;
  display: inline;
  background: rgb(255,255,255);
  font-weight: 600;
  z-index: 15;
  padding: 7px 10px;
  text-align: left;
  border-radius: 5px;
  color: #071f47;
}*/
.flag {
  position: relative;
  display: inline;
  background: #c30000;
  font-weight: bold;
  z-index: 15;
  padding: 7px 10px;
  text-align: left;
  border-radius: 5px;
  color: #ffffff;
  /*font-size: 20px;*/
  font-size: 15px;
}

.direction-l .flag:after,
.direction-r .flag:after {
  content: "";
  position: absolute;
  left: 50%;
  top: -15px;
  height: 0;
  width: 0;
  margin-left: -8px;
  border: solid transparent;
  border-bottom-color: rgb(255,255,255);
  border-width: 8px;
  pointer-events: none;
}

.direction-l .flag {
  -webkit-box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
  -moz-box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
  box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
}

.direction-r .flag {
  -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
  -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
  box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
}

.time-wrapper {
  display: block;
  position: relative;
  margin: 1px 0 0 0;
  z-index: 14;
  line-height: 1em;
  vertical-align: middle;
    color: #fff;
}

.direction-l .time-wrapper {
  float: none;
}

.direction-r .time-wrapper {
  float: none;
}

.time {
  background: #e6ffff;
  display: inline-block;
  padding: 1px;
  color: #003333;
  border-radius:1px;
}

div.solicitado{
  position: relative;
  margin: 1em 1em 1em 1em;
  padding: 1em;
  margin: 1em 1em 1em 1em;
  /*color: #004d00;*/
  color: #000000;	
    background: #d9d9d9;
    /*background: #a5a4a4;*/
	padding: 10px;
	border-width: 10px;
    border-radius: 5px;
    border-style: solid;
  /*border-color: #a5a4a4;*/
  border-color: #ff8000;
}

div.impactado{
  position: relative;
  margin: 1em 1em 1em 1em;
  padding: 1em;
  margin: 1em 1em 1em 1em;
  /*color: #fff;*/
  color: #000000;
  /*background: #cc9900;*/
  background: #d9d9d9;
   /*background: #c00000;*/
	border-width: 10px;
    border-radius: 5px;
    border-style: solid;
  border-color: #c00000;
}

div.original{
  position: relative;
  margin: 1em 1em 1em 1em;
  padding: 1em;
  margin: 1em 1em 1em 1em;
  /*color: #fff;*/	
  color: #000000;
	/*background: #023668;*/
    background: #d9d9d9;
	border-width: 10px;
    border-radius: 5px;
    border-style: solid;
    border-color: #023668;
}

div.alterado{
  position: relative;
  margin: 1em 1em 1em 1em;
  padding: 1em;
  margin: 1em 1em 1em 1em;
  /*color: #666600;*/	
  color: #000000;
	background: #d9d9d9;
    /*background: #ffff00;*/
	padding: 10px;
	border-width: 10px;
    border-radius: 5px;
    border-style: solid;
    border-color: #ffff00; 
}

div.depende{
  position: relative;
  margin: 1em 1em 1em 1em;
  padding: 1em;
  margin: 1em 1em 1em 1em;
  /*color: #fff;*/	
  color: #000000;
	background: #d9d9d9;
    /*background: #685002;*/
	padding: 10px;
	border-width: 10px;
    border-radius: 5px;
    border-style: solid;
    border-color: #685002;
}

div.incluido{
  position: relative;
  padding: 1em;
  margin: 1em 1em 1em 1em;
  /*color: #fff;*/	
  color: #000000;
	background: #d9d9d9;
    /*background: #00b050;*/
	padding: 10px;
	border-width: 10px;
    border-radius: 5px;
    border-style: solid;
	padding: 10px;
    border-color: #00b050; 
}

div.inicial{
  position: relative;
  padding: 1em;
  margin: 1em 1em 1em 1em;
  /*color: #000;*/
  color: #000000;
	background: #d9d9d9;
	padding: 10px;
	border-width: 10px;
    border-radius: 5px;
    border-style: solid;	
    border-color: #ffffff; 
}

div.excluido{
  position: relative;
  padding: 1em;
  margin: 1em 1em 1em 1em;
  /*color:  #5f6a6a ;*/	
  color: #a6a6a6;
  
    background: #d9d9d9;
    /*background: #C2B280;*/
    padding: 10px;
	border-width: 10px;
    border-radius: 5px;

    border-style: solid;
    border-color: #878787;
}

hr.diferenca{
    color: #c00000;
    background-color: #c00000;
    height: 15px;
    width: 20px;
}
hr.tempoSala{
    color: #00b050;
    background-color: #00b050;
    height: 15px;
    width: 20px;

}
hr.tempoCPU{
    color: #023668;
    background-color: #023668;
    height: 15px;
    width: 20px;
}

hr.picoCPU{
    color: #7b3929;
    background-color: #7b3929;
    height: 15px;
    width: 20px;
}

hr.horarioInicio{
    color:#6A4928;
    background-color:#6A4928;
    height: 15px;
    width: 20px;
}

hr.intervaloInicio{
    color:#FAD61D;
    background-color:#FAD61D;
    height: 15px;
    width: 20px;
}

hr.intervaloFinal{
    color:#E19720;
    background-color:#E19720;
    height: 15px;
    width: 20px;
}

hr.abendAdefinir{
    color: #DF01D7;
    background-color: #DF01D7;
    height: 15px;
    width: 20px;
}
hr.abendNegocio{
    color: #ffff00;
    background-color: #ffff00;
    height: 15px;
    width: 20px;
}
hr.abendProcessamento{
    color: #00b050;
    background-color: #00b050;
    height: 15px;
    width: 20px;
}
hr.abendOperador{
    color: #c00000;
    background-color: #c00000;
    height: 15px;
    width: 20px;
}
hr.abendTotal{
    color: #023668;
    background-color: #023668;
    height: 15px;
    width:20px;
}
hr.vermelho{
    color: #680402;
    background-color: #680402;
    height: 15px;
    width:20px;
}
hr.violeta{
    color: #6300C0;
    background-color: #6300C0;
    height: 15px;
    width:20px;
}
hr.verde{
    color: #3BC236;
    background-color: #3BC236;
    height: 15px;
    width:20px;
}
hr.violetaClaro{
    color: #F5E1E6;
    background-color: #F5E1E6;
    height: 15px;
    width:20px;
}
hr.verdeEscuro{
    color: #057A02;
    background-color: #057A02;
    height: 15px;
    width:20px;
}
hr.azulclaro{
    color:#0283FF;
    background-color: #0283FF;
    height: 15px;
    width:20px;
}
.direction-l .desc,
.direction-r .desc {
  position: relative;
  margin: 1em 1em 0 1em;
  padding: 1em;
  z-index: 15;
}

div.legenda {
    background: #009999;
  /*border-radius: 5px;*/
}

@media(min-width: 768px){
  .timeline {
    width: 660px;
    margin: 0 auto;
    margin-top: 20px;
  }

  .timeline li:after {
    content: "";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }
  
  .timeline .hexa {
    left: -28px;
    right: auto;
    top: 8px;
  }

  .timeline .direction-l .hexa {
    left: auto;
    right: -28px;
  }

  .direction-l {
    position: relative;
    width: 310px;
    float: left;
    text-align: right;
  }

  .direction-r {
    position: relative;
    width: 310px;
    float: right;
    text-align: left;
  }

  .flag-wrapper {
    display: inline-block;
  }
  
  /*.flag {
    font-size: 12px;
	background: #ccffff;
    font-weight: bold;
    padding-top: 10px;
  }*/

  .direction-l .flag:after {
    left: auto;
    right: -16px;
    top: 50%;
    margin-top: -8px;
    border: solid transparent;
    border-left-color: rgb(254,254,254);
    border-width: 8px;
  }

  .direction-r .flag:after {
    top: 50%;
    margin-top: -8px;
    border: solid transparent;
    border-right-color: rgb(254,254,254);
    border-width: 8px;
    left: -8px;
  }

  /*.time-wrapper {
    display: inline;
    vertical-align: middle;
    margin: 0;
  }*/

  .direction-l .time-wrapper {
    float: left;
  }

  .direction-r .time-wrapper {
    float: right;
  }

  .time {
    padding: 5px 10px;
  }

  .direction-r .desc {
    margin: 1em 0 0 0.75em;
  }
}

@media(min-width: 992px){
  .timeline {
    width: 800px;
    margin: 0 auto;
    margin-top: 20px;
  }

  .direction-l {
    position: relative;
    width: 380px;
    float: left;
    text-align: right;
  }

  .direction-r {
    position: relative;
    width: 380px;
    float: right;
    text-align: left;
  }
}


/*Filtros de Pesquisa*/

.labelSigla {
    border-color: #804200;
    background-color: #ff8400;
    font-color: #331a00;
    /*font-size: 25px;*/
    font-size: 20px;
}

#lbSigla {
    border: 1px solid #808080;
    background-color: #F0E68C;
    font-weight: bold;
}

tr.trSimula{
    background-color: #5b7193; 
    color: #edf0f4; 
    font-weight: bold; 
    border: 1px solid  #004d00;
}

td.tdSimula{
    border: 1px solid  #004d00;
}

.botaoProcessar{
    border: 1px solid  #606266;
    background-color: #d5dbe8;
    font-weight: bold; 
}

.resumo{
    text-align:center;
    border-style: solid; 
    background-color: #376092;
}