Front_End.css

#board {
    position: absolute;
    top : 6%;
    left: 20%;
    width : 60%;
    height: 45%;
    text-align: center;
    border-style: solid;
    border-width: 0.3em;
    border-color: #fffd0e;
    background-color: #fffd0e;
}
#board tr {
    position: relative;
    width: 100%;
    border-style: none;
    border-width: 0px;
}
#board td {
    position: relative;
    width: 33%;
    border-style: solid;
}
.hText {
    font-family: boardHeading;
    font-size: 2.5em;
}
.boardPoints {
    font-family: digital;
    font-size: 5em;
}
#controllers {
    position: absolute;
    top: 55%;
    left: 25%;
    width: 50%;
    text-align: center;
    border-spacing: 0px;
    cursor: pointer;
    user-select: none;
}
.points{
    border-style: none;
    border-top-style: double;
    border-bottom-style: double;
    border-width: 10px;
    border-color: black;
    font-family: points;
    font-size: 2em;
    width: 16.5%;
    background-color: #0838ff;
    color: #ffffff;
}
.btns {
    font-family: button1;
    font-size: 2em;
    background-color: #63ff8f;
}
#ext {
    font-family: boardHeading;
    background-color: #FDD835;
}
#ctHead {
    font-family: boardHeading;
    font-size: 2em;
    background-color: #63ff8f;
}
#wS, #wNS {
    font-family: button1;
    font-size: 2em;
    background-color: #f8e85b;
    width: 50%;
    text-align: center;
}
#wktType {
    display: none;
}
.points:hover {
    background-color: #3a03d0;
}
.extras:hover {
    background-color: #02ba71;
}
#wktType td:hover {
    background-color: #fed72f;
}
body {
    background-color: #dddddd;
}
@font-face {
    font-family: boardHeading;
    src: url("High School USA Sans.ttf");
}
@font-face {
    font-family: digital;
    src: url("digital-7 (italic).ttf");
}
@font-face {
    font-family: points;
    src: url("Jersey M54.ttf");
}
@font-face {
    font-family: button1;
    src: url("Titillium-BoldUpright.otf");
}