body {
  background-color: #002147;
  color: #99a6b5;
  font-family: "Courier New";
}

  ::-webkit-scrollbar-thumb{
    color: #001a39;
  }


header{
  text-align: center;
  font-size: 70px;
  margin: 5px auto;
  color: #e6ebf0;
  width: 100%;
  display: flex;
  align-content: center;
}
#button{
  width: 5%;
}
#headwords{
  width: 90%;
}

.ad{
  margin-left: 5px;
  margin-right: 5px;
}

.row{
  width: 85%;
  margin: 0 auto;
}

.leftpanel{
  float: left;
  background-color: #003567;
  width: 17%;
  margin: 5px;
  overflow-y: scroll;
  height: 750px;
}
  .leftpanel h1{
    margin: 10px;
    font-size: 20px;
  } 
  .leftpanel p{
    color: #1a3759;
    margin: 5px;
  }
  a:visited, a{
    color: #1a3759;
    margin: 3px;
  }
  
  .friendlist{
    background-color: #99aec2;
    margin: 10px;
    color: #1a3759;
  }

.rightpanel{
  float: right;
  background-color: #334d6c;
  width: 80%;
  margin: 5px;
}

#friendprofiles{
  display: flex;
  flex-direction: column;
  overflow-y: scroll;
  height: 750px;
}

img{
  margin: 5px;
  size: 30%;
}
  .rightpanel h1{
    font-size: 30px;
    color: #99a6b5;
    margin: 5px;
    text-align: center;
    display: flex;
  }
  
.rightpanel p{
  background: white;
  text-align: center;
  width: 40%;
  margin: 10px;
  font-size: 20px;
  display: flex;
}

.friendprofile, #tvfreakr{
  background: #99aec2;
  color: #1a3759;
  text-align: center;
  margin: 10px;
  font-size: 20px;
}

.container{
  display: grid;
  grid-template-columns: auto auto auto;
}