/*--------------Tela Login--------------------*/

body{background-image:  url(../img/dust_scratches.png); }




.painel{background: none !important; border: none !important; box-shadow:none;}
.painelh{background: none !important; border: none !important;}
.rec-senha{text-align: center; padding-top: 5%;padding-bottom: 5%;}
.rec-senha a {color: #979797;  padding-top: 2px;}
.userr{text-align: center;}
.userr i{font-size: 149px;color: #adadad;}
.painelh h3{font-size: 40px;
            color: #979797;
            text-align: center;}
.bord-contorno{background: #dee1e8;
              border-radius: .4em;}
#bt-email{margin: 0;}
#bt-pass{margin: 0;}
.em{padding-top: 9px;
    padding-bottom: 9px;
    padding-left: 8px;
    padding-right: 2px;}
.pass{padding-top: 9px;
    padding-bottom: 9px;
    padding-right: 2px;
    padding-left: 8px;}
.go{padding-top: 6px;
    padding-bottom: 6px;
    margin-top: 3px;
    }
.go-bt{border-radius: 0px 4px 4px 0px;
       background-color: #3c8dbc;
       border-color: #3c8dbc;
       font-weight: bold;
       padding: 8px 6px;}
.go-bt:hover{border-radius: 0px 4px 4px 0px;
       background-color: #2fa4e8;
       border-color: #2fa4e8;
       font-weight: bold;
       padding: 8px 6px;}
 .central-painel{padding-top: 7%;}
.btn:active{box-shadow: none;}
.btn-regit:hover {color: #979797;;}
.btn-rec{text-decoration: none;}
.btn-rec:hover {text-decoration: none;}
@media only screen and (max-width: 900px) {
   .go-bt {
    border-radius: 4px 4px 4px 4px;
    float: right !important;    
 }
}
#email{border-radius: .4em;}
#password{border-radius: .4em;}
input:-webkit-autofill,
 input:-webkit-autofill:hover,
 input:-webkit-autofill:focus,
 input:-webkit-autofill:active {
 -webkit-box-shadow: 0 0 0px 1000px white inset !important;
  }
.back-geren{background-color: none;}
.tit-date {background-color: none;padding-bottom: 2% !important;padding-left: 0 !important;padding-right: 0 !important;margin: 0 !important; }

.tit-org{padding-top: 1%;padding-bottom: 2%; }
#ti-reg h2{color: #505050;}
#ti-reg span{color: #505050;}

#datePicker{padding-top: 7%;}

.tb-tit{background: #4d4d4d;color: #fff;}

tbody tr th:nth-child(1),tbody tr td:nth-child(2),tbody tr td:nth-child(3),tbody tr td:nth-child(4){padding-left: 4px !important;}


textarea{resize: none; }

.tit-date h2{font size: 18px; margin: 0; font-weight: bold; padding-top: 2%;} /*ok */

.tit-date .subt{font-size: 17px; display: block;}/*ok */



.ge{padding-top: 19px !important;;}
.setor{padding-top: 19px !important;}
#datePicker{padding: 0; width: 38%; float: right; margin-right: 1%;}/*ok */

.dt-env{padding-top: 17px; padding-right: 0 !important; padding-left: 0 !important; padding-bottom: 12px !important;}

#env{float: right; }
tbody tr td div{padding-left: 2%;padding-right: 2%;}/*ok */


                               /* so mobile */
@media (max-width: 1200px) {

    .tit-date h2{font size: 18px;text-align: center; font-weight: bold;} /*ok */
    .tit-date .subt{font size: 12px; text-align: center; font-weight: bold; display: block; padding-top: 1%;}/*ok */
    #datePicker{    width: 41%; padding-bottom: 6%;}/*ok */
    tbody tr th:nth-child(1),tbody tr td:nth-child(2),tbody tr td:nth-child(3),tbody tr td:nth-child(4){padding-left: 2px !important;
    padding-right: 2px !important;}
    #tbodyge  strong {font-size: 10px!important;}
    thead tr th{padding: 4px 0px 4px 5px !important; font-size: 12px !important; }/*ok */
    /*.tb-tit th:nth-child(1){width: 20px !important;}*/
    /*.tb-tit th:nth-child(2){width: 29% !important;}
    .tb-tit th:nth-child(3){width: 29% !important;}
    .tb-tit th:nth-child(4){width: 29% !important;}*/
    tbody tr td{padding: 0 5px 0 5px !important;}/*ok */ 
    tbody tr td div{padding-top: 0px !important;padding-left: 0px; padding-right: 0px;}/*ok */
    tbody input.form-control {padding: 0px 5px;}/*ok */
    tbody select{padding-left: 0px !important;font-size: 9px!important; padding-right: 0px!important;}
    tbody tr td div span{padding: 0px 0px 0px 0px!important;}/*ok icone relogio */
    #env{padding: 7px 6px !important;/* margin-top: 20%!important; */margin-left: 1%;margin-right: 1%;font-size: 13px;}/*ok */
}
@media (max-width: 768px) {
    tbody tr td div{padding-top: 7px !important;padding-left: 0px; padding-right: 0px;}/*ok */

}


.table { background: #ffffff; }

    
   


/* Tela de Menu */

#redepbcom {position: relative; padding-top: 9px;}
#redepbcom ul{padding: 0;}
#redepbcom ul li{margin: 0;padding: 0;list-style: none; display: inline;}
#redepbcom ul li a img{width: 12%;}




















.tvcabobranco a{
            background-image: url(../img/tvcb.png);
} 
.tvcabobranco a:hover{
            background-image: url(../img/tvcb2.png);
}



.tvparaiba a{
            background-image: url(../img/tvpb.png);
} 
.tvparaiba a:hover{
            background-image: url(../img/tvpb2.png);
}




.g1paraiba a{
            background-image: url(../img/g1pb.png);
} 
.g1paraiba a:hover{
            background-image: url(../img/g1pb2.png);
}



.globoesportepb a{
            background-image: url(../img/gepb.png);
} 
.globoesportepb a:hover{
            background-image: url(../img/gepb2.png);
}


.jornaldaparaiba a{
            background-image: url(../img/jpb.png);
} 
.jornaldaparaiba a:hover{
            background-image: url(../img/jpb2.png);
}

.cabobrancofm a{
            background-image: url(../img/cbfm.png);
} 
.cabobrancofm a:hover{
            background-image: url(../img/cbfm2.png);
}

.cbnparaiba a{
            background-image: url(../img/cbnpb.png);
} 
.cbnparaiba a:hover{
            background-image: url(../img/cbnpb2.png);
}

  .tvcabobranco a, .cbnparaiba a, .cabobrancofm a, .jornaldaparaiba a, .globoesportepb a, .tvparaiba a, .g1paraiba a{
            display: inline-block;
            background-size: 100%;
            width: 67px;
            height: 39px;
            background-repeat: no-repeat;
  }

@media only screen and (max-width: 1199px) {
.marchan{font-size: 13px!important; font-weight: bold!important;}
.tvcabobranco a, .cbnparaiba a, .cabobrancofm a, .jornaldaparaiba a, .globoesportepb a, .tvparaiba a, .g1paraiba a{
          display: inline-block;
          background-size: 100%;
          width: 48px;
          height: 39px;
          background-repeat: no-repeat;}
#munu-desktop ul li a {padding-right: 10px!important;padding-left: 3px!important;padding-top: 16px!important;}
}

@media only screen and (max-width: 1024px) {
  .marchan{font-size: 13px!important; font-weight: bold!important;}
  .tvcabobranco a, .cbnparaiba a, .cabobrancofm a, .jornaldaparaiba a, .globoesportepb a, .tvparaiba a, .g1paraiba a{
            display: inline-block;
            background-size: 100%;
            width: 48px;
            height: 39px;
            background-repeat: no-repeat;}
  #munu-desktop ul li a {padding-right: 10px!important;padding-left: 3px!important;padding-top: 16px!important;}
}


@media only screen and (max-width: 768px) {
  .navbar-toggle {
  margin-right: 0px!important;}
}




@media only screen and (max-width: 542px) {
  
  .tvcabobranco a, .cbnparaiba a, .cabobrancofm a, .jornaldaparaiba a, .globoesportepb a, .tvparaiba a, .g1paraiba a{
            display: inline-block;
            background-size: 100%;
            width: 56px;
            height: 33px;
            background-repeat: no-repeat;

  }
}
@media only screen and (max-width: 465px) {
  
  .tvcabobranco a, .cbnparaiba a, .cabobrancofm a, .jornaldaparaiba a, .globoesportepb a, .tvparaiba a, .g1paraiba a{
            display: inline-block;
            background-size: 100%;
            width: 51px;
            height: 30px;
            background-repeat: no-repeat;
  }
}

@media only screen and (max-width: 430px) {

  .nomefooter{font-size: 12px;}
  
  .tvcabobranco a, .cbnparaiba a, .cabobrancofm a, .jornaldaparaiba a, .globoesportepb a, .tvparaiba a, .g1paraiba a{
            display: inline-block;
            background-size: 100%;
            width: 32px;
            height: 30px;
            background-repeat: no-repeat;

  }
}
@media only screen and (max-width: 297px) {
  
  .tvcabobranco a, .cbnparaiba a, .cabobrancofm a, .jornaldaparaiba a, .globoesportepb a, .tvparaiba a, .g1paraiba a{
            display: inline-block;
            background-size: 100%;
            width: 27px;
            height: 30px;
            background-repeat: no-repeat;

  }
}
@media only screen and (max-width: 376px) {
  .nomefooter{font-size: 10px;}
}
@media only screen and (max-width: 321px) {
  .nomefooter{font-size: 8px;}
}
















/* cadastramento de usuario */

.tb-tit{font-size: 16px;}
#tbodygerent td:nth-child(1){font-weight: bold;}
#tbody td:nth-child(1){font-weight: bold;}

.titmodaluser{background: #000 !important; color: #fff !important;}
#close {color: #fff; opacity: 1;}
.mdbody{padding-bottom: 0 !important;}
#new {float: right;}
#tbody tr td:nth-child(1){width: 40%;}
#tbody tr td:nth-child(2){width: 40%;}
#tbody tr td:nth-child(3){width: 40%;}

#tbody tr td button:nth-child(1){float: left;
    /* margin-left: 1%; */
    /* margin-right: 1%; */
    background-color: #fff;
    border: solid 1 px;
    border: solid 1px #c3bfbf;
    width: 50%;}
#tbody tr td button:nth-child(2){float: left; margin-left: 1%; margin-right: 1%; padding-left: 5%;  padding-right: 8%; background-color: #fff; border: solid 1 px; border: solid 1px #c3bfbf;}/*botao editar*/
#tbody tr td button:nth-child(3){float: left;
    /* margin-left: 1%; */
    /* margin-right: 1%; */
    background-color: #fff;
    border: solid 1 px;
    border: solid 1px #c3bfbf;
    width: 50%;}
.icad{padding-right: 8%;}

.destiv{padding-right: 8%; color: #dc1818;}
.activ{padding-right: 8%;  color: #16bd4b;}
.edit{padding-right: 8%;  color: #f39c12;}

@media only screen and (max-width: 990px) {
.destiv{padding-right: 0;}
.activ{padding-right: 0; }
.edit{padding-right: 0; }
#tbody tr td:nth-child(1){width: 35%;}
#tbody tr td:nth-child(2){width: 35%;}
#tbody tr td button:nth-child(1) span{display: none!important; padding: 0!important; margin: 0!important;}
#tbody tr td button:nth-child(2) span{display: none!important; padding: 0!important; margin: 0!important;}/*botao editar*/
#tbody tr td button:nth-child(3) span{display: none!important; padding: 0!important; margin: 0!important;}
.ds{width: 50%!important;}
.ac{width: 50%!important;}
.ed{width: 45%!important;}

}
.tb-tit th i:nth-child(1){padding-left: 1%;}
.tb-tit th i:nth-child(1){padding-left: 1%;}
.tb-tit th i:nth-child(1){padding-left: 1%;}






#tbodygerent tr td button:nth-child(1){float: left; background-color: #fff; border: solid 1 px; border: solid 1px #c3bfbf; width: 50%;}
#tbodygerent tr td button:nth-child(2){float: left; background-color: #fff; border: solid 1 px; border: solid 1px #c3bfbf; width: 50%;}
#tbodygerent tr td button:nth-child(3){float: left; background-color: #fff; border: solid 1 px; border: solid 1px #c3bfbf; width: 50%;}


#tbodyge tr td:nth-child(1){width: 5%;}
#tbodyge tr td:nth-child(2){width: 20%;}
#tbodyge tr td:nth-child(3){width: 10%;}
#tbodyge tr td:nth-child(4){width: 20%;}
#tbodyge tr td:nth-child(5){width: 12%;}


@media only screen and (max-width: 362px) {

#tbodyge tr td:nth-child(3){width: 14% !important;}

}


#tbodyuser tr td:nth-child(1){width: 40%;}
#tbodyuser tr td:nth-child(2){width: 40%;}
#tbodyuser tr td:nth-child(3){width: 20%;}



table.dataTable {width: 100% !important;}


.titmodalgerente{background: #000 !important; color: #fff !important;}

@media only screen and (max-width: 990px){
  #tbodygerent tr td:nth-child(1){width: 20%; font-size: 12px;}
  #tbodygerent tr td:nth-child(2){width: 26%; font-size: 12px;}
  #tbodygerent tr td:nth-child(3){width: 8%; font-size: 12px;}
  /*#tbodygerent tr td:nth-child(4){width: 18%; font-size: 8px;}*/

  #tbodygerent tr td button:nth-child(1) span {display: none!important;padding: 0!important;margin: 0!important;}
  #tbodygerent tr td button:nth-child(2) span {display: none!important;padding: 0!important;margin: 0!important;}
  #tbodygerent tr td button:nth-child(3) span {display: none!important;padding: 0!important;margin: 0!important;}
}

/*Tela administra */

.adm h1{color: #505050;;padding-left: 19px; font-weight: bold;}
.adm h3{color: #505050;; padding-left: 19px;font-size: 14px;margin-top: 2px;}
    

.adm-user{padding-top: 6%; margin-right: -8px !important; margin-left: -8px !important;}
.area-gerente {position: relative; padding: 0; border-radius: 2%;}
.area-usuario {position: relative; padding: 0; border-radius: 2%;}

.image-ger { top: -34% !important; position: relative;  z-index: 1; width: 100%; text-align: center; height: 50px;    margin-bottom: 0px; }
.image-ger img { clear: both; margin: auto; position: relative; top: -50px !important;}

.image-user { top: -34% !important; position: relative;  z-index: 1; width: 100%; text-align: center; height: 50px;    margin-bottom: 0px;}
.image-user img { clear: both; margin: auto; position: relative; top: -50px !important;}

.image-tec { top: -34% !important; position: relative;  z-index: 1; width: 100%; text-align: center; height: 50px;    margin-bottom: 0px;}
.image-tec img { clear: both; margin: auto; position: relative; top: -50px !important;}

.area-gerente{background: #fff;} 
.area-usuario{background: #fff;}

.txtgere{margin-top: 10px;}
.txtuser{margin-top: 10px;}

.txtgere h3{text-align: center; margin-top: 0%; padding: 0;}
.txtuser h3{text-align: center; margin-top: 0%; padding: 0;}
.txtgere h5{text-align: center; margin-top: 0%; padding: 0;}
.txtuser h5{text-align: center; margin-top: 0%; padding: 0;}

.acesso-gerente{border-top: 1px solid #428BCA; border-bottom: 1px solid #428BCA;}
.acesso-usuario{border-top: 1px solid #428BCA; border-bottom: 1px solid #428BCA;}

.acesso-gerente button{margin: 0 auto; display: block; width: 100%; text-align: center; margin: 0; margin-top: 5px;
margin-bottom: 5px; width: 33%; position: relative; left: 34%;}
.acesso-usuario button{margin: 0 auto; display: block; width: 100%; text-align: center; margin: 0; margin-top: 5px;
margin-bottom: 5px; width: 33%; position: relative; left: 34%;}

.acesso-gerente-informe h5 {padding-bottom: 12px; padding-top: 8px; padding-left: 17px;}
.acesso-usuario-informe h5 {padding-bottom: 12px; padding-top: 8px; padding-left: 17px;}

@media only screen and (max-width: 768px) {

  .txtgere h3 {font-size: 25px!important;}
  .txtuser h3 {font-size: 25px!important;}

  .txtgere {margin-top: -24px;}
  .txtuser {margin-top: -24px;}
.adm{padding-bottom: 4%;}


  .adm-user{padding-top: 8px;}
   .image-user img {
    clear: both;
    margin: auto;
    position: relative;
    top: 10px !important;
    left: -34% !important;}

    .image-ger img {
    clear: both;
    margin: auto;
    position: relative;
    top: 10px !important;
    left: -34% !important;}

    .image-tec img {
    clear: both;
    margin: auto;
    position: relative;
    top: 10px !important;
    left: -34% !important;}
}

@media only screen and (max-width: 500px) {
 


.adm{padding-bottom: 4%; text-align: center;}



   .image-user img {
    clear: both;
    margin: auto;
    position: relative;
    top: 10px !important;
    left: -37% !important;
    width: 16%;}

    .image-ger img {
    clear: both;
    margin: auto;
    position: relative;
    top: 10px !important;
    left: -37% !important;
    width: 16%;}

    .image-tec img {
    clear: both;
    margin: auto;
    position: relative;
    top: 10px !important;
    left: -37% !important;
    width: 16%;}

}



@media only screen and (max-width: 500px) {
#tbodyge tr td{font-size: 8px !important;}
#tbodyge tr td:nth-child(1){width: 5%;}
#tbodyge tr td:nth-child(2){width: 20%;}
#tbodyge tr td:nth-child(3){width: 20%;}
#tbodyge tr td:nth-child(4){width: 20%;}
#tbodyge tr td:nth-child(5){width: 35%;}



#tbodyuser tr td{font-size: 10px !important;}
#tbodyuser tr td:nth-child(1){width: 30%;}
#tbodyuser tr td:nth-child(2){width: 30%;}
#tbodyuser tr td:nth-child(3){width: 40%;}

}










@media only screen and (max-width: 362px) {

 

  tbody tr td div input {padding: 0 !important;}/*ok */
  /*#datetimepicker8 {padding-left: 31% ;}*/
  #datetimepicker8 span {padding: 2px;}
  #tbodyge tr td{font-size: 8px !important;}

  .txtgere { margin-top: 6px;}
  .txtuser { margin-top: 6px;}

  .txtgere h3 {font-size: 16px!important;}
  .txtuser h3 {font-size: 16px!important;}


.adm{padding-bottom: 4%; text-align: center; text-align: center;}

   .image-user img {
    clear: both;
    margin: auto;
    position: relative;
    top: 4px !important;

left: 0% !important;

width: 16%;}

    .image-ger img {
    clear: both;
    margin: auto;
    position: relative;
    top: 4px !important;
    left: 0% !important;
    width: 16%;}

    .image-tec img {
    clear: both;
    margin: auto;
    position: relative;
    top: 4px !important;
    left: 0% !important;
    width: 16%;}
}

@media only screen and (max-width: 1000px) {
  .area-usuario {
    margin-top: 48px;
}
.adm{padding-bottom: 4%; text-align: center;}

   .txtgere h3 {
    text-align: center;
    margin-top: 0%;
    padding: 0;
    font-size: 19px;
    font-weight: bold;}
   .txtuser h3 {
    text-align: center;
    margin-top: 0%;
    padding: 0;
    font-size: 19px;
    font-weight: bold;}
   .area-gerente {
    margin-top: -19px;}
   .area-usuario{
    margin-top: -3px;}
}


.adm{padding-bottom: 4%; text-align: center;}

   .txtgere h3 {
    text-align: center;
    margin-top: 0%;
    padding: 0;
    font-size: 16px;
    font-weight: bold;}
   .txtuser h3 {
    text-align: center;
    margin-top: 0%;
    padding: 0;
    font-size: 16px;
    font-weight: bold;}}


.adm{padding-bottom: 4%; text-align: center;}

   .txtgere h3 {
    text-align: center;
    margin-top: 0%;
    padding: 0;
    font-size: 16px;
    font-weight: bold;}
   .txtuser h3 {
    text-align: center;
    margin-top: 0%;
    padding: 0;
    font-size: 16px;
    font-weight: bold;}}


.modal {
}
.vertical-alignment-helper {
    display:table;
    height: 100%;
    width: 100%;
}
.vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
}
.modal-content {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width:inherit;
    height:inherit;
    /* To center horizontally */
    margin: 0 auto;
}

footer {
    background: #000;
    position: fixed;
    
    padding: 10px;
    bottom: 0px;
    width: 100%;
    /*text-shadow: 1px 1px #555555;*/
    z-index: 1000;
}

.table tr td {
  vertical-align: middle !important;
}

.table tr td img {
  border: 1px solid #c4bcbc;
  width: 60px;
  height: 60px;
}

.afastado {
  background: #ff0000;
}

.ausente {
  background: #ffaa004d;
}

.presente {
  background: #00ff0033;
}

#app {
  margin-bottom: 140px;
  min-height: 100vh;
}

#munu-desktop{float: right;}

#munu-desktop ul{  list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;}
#munu-desktop ul li{ float: left;}
#munu-desktop ul li a{ display: block;
    color: white;
    text-align: center;
    padding: 16px;
    text-decoration: none;}

#munu-desktop ul li a:hover {
    background-color: #111111;}
.navbar-default{ background-color: #000 !important;border-color: #e7e7e7 !important;}
.marchan{color: #fff !important;}



.print {
display:none;
}

.no-print { 
display:block; 
}

@media print {



  #DataTables_Table_0 thead tr th:nth-child(2) {width: 22% !important;}
  #DataTables_Table_0 thead tr th:nth-child(3) {width: 20% !important;}
  #DataTables_Table_0 thead tr th:nth-child(4) {width: 11% !important;}
  #DataTables_Table_0 thead tr th:nth-child(5) {width: 10% !important;}
  #DataTables_Table_0 thead tr th:nth-child(6) {width: 11% !important;}
  #DataTables_Table_0 thead tr th:nth-child(7) {width: 10% !important;}


  #ti-reg h2{ font-size: 23px !important;}
  #ti-reg span{ font-size: 14px !important;}


  .table tr td:nth-child(7) {text-align: center !important;}
  .table tr td:nth-child(8) {text-align: center !important;}
  .table tr td:nth-child(9) {text-align: center !important;}
  .table tr td:nth-child(10) {text-align: center !important;}

  tbody tr td:nth-child(5) strong {font-size: 0.8em !important; font-weight: 400 !important; float: left;}

  #cabeca img {max-width: 53% !important;padding-top: 2%;}
  .back-geren { max-width: 1024px; }
  .popover-content, .dataTables_filter { display: none; }

  .dataTables_wrapper .table { max-width: 1024px !important; }
  .table tr td { padding: 0 5px !important; }
  /*.tb-tit th:nth-child(0) { width: 30% !important; }*/
  /*.tb-tit th:nth-child(1) { width: 20% !important; }*/
  .tb-tit th:nth-child(2) { width: 25% !important; }
  .tb-tit th:nth-child(3) { width: 20% !important; }
  .tb-tit th:nth-child(4) { width: 11% !important; }
  .tb-tit th:nth-child(5) { width: 11% !important; }
  .tb-tit th:nth-child(6) { width: 30% !important; }


  table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
    display: none !important;
  }

  #app { min-height: 90vh; margin-bottom: 0; }

  * {
    /*background:transparent !important;*/
    color:#000 !important;
    text-shadow:none !important;
    filter:none !important;
    -ms-filter:none !important;
  }

  body {
    margin:0;
    padding:0;
    line-height: 1.4em;
  }

  nav, footer, video, audio, object, embed { 
    display:none; 
  }    

  .print {
    display:block;
  }

  .no-print { 
    display:none; 
  }  
}




td .form-control, td .input-group, td .form-group { width: 100% !important; }


.dataTables_filter label {
  font-weight: bold !important;
  color: #797979;
}

.legendas {
  margin-bottom: 0;
  color: #ffffff;
  background: #5d5d5d;
  border-radius: 4px;
  padding: 7px 0px 6px 9px;
  margin-bottom: 30px;
  /*max-width: 447px;*/
}




/*#DataTables_Table_0 thead tr th:nth-child(1){width: 95% !important;}*/
#DataTables_Table_0 thead tr th:nth-child(2){width: 17% ;}
#DataTables_Table_0 thead tr th:nth-child(3){width: 16% ;}
#DataTables_Table_0 thead tr th:nth-child(4){width: 12% ;}
#DataTables_Table_0 thead tr th:nth-child(5){width: 12% ;}
#DataTables_Table_0 thead tr th:nth-child(6){width: 12% ;}
#DataTables_Table_0 thead tr th:nth-child(7){width: 12% ;}
#DataTables_Table_0 thead tr th:nth-child(8){width: 36% ;}

tbody tr td:nth-child(3) {text-align: center;}
tbody tr td:nth-child(4) {font-size: 1.2em;}
tbody tr td:nth-child(5) {font-size: 1.2em;}


#dateat select {
    width: 100% !important;
    float: left !important;
    /* padding-left: 5px; */
    /* margin-left: 137px; */}

#datetimepicker8{ width: 100% !important;
    float: right !important;}


.azul:nth-child(1n+0) {background-color: #4c86d8 !important;}
.azul:nth-child(2n+0) {background-color: #5ca0ff !important;}
.azul:hover{background-color: #237eff !important;}

.verde:nth-child(1n+0) {background-color: #acdf97 !important;}
.verde:nth-child(2n+0) {background-color: #8cd270 !important;}
.verde:hover{background-color: #61b53f !important;}

.amarelo:nth-child(1n+0) {background-color: #ffe564 !important;}
.amarelo:nth-child(2n+0) {background-color: #fbd72a !important;}
.amarelo:hover{background-color: #e1c023 !important;}

.vermelho:nth-child(1n+0) {background-color: #ff8787 !important;}
.vermelho:nth-child(2n+0) {background-color: #ff7676 !important;}
.vermelho:hover{background-color: #f54545 !important;}







.atualizar{margin-right: 14px !important; padding: 7px 7px !important;font-size: 13px !important;}

@media (max-width: 992px) {
    #DataTables_Table_0 thead tr th:nth-child(2){width: 0% ;}
    .legendas {margin-bottom: 6px;}  
}

@media (max-width: 597px) {
    .tb-tit th:nth-child(1){width: 0px !important;}
    #DataTables_Table_0 thead tr th:nth-child(1){width: 95% !important;}
}


#tabela{ padding: 4px !important;}
                               /* so mobile */
@media (max-width: 500px) {

  .atualizar{margin-right: 14px !important; padding: 7px 3px !important;font-size: 13px !important;}

  .legendas {
  font-size: 10px;
    text-align: center;
    margin-bottom: 2%;
  }
   
   .city_filter{padding-left: 5px !important; padding-right: 2px !important;}

    .tit-date h2{font size: 18px;text-align: center; font-weight: bold;} /*ok */
    .tit-date .subt{font size: 12px; text-align: center; font-weight: bold; display: block; padding-top: 1%;}/*ok */
    #datePicker{    width: 41%; padding-bottom: 6%;}/*ok */

   .table tr td img {
    border: 2px solid;
    width: 50px;
    height: 50px;}

    tbody tr td:nth-child(5) {font-size: 1em;}

    #tbodyge  strong {font-size: 10px!important;}

    thead tr th{padding: 4px 0px 4px 2px!important; font-size: 12px !important; }/*ok */

    .tb-tit th:nth-child(1){width: 0px !important;}
    #DataTables_Table_0 thead tr th:nth-child(1){width: 90% !important; padding-left: 5px !important;}

    .tb-tit th:nth-child(2){width: 29% !important;}
    #DataTables_Table_0 thead tr th:nth-child(2){width: 45% !important; padding-left: 5px !important;}

    .tb-tit th:nth-child(3){width: 29% !important;}
     #DataTables_Table_0 thead tr th:nth-child(3){width: 55% !important; padding-left: 5px !important;}


    .tb-tit th:nth-child(4){width: 29% !important;}

    tbody tr td{ padding-left: 5px !important;}/*ok */ 

    tbody tr td div{padding-top: 7px !important;padding-left: 0px; padding-right: 0px;}/*ok */
    tbody tr td div input {padding: 4 !important;}/*ok */

     tbody  select{padding-left: 0px !important;font-size: 11px!important; padding-right: 0px!important;}

    tbody tr td div span{padding: 0px 0px 0px 0px!important;}/*ok icone relogio */

    #env{display: none;}/*ok */



  #DataTables_Table_0 thead tr th:nth-child(4){display: none !important;}
  #DataTables_Table_0 thead tr th:nth-child(5){display: none !important;}
  #DataTables_Table_0 thead tr th:nth-child(6){display: none !important;}
  #DataTables_Table_0 thead tr th:nth-child(7){display: none !important;}
  #DataTables_Table_0 thead tr th:nth-child(8){display: none !important;}


  #DataTables_Table_0 tbody tr td:nth-child(7){display: none !important;}
  #DataTables_Table_0 tbody tr td:nth-child(8){display: none !important;}
  #DataTables_Table_0 tbody tr td:nth-child(9){display: none !important;}
  #DataTables_Table_0 tbody tr td:nth-child(10){display: none !important;}
  #DataTables_Table_0 tbody tr td:nth-child(11){display: none !important;}

  /*.area-usuario {margin: 10px 0;}*/

}


@media (min-width: 992px) and (max-width: 1199px) { 
.manha {width: 193px !important; top: -23px !important;}
.tarde {width: 191px !important; top: -23px !important;}
.dataTables_filter label{margin-bottom: 35px !important; width: 37% !important; margin-right: 108px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 104% !important;}
}

@media (min-width: 768px) and (max-width: 992px) { 
.manha {width: 140px !important; top: -23px !important;}
.tarde {width: 140px !important; top: -23px !important;}
.dataTables_filter label{margin-bottom: 35px !important; width: 34% !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 73% !important;}
}
@media (min-width: 727px) and (max-width: 767px) { 
.manha {width: 140px !important; top: -23px !important;}
.tarde {width: 140px !important; top: -23px !important;}
.dataTables_filter label{ margin-bottom: 35px !important; width: 24% !important;margin-right: 33px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 85% !important;}
}

@media (min-width: 684px) and (max-width: 726px) { 
.manha {width: 120px !important; top: -23px !important;}
.tarde {width: 120px !important; top: -23px !important;}
.dataTables_filter label{ margin-bottom: 35px !important; width: 24% !important;margin-right: 27px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 76% !important;}
}
@media (min-width: 658px) and (max-width: 683px) { 
.manha {width: 120px !important; top: -23px !important;}
.tarde {width: 120px !important; top: -23px !important;}
.dataTables_filter label{     margin-bottom: 35px !important;
    width: 22% !important;
    margin-right: 14px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 76% !important;}
}
@media (min-width: 643px) and (max-width: 658px) { 
.manha {width: 120px !important; top: -23px !important;}
.tarde {width: 120px !important; top: -23px !important;}
.dataTables_filter label{    margin-bottom: 35px !important;
    width: 15% !important;
    margin-right: 37px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 76% !important;}
}
@media (min-width: 600px) and (max-width: 642px) { 
.manha {width: 120px !important; top: -23px !important;}
.tarde {width: 120px !important; top: -23px !important;}
.dataTables_filter label{margin-bottom: 35px !important;
    width: 43% !important;
    margin-right: 312px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 76% !important;}
}
@media (min-width: 501px) and (max-width: 600px) { 
.manha {width: 120px !important; top: -23px !important;}
.tarde {width: 120px !important; top: -23px !important;}
.dataTables_filter label{margin-bottom: 35px !important;
    width: 43% !important;
    margin-right: 312px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 76% !important;}
}


@media (min-width: 280px) and (max-width: 500px) { 
.manha {width: 120px !important; top: -23px !important;}
.tarde {width: 120px !important; top: -23px !important;}
.dataTables_filter label{ margin-bottom: 34px !important;
    width: 67% !important;
    margin-right: 32px !important;
    font-size: 14px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 86% !important;;}
}
@media (min-width: 360px) and (max-width: 412px) { 
.manha {width: 120px !important; top: -23px !important;}
.tarde {width: 120px !important; top: -23px !important;}
.dataTables_filter label{ margin-bottom: 34px !important;
    width: 67% !important;
    margin-right: 32px !important;
    font-size: 14px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 86% !important;;}
}
@media (min-width: 413px) and (max-width: 500px) { 
.manha {width: 120px !important; top: -23px !important;}
.tarde {width: 120px !important; top: -23px !important;}
.dataTables_filter label{ margin-bottom: 34px !important;
    width: 67% !important;
    margin-right: 32px !important;
    font-size: 14px !important;}
div.dataTables_wrapper div.dataTables_filter input {width: 86% !important;;}
}




@media (min-width: 768px) and (max-width: 1199px) { 

/*#DataTables_Table_0 thead tr th:nth-child(1){width: 95% !important;}*/
#DataTables_Table_0 thead tr th:nth-child(2){width: 0% !important;}
#DataTables_Table_0 thead tr th:nth-child(3){width: 18% !important;}
#DataTables_Table_0 thead tr th:nth-child(4){width: 12% !important;}
#DataTables_Table_0 thead tr th:nth-child(5){width: 12% !important;}
#DataTables_Table_0 thead tr th:nth-child(6){width: 12% !important;}
#DataTables_Table_0 thead tr th:nth-child(7){width: 12% !important;}
#DataTables_Table_0 thead tr th:nth-child(8){width: 30% !important;}
tbody tr td div { padding-top: 0px !important;}}


@media (min-width: 280px) and (max-width: 500px){ 
#adm-s div:nth-child(1){margin-bottom: 18px !important;}
#adm-s div:nth-child(2){margin-bottom: 4px !important;}
#adm-s div:nth-child(3){margin-bottom: 4px !important;}
#adm-s div:nth-child(4){margin-bottom: 4px !important;}
#adm-s div:nth-child(5){margin-bottom: 4px !important;}
#adm-s div:nth-child(6){margin-bottom: 4px !important;}
}
@media (min-width: 501px) and (max-width: 768px){ 
#adm-s div:nth-child(1){margin-bottom: 18px !important;}
#adm-s div:nth-child(2){margin-bottom: 4px !important;}
#adm-s div:nth-child(3){margin-bottom: 4px !important;}
#adm-s div:nth-child(4){margin-bottom: 4px !important;}
#adm-s div:nth-child(5){margin-bottom: 4px !important;}
#adm-s div:nth-child(6){margin-bottom: 4px !important;}
}
@media (min-width: 769px) and (max-width: 992px){ 
#adm-s div:nth-child(1){margin-bottom: 36px !important;}
#adm-s div:nth-child(2){margin-bottom: 20px !important;}
#adm-s div:nth-child(3){margin-bottom: 20px !important;}
#adm-s div:nth-child(4){margin-bottom: 20px !important;}
#adm-s div:nth-child(5){margin-bottom: 20px !important;}
#adm-s div:nth-child(6){margin-bottom: 20px !important;}
}
@media (min-width: 992px){ 
#adm-s div:nth-child(1){margin-bottom: 0px !important; }
#adm-s div:nth-child(2){margin-bottom: 20px !important;}
#adm-s div:nth-child(3){margin-bottom: 20px !important;}
#adm-s div:nth-child(4){margin-bottom: 20px !important; margin-top: 16px !important;}
#adm-s div:nth-child(5){margin-bottom: 20px !important; margin-top: 16px !important;}
#adm-s div:nth-child(6){margin-bottom: 20px !important; margin-top: 16px !important;}
}

.manha{
    position: absolute;
    top: -28px;
    color: #fff;
    background: #a9a8a8;
    padding: 2px;
    display: block;
    width: 258px;
    text-align: center;}

.tarde{
    position: absolute;
    top: -28px;
    color: #fff;
    background: #a9a8a8;
    padding: 2px;
    display: block;
    width: 258px;
    text-align: center;}