:root {
  --uncapText-width: 65dvw;
  --tap-hand-width: 40px;
  --single-bottle-box-width: 18dvw;
  --video_width: 240px;
  --video_height: auto;
  --cross-btn-top: 45dvh;
  --cross-btn-right: 0;

  --container-width: 300px;
}

@media (min-width: 601px) {
  :root {
    --uncapText-width: 20dvw;
    --tap-hand-width: 40px;
    --single-bottle-box-width: 5dvw;
    --video_width: 300px;
    --video_height: auto;
    --cross-btn-top: 45dvh;
    --cross-btn-right: 0;

    --container-width: 400px;
  }
}

.ppm_container {
  bottom: 50%;
  position: fixed;
  right: 50%;
  transform: translate(50%, 50%);
  width: var(--container-width);
  /* height: 0px; */
  aspect-ratio: 332/590;
  /* background-color: #f005; */
}

/* @media (min-width: 601px) {
  .ppm_container{
    bottom: 10dvh;
  }
} */

.ppm_logo_linear {
  z-index: 9999;
  position: absolute;
  right: 0%;
  bottom: 0;
  width: 16px;
}

.ppm_cementBag {
  width: 100%;
  position: absolute;
  bottom: 0px;
  display: none;
}

.ppm_breakingGif {
  width: 100%;
  position: absolute;
  bottom: 0px;
  display: none;
}

.ppm_image1 {
  display: none;
  width: 40%;
  position: absolute;
  bottom: 35%;
  left: 30%;
}

.ppm_image2 {
  display: none;
  width: 40%;
  position: absolute;
  bottom: 35%;
  left: 30%;
}
.ppm_image3 {
  display: none;
  width: 40%;
  position: absolute;
  bottom: 35%;
  left: 30%;
}
.ppm_copy {
  display: none;
  width: 92%;
  position: absolute;
  bottom: 36%;
  left: 4%;
}
.ppm_logo {
  width: 50%;
  position: absolute;
  bottom: 90%;
  left: 23%;
  display: none;

  backface-visibility: hidden;
  transform-style: preserve-3d;
}

.ppm_logo2 {
  opacity: 0;
}
.ppm_cta {
  position: absolute;
  bottom: 25%;
  width: 40%;
  left: 30%;
  display: none;
}

.ppm_absolute {
  position: absolute;
}

.ppm_hidden {
  display: none;
}

.ppm_zeroOpacity {
  opacity: 0;
}