body {
  background-color: #ebf8fe;
  color: #f54242;
  overflow: hidden;
  cursor: default;
}
.red-square {
  position: absolute;
  width: 1dvmin;
  height: 1dvmin;
  border: 2px solid #ebf8fe;
}
.white-square {
  position: absolute;
  width: 1dvmin;
  height: 1dvmin;
  border: 2px solid #f54242;
}
.top {
  top: 1dvmin;
}
.left {
  left: 1dvmin;
}
.bottom {
  bottom: 1dvmin;
}
.right {
  right: 1dvmin;
}
.righth {
  right: 0;
}
.lefth {
  left: 0;
}
.title {
  position: relative;
  font-family: "Stormfaze";
  font-size: 5.5dvw;
  text-transform: uppercase;
  width: 100%;
  text-align: center;
  line-height: 1;
}
.title div {
  display: flex;
  height: 8.7dvh;
  place-items: center;
  justify-content: center;
}
.redhalf {
  background-color: #f54242;
  color: #ebf8fe;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 50%;
  display: flex;
  place-items: center;
  flex-direction: column;
  line-height: 1;
  z-index: 2;
}
.whitehalf {
  background-color: #ebf8fe;
  color: #f54242;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 50%;
  display: flex;
  place-items: center;
  line-height: 1;
}
a {
  color: #180606;
  text-decoration: none;
  font-size: 5dvw;
}
a:hover {
  color: #f54242;
}
.change {
  display: inline-flexbox;
  position: relative;
  height: calc(46dvh - 2.6dvw);
  width: calc(100% - 4dvh);
  font-family: "Verdana";
  font-weight: bold;
  text-transform: uppercase;
  font-size: 1.2dvmin;
  text-align: left;
}
.end {
  place-items: center start;
}
.start {
  place-items: center end;
}
.spacer {
  height: 4dvh;
}
.bound {
  color: #f54242;
  background-color: #ebf8fe;
}