@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css");
@import url("https://fonts.googleapis.com/css?family=Oswald|Trade+Winds|Roboto|Questrial");
@keyframes hell-glow {
  0% {
    color: #ff534b;
    text-shadow: 0px 0px 5px #ff534b;
  }
  100% {
    color: #a34941;
    text-shadow: 0px 0px 8px #993f37;
  }
}
body {
  background: #544;
  font-family: Roboto;
  cursor: default;
}

#container {
  position: absolute;
  left: 0px;
  top: 0px;
}

#heading {
  position: absolute;
  width: 100%;
  left: 0px;
  text-align: center;
  color: #ccc;
  text-shadow: 2px 3px 0px black;
  font-family: Oswald;
}

#bloody-text {
  position: absolute;
  font-family: Trade Winds;
  color: #a34941;
  text-shadow: 2px 3px 0px rgba(0, 0, 0, 0.5);
  width: 100%;
  left: 0px;
  text-align: center;
}

#intro-container {
  width: 100%;
  left: 0px;
  text-align: center;
  position: absolute;
  color: #ccc;
}
#intro-container .intro-icon {
  color: #ad5d4b;
}

.choose-side-btn {
  position: absolute;
  padding: 0;
  border: none;
  background: none;
  outline: none;
  cursor: pointer;
  color: #993f37;
  text-shadow: 0px 0px 8px #993f37;
}

.choose-side-btn:hover {
  color: #c1675f;
  text-shadow: 0px 0px 8px #a34941;
}

#board-container {
  position: absolute;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.board-line {
  stroke: #222;
}

#turn-indicator {
  position: absolute;
  color: #ccc;
  text-shadow: 2px 2px 0px black;
  left: 0px;
}

.board-btn {
  position: absolute;
  border: none;
  background: none;
  cursor: pointer;
  outline: none;
}

.game-icon {
  animation: hell-glow linear 1s;
  position: absolute;
  color: #a34941;
  text-shadow: 0px 0px 8px #993f37;
  text-align: center;
}

#retry-screen {
  position: absolute;
  z-index: 2;
  background: rgba(85, 68, 68, 0.7);
}

#retry-message {
  position: absolute;
  width: 100%;
  left: 0px;
  text-align: center;
  color: #ccc;
  text-shadow: 2px 2px 0px black;
}

#retry-button {
  position: absolute;
  background: none;
  outline: none;
  border: none;
  cursor: pointer;
  color: #b75d55;
  text-shadow: 0px 0px 8px #ad534b;
}

#retry-button:hover {
  color: #cb7169;
  text-shadow: 0px 0px 8px #b75d55;
}

#signature {
  position: absolute;
  width: 100%;
  left: 0px;
  text-align: center;
  font-family: Questrial;
  color: rgba(255, 204, 204, 0.2);
}
