*{
box-sizing: border-box;
margin: 0;
padding: 0;
}
 
body{
background-color: #360f5a;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
color: #111;
font-family: 'Questrial', sans-serif;
}
 
.headerwrapper{
display: flex;
flex-direction: column;
margin-bottom: 1rem;
}
 
.header{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 200px;
background-image: url('/images/purplespace.jpg');
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
 
.title{
color: #fff;
letter-spacing: 0.2rem;
text-shadow: 0 0 10px #111;
font-family: 'Questrial', sans-serif;
}
 
.nav{
background-color: #111;
width: 100%;
text-align: center;
padding: 0.5rem 0 0.5rem 0;
}
 
.nav ul{
display: flex;
justify-content: space-around;
}
 
.nav li{
display: inline;
}
 
.mainwrapper{
display: flex;
flex-direction: column;
gap: 1rem;
padding: 0 1rem 1rem 1rem;
margin: 0 auto;
max-width: 700px;
}
 
.box{
background-color: #eee;
}
 
.subheaders{
color: #fff;
font-weight: normal;
font-size: 18px;
background-color: #111;
padding: 0.5rem;
}
 
.content{
padding: 1rem;
display: flex;
flex-direction: column;
gap: 1rem;
margin: 0.5rem;
}
 
a{
text-decoration: underline;
color: #000;
}
 
a:visited{
color: #000;
}
 
#credit a{
text-decoration: none;
background: linear-gradient(90deg, rgba(250,31,193,1) 0%, rgba(29,85,255,1) 25%, rgba(13,246,252,1) 53%, rgba(0,255,102,1) 77%, rgba(251,255,56,1) 100%);
background-size: 100%;
-webkit-background-clip: text;
-moz-background-clip: text;
-webkit-text-fill-color: transparent; 
-moz-text-fill-color: transparent;
}
 
#credit a:visited{
text-decoration: none;
background: linear-gradient(90deg, rgba(250,31,193,1) 0%, rgba(29,85,255,1) 25%, rgba(13,246,252,1) 53%, rgba(0,255,102,1) 77%, rgba(251,255,56,1) 100%);
background-size: 100%;
-webkit-background-clip: text;
-moz-background-clip: text;
-webkit-text-fill-color: transparent; 
-moz-text-fill-color: transparent;
}
 
a:hover{
font-style: italic;
}
 
a:active{
font-style: italic;
font-weight: bold;
}
 
.nav a{
color: white;
text-decoration: none;
}
 
.nav a:visited{
text-decoration: none;
color: white;
}
 
#credit{
position: fixed;
bottom: 0;
right: 0;
font-size: 12px;
}
 
::-webkit-scrollbar{
width: 6px; 
}
 
::-webkit-scrollbar-track{
background: linear-gradient(180deg, rgba(250,31,193,1) 0%, rgba(29,85,255,1) 25%, rgba(13,246,252,1) 53%, rgba(0,255,102,1) 77%, rgba(251,255,56,1) 100%);
}
 
::-webkit-scrollbar-thumb{
background-color: #111;
}