body{
margin:50px;
font-family:comic;
background-image:var(--background-image);
}

.container{
margin:10px;
display:grid;
  grid-template-areas:
    "header header header"
    "sidebar main main"
    "sidebar main main"
    "sidebar main main";
  grid-template-columns: 1.1fr 2fr 1.1fr;
  gap:5px 5px;
}

.everything{
width:800px;  
height:auto;
margin-top:80px;  
margin-left:auto; 
margin-right:auto;
margin-bottom:0px;
border:5px double var(--border);
border-radius:20px;
background:var(--bgcolor);
}

img{
border:2px solid var(--img);
}

.sideimg{
background-image: var(--sideimg);
background-size: cover;
width:187px;
height:170px;
text-align:center;
margin-left:5px;
margin-top:5px;
margin-bottom:5px;
border-radius:10px;
border:2px solid var(--img);
}

.header{
grid-area:header;
background-image:var(--himage);
background-size:50px 50px;
height:150px;
border-radius:20px;
border:2px solid var(--hborder);
text-align:center;
overflow:hidden;
box-shadow:var(--hshadow);
}

.title{
font-family:glacier;
color:var(--title);
font-size:50px;
margin-bottom:0px;
margin-right:5px; 
margin-left:0px;
margin-top:50px;
text-align:center;
}

footer{
color: var(--p);
}

.sidebar{
grid-area:sidebar;
align-content:left;
height:auto;
overflow:hidden;
}

.main ul {
	position: relative;
	margin-left:30px;
	padding-left: 19px;
  list-style: none;
  text-align:left;
}

.main li{
color:var(--list);
list-style-image: url('https://strawberrynose.neocities.org/favicon.png')
}

.keepin{
text-align:center;
overflow:scroll;
margin:0px;
}

.flex{
display:flex;
flex-direction:row;
justify-content:space-evenly;
}

.idk{
margin-top:25px;
margin-left:20px;
margin-right:30px;
margin-bottom:0px;
}

.nav{
background:var(--navbg);
border: 2px solid var(--navborder); 
border-radius:10px;
overflow:scroll;
height:220px;
width:auto;
margin:5px;
box-shadow:var(--navshadow);
}

.nav a{
border:none;
padding:0px;
margin:0px;
}

.main{
grid-area:main;
overflow:scroll;
overflow-x:hidden;
width:100%;
}

.idk a:link, a:visited, a:active {
   background-color:transparent;
   color:var(--link);
   text-decoration: none;
}

.idk a:hover {
   background-color:transparent;
   color:var(--hover);
   text-decoration:none;
   font-style:italic;
}

.sidebar a:hover {
padding:0px;
margin:0px;
}

.content{
display:flex;
flex-wrap:wrap;
flex-direction:row;
justify-content:space-evenly;
}

.button{
text-align:center;
height:35px;
overflow:hidden;
}

.info{
text-align:center;
width:100%;
height:auto;
overflow-x:hidden;
border:1px solid var(--navborder);
border-radius:10px;
padding:5px;
margin:5px;
box-shadow:var(--ishadow); 
}

h2{
color:var(--h123);
font-weight:normal;
text-align:center;
}

h3{
color: var(--h123);
font-weight:normal;
margin:0px;
}

p{
color:var(--p);
margin:5px;
text-align:center;
}