.friend-box {
    display: inline-block;
    color: #000;
    border: 1px solid #9475B2;
    text-align: center;
    width: 200px;
    margin: 4px 0;
    border-radius: 3px;
    box-shadow: inset 0 0 1px #9475B2;
    background: #E4CFFF;
    text-decoration: none !important;
    transition: background .2s, box-shadow .2s;

    &:hover {
        background: #C2AFFE;
        box-shadow: inset 0 0 2px #9475B2;
    }

    &:active {
        color: inherit;
    }

    &__name {
        font-size: 1.2em;
        line-height: 1.5em;
        padding-bottom: 4px;
    }

    &__avatar {
        width: 150px;
        height: 150px;
        display: inline-block;
    }
}