body {
  background-image: url("https://shadowthehedgehog.neocities.org/graphics/site/hockeybu.png");
  background-repeat: no-repeat;
  background-color: black;
  background-position: bottom right;
  background-size:500px 560px;
  color: white;
  font-family: Courier New;
  text-align: center;

}
  
  .flex-container {
   display: flex; 
   flex-direction: column; 
   justify-content: flex-end;
}

  
.container {
    font-size:18px;
    width: 610px;
    max-height: 500px;
    padding: 10px;
    overflow-y: auto;
    overflow-x: auto;
    margin-right: 100px;
}

h5 {
    text-shadow: 2px 2px 5px #3cff32;
    color: inherit;
}

a:link {
  color: white; /* Unvisited link color */
  text-decoration: underline; /* Removes the default underline */
}

a:visited {
  color: white; /* Visited link color */
  text-decoration: underline;
}

a:hover {
  color: purple; /* Color when mouse is over the link */
  text-decoration: underline; /* Adds underline on hover */
}


#color {
  color: red;
  font-family: Arial;
}

.topnav {
    background-color: Black;
    overflow: hidden;
}


.topnav a {
    float: left;
    color: #9881a3;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 20px;
}

.topnav a:hover {
    background-color: #682a8c;
    color: black;
}


.topnav a.active {
    background-color: #cdafed;
    color: Black;
}

/* vertical menu */

.vertical-menu {
 width: 200px;
 height: 300px;
  overflow-y: auto;
}

.vertical-menu a {
  background-color: black; 
  color: #9881a3; 
  display: block; /* Make the links appear below each other */
  padding: 12px; /* Add some padding */
  text-decoration: none;
}

.vertical-menu a:hover {
  background-color: #682a8c; 
}

.vertical-menu a.active {
  background-color: #cdafed; 
  color: black;
}

.hewwo {
 width: 88px;
 height: 20px;
}

.chat {
  width: 540px;
  color: #3cff32;
  text-align: left;
  font-size: 18px;
  padding: 10px;
    margin: 10px;
  
}

.below {
  color: white;
  text-shadow: 2px 2px 5px white;
  text-align: center;
}