$plugin-height: 66px; /* Fade in down ------------------------------------ */ @-webkit-keyframes fadeInDown { 0% { -webkit-transform: translateY(-$plugin-height); transform: translateY(-$plugin-height); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown { 0% { -webkit-transform: translateY(-$plugin-height); -ms-transform: translateY(-$plugin-height); transform: translateY(-$plugin-height); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .cc_container, .cc_message, .cc_btn { -webkit-animation-duration: 0.6s; animation-duration: 0.6s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 0.8s; -moz-animation-duration: 0.8s; -o-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInDown; animation-name: fadeInDown; }