.bottom-to-top { transform-origin:center top; -webkit-transform-origin:center top; transform:translateY(0px); -webkit-transform:translateY(0px); opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.bottom-to-top.off { transform:translateY(100px); -webkit-transform:translateY(100px); opacity:0; -webkit-opacity:0;}

.top-to-bottom { transform-origin:center top; -webkit-transform-origin:center top; transform:translateY(0px); -webkit-transform:translateY(0px); opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.top-to-bottom.off { transform:translateY(-300px); -webkit-transform:translateY(-300px); opacity:0; -webkit-opacity:0;}

.left-to-right { transform-origin:center center; -webkit-transform-origin:center center; transform:translateX(0px); -webkit-transform:translateX(0px); opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.left-to-right.off { transform:translateX(-200px); -webkit-transform:translateX(-200px); opacity:0; -webkit-opacity:0;}

.right-to-left { transform-origin:center center; -webkit-transform-origin:center center; transform:translateX(0px); -webkit-transform:translateX(0px); opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.right-to-left.off { transform:translateX(200px); -webkit-transform:translateX(200px); opacity:0; -webkit-opacity:0;}

.scale-up { transform-origin:center center; -webkit-transform-origin:center center; transform:scale(1,1); -webkit-transform:scale(1,1); opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.scale-up.off { transform:scale(0.3,0.3); -webkit-transform:scale(0.3,0.3); opacity:0; -webkit-opacity:0;}

.scale-down { transform-origin:center center; -webkit-transform-origin:center center; transform:scale(1,1); -webkit-transform:scale(1,1); opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.scale-down.off { transform:scale(1.8,1.8); -webkit-transform:scale(1.8,1.8); opacity:0; -webkit-opacity:0;}

.rotate-cw { transform-origin:center center; -webkit-transform-origin:center center; transform:rotate(0deg); -webkit-transform:rotate(0deg); opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.rotate-cw.off { transform:rotate(-90deg); -webkit-transform:rotate(-90deg); opacity:0; -webkit-opacity:0;}

.rotate-ccw { transform-origin:center center; -webkit-transform-origin:center center; transform:rotate(0deg); -webkit-transform:rotate(0deg); opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.rotate-ccw.off { transform:rotate(90deg); -webkit-transform:rotate(90deg); opacity:0; -webkit-opacity:0;}

.fade-in { opacity:1; -webkit-opacity:1; transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1); -webkit-transition:all 0.5s cubic-bezier(0.1,0.9,0.6,1);}
.fade-in.off { opacity:0; -webkit-opacity:0;}