
/*html, body {
  height: 100%;
  width: 100%;
  margin: 0;
}*/

html {
  image-rendering: pixelated;
  height: 100%;
  background-image:
    url('city2.png'),
    url('city1.png'),
    url('geyser.gif'),
    linear-gradient(to bottom, #1A4F89 150px, #000000 150px);
  background-attachment: fixed;
  background-repeat:
    repeat-x,
    repeat-x,
    no-repeat,
    repeat;
  background-size: 640px 238px, 640px 238px, 180px 192px, auto;
  background-position:
    left 0px top 64px,
    left 0px top 64px,
    left 50% top 0px,
    left 0px top 0px;
  animation: back 50s infinite linear;
}

@keyframes back {
  0% {
    background-position:
      left 0px top 64px,
      left 0px top 64px,
      left 50% top 0px,
      left 0px top 0px;
  }
  100% {
    background-position:
      left calc(-640px*2) top 64px,
      left -640px top 64px,
      left 50% top 0px,
      left 0px top 0px;
  }
}

.main {
    /*background: #222;
    padding-top: 20px;
	padding-bottom: 20px;*/
	/*background-image: url(bg.png);
	background-size: 100%;
	image-rendering: -moz-crisp-edges;
	
	background-color: #131956;*/
	max-width: 960px;
	/*margin: auto;*/
  margin: 32px auto;
  /*margin-top: 32px;
  margin-bottom: 32px;*/
  /*width: 50%;
  margin: 8px auto;*/
  /*line-height: 1.6;*/
  color: #FFFFFF;
}

.box {
	border-style: solid;
	border-image-source: url(deltarune_box.png);
	border-image-repeat: stretch;
	border-image-slice: 26;
	background-color: black;
	background-clip: padding-box;
	background-origin: padding-box;
	
	border-image-width: 26px;
	border-width: 13px;
}
