/* CSS Document */
#map { height: 100%;z-index: 1; position: relative; display: none;}

#paginaInicial{ width: 100%;margin: 0px;height: 100%;padding: 0px; }

#left {float: left; background-color: darkviolet; width: 35%;margin: 0px;height: 100%;padding: 0px;}
#left div {padding-top: 45%;}
#left img {width: 200px; height: auto;}

#right { background-color: white; width: 65%;margin: 0px;height: 100%;padding: 0px; color: darkviolet;}
#right form{ padding-top: 20%; }
#right p input{width: 250px; padding: 10px;font-size: 18px; border: 1px solid darkviolet; border-radius: 5px;}
#right p input:hover{box-shadow: rgba(0, 0, 0, 0.25) 0px 7px 7px, rgba(0, 0, 0, 0.12) 0px -12px 10px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}
#right p b:hover{ cursor: pointer; }

/*#right p button{width: 272px;padding: 14px; font-size: 16px; background-color: darkviolet; color: white;border: 1px solid darkviolet; border-radius: 5px;}
#right p button:hover{border: 2px solid #666;}*/
#right #resp5{ max-width: 270px;line-height: 30px; }
#right #resp5 span:hover{ color: red;cursor: pointer;  }

.btn {width: 272px;padding: 14px; font-size: 16px; background-color: darkviolet; color: white;border: 1px solid darkviolet; border-radius: 5px;}
.btn:hover {box-shadow: rgba(0, 0, 0, 0.25) 0px 7px 7px, rgba(0, 0, 0, 0.12) 0px -12px 10px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}


#corpo{display: none;width: 100%;margin: 0px;padding: 0px;height: 100%;position: relative;}

#logo{ position: absolute;left: 5px;top: 5px; z-index: 14;}
#logo img{ width: 75px; border-radius: 5px; height: auto; 
        box-shadow: rgba(0, 0, 0, 0.25) 0px 7px 7px, rgba(0, 0, 0, 0.12) 0px -12px 10px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}
#veiculos { display: none; position: absolute; overflow: hidden; text-transform: lowercase; z-index: 14; background-color: #ede; top: 5px; left: 5px; max-height: 97%; width: 350px;padding:0px; margin: 0px;border: 1px solid darkviolet; border-radius: 2px;
        box-shadow: rgba(0, 0, 0, 0.25) 0px 7px 7px, rgba(0, 0, 0, 0.12) 0px -12px 10px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}
#veiculos #nomeDoCliente { position: relative; margin: 2px; text-transform: uppercase; cursor: pointer; padding: 15px; font-size: 18px; background-color: darkviolet; color: #fff; }  
#veiculos #nomeDoCliente .bola_ { width: auto; height: 40px; } 
#veiculos #nomeDoCliente .bola_ td { position: relative; text-align: center; width: 50px;height: 40px; margin: 0px; padding: 0px; border: none; } 
#veiculos #nomeDoCliente .bola_ td div , .bola_ td #off, .bola_ td #on{ text-align: center; overflow: hidden; width: 40px;height: 40px;  padding: 0px; border: none; border-radius: 50% } 
#veiculos #nomeDoCliente .bola_ td #off{ background-color: red; color: white; font-weight: 500;  } 
#veiculos #nomeDoCliente .bola_ td #on{ background-color: green; color: white;; font-weight: 500; } 
#veiculos #nomeDoCliente .bola_ td div img{ width: 40px; height: 40px; position: absolute; bottom: 0px; left: 5px; border-radius: 50%; } 
#veiculos #nomeDoCliente p { margin-top: 5px; margin-left: 15px; } 
#veiculos #nomeDoCliente p img { height:16px; width: auto; margin-right: 15px; } 
#veiculos #nomeDoCliente img:hover { background-color: red; } 
#veiculos #nomeDoCliente b { position: absolute; right: 3px; top: 30px; color: #ddd; font-size: 12px; }  
#veiculos #nomeDoCliente span { font-family: var; margin: 6px;  } 
#veiculos .dadosDesteCarro { width: 100%; padding: 0px; margin: 0px;  }  
#veiculos .dadosDesteCarro:hover { background-color: #eee;  }  
#veiculos #lista {  width: 100%;padding: 0px;margin: 0px; }
#veiculos #lista #listaDeVeiculos  { width: 100%; }
#veiculos #lista table  {  width: 100%;padding: 0px;margin: 0px;position: relative;  }
#veiculos #lista table td  {  padding: 0px;margin: 0px;position: relative; }
#veiculos #lista table .t0  { width: 85px; height: 70px;}
#veiculos #lista table .t0 .ordem  { position: absolute; top: 23px; left: 4px; font-size: 18px;}
#veiculos #lista table .t0 .iconDoCarro  { position: absolute; top: 17px; padding: 6px; left: 34px; border:1px solid violet ; border-radius: 50%;}
#veiculos #lista table .t0 .iconDoCarro img  { max-width: 35px; max-height: 35px; padding: 5px; border-radius: 50%; background-color: #eee;}
#veiculos #lista table .t0 .iconDoCarro :hover  { cursor: pointer; }
#veiculos #lista table .t1  { width: 220px; }
#veiculos #lista table .t1 .marca { width: 95%; text-transform: uppercase; font-size: 10px; overflow: hidden; height: 12px; color: darkviolet; padding: 0px; padding-top: 19px; margin: 0px; }
#veiculos #lista table .t1 .marca:hover { font-weight:500; cursor: pointer; }
#veiculos #lista table .t1 .estado { color: violet; padding: 0px; margin: 0px; padding-top: 6px; }
#veiculos #lista table .t2  { width: 50px; height: 50px; }
#veiculos #lista table .t2 .relatorio_e_config  { position: absolute; top: 15px; left: 3px; }
#veiculos #lista table .t2 .relatorio_e_config img  { width: 35px; height: 35px; border-radius: 50%;}
#veiculos #lista table .t2 .relatorio_e_config img:hover  { background-color: darkviolet;}






#opcoes { position: absolute; display: none; background-color: white; text-transform: lowercase; z-index: 14; height: 97%; top: 5px; left: 370px; width: 350px;padding:0px; margin: 0px;border: 1px solid darkviolet; border-radius: 2px;
            box-shadow: rgba(0, 0, 0, 0.25) 0px 7px 7px, rgba(0, 0, 0, 0.12) 0px -12px 10px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}

#opcoes h3{ position: relative;color: red; background-color: #ede; margin: 3px; padding: 15px;padding-left: 55px; text-transform: uppercase;}
#opcoes h3 img { position: absolute; left: 5px; top: 6px; width: 35px; height: 35px;}  
#opcoes h4{ color: darkviolet; padding:15px;padding-left: 15px; position: relative; margin: 0px; }
#opcoes h4:hover { background-color: #eee;  }  
#opcoes h4 img { position: absolute; border-radius: 50%; height: 16px; width: 16px; right: 20px; background-color: #ede; }
#opcoes p{ color: #666;padding: 13px; padding-left: 30px; margin: 0px;  }
#opcoes p:hover { background-color: #eee; color: darkviolet;cursor: pointer;  }  
#opcoes div div{ border-bottom: 1px solid #ddd; display: none; }
#opcoes p input { border: 1px solid #ddd; width: 280px; }
#opcoes p select { border: 1px solid #ddd; width: 295px; }
#opcoes p button { width: 65px; text-align: center; }
#opcoes .EditarMovel .checkbox strong { border: 1px solid #ddd; padding: 5px; }
#opcoes .EditarMovel .checkbox strong input { padding:3px; width: 30px; margin: 0px; }
#opcoes .EditarMovel .checkbox strong b { padding:0px; margin: 0px; }

#controle{position: absolute; background-color: white; text-transform: lowercase; z-index: 14;display: none;
        height: auto; top: 5px; left: 5px; width: auto;padding:0px; margin: 0px;border: 1px solid darkviolet; border-radius: 2px;
        box-shadow: rgba(0, 0, 0, 0.25) 0px 7px 7px, rgba(0, 0, 0, 0.12) 0px -12px 10px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}
#controle #relOpt { margin: 0; padding: 0; height: 100%; width: 100%;}
#controle #relOpt #linhaR { padding: 0px 10px; width: 340px; text-align: center; }
#controle #relOpt #linhaR .foward_ { width: 3px; height: 3px;padding: 0;margin: 0;}
#controle #relOpt #linhaR .foward_:hover , .ffoward_ { width: 13px; height: 13px;}

#controle .BtnPlay{ text-align: center;}
#controle .BtnPlay td{ text-align: center; position: relative; }
#controle .BtnPlay .td_b1 { width: 50px; }
#controle .BtnPlay .td_b2 { color: darkviolet; width: 90px; }
#controle .BtnPlay td b{ position: absolute; top: 8px; font-size: 18px; left: 10px; }
#controle .BtnPlay img { width: 30px; height: 30px; margin: 3px;border-radius: 50%; }
#controle .BtnPlay img:hover  { box-shadow: rgba(0, 0, 0, 0.25) 0px 7px 7px, rgba(0, 0, 0, 0.12) 0px -12px 10px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;} 
#controle #relOpt #velocidadeDeRepeticao { position: absolute; width: 50px; border-radius: 5px; text-align: center; top: 3px;left: 205px ; border: 1px solid #000; }

#wsAlertas { display: none; position: absolute;z-index: 14; top: -50px; background-color:transparent;width: 100%;}
#wsAlertas  table { font-size: 20px; margin: 0; border-bottom-right-radius:20px; border-bottom-left-radius: 20px; background-color: #df4c73;color: white;}
#wsAlertas #wsAlertas_th { padding: 5px;padding-left: 20px;}
#wsAlertas #wsAlertas_p { padding: 0; margin: 0px; color: khaki; text-transform: uppercase; }
#wsAlertas #wsAlertas_p b {  color: white; }
#wsAlertas th { position: relative;}
#wsAlertas img { position: absolute;left: 15px; top: 2px; width: 28px; height: 28px;}
   

#infoDoVeiculo{position: absolute; display: none; background-color: white; text-transform: lowercase; z-index: 14; padding: 10px; line-height: 16px; color: #666;
               height: auto; bottom: 5px; right: 5px; width: auto;border: 1px solid darkviolet; border-radius: 2px;
            box-shadow: rgba(0, 0, 0, 0.25) 0px 7px 7px, rgba(0, 0, 0, 0.12) 0px -12px 10px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}

#infoDoVeiculo #infoBtnSair{ position: absolute; right: -12px; top: -28px; background-color: red; border-radius: 50%; }
#infoDoVeiculo table th { padding: 15px; padding-left: 11px; text-align: left; color: darkviolet; text-transform: uppercase; }
#infoDoVeiculo table td p{ padding: 5px; padding-left: 10px; margin: 5px;}
#infoDoVeiculo #infoBtns {padding: 10px; }
#infoDoVeiculo #infoBtns button {margin: 5px 10px;padding: 2px; border: none; border-radius: 50%; background-color: white; }
#infoDoVeiculo #infoBtns button:hover { background-color: darkviolet; cursor: pointer; }
#infoDoVeiculo #infoBtns button img {width: 30px; height: 30px; padding: 5px; }


#optt1, #optt2 { font-size: 22px; display: none;}

.iconSair { background-color: orange;border-radius: 50%;} 
.iconSair:hover { background-color: red;cursor: pointer;  } 

.alertaTraccar div { margin-left: 20px;}
.alertaTraccar div p { text-align: left; font-size: 110%;}
.alertaTraccar div p b { font-size: 90%;}

#tituloDaImpressao{ position: absolute;display: none; text-align: center; color: darkviolet; z-index: 14;top: 5px; left: 0px; width: 100%; padding:0px; margin: 0px;}
#imprimir{  display: none; width: 100%;}
#imprimir table{ width: 95%; margin: 2%;}
#imprimir table tr { border-bottom: 1px solid #666; }
#imprimir table tr td{ padding-top: 10px; padding-bottom: 5px;}
