@font-face {
  font-family: "Comic Sans";
  src: url("comicSans.ttf")
}

.hidden {
  display: none !important;
}

#preloadCS {
  font-family: "Comic Sans";
  font-size: 0px;
}
*{
  font-family: "Comic Sans";
  color-scheme: dark;
}
#win{
  background-color: black;
  color:white;
}
html {
  height: 100%;
  width: 100%;
  background-color: #181a1b;
  display: flex;
  align-items: center;
  justify-content: center;
  /* background: url("bwomp.jfif"); */
  /* background-repeat: no-repeat; */
  object-fit: cover;
  /* background-size: 110%; */
  /* background-position: -30px; */
  /* background-position-y: -100px;*/
}

input[type="text"] {
  width: 50px;
  height: 50px;
  color: white;
}

#keyboard {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#game {
  display: flex;
  flex-direction: column;
  text-transform: uppercase;
}

#game>div {
  display: flex;
  height: 50px;
  flex-direction: row;
}

#game>div>div {
  height: 50px;
  width: 50px;
}

body {
  display: flex;
  flex-direction: column;
}

#text {
  font-family: "Comic Sans";
  /*We use a custom Comic Sans because Apple doesn't automaticaly have Comic Sans installed on iPhones. Why?*/
  background-color: white;
  color: black;
  display: flex;
  justify-content: center;
  border: 5px solid red;
  object-fit: contain;
  background-size: 50%;
  width: fit-content;
  align-self: center;
}

#self-ad {
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: white;
  border: 1px solid red;
  border-radius: 5px;
  width: 10%;
  height: 5%;
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
}
div>a{
  text-decoration: none;
  color: black;
}
button{
  height: 50px;
}
#bkspText{
  display: block;
  transform: matrix(-1, 0, 0, 1, 0, 0);
  -moz-transform: matrix(-1, 0, 0, 1, 0, 0);
  -webkit-transform: matrix(-1, 0, 0, 1, 0, 0);
  -o-transform: matrix(-1, 0, 0, 1, 0, 0);
}
.gray{
  background-color: #3a3a3c !important;
}