.slide-out
{
    position: relative;

    -webkit-transition: all .5s;
            transition: all .5s;
}
.slide-out .slide-overlay
{
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;

    visibility: hidden;

    width: 100%;
    height: 100%;

    cursor: pointer;
    -webkit-transition: all .5s;
            transition: all .5s;

    opacity: 0;
    background: rgba(0,0,0,.7);
}
.slide-out.active .slide-overlay
{
    z-index: 999999;

    visibility: visible;

    opacity: 1;
}
.slide-member
{
    position: fixed;
    top: 0;
    right: 0;

    overflow-x: hidden;
    overflow-y: auto;

    height: 100%;
    padding: 15px;

    -webkit-transition: -webkit-transform .5s;
            transition:         transform .5s;
}
.member-close
{
    position: absolute;
    top: 0;
    right: 0;

    display: block;

    width: 35px;
    height: 35px;

    -webkit-transition: -webkit-transform .4s 0s;
            transition:         transform .4s 0s;
    -webkit-transform: translateX(50px);
        -ms-transform: translateX(50px);
            transform: translateX(50px);

    background: transparent;
}
.member-close:hover
{
    background: #000;
}
.member-close:hover:after,
.member-close:hover:before
{
    background: #fff;
}
.member-close:after,
.member-close:before
{
    position: absolute;
    top: 0;

    width: 30px;
    height: 3px;

    content: '';

    background: #000;
}
.member-close:after
{
    left: 0;

    -webkit-transform: rotate(45deg) translateX(13px) translateY(10px);
        -ms-transform: rotate(45deg) translateX(13px) translateY(10px);
            transform: rotate(45deg) translateX(13px) translateY(10px);
}
.member-close:before
{
    left: 0;

    -webkit-transform: rotate(-45deg) translateX(-10px) translateY(13px);
        -ms-transform: rotate(-45deg) translateX(-10px) translateY(13px);
            transform: rotate(-45deg) translateX(-10px) translateY(13px);
}
.slide-member.active .member-close
{
    -webkit-transition: -webkit-transform .4s .7s;
            transition:         transform .4s .7s;
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
}
.slide-member .thumb img
{
    max-width: 100%;
    max-height: 250px;
    margin: 15px auto;

    border-radius: 500px;
}
.slide-member .name
{
    font-size: 40px;

    margin-bottom: 0;

    text-align: center;
    text-transform: uppercase;

    color: #ff2d2d;
}
.slide-member .office
{
    font-size: 22px;

    text-align: center;
}
.slide-member .info
{
    text-align: justify;
}
.slide-member .fb,
.slide-member .google
{
    font-weight: bold;

    display: block;

    color: #231f20;
}
.slide-member .fb a,
.slide-member .google a
{
    font-weight: normal;
}
.slide-member .fb a
{
    color: #3b579d;
}
.slide-member .google a
{
    color: #f00;
}