/* #painEffect {
    height: 100%;
    background-image: url('https://files.catbox.moe/xlnj9b.gif');
    bottom: 100%;
    left: 100%;
    rotate: 30deg;
}
#painEffect:before {
    position: absolute;
    right:100%;
    content: '';
    background: rgba(8, 41, 255, 0.5);
    width: 200px;
    height: 100%;
    pointer-events: none
    
}
    */
    
    @font-face {
  font-family: BSTRD; /* set name */
  src: url(BSTRD.ttf); /* url of the font */
}

.box {
  width: 300px;
  border: 15px solid green;
  padding: 50px;
  top: 10%; 
  margin-left: auto;
  margin-right: auto;
  place-items: center;
  background-color: darkgoldenrod;
}

h1 {
    text-align: center;
    font-family: BSTRD;

  
}


.navbar ul{
    list-style-type: none;
    background-color: hsl(0, 0%, 25%);
    padding: 0px;
    margin-left: auto;
    margin-right: auto;
    place-items: center;
    overflow: hidden;
}
.navbar a{
    color: white;
    text-decoration: none;
    padding: 15px;
    display: block;
    text-align: center;
}
.navbar a:hover{
    background-color: hsl(0, 0%, 10%);
}
.navbar li{
    float: left;
}