.mblSwirl.mblOut { -webkit-animation-duration: .5s; -webkit-animation-name: mblSwirlOut; -webkit-animation-timing-function: ease-in; } .mblSwirl.mblIn { z-index: -100; -webkit-animation-duration: .5s; -webkit-animation-name: mblSwirlIn; -webkit-animation-timing-function: ease-in; } .mblSwirl.mblOut.mblReverse { -webkit-animation-name: mblSwirlOutReverse; } @-webkit-keyframes mblSwirlOut { from { -webkit-transform: rotate(0deg) scale(1.0); } to { -webkit-transform: rotate(-360deg) scale(0.0); } } @-webkit-keyframes mblSwirlOutReverse { from { -webkit-transform: rotate(0deg) scale(1.0); } to { -webkit-transform: rotate(360deg) scale(0.0); } } @-webkit-keyframes mblSwirlIn { from { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(1.0); } }