/* attractions */

.arow {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
  margin-left: 12%;
  margin-top: 10%;
  margin-bottom: 10%;
  /* align-items: center; */
}

/* Create four equal columns that sits next to each other */
.acolumn {
  flex: 25%;
  max-width: 25%;
  padding: 0 4px;
  margin-left: 2%;
  position: relative;
}

.acolumn img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
  height: 70vh;
  border-radius: 5%;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 400px) {
  .acolumn {
    flex: 50%;
    max-width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 300px) {
  .acolumn {
    flex: 100%;
    max-width: 100%;
  }
}

.acolumn2 {
  flex: 25%;
  max-width: 25%;
  padding: 0 4px;
  margin-left: 2%;
  position: relative;
}

.acolumn2 img {
  margin-top: 40px;
  vertical-align: middle;
  width: 100%;
  height: 70vh;
  border-radius: 5%;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 400px) {
  .acolumn2 {
    flex: 50%;
    max-width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 300px) {
  .acolumn2 {
    flex: 100%;
    max-width: 100%;
  }
}


.acolumn3 {
  flex: 25%;
  max-width: 25%;
  padding: 0 4px;
  margin-left: 2%;
  position: relative;
}

.acolumn3 img {
  margin-top: 72px;
  vertical-align: middle;
  width: 100%;
  height: 70vh;
  border-radius: 5%;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 400px) {
  .acolumn3 {
    flex: 50%;
    max-width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 300px) {
  .acolumn3 {
    flex: 100%;
    max-width: 100%;
  }
}

/* ====================== Footer ============================ */

.footer-title {
    font-size: 45px;
}

.footer-content {
    font-size: 16px;
}

.footer-address {
    font-size: 22px;
}

.footer-contact-whatsapp {
    font-size: 18px;
}

.footer-contact-phone {
    font-size: 18px;
}

.footer-contact-email {
    font-size: 18px;
}

@media (max-width: 1199px) {
    h1:not(.u-title) {
        font-size: 3.75rem !important;
    }

    .footer-content {
        font-size: 25px;
    }

    .footer-address {
        font-size: 25px;
    }

    .footer-contact-whatsapp {
        font-size: 25px;
    }

    .footer-contact-phone {
        font-size: 25px;
    }

    .footer-contact-email {
        font-size: 25px;
    }
}

@media (max-width: 991px) {
    h1:not(.u-title) {
        font-size: 3.75rem !important;
    }

    .u-footer p {
        font-size: 22px !important;
    }

    .u-footer a {
        font-size: 22px !important;
    }

    .footer-address {
        font-size: 25px;
    }

    .footer-contact-whatsapp {
        font-size: 25px;
    }

    .footer-contact-phone {
        font-size: 25px;
    }

    .footer-contact-email {
        font-size: 25px;
    }
}

@media (max-width: 767px) {
    .footer-title {
        font-size: 38px;
    }

    .footer-content {
        font-size: 25px;
    }

    .footer-address {
        font-size: 25px;
    }

    .footer-contact-whatsapp {
        font-size: 25px;
    }

    .footer-contact-phone {
        font-size: 25px;
    }

    .footer-contact-email {
        font-size: 25px;
    }
}

@media (max-width: 575px) {
    .footer-title {
        font-size: 38px;
    }

    .footer-content {
        font-size: 25px;
    }

    .footer-address {
        font-size: 25px;
    }

    .footer-contact-whatsapp {
        font-size: 25px;
    }

    .footer-contact-phone {
        font-size: 25px;
    }

    .footer-contact-email {
        font-size: 25px;
    }
}