@font-face {
  font-family: vocaloid;
  font-style: normal;
  font-weight: 400;
  src: local("Vocaloid"), url(/fonts/VOC-RE.woff) format("woff");
}
@font-face {
  font-family: vocaloid;
  font-style: italic;
  font-weight: 400;
  src: local("Vocaloid"), url(/fonts/VOC-IT.woff) format("woff");
}
* {
  -webkit-animation: cursor 400ms infinite;
  animation: cursor 1000ms infinite;
  font-family: "Vocaloid", sans-serif;
  color: #55d1d0;
  -webkit-text-stroke: 0.4px black; /* width and color */
}

@-webkit-keyframes cursor {
  0% {
    cursor: url(cursor/miku-1.png), auto;
  }
  14.28% {
    cursor: url(cursor/miku-2.png), auto;
  }
  28.56% {
    cursor: url(cursor/miku-3.png), auto;
  }
  42.84% {
    cursor: url(cursor/miku-4.png), auto;
  }
  57.12% {
    cursor: url(cursor/miku-5.png), auto;
  }
  71.4% {
    cursor: url(cursor/miku-6.png), auto;
  }
  85.68% {
    cursor: url(cursor/miku-7.png), auto;
  }
  100% {
    cursor: url(cursor/miku-8.png), auto;
  }
}

@keyframes cursor {
  0% {
    cursor: url(cursor/miku-1.png), auto;
  }
  14.28% {
    cursor: url(cursor/miku-2.png), auto;
  }
  28.56% {
    cursor: url(cursor/miku-3.png), auto;
  }
  42.84% {
    cursor: url(cursor/miku-4.png), auto;
  }
  57.12% {
    cursor: url(cursor/miku-5.png), auto;
  }
  71.4% {
    cursor: url(cursor/miku-6.png), auto;
  }
  85.68% {
    cursor: url(cursor/miku-7.png), auto;
  }
  100% {
    cursor: url(cursor/miku-8.png), auto;
  }
}

html {
  background-color: pink;
}

p {
  font-size: 22px;
}

.div-global {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#div-myself {
  display: flex;
  align-content: center;
  margin: auto;
}

#img-div img {
  height: 100%;
  width: 100%;
  margin-left: 2px;
}