@media (max-width: 500px) {
  .wrapper > div {
    width: 100%;
    max-width: 100%;
  }

  .cookie-popup > div, .progress-container {
    width: 100%;
  }

  .progress-container{
    left: 0;
    transform: unset;
  }
}

@media (max-width: 400px) {
  .gift-popup > div {
    width: 90%;
  }
}

@media (max-width: 370px) {
  :root {
    font-size: 8px;
  }

  .image-circle-container {
    width: 276px;
    height: 276px;
  }

  .inner-image-circle{
    width: 188px;
    height: 188px;
  }

  .image-circle{
    width: 100px;
    height: 100px;
  }
  .image-circle img{
    width: 120px;
    height: 120px;
  }

  .common-wrapper h2{
    font-size: 1.7rem;
  }
}

@media (max-width:300px){
    .grid{
            grid-template-columns: repeat(2, 1fr);
    }
}
