.avatar {
    /* Center the content */
    display: inline-block;
    vertical-align: middle;

    /* Used to position the content */
    position: relative;

    /* Colors */
    background-color: rgba(77, 164, 176, 0.7);
    color: #fff;

    /* Rounded border */
    border-radius: 50%;
    height: 36px;
    width: 36px;
}

.avatarLetters {
    /* Center the content */
    font-size: 26px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}