/* this bad boy can do so much box */

body{
  color:#C5C2D0;
  background-color:#232227;
}

.mainbox{
  padding-top: 10px;
  padding-bottom: 10px;
  margin-left: 40%;
  margin-top: 5px;
  background-color: #403D4B;
  outline-style: solid;
  outline-color: #101013;
  width:900px;
  text-align:center;
}


.Sidebox{
  position: fixed;
  display: inline-block;
  margin-left: 10%;
  vertical-align: top;
  margin-top: 5px;
  background-color: #403D4B;
  outline-style: solid;
  outline-color: #101013;
  width:500px;
  text-align:center;
  overflow-y:scroll;
  overflow-x:hidden;
  height:850px;
  scrollbar-width:thin;
  scrollbar-color: #240C7C;
  scrollbar-base-color: #240C7C;
  scrollbar-arrow-color: #0C0038;
  
}

footer{
  border-top-color: #101013;
  border-top-style: solid;
}



.onside{
  line-height: 40px;
  font-size: 15px;
  
}


hr{
  color: #101013;
  border-top: 2px solid #101013;
  height: 2px;
}

img{
  background-color: #232227;
  outline-style: solid;
  outline-color: #101013;
  display:inline-block;
  margin:auto;
  margin-bottom: 10px;
  margin-top: 10px;
}

br{
  margin-top: 5px;
}

a{
  color:#8BAFFF;
}

a:hover{
  color: #17D7FF;
}


@media (max-width: 600p× ) {

.Sidebox{
  position: fixed;
  display: inline-block;
  margin-left: 0%;
  vertical-align: top;
  margin-top: 0px;
  background-color: #403D4B;
  outline-style: solid;
  outline-color: #101013;
  width:100px;
  text-align:center;
  
}

}