/* crt effect */
      .crt::before {
  content: " ";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
  z-index: 5;
  background-size: 100% 2px, 3px 100%;
  pointer-events: none;
}

@keyframes flicker {
  0% {
  opacity: 0.00001;
  }
  5% {
  opacity: 0.00009;
  }
  10% {
  opacity: 0.00004;
  }
  15% {
  opacity: 0.00006;
  }
  20% {
  opacity: 0.00008;
  }
  25% {
  opacity: 0.0006;
  }
  30% {
  opacity: 0.10008;
  }
  35% {
  opacity: 0.10004;
  }
}

.crt::after {
  content: " ";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(18, 16, 16, 0.1);
  opacity: 0;
  z-index: 2;
  pointer-events: none;
  animation: flicker 0.15s infinite;
}
    
    
/* basic */
html {
    background-image: url("images/blog_images/pattern%20608.gif");
    background-attachment: fixed;
    cursor: url("images/blog_images/cur.gif"), auto;
}
.content {
    margin-right: auto;
    margin-left: auto;
    margin-top: 50px;
    margin-bottom: 50px;
    padding-right: 170px;
    padding-left: 15px;
    font-family: "MS PGothic", "Meiryo", メイリオ, "Hiragino Kaku Gothic ProN", ヒラギノ角ゴ Pro W3, sans-serif;
    font-size: 13px;
    letter-spacing: 0.8px;
    line-height: 21px;
}
    a {
        color: #4d277a;
    }
#sparkle {
        background-image: url("images/pixels/sparkles-sparkle.gif");
        background-size: 9%;
        background-repeat: repeat-x;
        background-position: center;
        height: 30px;
        width: 100%;
        position: fixed;
        top: 0;
        z-index: 2;
    }
    #sparkle2 {
        background-image: url("images/pixels/sparkles-sparkle.gif");
        background-size: 9%;
        background-repeat: repeat-x;
        background-position: center;
        height: 30px;
        width: 100%;
        position: fixed;
        bottom: 0;
        z-index: 4;
    }
.sidenav {
    display: grid;
    grid-column: span 2;
    width: 200px;
    background-attachment: local;
    padding-top: 40px;
    text-align: center;
    position: fixed;
    z-index: 1;
    top: 0;
    right: 50px;
  
}
li {
    list-style: none;
    font-family: "MS PGothic", "Meiryo", メイリオ, "Hiragino Kaku Gothic ProN", ヒラギノ角ゴ Pro W3, sans-serif;
    font-size: 14px;
}
ul {
    margin-bottom: 40px;
    margin-top: 20px;
}
h5 {
    font-family: "MS PGothic", "Meiryo", メイリオ, "Hiragino Kaku Gothic ProN", ヒラギノ角ゴ Pro W3, sans-serif;
    font-size: 13px;
    margin: 5px;
    letter-spacing: 0.8px;
}

/* first */
#hearts {
    margin-left: 600px;
}

.info {
    padding-left: 40px;
    position: fixed;
}
#patchy {
    outline: 1px solid black;
}
#music {
    margin-left: 560px;
}

h6 {
    color: white;
    margin: 15px;
    font-family: "MS PGothic", "Meiryo", メイリオ, "Hiragino Kaku Gothic ProN", ヒラギノ角ゴ Pro W3, sans-serif;
    font-size: 20px;
    letter-spacing: 0.9px;
    text-shadow: -1px -1px 2px #af8fcf, 1px -1px 2px #ffcffb, -1px 1px 2px #5f4b82, 1px 1px 2px #70596e;
}

/* second */

.blogarea {
    margin-top: 0px;
    background-image: linear-gradient(#D9D9D9, #ABABAB);
    width: 600px;
    padding: 20px;
    border: 5px ridge silver;
    outline: 1px solid black;
    margin-left: 340px;
    margin-bottom: 15px;
}

h2 {
    color: #6d5f8a;
    font-size: 14px;
    border: black dotted 1px;
    padding: 2px;
}
hr {
    margin-top: 50px;
    margin-bottom: 40px;
    margin-right: 20px;
    margin-left: 20px;
}
footer {
    margin-left: 518px;
}