html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

html {
  font-size: 10px;
  background: #ffc600;
  background-image: linear-gradient(109.6deg, rgba(228, 107, 232, 1) 11.2%, rgba(87, 27, 226, 1) 96.7%);
  background-attachment: fixed;
}

.photobooth {
  background-image: linear-gradient(109.6deg, rgba(228, 107, 232, 1) 11.2%, rgba(87, 27, 226, 1) 96.7%);
  max-width: 150rem;
  margin: 2rem auto;
}

/*clearfix*/
.photobooth::after {
  content: "";
  display: block;
  clear: both;
}

.photo {
  width: 100%;
  float: left;
  border: 5px solid rgb(0, 255, 47);
  border-radius: 10px;
}

.player {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 200px;
  border-radius: 20px;
}

/*
  Strip!
*/
.strip {
  padding: 2rem;
}

.strip img {
  width: 100px;
  overflow-x: scroll;
  padding: 0.8rem 0.8rem 2.5rem 0.8rem;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  background: white;
}

.rgb {
  text-align: center;
}

.controls {
  padding: 20px;
}

button {
  border: 5px solid #bdb1b1;
  outline: 0;
  width: 45px;
  height: 45px;
  background: #1e1d1d;
  color: #000;
  cursor: pointer;
  border-radius: 50%;
  text-align: center;
  position: absolute;
  left: 230px;
  bottom: 107px;
}

button:active {
  background: #e81212bf;
}

canvas {
  margin: 15px;
  max-width: 500px;
}
a {
  font-size: 15px;
  text-decoration: none;
}

/* info: HIJIBIJI HIJIBIJI */
.strip a:nth-child(5n + 1) img {
  transform: rotate(10deg);
}
.strip a:nth-child(5n + 2) img {
  transform: rotate(-2deg);
}
.strip a:nth-child(5n + 3) img {
  transform: rotate(8deg);
}
.strip a:nth-child(5n + 4) img {
  transform: rotate(-11deg);
}
.strip a:nth-child(5n + 5) img {
  transform: rotate(12deg);
}