.header {
  /* background-image: url(../img/vietnam.png); */
  background-size: cover;
  background-position: center;
}

.header-slide {
  width: 100%;
  overflow: hidden;
  position: absolute;
  background-size: cover;
  background-position: center;
}

.slider {
  display: flex;
  width: 100%;
  animation: slide 15s infinite;
}

.slide {
  width: 100%;
  overflow: hidden;
  flex-shrink: 0;
}

.slide img {
  width: 100%;
  height: auto;
}

@keyframes slide {
  0% { transform: translateX(0); }
  10% { transform: translateX(0); }
  22% { transform: translateX(-100%); }
  44% { transform: translateX(-100%); }
  66% { transform: translateX(-200%); }
  88% { transform: translateX(-200%); }
  100% { transform: translateX(0); }
}

.header__container,
.location__container,
.event__container,
.destination__container,
.tourist__container {
  display: flex;
}

.header__container {
  height: 100vh;
  flex-direction: column;
  justify-content: space-between;
  padding: 0 0 150px;
}

.header__title {
  font-family: "Montserrat Alternates", sans-serif;
  font-weight: 600;
  font-size: 100px;
  color: #a30909;
}

.location,
.event,
.tourist {
  position: relative;
  background-color: #f8f8f8;
}

.location__img {
  position: absolute;
  top: 50%;
  left: 30%;
  transform: translateY(-50%);
  max-width: 70%;
  z-index: 0;
}

.location__container {
  height: 100vh;
  width: 50%;
}

.location__info,
.event__info,
.tourist__info,
.destination__info {
  align-self: center;
}

.location__title,
.event__title,
.tourist__title,
.destination__title {
  font-family: "Montserrat Alternates", sans-serif;
  font-weight: 500;
  font-size: 65px;
  margin-bottom: 20px;
}

.location__description {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 16px;
  margin-bottom: 20px;
}

.event__container{
  height: 50vh;
  display: flex;
  justify-content: center;
  font-family: "Montserrat Alternates", sans-serif;
}

.tourist__container{
  height: 50vh;
  display: flex;
  justify-content: center;
  font-family: "Montserrat Alternates", sans-serif;
}

.destination__container {
  height: 70vh;
  display: flex;
  justify-content: center;
  font-family: "Montserrat Alternates", sans-serif;
}

.event-cards,
.tourist-cards,
.destination-cards {
  display: flex;
  gap: 10px;
  justify-content: space-around;
  flex-wrap: wrap;
  margin: 30px 0 50px;
}

.event-card,
.tourist-card,
.destination-card {
  position: relative;
  background-color: #fff;
  border-radius: 12px;
}

.event-card,
.tourist-card {
  width: 350px;
  height: 220px;
}

.event-card__info,
.tourist-card__info,
.destination-card__info {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  position: absolute;
  bottom: 0;
  padding: 10px 20px;
  display: flex;
  justify-content: space-between;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  text-decoration: none;
  color: #fff;
}

.event-card__info > img,
.tourist-card__info > img,
.destination-card__info > img {
  filter: invert(1);
}

.event-card__title,
.tourist-card__title,
.destination-card__title {
  font-weight: 500;
}

.destination-card__title {
  font-family: "Montserrat Alternates", sans-serif;
  text-transform: uppercase;
}

.event-card__time,
.tourist-card__time {
  margin-top: 10px;
  font-weight: 400;
  color: #a9a9a9;
  font-size: 12px;
}

.event__checkout,
.tourist__checkout,
.destination__checkout {
  text-align: center;
}

.event__checkout img,
.tourist__checkout img,
.destination__checkout img {
  margin: 0 10px;
}

.destination {
  background-image: url(../img/background.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.destination-card {
  width: 270px;
  height: 400px;
}

.destination__checkout {
  margin-bottom: 50px;
}

.event-card > img,
.tourist-card > img,
.destination-card > img {
  border-radius: 12px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

@media screen and (width < 1150px) {
  .location__container,
  .event__container,
  .tourist__container,
  .destination__container {
    height: initial;
  }

  .location__title,
  .event__title,
  .tourist__title,
  .destination__title {
    margin-top: 100px;
  }

  .header__container {
    height: 26vh;
    flex-direction: column;
    justify-content: space-between;
    padding: 0 0 150px;
  }
}

@media screen and (width < 700px) {
  .location__container,
  .event__container,
  .tourist__container,
  .destination__container {
    width: 100%;
  }

  .location__img {
    position: static;
    max-width: 100%;
    transform: unset;
  }

  .header__title {
    font-size: 60px;
  }

  .location__title,
  .event__title,
  .tourist__title,
  .destination__title {
    font-size: 48px;
  }

  .header__container {
    height: 26vh;
    flex-direction: column;
    justify-content: space-between;
    padding: 0 0 150px;
  }
}

@media screen and (width < 500px) {
  .header__title {
    font-size: 48px;
  }

  .location__title,
  .event__title,
  .tourist__title,
  .destination__title {
    font-size: 32px;
  }
  .header__container {
    height: 26vh;
    flex-direction: column;
    justify-content: space-between;
    padding: 0 0 150px;
  }
}