*{
    box-sizing: border-box;
}
body{
    width: 960px;
    margin: auto;
}
header{
    background: lightblue;
    padding: 10px;
    margin-bottom: 20px;
    line-height: 2em;
    

}

.container{
    display: grid;
    grid-template-columns: 1.1fr 1.4fr;
    grid-template-rows: 400px;
    grid-column-gap:10em;
    margin: auto;
    height:50%;
    width:100%;   
}

h1{
    text-align: center;
    background: lightblue; 
}

h2{
    background: lightgray;
    padding: 10px;
    height: 50px;
    color: brown;
    text-align: center;
}

.main{
    width: 600px;
}

.Box-l,
.Box-r{
    border: 2px solid rgba(0, 0, 0, 0.8);
    padding: 0;
    
    
}
.row{
    width: 100%;
    height: 100px;
    border: 1px solid black;
    text-align: center;
    margin: auto;
}
#wins{
    background: green;
}
#losses{
    background: red;
}
#ties{
    background: lightblue;
}