html,
body {
  position: relative;
  margin: 0; }

body {
  font-family: 'Helvetica Neue', sans-serif;
  font-size: 1.4em; }
  body a:visited {
    text-decoration: line-through; }
  body a.off {
    text-decoration: line-through; }

body.rainbow {
  background: linear-gradient(-45deg, #ffffff, #e73c7e, #fccb50, #23d396, #23a6d5, #9353ed, #46edfc);
  background-size: 400% 400%;
  animation: gradient 25s ease infinite; }
  body.rainbow nav p {
    color: white; }
    body.rainbow nav p a {
      color: white; }
      body.rainbow nav p a:hover {
        color: rgba(250, 250, 250, 0.5); }
      body.rainbow nav p a:visited {
        text-decoration: line-through; }

/* ----- */
a {
  color: #00bbff; }

hr {
  border: none;
  background-color: white;
  border-bottom: 2px solid #f1f1f1;
  margin: 0 80px;
  width: 30%;
  display: none; }

p {
  color: black;
  margin: auto 16px;
  box-sizing: border-box; }
  p a {
    text-decoration: none;
    color: black; }
    p a:hover {
      color: rgba(250, 250, 250, 0.5); }

.contact p {
  color: #5d646d;
  color: #7158aa; }
.contact .address {
  color: #46edfc;
  color: #6ae2d8;
  color: #ffffff; }

nav p.p1 {
  animation: type 4s steps(20, end); }
nav p.p2 {
  animation: type 6s steps(20, end); }
nav p.p3 {
  animation: type 4s steps(20, end); }
nav p.dots {
  animation: logo 5s alternate;
  animation-iteration-count: 5;
  width: 15em; }
@keyframes type {
  from {
    width: 0; } }
.flashing {
  animation: nudge 2s linear 1s infinite alternate;
  animation-iteration-count: 3; }

/* ----- */
div.block {
  padding-top: 40px;
  margin: 0 40px 40px 40px;
  text-align: center; }

div.logo {
  text-align: left;
  margin-left: 38px;
  margin-top: 60px;
  text-align: center; }
  div.logo.creative {
    animation: logo 4s cubic-bezier(0.5, 0.2, 0.3, 1) 0s alternate, nudge 4s cubic-bezier(0.1, 0.2, 0.3, 1) 0s infinite alternate;
    animation-iteration-count: 3; }
  div.logo img {
    width: 240px; }

@keyframes logo {
  from {
    width: 0; }
  to {
    width: 20em; } }
@keyframes nudge {
  1%, 100% {
    transform: translate(0, 0);
    opacity: 1;
    transform: scale(1); }
  15% {
    opacity: 0.5;
    transform: scale(0.8); }
  30% {
    opacity: 1; }
  50% {
    transform: translate(150px, 0);
    transform: scale(1); }
  85% {
    transform: translate(300px, 0); }
  90% {
    opacity: 0.15;
    transform: scale(1.3); } }
div.services {
  font-size: 1.4rem;
  line-height: 1.5rem; }
  div.services p {
    margin-bottom: 26px; }

div.end {
  padding: 20px;
  background: #7f8793; }
  div.end p {
    font-size: 10px;
    color: #5d646d; }

#wrap {
  width: 90%;
  height: 90%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  z-index: -1; }

.ball {
  pointer-events: none;
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: gray;
  animation: implode 1s ease-in-out;
  animation-fill-mode: both;
  opacity: .5; }

@keyframes implode {
  100% {
    transform: scale(0); } }

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