.row {
    display: flex;
    width: 100%;
  }
  
.brah {
    width: 50%;
    outline: 1px solid black;
    text-align: center;
    width: 400px;
    height: 400px;
    padding: 10px;
}

.king {
    font-size: large;
    background-color: greenyellow;
    text-align: center;
    margin-top: 15%;
    margin-left: 0%;
    position: relative;
    width: 50%;
    height: 50%;
    border: 0px;
} 
  
.king:hover  {
    background-color: rgb(240, 158, 144);
}

.queen {
    font-size: large;
    background-color: greenyellow;
    text-align: center;
    margin-top: 15%;
    margin-left: 0%;
    position: relative;
    width: 50%;
    height: 50%;
    border: 0px;
} 
  
.queen:hover  {
    background-color: rgb(240, 158, 144);
}

.jack {
    font-size: large;
    background-color: greenyellow;
    text-align: center;
    margin-top: 15%;
    margin-left: 0%;
    position: relative;
    width: 50%;
    height: 50%;
    border: 0px;
} 
  
.jack:hover  {
    background-color: rgb(240, 158, 144);
}

.dunce {
    font-size: large;
    background-color: greenyellow;
    text-align: center;
    margin-top: 15%;
    margin-left: 0%;
    position: relative;
    width: 50%;
    height: 50%;
    border: 0px;
} 
  
.dunce:hover  {
    background-color: rgb(240, 158, 144);
}

.playerchooselabel {
    left: 22.9%;
    right: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-large;
    position: relative;
}
.playerchoose {
    left: 22.9%;
    right: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-large;
    position: relative;
}

.secondthing {
    left: auto;
    right: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-large;
    position: sticky;
    
}
.submitbutton {
    left: auto;
    margin-top: auto;
    right:0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-large;
    position:sticky;
}

.grid-container {
    display: grid;
    float: left;
    grid-template-columns:  155px  80px 80px 90px 135px 130px 150px 90px 102px;
    padding: 10px;
    width: 15%;
    height: 10%;
    top: 11%;
    position: absolute;
    left: 42%;
  }
.grid-item {    
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(0, 0, 0, 0.8);
    padding: 5px;
    font-size: 20px;
    left: 70%;
    text-align: center;
    display: flex;
    
  }