
/* Estilo específico para o mapa */
/* css do mapa */
.mapa--cartograma div.map {
    width: 800px;
    height: 500px;
}
@media (max-width: 768px) {
    .mapa--cartograma div.map {
        width: inherit;
        height: inherit;
    }
}   
.mapa--cartograma div.map g {
    stroke:white;
    stroke-width:5em;
}
.mapa--cartograma path.filtro_null {
    fill: #eee;
}
.mapa--cartograma path.filtro_0 {
    fill: #EB5D4B;
}
.mapa--cartograma path.filtro_1 {
    fill: #0063AE;
}
.mapa--cartograma path.filtro_2 {
    fill: #FFCF00;
}
.mapa--cartograma path.filtro_3 {
    fill: #009640;
}
.mapa--cartograma path.filtro_4 {
    fill: #E6007E;
}
.mapa--cartograma path.filtro_5 {
    fill: #00A1E4;
}
.mapa--cartograma path.filtro_6 {
    fill: #F28C00;
}
.mapa--cartograma path.filtro_7 {
    fill: #C1D100;
}
.mapa--cartograma path.filtro_8 {
    fill: #A62052;
}
.mapa--cartograma path.filtro_9 {
    fill: #FF99B6;
}
.mapa--cartograma path.filtro_10 {
    fill: #42FFA9;
}
.mapa--cartograma path.filtro_11 {
    fill: #F9EE7F;
}
.mapa--cartograma path.filtro_12 {
    fill: #999;
}
.mapa--produto .mapa--cartograma path.filtro_null {
    fill: #eee;
}
.mapa--produto .mapa--cartograma path.filtro_4 {
    fill: #162F4E;
}
.mapa--produto .mapa--cartograma path.filtro_3 {
    fill: #026291;
}
.mapa--produto .mapa--cartograma path.filtro_2 {
    fill: #188BB8;
}
.mapa--produto .mapa--cartograma path.filtro_1 {
    fill: #80B6DA;
}
.mapa--produto .mapa--cartograma path.filtro_0 {
    fill: #C5DAED;
}
/* legenda */
div#cinquentapes {
    clear: both;
    font-size:12px;
}
div#mapa_coropletico_legenda div.legend ul {
    list-style-type: none;
}
div#mapa_coropletico_legenda div.legend ul li {
    margin: 0;
    padding: 0.35em;
    list-style-type: none;
    display: inline-block;
    margin-right:10px;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_null:before {
    content: "██ ";
    color: #eee;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_0:before {
    content: "██ ";
    color: #EB5D4B;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_1:before {
    content: "██ ";
    color: #0063AE;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_2:before {
    content: "██ ";
    color: #FFCF00;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_3:before {
    content: "██ ";
    color: #009640;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_4:before {
    content: "██ ";
    color: #E6007E;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_5:before {
    content: "██ ";
    color: #00A1E4;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_6:before {
    content: "██ ";
    color: #F28C00;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_7:before {
    content: "██ ";
    color: #C1D100;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_8:before {
    content: "██ ";
    color: #A62052;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_9:before {
    content: "██ ";
    color: #FF99B6;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_10:before {
    content: "██ ";
    color: #42FFA9;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_11:before {
    content: "██ ";
    color: #F9EE7F;
}
div#mapa_coropletico_legenda div.legend ul li.filtro_12:before {
    content: "██ ";
    color: #999;
}
.mapa--produto div#mapa_coropletico_legenda div.legend ul li.filtro_4:before {
    color: #162F4E;
}
.mapa--produto div#mapa_coropletico_legenda div.legend ul li.filtro_3:before {
    color: #026291;
}
.mapa--produto div#mapa_coropletico_legenda div.legend ul li.filtro_2:before {
    color: #188BB8;
}
.mapa--produto div#mapa_coropletico_legenda div.legend ul li.filtro_1:before {
    color: #80B6DA;
}
.mapa--produto div#mapa_coropletico_legenda div.legend ul li.filtro_0:before {
    color: #C5DAED;
}
/* CSS da ranking */
.ranking-grafico {
    width: 95%;
    margin-top:15px;
}
.ranking-grafico .name {
    font-weight: normal;
}
.ranking-grafico table.ranking tbody tr th {
    width: 30%;
    padding-right:10px;
    text-align: left;
}
.ranking-grafico table.ranking tbody tr th span.order:after {
    content: ". ";
}
.ranking-grafico table.ranking tbody tr td.bar {
    width: 70%;
    height: 25px;
    background-color: #ccc;
    border-bottom:10px solid white;
    border-top:10px solid white;
}
.ranking-grafico table.ranking tbody tr td.bar div {
    background-color: #EB5D4B;
}
.ranking-grafico table.ranking tbody tr td.value {
    text-align: left;
    padding-left: 10px;
    font-style: italic;
    color: #999;
}

/* ranking de colunas */
.ranking-columns {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
}
.ranking-columns__item {
    height: 100%;
    box-sizing: border-box;
    width: 100%;
    margin: 0 10px;
}
.ranking-columns__item__column {
    min-height: 480px;
    text-align: center;
}
.ranking-columns__item__icon {
    text-align: center;
}
.ranking-columns__item__icon__img {
    margin: 10px auto;
    width: 80px;
    height: 80px;
    min-height: 50px;
    background-image: url('../img/icones/agricultura.png');
    background-size: 1000% 1100%;
}
.ranking-grafico.pecuaria .ranking-columns__item__icon__img {
    background-image: url('../img/icones/pecuaria.png');
    background-size: 1000% 200%;
}
.ranking-columns__item__value__text {
    font-size: 0.85em;
    text-align: center;
    margin-bottom: 5px;
}
.ranking-columns__item__name__text {
    font-size: 0.8em;
    line-height: 1.2em;
    text-align: center;
    font-weight: bold;
}

.piramide-etaria {
    width: 100%;
    margin-top: 30px;
}
.piramide-etaria thead tr td, .piramide-etaria thead tr th,
.piramide-etaria tbody tr td, .piramide-etaria tbody tr th,
.piramide-etaria tfoot tr td, .piramide-etaria tfoot tr th {
    vertical-align: middle;
}
.piramide-etaria__corpo__linha {
    border-top: 3px solid #fff;
    border-bottom: 3px solid #fff;
    height: 40px;
}
.piramide-etaria__corpo__linha__label {
    width: 100px;
    text-align: left;
    font-size: 12px;
}
.piramide-etaria__corpo__linha__valor {
    width: 50px;
    padding: 5px;
    text-align: right;
    font-size: 12px;
}
.piramide-etaria__corpo__linha__valor--esquerda {
    text-align: right;
}
.piramide-etaria__corpo__linha__valor--direita, .piramide-etaria__corpo__linha__valor--centro {
    text-align: left;
}
.piramide-etaria__corpo__linha__barra--centro {
    background-color: rgb(206, 109, 83);
}
.piramide-etaria__corpo__linha__barra--esquerda {
    background-color: rgb(206, 109, 83);
}
.piramide-etaria__corpo__linha__barra--direita {
    background-color: #026291;
}
.piramide-etaria__rodape__linha__texto {
    font-size: 12px;
}