@import url("css/fonts/openSams.css");
body {
    margin: 0px;
    padding: 0px;
    border: 0px;
    color: #222;
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    line-height: 1.2;
}
input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="email"], input[type="file"], input[type="number"] {
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
    border: 1px solid #C5C6C7;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    padding: 2px 4px;
    border-radius: 3px;
    box-shadow: inset 1px 1px 1px rgba(0,0,0,.045);
    background-color: #FFFFFF;
    background-image: none;
    outline: none;
}
SELECT.old {
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -moz-user-select: none;
    background: transparent url('img/sortDw.png') no-repeat scroll 97% 50%;
    padding: 2px 20px 2px 4px !important;
    border-radius: 3px;
    border: 1px solid #C5C6C7;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    box-shadow: inset 1px 1px 1px rgba(0,0,0,.05);
    background-color: #FFFFFF;
    outline: none;
}
TEXTAREA {
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
    border-radius: 3px;
    border: 1px solid #C5C6C7;
    background-color: #FFFFFF;
    background-image: none;
    outline: none;
}
input[type="text"]:focus, INPUT[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="email"]:focus, input[type="file"]:focus, input[type="number"]:focus, SELECT:focus, TEXTAREA:focus {
    border-color: #1ab394 !important;
}
input[type="button"], input[type="submit"], button {
    border-radius: 4px;
    padding: 4px 12px;
    border: 1px solid #c0c0c0;
    margin: 3px;
    background: #efefef;
    background: linear-gradient(to bottom, #f3f3f3 10%, #e0e0e0 100%);
    text-shadow: 2px 2px 0 #f3f3f3;
    transition: background 0.15s ease-in-out 0s, color 0.15s ease-in-out 0s, border-color 0.15s ease-in-out 0s;
    color: #333;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-appearance: button;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline: 0px;
}
input[type="button"]:hover, input[type="submit"]:hover, button:hover {
    color: #555;
    border-color: #aaa;
    background: #efefef;
    background: linear-gradient(to bottom, #f0f0f0 10%, #d0d0d0 100%);
}
input[type="button"]:active, input[type="submit"]:active, button:active {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) inset;
}
input[type="button"]:focus, input[type="submit"]:focus, button:focus{
    border-color: #1ab394 !important;
}
input[type="button"]:disabled, input[type="submit"]:disabled, button:disabled{
    color: #AAA;
    border-color: #aaa !important;
    background: #efefef;
    box-shadow: none;
}
div#contPagesIdx img {
    vertical-align: -3px;
}
TABLE {
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
    border: 0px;
}
TR {
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
}
TD {
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
    line-height: 1.2;
}
CAPTION {
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
}
OPTION {
    PADDING-LEFT: 2px;
}
TEXTAREA {
    PADDING-LEFT: 2px;
}
A {
    color: #000099;
    text-decoration: none;
}
A:hover {
    text-decoration: underline;
}
A.tooltip:hover {
    text-decoration: none;
}
.button {
    border: solid 1px #CCF;
    border-radius: 3px;
}
.SEP {
    color: #ffffff; font-size: 8px;
}
.UPPER {
    text-transform: uppercase;
}
.StatusCx {
    font-size: 18px;
    font-family: 'Open Sans', sans-serif;
}
.tooltitle {
    font-size: 11px;
    font-family: verdana,tahoma;
    font-weight: 700;
    font-variant: small-caps;
}
#conteudo {

}
#conteudo ul {
    list-style: none;
}

/* estilos para componentes desabilitados ou readonly (ex: campo com o nome do cliente, retornado via ajax) */
.disabled {
    border: solid 1px #DDD;
    border-top: solid 1px #BBB;
    border-left: solid 1px #BBB;
    background-color: white;
    color: #888;
}
.gridEntrega {
    border: solid 1px #DDD;
    padding: 4px;
}

/* anota�oes em geral */
.boxShadow {
    box-shadow: 1px 1px 6px #AAA;
}
.notes {
    color: #999;
}
.c-red {
   color: red;
}
/* text shadow - textos sobreados */
LABEL.shadow {
    text-shadow: 1px 1px 1px #CCC;
    font-weight: bold;
    cursor: pointer;
}
LABEL.hshadowb {
    text-shadow: 2px 2px 2px #AAA;
    font-weight: bold;
    cursor: pointer;
}
.brdRad6 {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
.brdRad12 {
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}
.brdRad20 {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
}

/* cabecalhos internos em tabelas */
TR.subcab TD {
    padding-top: 10px;
    border-bottom: solid 2px #CCC;
}
TR.subcab TH {
    padding-top: 10px;
    border-bottom: solid 2px #CCC;
}
HR.sep {
  background-color: #AAA;
  height: 1px;
  border: 0;
  font-size: 12px;
  border-bottom: solid #AAA 0;
}

.f-l { float: left }
.f-r { float: right }

.c-lembrete {
    padding-bottom: 8px;
}

/* POPUPS INTERNAS
 * defina o componente utilizando a primeira classe. Ex: div class="popup" ...
 * para tornar vis�vel, utilize as duas classes. Ex: div class="popup popupShow" (para ocultar novamente utilize somente "popup") ...
 * ajuste margin-top e margin-left para posicionar a popup
 * utilize popupLink para definir o ponteiro. Ex: <img class="popupLink" onmouseover='showDiv(<%=id%>)' onmouseout='hideDiv(<%=id%>)' src="img/popup.png"></img>
 * utilize popupTable para definir o estilo de uma eventual tabela interna
 */
.popupFX {
    position: absolute;
    background-color: #F8F8E8;
    background: -moz-linear-gradient(top, #FFFFF2, #F7F7E0, #F7F7E0 70%);
    background: -webkit-linear-gradient(top, #FFFFF2, #F7F7E0, #F7F7E0 70%);
    border: solid 1px #C0C030;
    padding: 10px;
    opacity: 0;
}
.popupFXShow {
    -webkit-transition: opacity 1s linear;
    -moz-transition: opacity 1s linear;
    transition: opacity 1s linear;
    opacity: 1;
}
.popup {
    position: absolute;
    background-color: #F8F8E8;
    border: solid 1px #C0C030;
    padding: 4px;
    visibility: hidden;
    border-radius: 4px;
}
.popupShow {
    visibility: visible;
}
.popupColors {
    background-color: #F8F8E8;
    border: solid 1px #C0C030;
}
.popupTitulo {
    color: #664;
}
.popupLink {
    border: 0px;
    margin: 0px;
    cursor: pointer;
}
div.popMensagem {
    white-space: normal;
}
/** TABLE */
TABLE.popupTable {
    border: 0px;
    background-color: #F8F8E8;
}
TABLE.popupTable CAPTION {
    border-bottom: solid 1px #C0C030;
    background-color: #F8F8E8;
    font-weight: bold;
}
TABLE.popupTable TD {
    background-color: #F8F8E8;
}

/* ESTILO DO MENU DE CLIMA DETALHADO */
.divclimadetalhe {
    background: -moz-linear-gradient(top, #acd9e6 0%, #95ccdb 41%, #73bacd 100%);
    background: -webkit-linear-gradient(top, #acd9e6 0%, #95ccdb 41%, #73bacd 100%);
}
.divTextoClimaDetalhe {
    text-shadow: 1px 1px 1px #FFF;
}
.divClimaBarra {
    font-size: 14px;
    font-family: Helvetica;
    margin-top: 130px;
    margin-left: 10px;
    background: -moz-linear-gradient(top, #ddf1ff 0%, #cbebff 47%, #a1dbff 100%);
    background: -webkit-linear-gradient(top, #ddf1ff 0%, #cbebff 47%, #a1dbff 100%);
    padding-left: 50px;
    margin-left: -20px;
    padding-right: 12px;
    -moz-box-shadow: #1E5799 2px 2px 20px;
    -webkit-box-shadow: #1E5799 2px 2px 20px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
}

/* ESTILO DA QUANTIDADE DE RECADOS INTERNOS*/
.divQtdRecados {
    -webkit-border-radius: 999px;
    -moz-border-radius: 999px;
    border-radius: 999px;
    behavior: url(PIE.htc);
    padding: 2px;
    margin-top: -16px;
    margin-left: 11px;
    background: #fc8d8d;
    background: -moz-linear-gradient(top,  #fc8d8d 0%, #fc6a6a 45%, #ff1414 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fc8d8d), color-stop(45%,#fc6a6a), color-stop(100%,#ff1414));
    background: -webkit-linear-gradient(top,  #fc8d8d 0%,#fc6a6a 45%,#ff1414 100%);
    background: -o-linear-gradient(top,  #fc8d8d 0%,#fc6a6a 45%,#ff1414 100%);
    background: -ms-linear-gradient(top,  #fc8d8d 0%,#fc6a6a 45%,#ff1414 100%);
    background: linear-gradient(top,  #fc8d8d 0%,#fc6a6a 45%,#ff1414 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fc8d8d', endColorstr='#ff1414',GradientType=0 );
    border: 1px solid #D8D8D8;
    color: #666;
    text-align: center;
    font: 10px Helvetica
}

/* CORES PARA LINHAS ALTERNADAS */
TR.linA TH {
    background-color: #FFFFFF;
}
TR.linA TD {
    background-color: #FFFFFF;
}
TR.linB TH {
    background-color: #F8F8F8;
}
TR.linB TD {
    background-color: #F8F8F8;
}

/* GRADES */
.gradeTop {
    border-bottom: solid 1px silver;
}
.grade {
    border-bottom: solid 1px silver;
    border-right: solid 1px silver;
}

/* TABLE - lista de consultas */
TABLE.lista CAPTION {
    background-color: #DDDDDD;
}
TABLE.lista THEAD TR {
    background-color: #DDDDDD;
}
TABLE.lista THEAD TR.clean {
    background-color: #FFFFFF;
}
TABLE.lista TBODY TR {
    background-color: #EFEFEF;
}
TABLE.lista TBODY TR.clean {
    background-color: #FFFFFF;
}
TABLE.lista TFOOT TR {
    background-color: #DDDDDD;
}
TABLE.lista TFOOT TR.clean {
    background-color: #FFFFFF;
}
TABLE.lista TFOOT TD.div {
    border-top: solid 1px black;
    margin-top: 10px;
}

/* TABLE - dados edi��o mestre-detalhe*/
TABLE.dados CAPTION {
    margin-bottom: 20px;
}
TABLE.dados THEAD TR {

}
TABLE.dados TBODY TR {

}
TABLE.dados TBODY TR.bold {
    background-color: #DDDDDD;
}
TABLE.dados TFOOT TR {

}
TABLE.dados TFOOT TD.div {
    border-top: solid 1px black;
}

/* DECORA��O - P�GINA */
.pagina {
    margin: 0px;
    border: 0px;
    border-right: solid 1px #AAA;
    border-bottom: solid 1px #AAA;
    background-image: url(img/pagina01.png);
    padding: 10px;
    padding-left: 30px;
}
div.titulo {
    font-size: 22px;
    font-weight: 300;
    border-bottom: solid #AAA 1px;
    margin-top: 12px;
    margin-bottom: 6px;
    padding-bottom: 12px;
    line-height: 1.2;
}
h1.titulo, div.titulo h1 {
  font-size: 24px;
  font-weight: 300;
  text-align: left;
  margin-bottom: 3px;
}
div.sub-titulo {
    font-size: 18px;
    font-weight: 300;
    border-bottom: solid #AAA 1px;
    margin-top: 4px;
    margin-bottom: 6px;
    padding-bottom: 12px;
    line-height: 1.2;
}
.titulo small {
    font-size: 11px;
    color: #888;
    font-weight: 400;
}
div.titulo.sb {
    border: 0;
}
/* DECORA��O - PER�ODO */
OPTION.periodo1 { background-color: #EEE; }
OPTION.periodo2 { background-color: #FFF; }
OPTION.periodo3 { background-color: #EEE; }
OPTION.periodo4 { background-color: #FFF; }
OPTION.periodo5 { background-color: #EEE; }
OPTION.periodo9 { background-color: #FFF; }

/* VISIBILIDADE IMPRESS�O/TELA */
.onlyScreen {

}
.onlyPrint {
    display: none;
}

/* Separador de menus no menu left */
.separador {
    background: url('img/separador/separadorCenter.gif');
    width: 100%;
}

/* SISTEMA DE RECADOS */
.gradienteCabec {
    background: #d4e4ef;
    background: -moz-linear-gradient(top,  #d4e4ef 0%, #bad5dd 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d4e4ef), color-stop(100%,#bad5dd));
    background: -webkit-linear-gradient(top,  #d4e4ef 0%,#bad5dd 100%);
    background: -o-linear-gradient(top,  #d4e4ef 0%,#bad5dd 100%);
    background: -ms-linear-gradient(top,  #d4e4ef 0%,#bad5dd 100%);
    background: linear-gradient(top,  #d4e4ef 0%,#bad5dd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4e4ef', endColorstr='#bad5dd',GradientType=0 );
}

.gradienteRecadoProprio {
    background: #cdeb8e;
    background: -moz-linear-gradient(top,  #cdeb8e 0%, #a5c956 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cdeb8e), color-stop(100%,#a5c956));
    background: -webkit-linear-gradient(top,  #cdeb8e 0%,#a5c956 100%);
    background: -o-linear-gradient(top,  #cdeb8e 0%,#a5c956 100%);
    background: -ms-linear-gradient(top,  #cdeb8e 0%,#a5c956 100%);
    background: linear-gradient(top,  #cdeb8e 0%,#a5c956 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cdeb8e', endColorstr='#a5c956',GradientType=0 );
}
.sombraRecado {
    border: 1px solid #cccccc;
    box-shadow: 1px 1px 1px 0px #d9d9d9;
    -moz-box-shadow: 1px 1px 1px 0px #d9d9d9;
    -webkit-box-shadow: 1px 1px 1px 0px #d9d9d9;
}
.sombraRecadoInvertida {
    border: 1px solid #cccccc;
    box-shadow: inset 1px 1px 3px 0px #d9d9d9;
    -moz-box-shadow: inset 1px 1px 3px 0px #d9d9d9;
    -webkit-box-shadow: inset 1px 1px 5px 0px #d9d9d9;
}
.gradienteRecadoLido {
    background: #fefcea;
    background: -moz-linear-gradient(top,  #fefcea 0%, #efe6ac 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefcea), color-stop(100%,#efe6ac));
    background: -webkit-linear-gradient(top,  #fefcea 0%,#efe6ac 100%);
    background: -o-linear-gradient(top,  #fefcea 0%,#efe6ac 100%);
    background: -ms-linear-gradient(top,  #fefcea 0%,#efe6ac 100%);
    background: linear-gradient(top,  #fefcea 0%,#efe6ac 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#efe6ac',GradientType=0 );
}

/* C�rculo para fechar janelas e popups */
.circuloFechar {
    background-color: #FFFFFF;
    height: 14px;
    width: 14px;
    display:block;
    border-color: #000000;
    border-width: 1px;
    border-style: solid;
    -moz-border-radius:75px;
    -webkit-border-radius: 75px;
    -border-radius: 75px;
}

/* GRID CSS */
.gridboxShadow {
    box-shadow:#CCC 1px 1px 3px;
}
.gridHeader {
    background-color: #FFF;
    background: -moz-linear-gradient(bottom, #B9D5E1 1%, #D0E0F9 25%, #E9F0FF);
    background: -webkit-linear-gradient(bottom, #B9D5E1 1%, #D0E0F9 25%, #E9F0FF);
    text-shadow: 1px 1px 1px #DDF;
    font-weight: bold;
    cursor: pointer;
}
.gridRowP {
    background-color: #DFECFF;
    transition: background-color 0.25s ease-in-out;
}
.gridRowP:hover {
    background-color: #CFDCEF;
}
.gridRowI {
    background-color: #F4F7FF;
    transition: background-color 0.25s ease-in-out;
}
.gridRowI:hover {
    background-color: #D3DEEF;
}
.gridRowI TD, .gridRowP TD {
    padding: 2px;
}
.gridSep {
    border: 0px;
    width: 96%;
    height: 1px;
    color: #AAC;
    background-color: #AAC;
}
.gridCaption {
    text-shadow: 1px 1px 1px #DDD;
    font-weight: bold;
    font-size: 14px;
}
#tdContentArea {
    width: 99%;
}
div#dataGrid.light div#tblcont {
    border-radius: 4px;
    border: 1px solid #2A6DEF;
    box-shadow: 2px 2px 3px #EEE;
}
div#dataGrid.light tr.gridHeader {
    background: none;
    background-color: #3A7DEF;
    color: white;
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.2);
}
div#dataGrid.light td {
    padding: 4px;
}
div#dataGrid.light tr.gridHeader td {
    font-size: 14px;
    padding: 2px;
}
div#dataGrid.light tr.gridHeader td a {
  color: #FFF;
}
div#dataGrid.light tr.gridRowP {
    background-color: white;
}
div#dataGrid.light tr.gridRowP:hover {
    background-color: #D9E0FF;
}
div#dataGrid.light hr.gridSep {
    color: #3275E4;
    background-color: #3275E4;
}
div.card {
    color: #444;
    width: 640px;
    border-radius: 3px;
    padding: 12px;
    border: 1px solid;
    border-color: #e5e6e9 #dfe0e4 #d0d1d5;
    border-radius: 4px;
    margin-bottom: 16px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}
div#vnd-menu, div#fin-menu {
    display: none;
    position: absolute;
    background-color: white;
    border: 1px solid #CCC;
    padding: 8px;
    border-radius: 5px;
    box-shadow: 1px 1px 1px #DDD;
    z-index: 100;
    opacity: 0.0;
    text-align: left;
    font-size: 14px;
    transition: opacity 0.3s ease;
}
div#vnd-menu.active, div#fin-menu.active {
    opacity: 1.0;
    transition: opacity 0.3s ease;
}
div.vnd-menu-item, div#fin-menu-item {
    padding: 4px;
}
div.vnd-menu-item:hover, div#fin-menu-item:hover {
    background-color: #EEE;
    transition: background-color 0.3s ease;
    border-radius: 3px;
}
.dropSMS {
    position: relative;
    display: inline-block;
}

.dropsms-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 120px;
    max-height: 100px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 8px 8px;
    z-index: 1;
    text-align: left;
}

.dropSMS:hover .dropsms-content {
    display: block;
}

#lembrete a {
    line-height: 1.2em;
}
.divCardRede {
    user-select: none;
    width: 640px;
    margin-top: 18px;
    padding: 12px;
    color: #444;
    border-radius: 4px;
    border-width: 1px;
    border-style: solid;
    border-color: #E5E6E9 #DFE0E4 #D0D1D5;
}
div#divCardRedeImg {
    float:left;
    height: 80px;
    width: 120px;
}

.msgDireitaTopo {
    border-radius: 6px;
    width: 280px;
    height: 70px;
    right: 0px;
    margin-top: 26px;
    margin-right: 6px;
    background: rgba(134, 189, 235, 0.7);
    z-index: 1000;
    position: absolute;
    display: none;
    border: 1px solid rgba(134, 189, 235, 0.8);
    box-sizing: border-box;
    box-shadow: 1px 1px 2px #CCC;
    text-shadow: 0 -1px 0 rgba(0,0,0, .2);
    color: white;
}

.msgDireitaTopoRow {
    width: 90%;
    margin-left: 5%;
    text-align: center;
    margin-top: 8px;
}
input:-moz-read-only { /* tem que repetir o css abaixo por o lixo do Firefox é muito chato */
    background-color: #E5E6E7;
    -webkit-user-select: none; /* Safari 3.1+ */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */
}
input:read-only {
    background-color: #E5E6E7;
    -webkit-user-select: none; /* Safari 3.1+ */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */
}
.boxInfo {
  width: 100%;
  /*margin-left: 5%;*/
  height: auto;
  padding: 8px 8px 8px 8px;
  float: left;
  box-sizing: border-box;
  box-shadow: 1px 1px 1px #DDD;
  border-radius: 3px;
  border: 1px solid;
  border-color: #eee #eee #ddd;
  font-size: 12px;
  margin-top: 10px;
}

.boxConsumidorDoc {
    position: absolute;
    display: flex;
    align-items: stretch;
    margin-top: 10px;
    top: 100px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.boxConsumidorDocToolbar {
    padding: 8px 8px 8px 8px;
    box-sizing: border-box;
    box-shadow: 1px 1px 1px #DDD;
    border-radius: 3px;
    border: 1px solid;
    border-color: #eee #eee #ddd;
    float: left;
    height: 100%;
    flex-grow: 0;
    flex-shrink: 0;
}

.boxConsumidorDocInfo {
    padding: 4px 4px 12px 10px;
    box-sizing: border-box;
    box-shadow: 1px 1px 1px #DDD;
    border-radius: 3px;
    border: 1px solid;
    border-color: #eee #eee #ddd;
    min-width: 0;
    flex-grow: 1;
    flex-shrink: 1;
    margin-left: 10px;
    float: left;
    min-height: 100%;
    overflow-y: auto;
}

.boxConsumidorTextInfo {
    display: inline-block;
    font-weight: 300;
    font-size: 14px;
    width: 100%;
    margin-top: 8px;
}

.boxConsumidorTextInfo .elipse {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.boxConsumidorTextInfoSelect {
    padding: 4px 4px 4px 10px;
    display: inline-block;
    font-weight: 300;
    font-size: 14px;
    box-sizing: border-box;
    box-shadow: 1px 1px 1px #DDD;
    border-radius: 3px;
    border: 1px solid;
    border-color: #eee #eee #ddd;
    margin-top: 12px;
    width: 100%;
    cursor: pointer;
}

.boxFonePrincipal {
    padding: 4px 4px 4px 10px;
    /*display: inline-block;*/
    display: none;
    font-weight: 300;
    font-size: 14px;
    box-sizing: border-box;
    margin-top: 12px;
    cursor: pointer;
    margin-right: 10px;
    line-height: 20px;
    vertical-align: center;
    width: 5%;
    float: right;
}

.boxFonePrincipalSelecionado {
    color: #ff9b0e;
    opacity: 0.75;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #ff7f0d;
}

.boxFonePrincipalNaoSelecionado {
    color: #f0ffd6;
    opacity: 0.55;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #ffa000;
}

.boxConsumidorTitulo {
    display: inline-block;
    font-weight: 500;
    font-size: 18px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
    margin-top: 18px;
}

.calendario {
    color: #0f7eff;
    opacity: 0.45;
    cursor: pointer;
}

.calendario:hover {
    opacity: 0.90;
}
#spinner {
  border: 5px solid #f3f3f3; /* borda do spinner */
  border-top: 5px solid #3498db; /* cor da borda superior */
  border-radius: 50%; /* arredondamento das bordas */
  width: 15px; /* largura do spinner */
  height: 15px; /* altura do spinner */
  animation: spin 1s linear infinite; /* animação de rodar */
  float: left;
}

#mensagemAguarde {
  float: left;
  margin: 4px;
}

#spinnerMensagem {
  display: none;
}

@keyframes spin {
  0% {
    transform: rotate(0deg); /* início da animação */
  }
  100% {
    transform: rotate(360deg); /* fim da animação */
  }
}
.load-tela {
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.1);
}
.load-tela .load-tela-center {
  position: absolute;
  top: 10%;
  left: 0;
  right: 0;
  text-align: center;
}
.load-tela .fechar {
  position: relative;
  left: 50%;
  cursor: pointer;
}
.box-load img {
  margin-top: -10px;
  margin-bottom: 30px;
}
.load-tela .box-load {
  width: 750px;
  display: inline-block;
  background: #fafafa;
  color: #fff;
  border-radius: 8px;
  box-shadow: 1px 1px 8px #888
}
.load-tela .box-load span {
  font-size: 40px;
  padding-left: 30px;
  color: #0009;
}
.btnCancelarTransacaoTEF {
  float: right;
  margin-right: 15px;
  margin-bottom: 20px;
  margin-top: 15px;
}
.load-tela-block {
  position: fixed;
  display: block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.1);
  z-index: 999;
}
.load-tela-block .load-tela-center-block {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  text-align: center;
}
.load-tela-block .fechar-block {
  position: relative;
  left: 50%;
  cursor: pointer;
}
.box-load-block img {
  margin-top: -10px;
  margin-bottom: 30px;
}
.load-tela-block .box-load-block {
  width: 65%;
  display: inline-block;
  border-radius: 8px;
}
.load-tela-block .box-load-block span {
  font-size: 30px;
  color: #0009;
}
.box-load-block #spinner {
  position: absolute;
  margin: 6px 0px 0 10px;
}
.is-open-block {
  display: block;
}