body {
   background-color: #15181f;
}

img {
  image-rendering: pixelated;
  image-rendering: -moz-crisp-edges;
  image-rendering: crisp-edges;
  
  width: 24px;
  height: 24px;
  position: fixed;
  left: 0px;
  top: 0px;

  transition: transform 0.2s ease-out;
  outline: 1px solid transparent;

  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */

    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

#game {
	background-color: #080808;
	width: calc(22 * 24px);
	height: calc(16 * 24px);
	margin-left: auto;
	margin-right: auto;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
	position: absolute;
}

#bg {
  width: calc(22 * 24px);
  height: calc(16 * 24px);
  position: fixed;
  left: 0px;
  top: 0px;
}

#end {
  width: calc(22 * 24px);
  height: calc(16 * 24px);
  position: fixed;
  left: 0px;
  top: 0px;
  background-color: #080808;
  visibility: hidden;
}

#birthday {
  width: calc(22 * 24px);
  height: calc(16 * 24px);
  top: -40px;
}

#credits-button {
  width: calc(22 * 24px);
  height: calc(16 * 24px);
  visibility: hidden;
}

#credits1 {
  width: calc(22 * 24px);
  height: calc(16 * 24px);
  position: fixed;
  left: 0px;
  top: 0px;
  background-color: #080808;
  visibility: hidden;
}

#credits2 {
  width: calc(22 * 24px);
  height: calc(16 * 24px);
  position: fixed;
  left: 0px;
  top: 0px;
  background-color: #080808;
  visibility: hidden;
}

#credits3 {
  width: calc(22 * 24px);
  height: calc(16 * 24px);
  position: fixed;
  left: 0px;
  top: 0px;
  background-color: #080808;
  visibility: hidden;
}

.credits-caption {
  width: calc(22 * 24px);
  height: calc(16 * 24px);
}

.credits1-photo {
  width: calc(3024px * 0.065);
  height: calc(4032px * 0.065);
  left: 270px;
  top: 60px;
  transform: rotateZ(3deg);
}

.credits2-photo {
  width: calc(3024px * 0.065);
  height: calc(4032px * 0.065);
  left: 20px;
  top: 100px;
  transform: rotateZ(-4deg);
}

.credits3-photo {
  width: calc(4032px * 0.07);
  height: calc(3024px * 0.07);
  left: 120px;
  top: 50px;
  transform: rotateZ(-2deg);
}

#credits1-photo2 {
  visibility: hidden;
}

#credits2-photo2 {
  visibility: hidden;
}

#credits3-photo2 {
  visibility: hidden;
}

.next {
  width: 64px;
  height: 32px;
  position: fixed;
  left: 456px;
  top: 344px;
}