@font-face {
   font-family: Awesome;
   font-style: normal;
   font-weight: 900;
   src: url('/map/fa-solid-900.woff2') format('woff2');
}

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden;
}

.screenshot .leaflet-control-zoom, .screenshot #canto-SO, .screenshot #localidades {
    visibility: hidden;
}

.play-voice {
    display: none;
    width: 1em;
    height: 1em;
    background: #EEE url(/map/volume-down-solid.svg) 50% 50% no-repeat;
    background-size: 12px;
    border: 2px solid #EEE;
    border-radius: 3px;
    margin-bottom: -4px;
    padding: 1px 3px;
    cursor: pointer;
}
.mostrar-audios .play-voice {
    display: inline-block;
}
.play-voice:hover {
    background-color: #EC0;
    border: 2px solid #FE0;
}

#map {
    height: 100%;
    background: #ACD;
    z-index: 1;
}

text {
    font-family: "Liberation Sans", Arial, sans-serif;
    font-size: 14px;
}

.leaflet-marker-icon text {
    font-size: 12px;
}

body > svg {
    position: absolute;
    z-index: 2;
}

#localidades {
    top: 15px;
    right: 15px;
}
#indice-localidades text {
    font-size: 10px;
}
#indice-localidades text .cidade-id {
    font-weight: bold;
}

#legenda {
    bottom: 15px;
    right: 15px;
}
.legenda-titulo {
    font-family: "Liberation Sans Narrow", "Arial Narrow", sans-serif;
    font-weight: bold;
    letter-spacing: -1px;
}
#legenda .ico {
  font-family: Awesome;
  fill: #888;
}

#canto-SO {
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: 2;
}

#perguntas .code {
    font-family: monospace;
    font-size: 12px;
}

#globo {
    margin-top: 10px;
    border: none;
    display: block;
}

#rodape {
    position: absolute;
    height: 0;
    bottom: 94px;
    left: 0;
    right: 0;
    text-align: right;
    z-index: 2;
}
#rodape text {
  font-size: 8px;
  fill: #000;
  text-align: center;
  text-anchor: middle;
  white-space: nowrap;
}
#rodape #scale text { font-size: 7px; }

.territory-label {
    display: none;
}
.show-region-name .territory-label {
    display: block
}
.territory-label > * {
    position: absolute;
    color: #000;
    opacity: .3;
    text-align: center;
    font-size: 12px;
    line-height: 10px;
    font-weight: bold;
}
#map.zoomGT50 .territory-label > * {
    font-size: 15px;
    line-height: 13px;
    opacity: .25;
}
#map.zoomGT55 .territory-label > * {
    font-size: 18px;
    line-height: 16px;
    opacity: .20;
}
#map.zoomGT60 .territory-label > * {
    font-size: 26px;
    line-height: 22px;
    opacity: .15;
}
#map.zoomGT65 .territory-label > * {
    font-size: 40px;
    line-height: 30px;
}
#map.zoomGT40 .territory-type-country {
    letter-spacing: -1px;
}
#map.zoomLT30 .territory-type-country.territory-size-big > *,
#map.zoomLT50 .territory-type-country.territory-size-normal > *,
#map.zoomLT60 .territory-type-country.territory-size-small > *,
#map.zoomLT70 .territory-type-country.territory-size-micro > * {
    display: none;
}

#map.zoomLT30 .territory-type-BRA-UF.territory-size-big > *,
#map.zoomLT35 .territory-type-BRA-UF.territory-size-normal > *,
#map.zoomLT40 .territory-type-BRA-UF.territory-size-small > *,
#map.zoomLT50 .territory-type-BRA-UF.territory-size-micro > * {
    display: none;
}


.estado-BR {
  fill: #AC9;
  stroke: #9A8;
}

.distinguir-estados-selec .estado-BR:not(.estado-selec) {
  fill: #DD8;
  stroke: #BB7;
}

.ocean-name {
  text-transform: uppercase;
  font-style: italic;
  font-size: 18px;
  font-family: sans-serif;
  text-align: center;
  text-orientation: mixed;
  text-anchor: middle;
  white-space: nowrap;
  fill: #0066CC;
}

.corpo-dagua {
  display: none;
}
.show-rivers .corpo-dagua {
  display: block;
}
.show-rivers.zoomLT55 .corpo-dagua {
  display: none;
}
.show-rivers .corpo-dagua.Rio-Amazonas,
.show-rivers .corpo-dagua.Rio-Negro,
.show-rivers .corpo-dagua.Rio-Solimões,
.show-rivers .corpo-dagua.Rio-São-Francisco {
  display: block;
}

.pie-icon-draggable > *, .pie-icon-chart-box > svg {
  position: absolute;
}

.icon-arrow-center {
  opacity: .5;
}

.leaflet-popup-content {
  font-size: 14px;
}

.pie-marker-label {
    white-space: nowrap;
    z-index: 300;
}
.pie-marker-label div {
    position: absolute;
}
.pie-marker-label .pie-centered.label-left  { right:  30px }
.pie-marker-label .pie-centered.label-right { left:   30px }
.pie-marker-label .pie-centered.label-up    { bottom: 30px }
.pie-marker-label .pie-centered.label-down  { top:    30px }
.pie-marker-label .pie-away.label-left  { right:  10px }
.pie-marker-label .pie-away.label-right { left:   10px }
.pie-marker-label .pie-away.label-up    { bottom: 10px }
.pie-marker-label .pie-away.label-down  { top:    10px }

.pie-marker-label .label-up, .pie-marker-label .label-down {
    left: 5px;
}
.pie-marker-label .label-up span, .pie-marker-label .label-down span {
    margin-left: -50%;
}

.pie-marker-label-popup { bottom: 20px; }
.pie-marker-label-popup .leaflet-popup-tip-container { display: none }
.pie-marker-label-popup .options a {
    text-decoration: none;
    color: #777;
    font-size: 26px;
}

.leaflet-popup-content h3 {
    margin: 0;
    font-size: 18px;
    color: #999;
    border-bottom: 2px dotted #999;
}
.pie-data-info {
  max-height: calc(34px * 6 + 2px);
  overflow: auto;
}
.pie-data-info ul {
    margin: 0;
    padding: 6px 0;
    border-bottom: 2px dotted #999;
}
.pie-data-info li {
    list-style: none;
    margin: 0;
    padding: 6px 0;
    border-bottom: 1px dotted #BBB;
}
.pie-data-info li:first-child { padding-top: 0 }
.pie-data-info li:last-child { border-bottom: none; padding-bottom: 0 }
.pie-data-info li svg { vertical-align: text-bottom }
.pie-data-info li i {
    color: #888;
    font-family: Awesome;
    font-style: normal;
    padding: 0 2px;
}
.pie-data-info li i.info-seg-ico-h::before { content: "" }
.pie-data-info li i.info-seg-ico-m::before { content: "" }
.pie-data-info li i.info-seg-ico-a::before { content: "1" }
.pie-data-info li i.info-seg-ico-i::before { content: "2" }
.pie-data-info li i.info-seg-ico-f::before { content: "" }
.pie-data-info li i.info-seg-ico-s::before { content: "" }
.pie-data-info li .pie-data-info-segmentos {
    display: none; /* escondendo segmentos temporariamente */
    margin: 0;
    padding: 0;
    white-space: nowrap;
}
.pie-data-info li .pie-data-info-segmentos li {
    display: inline-block;
    margin: 0 5px 0 0;
    font-size: 12px;
}
.pie-data-info li .pie-data-info-segmentos li.first-dd { margin-left: -6px }
.pie-data-info li .pie-data-info-segmentos li code {
    background: transparent;
    color: inherit;
    padding: 0;
}

@media only print {
    .leaflet-control-zoom {
        display: none;
    }
}