.avatar {
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    vertical-align: middle
}

    .avatar, .avatar > i, .avatar > svg {
        display: inline-flex;
        text-align: center
    }

        .avatar > i, .avatar > svg {
            align-self: center;
            margin: 0 auto
        }

        .avatar img {
            height: auto;
            max-width: 100%
        }

        .avatar.avatar-10 {
            height: 10px;
            line-height: 9px;
            width: 10px
        }

        .avatar.avatar-20 {
            height: 20px;
            line-height: 18px;
            width: 20px
        }

        .avatar.avatar-30 {
            height: 30px;
            line-height: 27px;
            width: 30px
        }

        .avatar.avatar-40 {
            height: 40px;
            line-height: 36px;
            width: 40px
        }

        .avatar.avatar-50 {
            height: 50px;
            line-height: 45px;
            width: 50px
        }

        .avatar.avatar-60 {
            height: 60px;
            line-height: 54px;
            width: 60px
        }

        .avatar.avatar-70 {
            height: 70px;
            line-height: 63px;
            width: 70px
        }

        .avatar.avatar-80 {
            height: 80px;
            line-height: 72px;
            width: 80px
        }

        .avatar.avatar-90 {
            height: 90px;
            line-height: 81px;
            width: 90px
        }

        .avatar.avatar-100 {
            height: 100px;
            line-height: 90px;
            width: 100px
        }

        .avatar.avatar-110 {
            height: 110px;
            line-height: 99px;
            width: 110px
        }

        .avatar.avatar-120 {
            height: 120px;
            line-height: 108px;
            width: 120px
        }

        .avatar.avatar-130 {
            height: 130px;
            line-height: 117px;
            width: 130px
        }

        .avatar.avatar-140 {
            height: 140px;
            line-height: 126px;
            width: 140px
        }

        .avatar.avatar-150 {
            height: 150px;
            line-height: 135px;
            width: 150px
        }

        .avatar.avatar-160 {
            height: 160px;
            line-height: 144px;
            width: 160px
        }

        .avatar.avatar-170 {
            height: 170px;
            line-height: 153px;
            width: 170px
        }

        .avatar.avatar-180 {
            height: 180px;
            line-height: 162px;
            width: 180px
        }

        .avatar.avatar-190 {
            height: 190px;
            line-height: 171px;
            width: 190px
        }

        .avatar.avatar-200 {
            height: 200px;
            line-height: 180px;
            width: 200px
        }

        .avatar.avatar-18 {
            height: 18px;
            line-height: 16px;
            width: 18px
        }

        .avatar.avatar-28 {
            height: 28px;
            line-height: 26px;
            width: 28px
        }