@font-face {
   font-family: madhuban;
   src: url(Madhuban-Bold.otf);
   font-weight: bold;
}

@media screen and (max-width:430px) {



   body {
      padding: 0;
      margin: 0;
      background-color: black;
      box-sizing: border-box;
      overflow: hidden;

   }

   .home-screen{
      display: none;
   }

   .android .mobile-home-screen {
      display: block;
   }

   .splash-screen {
      display: none;
   }

   .android .mobile-splash {
      display: block;
      overflow: hidden;
      
   }

   .android #mobile-video-splash {
      transition: opacity 0.5s ease-in-out;
      /* Adjust time as needed */
      opacity: 1;
      /* Start fully visible */
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      z-index: 1000;
      /* Ensure it's above other content */
      overflow: hidden;

   }

   /* Hidden state (after fade-out) */
   .hidden {
      opacity: 0;
      visibility: hidden;
   }


   .android .mobile-splash video {
      width: 100vw;
      height: 100vh;
      object-fit: cover;
      overflow: hidden;

   }





   .android .mobile-home-screen {
      position: relative;
      top: 0;
      left: 0;

      z-index: 10;
      /* Higher than the video splash screen */
      opacity: 0;
      /* Start hidden if you want to fade it in */
      transition: opacity 0.5s ease-in-out;


      width: 100vw;
      height: 100vh;
      overflow: hidden;
      background-image: url(images/mobile-view-img/mobile-home.png);
      background-repeat: no-repeat;
	   background-size: 100% 100%;
      /*--background-size: cover;*/
      background-position: center;
      object-fit: cover;

      background-attachment: fixed;



   }

   .android .mobile-tele {
      position: absolute;
      width: 40%;
      bottom: 15%;
      left: 0;
   }


   .android .mobile-sock {
      position: absolute;
      width: 25%;
      height: auto;
      top: 19.7%;
      right: 6%;
   }

   .android .mobile-sticky-1 {
      position: absolute;
      width: 18%;
      height: auto;
      top: 40%;
      left: 40%;
   }

   .android .mobile-coming-soon {
      width: 100vw;

      height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: white;
      overflow: hidden;
   }

   .android .mobile-coming-soon h2 {
      color: red;
      text-align: center;
      font-size: 25px;
      cursor: pointer;
      font-family: madhuban;

   }

   .android .mobile-coming-soon h2 .goback {
      color: red;
      text-align: center;
      font-size: 15px;
      cursor: pointer;
      font-family: madhuban;
      font-weight: 400;
   }

   .android .mobile-coming-soon .arrow-icon {
      color: red;
      font-size: 15px;
   }

   .android #mobile-magazine-popup {
      width: 100%;
      height: 100vh;
      position: fixed;
      top: 0;
      /* Stay at the top */
      left: 100%;
      /* Start off-screen to the right */
      transition: left 0.8s ease;
      /* Animate the 'right' property */
      z-index: 10;
      /* Ensure it's above other content */
   }

   .android #mobile-magazine-popup img {
      width: 100%;
      height: 94vh;
      /* Maintain aspect ratio */
   }

   .android #mobile-mag-cross {
      position: absolute;
      top: 36px;
      right: 39px;
      width: 5.5%;
   }

   .android #mobile-mag-cross img {
      width: 100%;
      height: auto;
   }

   .android #Mob-applemusic {
      position: absolute;
      top: 57%;
      left: 12%;
      width: 90px;
      height: auto;
   }

   .android #Mob-applemusic img {
      width: 100%;
      height: auto;
   }

   .android #Mob-YTmusic {
      position: absolute;
      top: 62%;
      left: 12%;
      width: 90px;
      height: auto;
   }

   .android #Mob-YTmusic img {
      width: 100%;
      height: auto;
   }

   .android #Mob-spotify {
      position: absolute;
      top: 67.5%;
      left: 12%;
      width: 95px;
      height: auto;
   }

   .android #Mob-spotify img {
      width: 100%;
      height: auto;
   }

   .android #Mob-amazonmusic {
      position: absolute;
      top: 73%;
      left: 12%;
      width: 95px;
      height: auto;
   }

   .android #Mob-amazonmusic img {
      width: 100%;
      height: auto;
   }

   .android #Mob-insta {
      position: absolute;
      top: 58%;
      left: 47%;
      width: 140px;
      height: auto;
   }

   .android #Mob-insta img {
      width: 100%;
      height: auto;
   }

   .android #Mob-threads {
      position: absolute;
      top: 64%;
      left: 47%;
      width: 140px;
      height: auto;
   }

   .android #Mob-threads img {
      width: 100%;
      height: auto;
   }



   .android #Mob-yt {
      position: absolute;
      top: 71%;
      left: 49%;
      width: 150px;
      height: auto;
   }

   .android #Mob-yt img {
      width: 100%;
      height: auto;
   }



   .android #Mob-disc {
      position: absolute;
      bottom: 13%;
      left: 12%;
      width: 140px;
      height: auto;
   }

   .android #Mob-disc img {
      width: 100%;
      height: auto;
   }

   .android .mobile-desktop {
      background-image: url(images/mobile-view-img/mobile-tv-bg.png);
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      overflow: hidden;
   }

   .android .mob-screen-img {
      position: relative;
      top: 0;
      left: 0;
      width: 100vw;
      height: 94vh;
      overflow: hidden;
   }

   .android .mob-screen-img .mob-tv-window {
      position: relative;
      width: 100%;
      height: 100%;
   }

   .android .mob-demo-folder {
      position: absolute;
      top: 175px;
      left: 40px;
      width: 90px;
      height: auto;
   }


   .android .mob-demo-folder img {

      width: 100%;
      height: auto;
      cursor: pointer;
   }

   .android .mob-power-off {
      position: absolute;
      bottom: 50px;
      right: 35px;
      width: 65px;
      height: auto;
   }

   .android .mob-power-off img {
      width: 100%;
      height: auto;
      cursor: pointer;
   }

   .android .mob-demo-folder-container {
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
   }

   .android .mob-demos-popup1 {
      width: 90%;
      /* Adjust based on your design */
      height: auto;
      /* Adjust based on your design */
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%) scale(0);
      /* Initially scale down and center */
      transition: transform 0.5s ease;
      /* Smooth transition */
      z-index: 20;
      /* Ensure it's above other elements */
      display: flex;
      justify-content: center;
      align-items: center;
   }

   .android .mob-demos-popup1 img {
      width: 100%;
      height: auto;
   }

   .android .mob-demos-popup1.active {
      transform: translate(-50%, -50%) scale(1);
      /* Scale up to original size */
   }

   .android #mob-demos-close {
      position: absolute;
      top: 1.7%;
      right: 3.6%;
   }

   .android #mob-demos-close img {
      width: 38px;
      height: auto;
   }

   #mob-demo1 {
      position: absolute;
      top: 15%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo2 {
      position: absolute;
      top: 15%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   #mob-demo3 {
      position: absolute;
      top: 31.5%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo4 {
      position: absolute;
      top: 31.5%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   #mob-demo5 {
      position: absolute;
      top: 47.5%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo6 {
      position: absolute;
      top: 47.5%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   #mob-demo7 {
      position: absolute;
      top: 62.5%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo8 {
      position: absolute;
      top: 62.5%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   #mob-demo9 {
      position: absolute;
      top: 77.5%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo10 {
      position: absolute;
      top: 77.5%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   .home-screen {
      display: none;
   }

   .ios .mobile-home-screen {
      display: block;
   }

   .splash-screen {
      display: none;
   }

   .ios .mobile-splash {
      display: block;
   }

   .ios #mobile-video-splash {
      transition: opacity 0.5s ease-in-out;
      /* Adjust time as needed */
      opacity: 1;
      /* Start fully visible */
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      z-index: 1000;
      /* Ensure it's above other content */
      overflow: hidden;

   }

   /* Hidden state (after fade-out) */
   .hidden {
      opacity: 0;
      visibility: hidden;
   }


   .ios .mobile-splash video {
      width: 100vw;
      height: 100vh;
      object-fit: cover;
      overflow: hidden;

   }





   .ios .mobile-home-screen {
      position: relative;
      top: 0;
      left: 0;

      z-index: 10;
      /* Higher than the video splash screen */
      opacity: 0;
      /* Start hidden if you want to fade it in */
      transition: opacity 0.5s ease-in-out;


      width: 100vw;
      height: 90vh;
      overflow: hidden;
      background-image: url(images/mobile-view-img/mobile-home.png);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      object-fit: cover;

      background-attachment: fixed;



   }

   .ios .mobile-tele {
      position: absolute;
      width: 40%;
      bottom: 8%;
      left: 0;
   }


   .ios .mobile-sock {
      position: absolute;
      width: 25%;
      height: auto;
      top: 20.8%;
      right: 6%;
   }

   .ios .mobile-sticky-1 {
      position: absolute;
      width: 18%;
      height: auto;
      top: 43%;
      left: 40%;
   }

   .ios .mobile-coming-soon {
      width: 100%;

      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: white;
      overflow: hidden;
   }

   .ios .mobile-coming-soon h2 {
      color: red;
      text-align: center;
      font-size: 25px;
      cursor: pointer;
      font-family: madhuban;

   }

   .ios .mobile-coming-soon h2 .goback {
      color: red;
      text-align: center;
      font-size: 15px;
      cursor: pointer;
      font-family: madhuban;
      font-weight: 400;
   }

   .ios .mobile-coming-soon .arrow-icon {
      color: red;
      font-size: 15px;
   }

   .ios #mobile-magazine-popup {
      width: 100%;
      height: 100vh;
      position: fixed;
      top: 0;
      /* Stay at the top */
      left: 100%;
      /* Start off-screen to the right */
      transition: left 0.8s ease;
      /* Animate the 'right' property */
      z-index: 10;
      /* Ensure it's above other content */
   }

   .ios #mobile-magazine-popup img {
      width: 100%;
      height: 90vh;
      /* Maintain aspect ratio */
   }

   .ios #mobile-mag-cross {
      position: absolute;
      top: 30px;
      right: 36px;
      width: 5.5%;
   }

   .ios #mobile-mag-cross img {
      width: 100%;
      height: auto;
   }

   .ios #Mob-applemusic {
      position: absolute;
      top: 54%;
      left: 12%;
      width: 85px;
      height: auto;
   }

   .ios #Mob-applemusic img {
      width: 100%;
      height: auto;
   }

   .ios #Mob-YTmusic {
      position: absolute;
      top: 59%;
      left: 12%;
      width: 85px;
      height: auto;
   }

   .ios #Mob-YTmusic img {
      width: 100%;
      height: auto;
   }

   .ios #Mob-spotify {
      position: absolute;
      top: 64.3%;
      left: 12%;
      width: 85px;
      height: auto;
   }

   .ios #Mob-spotify img {
      width: 100%;
      height: auto;
   }

   .ios #Mob-amazonmusic {
      position: absolute;
      top: 69.5%;
      left: 12%;
      width: 85px;
      height: auto;
   }

   .ios #Mob-amazonmusic img {
      width: 100%;
      height: auto;
   }

   .ios #Mob-insta {
      position: absolute;
      top: 55%;
      left: 47%;
      width: 140px;
      height: auto;
   }

   .ios #Mob-insta img {
      width: 100%;
      height: auto;
   }

   .ios #Mob-threads {
      position: absolute;
      top: 61%;
      left: 47%;
      width: 140px;
      height: auto;
   }

   .ios #Mob-threads img {
      width: 100%;
      height: auto;
   }



   .ios #Mob-yt {
      position: absolute;
      top: 68%;
      left: 49%;
      width: 150px;
      height: auto;
   }

   .ios #Mob-yt img {
      width: 100%;
      height: auto;
   }



   .ios #Mob-disc {
      position: absolute;
      bottom: 16%;
      left: 12%;
      width: 130px;
      height: auto;
   }

   .ios #Mob-disc img {
      width: 100%;
      height: auto;
   }

   .ios .mobile-desktop {
      background-image: url(images/mobile-view-img/mobile-tv-bg.png);
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      overflow: hidden;
   }

   .ios .mob-screen-img {
      position: relative;
      top: 0;
      left: 0;
      width: 100vw;
      height: 86.5vh;
      overflow: hidden;
   }

   .ios .mob-screen-img .mob-tv-window {
      position: relative;
      width: 100%;
      height: 100%;
   }

   .ios .mob-demo-folder {
      position: absolute;
      top: 145px;
      left: 35px;
      width: 80px;
      height: auto;
   }


   .ios .mob-demo-folder img {

      width: 100%;
      height: auto;
      cursor: pointer;
   }

   .ios .mob-power-off {
      position: absolute;
      bottom: 50px;
      right: 40px;
      width: 65px;
      height: auto;
   }

   .ios .mob-power-off img {
      width: 100%;
      height: auto;
      cursor: pointer;
   }

   .ios .mob-demo-folder-container {
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
   }

   .ios .mob-demos-popup1 {
      width: 85%;
      /* Adjust based on your design */
      height: auto;
      /* Adjust based on your design */
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%) scale(0);
      /* Initially scale down and center */
      transition: transform 0.5s ease;
      /* Smooth transition */
      z-index: 20;
      /* Ensure it's above other elements */
      display: flex;
      justify-content: center;
      align-items: center;
   }

   .ios .mob-demos-popup1 img {
      width: 100%;
      height: auto;
   }

   .ios .mob-demos-popup1.active {
      transform: translate(-50%, -50%) scale(1);
      /* Scale up to original size */
   }
   .ios #mob-demos-close {   

      
      position: absolute;
      top: 1.7%;
      right: 3.6%;
   }

   .ios #mob-demos-close img {
      width: 33px;
      height: auto;
   }
}

@media screen and (max-width:360px) {



   body {
      padding: 0;
      margin: 0;
      background-color: black;
      box-sizing: border-box;
      overflow: hidden;

   }

   .home-screen{
      display: none;
   }

   .android .mobile-home-screen {
      display: block;
   }

   .splash-screen {
      display: none;
   }

   .android .mobile-splash {
      display: block;
      overflow: hidden;
      
   }

   .android #mobile-video-splash {
      transition: opacity 0.5s ease-in-out;
      /* Adjust time as needed */
      opacity: 1;
      /* Start fully visible */
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      z-index: 1000;
      /* Ensure it's above other content */
      overflow: hidden;

   }

   /* Hidden state (after fade-out) */
   .hidden {
      opacity: 0;
      visibility: hidden;
   }


   .android .mobile-splash video {
      width: 100vw;
      height: 100vh;
      object-fit: cover;
      overflow: hidden;

   }





   .android .mobile-home-screen {
      position: relative;
      top: 0;
      left: 0;

      z-index: 10;
      /* Higher than the video splash screen */
      opacity: 0;
      /* Start hidden if you want to fade it in */
      transition: opacity 0.5s ease-in-out;


      width: 100vw;
      height: 100vh;
      overflow: hidden;
      background-image: url(images/mobile-view-img/mobile-home.png);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      object-fit: cover;

      background-attachment: fixed;



   }

   .android .mobile-tele {
      position: absolute;
      width: 40%;
      bottom: 15%;
      left: 0;
   }


   .android .mobile-sock {
      position: absolute;
      width: 25%;
      height: auto;
      top: 19.7%;
      right: 6%;
   }

   .android .mobile-sticky-1 {
      position: absolute;
      width: 18%;
      height: auto;
      top: 40%;
      left: 40%;
   }

   .android .mobile-coming-soon {
      width: 100vw;

      height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: white;
      overflow: hidden;
   }

   .android .mobile-coming-soon h2 {
      color: red;
      text-align: center;
      font-size: 25px;
      cursor: pointer;
      font-family: madhuban;

   }

   .android .mobile-coming-soon h2 .goback {
      color: red;
      text-align: center;
      font-size: 15px;
      cursor: pointer;
      font-family: madhuban;
      font-weight: 400;
   }

   .android .mobile-coming-soon .arrow-icon {
      color: red;
      font-size: 15px;
   }

   .android #mobile-magazine-popup {
      width: 100%;
      height: 100vh;
      position: fixed;
      top: 0;
      /* Stay at the top */
      left: 100%;
      /* Start off-screen to the right */
      transition: left 0.8s ease;
      /* Animate the 'right' property */
      z-index: 10;
      /* Ensure it's above other content */
   }

   .android #mobile-magazine-popup img {
      width: 100%;
      height: 95vh;
      /* Maintain aspect ratio */
   }

   .android #mobile-mag-cross {
      position: absolute;
      top: 30px;
      right: 33px;
      width: 5.5%;
   }

   .android #mobile-mag-cross img {
      width: 100%;
      height: auto;
   }

   .android #Mob-applemusic {
      position: absolute;
      top: 57%;
      left: 12%;
      width: 85px;
      height: auto;
   }

   .android #Mob-applemusic img {
      width: 100%;
      height: auto;
   }

   .android #Mob-YTmusic {
      position: absolute;
      top: 62.5%;
      left: 12%;
      width: 85px;
      height: auto;
   }

   .android #Mob-YTmusic img {
      width: 100%;
      height: auto;
   }

   .android #Mob-spotify {
      position: absolute;
      top: 68.5%;
      left: 12%;
      width: 85px;
      height: auto;
   }

   .android #Mob-spotify img {
      width: 100%;
      height: auto;
   }

   .android #Mob-amazonmusic {
      position: absolute;
      top: 74%;
      left: 12%;
      width: 85px;
      height: auto;
   }

   .android #Mob-amazonmusic img {
      width: 100%;
      height: auto;
   }

   .android #Mob-insta {
      position: absolute;
      top: 58%;
      left: 47%;
      width: 140px;
      height: auto;
   }

   .android #Mob-insta img {
      width: 100%;
      height: auto;
   }

   .android #Mob-threads {
      position: absolute;
      top: 64%;
      left: 47%;
      width: 140px;
      height: auto;
   }

   .android #Mob-threads img {
      width: 100%;
      height: auto;
   }



   .android #Mob-yt {
      position: absolute;
      top: 71%;
      left: 49%;
      width: 150px;
      height: auto;
   }

   .android #Mob-yt img {
      width: 100%;
      height: auto;
   }



   .android #Mob-disc {
      position: absolute;
      bottom: 11.5%;
      left: 12%;
      width: 130px;
      height: auto;
   }

   .android #Mob-disc img {
      width: 100%;
      height: auto;
   }

   .android .mobile-desktop {
      background-image: url(images/mobile-view-img/mobile-tv-bg.png);
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      overflow: hidden;
   }

   .android .mob-screen-img {
      position: relative;
      top: 0;
      left: 0;
      width: 100vw;
      height: 92.5vh;
      overflow: hidden;
   }

   .android .mob-screen-img .mob-tv-window {
      position: relative;
      width: 100%;
      height: 100%;
   }

   .android .mob-demo-folder {
      position: absolute;
      top: 145px;
      left: 35px;
      width: 75px;
      height: auto;
   }


   .android .mob-demo-folder img {

      width: 100%;
      height: auto;
      cursor: pointer;
   }

   .android .mob-power-off {
      position: absolute;
      bottom: 50px;
      right: 35px;
      width: 65px;
      height: auto;
   }

   .android .mob-power-off img {
      width: 100%;
      height: auto;
      cursor: pointer;
   }

   .android .mob-demo-folder-container {
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
   }

   .android .mob-demos-popup1 {
      width: 90%;
      /* Adjust based on your design */
      height: auto;
      /* Adjust based on your design */
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%) scale(0);
      /* Initially scale down and center */
      transition: transform 0.5s ease;
      /* Smooth transition */
      z-index: 20;
      /* Ensure it's above other elements */
      display: flex;
      justify-content: center;
      align-items: center;
   }

   .android .mob-demos-popup1 img {
      width: 100%;
      height: auto;
   }

   .android .mob-demos-popup1.active {
      transform: translate(-50%, -50%) scale(1);
      /* Scale up to original size */
   }

   #mob-demos-close {
      position: absolute;
      top: 1.7%;
      right: 3.6%;
   }

   #mob-demos-close img {
      width: 32px;
      height: auto;
   }

   #mob-demo1 {
      position: absolute;
      top: 15%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo2 {
      position: absolute;
      top: 15%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   #mob-demo3 {
      position: absolute;
      top: 31.5%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo4 {
      position: absolute;
      top: 31.5%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   #mob-demo5 {
      position: absolute;
      top: 47.5%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo6 {
      position: absolute;
      top: 47.5%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   #mob-demo7 {
      position: absolute;
      top: 62.5%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo8 {
      position: absolute;
      top: 62.5%;
      left: 70%;
      width: 18%;
      height: auto;
   }

   #mob-demo9 {
      position: absolute;
      top: 77.5%;
      left: 40%;
      width: 18%;
      height: auto;
   }

   #mob-demo10 {
      position: absolute;
      top: 77.5%;
      left: 70%;
      width: 18%;
      height: auto;
   }
}