body {
  font-family: monospace;
  text-align: center;
  margin-top: 5em;
  background:
    calc( .9*10px) calc( .9*10px)/calc(2*10px) calc(2*10px) conic-gradient(at 20% 20%,#0000 75%,#1e1e1e 0),
    calc(-.1*10px) calc(-.1*10px)/calc(2*10px) calc(2*10px) conic-gradient(at 20% 20%,#0000 75%,#1e1e1e 0),
    calc( .7*10px) calc( .7*10px)/calc(2*10px) calc(2*10px) conic-gradient(at 40% 40%,#0000 75%,#201f1f 0),
    calc(-.3*10px) calc(-.3*10px)/calc(2*10px) calc(2*10px) conic-gradient(at 40% 40%,#0000 75%,#201f1f 0),
    conic-gradient(from 90deg at 20% 20%,#1e1e1e 25%,#201f1f 0) 
    0 0/10px 10px;

}

html {
  cursor: url('cursor.cur'), auto;
}


.typewriter {
  font-family: 'Roboto Mono', monospace;
  font-size: 3.5rem;
  justify-content: center;
  color: #dedede;
}

#typed {
  text-align: center;
}

.cursor {
  position: absolute;
  animation: blink 1s infinite, hideCursor 0s 10s forwards;
  font: inherit;
  color: inherit;
}

@keyframes blink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0; }
}

@keyframes hideCursor {
  to { opacity: 0; visibility: hidden; }
}

.dibil {
  color: #dedede;
  margin-top: 1.5em;
  font-size: 0.8em !important;
  margin-bottom: 5em;
}


#video-container {
  display: none;
  margin-top: 20px;
}
iframe {
  width: 560px;
  height: 315px;
  border: none;
}
.vvcd p {
  cursor: pointer;
}

video {
  display: none;
  width: 560px;
  height: auto;
  margin-top: 20px;
}

.socs p {
  font-family: 'Roboto Mono', monospace;
  display: inline-block;
  position: relative;
  margin-right: 1rem;
  color: #0f0;
}

.socs a {
  font-family: 'Roboto Mono', monospace;
  display: inline-block;
  position: relative;
  margin-right: 1rem;
  color: #0f0;
  text-decoration: none;
}

.socs p:hover::after {
  content: "_";
  animation: blink 1s infinite;
  font: inherit;
  color: inherit;
}

@keyframes blink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0; }
}