@charset "utf-8";
body {
    background-color:#A3AF9E;
}

.container {
    width:70%;
    max-width:400px;
    margin-left:auto;
    margin-right:auto;
    position:relative;
}

.container img {
    position:absolute;
    top:0;
    left:0;
    z-index:1;
}

svg {
    width:100%;
    position:relative;
    pointer-events:none;
    z-index:2;
}

.scoreDisplay {
    font-family:sans-serif;
    font-weight:bold;
    font-size:17px;
}

button {
    background-color:#006595;
    color:white;
    border:none;
    width:100%;
    text-align:center;
    font-weight:bold;
    font-size:20px;
    padding-top:10px;
    padding-bottom:10px;
    cursor:pointer;
}

/* Media Queries */
@media only screen and (max-width: 550px) {
    .container {
        width:90%;
    }
}

@media only screen and (max-width: 450px) {
    .container {
        width:98%;
    }

    .scoreDisplay {
        font-size:13px;
    }
}