svg {
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}


.hdiv {
    display: flex;
    gap:5%;
    flex-direction: row;
    justify-content: flex-start;
}


.vdiv {
    display: flex;
    /* gap: 5%; */
    justify-content: space-evenly;
    flex-direction: column;
    
}

.pod {
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center; 
    height: 200px;
    padding-left: 20px;
    padding-right: 20px;
    border: 2px solid rgb(0,0,0);
    background-color: rgb(207, 207, 207);
}

.pod_1 {
    width: fit-content; 
    height: fit-content; 
    padding: 5px; 
    background-color: rgb(255, 225, 142); 
    border: 2px solid rgb(0, 0, 0);
}

.pod_2 {
    width: fit-content; 
    height: fit-content; 
    padding: 5px; 
    background-color: rgb(225, 238, 255); 
    border: 2px solid rgb(0, 0, 0);
}

.pod_3 {
    width: fit-content; 
    height: fit-content; 
    padding: 5px; 
    background-color: rgb(172, 92, 0); 
    border: 2px solid rgb(0, 0, 0);
}


.match {
    display: flex;
    gap:5px;
    width: fit-content; 
    height: fit-content; 
    padding: 5px; 
    background-color: rgb(207, 207, 207); 
    border: 2px solid rgb(0, 0, 0);

}


.player {
    min-width: 70px;
    max-width: 200px;
    height: fit-content; 
    padding: 5px; 
    background-color: rgb(255, 255, 255); 
    border: 2px solid rgb(0, 0, 0);
}

.score {
    width: fit-content; 
    height: fit-content; 
    padding: 5px; 
    background-color: rgb(255, 255, 255); 
    border: 2px solid rgb(0, 0, 0);
}

.scorebox {
    width: 50px;
    height: 19px;
}

.scorewin {
    min-width: 70px;
    max-width: 200px;
    height: fit-content; 
    padding: 5px; 
    background-color: rgb(255, 168, 68); 
    border: 2px solid rgb(0, 0, 0);
}