*
{
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

html,
body
{
  height: 100%;

  cursor: default;
}

body
{
  font-family: Dosis, sans-serif;
  font-size: 10px;

  display: flex;
  overflow: hidden;

  margin: 0;

  color: #fff;
  background: -webkit-radial-gradient(center, #465363, #272d3a);
  background:    -moz-radial-gradient(center, #465363, #272d3a);
  background:     -ms-radial-gradient(center, #465363, #272d3a);
  background:      -o-radial-gradient(center, #465363, #272d3a);
  background:         radial-gradient(center, #465363, #272d3a);

  align-items: center;
  justify-content: center;
}

#particles canvas
{
  position: absolute;

  width: 100%;
  height: 100%;
  left: 0;
  top: 0;

  z-index: -1;
}

.brand
{
  font-size: 7em;
  font-weight: 700;

  width: 370px;

  transition: all 350ms ease;
  transform: rotate(-5deg);
  text-align: center;
  word-spacing: 5px;
  pointer-events: none;

  text-shadow: 0 1px 1px #ccc,
               0 2px 1px #cacaca,
               0 3px 1px #bbb,
               0 4px 1px #bababa,
               0 5px 1px #aaa;

  filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, .75));
}

footer
{
  position: absolute;
  bottom: 1em;
  left: 0;

  width: 100%;

  text-align: center;
  letter-spacing: 1px;

  color: #717882;
}

@media only screen and (max-width: 480px)
{
  .brand
  {
    font-size: 4em;

    width: 263px;

    text-shadow: 0 1px 1px #bbb,
                 0 2px 1px #bababa,
                 0 3px 1px #aaa;
  }
}

@media print
{
  *
  {
    color: #000 !important;
  }

  .brand
  {
    filter: invert(1) !important;
  }
}