style.css

/* body customization */

body {
  background-color: black;
  background-image: url("https://transparenttextures.com/patterns/cartographer.png");     
}

/* nav-link customization */

.nav-link-home {
  font-weight: bold;
  color: #FFFFFF;
}

.nav-link-home:hover {
  color: cyan;
}

.nav-link-home::before {
  content: "StuntStorm's ";
  color: #FFFFFF;
}

.nav-link-about {
  font-weight: bold;
  color: #FFFFFF;
}

.nav-link-about:hover {
  color: cyan;
}

.nav-link-github {
  font-weight: bold;
  color: #FFFFFF;
}

.nav-link-github:hover {
  color: cyan;
}

/* header customization */

.header-link {
  transition: 250ms ease;
}

.header-link:hover {
  transform: scale(1.25, 1.25);
  color: cyan;
}

.header-streak {
  background: linear-gradient(0.25turn, yellow, #fe8019);
}
 
/* posts customization */

.posts {
  border-radius: 0px;  
  grid-gap: 10px;
}

.post {
  border-radius: 4px;
  border: 5px solid cyan;
  transition: 250ms ease;
}

.post-attachment:hover {
  transform: scale(1.015);
}

/* custom animation */

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rainbow {
  14% {
    color: red;
  }
  28% {
    color: orange;
  }
  42% {
    color: yellow;
  }
  56% {
    color: green;
  }
  70% {
    color: cyan;
  }
  84% {
    color: blue;
  }
  100% {
    color: purple;
  }
}

.header-title-avatar {
  animation: rotate 5s infinite;
}
.header-title-name {
  animation: rainbow 5s infinite;
}