html {
  height: 100vh;
}
body {
  background-attachment: fixed;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 100vh;
}

.home-panel {
  display: inline-block;
  width: 90%;
  max-width: 320px;
}



body.theme-graduation { background-image: url(/wallpaper/480/bg-graduation); }
body.theme-wedding { background-image: url(/wallpaper/480/bg-wedding); }
body.theme-birthday { background-image: url(/wallpaper/480/bg-birthday); }
body.theme-anniversary { background-image: url(/wallpaper/480/bg-anniversary); }

@media screen and (max-height: 480px) {
  body.regular { background-image: url(/wallpaper/480/wallpaper-watercolor-4k-50); }
  body.manage { background-image: url(/wallpaper/480/wallpaper-manage-4k); }
}

@media screen and (min-height: 481px) and (max-height: 720px) {
  body.regular { background-image: url(/wallpaper/720/wallpaper-watercolor-4k-50); }
  body.manage { background-image: url(/wallpaper/720/wallpaper-manage-4k); }
}

@media screen and (min-height: 721px) and (max-height: 1080px) {
  body.regular { background-image: url(/wallpaper/1080/wallpaper-watercolor-4k-50); }
  body.manage { background-image: url(/wallpaper/1080/wallpaper-manage-4k); }
}

@media screen and (min-height: 1081px) and (max-height: 1440px) {
  body.regular { background-image: url(/wallpaper/1440/wallpaper-watercolor-4k-50); }
  body.manage { background-image: url(/wallpaper/1440/wallpaper-manage-4k); }
}

@media screen and (min-height: 1441px) {
  body.regular { background-image: url(/wallpaper/1800/wallpaper-watercolor-4k-50); }
  body.manage { background-image: url(/wallpaper/1800/wallpaper-manage-4k); }
}
