/* This fires as soon as the element enters the dom */
.list-transition-enter {
    height: 0px;
    margin-top: 14px;
}
/* This is where we can add the transition*/
.list-transition-enter-active {
    height: 34px;
    margin-top: 0px;
    transition: all 300ms ease-in;
}


/* This fires as soon as item is removed */
.list-transition-exit {
    margin-top: 0px;
    opacity : 1;
    height: 34px;
}
/* fires as element leaves the DOM*/
.list-transition-exit-active {    
    height: 0px;
    opacity : 0px;
    transition: all 300ms ease-in;
}