button {
    cursor: pointer;
}

.btn-darkblue {
    border: none;
    border-radius: 10px;
    padding: 10px 30px;
    background: var(--p-darkblue);
    color: white;
    box-shadow: 0px 5px 10px black;
}

.btn-darkblue:active {
    background: var(--p-darkblue-clicked);
}

.btn-blue {
    border: none;
    border-radius: 10px;
    padding: 10px 30px;
    background: var(--p-blue);
    color: black;
    box-shadow: 0px 5px 10px black;
}

.btn-blue:active {
    background: var(--p-blue-clicked);
}

.btn-darkred {
    border: none;
    border-radius: 10px;
    padding: 10px 30px;
    background: var(--p-darkred);
    color: white;
    box-shadow: 0px 5px 10px black;
}

.btn-darkred:active {
    background: var(--p-darkred-clicked);
}

.btn-red {
    border: none;
    border-radius: 10px;
    padding: 10px 30px;
    background: var(--p-red);
    color: black;
    box-shadow: 0px 5px 10px black;
}

.btn-red:active {
    background: var(--p-red-clicked);
}

.btn-black {
    border: none;
    border-radius: 10px;
    padding: 10px 30px;
    background: var(--p-black);
    color: white;
    box-shadow: 0px 5px 10px black;
}

.btn-black:active {
    background: var(--p-black-clicked);
}

.btn-white {
    border: none;
    border-radius: 10px;
    padding: 10px 30px;
    background: var(--p-white);
    color: black;
    box-shadow: 0px 5px 10px black;
}

.btn-white:active {
    background: var(--p-white-clicked);
}