.testDiv {
  display: flex;

}

.Left {

    height: 100vw;
  width: 12.5%;
}

.Mid {
  display: flex;
  width: 75%;
  justify-content: center;
  height: 10%;

}

.Right {
width: 12.5%;
height: 100vw;
}

.a {
background-color:#f0c6c6
}
.b{
background-color:#f5bde6
}
.c{
background-color:#c6a0f6
}
.e{
background-color:#f5a97f
}
.f{
background-color:#eed49f
}
.g{
background-color:#a6da95
}
.h{
background-color: #8bd5ca
}
.i{
background-color:#91d7e3
}
.j{
background-color:#7dc4e4
}
.k{
background-color:#8aadf4
}
.d{
background-color:  #ed8796
}
hr {
  border: 0px;
}
.THEHORDEright {
  display: flex;
  justify-content: center;
  height: 100vw;

}
body {
 background-color:#303446;
}
.topMid {
display: flex;
  justify-content: center;
  
}
.leftSidebar {
  width: 20vw;
  length: 20vw;
  float: left;
  
}
h1, h2, h3, h4, h5{
  font-family: sans-serif;
  text-align: center;
    color: #c6d0f5;
  
}
h1 {
  color: #c6d0f5;
}
h2, a{
  font-size: 2cqw;
    color: #b5bfe2;

}
h5 {
  font-size: .7cqw;
}
.Left a {
  font-family: arial;
  font-weight: bold;
  text-align: center;
  color: #a5adce;
  text-decoration: inherit;
  display: block;
}
h1 {
  font-size: 3cqw;
}
.Left hr{

  border: 0px;
  height: .5vw;
}
.hr0 {
  background-color: #81c8be;
}
.hr1 {
  background-color:#f0c6c6; 
}
.hr2 {
  background-color:#f5bde6
}
.hr3 {
  background-color:#c6a0f6
}
.hr4 {
background-color:  #ed8796
}
.hr5 {
  background-color:#f5a97f
}
.hr6 {
  background-color:#eed49f
}
.hr7 {
  background-color:#a6da95
}
.hr8 {
  
}
.hr9 {
  
}
.hr10 {
  
}
.hr11 {
  
}
.buttonDiv {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 50vw;
  margin-top: -77%;
  margin-left: 23%;
}
.buttonDiv img {
  width: 100%;

}



.buttonDiv2 {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 50vw;
  margin-left: 22.6vw;

  
  
}
.buttonDiv2 img {
width: 5vw;
height: auto;

}