@font-face {
  font-family: 'dezenPro';
  src: url('../font/Dezen_Pro_Regular.otf');
}

html {
  font-size: 100%;
}

body {
  background: #F5F5F5;
  font-family: dezenPro;
}

ul, li {
  list-style: none;
}

.hidden {
  display: none !important;
}

.main-content {
  height: 100%;
}

.name-title {
  font-family: dezenPro;
  font-size: 4.5rem;
  letter-spacing: 0.5rem;
  font-weight: normal;
  text-align: center;
  margin-top: 10rem;
  margin-bottom: 0px;
}

ul.links {
  margin-top: 1rem;
  padding-left: 0;
  text-align: center;
  font-size: 0;
}

.link-item {
  display: inline-block;
  width: 40px;
  height: 40px;
  padding: 1rem;
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
}

.link-item:hover {
  filter: grayscale(100%);
  -webkit-filter: grayscale(0%);
  -webkit-filter: grayscale(0%);
  -moz-filter: grayscale(0%);
  -o-filter: grayscale(0%);
  -ms-filter: grayscale(0%);
}

h2.url-display {
  text-align: center;
  font-size: 1.5rem;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.125rem;
}

span.cursor {
  width: 0.125rem;
  height: 0.9em;
  background: black;
  display: inline-block;
  vertical-align: -1px
}

.blink {
  opacity: 0;
  -webkit-animation: blink 1.5s ease-in-out infinite;
  -moz-animation: blink 1.5s ease-in-out infinite;
  -ms-animation: blink 1.5s ease-in-out infinite;
  -o-animation: blink 1.5s ease-in-out infinite;
  animation: blink 1.5s ease-in-out infinite;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

@-webkit-keyframes blink {
  0% { opacity: 0; }
  25% { opacity: .5; }
  45% { opacity: 1;}
  50% { opacity: 1; }
  50.01% { opacity: 1; }
  75% { opacity: .5; }
  90% { opacity: 0; }
  100% { opacity: 0; }
}

@-moz-keyframes blink {
  0% { opacity: 1; }
  25% { opacity: .5; }
  50% { opacity: 0; }
  50.01% { opacity: 0; }
  75% { opacity: .5; }
  90% { opacity: 1; }
  100% { opacity: 1; }
}

@-ms-keyframes blink {
  0% { opacity: 1; }
  25% { opacity: .5; }
  50% { opacity: 0; }
  50.01% { opacity: 0; }
  75% { opacity: .5; }
  90% { opacity: 1; }
  100% { opacity: 1; }
}

@-o-keyframes blink {
  0% { opacity: 1; }
  25% { opacity: .5; }
  50% { opacity: 0; }
  50.01% { opacity: 0; }
  75% { opacity: .5; }
  90% { opacity: 1; }
  100% { opacity: 1; }
}

@keyframes blink {
  0% { opacity: 1; }
  25% { opacity: .5; }
  50% { opacity: 0; }
  50.01% { opacity: 0; }
  75% { opacity: .5; }
  90% { opacity: 1; }
  100% { opacity: 1; }
}