/* iPhone Xr, iPhone Xs Max, iPhone 11, iPhone 11 Pro Max */

@media only screen and (min-width: 414px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3) {
  
   /* Hidden */
  div.rotate-device {
    display: none !important;
  }
}

/* Landing Page */
div.title h1 {
  top: 490px;
  left: 20px;
  font-size: 50px;
  line-height: 50px;
  letter-spacing: -5px;
}

div.title-high h1 {
  top: 520px;
  left: 170px;
  font-size: 50px;
  letter-spacing: -5px;
}

div.slogan p {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top: 758px;
  font-size: 18px;
}

.arrow {
  width: 100%;
  height: 100%;
  top: 298px;
  left: 288px;
  transform: rotate(-45deg) scale(0.35);
}

/* Thank You Page */
section.thankyou {
  z-index: 6;
  display: flex;
  min-height: 100vh;
  background-color: rgba(15, 11, 51, 1);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
}

div.thankyou-text h2 {
  top: 30px;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  font-size: 90px;
  letter-spacing: 15px;
}

div.trippysmiley .tspng {
  z-index: 6;
  position: absolute;
  display: flex;
  height: 82%;
  width: 82%;
  top: 9%;
  right: 2%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  align-items: center;
  justify-content: center;
}

.designby-text a {
  top: 1270px;
  font-size: 15px;
  letter-spacing: -1px;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  align-items: center;
  justify-content: center;
  object-fit: contain;
}

@media only screen and (max-width: 896px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {

   /* Hidden */
  section.about, section.listen, section.explore, section.contact, section.thankyou, div.episode001-title, div.episode001-slug, div.episode001-tracklist, div.episode001-player, div.episode002-title, div.episode002-slug, div.episode002-tracklist, div.episode002-player, div.episode003-title, div.episode003-slug, div.episode003-tracklist, div.episode003-player {
    display: none !important;
  }
  
  div.rotate-device h1 {
  font-size: 38px;
  }
}  

@media only screen and (min-width: 500px) and (max-width: 896px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {
  
     /* Shown on Mobile but not Desktop */
  div.rotate-device {
    display: block !important;
  }
}