/* Module: Staff
----------------------------------------------- */

.module--staff {
    @include material() {
        overflow: hidden;
        position: relative;

        &::before {
            box-shadow: $box-shadow-material;
            content: '';
            height: 20px;
            left: 0;
            position: absolute;
            top: -20px;
            width: 100%;
        }
    }
}

.staff {
    @include material() {
        justify-content: center;

        &__item {
            box-shadow: $box-shadow-material;
            margin: 15px;
            padding: 0 0 15px;
            text-align: center;
            width: calc(100% - 30px);

            @include mobile() {
                width: calc(50% - 30px);
            }

            @include desktop() {
                width: calc(25% - 30px);

                &.staff__item {
                    &--two-columns {
                        width: calc(50% - 30px);
                    }

                    &--three-columns {
                        width: calc(100% / 3 - 30px);
                    }

                    &--four-columns {
                        width: calc(25% - 30px);
                    }

                    &--five-columns {
                        width: calc(20% - 30px);
                    }
                }
            }
        }
    }

    &__title {
        color: $silver-chalice;
        text-transform: uppercase;
    }
}
