.btn {
    font-family: 'Cabrion-Light', Arial, sans-serif;
    background: var(--primary-dark);
    background: linear-gradient(to bottom, var(--primary-dark), var(--primary-dark-gradient-start));
    color: var(--plaintext-light);
    border-radius: .25rem;
    border: solid 1px var(--primary-dark);
    display: inline-block;
    padding: 0.75rem;
    text-decoration: none;
    text-align: center;
}

.btn:hover {
    background: linear-gradient(to bottom, var(--secondary-dark), var(--secondary-dark-gradient-start));
}

.btn.btn-primary {
    border-radius: 0.8rem;
    border: 0;
    font-size: 1rem;
    width: 220px;
    background: var(--primary-dark);
    background: linear-gradient(to bottom, var(--primary-dark), var(--primary-dark-gradient-start));
}

.btn.btn-primary:hover:not([disabled]) {
    background: var(--secondary-dark-gradient-start);
    background: linear-gradient(to bottom, var(--secondary-dark-gradient-start), var(--secondary-dark));
    cursor: pointer;
}

.btn.btn-secondary {
    border-radius: 0.8rem;
    color: var(--primary-dark);
    background: none;
}

.btn.btn-secondary:hover {
    border: 1px solid var(--secondary-dark);
    color: var(--secondary-dark);
    cursor: pointer;
}

.btn.btn-icon > span {
    flex-grow: 1;
    margin: auto;
    font-size: 16px;
}

.btn.btn-icon > svg {
    transform: rotate(90deg);
    height: 40px;
    width: 40px;
}

.btn.btn-icon:disabled, .btn.btn-primary:disabled {
    opacity: 0.5;
}

.home-btn {
    display: block;
    margin-top: -20px;
    margin-bottom: 40px;
    padding: 1rem 0;
    text-decoration: none;
    color: var(--plaintext-light);
    align-self: stretch;
    flex: 1;
    border-radius: .5rem;
    background-color: transparent;
    background-image: linear-gradient(0deg, var(--primary-gradient-dark), var(--primary-dark) 33%);
    transition: background-color 500ms ease-out;
    font-size: 1.2rem;
    font-weight: bold;
    text-align: center;
}

.home-btn:hover {
    background-image: linear-gradient(0deg, var(--secondary-dark) 56%, var(--secondary-light));
    color: var(--plaintext-light);
    text-decoration: none;
}

.iconOnly {
    padding: 0;
    margin: 0;
    width: 20px;
    height: 20px;
    background: none;
    color: var(--plaintext-dark);
    cursor: pointer;
}

.iconOnly > svg {
    width: 20px;
    height: 20px;
}