.contact__content__tab,
.contact__map__location,
.contact__map__location:hover svg path {
  transition: 0.2s ease-in-out;
}
.contact__content__locations-item a img,
.contact__map__location svg {
  width: 2rem;
}
.contact__content__locations-branch,
.contact__content__title__subtitle {
  font-family: Almarai-bold, Arial, sans-serif;
}
.contact {
  padding: 3rem 0;
}
.contact__map__container {
  position: relative;
}
.contact__map {
  padding-right: 4rem;
}
.contact__map-home {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: 4rem;
}
.contact__content {
  padding-left: 4rem;
}
.contact__content-home {
  padding-right: 4rem;
  padding-left: calc(var(--bs-gutter-x) * 0.5);
}
.contact__map__location {
  position: absolute;
  background: 0 0;
  border-radius: 50%;
  padding: 0;
  box-shadow: none;
}
.contact__map__location svg path {
  fill: var(--white-color);
}
.contact__map__location.active svg path,
.contact__map__location:hover svg path {
  fill: var(--red-color);
}
.contact__map__location.location-1 {
  left: 26%;
  top: 39.5%;
}
.contact__map__location.location-2 {
  left: 20.5%;
  top: 37%;
}
.contact__map__location.location-3 {
  left: 20.5%;
  top: 32%;
}
.contact__map__location.location-4 {
  left: 26.5%;
  top: 33%;
}
.contact__map__location.location-5 {
  left: 32.5%;
  top: 37%;
}
.contact__map__location.location-6 {
  left: 31%;
  top: 33%;
}
.contact__content__title {
  font-size: 4rem;
  color: var(--gray-color);
}
.contact__content__tabs {
  display: flex;
  flex-wrap: wrap;
  margin: 2rem -1%;
}
.contact__content__tab {
  background: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 31.333333%;
  font-size: 2rem;
  height: 4.5rem;
  color: var(--primary-color);
  border: 2px solid var(--primary-color);
  padding: 0 1rem;
  margin: 0 1% 1rem;
  cursor: pointer;
}
.contact__content__tab.active,
.contact__content__tab:hover {
  color: var(--white-color);
  background: var(--primary-color);
}
.contact__content__title .contact__content__title__subtitle {
  color: var(--primary-color);
}
.contact__content-text {
  margin-top: 2rem;
  color: var(--secondary-color);
}
.contact__content__locations,
.contact__content__locations-map {
  margin-top: 3rem;
}
.contact__content__locations-branch {
  font-size: 3rem;
  color: var(--gray-color);
  margin-bottom: 2rem;
}
.contact__content__locations-item {
  margin-bottom: 1.2rem;
}
.contact__content__locations-item a {
  display: flex;
  align-items: center;
}
.contact__content__locations-item a address {
  margin: 0;
}
.contact__content__locations-item a address,
.contact__content__locations-item a span {
  font-size: 1.5rem;
  color: var(--gray-color);
  margin-right: 1rem;
}
@media only screen and (max-width: 1200px) {
  .contact__content__locations-map iframe {
    height: 200px;
  }
}
@media only screen and (max-width: 992px) {
  .contact__content__locations-map iframe {
    height: 250px;
  }
  .contact__map {
    display: none;
  }
  .contact__content {
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
  }
}
@media only screen and (max-width: 768px) {
  .contact__content__tab {
    width: 48%;
  }
  .contact__map__location svg {
    width: 2rem;
  }
  .contact__content__locations-map iframe {
    height: 150px;
  }
}
@media only screen and (max-width: 480px) {
  .contact__map__location {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2rem;
  }
  .contact__map__location.location-3 {
    left: 20.5%;
    top: 33%;
  }
  .contact__map__location.location-2 {
    top: 38%;
  }
  .contact__map__location svg {
    width: 1.5rem;
  }
}