@media (max-width: 1200px) {
  :root {
    --ltt-top: 12%;
    --ltt-left: 82%;
    --libyana-left: 73%;
    --libyana-top: 78%;
    --pos-left: 5%;
    --pos-top: 50%;
    --inside-left: 26%;
    --inside-top: 32%;
  }
  .website,
  .whatsapp {
    bottom: 0;
  }
  h1 {
    font-size: 1.4rem;
  }
  footer {
    background-position: center calc(100% + 2rem);
  }
}
@media (max-width: 900px) {
  :root {
    --ui-size: 6rem;
    --pos-width: 15rem;
    --pos-top: 52%;
    --pos-left: 7%;
    --inside-left: 22%;
    --inside-top: 35%;
    --libyana-top: 75%;
    --libyana-left: 79%;
    --ltt-left: 82%;
    --ltt-top: 15%;
  }
  h1 {
    font-size: 1.2rem;
    padding: 1rem;
    border-radius: 40px;
  }
  .website,
  .whatsapp {
    bottom: 0;
    font-size: 1rem;
  }
  .website > img,
  .whatsapp > img {
    margin: 5px;
  }
  .whatsapp {
    right: 10%;
    left: 0;
  }
  footer {
    background-position: center calc(100% + 1.1rem);
  }
  body {
    background-position: right center;
  }
}
@media (max-width: 600px) {
  :root {
    --ui-size: 4rem;
    --pos-width: 9.5rem;
    --pos-top: 73%;
    --pos-left: 5%;
    --inside-top: 39%;
    --inside-left: 9%;
    --ltt-top: 10%;
    --ltt-left: 85%;
    --libyana-top: 79%;
  }
  h1 {
    font-size: 0.9rem;
    padding: 1rem;
    line-height: 2rem;
    width: 70%;
  }
  .main-list > li::before {
    font-size: 1.5rem;
  }
  .whatsapp,
  .website {
    font-size: 1rem;
  }
  .website > img,
  .whatsapp > img {
    width: 1.5rem;
  }
  article {
    padding: 1rem 0 0 5px;
    width: 80%;
  }
  footer {
    background-position: center calc(100%);
  }
  .logo {
    width: 180px;
  }
}
@media (max-width: 420px) {
  :root {
    --ui-size: 4rem;
    --pos-width: 10rem;
    --pos-top: 78%;
    --pos-left: 10%;
    --inside-top: 47%;
    --inside-left: 8%;
    --ltt-top: 15%;
    --libyana-top: 79%;
    --libyana-left: 70%;
  }
  article {
    padding: 2.5rem 0 0 5px;
    width: 80%;
  }
  h1 {
    font-size: 1.1rem;
    padding: 1rem;
    line-height: 1.5rem;
  }
  .main-list > li::before {
    right: -5%;
  }
  .main-list > li {
    padding-right: 1rem;
  }
  .whatsapp,
  .website {
    font-size: 0.8rem;
  }
  .website > img,
  .whatsapp > img {
    width: 1rem;
    margin: 3px;
  }
}