* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: "Times New Roman", Times, serif;
  background: rgb(228, 228, 228);
}

h1,
h2,
h3,
p {
  margin: 0;
}

img {
  max-width: 100%;
  display: block;
}

.container {
  width: 80%;
  margin: 0 auto;
}

.header-title {
  font-size: 4em;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}

.section-title {
  font-size: 2em;
  font-weight: bold;
  text-transform: uppercase;
  padding-top: 1em;
}

.section-paragraph {
  font-size: 1.5em;
  padding-top: 1em;
}

.gpu-canvas {
  width: 100%;
  position: relative;
}

.split {
  display: flex;
  flex-wrap: wrap;
}

.spoiler {
  cursor: pointer;
  position: relative;
  width: 33%;
}

.spoiler-text {
  color: white;
  font-size: 1.8em;
  text-align: center;

  position: absolute;
  top: 50%;
  left: 50%;

  transform: translate(-50%, -50%);
}

.spoiler:hover .spoiler-text {
  display: none;
}

.war-crimes {
  filter: brightness(0%);
  transition-duration: 2s;
}
.war-crimes:hover {
  filter: brightness(100%);
}