/* 
can you teach me to be real? 
*/

@font-face {
	font-family: "Mx437 DOS-V";
	src: url(/fonts/DOS/Mx437_DOS-V_re_ANK24.ttf);
}

@font-face {
	font-family: "KH Dot Hibiya";
	src: url(/fonts/Dot/KH-Dot-Hibiya.ttf);
}

.header {
    font-family:
	"Mx437 DOS-V",
	"KH Dot Hibiya";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 30px;
    font-size: 14px;
    text-align: center;
    line-height: 30px;
    /* letter-spacing: 2px; */
    background: #f8e6d0;
    color: #200818;
}

.circle {
    width: 640px;
    height: 640px;
    border-radius: 100%;
    border: 1px #f8e6d0 solid;
    position: relative;
    display: inline-grid;
    align-content: center;
}

img {
    margin: auto;
    width: 280px;
    height: 280px;
    box-shadow:4px 4px 0 #dbac9c;
}

.blinkFrame {
  width: 300px;
  font-weight: bolder;
  margin: 0px;
  padding: 0px;
  letter-spacing: 0px;
  text-align: center;
}

.blink {
  animation: blink 2s ease-in-out infinite;
  animation-delay: calc(0.1s * var(--i))
}

body {
    font-family:
	"Mx437 DOS-V",
	"KH Dot Hibiya";
    padding: 4vw;
    text-align: center;
    background-color: #200818;
    color: #f8e6d0;
    letter-spacing: 4px;
    margin: auto;
}

@keyframes blink {
  50% {
	  color: #dbac9c;
  }
 }