@import url("https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap");
body {
  font-family: "Ubuntu", sans-serif;
  font-weight: bolder;
  font-style: normal;
}
header {
  z-index: 1000;
  background-color: #e6cfaf;
  box-shadow: 8px 8px 11px #b08643;
}
header,
aside {
  font-family:
    "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans",
    Arial, sans-serif;
}
aside {
  z-index: 2000 !important;
  background-color: #ffeed6;
  right: -1400px;
  height: 100vh;
  transition: all 0.5s 0s ease-out;
}
main {
  height: auto;
  background-color: #f6ebe5;
}
.size-img {
  width: 95px;
  height: 95px;
}
.custom-width {
  width: 100px;
}
.li_color {
  background-color: #ffeed6;
  text-wrap: nowrap;
}
.active {
  width: 60px;
  height: 150px;
}

div,
footer {
  animation-name: scroll;
  animation-duration: 1s;
  animation-range: entry 0%;
  animation-timeline: view();
}

@keyframes scroll {
  0% {
    transform: translate(-400px, 100px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}

.contact_head {
  height: 500px;
  background-image: url(../images/contact.png);
  background-repeat: no-repeat;
  background-size: 100% 140%;
  background-position: -110px -100px;
}
.contact_title {
  text-wrap: nowrap;
  font-size: 120px;
  font-family:
    "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans",
    Arial, sans-serif;
}
.contact_detail {
  padding: 40px 0px;
}
.fa-instagram {
  font-size: 100px;
  color: rgb(255, 0, 140);
}
.fa-facebook-f {
  font-size: 100px;
  color: blue;
}
.fa-tiktok,
.fa-envelope,
.fa-phone {
  font-size: 100px;
}
.location {
  padding: 40px 0px;
}
.size-custom {
  width: 350px !important;
  height: 350px !important;
}
.full-img {
  background-image: url(../images/location.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.card {
  width: 30%;
}
.div-footer {
  height: 100px;
}
footer {
  height: 600px;
}

@media screen and (min-width: 992px) {
  aside {
    display: none;
  }
}

@media screen and (max-width: 918px) {
  footer {
    height: 400px;
  }
}

@media screen and (max-width: 769px) {
  .contact_head {
    height: 520px;
  }

  .contact_detail {
    flex-direction: column;
    height: auto;
  }

  .location {
    flex-direction: column;
    height: auto;
  }

  .size-custom {
    width: 100%;
    height: 300px;
    margin-bottom: 20px;
  }
}

@media screen and (max-width: 670px) {
  footer {
    height: 300px;
  }
}

@media screen and (max-width: 611px) {
  .contact_head {
    height: 500px;
    background-size: 160% 150%;
  }
}

@media screen and (max-width: 590px) {
  .contact_title {
    font-size: 90px;
  }
}

@media screen and (max-width: 437px) {
  .contact_title {
    font-size: 50px !important;
  }
}

@media screen and (max-width: 430px) {
  .size-img {
    width: 50px;
    height: 50px;
  }
  footer {
    height: 170px;
  }
  .contact_head {
    height: 300px;
  }
}

@media screen and (max-width: 376px) {
  .contact_head {
    height: 300px;
  }
}

@media screen and (max-width: 340px) {
  .contact_title {
    font-size: 30px !important;
  }
}

@media screen and (max-width: 322px) {
  footer {
    height: 130px;
  }
  .size-custom {
    width: 300px !important;
    height: 300px !important;
  }
}