Shadow

.shadow {
    width: 100%;
    position: absolute;
    height: 100vh;
    background-image: linear-gradient(100deg, rgba(0, 0, 0, 0.20) 20%, rgba(0, 154, 125, 0) 100%);

    @include mq($screen-m) {
        height: 100%;
        background-image: linear-gradient(100deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 154, 125, 0) 100%);
    }

    @include mq($screen-l) {
        background: linear-gradient(100deg, rgba(0, 0, 0, 0.20) 20%, rgba(0, 154, 125, 0) 100%);
    }

    @include mq($screen-xl) {
        background: linear-gradient(100deg, rgba(0, 0, 0, 0.20) 40%, rgba(0, 154, 125, 0) 100%);
    }

    @include mq($screen-xxl) {
        background: linear-gradient(100deg, rgba(0, 0, 0, 0.20) 50%, rgba(0, 154, 125, 0) 100%);
    }
    &--top {
        &__center {
            background: linear-gradient(180deg, rgba(0, 0, 0, 0.25) 50%, rgba(0, 154, 125, 0) 100%);
        }
        &__right {
            background: linear-gradient(235deg, rgba(0, 0, 0, 0.25) 50%, rgba(0, 154, 125, 0) 100%);
        }
        &__left {
            background: linear-gradient(115deg, rgba(0, 0, 0, 0.25) 50%, rgba(0, 154, 125, 0) 100%);

        }
    }
    &--bottom {
        &__center {
            background: linear-gradient(0deg, rgba(0, 0, 0, 0.25) 50%, rgba(0, 154, 125, 0) 100%);
        }
        &__right {
            background: linear-gradient(295deg, rgba(0, 0, 0, 0.25) 50%, rgba(0, 154, 125, 0) 100%);
        }
        &__left {
            background: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 50%, rgba(0, 154, 125, 0) 100%);
        }
    }
    &--left {
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.25) 50%, rgba(0, 154, 125, 0) 100%);
    }
    &--right {
        background: linear-gradient(235deg, rgba(0, 0, 0, 0.25) 50%, rgba(0, 154, 125, 0) 100%);
    }

}