* {
  margin: 0;
  padding: 0;
}

body {
  width: 100vw;
  height: 100vh;
  overflow: scroll;
  background-image: url('/static/background.png');
  background-size: 100% auto;
  background-position: bottom;
  background-repeat: no-repeat;
}

div.container {
  position: absolute;
  width: 100vw;
  top: 0;
  bottom: 0;
  overflow: hidden;
}

div.container div div {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100vw;
  background-size: 100% auto;
  background-position: bottom;
  background-repeat: no-repeat;
}

div.scroll_view {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1000vw;
}

div.container div div.odd {
  margin-bottom: 35vw;
  background-image: url('/static/1.png');
}

div.container div div.even {
  margin-top: 25vw;
  background-image: url('/static/2.png');
}

div.screen_0 {
  left: 0;
}

div.screen_1 {
  left: 100vw;
}

div.screen_2 {
  left: 200vw;
}

div.screen_3 {
  left: 300vw;
}

div.screen_4 {
  left: 400vw;
}

div.screen_5 {
  left: 500vw;
}

div.screen_6 {
  left: 600vw;
}

div.screen_7 {
  left: 700vw;
}

div.screen_8 {
  left: 800vw;
}

div.screen_9 {
  left: 900vw;
}

.smooth {
  transition: transform .2s ease-out;
}

div.display {
  top: 97vh;
  left: 2vw;
  width: 100vw;
  height: 3vh;
  position: fixed;
  opacity: 0.2;
}

div.form {
  margin: auto;
  padding-top: 10vw;
  text-align: center;
  color: white;
}

div.form input,
div.form button {
  padding: 2vw;
}
