
body {
    font-family: 'roboto_light', sans-serif;
    color: hsl(150, 100%, 87%);
    margin: 0;
    text-align: center;
}

#top-box, .bank-box, #calendar-box {
    padding: 2em 5vw;
}

.bank-box {
    background-color: hsl(150, 20%, 6%);
}

button {
    padding: 4px 10px;
    border-radius: 8px;
    border: 3px solid hsl(150, 40%, 60%);
    background-color: hsl(150, 25%, 25%);
    color: white;
    font-weight: bold;
}
button:hover:not([disabled]) {
    border: 3px solid hsl(234, 100%, 75%);
    /* Same as contrast-color */
    background-color: hsl(234, 60%, 90%);
    color: black;
}
button[disabled] {
    border: 3px solid hsla(150, 60%, 90%, 0%);
    background-color: hsla(150, 60%, 90%, 50%);
    color: hsla(150, 0%, 100%, 50%);
}

.larger {
    font-size: 1.3em;
}

.contrast-color {
    color: hsl(234, 100%, 75%);
}

.white {
    color: white;
}
