* {
  padding: 0;
  margin: 0;
}
html{ width: 100%; height: 100%; }
body {
  overflow: hidden;
  color: #333;
  font-family: 'Helvetica', 'Verdana', sans-serif;
  height: 100%;
  width: 100%;
}
h1 {
  font-family: 'Pacifico', cursive;
  font-size: 12em;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
}
ul {
  list-style: none;
  text-align: center;
}
ul#nav {
  position: absolute;
  top: 20px;
  width: 100%;
}
#nav li {
  display: inline-block;
  margin: 0 1%;
}
a {
  color: #f21e8c;
  text-decoration: none;
  font-size: 1em;
}

a:hover {
  color: #333;
}
.trans {
  -webkit-transition: all 0.5s ease-out;
  /* Chrome 1-25, Safari 3.2+ */

  -moz-transition: all 0.5s ease-out;
  /* Firefox 4-15 */

  -o-transition: all 0.5s ease-out;
  /* Opera 10.50–12.00 */

  transition: all 0.5s ease-out;
  /* Chrome 26, Firefox 16+, IE 10+, Opera 12.50+ */
}
.no-select {
  -webkit-user-select: none;
  /* Chrome/Safari */
  -moz-user-select: none;
  /* Firefox */

  -ms-user-select: none;
  /* IE10+ */

  -o-user-select: none;
  user-select: none;
  cursor: default;
}
@media only screen and (max-width: 767px) {
  h1 {
    font-size: 7em;
  }
  h2 {
    font-size: 1em;
  }
}
@media only screen and (max-width: 480px) {
  h1 {
    font-size: 5em;
  }
  h2 {
    font-size: .8em;
  }
  a {
    font-size: .75em;
  }
}