body {
background-image:url(https://katerpillar.neocities.org/assets/aroaceflag.svg);
background-size:auto 100vh;
background-attachment:fixed;
font-family: "Space Mono", monospace;
padding:50px;
}

#wrappermain {
border:10px #ffffff solid;
margin:auto;
position:relative;
max-width:800px;
background-color:#ffffff;
  & > h1 {font-size:1.2rem;
    color:#fff;
    position:absolute;
    top:-5rem;
    & span {font-size:3rem}}
}

#banner > * {
height:7px;
width:100%;
  &:nth-child(1) {
background-color:#ef9007;
}
&:nth-child(2) {
background-color:#f6d317;
}
&:nth-child(3) {
background-color:#fff;
}
&:nth-child(4) {
background-color:#45bcee;
}
&:nth-child(5) {
background-color:#1e3f54;
  }}

p {
  margin: 0.5rem 0 0.5rem 0
}

.orangeselection::selection {
color:white;
background-color:#ef9007;
}

.yellowselection::selection {
color:white;
background-color:#f6d317;
}

::selection {
color:white;
background-color:#000;
}

.blueselection::selection {
color:white;
background-color:#45bcee;
}

.navyselection::selection {
color:white;
background-color:#1e3f54;
}

b {text-decoration:2px underline dotted}

::-webkit-scrollbar {
  width: 15px;
}
::-webkit-scrollbar-track {
  background: #fff;
}
::-webkit-scrollbar-thumb {
  background: #ef9007; 
  border-radius:10px;
}

::-webkit-scrollbar-thumb:hover {
  background: #1e3f54; 
}

#navbar {
display:flex;
justify-content:space-between;
  & a {text-decoration:dotted 2px underline;
    font-weight:bold;
    &:hover {color:black !important;}
  }
  
}