/* MEDIA QUERIES  */
@media (max-width: 1460px) {
      .PopgVip .HeroSection {
            background-position: 100% 0% !important;
      }

      .HeroInner,
      .WordwidePlayers,
      .AboutPOPGame,
      .LovePOPGAME {
            padding: 0% 14%;
      }

      .Nav_Inner,
      .Footer {
            padding-left: 14%;
            padding-right: 14%;
      }

      .AboutPOPGame .DetailText {
            width: 80%;
      }

      .HeroInnerLeft .DetailText {
            width: 95%;
      }

      .SecretEdge .HeroInnerRight img {
            width: 100%;
      }

      .BonusBody .WordwidePlayers {
            margin-top: 20px;
      }

      .Nav_items a {
            font-size: 2.2rem;
      }
}


@media (max-width: 1350px) {
      .HeroInner .HeroInnerRight {
            justify-content: end;
      }

      .PlayersValues {
            margin: -165px 0px 0px -100px;
      }

      .PopgVip .HeroSection {
            background-position: 80% 0% !important;
      }

      .HeroInnerLeft {
            width: 50%;
      }

      .HeroInner,
      .WordwidePlayers,
      .AboutPOPGame,
      .LovePOPGAME {
            padding: 0% 10%;
      }

      .Nav_Inner,
      .Footer {
            padding-left: 10%;
            padding-right: 10%;
      }

      .BonusHeroInnerRight img {
            width: 100%;
      }
}

@media (max-width: 1150px) {

      .HeroInner .HeroInnerRight,
      .HeroInnerLeft {
            width: 50%;
      }

      .HeroInner {
            justify-content: space-between;
            height: 84vh;
      }

      .PlayersValues p {
            font-size: 2.5rem;
      }

      .PlayersValues {
            margin: -165px 0px 0px -80px;
      }


      .HeroInner,
      .WordwidePlayers,
      .AboutPOPGame,
      .LovePOPGAME {
            padding: 0% 60px;
      }

      .Nav_Inner {
            padding: 20px 60px;
      }

      .Footer {
            padding: 0px 60px 50px 60px;
      }
}

@media (max-width: 992px) {
      .Nav_Inner {
            justify-content: space-between;
      }

      .HeroInner,
      .WordwidePlayers,
      .AboutPOPGame,
      .LovePOPGAME {
            padding: 0px 25px;
      }

      .Nav_Inner {
            padding: 20px 25px;
      }

      .Footer {
            padding: 0px 25px 50px 25px;
      }

      .HeroInner {
            flex-direction: column;
            padding-top: 100px;
            align-items: flex-start;
            height: auto;
      }

      .HeroInnerLeft {
            width: 70%;
            margin-top: 0px;
      }

      .HeroSection {
            background-image: url(../images/secret-hero-bg-image.webp);
            background-position: 0% 0%;
      }

      .HeroInner .HeroInnerRight {
            width: 100% !important;
            justify-content: center;
            align-items: center;
      }

      .HeroInner .HeroInnerRight img {
            width: auto;
      }

      .PlayersValues {
            position: absolute;
            right: 0;
            margin: -65px 0px 0px 0px;
      }

      .PlayersValues div {
            background-color: #00000061;
            padding: 15px 60px 15px 15px;
            border-left: 4px solid #525252;
      }

      .PlayersValues div p {
            font-size: 3rem;
      }

      .AboutPOPGame .DetailText,
      .Footer p,
      .PeterVideoSection img,
      .PopVipHeroImageTablet,
      .video-container {
            width: 100%;
      }

      .BonusHeroSection .HeroInnerLeft h1 {
            width: auto;
      }

      .AboutPOPGame,
      .LovePOPGAME,
      .Footer {
            margin-top: 150px;
      }

      .LoveContainer {
            margin-top: 40px;
      }

      .HeadTextMobile,
      .PopVipHeroImageTablet,
      .Hamburger {
            display: block;
      }

      .SecretEdge .HeadText.HeadTextDesktop,
      .PopVipHeroImageDesktop,
      .PopgVip .HeadTextMobile,
      .BonusBody .HeadText.HeadTextDesktop,
      .Nav_items {
            display: none;
      }

      .BonusHeroSection .HeroInnerLeft {
            width: 100%;
            margin-top: -20px;
      }

      .BonusHeroSection .HeroInnerLeft p {
            width: 75%;
      }

      .BonusBody .HeroInner .HeroInnerRight img {
            margin-left: 50px;
            width: 50% ;
      }

      .BonusHeroSection .overley {
            background-image: linear-gradient(to top, #000000 14%, #00000036 20%);
      }

      .BonusHeroSection {
            background-position: 65% 35%;
            height: auto;
      }

      .BonusBody .WordwidePlayers {
            margin-top: 45px;
      }

      .BonusHeroSection {
            padding-top: 0px;
      }

      .PopgVip .HeroSection {
            background-image: none;
      }

      .PopgVip .HeroSection .HeroInner,
      .SecretEdge .HeroInner {
            height: auto;
      }

      .PopgVip .HeroSection .HeroInner .HeroInnerLeft {
            margin-top: 0px;
            margin-bottom: 40px;
      }


      .PopgVip .WordwidePlayers h2 {
            margin-top: 0px;
      }

      .PopgVip .WordwidePlayers {
            margin-top: 25px;
      }

      .PopgVip .WordwidePlayers .DetailText {
            width: 70%;
      }



}

@media (max-width: 850px) {
      .HeroSection {
            background-image: url(../images/secret-hero-bg-image.webp);
            background-position: 0% 200px;
      }

      .PlayersValues div p {
            font-size: 2.8rem;
      }

      .LoveContainer .LoveDiv {
            width: 100%;
      }

      .LoveContainer>div>div:nth-child(1) {
            width: 70px;
            text-align: end;
      }
}

@media (max-width: 768px) {

      .PlayersValues div p {
            font-size: 2.5rem;
      }

      .PlayersValues div {
            padding: 15px 50px 15px 15px;
      }

      .HeroInner .HeroInnerRight img {
            width: 75%;
      }

      .BonusBody .HeroInner .HeroInnerRight img {
            width: 65%;
      }

      .LoveContainer>div>div:nth-child(2) {
            width: 86%;
      }

      .BonusHeroSection .overley {
            top: 20px;
      }

      .PopgVip .WordwidePlayers .DetailText {
            width: 90%;
      }

      /* .LoveContainer>div div img
      {
            width: 100%;
      } */
      .play-button {
            font-size: 4.5rem;
      }

      .MobileManu {
            width: 70%;
            left: -70%;
      }
}


@media (max-width: 580px) {
      .HeroSection {
            background-image: url(../images/secret-hero-bg-mobile.webp) !important;
            background-position: 0% 0%;
      }

      .BonusHeroSection {
            background-position: 40% 66%;
      }

      .HeroInnerLeft,
      .BonusHeroSection .HeroInnerLeft p {
            width: 100%;
      }

      .PlayersValues {
            position: static;
            flex-direction: row;
            display: flex;
            width: 62%;
            justify-content: space-between;
            margin-top: -50px;
      }

      .HeroInner .HeroInnerRight {
            flex-direction: column;
      }

      .PlayersValues>div:nth-child(2) {
            margin-top: 0px;
      }

      .PlayersValues div {
            padding: 10px 15px 10px 15px;
            border-left: 2px solid #525252;

      }

      .SecretEdge .overley,
      .PopVipHeroImageTablet,
      .HeadTextDesktop {
            display: none;
      }

      .PopVipHeroImageMobile,
      .HeadTextMobile,
      .PopgVip .HeadTextMobile {
            display: block;
            width: 100%;
      }

      .HeadTextMobile,
      .PopgVip .HeadTextMobile {
            width: 90%;
      }

      .HeroInnerLeft form input {
            width: 120px;
      }

      .HeroInnerLeft form button {
            font-size: 1.8rem;
            font-weight: 800;
      }


      .AboutPOPGame,
      .LovePOPGAME,
      .Footer {
            margin-top: 80px;
      }

      .BonusBody .WordwidePlayers {
            margin-top: 20px;
      }

      .HeadText {
            font-size: 4.5rem;
      }

      .Footer p {
            font-size: 2rem;
      }

      .BonusBody .HeroInner .HeroInnerRight img {
            width: 90%;
      }

      .PopgVip .HeroSection {
            background-image: none !important;
      }

      .HeroInner {
            padding-top: 60px;
      }

      .HeroInnerLeft form div {
            margin-top: 40px;
      }

}

@media (max-width: 390px) {
      .HeadText {
            font-size: 3.7rem;

      }
}















/* MEDIA QUERIES FOR FONT SIZES  */

/* Styles for mobile */
@media screen and (min-width: 250px) {
      html {
            font-size: 38%;
      }
}

/* Styles for mobile */
@media screen and (min-width: 580px) {
      html {
            font-size: 45%;
      }
}

/* Styles for small tablets */
@media screen and (min-width: 768px) {
      html {
            font-size: 48%;
      }
}

/* Styles for tablets */
@media screen and (min-width: 1024px) {
      html {
            font-size: 50%;
      }
}

/* Styles for tablets */
@media screen and (min-width: 1300px) {
      html {
            font-size: 54%;
      }
}

/* Styles for laptops and desktops */
@media screen and (min-width: 1450px) {
      html {
            font-size: 62.5%;
      }
}