style.css

body {
    color: #36c4a5;
}

button, a {
    background: #af6bff;
}

button:hover, a:hover {
    color: white;
}

input, text {
    width: 25px;
}

.btn-town-place {
    background: #89cb27;
}
.btn-town-place:hover {
    background: #65941d;
}

.btn-npc {
    background-color: #41dff4;
}
.btn-npc:hover {
    background-color: #32aebe;
}

.btn-travel {
    background-color: #ACB0FF;
}
.btn-travel:hover {
    background-color: #7c7fb8;
}

.btn-loot {
    background: #66ffcc;
}
.btn-loot:hover {
    background: #53cfa6;
}

.btn-combatCalc {
    background-color: #e60000;
    color: white;
}

.btn-combatCalc:hover {
    background: #a50000;
}

.btn-settlement {
    background-color: #ffd11a;
}

.btn-settlement:hover {
    background-color: #c4a115;
}

.btn-misfortune {
    background: #bbb7bd;
}

.btn-misfortune:hover {
    background: #929094;
}

/* Mobile */
@media only screen and (max-width: 700px) {
    .container {
        width: 85%;
    }
    button {
        font-size: 14px;
        width: 60%;
    }
}