body {
  color: #fff;
  background-color: #222;
  padding: 20px;
  margin: 0;
  font-family: "Helvetica Neue", sans-serif;
  line-height: 1.3;
  font-size: 18px; }

a {
  color: #516CD4; }
  a:visited {
    color: #929292; }
  a:hover {
    color: #E2FEDE; }

h1, h1 a {
  margin-top: 0;
  font-size: 39.6px;
  color: #CD7338; }

h1 {
  margin-bottom: 10px; }

h2 {
  margin-bottom: 15px;
  font-size: 25.2px;
  color: #CD7338; }

pre {
  font-family: "courier new", monospace;
  font-size: 90%;
  background-color: #111;
  color: #eee;
  padding: 5px;
  overflow: auto; }

div.board {
  float: left;
  max-width: 500px;
  width: calc(100vw - 40px);
  margin-right: 20px;
  margin-bottom: 20px; }
  div.board.board-small {
    max-width: 320px; }
  div.board.board-large {
    max-width: 680px; }

.clearfix::after {
  content: "";
  clear: both;
  display: table; }

button {
  padding: 5px 20px;
  font-size: 92%;
  margin-right: 10px;
  margin-bottom: 10px;
  background-color: #999;
  color: black;
  border: none;
  border-radius: 3px;
  cursor: pointer; }
  button:hover {
    background-color: #777; }

input[type=text] {
  font-size: 92%;
  padding: 5px;
  border-radius: 3px;
  border: none; }

li {
  padding: 0.05rem; }

.board-max-width {
  max-width: 640px; }

/*# sourceMappingURL=examples.css.map */