.card {
    position: relative;
    margin-bottom: $card-spacer-y*2;
    @include shadow();

    &.card-disabled {
        opacity: 0.5;
    }

    &.card-container {
        box-shadow: none;
        background: transparent;
    }

    &.card-flex {
        display: flex;

        .card-block {
            width: 100%;
        }
    }

    .card-header {
        background-color: #fafafa;
        border-bottom: 1px solid rgba(0, 0, 0, .05);
    }

    .card-title {
        margin: 0;
        color: darken($gray-light, 15%);

        small {
            display: block;
            margin-top: .5rem;
            color: $gray-light;
        }
    }
}

.card-deck {
    margin-left: 0;
    margin-right: 0;

    .card {
        margin-left: 1px;
        margin-right: 1px;
    }
}

@include media-breakpoint-down(sm) {
    .card-block {
        padding: .5em;
    }
}
