html,
body {
    height: 100%;
    margin: 0;
    font-family: Arial, sans-serif;
}

/* Wrapper vertical */
.wrapper {
    display: flex;
    flex-direction: column;
    height: 100vh;
    /* altura da tela */
}
.tooltip {
    position: relative !important;
    padding: 3px;
    background: rgba(250, 249, 249, 0.5);
    color: rgb(4, 3, 59);
    opacity: 0.7 !important;
    white-space: nowrap !important;
    font: 10pt sans-serif;
    font-weight: bolder;
    /*display: none !important;*/
}

/* Header fixo */
header {
    background-color: lightsteelblue;
    height: 60px;
    padding: 10px 20px;
    box-sizing: border-box;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    font-weight: bold;
    font-size: 2rem;
    border-bottom: solid 1rem #000080;
}

/* Footer fixo */
footer {
    background-color: lightsteelblue;
    height: 50px;
    padding: 10px 20px;
    box-sizing: border-box;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

/* Main ocupa espaço entre header e footer */
main {
    flex: 1;
    display: flex !important;
    background: #f9f9f9;
    overflow: hidden;
    /* evita scroll duplo */
}

/* Sidebar vertical flex */
.sidebar {
    width: 20%;
    background: #f8f8f8;
    border-right: 1px solid #ccc;
    display: flex;
    flex-direction: column;
    height: 100%;
}

#wait{
    display:none;
    position:absolute;
    top:50%;
    left:50%;
    z-index: 100;
}

.modal-faixa{
    width: 60%;
}
.iptColor{
    padding: 0;
}

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 15px;
    border-radius: 5px;   
    background:lightsteelblue;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
  }
  
  .slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    border-radius: 50%; 
    background: #286090;
    cursor: pointer;
  }
  
  .slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #2e6da4;
    cursor: pointer;
  }

/* Cabeçalho do menu */
#premenu {
    padding: 10px;
    background-color: #ddd;
    flex-shrink: 0;
    font-weight: bold;
    user-select: none;
}

/* Conteúdo do menu com scroll vertical */
#posmenu {
    flex: 1;
    overflow-y: auto;
    padding: 10px;
    box-sizing: border-box;
}

.grpAtiv{
    display: none;
}

.myLegend{
    position:absolute; 
    padding: 10px;
    left:10px; 
    top:50px; 
    display: none;
    z-index:100; 
    width:auto; 
    height:auto; 
    background-color: rgba(230,230,230,0.3);
}

#dvmapa{
    height: auto;
    min-height: 100% !important;
}
.map {
    min-height: 100% !important;
    border: 1px solid black;
    /*margin: 5px;
    padding: 2px;
    position: relative;*/
}


#posmenu div:hover {
    background-color: #e0e0e0;
}

/* Conteúdo principal */
.content {
    flex: 1;
    padding: 20px;
    background: white;
    overflow: auto;
}

.custom-file-input {
    display: none !important;
}