.base-map-switcher {
  position: absolute;
  left: 10px;
  bottom: 10px;
  display: flex;
  align-items: flex-end;
  z-index: 1000;
}

.base-map-selector-open {
  background-color: white;
  width: 72px;
  height: 72px;
  /*padding: 2px;*/
  box-shadow: 0px 3px 5px 3px darkgrey;
  /*margin-right: 10px;*/
}

/*.base-map-selector-open:hover {*/
/*box-shadow: unset;*/
/*cursor: pointer;*/
/*}*/

.base-map-selector {
  background-color: white;
  width: 72px;
  height: 72px;
  /*padding: 2px;*/
  box-shadow: 0px 3px 5px 3px lightgrey;
  margin-right: 10px;
  display: none;
}

/*.base-map-selector:hover {*/
/*box-shadow: unset;*/
/*cursor: pointer;*/
/*width: 90px;*/
/*height: 90px;*/
/*}*/

.image-wrapper {
  width: 72px;
  height: 72px;
  position: relative;
}

.image-wrapper img {
  width: 72px;
  height: 72px;
}

.base-map-title {
  position: absolute;
  background-color: white;
  font-size: 14px;
  width: 100%;
  opacity: 0.8;
  top: 0px;
}

@media (min-width: 768px) and (max-width: 992px) {
  .base-map-switcher {
    max-width: 400px;
    overflow: auto;
    white-space: nowrap;
  }
}

@media (min-width: 768px) and (max-width: 992px) and (orientation: landscape) {
  .base-map-switcher {
    max-width: 400px;
    overflow: auto;
    white-space: nowrap;
  }
}

@media (min-width: 481px) and (max-width: 767px) {
  .base-map-switcher {
    max-width: 400px;
    overflow: auto;
    white-space: nowrap;
  }
}

@media (min-width: 320px) and (max-width: 480px) {
  .base-map-switcher {
    max-width: 400px;
    overflow: auto;
    white-space: nowrap;
  }
}