@media (max-width:1220px) {
  :root {
    --container-width: 1100px;
  }

  .wraper {
    display: flex;
    flex-direction: column;
  }

  .wraper-img {
    max-width: 600px;
    position: absolute;
    right: -80px;
    top: 100px;
  }

  .cards {
    --card-columns: 2;
  }

  .first-sect {
    gap: 20px;
  }
}

@media (max-width:1120px) {
  :root {
    --container-width: 1000px;
  }

  .posts_cards {
    grid-template-columns: repeat(2, 1fr);
    justify-content: center;
    gap: 20px;
    place-items: center
  }

  .footer-content {
    padding: 33px 25px 29px 25px;
  }
}

@media (max-width:1020px) {
  :root {
    --container-width: 900px;
  }

  .cards {
    --card-columns: 2;
    flex-direction: column;
  }

  .cards-bot {
    display: flex;
    flex-direction: column;
    min-width: fit-content;
    align-items: center;
    justify-content: center;
  }

  .card-bot-img {
    min-width: 200px;
  }

  .first-sect {
    flex-direction: column;
    align-items: center;
    gap: 50px;
  }

  .card-description {
    display: flex;

    flex-wrap: wrap;
    text-align: center;
  }

  .card-bot-title {
    display: flex;

    justify-content: center;
    align-items: center;
  }

  .card-bot-title {
    width: 100%;

  }

  .card-bot::after {
    opacity: 0;
  }

  .card-bot::before {
    opacity: 0;
  }

  .footer-content {
    flex-direction: column;
    align-items: center;
    padding: 33px 25px 29px 25px;
    gap: 20px;

    .footer-right {
      display: flex;
      justify-content: space-around;
      width: 100%;
    }
  }
}

@media (max-width:992px) {
  .content-info {
    height: 100%;
  }


  .cards {
    --card-columns: 1;
    width: 100%;
  }

  .card {
    height: 100%;
  }



  .wraper-sale {
    position: sticky;
    top: 10px;
    height: fit-content;
  }

  .icons {
    margin-bottom: 15px;
    gap: 60px;
    height: 30px;
  }

}

@media (max-width:915px) {
  :root {
    --container-width: 800px;
  }

  .nav-list {
    gap: 10px;
  }

  .find-more {
    display: flex;
    flex-direction: column;
    gap: 90px;
  }
}

@media (max-width:825px) {
  :root {
    --container-width: 750px;
  }

  .posts_cards {
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;
  }

  .posts_cards_container {
    min-width: 100%;
    display: flex;
    justify-content: center;
  }

  .posts_card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 20px;
    max-width: 400px;
  }

  .content-info {
    position: relative;
  }

  .right {
    margin: 0;
  }

  .wraper-sale {
    position: absolute;
    left: -25px;
    top: 35px;
    z-index: 1;
    min-width: 300px;
    /* display: none; */
    opacity: 0;
    visibility: hidden;
    transition: all 0.5s ease-in-out;

    .sale_img {
      display: none;
    }
  }

  .side-button {
    display: block;
    background-color: #ffffff;
    padding: 5px;
    border-radius: 5px;
  }

    .side-button:hover {
    display: block;
    background-color: #dbdbdb;
    padding: 5px;
    border-radius: 5px;
  }

  .show {
    opacity: 1;
    visibility: visible;
  }
}

@media (max-width:768px) {
  :root {
    --container-width: 600px;
  }

  .header-info {
    justify-content: space-between;
  }

  .nav {
    position: relative;
  }

  .burger-close-menu {
    position: absolute;
    top: 0px;
    right: 0px;
    transition: 0.3s all linear;
  }

  .nav-list {
    display: flex;
    position: fixed;
    top: 0px;
    left: 0px;
    flex-direction: column;
    background-color: #d5d5d5;
    height: 100%;
    width: 100%;
    z-index: 10;
    align-items: center;
    justify-content: center;
    transform: translateY(-100%);
    transition: all 0.5s linear;

  }

  .open {
    transform: translateY(0%);
  }

  .nav-item {
    background-color: #d5d5d5;
    font-size: 30px;
    font-weight: 500;
  }

  .nav-item:hover {
    border-bottom: none;
    text-shadow: 1px 0px 0px currentColor;
  }

  .lgn-btn {
    display: none;
  }

  .lgn-btn-menu {
    display: flex;
  }

  .wraper-img {
    display: none;
  }

  .wraper-info {

    max-width: 100%;
  }

  .burger-menu {
    display: block;
    width: 30px;
    height: 30px;
  }

  .burger-menu:hover {
    cursor: pointer;
  }

  .burger-menu:focus .nav-list {
    display: block;
  }



  .burger-close-menu:hover {
    cursor: pointer;
  }

  .section-two-content {
    flex-direction: column;
    gap: 40px;
    align-items: start;
  }



  .footer-content {
    
    .footer-left {
      flex-wrap: wrap;
      justify-content: space-between;
      gap: 20px;
    }

    .footer-right {
      flex-direction: column;
      align-items: center;
    }
  }
}

@media (max-width:615px) {
  :root {
    --container-width: 550px;
  }

  .burger-close-menu {
    right: 26px;
    right: 0;
  }

  .wraper-sale {
    left: 5px;
  }
}

@media (max-width:540px) {
  :root {
    --container-width: 450px;
  }

  .right-nav {
    flex-direction: column;
    gap: 25px;
    align-items: left;
  }

  .nav_links {
    flex-direction: row;
    gap: 15px;
  }

  .wraper-sale {
    top: 65px;
  }
}

@media (max-width:460px) {

  :root {
    --container-width: 400px;
  }

  .wraper-title {
    font-size: 36px;
  }

  .wraper-info {
    padding-left: 10px;
  }

  .find-more-card {
    padding-left: 30px;
        flex-direction: column;
  }

  .find-more-card-right {
    max-width: 100%;
    justify-content: start;

    text-align: left;
  }

  .find-more-btn {
    margin: 0;
  }

  .find-more-img {
    position: initial;
  }
}

@media (max-width:380px) {
  :root {
    --container-width: 350px;
  }
}

@media (min-width:769px) {
  .burger-close-menu {
    display: none;
  }
}