.contact-data dt {
  position: relative;
}

.contact-icon {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: #efeee9;
}

.contact-icon::before,
.contact-map-pin::before {
  content: "";
  display: block;
  width: 19px;
  height: 19px;
  background-color: var(--green);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}

.contact-icon--pin::before,
.contact-map-pin::before {
  -webkit-mask-image: url('../images/icon-map-pin.svg');
  mask-image: url('../images/icon-map-pin.svg');
}

.contact-icon--phone::before {
  -webkit-mask-image: url('../images/icon-phone.svg');
  mask-image: url('../images/icon-phone.svg');
}

.contact-icon--mail::before {
  -webkit-mask-image: url('../images/icon-mail.svg');
  mask-image: url('../images/icon-mail.svg');
}

.contact-icon--clock::before {
  -webkit-mask-image: url('../images/icon-clock.svg');
  mask-image: url('../images/icon-clock.svg');
}

.map > .contact-map-pin {
  position: absolute;
  left: 50%;
  top: 43%;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--green);
  transform: translate(-50%, -50%);
}

.map > .contact-map-pin::before {
  width: 25px;
  height: 25px;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  transform: none;
  position: static;
  flex: none;
}

.contact-icon::after,
.contact-map-pin::after {
  content: none !important;
}