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

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

    /* Colors */
    background-color: #C6D420;
    color: #FFF;

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

.avatar__letters {
    /* Center the content */
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}