/*--------------------
     Team
---------------------*/
.member {
    position: relative;
    margin-bottom: 50px;

    .member__img {
        position: relative;
        overflow: hidden;

        img {
            width: 100%;
            @include prefix(transition, all .8s ease, webkit moz ms o);
        }
    }

    .member__info {
        padding-top: 29px;

        .member__name {
            font-size: 18px;
            line-height: 1;
            margin-bottom: 11px;
        }

        .member__desc {
            font-family: $font-body;
            font-size: 14px;
            margin-bottom: 0;
        }
    }

    .member__hover {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        opacity: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
        @include prefix(transition, all .4s linear, webkit moz ms o);
    }


    .member__content-inner {
        position: absolute;
        left: 50px;
        bottom: 10px;
        height: 50px;
        line-height: 50px;
        width: calc(100% - 100px);
        opacity: 0;
        background-color: $color-theme;
        @include prefix(transition, all .4s linear, webkit moz ms o);
    }

    .social__icons a {
        color: #ffffff;
        opacity: 0;
        @include prefix(transition, opacity .3s linear, webkit moz ms o);
        transition-delay: .4s;

        &:hover {
            color: $color-heading;
        }
    }

    .social__icons a:nth-of-type(2) {
        transition-delay: .6s;
    }

    .social__icons a:nth-of-type(3) {
        transition-delay: .8s;
    }

    .social__icons a:nth-of-type(4) {
        transition-delay: 1s;
    }

    &:hover .member__hover {
        opacity: 1;
    }

    &:hover .member__content-inner {
        bottom: 30px;
        opacity: 1;
    }

    &:hover .social__icons a {
        opacity: 1;
    }
}

/* Mobile Phones and tablets */
@include xs-sm-screens {
    .member {
        max-width: 400px;
        margin: 0 auto 30px;

        .member__info {
            padding-top: 15px;

            .member__name {
                font-size: 17px;
                margin-bottom: 0;
            }
        }
    }
}