.btn-primary {
    background-color: var(--color-header-background01);
    border-color: var(--color-header-background01);
}

.btn-primary:hover {
    background-color: var(--color-header-background01);
    box-shadow: 6px 6px 10px -1px rgba(0, 0, 128, 0.7),
    -6px -6px 10px -1px rgba(0, 0, 64, 0.15);
}

.btn-outline-primary {
    color: var(--color-header-background01);
    border-color: var(--color-header-background01);
}

.btn-outline-primary:hover {
    background-color: var(--color-header-background01);
    border-color: var(--color-header-background01);
}

.btn-danger {
    background-color: #dc3545;
    border-color: #dc3545;
}

.btn-danger:hover {
    box-shadow: 6px 6px 10px -1px rgba(220, 53, 69, 0.7),
    -6px -6px 10px -1px rgba(220, 53, 69, 0.15);
}

.btn-info {
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.btn-info:hover {
    box-shadow: 6px 6px 10px -1px rgba(23, 162, 184, 0.7),
    -6px -6px 10px -1px rgba(23, 162, 184, 0.15);
}

.btn-warning {
    background-color: #ffc107;
    border-color: #ffc107;
}

.btn-warning:hover {
    box-shadow: 6px 6px 10px -1px rgba(255, 193, 7, 0.7),
    -6px -6px 10px -1px rgba(255, 193, 7, 0.15);
}


.btn-success {
    background-color: #28a745;
    border-color: #28a745;
}

.btn-success:hover {
    box-shadow: 6px 6px 10px -1px rgba(40, 167, 69, 0.7),
    -6px -6px 10px -1px rgba(40, 167, 69, 0.15);
}