html {
background:hsl(154 50% 5%);
  color: hsl(154 84% 70%);
text-shadow: 0 0 5px hsl(154, 84%, 70%);

outline-style:groove;
outline-color:aqua;
}
.header-logo-container{display:flex;
align-items:center;
justify-content:center;
}
.Header-logo ,h1{color: hsl(154 84% 70%);
display:flex;
align-items:center;
justify-content:center;

max-width:100%;

text-align:center;
font-size:max(5vw,0.5rem);

white-space: pre-wrap;
font-family:sans-serif;
}
.unordered-list{list-style-type:none;
 
    display:flex;
align-items:center;
justify-content:center;
text-align:center;
gap:20px;
margin:-20px;
}

.home,.about,.blog{

color: hsl(154 84% 70%);
font-family:'Comic Sans MS','Comic Sans',sans-serif,cursive;}

main{color:aqua;
display:flex;
align-items:center;
justify-content:center;
font-size:5px;}

pre{margin:auto;
margin-top:10vh;
display:table;}

footer{width:max(20vw ,105vw);
display:flex;
align-items:center;
justify-content:center;

}

 #glare {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1; /* ensure the effect doesn't cover the text */
    background: radial-gradient(hsl(154 5% 15%) 0%, hsl(154 50% 5%) 70%);
  }