/* By default, the warning is hidden */
#rotate-warning {
  display: none;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  position: fixed;
  top:0; left:0; width:100%; height:100%;
  backdrop-filter: blur(35px);
  color: black;
  font-size: 20px;
  text-align: center;
  padding-top: 20vh;
  border: 0.5px solid black;
  border-radius: 25px;
  z-index: 9999;
  background-color: rgba(255, 255, 255, 0.8);
  font-weight: 400;
  font-size: 1.5rem;
  font-style: italic;
  
}

/* Show warning only when in portrait on small screens */
@media (max-width: 768px) and (orientation: portrait) {
  #rotate-warning {
    display: block;
  }
  #main-content {
    display: none;
  }
}