* {
  box-sizing: border-box;
}

.container {
    background:url(img/logoFab.png) no-repeat right;  
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 470px;
    height: 400px;
    margin: auto;
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
}

input[type=password], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  top: 250px;
  resize: vertical;
}

label {
  padding: 12px 12px 12px 0;
  display: inline-block;
}


.movimentamaq {
    background:url(img/logomover2.png) no-repeat right;  
    position:  absolute; 
    top:  100px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 700px;
    height: 850px;
    margin: auto; 
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}

.movimentatroca {
    background:url(img/logomover2.png);  
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 700px;
    height: 850px;
    margin-left: 20px;
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}

.apagamaq {
    background:url(apagar.png) no-repeat right;  
    position: absolute;
    width: 105px;
    height: 105px;
    margin-top: 10px;
    margin-right: 100px;
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}



.confirmar {
    background:url(img/novousu.png) no-repeat right;  
 /* position: absolute;*/
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 800px;
    height: 980px;
    margin: auto;
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}

.EditaUsu {
    background:url(img/editausu.png) no-repeat right;  
 /*  position: absolute; */
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 800px;
    height: 980px;
    margin: auto;
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}

.confirmarLE {
    float: left;
    background-color: tomato#ddd;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 49%;
    height: 80%;
    margin-top: 90px;
   /*  box-shadow: 0px 0px 10px black; */
    padding: 10px;
    box-sizing: border-box;
}

.confirmarLD {
    float: right;
    background-color: #ddd;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 49%;
    height: 80%;
    margin-top: 90px;
   /* box-shadow: 0px 0px 10px black; */
    padding: 10px;
    box-sizing: border-box;
}

.confirmaRodape {
    float: right;
    background-color: #ddd;
    /*
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    */
    width: 98%;
    height: 10%;
    margin-top: 5px;
   /* box-shadow: 0px 0px 10px black; */
    padding: 10px;
    box-sizing: border-box;
}



.NovaMaq {
    background:url(img/logocadastramaq.png) no-repeat right;  
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 650px;
    height: 750px;
    margin: auto;
    box-shadow: 0px 0px 15px black;
    padding: 20px;
    box-sizing: border-box;
}
#meudiv {
    background:url(img/logomover2.png) no-repeat right;  
    position:  absolute; 
    top:  100px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 700px;
    height: 850px;
    margin: auto; 
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}

.NovoPOS {
    background:url(img/cadpos.png) no-repeat right;  
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 650px;
    height: 750px;
    margin: auto;
    box-shadow: 0px 0px 15px black;
    padding: 20px;
    box-sizing: border-box;
}

.EditPOS {
    background:url(img/edtpos.png) no-repeat right;  
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 650px;
    height: 750px;
    margin: auto;
    box-shadow: 0px 0px 15px black;
    padding: 20px;
    box-sizing: border-box;
}

.NovaRota {
    background:url(img/logocadastrarota.png) no-repeat right;  
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 650px;
    height: 750px;
    margin: auto;
    box-shadow: 0px 0px 15px black;
    padding: 20px;
    box-sizing: border-box;
}

.NovaMaqLado {
    /*position: absolute;
    background-color:mediumaquamarine; */
    float: left;
    top: 100px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 300px;
    height: 550px;
    margin: auto;
    /*/box-shadow: 0px 0px 15px black;
    //padding: 20px;
    //box-sizing: border-box;*/
}

.MoverLDir {
    /*position: absolute; */
    /*background-color:mediumaquamarine; */
    float: right;
    top: 120px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 300px;
    height: 300px;
    margin: auto;
    /*/box-shadow: 0px 0px 15px black;
    //padding: 20px;
    //box-sizing: border-box;*/
}

.NovaMaqFrase {
    /*/position: absolute;
    //background-color:mediumaquamarine;*/
    float: left;
    top: 600px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 680px;
    height: 80px;
    margin: auto;
    /*/box-shadow: 0px 0px 15px black;
    //padding: 20px;
    //box-sizing: border-box;*/
}
.construcao {
    background:url(img/emconstrucao.gif) no-repeat right; 
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 400px;
    height: 400px;
    margin: auto;
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}

.bloqueado {
    background:url(img/bloqueado.gif) no-repeat right;  
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 480px;
    height: 480px;
    margin: auto;
    box-shadow: 0px 0px 10px black;
    padding: 20px;
    box-sizing: border-box;
}

.col-25 {
  float: left;
  width: 80%;
  margin-top: 6px;
  display:         flex;
}


.Fonte19
{
  bottom: 10px;
  padding-top: 20px;
  font-size: 20px;
  font-weight: bold;  
}

.FonteVoltar
{
  font-size: 28px;
  font-weight: bold;  
  width: 30%;
  float: left;
  margin: 0 auto;
}



.FonteVoltarFech
{
  font-size: 28px;
  font-weight: bold;  
  width: 60%;
  float: left;
  margin: 0 auto;
}

.FonteVoltarN
{
  float: right;
  margin-top: 100px;  
  margin-right: 20%;  
  font-size: 28px;
  font-weight: bold;  
  width: 30%;
}

.apagaetc
{
  float: next;
  margin-top: 100px;  
  margin-right: 10%;  
  font-size: 20px;
  font-weight: bold;  
  width: 100%;
}

.FonteVoltarVT
{
  float: right;
  margin-top: 100px;  
  margin-right: 5%;  
  font-size: 28px;
  font-weight: bold;  
  width: 20%;
}

.FonteApagaUs
{
  float: right;
  margin-top: 40px;  
  margin-right: 5%;  
  font-size: 28px;
  font-weight: bold;  
  width: 40%;
}

.FonteVoltarU
{
  float: right;
  margin-right: 10px;  
  font-size: 20px;
  font-weight: bold;  
  width: 30%;
}

.FonteVoltarNovMaq
{
  float: right;
  margin-right: 10px;  
  font-size: 20px;
  font-weight: bold;  
  width: 40%;
}

.FonteRemover
{
  float: right;
  margin-right: 10px;  
  font-size: 16px;
  font-weight: bold;  
  width: 100%;
}

.FonteVoltarUR
{
  float: right;
  margin-right: 10px;  
  font-size: 20px;
  font-weight: bold;  
  width: 50%;
}

.FonteVoltarUV
{
  float: right;
  margin-right: 10px;  
  font-size: 20px;
  font-weight: bold;  
  width: 30%;
}

.col-50 {
  float: left;
  width: 40%;
  margin-top: 10px;
}

.col-75 {
  float: left;
  width: 65%;
  margin-top: 50%;
}

.NovaPlc {
  float: left;
  width: 85%;
  margin-top: 20%;
}

.NovaPlc2 {
  float: left;
  width: 85%;
  margin-top: 1%;
}

.col-752 {
  float: left;
  width: 65%;
  margin-top: 2%;
}

input[type=submit] {
  background-color: #4C50AF;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  width: 30%;
  margin-top: 10px;
  float: right;
}

input[type=submit]:hover {
  background-color: #40C1FF;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
.myButton2 {
        float: left;
	background-color:#D0D620;
	-moz-border-radius:13px;
	-webkit-border-radius:13px;
	border-radius:13px;
	border:2px solid #18ab29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:17px;
	padding:5px 15px;
	text-decoration:none;
	text-shadow:0px 1px 3px #2f6627;
       
}
.myButton2:hover {
	background-color:#1a2847;
}
.myButton2:active {
	position:relative;
	top:1px;
}

.ButMov {
        float: left;
	background-color:#000000;
	-moz-border-radius:13px;
	-webkit-border-radius:13px;
	border-radius:13px;
	border:2px solid #18ab29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:18px;
        font-weight: bold; 
	padding:5px 15px;
	text-decoration:none;
	text-shadow:0px 1px 3px #2f6627;
       
}
.ButMov:hover {
	background-color:#3333FF;
}
.ButMov:active {
	position:relative;
	top:1px;
}

body {
  font-family: Arial;
  padding: 10px;
  background: #f1f1f1;
}

/* Header/Blog Title */
.header {
  padding: 5px;
  text-align: center;
  background:  beige;
}

.header h1 {
  font-size: 30px;
  color: #3333FF;
}

.searchers {
  float: left;
  width: 20%;
  padding: 14px;
}

/* Style the top navigation bar */
.topnav {
  overflow: hidden;
  background-color: gold;
}
/* Style the top navigation bar */
.topcfg {
  overflow: hidden;
  background-color: gold;
}

/* Style the topnav links */
.topnav a {
  float: left;
  display: block;
  /*color: #f2f2f2; */
  color: DodgerBlue;  
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 20px;
  font-weight:bold;  
  /* margin-left: 10px; */
}

.topnav input[type=text], select, textarea {
  width: 50%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical; 
}

/* Change color on hover */
.topnav a:hover {
/*  background-color: #ddd; */
  background-color:Tomato;
  color: black;
}

.Ganso input[type=text], select, textarea{
  float: left;
  display: block;
  /*color: #f2f2f2; */
  color:DodgerBlue;  
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 20px;
  font-weight: bold;  
}

/* Change color on hover */
.ganso:hover {
/*  background-color: #ddd; */
  background-color:Tomato;
  color: black;
}

/* Style the topnav links */
.topnav input[type=search] {
  float: left;
  width: 30%;
  padding: 12px 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 20px;

  resize: vertical;
}

/* ********************************************************************************************** */
/* Style the topnav links */
.topnavdif a {
  float: left;
  display: block;
  /*color: #f2f2f2; */
  color:indianred;  
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 20px;
  font-weight: bold;  
}

.topnavdif input[type=text], select, textarea {
  width: 50%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical; 
}

/* Change color on hover */
.topnavdif a:hover {
/*  background-color: #ddd; */
  background-color:Tomato;
  color: black;
}

/* Style the topnav links */
.topnavdif input[type=search] {
  float: left;
  width: 30%;
  padding: 12px 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 20px;

  resize: vertical;
}

/* Create two unequal columns that floats next to each other */
/* Left column */
.leftcolumn {   
  float: left;
  width: 33.33%;
  background-color: #f1f1f1;
  padding-left: 10px;
  
}

.leftonline {   
  float: left;
  width: 30%;
  background-color: #f1f1f1;
  padding-left: 10px;
  
}

.rigthonline {   
  float: left;
  width: 25%;
  background-color: #f1f1f1;
  padding-left: 10px;
  
}

.leftcolumn45 {   
  float: left;
  width: 40%;
  background-color: #f1f1f1;
  padding-left: 10px;
  
}

.rightcolumn45 {
  float: left;
  width: 40%;
  background-color: #f1f1f1;
  padding-left: 10px;
}

.leftcolumn h2 {
/*  font-size: 50px; */
  color: deeppink; /*//#FF0000; // size: 50px;*/
}
/* Right column */
.rightcolumn {
  float: left;
  width: 33.33%;
  background-color: #f1f1f1;
  padding-left: 10px;
}

.rightcolumn h2 {
    /*
//  font-size: 50px;
 // color: #3333FF; //#FF0000; // size: 50px; */
}

/* Fake image */
.fakeimg {
  background-color: #aaa;
  width: 100%;
  padding: 20px;
}

/* Add a card effect for articles */
.card {
  background-color:antiquewhite;
  padding: 20px;
  margin-top: 20px;
  
}

/* Add a card effect for articles */
.cardExRat {
  background-color:antiquewhite;
  padding: 10px;
  margin-top: 10px;
  
}

.editmeio {
  width: 50%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
}

/* Add a card effect for articles */
.card2 {
  background-color:antiquewhite;
  width: 45%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}


/* Footer */
.footer {
  padding: 20px;
  text-align: center;
  background: #ddd;
  margin-top: 20px;
}

/* Responsive layout - when the screen is less than 800px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
  .leftcolumn, .rightcolumn {   
    width: 100%;
    padding: 0;
  }
}

/* Responsive layout - when the screen is less than 400px wide, make the navigation links stack on top of each other instead of next to each other 
@media screen and (max-width: 400px) {
  .topnav a {
    float: none;
    width: 100%;
  }
  
@media screen and
(max-width: 380px) and
(orientation:portrait)

#customers {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}
}
*/
/* Small Sizes */
@media (max-width: 1024px) { 
  
  /* Responsive Table */
  .table-responsive {
    display: block;
    position: relative;
    width: 100%;
  }

  .table-responsive thead,
  .table-responsive tbody,
  .table-responsive th,
  .table-responsive td,
  .table-responsive tr {
    display: block;
  }
  .table-responsive td,
  .table-responsive th {
    height: 35px;
  }

  .table-responsive thead {
    float: left;
  }

  .table-responsive tbody {
    width: auto;
    position: relative;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
  }

  .table-responsive tbody tr {
    display: inline-block;
  }

  
  .table td:last-child {
     border-right: #999999 solid 1px;
  }
}

#customers {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
  font-size: 20px;
}

#customers tr:nth-child(even){background-color:tomato; }/* #f2f2f2;} */

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}

#customers2 {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#customers2 td, #customers2 th {
  border: 1px solid #ddd;
  padding: 2px;
  font-size: 20px;  
}

#customers2 tr:nth-child(even){background-color:yellow; }/* #f2f2f2;} */

#customers2 tr:hover {background-color: #ddd;}

#customers2 th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #3333FF; 
  color: white;
}

#customers3 {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#customers3 td, #customers3 th {
  border: 1px solid #ddd;
  padding: 2px;
  font-size: 20px;  
}

#customers3 tr:nth-child(even){background-color:azure; }/* #f2f2f2;} */

#customers3 tr:hover {background-color: #ddd;}

#customers3 th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #3333FF; 
  color: white;
}

#customers4 {
  font-family: Arial, Helvetica, sans-serif;
  float: left;
  margin-left: 10px;  
  border-collapse: collapse;
  width: 22%;
}

#customers4 td, #customers4 th {
  border: 1px solid #ddd;
  padding: 2px;
  font-size: 20px;  
}

#customers4 tr:nth-child(even){background-color:khaki; }/* #f2f2f2;} */

#customers4 tr:hover {background-color: #ddd;}

#customers4 th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #3333FF; 
  color: white;
}

#customers5 {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#customers5 td, #customers5 th {
  border: 1px solid #ddd;
  padding: 2px;
  font-size: 20px;  
}

#customers5 tr:nth-child(even){background-color:yellow; }/* #f2f2f2;} */

#customers5 tr:hover {background-color: #ddd;}

#customers5 th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #3333FF; 
  color: white;
}

/* usado para os Switchs */
.switch {
  position: relative;
  display: inline-block;
  width: 90px;
  height: 34px;
}

.switch input {display:none;}

/* usado para os Switchs */
.swnovousu {
  float: right;  
  position: relative;
  display: inline-block;
  width: 90px;
  height: 40px;
}

.Novousulab {
    float: left;
    background-color: #D0D620;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 70%;
    height: 40px;
    /*margin-top: 90px;
   // box-shadow: 0px 0px 10px black; */
    padding: 10px;
    box-sizing: border-box;
}
.NovousulabDir {
    float: left;
    background-color: antiquewhite;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 70%;
    height: 40px;
    /* margin-top: 90px;
   // box-shadow: 0px 0px 10px black; */
    padding: 10px;
    box-sizing: border-box;
}

.Novousucb {
    float: left;
    background-color: #2196F3;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 100px;
    height: 40px;
    /*margin-top: 90px;
   // box-shadow: 0px 0px 10px black; */
    padding: 1px;
    box-sizing: border-box;
}

.swnovousu input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ca2222;
  -webkit-transition: .4s;
  transition: .4s;
   border-radius: 34px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 50%;
}

input:checked + .slider {
  background-color: #2ab934;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(55px);
}

/*------ ADDED CSS ---------*/
.slider:after
{
 content:'OFF';
 color: white;
 display: block;
 position: absolute;
 transform: translate(-50%,-50%);
 top: 50%;
 left: 50%;
 font-size: 16px;
 font-family: Verdana, sans-serif;
}

input:checked + .slider:after
{  
  content:'ON';
}
/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.div-select {
    width:280px;  /* Tamanho final do select */
    overflow:hidden; /* Esconde o conteúdo que passar do tamanho especificado */
/*    overflow: scroll;
    height: 15%;
/*    overflow:hidden; /* Esconde o conteúdo que passar do tamanho especificado */
}
  
.div-select select {

      background: url(img/seta.gif) no-repeat #354880;  /* Imagem de fundo (Seta) */
      background-position: 205px center;  /*Posição da imagem do background*/
      width: 280px; /* Tamanho do select, maior que o tamanho da div "div-select" */
     /* height:20%; /* altura do select, importante para que tenha a mesma altura em todo os navegadores */
      font-family:Arial, Helvetica, sans-serif; /* Fonte do Select */
      font-size:18px; /* Tamanho da Fonte */
      padding:13px 20px 13px 12px; /* Configurações de padding para posicionar o texto no campo */
      color:#fff; /* Cor da Fonte */
      text-indent: 0.01px; /* Remove seta padrão do FireFox */
      text-overflow: "";  /* Remove seta padrão do FireFox */     
      select::-ms-expand {display: none;} /* Remove seta padrão do IE*/
  
}

.div-selusu {
    width:200px;  /* Tamanho final do select */
    overflow:hidden; /* Esconde o conteúdo que passar do tamanho especificado */
    float: left;
/*    overflow: scroll;
    height: 15%;
/*    overflow:hidden; /* Esconde o conteúdo que passar do tamanho especificado */
}
  
.div-selusu select {

      background: url(img/seta.gif) no-repeat #354880;  /* Imagem de fundo (Seta) */
      background-position: 205px center;  /*Posição da imagem do background*/
      width: 200px; /* Tamanho do select, maior que o tamanho da div "div-select" */
     /* height:20%; /* altura do select, importante para que tenha a mesma altura em todo os navegadores */
      font-family:Arial, Helvetica, sans-serif; /* Fonte do Select */
      font-size:18px; /* Tamanho da Fonte */
      padding:13px 20px 13px 12px; /* Configurações de padding para posicionar o texto no campo */
      color:#fff; /* Cor da Fonte */
      text-indent: 0.01px; /* Remove seta padrão do FireFox */
      text-overflow: "";  /* Remove seta padrão do FireFox */     
      select::-ms-expand {display: none;} /* Remove seta padrão do IE*/
  
}
.divLisOL {
    width:99%;  /* Tamanho final do select */
    float: left;
    overflow:hidden; /* Esconde o conteúdo que passar do tamanho especificado */
    
}
.divLisOL select{
      background:  no-repeat #354880;  /* Imagem de fundo (Seta) */
      width: 99%; /* Tamanho do select, maior que o tamanho da div "div-select" */
      font-family:Arial, Helvetica, sans-serif; /* Fonte do Select */
      font-size:18px; /* Tamanho da Fonte */
      font-weight: bold;  
      padding:12px 18px 12px 11px; /* Configurações de padding para posicionar o texto no campo */
      color:#fff; /* Cor da Fonte */
      text-indent: 0.01px; /* Remove seta padrão do FireFox */
      text-overflow: "";  /* Remove seta padrão do FireFox */     
      select::-ms-expand {display: none;} /* Remove seta padrão do IE*/
}

.div-listbox {
    width:280px;  /* Tamanho final do select */
    overflow:hidden; /* Esconde o conteúdo que passar do tamanho especificado */
/*    overflow: scroll;
    height: 15%;
/*    overflow:hidden; /* Esconde o conteúdo que passar do tamanho especificado */
}
  
.div-listbox select {
      background:  no-repeat #354880;  /* Imagem de fundo (Seta) */
      /*background-position: 205px center;  /*Posição da imagem do background*/
      width: 280px; /* Tamanho do select, maior que o tamanho da div "div-select" */
     /* height:20%; /* altura do select, importante para que tenha a mesma altura em todo os navegadores */
      font-family:Arial, Helvetica, sans-serif; /* Fonte do Select */
      font-size:18px; /* Tamanho da Fonte */
      padding:13px 20px 13px 12px; /* Configurações de padding para posicionar o texto no campo */
      color: #fff; /* Cor da Fonte */
      text-indent: 0.01px; /* Remove seta padrão do FireFox */
      text-overflow: "";  /* Remove seta padrão do FireFox */     
      select::-ms-expand {display: none;} /* Remove seta padrão do IE*/
  
}

.editaususelect {

      background: url(img/seta.gif) no-repeat #354880;  /* Imagem de fundo (Seta) */
      background-position: 205px center;  /*Posição da imagem do background*/
      width: 280px; /* Tamanho do select, maior que o tamanho da div "div-select" */
     /* height:20%; /* altura do select, importante para que tenha a mesma altura em todo os navegadores */
      font-family:Arial, Helvetica, sans-serif; /* Fonte do Select */
      font-size:18px; /* Tamanho da Fonte */
      padding:13px 20px 13px 12px; /* Configurações de padding para posicionar o texto no campo */
      color:#fff; /* Cor da Fonte */
      text-indent: 0.01px; /* Remove seta padrão do FireFox */
      text-overflow: "";  /* Remove seta padrão do FireFox */     
      select::-ms-expand {display: none;} /* Remove seta padrão do IE*/
  
}


.line{
width: 1px;
height: 8px;
border-bottom: 10px solid black; 
position:  relative;
}

.TodaTela {   
/*  float: left; */
  width: 100%;
  background-color: #f1f1f1;
  padding-left: 5px;
  
}

.card3 {
  background-color:antiquewhite;
  width: 33%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.cardFech {
  background-color: gold;
  width: 32%;
  float: left;  
  padding: 1px;
  margin-left: 5px;
  margin-top:  5px;
}

.cardOnMeio {
  background-color: gold;
  width: 15%;
  float: left;  
  padding: 1px;
  margin-left: 5px;
  margin-top:  5px;
}

.cardOLEsq {
  background-color: gold;
  width: 42%;
  float: left;  
  padding: 1px;
  margin-left: 1px;
  margin-top:  1px;
}

.cardFechEsq {
  background-color: gold; /* #0091FF;  /*gold; */
  width: 40%;
  float: left;  
  padding: 1px;
  margin-left: 5px;
  margin-top:  5px;
}

.ConfgEsq {
  background-color: gold; /* #0091FF;  /*gold; */
  width: 45%;
  float: left;  
  padding: 1px;
}
.ConfgMeio {
  background-color: gold; /* #0091FF;  /*gold; */
  width: 10%;
  float: left;  
  padding: 1px;
}

.cardFechMeio {
  background-color: #D0D620;
  width: 35%;
  float: left;  
  padding: 1px;
  margin-left: 5px;
  margin-top:  5px;
}
.cardFechDir {
  background-color: gold;
  width: 40%;
  float: left;  
  padding: 1px;
  margin-left: 5px;
  margin-top:  5px;
}


.card4 {
  background-color:beige;
  width: 33%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.cardrota {
  background-color: aquamarine;
  width: 50%;
  float: right;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}
.card5 {
  background-color: seashell;
  width: 33%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.Abrecofre {
  background-color: seashell;
  width: 20%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.card6 {
  background-color: aqua;
  width: 33%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.cardTravar {
  background-color: lightcoral;
  width: 33%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}
.card7 {
  background-color: gainsboro;
  width: 100%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.card8 {
  background-color: goldenrod;
  width: 48%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.card9 {
  background-color: coral;
  width: 48%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.card10 {
  background-color: goldenrod;
  width: 80%;
  float: left;  
  padding: 1px;
  margin-left: 2px;
  margin-top: 2px;
}

.InpConf {
  width: 32%;
  font-size: 22px;
  font-weight: bold; 
  padding: 3px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
  float: right;  
}

.InpRota {
  width: 15%;
  font-size: 22px;
  font-weight: bold; 
  padding: 3px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
  /*float: right;  */
}

.LabConf {
  width: 66%;
  font-size: 18px;
  font-weight: bold; 
 /* padding: 8px;
  //  border: 1px solid #ccc;
  // border-radius: 4px; */
  text-align: right;
  resize: vertical;
  float: left;  
}

.LabConf2 {
  width: 66%;
  font-size: 18px;
  font-weight: bold; 
 /* padding: 8px;
  //  border: 1px solid #ccc;
  // border-radius: 4px; */
  text-align: left;
  resize: vertical;
  float: left;  
}

.FildConf {
  width: 100%;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: left;  
}

.FildConfOnLine {
  width: 290px;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: left;  
}

.FildConfg {
  width: 48%;
  font-size: 18px;
  font-weight: bold; 
  padding: 2px;
  resize: vertical;
  float: left;  
}

.FildConfUnots {
  width: 25%;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: left;  
}

.FildConfSMS {
  width: 100%;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: left;  
}

.FildRota {
  width: 100%;
  margin-top: 100px;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: left;  
}

.FildMov {
  width: 50%;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: left;  
}

.FildEmpresa {
  width: 200px;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: left;  
}

.FildMovDir {
  width: 95%;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: right;  
}

.FildConfNovMaq {
  
  margin-top: 50px;
  width: 95%;
  font-size: 20px;
  font-weight: bold; 
  padding: 8px;
  /*/  border: 1px solid #ccc;
  // border-radius: 4px;
  //text-align: right; */
  resize: vertical;
  float: left;  
}

.BotVolta {
  background-color:mediumaquamarine;
  color:  white;
  padding: 12px 20px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  width: 30%;
  margin-top: 10px;
  float: right;
}

.InpTR {
  width: 45%;
  font-size: 22px;
  font-weight: bold; 
  padding: 3px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
  /* float: right;  */
}

.LabTR {
  width: 35%;
  font-size: 18px;
  font-weight: bold; 
 /* padding: 8px;
  //  border: 1px solid #ccc;
  // border-radius: 4px; */
  text-align: right;
  resize: vertical;
  float: left;  
}

/* The container  #################################################################################################
*/
.divFech {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: 22px;
  margin-left: 10px;  
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.divFech input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.divFech:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.divFech input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.divFech input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.divFech .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}

/* The container #####################################################################################################
*/
.contCheck {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.contCheck input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkcont {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.contCheck:hover input ~ .checkcont {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.contCheck input:checked ~ .checkcont {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkcont:after {
  content: "";
  position: absolute;
  border: #D0D620;
  display: none;
}

/* Show the checkmark when checked */
.contCheck input:checked ~ .checkcont:after {
  display: block;
}

/* Style the checkmark/indicator */
.contCheck .checkcont:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.Fonte18
{
  font-size: 20px;
  font-weight: bold;  
}


.FontePesquisar
{
  font-size: 26px;
  font-weight: normal;  
  width: 120px;
  float: left;
  /*margin: 0 auto; */
}

.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0; 
  font-family: Arial, Helvetica, sans-serif;
  background: rgba(0,0,0,0.5); 
  z-index: 99999;
  opacity:0;
  -webkit-transition: opacity 400ms ease-in;
  -moz-transition: opacity 400ms ease-in;
  transition: opacity 400ms ease-in;
  pointer-events: none;
}

.modal:target {
  opacity: 1;
  pointer-events: auto;
}

.modal > div {
  width: 800px; 
  height: 400px;
  position: relative; 
  margin: 10% auto;
  padding: 15px 20px; 
  background: #fff;
  overflow:auto;  
 /* overflow-y: scroll;*/
}

.fechar {
  position: absolute;
  width: 60px;
  right: 25px;
  top: 25px;
  text-align: center;
  line-height: 60px;
  margin-top: 5px;
  background: #ff4545;
  border-radius: 50%;
  font-size: 28px;
  font-weight: bold;  
  color: #8d0000;
}

.tab_dados {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
}
.tab_dados a {
  color: #484848;
  text-decoration: none;
}
.tab_dados th {
  background: #0091FF;
  color: #FFFFFF;
  font-style: italic;
}
.tab_dados tr {
  height: 50px;
  border-bottom: 1px solid #D5D5D5;
}
.tab_dados tr:nth-child(odd) {
  background: #F7F7F7;
}
.tab_dados tr:nth-child(even) {
  background: #FFFFFF;
}
.tab_dados tr:hover {
  background: #F1F1F1;
}
tfoot tr td {
  border: 0;
  height: 40px;
}
.tfoot {
  width: 100%;
}
.observacao {
  font-size: 14px;
  color: #354880;
}
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.DivSair {
  overflow: hidden;
/*  background-color: gold;
  content: "";
  display: table;
  clear: both; */
}


a.linktres:link {
  font-size: 32px;
  font-weight: bold;  
  width: 30%;
  float: left;
  margin-left: 15%;
  text-align: center;
  color:#F3F3F3;
  background-color:#000000;
  text-decoration:none;
  }
a.linktres:visited {
  color: #000000;
  text-decoration:line-through;
}
a.linktres:hover {
  background-color:#ff0000;
  text-decoration:none;
}
a.linktres:active {
  background-color:#000000;
  text-decoration:none;
}


/* ************************ */
a.linkfunction:link {
  font-size: 32px;
  font-weight: bold;  
  width: 30%;
  float: left;
  margin-left: 15%;
  text-align: center;
  color:#F1F1F1;
  background-color:#000000;
  text-decoration:none;
  }
a.linkfunction:visited {
  font-size: 32px;
  font-weight: bold;  
  width: 30%;
  float: left;
  margin-left: 15%;
  text-align: center;
  color:#000000;
  text-decoration:line-through;
}
a.linkfunction:hover {
  font-size: 32px;
  font-weight: bold;  
  width: 30%;
  float: left;
  margin-left: 15%;
  text-align: center;
  color:#000000;
  background-color: #4C50FF;
  text-decoration:none;
}
a.linkfunction:active {
  font-size: 32px;
  font-weight: bold;  
  width: 30%;
  float: left;
  margin-left: 15%;
  text-align: center;
  color:#ffff00;
  text-decoration:none;
  background-color:#000000;
}

#loading {
  border: 7px solid #e5e5e5;
  height: 30px;
  width: 30px;
  float: left;
  border-top-color: #4C50FF;
  border-radius: 100%;
  animation: girando 1s linear infinite;
  background: #000000;
}

@keyframes girando {
  100% {
    transform: rotate(360deg);
  }
}        

.couponcode:hover .coupontooltip {
    display: block;
}


.coupontooltip {
    display: none;
    background: #C8C8C8;
    margin-left: 28px;
    padding: 2px;
    position: absolute;
    z-index: 1000;
    font-size: 20px;
}

.couponcode {
    margin: auto;
    font-size: 20px;
}
.icoempresa {
    background:url(img/empre.png) no-repeat right;  
    position: absolute;
/*    top: 9.5%;
    left: 35%; */
    width: 58px;
    height: 51px;
    margin: auto;
    box-shadow: 0px 0px 2px black;
    padding: 2px;
    box-sizing: border-box;
}

a.linkmp:link {
  font-size: 16px;
  font-weight: bold;  
 /* width: 30%; */
  float: left;
  margin-left: 3px;
  margin-top: 3px;
  text-align: center;
  color:#F3F3F3;
  background-color:#000000;
  text-decoration:none;
  }
  
a.linkmp:visited {
  color:#000000;
  text-decoration:line-through;
}
a.linkmp:hover {
  background-color:#4C50FF;
  text-decoration:none;
}
a.linkmp:active {
  background-color: #000000;
  text-decoration:none;
}

#cfatura {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#cfatura td, #cfatura th {
  border: 1px solid #ddd;
  padding: 2px;
  font-size: 20px;  
}

#cfatura tr:nth-child(even){background-color:yellow; }/* #f2f2f2;} */

#cfatura tr:hover {background-color: #ddd;} 

#cfatura th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #3333FF; 
  color: white;
}

.pagoOK {
    background:url(img/pgOK.png) no-repeat right;  
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 83px;
    height: 23px;
    margin: auto;
    padding: 0px;

}
.pagoNO {
    background:url(img/pgNO.png) no-repeat right;  
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 83px;
    height: 23px;
    margin: auto;
    padding: 0px;

}
.pagoNOLR {
    background:url(img/pgNOED.png) no-repeat right;  
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 83px;
    height: 23px;
    margin: auto;
    padding: 0px;

}
.pagoNOAM {
    background:url(img/pgNOAM.png) no-repeat right;  
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 83px;
    height: 23px;
    margin: auto;
    padding: 0px;

}
.pgFLR {
    background:url(img/pgFLR.png) no-repeat right;  
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 83px;
    height: 23px;
    margin: auto;
    padding: 0px;

}
.pagoFP {
    background:url(img/pgFP.png) no-repeat right;  
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 83px;
    height: 23px;
    margin: auto;
    padding: 0px;

}

.blink {
  animation: blink 1s infinite;
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}