/* Global 3D button style layer */

.btn {
    position: relative;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    transform: translateY(0);
    transition: transform 0.15s ease, box-shadow 0.2s ease, filter 0.2s ease;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.10), 0 1px 2px rgba(0, 0, 0, 0.10);
}

.btn:hover,
.btn:focus {
    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.13), 0 2px 4px rgba(0, 0, 0, 0.12);
    filter: brightness(1.02);
}

.btn:active,
.btn.active {
    transform: translateY(2px);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
}

.btn.btn-link,
.btn.btn-xs.btn-link {
    box-shadow: none;
    border-bottom-width: 0;
}

.btn-default {
    border-bottom-color: #b5b5b5;
}

.btn-primary {
    border-bottom-color: #12649e;
    box-shadow: 0 7px 16px rgba(18, 100, 158, 0.34), 0 3px 6px rgba(0, 0, 0, 0.14);
}

.btn3d.btn-primary,
.btn3d.btn.btn-primary {
    border-bottom-color: #12649e !important;
    box-shadow: 0 7px 16px rgba(18, 100, 158, 0.34), 0 3px 6px rgba(0, 0, 0, 0.14) !important;
}

.btn-primary:hover,
.btn-primary:focus {
    box-shadow: 0 10px 20px rgba(18, 100, 158, 0.40), 0 4px 8px rgba(0, 0, 0, 0.16);
}

.btn-success {
    border-bottom-color: #1f8a45;
    box-shadow: 0 7px 16px rgba(31, 138, 69, 0.30), 0 3px 6px rgba(0, 0, 0, 0.14);
}

.btn3d.btn-success,
.btn3d.btn.btn-success {
    border-bottom-color: #1f8a45 !important;
    box-shadow: 0 7px 16px rgba(31, 138, 69, 0.30), 0 3px 6px rgba(0, 0, 0, 0.14) !important;
}

.btn-success:hover,
.btn-success:focus {
    box-shadow: 0 10px 20px rgba(31, 138, 69, 0.36), 0 4px 8px rgba(0, 0, 0, 0.16);
}

.btn-info {
    border-bottom-color: #2497bf;
    box-shadow: 0 7px 16px rgba(36, 151, 191, 0.30), 0 3px 6px rgba(0, 0, 0, 0.14);
}

.btn3d.btn-info,
.btn3d.btn.btn-info {
    border-bottom-color: #2497bf !important;
    box-shadow: 0 7px 16px rgba(36, 151, 191, 0.30), 0 3px 6px rgba(0, 0, 0, 0.14) !important;
}

.btn-danger {
    border-bottom-color: #bd2e2e;
    box-shadow: 0 7px 16px rgba(189, 46, 46, 0.30), 0 3px 6px rgba(0, 0, 0, 0.14);
}

.btn3d.btn-danger,
.btn3d.btn.btn-danger {
    border-bottom-color: #bd2e2e !important;
    box-shadow: 0 7px 16px rgba(189, 46, 46, 0.30), 0 3px 6px rgba(0, 0, 0, 0.14) !important;
}

.btn-info:hover,
.btn-info:focus {
    box-shadow: 0 10px 20px rgba(36, 151, 191, 0.36), 0 4px 8px rgba(0, 0, 0, 0.16);
}

.btn-warning {
    border-bottom-color: #cf7e0d;
}