.b3 {
  background: center center no-repeat;
  background-size: cover;
  border-bottom: 0;
  padding: 5.25rem 0;
  position: relative;
  text-align: center;
}

.b3::before {
  background: rgba(84, 101, 126, 0.9);
  content: '';
  height: 100%;
  left: 0;
  opacity: .8;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.b3 .wrapper {
  position: relative;
  z-index: 2;
}

.b3--red-route {
  background-image: url("../../../img/layout/bg-map-bcn-red.webp");
  border-bottom: 2px solid #ad1457;
  border-top: 2px solid #ad1457;
}

.b3--blue-route {
  background-image: url("../../../img/layout/bg-map-bcn-blue.webp");
  border-bottom: 2px solid #1bacc0;
  border-top: 2px solid #1bacc0;
}

.b3--green-route {
  background-image: url("../../../img/layout/bg-map-bcn-green.webp");
  border-bottom: 2px solid #1bbc57;
  border-top: 2px solid #1bbc57;
}

@media screen and (min-width: 48em) {
  .b3 {
    padding: 8.5rem 0;
  }
}

@media screen and (min-width: 80em) {
  .b3 {
    padding: 8.5rem 0;
  }
}