/* PANEL DE RUTAS */
.js-Panel-base-selector
{
  background-clip: padding-box;
  background-color: #00000000;
  border: 2px solid #00000033;
  border-radius: .25rem;
  box-shadow: 0 1px 5px #00000066;
  max-width: 100%;
  z-index: 9001;
}

.js-Panel-base-selector .jsPanel-content
{
  background-color: #FFFFFFD2;
  font-size: 80%;
}

.js-Panel-base-selector .jsPanel-headerbar
{
  background-color: #A9A9A9D2;
  font-size: 50%;
}

.js-Panel-base-selector .jsPanel-hdr-toolbar
{
  background-color: #FFFFFFF2;
}
.base-map-container
{
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  margin-bottom: 2%;
  width: 100%;
}
.base-map-group-container
{
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2%;
  padding-top: 2%;
  width: 100%;
}
.base-map-button-collapsible
{
  background-color: #a2a2a2;
  border: double;
  border-color: #000;
  color: white;
  cursor: pointer;
  font-size: 15px;
  outline: none;
  padding: 18px;
  text-align: left;
  width: 100%;
}
.active-base-ma-group, .base-map-button-collapsible:hover {
  background-color: #555;
}

.base-map-button-collapsible:after {
  color: white;
  content: '\002B';
  float: right;
  font-weight: bold;
  margin-left: 5px;
}

.active-base-map-group:after {
  content: "\2212";
}

.base-map-container-column
{
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  width: 50%;
}
.base-map-div
{
  margin-left: auto;
  margin-right: auto;
}
.base-map-div-selection
{
  display: flex;
  flex-direction: column;
  height: 130px;
  margin-bottom: 1px;
  padding-left: 3px;
  padding-right: 3px;
  width: 150px;
}
.base-map-div-selected
{
  box-shadow: 0 0 2px 1px #28a745;
  color: #28a745;
}
.base-map-div-selection:hover
{
  box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
  cursor: pointer;
}
.base-layer-control-header
{
  display: flex;
  justify-content: center;
  width: 100%;
}
.base-layer-image-div
{
  display: flex;
  position: relative;
  width: 100%;
}
.base-layer-image
{
  height: 100px;
  margin: auto;
  width: 120px;
}
.base-layer-image-unavailable
{
  filter: grayscale(1);
  filter: gray;
  -webkit-filter: grayscale(1);
}
.hidden
{
  visibility: hidden;
}
.visible
{
  visibility: visible;
}
.base-map-opacity-control
{
  background-color: #bdbaba;
  border: solid;
  border-width: 2px;
  color: black;
  display: flex;
  margin: auto;
}
.base-map-opacity-control-button
{
  display: flex;
  justify-content: center;
  margin: auto;
  width: 50px;
}
.base-map-opacity-control-button:hover
{
  cursor: pointer;
  margin: auto;
}
.base-map-opacity-control-value
{
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: auto;
}
.base-map-div-opacity
{
  font-size: 90%;
  margin-top: 2px;
}
@media only screen and (max-height: 750px)
{
  .js-Panel-base-selector
  {
    max-height: 75%;
  }
}
@media only screen and (max-height: 450px)
{
  .js-Panel-base-selector
  {
    max-height: 70%;
  }
}