.avatars {
    .avatar {
      width: 100%;
      height: 100%;
      position: relative;
      background: #EEE;

        .avatar-ball {
            border-radius: 99px;
            background-color: white;
            width: 50px;
            height: 50px;
            border: 3px solid white;
            position: absolute;
            background-size: 50px;
        
        }

        @for $i from 0 through 5 {
            .ball-#{$i} {
                background-image: url("#{$i}.jpg");
            }
        }

    }
}