*{
    box-sizing: border-box;
    font-family: arial;
}

body{
    background-color:rgb(245, 242, 237);
}

.heading{
    margin: auto;
    text-align: center;
    margin: 20px;
}

.turn{
    margin: auto;
    text-align: center;
    margin: 20px;
}

.ticTacToe {
    display: grid;
    margin: auto;
    width: 452px;
    border: solid 1px rgb(179, 106, 106);
    grid-template-columns: repeat(3, 150px);
    grid-template-rows: repeat(3,150px);
}

img{
    width: 130px;
    height: 130px;
    margin: 0 auto;
    margin-top: 0.5em;
    display: block;

}

.grid{
    border: solid 1px black;
    background-color: aliceblue;
    transition: 0.2s;
}

.grid:hover {
    background-color: rgb(175, 175, 175);

}

.T {
    color: rgb(179, 106, 106);
}

/* Scores */

.score {
    margin: 0 auto;
    margin-top: -1em;
    width: 452px;
}

.score h3{
    display: inline-block;
    margin-top: 6%;
    margin-left: 29%;
    margin-right: -6%;
}

.X{
    color: rgb(179, 106, 106);
}

.O{
    color: rgb(179, 106, 106);
}

/* Winning Screen */

.end {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    margin-top: -20px;
    margin-left: -8px;
    background: rgb(245, 242, 237);
    
}

.ending {
    text-align: center;
    position: relative;
    width: 50%;
    margin: 0 auto;
    top: 40%;
}

.endMsg {
    color: rgb(0, 0, 0);
}

.restart {
    display: relative;
    margin: 0 auto;
    padding: 13px;
    font-size: 1em;
    border: none;
    border-radius: 10%;
    background-color:rgb(132, 132, 132);
    color: white;
}
.restart:hover {
    display: relative;
    margin: 0 auto;
    padding: 13px;
    font-size: 1em;
    border: none;
    border-radius: 10%;
    background-color:rgb(88, 113, 68);
    color: white;
}

/* Reset Score Button */

.resetcontainer {
    display: flex;
    align-items: center;
    margin: 0 auto;  
}

.reset{
    margin: 0 auto;
    padding: 13px;
    font-size: 1em;
    border: none;
    border-radius: 3%;
    background-color:rgb(132, 132, 132);
    color: white;
    transition: 0.5s;
}

.reset:hover{
    margin: 0 auto;
    padding: 13px;
    font-size: 1em;
    border: none;
    border-radius: 3%;
    background-color:rgb(88, 113, 68);
    color: white;
}