body {
    background-image: url(../images/triangles.png);
    background-size: 100% cover;
}

#container, footer {
    background: rgba(240, 248, 255, 0.5);
    margin: 5% 5% 1%;
    padding: 2% 2%;
}

#userScorearea {
    background: rgba(255, 172, 71, 0.5);
    margin: 5px 10px 5px 0px;
    padding: 2px 5px;
}

#userScoretext {
    color: rgba(240, 248, 255, 0.5);
    font-size: 200%;
    vertical-align: bottom;
    margin-bottom: 0px;
}

#userScore {
    text-align: right;
    font-size: 400%;
    padding-right: 20px;
}

#targetScorearea {
    background: rgba(149, 78, 217, 0.5);
    margin: 5px 15px 5px -10px;
    padding: 2px 5px;
}

#targetScoretext {
    color: rgba(240, 248, 255, 0.5);
    font-size: 200%;
    vertical-align: bottom;
    margin-bottom: 0px;
}

#targetScore {
    text-align: right;
    font-size: 400%;
    padding-right: 20px;
}

#winLoss {
    background: rgba(70, 207, 21, 0.5);
    margin: 5px 10px 5px 0px;
    padding: 2px 5px;
    font-size: 200%;
}

#winLosstext {
    vertical-align: bottom;
    color: rgba(40, 40, 40, 0.8);
    padding-top: 20px;
}

#winLossmessage {
    background: rgba(77, 189, 255, 0.5);
    color: rgba(240, 248, 255, 0.8);
    margin: 5px 15px 5px -10px;
    padding: 20px 5px 0px 10px;
    font-size: 150%;
}

footer {
    margin: 1% 5% 5%;
    padding: 2% 2%;
    text-decoration: none;
}

a, a:hover {
    color: indigo;
}