.design-img {
  width: 200px;
  height: auto;
}
svg {
  width: 100%;
}
.width-svg-arrow {
  width: 22px;
}

.fullscreen-icon {
  background-image: url("/static/img/icon-fullscreen.svg");
  background-size: 26px 52px;
}
.fullscreen-icon.leaflet-fullscreen-on {
  background-position: 0 -26px;
}
.leaflet-touch .fullscreen-icon {
  background-position: 2px 2px;
}
.leaflet-touch .fullscreen-icon.leaflet-fullscreen-on {
  background-position: 2px -24px;
}
/* one selector per rule as explained here : http://www.sitepoint.com/html5-full-screen-api/ */
.leaflet-container:-webkit-full-screen {
  width: 100% !important;
  height: 100% !important;
  z-index: 99999;
}
.leaflet-container:-ms-fullscreen {
  width: 100% !important;
  height: 100% !important;
  z-index: 99999;
}
.leaflet-container:full-screen {
  width: 100% !important;
  height: 100% !important;
  z-index: 99999;
}
.leaflet-container:fullscreen {
  width: 100% !important;
  height: 100% !important;
  z-index: 99999;
}
.leaflet-pseudo-fullscreen {
  position: fixed !important;
  width: 100% !important;
  height: 100% !important;
  top: 0px !important;
  left: 0px !important;
  z-index: 99999;
}

/* .progress-container1 {
    width: 100%;
    margin-bottom: 20px;
    }

    .progress-bar1 {
    height: 20px;
    background-color: #f0f0f0;
    border-radius: 10px;
    position: relative;
    }

    .progress1 {
    height: 100%;
    background-color: #4CAF50;
    border-radius: 10px;
    transition: width 0.3s ease;
    } */

.steps-container {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
}

.step {
  flex: 1;
  text-align: center;
  color: #999;
}

.step.active {
  color: #333;
  font-weight: bold;
}

#map {
  height: 600px;
}

.tooltip1 {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.tooltip1 .tooltiptext1 {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  bottom: 100%;
  left: 50%;
  margin-left: -60px;
}

.tooltip1:hover .tooltiptext1 {
  visibility: visible;
}