|
@@ -0,0 +1,121 @@
|
|
|
|
+.slide-in-top {
|
|
|
|
+ -webkit-animation: slide-in-top 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
|
|
|
|
+ animation: slide-in-top 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+@-webkit-keyframes slide-in-top {
|
|
|
|
+ 0% {
|
|
|
|
+ -webkit-transform: translateY(-100px);
|
|
|
|
+ transform: translateY(-100px);
|
|
|
|
+ opacity: 0;
|
|
|
|
+ }
|
|
|
|
+ 100% {
|
|
|
|
+ -webkit-transform: translateY(0);
|
|
|
|
+ transform: translateY(0);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+@keyframes slide-in-top {
|
|
|
|
+ 0% {
|
|
|
|
+ -webkit-transform: translateY(-100px);
|
|
|
|
+ transform: translateY(-100px);
|
|
|
|
+ opacity: 0;
|
|
|
|
+ }
|
|
|
|
+ 100% {
|
|
|
|
+ -webkit-transform: translateY(0);
|
|
|
|
+ transform: translateY(0);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.rotate-in-2-cw {
|
|
|
|
+ -webkit-animation: rotate-in-2-cw 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
|
|
|
|
+ both;
|
|
|
|
+ animation: rotate-in-2-cw 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+@-webkit-keyframes rotate-in-2-cw {
|
|
|
|
+ 0% {
|
|
|
|
+ -webkit-transform: rotate(-45deg);
|
|
|
|
+ transform: rotate(-45deg);
|
|
|
|
+ opacity: 0;
|
|
|
|
+ }
|
|
|
|
+ 100% {
|
|
|
|
+ -webkit-transform: rotate(0);
|
|
|
|
+ transform: rotate(0);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+@keyframes rotate-in-2-cw {
|
|
|
|
+ 0% {
|
|
|
|
+ -webkit-transform: rotate(-45deg);
|
|
|
|
+ transform: rotate(-45deg);
|
|
|
|
+ opacity: 0;
|
|
|
|
+ }
|
|
|
|
+ 100% {
|
|
|
|
+ -webkit-transform: rotate(0);
|
|
|
|
+ transform: rotate(0);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.fade-in-fwd {
|
|
|
|
+ -webkit-animation: fade-in-fwd 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) both;
|
|
|
|
+ animation: fade-in-fwd 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) both;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+@-webkit-keyframes fade-in-fwd {
|
|
|
|
+ 0% {
|
|
|
|
+ -webkit-transform: translateZ(-80px);
|
|
|
|
+ transform: translateZ(-80px);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+ 100% {
|
|
|
|
+ -webkit-transform: translateZ(0);
|
|
|
|
+ transform: translateZ(0);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+@keyframes fade-in-fwd {
|
|
|
|
+ 0% {
|
|
|
|
+ -webkit-transform: translateZ(-80px);
|
|
|
|
+ transform: translateZ(-80px);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+ 100% {
|
|
|
|
+ -webkit-transform: translateZ(0);
|
|
|
|
+ transform: translateZ(0);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.scale-in-center {
|
|
|
|
+ -webkit-animation: scale-in-center 0.85s cubic-bezier(0.25, 0.46, 0.45, 0.94)
|
|
|
|
+ both;
|
|
|
|
+ animation: scale-in-center 0.85s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+@-webkit-keyframes scale-in-center {
|
|
|
|
+ 0% {
|
|
|
|
+ -webkit-transform: scale(0.85);
|
|
|
|
+ transform: scale(0.85);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+ 100% {
|
|
|
|
+ -webkit-transform: scale(1);
|
|
|
|
+ transform: scale(1);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+@keyframes scale-in-center {
|
|
|
|
+ 0% {
|
|
|
|
+ -webkit-transform: scale(0.85);
|
|
|
|
+ transform: scale(0.85);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+ 100% {
|
|
|
|
+ -webkit-transform: scale(1);
|
|
|
|
+ transform: scale(1);
|
|
|
|
+ opacity: 1;
|
|
|
|
+ }
|
|
|
|
+}
|