@media screen and (min-width: 320px) {

  .state_z { background: #dfe0e0 !important; fill: #dfe0e0; stroke: #FFF; stroke-width: 4px; cursor: initial; paint-order: stroke !important; z-index: 1; }
  .state_z text { display: none; }
  .state text { stroke: none; }
  circle { position: relative; z-index: 10; }
  .box-mapa { display: block; }
  .mapa-marcas { background: #794684; display: block; width: 100%; padding: 0; margin: 0; overflow: hidden; position: relative;}


  /* MAPA */
  .box-mapa { position: relative; z-index: 1; overflow: hidden; height: 420px; }
  #map { transform: scale(0.7); transform-origin: left; margin: 0 0 0 5%; width: 130%; aspect-ratio: 1; }
  #map .state { cursor: pointer; stroke: #FFF; stroke-width: 4px; paint-order: stroke !important; z-index: 2; }
  #map .state .shape { cursor: pointer; -width: 0; fill: #d9b4d5 !important; }
  #map .state .label_icon_state { fill: #fff; font-family: Arial; font-size: 14px; line-height: 12px; font-weight: bold; }
  #map .state .label_state { display: none; font-family: Arial; font-size: 0; line-height: 16px; font-weight: bold; }
  #map .model-davi .state:hover .label_state { display: block; fill: #FFF !important; }
  #map .model-davi .state:hover .shape { fill: #C396BE !important; }
  #map .model-davi .state .icon_state { fill: #794684; fill: transparent; stroke: none; }
  #map .model-davi .state:hover .icon_state { fill: transparent; }
  #map .model-davi .state .icon_state + .label_icon_state { fill: #FFF; }
  #map .model-davi .state .label_icon_state { fill: #FFF; }
  #map .model-davi .state:hover .label_icon_state { fill: #FFF; }
  #map .model-davi .state .label_state { fill: #FFF; display: none; }
  #map .model-davi .state .shape { -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
  #map .model-davi .state:hover .shape { fill: #a5d200;}

  .parca { position: relative; height: initial;}
  .parca h2 { font-size: 32px; margin-bottom: 20px; color: #6D2077; line-height: 1; color: white; text-align: center; font-weight: 400;}
  .parca h2 span { }
  .parca-combo { width: 90%; height: 48px; background-color: #6d2077; margin: 20px auto; text-align: center; border-radius: 4px; overflow: hidden; position: relative;}
  .estados { padding: 0 }
  .parca .estado { padding: 0 5% 50px 5%; position: relative; display: flex; align-items: flex-start; color: white; margin-top: 30px; align-items: flex-end !important; align-content: flex-end !important; }
  .parca .estado h3 { padding: 0 0 10px 0; color: #FFF; font-size: 14px; font-weight: 400; }
  .parca .estado ul { padding-left: 0px; }
  .parca .estado ul li { line-height: 24px; }
  .parca #box_mg.estado { opacity: 0; visibility: hidden; }

  .parca .estado img { width: 80px; height: auto; margin-right: 20px; }


  /* Remove a seta padrão */
  .custom-select select { cursor: pointer; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: transparent; color: white; padding: 10px 20px; width: 100%; height: 48px; border: none; font-family: sans-serif; font-size: 16px}
  .custom-select select:focus { outline: none; border: none; box-shadow: none; background: black !important; }
  .custom-select select option { color: black;  font-family: sans-serif; }
  
  /* Ícone de seta branca */
  .custom-select::after { content: '▼'; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); color: white; pointer-events: none; }
  .state .shape.active { fill: #C396BE !important; }

  .select_mapa {

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-color: #9a63a9 !important; /* Fundo do elemento */
    color: #FFF !important; /* Cor do texto do item selecionado */
    border: none;

  }

  #seletory { background: #6d2077 !important; color: #FFF !important; /* Cor do texto do item selecionado */ }
  #seletory option { color: #FFF !important; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-color: #9a63a9 !important; border: none; }

  
}



@media screen and (min-width: 620px) {
  .mapa-marcas { display: flex; align-items: stretch; justify-content: center; }
  .box-mapa, .parca { width: 50%; height: initial; }
  #map { transform: scale(0.6); width: 170%; margin: -80px 0 0 20px; aspect-ratio: 1;}
  .parca-combo { margin: 0; }
  .parca .estado { width: 85%; margin-left: 0; }
  .parca h2 { font-size: 24px; text-align: left;}

}


@media screen and (min-width: 1000px) {
  .mapa-marcas { height: 100vh; }
  #map { transform: scale(.9); margin: 0 0 0 20px; }
  .parceiros .two .parca .estado { display: block; margin: 45px auto; float: none; position: absolute; left: 0; right: 0; min-width: 160px; max-width: 306px;}
  .box-mapa { position: relative; top: 0; left: initial; display: table; margin: 0 auto; padding: 0; overflow: hidden;}
  .parca { padding-top: 50px;}
  .parca h2 { font-size: 36px; width: 90%;}
  .estado { padding: 0 !important; width: auto; }
}



@media screen and (min-width: 1320px) {
  .mapa-marcas { height: 120vh; }
  #map { transform: scale(1.2); margin: 25% 0 0 20px; transform-origin: -35%; }
  .box-mapa { width: 60%; }  
  .parca-combo { width: fit-content;}
  .parca { width: 40%; }  
  .custom-select select { width: 320px; font-size: 20px}
  .parca h2 { line-height: .9; margin-top: 50px; width: 320px; }
  .parca .estado { width: 90%; }
}
@media screen and (min-width: 1580px) {
  .mapa-marcas { height: 90vh; }
  #map { transform: scale(1.3); margin: 30% 0 0 20px; transform-origin: -50%; }
  .parca .estado { width: 85%; }
}

@media screen and (min-width: 1880px) {
  #map { transform: scale(1.4); margin: 45% 0 0 0; transform-origin: -35%; }
  .box-mapa { width: 50%; }  
  .parca { width: 50%; padding-left: 5%; }  
  .mapa-marcas { height: 85vh; }
  .parca h2 { margin-top: 100px; }
}