.fromTopIn {
transition:transform 1s ease,opacity 1s ease;
transform:translate(0,0);
opacity:1
}

.fromTopOut {
transition:transform 1s ease,opacity 1s ease;
transform:translate(0,-10px);
opacity:0
}

.fromBottomIn {
transition:transform 1s ease,opacity 1s ease;
transform:translate(0,0);
opacity:1
}

.fromBottomOut {
transition:transform 1s ease,opacity 1s ease;
transform:translate(0,10px);
opacity:0
}

.fromLeftIn {
transition:transform 1s ease,opacity 1s ease;
transform:translate(0,0);
opacity:1
}

.fromLeftOut {
transition:transform 1s ease,opacity 1s ease;
transform:translate(-10px,0);
opacity:0
}

.fromRightIn {
transition:transform 1s ease,opacity 1s ease;
transform:translate(0,0);
opacity:1
}

.fromRightOut {
transition:transform 1s ease,opacity 1s ease;
transform:translate(10px,0);
opacity:0
}

.scaleUpIn {
transition:transform 1s ease,opacity 1s ease;
transform:scale(1.0,1.0);
opacity:1
}

.scaleUpOut {
transition:transform 1s ease,opacity 1s ease;
transform:scale(1.3,1.3);
opacity:0
}

.scaleDownIn {
transition:transform 1s ease,opacity 1s ease;
transform:scale(1.0,1.0);
opacity:1
}

.scaleDownOut {
transition:transform 1s ease,opacity 1s ease;
transform:scale(0.7,0.7);
opacity:0
}