@font-face {
    font-family: 'Escape';
    src: url(/fonts/ESCAPE.TTF) format('truetype');
}

body {
    background-color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: var(--standard-font-size);
}
a:link, a:active, a:visited {
    color: var(--standard-blue);
}
.smallfont {
    font-size: var(--small-font-size);
}
.mediumfont {
    font-size: var(--medium-font-size)
}
.largefont {
    font-size: var(--larger-font-size);
}
.button {
    padding:5px 10px;
    border-radius:50px;
    border-width:0px;
}

    .signupbutton {
        margin:20px 0px 20px 20px;
        min-width:150px;
        border-radius:5px;
        padding:10px 5px;
    }
.fontescape {
    font-family: 'Escape', Arial;
}
.bluebg {
    background-color: var(--standard-blue);
}
.blacktext {
    color:black;
}
.bluetext {
    color:var(--standard-blue);
}
.whitetext {
    color:white;
}
.main-logo {
    z-index:10;
    position: relative;
}
.negative-top-margin {
    margin-top:-50px!important;
}
canvas, .gameborder {
    border:15px solid var(--standard-blue);
    border-radius:20px;
}
.textshadow {
    text-shadow: 2px 2px 5px #888888;
}

.modal-header {
    background-color:var(--standard-pink);
}
.btn-primary {
    background-color:var(--standard-blue);
    color:white;
    border-width:0px;
}

.main-logo {
    z-index:10;
    position: relative;
}
.negative-top-margin {
    margin-top:-50px!important;
}
canvas, .gameborder {
    border:15px solid var(--standard-pink);
    border-radius:20px;
}

/** CSS Wide Variables **/
:root {
    /* CSS colours **/
        --standard-blue:#0076be;
    /** Font sizes **/
        --standard-font-size:20px;
        --larger-font-size:66px;
        --medium-font-size:36px;
        --small-font-size:24px;
}