div.avatar {
    /* cambia estos dos valores para definir el tamaño de tu círculo */
    height: 100px;
    width: 100px;
    /* los siguientes valores son independientes del tamaño del círculo */
    border-radius: 50%;
    background-repeat: no-repeat;
    background-position: center;
    
    background-size: cover;
    
}
.is-invalid{
    border-color: red;
}
.is-valid{
    border-color: #28a745;
}