/* start images */
  :root {
    --w: 255px;
    --w2: 400px;
    --w3: 340px;
    --h: 334px;
  }
  .mobile-view {
    display: none;
  }
  .desktop-view {
    display: block;
  }
  .milestone_youtube {
    background: url("/pages/2024/12/milestone_youtube.webp")
      no-repeat center;
    margin: 0 auto;
  }
  .milestone_youtube.main {
    height: 400px;
    background-size: contain;
  }
  .milestone_activision {
    background: url("/pages/2024/12/milestone_activision.webp")
      no-repeat center;
    margin: 0 auto;
  }
  .milestone_activision.main {
    height: 400px;
    background-size: contain;
  }
  .milestone_mersedes {
    background: url("/pages/2024/12/milestone_mersedes.webp")
      no-repeat center;
    margin: 0 auto;
  }
  .milestone_mersedes.main {
    height: 400px;
    background-size: contain;
  }
  .milestone_herbalife {
    background: url("/pages/2024/12/milestone_herbalife.webp")
      no-repeat center;
    margin: 0 auto;
  }
  .milestone_herbalife.main {
    height: 400px;
    background-size: contain;
  }
  .milestone_high_level {
    background: url("/pages/2024/12/milestone_high_level.webp")
      no-repeat center;
    margin: 0 auto;
  }
  .milestone_high_level.main {
    height: 400px;
    background-size: contain;
  }
  .milestone_google_play {
    background: url("/pages/2024/12/milestone_google_play.webp")
      no-repeat center;
    margin: 0 auto;
  }
  .milestone_google_play.main {
    height: 400px;
    background-size: contain;
  }
  .milestone_footer_group {
    background: url("/pages/2024/12/milestone_footer_group.webp")
      no-repeat center;
    margin: 0 auto;
  }

  .milestone_footer_group.main {
    height: 1616px;
    background-size: contain;
  }
  /* end images */

h1, h2, h3 {
    font-family: "Futura Std Light", sans-serif;
    text-transform: uppercase;
    margin-top: 3px;
    margin-bottom: 3px;
    line-height: 1;
    display: block;
}

.line {
    width: 200px;
    height: 3px;
    margin-top: 10px;
    margin-bottom: 8px;
}

h1 {
    font-size: 40px;
    display: block;
}

h2 {
    font-size: 35px;
    display: block;
}
h3 {
    font-size: 30px;
    display: block;
}
  p {
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 3rem;
  }
  .images {
    text-align: center;
    margin-top: 6rem !important;
  }
  .images img {
    max-width: 100%;
    max-height: 400px;
  }
  .images-footer img {
    max-width: 100%;
  }
  .mt-24 {
    margin-top: 6rem;
  }
  .first-image {
    float: right;
    margin-left: 15px;
  }
  @media only screen and (max-width: 1000px) {
    /* start images */
    .desktop-view {
      display: none;
    }
    .mobile-view {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
    }

    .milestone_youtube {
      background-size: 1020px 334px;
      height: 334px;
    }
    .milestone_youtube.part-1 {
      width: 180px;
      background-position: 0 0;
    }
    .milestone_youtube.part-2 {
      width: 230px;
      background-position: -250px 0;
    }
    .milestone_youtube.part-3 {
      width: 215px;
      background-position: -515px 0;
    }
    .milestone_youtube.part-4 {
      width: 270px;
      background-position: -765px 0;
    }

    .milestone_activision {
      background-size: 1020px 327px;
      height: 327px;
    }
    .milestone_activision.part-1 {
      width: 290px;
      background-position: 0 0;
    }
    .milestone_activision.part-2 {
      width: 240px;
      background-position: -340px 0;
    }
    .milestone_activision.part-3 {
      width: 160px;
      background-position: -630px 0;
    }
    .milestone_activision.part-4 {
      width: 230px;
      background-position: -820px 0;
    }

    .milestone_mersedes {
      background-size: 1020px 363px;
      height: 363px;
    }
    .milestone_mersedes.part-1 {
      width: 135px;
      background-position: 0 0;
    }
    .milestone_mersedes.part-2 {
      width: 130px;
      background-position: -210px 0;
    }
    .milestone_mersedes.part-3 {
      width: 125px;
      background-position: -410px 0;
    }
    .milestone_mersedes.part-4 {
      width: 140px;
      background-position: -610px 0;
    }
    .milestone_mersedes.part-5 {
      width: 165px;
      background-position: -860px 0;
    }

    .milestone_herbalife {
      background-size: calc(var(--w) * 4) var(--h);
      height: calc(var(--h) + 20px);
    }
    .milestone_herbalife.part-1 {
      width: 150px;
      background-position: 0 0;
    }

    .milestone_high_level {
      background-size: calc(var(--w3) * 3) var(--h);
      height: calc(var(--h) + 20px);
      width: calc(var(--w3));
    }
    .milestone_high_level.part-1 {
      background-position: +40px 0;
    }
    .milestone_high_level.part-2 {
      background-position: calc((var(--w3) - 20px) * -1) 0;
    }
    .milestone_high_level.part-3 {
      background-position: calc((var(--w3) * 2 - 10px) * -1) 0;
    }

    .milestone_google_play {
      background-size: calc(var(--w2) * 2) calc(var(--h) + 50px);
      height: calc(var(--h) + 70px);
      width: calc(var(--w2) - 50px);
    }
    .milestone_google_play.part-1 {
      background-position: +30px 0;
    }
    .milestone_google_play.part-2 {
      background-position: calc((var(--w2) + 80px) * -1) 0;
    }

    .milestone_footer_group {
      background-size: 1020px 1170px;
      height: 241px;
      width: 146px;
    }
    .milestone_footer_group.part-11 {
      width: 120px;
      background-position: 0 0;
    }
    .milestone_footer_group.part-12 {
      width: 95px;
      background-position: -146px 0;
    }
    .milestone_footer_group.part-13 {
      width: 200px;
      background-position: -270px 0;
    }
    .milestone_footer_group.part-14 {
      width: 110px;
      background-position: -485px 0;
    }
    .milestone_footer_group.part-15 {
      width: 110px;
      background-position: -600px 0;
    }
    .milestone_footer_group.part-16 {
      width: 95px;
      background-position: -720px 0;
    }
    .milestone_footer_group.part-17 {
      width: 105px;
      background-position: -830px 0;
    }
    .milestone_footer_group.part-18 {
      width: 85px;
      background-position: -950px 0;
    }

    .milestone_footer_group.part-21 {
      width: 140px;
      background-position: 0 -241px;
    }
    .milestone_footer_group.part-22 {
      width: 140px;
      background-position: -146px -241px;
    }
    .milestone_footer_group.part-23 {
      width: 140px;
      background-position: -295px -241px;
    }
    .milestone_footer_group.part-24 {
      width: 190px;
      background-position: -435px -241px;
    }
    .milestone_footer_group.part-25 {
      width: 200px;
      background-position: -625px -241px;
    }
    .milestone_footer_group.part-26 {
      width: 195px;
      background-position: -825px -241px;
    }

    .milestone_footer_group.part-31 {
      width: 135px;
      background-position: 0 -482px;
    }
    .milestone_footer_group.part-32 {
      width: 125px;
      background-position: -135px -482px;
    }
    .milestone_footer_group.part-33 {
      width: 185px;
      background-position: -255px -482px;
    }
    .milestone_footer_group.part-34 {
      width: 150px;
      background-position: -440px -482px;
    }
    .milestone_footer_group.part-35 {
      width: 290px;
      background-position: -590px -482px;
    }
    .milestone_footer_group.part-36 {
      width: 140px;
      background-position: -880px -482px;
    }

    .milestone_footer_group.part-41 {
      width: 135px;
      background-position: 0 -723px;
    }
    .milestone_footer_group.part-42 {
      width: 130px;
      background-position: -180px -723px;
    }
    .milestone_footer_group.part-43 {
      width: 165px;
      background-position: -305px -723px;
    }
    .milestone_footer_group.part-44 {
      width: 130px;
      background-position: -470px -723px;
    }
    .milestone_footer_group.part-45 {
      width: 130px;
      background-position: -600px -723px;
    }
    .milestone_footer_group.part-46 {
      width: 70px;
      background-position: -750px -723px;
    }
    .milestone_footer_group.part-47 {
      width: 190px;
      background-position: -830px -723px;
    }

    .milestone_footer_group.part-48 {
      width: 170px;
      background-position: 10px -946px;
    }

    .milestone_footer_group.part-49 {
      width: 170px;
      background-position: -140px -946px;
    }

    .milestone_footer_group.part-50 {
      width: 190px;
      background-position: -327px -946px;
    }
    /* end images */
  }
  @media only screen and (max-width: 600px) {
    .mmt-24 {
      margin-top: 130px;
    }

    .pg_heading {
      font-size: 40px !important;
      padding: 0 15px !important;
    }
    .images,
    .images-footer {
      margin: 3rem 15px 0 15px !important;
    }
    p {
      padding: 0 15px;
    }
    .first-image {
      float: none;
      margin-left: 0;
    }
  }