#client-map-container .maps-section {
  margin-bottom: 50px;
}

#client-map-container .header {
  font: 33px/39px MillerDisplay;
  color: #222222;
  border-top: 15px solid #ccc;
  padding: 20px 0 36px;
}

#client-map-container .nav {
  display: flex;
  margin-bottom: 8px;
}

#client-map-container .nav .floor-button {
  border-top: 3px solid #000;
  margin-right: 15px;
  display: flex;
  padding: 12px 0 30px;
  flex-grow: 1;
  flex-basis: 20%;
  cursor: pointer;
  position: relative;
  max-width: 250px;
}

#client-map-container .nav .floor-button .floor-number {
  font: 24px/29px Univers Com, Arial, Helvetica, sans-serif;
  font-weight: bold;
  padding: 0 10px 0 0;
}

#client-map-container .nav .floor-button .departments-list {
  font: 14px/21px Univers Com, Arial, Helvetica, sans-serif;
  margin-left: 10px;
}

#client-map-container .nav .floor-button .departments-list li {
  list-style: '- ';
  list-style-position: outside;
}

#client-map-container .nav .floor-button.active {
  border-color: #36cc60;
  color: #36cc60;
  cursor: default;
}

#client-map-container .nav .floor-button.active::after {
  display: block;
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 12px 0 12px;
  border-color: #36cc60 transparent transparent transparent;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

#client-map-container .map {
  height: 415px;
  border: 1px solid #777;
}

#client-map-container .area-label {
  background-color: transparent;
  margin: 0;
  border: 0;
  box-shadow: none;
  padding: 0;
  color: #006540;
  font-size: 15px;
  font-weight: bold;
}

#client-map-container .person-label,
#client-map-container .role-label {
  margin: 0;
  box-shadow: none;
  padding: 1px 10px;
  border-radius: 0;
  font-size: 14px;
  opacity: 1 !important;
  font-weight: bold;
  color: #000000;
}

#client-map-container .person-label {
  border: 1px solid #006540;
  background-color: #EDF4F2;
}

#client-map-container .role-label {
  border: 1px solid #000;
  background-color: #fff;
}

#client-map-container .area-label::before,
#client-map-container .person-label::before,
#client-map-container .role-label::before {
  display: none;
}

#client-map-container .controls {
  margin-top: 8px;
}

#client-map-container .user-popup {
  display: flex;
}

#client-map-container .user-popup:hover {
  text-decoration: none;
}

#client-map-container .user-popup img {
  width: 48px;
  height: 48px;
  border-radius: 100px;
  border: 2px solid #fff;
  margin-right: 10px;
}

#client-map-container .user-popup .user-name {
  display: block;
  color: #006540;
  font-size: 14px;
  font-weight: 600;
}

#client-map-container .user-popup:hover .user-name {
  text-decoration: underline;
}

#client-map-container .user-popup .title,
#client-map-container .user-popup:hover .title {
  color: #555;
}

#client-map-container .leaflet-container a.leaflet-popup-close-button {
  color: #999;
}

#client-map-container .leaflet-container a.leaflet-popup-close-button:hover {
  color: #555;
}

#client-map-container .leaflet-popup-content-wrapper {
  background-color: #EEF4EF;
  border-radius: 0;
}

#client-map-container .leaflet-popup-content {
  margin: 7px 30px 7px 10px;
}

#client-map-container .leaflet-popup-content-wrapper, .leaflet-popup-tip {
  background-color: #EEF4EF;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.4);
}