body {
    margin:0;
    padding:0;
    background-color:rgb(115, 220, 255);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    user-select:none;
    -webkit-tap-highlight-color: transparent;
}

/*  Container for the game board. The width and height is the 
    total of the 3 individual cell plus the border size. 
*/
.gameBoard {
    width:375px;
    height:375px;
    font-size:4em;
    font-weight: 900;
    border-collapse:collapse;
    cursor:pointer;
    font-family: sans-serif;
    border-radius:5px;
}

/*  Styling individual cells with fixed width and height */
.gameBoard tr td{
    border:5px solid white;
    width:120px;
    height:120px;
    -webkit-tap-highlight-color: transparent;
    border-radius:30px;
    text-shadow:0px 0px 2px black;
}

/*  To hide the top, left, bottom, and top border 
    - all element of the first cell
*/
.gameBoard tr:first-child td{
    border-top:none;
}

/*  - all the first cell of each row */
.gameBoard tr td:first-child {
    border-left:none;
}

/*  - all the last cell of each row */
.gameBoard tr td:last-child {
    border-right:none;
}

/*  - all element in the last row */
.gameBoard tr:last-child td{
    border-bottom: none;
}

/*  The game over menu */
#gameOver {
    display: none;
    width:300px;
    height:200px;
    background-color:lightblue;
    z-index:10;
    border-radius:10px;
    font-size:1.5em;
    font-family:Georgia;    
    box-shadow: 0px 0px 10px grey;
    text-shadow:0px 0px 5px grey;
}

/*  The element to display the result of the match */
#gameOver span {
    text-shadow:0px 0px 5px grey;
    text-shadow:-1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    color:rgb(251, 255, 0);
    font-weight:900;
    font-size:1.2em;
    font-family:"Times New Roman";
}

/*  The close button for the game over menu */
#close {
    position: fixed;
    top:20px;
    right:20px;
    cursor:pointer;
}

/*  Styling the close button for the game over menu */
#close:active {
    color:transparent;
}

#close:hover {
    transform:scale(1.2);
}

/*  style for styling the elements to center */
.center_FixedContAndText {
    position: fixed;
    text-align:center;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

/*  Styling the reset button */
#restart {
    position: absolute;
    left:50%;
    bottom:5%;
    transform:translate(-50%, -80%);
    font-size:2em;
    font-weight:900;
    text-shadow:0px 0px 3px grey;
    font-family: fantasy;
    cursor:pointer;
    transition-duration: 0.1s;
    z-index:8;
    display:none;
}

/*  Giving it some animation */
#restart:hover {
    text-shadow: 0px 0px 5px black;
    color:white;
}

footer {
    position: absolute;
    bottom:10px;
    width:100%;
    font-size: 1.2em;
    font-family:monospace;
    font-weight: 900;
}

footer span:first-child {
    float:left;
    margin-left:30px;
} 

footer span:nth-child(2) {
    float:right;
    margin-right:30px;
}

footer span a:hover {
    color:green;
}

footer span a {
    color:orange;
    text-decoration: none;
}