smart-z
commented
6 years ago @keyframes animlogo{0%{stroke-opacity: .6} 15%{fill: transparent} 55%{stroke-dashoffset: 0;stroke-opacity: 1} to{fill: #3e3e3e;stroke-dashoffset: 0}} @keyframes heart-it{0%{stroke-opacity: 0} to{stroke-opacity: 1;fill: #3e3e3e}} @keyframes heartbeat{0%{transform: scale(1);transform-origin: center center;animation-timing-function: ease-out;} 10%{transform: scale(.91);animation-timing-function: ease-in;} 17%{transform: scale(.98);animation-timing-function: ease-out;} 33%{transform: scale(.87);animation-timing-function: ease-in;} 40%{transform: scale(1);animation-timing-function: ease-out;}} @keyframes slide-out-left-alt{0%{transform: translateX(0);opacity: 1} to{transform: translateX(-120%);opacity: 1}} @keyframes slide-out-right-alt{0%{transform: translateX(0);opacity: 1} to{transform: translateX(120%);opacity: 1}} @keyframes slide-in-left-alt{0%{transform: translateX(120%);opacity: 1} to{transform: translateX(0);opacity: 1}} @keyframes slide-in-right-alt{0%{transform: translateX(-120%);opacity: 1} to{transform: translateX(0);opacity: 1}} @keyframes animlogo{15%{fill: transparent} 55%{stroke-dashoffset: 0} to{fill: #3e3e3e;stroke-dashoffset: 0}} @keyframes simple-fade-in{0%{opacity: 0} to{opacity: 1}} @keyframes simple-fade-out{0%{opacity: 1} to{opacity: 0}} @keyframes scale-up-bl{0%{transform: scale(.5);transform-origin: 0% 100%} to{transform: scale(1);transform-origin: 0% 100%}} @keyframes scale-up-br{0%{transform: scale(.5);transform-origin: 100% 100%} to{transform: scale(1);transform-origin: 100% 100%}} @keyframes scale-up-bottom{0%{transform: scale(.5);transform-origin: 50% 100%} to{transform: scale(1);transform-origin: 50% 100%}} @keyframes scale-up-center{0%{transform: scale(.5)} to{transform: scale(1)}} @keyframes scale-up-hor-center{0%{transform: scaleX(.4)} to{transform: scaleX(1)}} @keyframes scale-up-hor-left{0%{transform: scaleX(.4);transform-origin: 0% 0%} to{transform: scaleX(1);transform-origin: 0% 0%}} @keyframes scale-up-hor-right{0%{transform: scaleX(.4);transform-origin: 100% 100%} to{transform: scaleX(1);transform-origin: 100% 100%}} @keyframes scale-up-left{0%{transform: scale(.5);transform-origin: 0% 50%} to{transform: scale(1);transform-origin: 0% 50%}} @keyframes scale-up-right{0%{transform: scale(.5);transform-origin: 100% 50%} to{transform: scale(1);transform-origin: 100% 50%}} @keyframes scale-up-tl{0%{transform: scale(.5);transform-origin: 0% 0%} to{transform: scale(1);transform-origin: 0% 0%}} @keyframes scale-up-tr{0%{transform: scale(.5);transform-origin: 100% 0%} to{transform: scale(1);transform-origin: 100% 0%}} @keyframes scale-up-top{0%{transform: scale(.5);transform-origin: 50% 0%} to{transform: scale(1);transform-origin: 50% 0%}} @keyframes scale-up-ver-bottom{0%{transform: scaleY(.4);transform-origin: 0% 100%} to{transform: scaleY(1);transform-origin: 0% 100%}} @keyframes scale-up-ver-center{0%{transform: scaleY(.4)} to{transform: scaleY(1)}} @keyframes scale-up-ver-top{0%{transform: scaleY(.4);transform-origin: 100% 0%} to{transform: scaleY(1);transform-origin: 100% 0%}} @keyframes scale-down-bl{0%{transform: scale(1);transform-origin: 0% 100%} to{transform: scale(.5);transform-origin: 0% 100%}} @keyframes scale-down-br{0%{transform: scale(1);transform-origin: 100% 100%} to{transform: scale(.5);transform-origin: 100% 100%}} @keyframes scale-down-bottom{0%{transform: scale(1);transform-origin: 50% 100%} to{transform: scale(.5);transform-origin: 50% 100%}} @keyframes scale-down-center{0%{transform: scale(1)} to{transform: scale(.5)}} @keyframes scale-down-hor-center{0%{transform: scaleX(1)} to{transform: scaleX(.3)}} @keyframes scale-down-hor-left{0%{transform: scaleX(1);transform-origin: 0% 0%} to{transform: scaleX(.3);transform-origin: 0% 0%}} @keyframes scale-down-hor-right{0%{transform: scaleX(1);transform-origin: 100% 100%} to{transform: scaleX(.3);transform-origin: 100% 100%}} @keyframes scale-down-left{0%{transform: scale(1);transform-origin: 0% 50%} to{transform: scale(.5);transform-origin: 0% 50%}} @keyframes scale-down-right{0%{transform: scale(1);transform-origin: 100% 50%} to{transform: scale(.5);transform-origin: 100% 50%}} @keyframes scale-down-tl{0%{transform: scale(1);transform-origin: 0% 0%} to{transform: scale(.5);transform-origin: 0% 0%}} @keyframes scale-down-tr{0%{transform: scale(1);transform-origin: 100% 0%} to{transform: scale(.5);transform-origin: 100% 0%}} @keyframes scale-down-top{0%{transform: scale(1);transform-origin: 50% 0%} to{transform: scale(.5);transform-origin: 50% 0%}} @keyframes scale-down-ver-bottom{0%{transform: scaleY(1);transform-origin: 0% 100%} to{transform: scaleY(.3);transform-origin: 0% 100%}} @keyframes scale-down-ver-center{0%{transform: scaleY(1)} to{transform: scaleY(.3)}} @keyframes scale-down-ver-top{0%{transform: scaleY(1);transform-origin: 100% 0%} to{transform: scaleY(.3);transform-origin: 100% 0%}} @keyframes rotate-bl{0%{transform: rotate(0);transform-origin: bottom left} to{transform: rotate(360deg);transform-origin: bottom left}} @keyframes rotate-bottom{0%{transform: rotate(0);transform-origin: bottom} to{transform: rotate(360deg);transform-origin: bottom}} @keyframes rotate-br{0%{transform: rotate(0);transform-origin: bottom right} to{transform: rotate(360deg);transform-origin: bottom right}} @keyframes rotate-center{0%{transform: rotate(0)} to{transform: rotate(360deg)}} @keyframes rotate-diagonal-1{0%{transform: rotate3d(1, 1, 0, 0deg)} 50%{transform: rotate3d(1, 1, 0, -180deg)} to{transform: rotate3d(1, 1, 0, -360deg)}} @keyframes rotate-diagonal-2{0%{transform: rotate3d(-1, 1, 0, 0deg)} 50%{transform: rotate3d(-1, 1, 0, 180deg)} to{transform: rotate3d(-1, 1, 0, 360deg)}} @keyframes rotate-diagonal-bl{0%{transform: rotate3d(1, 1, 0, 0deg);transform-origin: 0% 100%} 50%{transform: rotate3d(1, 1, 0, 180deg);transform-origin: 0% 100%} to{transform: rotate3d(1, 1, 0, 360deg);transform-origin: 0% 100%}} @keyframes rotate-diagonal-br{0%{transform: rotate3d(-1, 1, 0, 0deg);transform-origin: 100% 100%} 50%{transform: rotate3d(-1, 1, 0, -180deg);transform-origin: 100% 100%} to{transform: rotate3d(-1, 1, 0, -360deg);transform-origin: 100% 100%}} @keyframes rotate-diagonal-tl{0%{transform: rotate3d(-1, 1, 0, 0deg);transform-origin: 0% 0%} 50%{transform: rotate3d(-1, 1, 0, 180deg);transform-origin: 0% 0%} to{transform: rotate3d(-1, 1, 0, 360deg);transform-origin: 0% 0%}} @keyframes rotate-diagonal-tr{0%{transform: rotate3d(1, 1, 0, 0deg);transform-origin: 100% 0%} 50%{transform: rotate3d(1, 1, 0, -180deg);transform-origin: 100% 0%} to{transform: rotate3d(1, 1, 0, -360deg);transform-origin: 100% 0%}} @keyframes rotate-hor-bottom{0%{transform: rotateX(0);transform-origin: bottom} to{transform: rotateX(360deg);transform-origin: bottom}} @keyframes rotate-hor-center{0%{transform: rotateX(0)} to{transform: rotateX(-360deg)}} @keyframes rotate-hor-top{0%{transform: rotateX(0);transform-origin: top} to{transform: rotateX(-360deg);transform-origin: top}} @keyframes rotate-left{0%{transform: rotate(0);transform-origin: left} to{transform: rotate(360deg);transform-origin: left}} @keyframes rotate-right{0%{transform: rotate(0);transform-origin: right} to{transform: rotate(360deg);transform-origin: right}} @keyframes rotate-tl{0%{transform: rotate(0);transform-origin: top left} to{transform: rotate(360deg);transform-origin: top left}} @keyframes rotate-top{0%{transform: rotate(0);transform-origin: top} to{transform: rotate(360deg);transform-origin: top}} @keyframes rotate-tr{0%{transform: rotate(0);transform-origin: top right} to{transform: rotate(360deg);transform-origin: top right}} @keyframes rotate-vert-center{0%{transform: rotateY(0)} to{transform: rotateY(360deg)}} @keyframes rotate-vert-left{0%{transform: rotateY(0);transform-origin: left} to{transform: rotateY(360deg);transform-origin: left}} @keyframes rotate-vert-right{0%{transform: rotateY(0);transform-origin: right} to{transform: rotateY(-360deg);transform-origin: right}} @keyframes rotate-scale-down-diag-1{0%{transform: scale(1) rotate3d(1, 1, 0, 0deg)} 50%{transform: scale(.5) rotate3d(1, 1, 0, -180deg)} to{transform: scale(1) rotate3d(1, 1, 0, -360deg)}} @keyframes rotate-scale-down-diag-2{0%{transform: scale(1) rotate3d(-1, 1, 0, 0deg)} 50%{transform: scale(.5) rotate3d(-1, 1, 0, 180deg)} to{transform: scale(1) rotate3d(-1, 1, 0, 360deg)}} @keyframes rotate-scale-down-hor{0%{transform: scale(1) rotateX(0)} 50%{transform: scale(.5) rotateX(-180deg)} to{transform: scale(1) rotateX(-360deg)}} @keyframes rotate-scale-down-ver{0%{transform: scale(1) rotateY(0)} 50%{transform: scale(.5) rotateY(180deg)} to{transform: scale(1) rotateY(360deg)}} @keyframes rotate-scale-down{0%{transform: scale(1) rotateZ(0)} 50%{transform: scale(.5) rotateZ(180deg)} to{transform: scale(1) rotateZ(360deg)}} @keyframes rotate-scale-up-diag-1{0%{transform: scale(1) rotate3d(1, 1, 0, 0deg)} 50%{transform: scale(2) rotate3d(1, 1, 0, -180deg)} to{transform: scale(1) rotate3d(1, 1, 0, -360deg)}} @keyframes rotate-scale-up-diag-2{0%{transform: scale(1) rotate3d(-1, 1, 0, 0deg)} 50%{transform: scale(2) rotate3d(-1, 1, 0, 180deg)} to{transform: scale(1) rotate3d(-1, 1, 0, 360deg)}} @keyframes rotate-scale-up-hor{0%{transform: scale(1) rotateX(0)} 50%{transform: scale(2) rotateX(-180deg)} to{transform: scale(1) rotateX(-360deg)}} @keyframes rotate-scale-up-ver{0%{transform: scale(1) rotateY(0)} 50%{transform: scale(2) rotateY(180deg)} to{transform: scale(1) rotateY(360deg)}} @keyframes rotate-scale-up{0%{transform: scale(1) rotateZ(0)} 50%{transform: scale(2) rotateZ(180deg)} to{transform: scale(1) rotateZ(360deg)}} @keyframes rotate-90-bl-ccw{0%{transform: rotate(0);transform-origin: 0% 100%} to{transform: rotate(-90deg);transform-origin: 0% 100%}} @keyframes rotate-90-bl-cw{0%{transform: rotate(0);transform-origin: 0% 100%} to{transform: rotate(90deg);transform-origin: 0% 100%}} @keyframes rotate-90-bottom-ccw{0%{transform: rotate(0);transform-origin: bottom} to{transform: rotate(-90deg);transform-origin: bottom}} @keyframes rotate-90-bottom-cw{0%{transform: rotate(0);transform-origin: bottom} to{transform: rotate(90deg);transform-origin: bottom}} @keyframes rotate-90-br-ccw{0%{transform: rotate(0);transform-origin: 100% 100%} to{transform: rotate(-90deg);transform-origin: 100% 100%}} @keyframes rotate-90-br-cw{0%{transform: rotate(0);transform-origin: 100% 100%} to{transform: rotate(90deg);transform-origin: 100% 100%}} @keyframes rotate-90-ccw{0%{transform: rotate(0)} to{transform: rotate(-90deg)}} @keyframes rotate-90-cw{0%{transform: rotate(0)} to{transform: rotate(90deg)}} @keyframes rotate-90-horizontal-bck{0%{transform: rotateX(0)} to{transform: rotateX(-90deg)}} @keyframes rotate-90-horizontal-fwd{0%{transform: rotateX(0)} to{transform: rotateX(90deg)}} @keyframes rotate-90-left-ccw{0%{transform: rotate(0);transform-origin: left} to{transform: rotate(-90deg);transform-origin: left}} @keyframes rotate-90-left-cw{0%{transform: rotate(0);transform-origin: left} to{transform: rotate(90deg);transform-origin: left}} @keyframes rotate-90-right-ccw{0%{transform: rotate(0);transform-origin: right} to{transform: rotate(-90deg);transform-origin: right}} @keyframes rotate-90-right-cw{0%{transform: rotate(0);transform-origin: right} to{transform: rotate(90deg);transform-origin: right}} @keyframes rotate-90-tl-ccw{0%{transform: rotate(0);transform-origin: 0% 0%} to{transform: rotate(-90deg);transform-origin: 0% 0%}} @keyframes rotate-90-tl-cw{0%{transform: rotate(0);transform-origin: 0% 0%} to{transform: rotate(90deg);transform-origin: 0% 0%}} @keyframes rotate-90-top-ccw{0%{transform: rotate(0);transform-origin: top} to{transform: rotate(-90deg);transform-origin: top}} @keyframes rotate-90-top-cw{0%{transform: rotate(0);transform-origin: top} to{transform: rotate(90deg);transform-origin: top}} @keyframes rotate-90-tr-ccw{0%{transform: rotate(0);transform-origin: top right} to{transform: rotate(-90deg);transform-origin: top right}} @keyframes rotate-90-tr-cw{0%{transform: rotate(0);transform-origin: top right} to{transform: rotate(90deg);transform-origin: top right}} @keyframes rotate-90-vertical-bck{0%{transform: rotateY(0)} to{transform: rotateY(-90deg)}} @keyframes rotate-90-vertical-fwd{0%{transform: rotateY(0)} to{transform: rotateY(90deg)}} @keyframes flip-diagonal-1-tr{0%{transform: rotate3d(1, 1, 0, 0deg)} to{transform: rotate3d(1, 1, 0, 180deg)}} @keyframes flip-diagonal-1-bl{0%{transform: rotate3d(1, 1, 0, 0deg)} to{transform: rotate3d(1, 1, 0, -180deg)}} @keyframes flip-diagonal-1-bck{0%{transform: translateZ(0) rotate3d(1, 1, 0, 0deg)} to{transform: translateZ(-260px) rotate3d(1, 1, 0, -180deg)}} @keyframes flip-diagonal-1-fwd{0%{transform: translateZ(0) rotate3d(1, 1, 0, 0deg)} to{transform: translateZ(160px) rotate3d(1, 1, 0, 180deg)}} @keyframes flip-diagonal-2-br{0%{transform: rotate3d(-1, 1, 0, 0deg)} to{transform: rotate3d(-1, 1, 0, 180deg)}} @keyframes flip-diagonal-2-tl{0%{transform: rotate3d(-1, 1, 0, 0deg)} to{transform: rotate3d(-1, 1, 0, -180deg)}} @keyframes flip-diagonal-2-bck{0%{transform: translateZ(0) rotate3d(-1, 1, 0, 0deg)} to{transform: translateZ(-260px) rotate3d(-1, 1, 0, -180deg)}} @keyframes flip-diagonal-2-fwd{0%{transform: translateZ(0) rotate3d(-1, 1, 0, 0deg)} to{transform: translateZ(160px) rotate3d(-1, 1, 0, 180deg)}} @keyframes flip-horizontal-bottom{0%{transform: rotateX(0)} to{transform: rotateX(-180deg)}} @keyframes flip-horizontal-top{0%{transform: rotateX(0)} to{transform: rotateX(180deg)}} @keyframes flip-horizontal-bck{0%{transform: translateZ(0) rotateX(0)} to{transform: translateZ(-260px) rotateX(180deg)}} @keyframes flip-horizontal-fwd{0%{transform: translateZ(0) rotateX(0)} to{transform: translateZ(160px) rotateX(-180deg)}} @keyframes flip-vertical-right{0%{transform: rotateY(0)} to{transform: rotateY(180deg)}} @keyframes flip-vertical-left{0%{transform: rotateY(0)} to{transform: rotateY(-180deg)}} @keyframes flip-vertical-bck{0%{transform: translateZ(0) rotateY(0)} to{transform: translateZ(-260px) rotateY(-180deg)}} @keyframes flip-vertical-fwd{0%{transform: translateZ(0) rotateY(0)} to{transform: translateZ(160px) rotateY(180deg)}} @keyframes flip-2-hor-bottom-1{0%{transform: translateY(0) rotateX(0);transform-origin: 50% 100%} to{transform: translateY(100%) rotateX(180deg);transform-origin: 50% 0%}} @keyframes flip-2-hor-bottom-2{0%{transform: translateY(0) rotateX(0);transform-origin: 50% 100%} to{transform: translateY(100%) rotateX(-180deg);transform-origin: 50% 0%}} @keyframes flip-2-hor-bottom-bck{0%{transform: translateY(0) translateZ(0) rotateX(0);transform-origin: 50% 100%} to{transform: translateY(100%) translateZ(-260px) rotateX(-180deg);transform-origin: 50% 0%}} @keyframes flip-2-hor-bottom-fwd{0%{transform: translateY(0) translateZ(0) rotateX(0);transform-origin: 50% 100%} to{transform: translateY(100%) translateZ(160px) rotateX(180deg);transform-origin: 50% 0%}} @keyframes flip-2-hor-top-1{0%{transform: translateY(0) rotateX(0);transform-origin: 50% 0%} to{transform: translateY(-100%) rotateX(-180deg);transform-origin: 50% 100%}} @keyframes flip-2-hor-top-2{0%{transform: translateY(0) rotateX(0);transform-origin: 50% 0%} to{transform: translateY(-100%) rotateX(180deg);transform-origin: 50% 100%}} @keyframes flip-2-hor-top-bck{0%{transform: translateY(0) translateZ(0) rotateX(0);transform-origin: 50% 0%} to{transform: translateY(-100%) translateZ(-260px) rotateX(180deg);transform-origin: 50% 100%}} @keyframes flip-2-hor-top-fwd{0%{transform: translateY(0) translateZ(0) rotateX(0);transform-origin: 50% 0%} to{transform: translateY(-100%) translateZ(160px) rotateX(-180deg);transform-origin: 50% 100%}} @keyframes flip-2-ver-left-1{0%{transform: translateX(0) rotateY(0);transform-origin: 0% 50%} to{transform: translateX(-100%) rotateY(180deg);transform-origin: 100% 0%}} @keyframes flip-2-ver-left-2{0%{transform: translateX(0) rotateY(0);transform-origin: 0% 50%} to{transform: translateX(-100%) rotateY(-180deg);transform-origin: 100% 0%}} @keyframes flip-2-ver-left-bck{0%{transform: translateX(0) translateZ(0) rotateY(0);transform-origin: 0% 50%} to{transform: translateX(-100%) translateZ(-260px) rotateY(-180deg);transform-origin: 100% 0%}} @keyframes flip-2-ver-left-fwd{0%{transform: translateX(0) translateZ(0) rotateY(0);transform-origin: 0% 50%} to{transform: translateX(-100%) translateZ(160px) rotateY(180deg);transform-origin: 100% 0%}} @keyframes flip-2-ver-right-1{0%{transform: translateX(0) rotateY(0);transform-origin: 100% 50%} to{transform: translateX(100%) rotateY(-180deg);transform-origin: 0% 50%}} @keyframes flip-2-ver-right-2{0%{transform: translateX(0) rotateY(0);transform-origin: 100% 50%} to{transform: translateX(100%) rotateY(180deg);transform-origin: 0% 50%}} @keyframes flip-2-ver-right-bck{0%{transform: translateX(0) translateZ(0) rotateY(0);transform-origin: 100% 50%} to{transform: translateX(100%) translateZ(-260px) rotateY(180deg);transform-origin: 0% 50%}} @keyframes flip-2-ver-right-fwd{0%{transform: translateX(0) translateZ(0) rotateY(0);transform-origin: 100% 50%} to{transform: translateX(100%) translateZ(160px) rotateY(-180deg);transform-origin: 0% 50%}} @keyframes flip-scale-up-hor{0%{transform: scale(1) rotateX(0)} 50%{transform: scale(2.5) rotateX(-90deg)} to{transform: scale(1) rotateX(-180deg)}} @keyframes flip-scale-down-hor{0%{transform: scale(1) rotateX(0)} 50%{transform: scale(.4) rotateX(90deg)} to{transform: scale(1) rotateX(180deg)}} @keyframes flip-scale-up-ver{0%{transform: scale(1) rotateY(0)} 50%{transform: scale(2.5) rotateY(90deg)} to{transform: scale(1) rotateY(180deg)}} @keyframes flip-scale-down-ver{0%{transform: scale(1) rotateY(0)} 50%{transform: scale(.4) rotateY(-90deg)} to{transform: scale(1) rotateY(-180deg)}} @keyframes flip-scale-up-diag-1{0%{transform: scale(1) rotate3d(1, 1, 0, 0deg)} 50%{transform: scale(2.5) rotate3d(1, 1, 0, 90deg)} to{transform: scale(1) rotate3d(1, 1, 0, 180deg)}} @keyframes flip-scale-down-diag-1{0%{transform: scale(1) rotate3d(1, 1, 0, 0deg)} 50%{transform: scale(.4) rotate3d(1, 1, 0, -90deg)} to{transform: scale(1) rotate3d(1, 1, 0, -180deg)}} @keyframes flip-scale-up-diag-2{0%{transform: scale(1) rotate3d(-1, 1, 0, 0deg)} 50%{transform: scale(2.5) rotate3d(-1, 1, 0, 90deg)} to{transform: scale(1) rotate3d(-1, 1, 0, 180deg)}} @keyframes flip-scale-down-diag-2{0%{transform: scale(1) rotate3d(-1, 1, 0, 0deg)} 50%{transform: scale(.4) rotate3d(-1, 1, 0, -90deg)} to{transform: scale(1) rotate3d(-1, 1, 0, -180deg)}} @keyframes flip-scale-2-hor-bottom{0%{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% 100%} 50%{transform: translateY(50%) rotateX(90deg) scale(2);transform-origin: 50% 50%} to{transform: translateY(100%) rotateX(180deg) scale(1);transform-origin: 50% 0%}} @keyframes flip-scale-2-hor-top{0%{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% 0%} 50%{transform: translateY(-50%) rotateX(-90deg) scale(2);transform-origin: 50% 50%} to{transform: translateY(-100%) rotateX(-180deg) scale(1);transform-origin: 50% 100%}} @keyframes flip-scale-2-ver-left{0%{transform: translateX(0) rotateY(0) scale(1);transform-origin: 0% 50%} 50%{transform: translateX(-50%) rotateY(90deg) scale(2);transform-origin: 50% 50%} to{transform: translateX(-100%) rotateY(180deg) scale(1);transform-origin: 100% 50%}} @keyframes flip-scale-2-ver-right{0%{transform: translateX(0) rotateY(0) scale(1);transform-origin: 100% 50%} 50%{transform: translateX(50%) rotateY(-90deg) scale(2);transform-origin: 50% 50%} to{transform: translateX(100%) rotateY(-180deg) scale(1);transform-origin: 0% 50%}} @keyframes swing-bottom-bck{0%{transform: rotateX(0);transform-origin: bottom} to{transform: rotateX(180deg);transform-origin: bottom}} @keyframes swing-bottom-fwd{0%{transform: rotateX(0);transform-origin: bottom} to{transform: rotateX(-180deg);transform-origin: bottom}} @keyframes swing-bottom-left-bck{0%{transform: rotate3d(1, 1, 0, 0deg);transform-origin: 0% 100%} to{transform: rotate3d(1, 1, 0, 180deg);transform-origin: 0% 100%}} @keyframes swing-bottom-left-fwd{0%{transform: rotate3d(1, 1, 0, 0deg);transform-origin: 0% 100%} to{transform: rotate3d(1, 1, 0, -180deg);transform-origin: 0% 100%}} @keyframes swing-bottom-right-bck{0%{transform: rotate3d(-1, 1, 0, 0deg);transform-origin: 100% 100%} to{transform: rotate3d(-1, 1, 0, -180deg);transform-origin: 100% 100%}} @keyframes swing-bottom-right-fwd{0%{transform: rotate3d(-1, 1, 0, 0deg);transform-origin: 100% 100%} to{transform: rotate3d(-1, 1, 0, 180deg);transform-origin: 100% 100%}} @keyframes swing-left-bck{0%{transform: rotateY(0);transform-origin: left bottom} to{transform: rotateY(180deg);transform-origin: left bottom}} @keyframes swing-left-fwd{0%{transform: rotateY(0);transform-origin: left bottom} to{transform: rotateY(-180deg);transform-origin: left bottom}} @keyframes swing-right-bck{0%{transform: rotateY(0);transform-origin: right} to{transform: rotateY(-180deg);transform-origin: right}} @keyframes swing-right-fwd{0%{transform: rotateY(0);transform-origin: right} to{transform: rotateY(180deg);transform-origin: right}} @keyframes swing-top-bck{0%{transform: rotateX(0);transform-origin: top} to{transform: rotateX(-180deg);transform-origin: top}} @keyframes swing-top-fwd{0%{transform: rotateX(0);transform-origin: top} to{transform: rotateX(180deg);transform-origin: top}} @keyframes swing-top-left-bck{0%{transform: rotate3d(-1, 1, 0, 0deg);transform-origin: 0% 0%} to{transform: rotate3d(-1, 1, 0, 180deg);transform-origin: 0% 0%}} @keyframes swing-top-left-fwd{0%{transform: rotate3d(-1, 1, 0, 0deg);transform-origin: 0% 0%} to{transform: rotate3d(-1, 1, 0, -180deg);transform-origin: 0% 0%}} @keyframes swing-top-right-bck{0%{transform: rotate3d(1, 1, 0, 0deg);transform-origin: 100% 0%} to{transform: rotate3d(1, 1, 0, -180deg);transform-origin: 100% 0%}} @keyframes swing-top-right-fwd{0%{transform: rotate3d(1, 1, 0, 0deg);transform-origin: 100% 0%} to{transform: rotate3d(1, 1, 0, 180deg);transform-origin: 100% 0%}} @keyframes slide-bl{0%{transform: translateY(0) translateX(0)} to{transform: translateY(100px) translateX(-100px)}} @keyframes slide-bottom{0%{transform: translateY(0)} to{transform: translateY(100px)}} @keyframes slide-br{0%{transform: translateY(0) translateX(0)} to{transform: translateY(100px) translateX(100px)}} @keyframes slide-left{0%{transform: translateX(0)} to{transform: translateX(-100px)}} @keyframes slide-right{0%{transform: translateX(0)} to{transform: translateX(100px)}} @keyframes slide-tl{0%{transform: translateY(0) translateX(0)} to{transform: translateY(-100px) translateX(-100px)}} @keyframes slide-top{0%{transform: translateY(0)} to{transform: translateY(-100px)}} @keyframes slide-tr{0%{transform: translateY(0) translateX(0)} to{transform: translateY(-100px) translateX(100px)}} @keyframes slide-bck-bl{0%{transform: translateZ(0) translateY(0) translateX(0)} to{transform: translateZ(-400px) translateY(200px) translateX(-200px)}} @keyframes slide-bck-bottom{0%{transform: translateZ(0) translateY(0)} to{transform: translateZ(-400px) translateY(200px)}} @keyframes slide-bck-br{0%{transform: translateZ(0) translateY(0) translateX(0)} to{transform: translateZ(-400px) translateY(200px) translateX(200px)}} @keyframes slide-bck-center{0%{transform: translateZ(0)} to{transform: translateZ(-400px)}} @keyframes slide-bck-left{0%{transform: translateZ(0) translateX(0)} to{transform: translateZ(-400px) translateX(-200px)}} @keyframes slide-bck-right{0%{transform: translateZ(0) translateX(0)} to{transform: translateZ(-400px) translateX(200px)}} @keyframes slide-bck-tl{0%{transform: translateZ(0) translateY(0) translateX(0)} to{transform: translateZ(-400px) translateY(-200px) translateX(-200px)}} @keyframes slide-bck-top{0%{transform: translateZ(0) translateY(0)} to{transform: translateZ(-400px) translateY(-200px)}} @keyframes slide-bck-tr{0%{transform: translateZ(0) translateY(0) translateX(0)} to{transform: translateZ(-400px) translateY(-200px) translateX(200px)}} @keyframes slide-fwd-bl{0%{transform: translateZ(0) translateY(0) translateX(0)} to{transform: translateZ(160px) translateY(100px) translateX(-100px)}} @keyframes slide-fwd-bottom{0%{transform: translateZ(0) translateY(0)} to{transform: translateZ(160px) translateY(100px)}} @keyframes slide-fwd-br{0%{transform: translateZ(0) translateY(0) translateX(0)} to{transform: translateZ(160px) translateY(100px) translateX(100px)}} @keyframes slide-fwd-center{0%{transform: translateZ(0)} to{transform: translateZ(160px)}} @keyframes slide-fwd-left{0%{transform: translateZ(0) translateX(0)} to{transform: translateZ(160px) translateX(-100px)}} @keyframes slide-fwd-right{0%{transform: translateZ(0) translateX(0)} to{transform: translateZ(160px) translateX(100px)}} @keyframes slide-fwd-tl{0%{transform: translateZ(0) translateY(0) translateX(0)} to{transform: translateZ(160px) translateY(-100px) translateX(-100px)}} @keyframes slide-fwd-top{0%{transform: translateZ(0) translateY(0)} to{transform: translateZ(160px) translateY(-100px)}} @keyframes slide-fwd-tr{0%{transform: translateZ(0) translateY(0) translateX(0)} to{transform: translateZ(160px) translateY(-100px) translateX(100px)}} @keyframes slide-rotate-hor-b-bck{0%{transform: translateY(0) translateZ(0) rotateX(0deg);transform-origin: bottom center} to{transform: translateY(150px) translateZ(-230px) rotateX(90deg);transform-origin: bottom center}} @keyframes slide-rotate-hor-b-fwd{0%{transform: translateY(0) translateZ(0) rotateX(0deg);transform-origin: top center} to{transform: translateY(150px) translateZ(130px) rotateX(90deg);transform-origin: top center}} @keyframes slide-rotate-hor-bottom{0%{transform: translateY(0) rotateX(0deg)} to{transform: translateY(150px) rotateX(90deg)}} @keyframes slide-rotate-hor-t-bck{0%{transform: translateY(0) translateZ(0) rotateX(0deg);transform-origin: top center} to{transform: translateY(-150px) translateZ(-230px) rotateX(-90deg);transform-origin: top center}} @keyframes slide-rotate-hor-t-fwd{0%{transform: translateY(0) translateZ(0) rotateX(0deg);transform-origin: bottom center} to{transform: translateY(-150px) translateZ(130px) rotateX(-90deg);transform-origin: bottom center}} @keyframes slide-rotate-hor-top{0%{transform: translateY(0) rotateX(0deg)} to{transform: translateY(-150px) rotateX(-90deg)}} @keyframes slide-rotate-ver-l-bck{0%{transform: translateX(0) translateZ(0) rotateY(0);transform-origin: center left} to{transform: translateX(-150px) translateZ(-230px) rotateY(90deg);transform-origin: center left}} @keyframes slide-rotate-ver-l-fwd{0%{transform: translateX(0) translateZ(0) rotateY(0);transform-origin: center right} to{transform: translateX(-150px) translateZ(130px) rotateY(90deg);transform-origin: center right}} @keyframes slide-rotate-ver-left{0%{transform: translateX(0) rotateY(0)} to{transform: translateX(-150px) rotateY(90deg)}} @keyframes slide-rotate-ver-r-bck{0%{transform: translateX(0) translateZ(0) rotateY(0);transform-origin: center right} to{transform: translateX(150px) translateZ(-230px) rotateY(-90deg);transform-origin: center right}} @keyframes slide-rotate-ver-r-fwd{0%{transform: translateX(0) translateZ(0) rotateY(0);transform-origin: center left} to{transform: translateX(150px) translateZ(130px) rotateY(-90deg);transform-origin: center left}} @keyframes slide-rotate-ver-right{0%{transform: translateX(0) rotateY(0)} to{transform: translateX(150px) rotateY(-90deg)}} @keyframes shadow-drop-bl{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: -12px 12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-bottom{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: 0 12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-br{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: 12px 12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-center{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: 0 0 20px 0 rgba(0, 0, 0, .35)}} @keyframes shadow-drop-left{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: -12px 0 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-lr{0%{box-shadow: 0 0 0 0 transparent, 0 0 0 0 transparent} to{box-shadow: -12px 0 20px -12px rgba(0, 0, 0, .35), 12px 0 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-right{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: 12px 0 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-tb{0%{box-shadow: 0 0 0 0 transparent, 0 0 0 0 transparent} to{box-shadow: 0 -12px 20px -12px rgba(0, 0, 0, .35), 0 12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-tl{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: -12px -12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-top{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: 0 -12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-tr{0%{box-shadow: 0 0 0 0 transparent} to{box-shadow: 12px -12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-bl{0%{transform: translateZ(0) translateX(0) translateY(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px) translateX(12px) translateY(-12px);box-shadow: -12px 12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-bottom{0%{transform: translateZ(0) translateY(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px) translateY(-12px);box-shadow: 0 12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-br{0%{transform: translateZ(0) translateX(0) translateY(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px) translateX(-12px) translateY(-12px);box-shadow: 12px 12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-center{0%{transform: translateZ(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px);box-shadow: 0 0 20px 0 rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-left{0%{transform: translateZ(0) translateX(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px) translateX(12px);box-shadow: -12px 0 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-lr{0%{transform: translateZ(0);box-shadow: 0 0 0 0 transparent, 0 0 0 0 transparent} to{transform: translateZ(50px);box-shadow: -12px 0 20px -12px rgba(0, 0, 0, .35), 12px 0 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-right{0%{transform: translateZ(0) translateX(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px) translateX(-12px);box-shadow: 12px 0 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-tb{0%{transform: translateZ(0);box-shadow: 0 0 0 0 transparent, 0 0 0 0 transparent} to{transform: translateZ(50px);box-shadow: 0 -12px 20px -12px rgba(0, 0, 0, .35), 0 12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-tl{0%{transform: translateZ(0) translateX(0) translateY(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px) translateX(12px) translateY(12px);box-shadow: -12px -12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-top{0%{transform: translateZ(0) translateY(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px) translateY(12px);box-shadow: 0 -12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-drop-2-tr{0%{transform: translateZ(0) translateX(0) translateY(0);box-shadow: 0 0 0 0 transparent} to{transform: translateZ(50px) translateX(-12px) translateY(12px);box-shadow: 12px -12px 20px -12px rgba(0, 0, 0, .35)}} @keyframes shadow-pop-bl{0%{box-shadow: 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e;transform: translateX(0) translateY(0)} to{box-shadow: -1px 1px #3e3e3e, -2px 2px #3e3e3e, -3px 3px #3e3e3e, -4px 4px #3e3e3e, -5px 5px #3e3e3e, -6px 6px #3e3e3e, -7px 7px #3e3e3e, -8px 8px #3e3e3e;transform: translateX(8px) translateY(-8px)}} @keyframes shadow-pop-br{0%{box-shadow: 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e;transform: translateX(0) translateY(0)} to{box-shadow: 1px 1px #3e3e3e, 2px 2px #3e3e3e, 3px 3px #3e3e3e, 4px 4px #3e3e3e, 5px 5px #3e3e3e, 6px 6px #3e3e3e, 7px 7px #3e3e3e, 8px 8px #3e3e3e;transform: translateX(-8px) translateY(-8px)}} @keyframes shadow-pop-tl{0%{box-shadow: 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e;transform: translateX(0) translateY(0)} to{box-shadow: -1px -1px #3e3e3e, -2px -2px #3e3e3e, -3px -3px #3e3e3e, -4px -4px #3e3e3e, -5px -5px #3e3e3e, -6px -6px #3e3e3e, -7px -7px #3e3e3e, -8px -8px #3e3e3e;transform: translateX(8px) translateY(8px)}} @keyframes shadow-pop-tr{0%{box-shadow: 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e;transform: translateX(0) translateY(0)} to{box-shadow: 1px -1px #3e3e3e, 2px -2px #3e3e3e, 3px -3px #3e3e3e, 4px -4px #3e3e3e, 5px -5px #3e3e3e, 6px -6px #3e3e3e, 7px -7px #3e3e3e, 8px -8px #3e3e3e;transform: translateX(-8px) translateY(8px)}} @keyframes shadow-inset-bl{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset 6px -6px 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-bottom{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset 0 -6px 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-br{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset -6px -6px 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-center{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset 0 0 14px 0 rgba(0, 0, 0, .5)}} @keyframes shadow-inset-left{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset 6px 0 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-lr{0%{box-shadow: inset 0 0 0 0 transparent, inset 0 0 0 0 transparent} to{box-shadow: inset -6px 0 14px -6px rgba(0, 0, 0, .5), inset 6px 0 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-right{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset -6px 0 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-tb{0%{box-shadow: inset 0 0 0 0 transparent, inset 0 0 0 0 transparent} to{box-shadow: inset 0 -6px 14px -6px rgba(0, 0, 0, .5), inset 0 6px 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-tl{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset 6px 6px 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-top{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset 0 6px 14px -6px rgba(0, 0, 0, .5)}} @keyframes shadow-inset-tr{0%{box-shadow: inset 0 0 0 0 transparent} to{box-shadow: inset -6px 6px 14px -6px rgba(0, 0, 0, .5)}} @keyframes scale-in-bl{0%{transform: scale(0);transform-origin: 0% 100%;opacity: 1} to{transform: scale(1);transform-origin: 0% 100%;opacity: 1}} @keyframes scale-in-br{0%{transform: scale(0);transform-origin: 100% 100%;opacity: 1} to{transform: scale(1);transform-origin: 100% 100%;opacity: 1}} @keyframes scale-in-bottom{0%{transform: scale(0);transform-origin: 50% 100%;opacity: 1} to{transform: scale(1);transform-origin: 50% 100%;opacity: 1}} @keyframes scale-in-center{0%{transform: scale(0);opacity: 1} to{transform: scale(1);opacity: 1}} @keyframes scale-in-hor-center{0%{transform: scaleX(0);opacity: 1} to{transform: scaleX(1);opacity: 1}} @keyframes scale-in-hor-left{0%{transform: scaleX(0);transform-origin: 0% 0%;opacity: 1} to{transform: scaleX(1);transform-origin: 0% 0%;opacity: 1}} @keyframes scale-in-hor-right{0%{transform: scaleX(0);transform-origin: 100% 100%;opacity: 1} to{transform: scaleX(1);transform-origin: 100% 100%;opacity: 1}} @keyframes scale-in-left{0%{transform: scale(0);transform-origin: 0% 50%;opacity: 1} to{transform: scale(1);transform-origin: 0% 50%;opacity: 1}} @keyframes scale-in-right{0%{transform: scale(0);transform-origin: 100% 50%;opacity: 1} to{transform: scale(1);transform-origin: 100% 50%;opacity: 1}} @keyframes scale-in-tl{0%{transform: scale(0);transform-origin: 0% 0%;opacity: 1} to{transform: scale(1);transform-origin: 0% 0%;opacity: 1}} @keyframes scale-in-tr{0%{transform: scale(0);transform-origin: 100% 0%;opacity: 1} to{transform: scale(1);transform-origin: 100% 0%;opacity: 1}} @keyframes scale-in-top{0%{transform: scale(0);transform-origin: 50% 0%;opacity: 1} to{transform: scale(1);transform-origin: 50% 0%;opacity: 1}} @keyframes scale-in-ver-bottom{0%{transform: scaleY(0);transform-origin: 0% 100%;opacity: 1} to{transform: scaleY(1);transform-origin: 0% 100%;opacity: 1}} @keyframes scale-in-ver-center{0%{transform: scaleY(0);opacity: 1} to{transform: scaleY(1);opacity: 1}} @keyframes scale-in-ver-top{0%{transform: scaleY(0);transform-origin: 100% 0%;opacity: 1} to{transform: scaleY(1);transform-origin: 100% 0%;opacity: 1}} @keyframes rotate-in-bl{0%{transform: rotate(-360deg);transform-origin: bottom left;opacity: 0} to{transform: rotate(0deg);transform-origin: bottom left;opacity: 1}} @keyframes rotate-in-bottom{0%{transform: rotate(-360deg);transform-origin: bottom;opacity: 0} to{transform: rotate(0deg);transform-origin: bottom;opacity: 1}} @keyframes rotate-in-br{0%{transform: rotate(-360deg);transform-origin: bottom right;opacity: 0} to{transform: rotate(0deg);transform-origin: bottom right;opacity: 1}} @keyframes rotate-in-center{0%{transform: rotate(-360deg);opacity: 0} to{transform: rotate(0);opacity: 1}} @keyframes rotate-in-left{0%{transform: rotate(-360deg);transform-origin: left;opacity: 0} to{transform: rotate(0deg);transform-origin: left;opacity: 1}} @keyframes rotate-in-right{0%{transform: rotate(-360deg);transform-origin: right;opacity: 0} to{transform: rotate(0deg);transform-origin: right;opacity: 1}} @keyframes rotate-in-tl{0%{transform: rotate(-360deg);transform-origin: top left;opacity: 0} to{transform: rotate(0deg);transform-origin: top left;opacity: 1}} @keyframes rotate-in-top{0%{transform: rotate(-360deg);transform-origin: top;opacity: 0} to{transform: rotate(0deg);transform-origin: top;opacity: 1}} @keyframes rotate-in-tr{0%{transform: rotate(-360deg);transform-origin: top right;opacity: 0} to{transform: rotate(0deg);transform-origin: top right;opacity: 1}} @keyframes rotate-in-diag-1{0%{transform: rotate3d(1, 1, 0, -360deg);opacity: 0} to{transform: rotate3d(1, 1, 0, 0deg);opacity: 1}} @keyframes rotate-in-diag-2{0%{transform: rotate3d(-1, 1, 0, -360deg);opacity: 0} to{transform: rotate3d(-1, 1, 0, 0deg);opacity: 1}} @keyframes rotate-in-hor{0%{transform: rotateX(360deg);opacity: 0} to{transform: rotateX(0deg);opacity: 1}} @keyframes rotate-in-ver{0%{transform: rotateY(-360deg);opacity: 0} to{transform: rotateY(0deg);opacity: 1}} @keyframes rotate-in-2-bck{0%{transform: translateZ(200px) rotate(45deg);opacity: 0} to{transform: translateZ(0) rotate(0);opacity: 1}} @keyframes rotate-in-2-bl-ccw{0%{transform: rotate(45deg);transform-origin: 0 100%;opacity: 0} to{transform: rotate(0);transform-origin: 0 100%;opacity: 1}} @keyframes rotate-in-2-bl-cw{0%{transform: rotate(-45deg);transform-origin: 0 100%;opacity: 0} to{transform: rotate(0);transform-origin: 0 100%;opacity: 1}} @keyframes rotate-in-2-br-ccw{0%{transform: rotate(45deg);transform-origin: 100% 100%;opacity: 0} to{transform: rotate(0);transform-origin: 100% 100%;opacity: 1}} @keyframes rotate-in-2-br-cw{0%{transform: rotate(-45deg);transform-origin: 100% 100%;opacity: 0} to{transform: rotate(0);transform-origin: 100% 100%;opacity: 1}} @keyframes rotate-in-2-ccw{0%{transform: rotate(45deg);opacity: 0} to{transform: rotate(0);opacity: 1}} @keyframes rotate-in-2-cw{0%{transform: rotate(-45deg);opacity: 0} to{transform: rotate(0);opacity: 1}} @keyframes rotate-in-2-fwd{0%{transform: translateZ(-200px) rotate(-45deg);opacity: 0} to{transform: translateZ(0) rotate(0);opacity: 1}} @keyframes rotate-in-2-tl-ccw{0%{transform: rotate(45deg);transform-origin: 0 0;opacity: 0} to{transform: rotate(0);transform-origin: 0 0;opacity: 1}} @keyframes rotate-in-2-tl-cw{0%{transform: rotate(-45deg);transform-origin: 0 0;opacity: 0} to{transform: rotate(0);transform-origin: 0 0;opacity: 1}} @keyframes rotate-in-2-tr-ccw{0%{transform: rotate(45deg);transform-origin: 100% 0%;opacity: 0} to{transform: rotate(0);transform-origin: 100% 0%;opacity: 1}} @keyframes rotate-in-2-tr-cw{0%{transform: rotate(-45deg);transform-origin: 100% 0%;opacity: 0} to{transform: rotate(0);transform-origin: 100% 0%;opacity: 1}} @keyframes swirl-in-bck{0%{transform: rotate(540deg) scale(5);opacity: 0} to{transform: rotate(0) scale(1);opacity: 1}} @keyframes swirl-in-bl-bck{0%{transform: rotate(540deg) scale(5);transform-origin: 0 100%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 0 100%;opacity: 1}} @keyframes swirl-in-bl-fwd{0%{transform: rotate(-540deg) scale(0);transform-origin: 0 100%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 0 100%;opacity: 1}} @keyframes swirl-in-br-bck{0%{transform: rotate(540deg) scale(5);transform-origin: 100% 100%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 100% 100%;opacity: 1}} @keyframes swirl-in-br-fwd{0%{transform: rotate(-540deg) scale(0);transform-origin: 100% 100%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 100% 100%;opacity: 1}} @keyframes swirl-in-fwd{0%{transform: rotate(-540deg) scale(0);opacity: 0} to{transform: rotate(0) scale(1);opacity: 1}} @keyframes swirl-in-tl-bck{0%{transform: rotate(540deg) scale(5);transform-origin: 0 0;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 0 0;opacity: 1}} @keyframes swirl-in-tl-fwd{0%{transform: rotate(-540deg) scale(0);transform-origin: 0 0;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 0 0;opacity: 1}} @keyframes swirl-in-tr-bck{0%{transform: rotate(540deg) scale(5);transform-origin: 100% 0%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 100% 0%;opacity: 1}} @keyframes swirl-in-tr-fwd{0%{transform: rotate(-540deg) scale(0);transform-origin: 100% 0%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 100% 0%;opacity: 1}} @keyframes swirl-in-top-fwd{0%{transform: rotate(-540deg) scale(0);transform-origin: 50% 0;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 50% 0;opacity: 1}} @keyframes swirl-in-top-bck{0%{transform: rotate(540deg) scale(5);transform-origin: 50% 0;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 50% 0;opacity: 1}} @keyframes swirl-in-right-fwd{0%{transform: rotate(-540deg) scale(0);transform-origin: 100% 50%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 100% 50%;opacity: 1}} @keyframes swirl-in-right-bck{0%{transform: rotate(540deg) scale(5);transform-origin: 100% 50%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 100% 50%;opacity: 1}} @keyframes swirl-in-bottom-fwd{0%{transform: rotate(-540deg) scale(0);transform-origin: 50% 100%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 50% 100%;opacity: 1}} @keyframes swirl-in-bottom-bck{0%{transform: rotate(540deg) scale(5);transform-origin: 50% 100%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 50% 100%;opacity: 1}} @keyframes swirl-in-left-fwd{0%{transform: rotate(-540deg) scale(0);transform-origin: 0 50%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 0 50%;opacity: 1}} @keyframes swirl-in-left-bck{0%{transform: rotate(540deg) scale(5);transform-origin: 0 50%;opacity: 0} to{transform: rotate(0) scale(1);transform-origin: 0 50%;opacity: 1}} @keyframes flip-in-diag-1-tr{0%{transform: rotate3d(1, 1, 0, -80deg);opacity: 0} to{transform: rotate3d(1, 1, 0, 0deg);opacity: 1}} @keyframes flip-in-diag-1-bl{0%{transform: rotate3d(1, 1, 0, 80deg);opacity: 0} to{transform: rotate3d(1, 1, 0, 0deg);opacity: 1}} @keyframes flip-in-diag-2-tl{0%{transform: rotate3d(-1, 1, 0, 80deg);opacity: 0} to{transform: rotate3d(1, 1, 0, 0deg);opacity: 1}} @keyframes flip-in-diag-2-br{0%{transform: rotate3d(-1, 1, 0, -80deg);opacity: 0} to{transform: rotate3d(1, 1, 0, 0deg);opacity: 1}} @keyframes flip-in-hor-top{0%{transform: rotateX(-80deg);opacity: 0} to{transform: rotateX(0);opacity: 1}} @keyframes flip-in-hor-bottom{0%{transform: rotateX(80deg);opacity: 0} to{transform: rotateX(0);opacity: 1}} @keyframes flip-in-ver-right{0%{transform: rotateY(-80deg);opacity: 0} to{transform: rotateY(0);opacity: 1}} @keyframes flip-in-ver-left{0%{transform: rotateY(80deg);opacity: 0} to{transform: rotateY(0);opacity: 1}} @keyframes slit-in-horizontal{0%{transform: translateZ(-800px) rotateX(90deg);opacity: 0} 54%{transform: translateZ(-160px) rotateX(87deg);opacity: 1} to{transform: translateZ(0) rotateX(0)}} @keyframes slit-in-vertical{0%{transform: translateZ(-800px) rotateY(90deg);opacity: 0} 54%{transform: translateZ(-160px) rotateY(87deg);opacity: 1} to{transform: translateZ(0) rotateY(0)}} @keyframes slit-in-diagonal-1{0%{transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);animation-timing-function: ease-in;opacity: 0} 54%{transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);animation-timing-function: ease-in-out;opacity: 1} to{transform: translateZ(0) rotate3d(1, 1, 0, 0);animation-timing-function: ease-out}} @keyframes slit-in-diagonal-2{0%{transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);animation-timing-function: ease-in;opacity: 0} 54%{transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);animation-timing-function: ease-in-out;opacity: 1} to{transform: translateZ(0) rotate3d(-1, 1, 0, 0);animation-timing-function: ease-out}} @keyframes roll-in-left{0%{transform: translateX(-800px) rotate(-540deg);opacity: 0} to{transform: translateX(0) rotate(0deg);opacity: 1}} @keyframes roll-in-top{0%{transform: translateY(-800px) rotate(-540deg);opacity: 0} to{transform: translateY(0) rotate(0deg);opacity: 1}} @keyframes roll-in-bottom{0%{transform: translateY(800px) rotate(540deg);opacity: 0} to{transform: translateY(0) rotate(0deg);opacity: 1}} @keyframes roll-in-right{0%{transform: translateX(800px) rotate(540deg);opacity: 0} to{transform: translateX(0) rotate(0deg);opacity: 1}} @keyframes roll-in-blurred-left{0%{transform: translateX(-1000px) rotate(-720deg);filter: blur(50px);opacity: 0} to{transform: translateX(0) rotate(0deg);filter: blur(0);opacity: 1}} @keyframes roll-in-blurred-top{0%{transform: translateY(-800px) rotate(-720deg);filter: blur(50px);opacity: 0} to{transform: translateY(0) rotate(0deg);filter: blur(0);opacity: 1}} @keyframes roll-in-blurred-bottom{0%{transform: translateY(800px) rotate(720deg);filter: blur(50px);opacity: 0} to{transform: translateY(0) rotate(0deg);opacity: 1}} @keyframes roll-in-blurred-right{0%{transform: translateX(1000px) rotate(720deg);filter: blur(50px);opacity: 0} to{transform: translateX(0) rotate(0deg);filter: blur(0);opacity: 1}} @keyframes slide-in-bl{0%{transform: translateY(1000px) translateX(-1000px);opacity: 0} to{transform: translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-br{0%{transform: translateY(1000px) translateX(1000px);opacity: 0} to{transform: translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-bottom{0%{transform: translateY(1000px);opacity: 0} to{transform: translateY(0);opacity: 1}} @keyframes slide-in-left{0%{transform: translateX(-1000px);opacity: 0} to{transform: translateX(0);opacity: 1}} @keyframes slide-in-right{0%{transform: translateX(1000px);opacity: 0} to{transform: translateX(0);opacity: 1}} @keyframes slide-in-tl{0%{transform: translateY(-1000px) translateX(-1000px);opacity: 0} to{transform: translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-tr{0%{transform: translateY(-1000px) translateX(1000px);opacity: 0} to{transform: translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-top{0%{transform: translateY(-1000px);opacity: 0} to{transform: translateY(0);opacity: 1}} @keyframes slide-in-fwd-bl{0%{transform: translateZ(-1400px) translateY(800px) translateX(-1000px);opacity: 0} to{transform: translateZ(0) translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-fwd-bottom{0%{transform: translateZ(-1400px) translateY(800px);opacity: 0} to{transform: translateZ(0) translateY(0);opacity: 1}} @keyframes slide-in-fwd-br{0%{transform: translateZ(-1400px) translateY(800px) translateX(1000px);opacity: 0} to{transform: translateZ(0) translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-fwd-center{0%{transform: translateZ(-1400px);opacity: 0} to{transform: translateZ(0);opacity: 1}} @keyframes slide-in-fwd-left{0%{transform: translateZ(-1400px) translateX(-1000px);opacity: 0} to{transform: translateZ(0) translateX(0);opacity: 1}} @keyframes slide-in-fwd-right{0%{transform: translateZ(-1400px) translateX(1000px);opacity: 0} to{transform: translateZ(0) translateX(0);opacity: 1}} @keyframes slide-in-fwd-tl{0%{transform: translateZ(-1400px) translateY(-800px) translateX(-1000px);opacity: 0} to{transform: translateZ(0) translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-fwd-top{0%{transform: translateZ(-1400px) translateY(-800px);opacity: 0} to{transform: translateZ(0) translateY(0);opacity: 1}} @keyframes slide-in-fwd-tr{0%{transform: translateZ(-1400px) translateY(-800px) translateX(1000px);opacity: 0} to{transform: translateZ(0) translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-bck-bl{0%{transform: translateZ(700px) translateY(300px) translateX(-400px);opacity: 0} to{transform: translateZ(0) translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-bck-bottom{0%{transform: translateZ(700px) translateY(300px);opacity: 0} to{transform: translateZ(0) translateY(0);opacity: 1}} @keyframes slide-in-bck-br{0%{transform: translateZ(700px) translateY(300px) translateX(400px);opacity: 0} to{transform: translateZ(0) translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-bck-center{0%{transform: translateZ(600px);opacity: 0} to{transform: translateZ(0);opacity: 1}} @keyframes slide-in-bck-left{0%{transform: translateZ(700px) translateX(-400px);opacity: 0} to{transform: translateZ(0) translateX(0);opacity: 1}} @keyframes slide-in-bck-right{0%{transform: translateZ(700px) translateX(400px);opacity: 0} to{transform: translateZ(0) translateX(0);opacity: 1}} @keyframes slide-in-bck-tl{0%{transform: translateZ(700px) translateY(-300px) translateX(-400px);opacity: 0} to{transform: translateZ(0) translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-bck-top{0%{transform: translateZ(700px) translateY(-300px);opacity: 0} to{transform: translateZ(0) translateY(0);opacity: 1}} @keyframes slide-in-bck-tr{0%{transform: translateZ(700px) translateY(-300px) translateX(400px);opacity: 0} to{transform: translateZ(0) translateY(0) translateX(0);opacity: 1}} @keyframes slide-in-blurred-bl{0%{transform: translate(-1000px, 1000px) skew(-80deg, -10deg);transform-origin: 100% 100%;filter: blur(40px);opacity: 0} to{transform: translate(0, 0) skew(0deg, 0deg);transform-origin: 50% 50%;filter: blur(0);opacity: 1}} @keyframes slide-in-blurred-br{0%{transform: translate(1000px, 1000px) skew(80deg, 10deg);transform-origin: 0% 100%;filter: blur(40px);opacity: 0} to{transform: translate(0, 0) skew(0deg, 0deg);transform-origin: 50% 50%;filter: blur(0);opacity: 1}} @keyframes slide-in-blurred-bottom{0%{transform: translateY(1000px) scaleY(2.5) scaleX(.2);transform-origin: 50% 100%;filter: blur(40px);opacity: 0} to{transform: translateY(0) scaleY(1) scaleX(1);transform-origin: 50% 50%;filter: blur(0);opacity: 1}} @keyframes slide-in-blurred-left{0%{transform: translateX(-1000px) scaleX(2.5) scaleY(.2);transform-origin: 100% 50%;filter: blur(40px);opacity: 0} to{transform: translateX(0) scaleY(1) scaleX(1);transform-origin: 50% 50%;filter: blur(0);opacity: 1}} @keyframes slide-in-blurred-right{0%{transform: translateX(1000px) scaleX(2.5) scaleY(.2);transform-origin: 0% 50%;filter: blur(40px);opacity: 0} to{transform: translateX(0) scaleY(1) scaleX(1);transform-origin: 50% 50%;filter: blur(0);opacity: 1}} @keyframes slide-in-blurred-tl{0%{transform: translate(-1000px, -1000px) skew(80deg, 10deg);transform-origin: 100% 0%;filter: blur(40px);opacity: 0} to{transform: translate(0, 0) skew(0deg, 0deg);transform-origin: 50% 50%;filter: blur(0);opacity: 1}} @keyframes slide-in-blurred-tr{0%{transform: translate(1000px, -1000px) skew(-80deg, -10deg);transform-origin: 0% 0%;filter: blur(40px);opacity: 0} to{transform: translate(0, 0) skew(0deg, 0deg);transform-origin: 50% 50%;filter: blur(0);opacity: 1}} @keyframes slide-in-blurred-top{0%{transform: translateY(-1000px) scaleY(2.5) scaleX(.2);transform-origin: 50% 0%;filter: blur(40px);opacity: 0} to{transform: translateY(0) scaleY(1) scaleX(1);transform-origin: 50% 50%;filter: blur(0);opacity: 1}} @keyframes slide-in-elliptic-bottom-bck{0%{transform: translateY(600px) rotateX(-30deg) scale(6.5);transform-origin: 50% -100%;opacity: 0} to{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% 500px;opacity: 1}} @keyframes slide-in-elliptic-bottom-fwd{0%{transform: translateY(600px) rotateX(30deg) scale(0);transform-origin: 50% 100%;opacity: 0} to{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% -1400px;opacity: 1}} @keyframes slide-in-elliptic-left-bck{0%{transform: translateX(-800px) rotateY(-30deg) scale(6.5);transform-origin: 200% 50%;opacity: 0} to{transform: translateX(0) rotateY(0) scale(1);transform-origin: -600px 50%;opacity: 1}} @keyframes slide-in-elliptic-left-fwd{0%{transform: translateX(-800px) rotateY(30deg) scale(0);transform-origin: -100% 50%;opacity: 0} to{transform: translateX(0) rotateY(0) scale(1);transform-origin: 1800px 50%;opacity: 1}} @keyframes slide-in-elliptic-right-bck{0%{transform: translateX(800px) rotateY(30deg) scale(6.5);transform-origin: -100% 50%;opacity: 0} to{transform: translateX(0) rotateY(0) scale(1);transform-origin: 600px 50%;opacity: 1}} @keyframes slide-in-elliptic-right-fwd{0%{transform: translateX(800px) rotateY(-30deg) scale(0);transform-origin: -100% 50%;opacity: 0} to{transform: translateX(0) rotateY(0) scale(1);transform-origin: -1800px 50%;opacity: 1}} @keyframes slide-in-elliptic-top-bck{0%{transform: translateY(-600px) rotateX(30deg) scale(6.5);transform-origin: 50% 200%;opacity: 0} to{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% -500px;opacity: 1}} @keyframes slide-in-elliptic-top-fwd{0%{transform: translateY(-600px) rotateX(-30deg) scale(0);transform-origin: 50% 100%;opacity: 0} to{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% 1400px;opacity: 1}} @keyframes bounce-in-bck{0%{transform: scale(7);animation-timing-function: ease-in;opacity: 0} 38%{transform: scale(1);animation-timing-function: ease-out;opacity: 1} 55%{transform: scale(1.5);animation-timing-function: ease-in} 72%, 89%, to{transform: scale(1);animation-timing-function: ease-out} 81%{transform: scale(1.24);animation-timing-function: ease-in} 95%{transform: scale(1.04);animation-timing-function: ease-in}} @keyframes bounce-in-bottom{0%{transform: translateY(500px);animation-timing-function: ease-in;opacity: 0} 38%{transform: translateY(0);animation-timing-function: ease-out;opacity: 1} 55%{transform: translateY(65px);animation-timing-function: ease-in} 72%, 90%, to{transform: translateY(0);animation-timing-function: ease-out} 81%{transform: translateY(28px);animation-timing-function: ease-in} 95%{transform: translateY(8px);animation-timing-function: ease-in}} @keyframes bounce-in-fwd{0%{transform: scale(0);animation-timing-function: ease-in;opacity: 0} 38%{transform: scale(1);animation-timing-function: ease-out;opacity: 1} 55%{transform: scale(.7);animation-timing-function: ease-in} 72%, 89%, to{transform: scale(1);animation-timing-function: ease-out} 81%{transform: scale(.84);animation-timing-function: ease-in} 95%{transform: scale(.95);animation-timing-function: ease-in}} @keyframes bounce-in-left{0%{transform: translateX(-600px);animation-timing-function: ease-in;opacity: 0} 38%{transform: translateX(0);animation-timing-function: ease-out;opacity: 1} 55%{transform: translateX(-68px);animation-timing-function: ease-in} 72%, 90%, to{transform: translateX(0);animation-timing-function: ease-out} 81%{transform: translateX(-28px);animation-timing-function: ease-in} 95%{transform: translateX(-8px);animation-timing-function: ease-in}} @keyframes bounce-in-right{0%{transform: translateX(600px);animation-timing-function: ease-in;opacity: 0} 38%{transform: translateX(0);animation-timing-function: ease-out;opacity: 1} 55%{transform: translateX(68px);animation-timing-function: ease-in} 72%, 90%, to{transform: translateX(0);animation-timing-function: ease-out} 81%{transform: translateX(32px);animation-timing-function: ease-in} 95%{transform: translateX(8px);animation-timing-function: ease-in}} @keyframes bounce-in-top{0%{transform: translateY(-500px);animation-timing-function: ease-in;opacity: 0} 38%{transform: translateY(0);animation-timing-function: ease-out;opacity: 1} 55%{transform: translateY(-65px);animation-timing-function: ease-in} 72%, 90%, to{transform: translateY(0);animation-timing-function: ease-out} 81%{transform: translateY(-28px);} 95%{transform: translateY(-8px);animation-timing-function: ease-in}} @keyframes swing-in-bottom-bck{0%{transform: rotateX(-70deg);transform-origin: bottom;opacity: 0} to{transform: rotateX(0);transform-origin: bottom;opacity: 1}} @keyframes swing-in-bottom-fwd{0%{transform: rotateX(100deg);transform-origin: bottom;opacity: 0} to{transform: rotateX(0);transform-origin: bottom;opacity: 1}} @keyframes swing-in-left-bck{0%{transform: rotateY(-70deg);transform-origin: left;opacity: 0} to{transform: rotateY(0);transform-origin: left;opacity: 1}} @keyframes swing-in-left-fwd{0%{transform: rotateY(100deg);transform-origin: left;opacity: 0} to{transform: rotateY(0);transform-origin: left;opacity: 1}} @keyframes swing-in-right-bck{0%{transform: rotateY(70deg);transform-origin: right;opacity: 0} to{transform: rotateY(0);transform-origin: right;opacity: 1}} @keyframes swing-in-right-fwd{0%{transform: rotateY(-100deg);transform-origin: right;opacity: 0} to{transform: rotateY(0);transform-origin: right;opacity: 1}} @keyframes swing-in-top-bck{0%{transform: rotateX(70deg);transform-origin: top;opacity: 0} to{transform: rotateX(0deg);transform-origin: top;opacity: 1}} @keyframes swing-in-top-fwd{0%{transform: rotateX(-100deg);transform-origin: top;opacity: 0} to{transform: rotateX(0deg);transform-origin: top;opacity: 1}} @keyframes fade-in-bck{0%{transform: translateZ(80px);opacity: 0} to{transform: translateZ(0);opacity: 1}} @keyframes fade-in-bl{0%{transform: translateX(-50px) translateY(50px);opacity: 0} to{transform: translateX(0) translateY(0);opacity: 1}} @keyframes fade-in-bottom{0%{transform: translateY(50px);opacity: 0} to{transform: translateY(0);opacity: 1}} @keyframes fade-in-br{0%{transform: translateX(50px) translateY(50px);opacity: 0} to{transform: translateX(0) translateY(0);opacity: 1}} @keyframes fade-in-fwd{0%{transform: translateZ(-80px);opacity: 0} to{transform: translateZ(0);opacity: 1}} @keyframes fade-in-left{0%{transform: translateX(-50px);opacity: 0} to{transform: translateX(0);opacity: 1}} @keyframes fade-in-right{0%{transform: translateX(50px);opacity: 0} to{transform: translateX(0);opacity: 1}} @keyframes fade-in-tl{0%{transform: translateX(-50px) translateY(-50px);opacity: 0} to{transform: translateX(0) translateY(0);opacity: 1}} @keyframes fade-in-top{0%{transform: translateY(-50px);opacity: 0} to{transform: translateY(0);opacity: 1}} @keyframes fade-in-tr{0%{transform: translateX(50px) translateY(-50px);opacity: 0} to{transform: translateX(0) translateY(0);opacity: 1}} @keyframes fade-in{0%{opacity: 0} to{opacity: 1}} @keyframes puff-in-ver{0%{transform: scaleY(2);filter: blur(2px);opacity: 0} to{transform: scaleY(1);filter: blur(0);opacity: 1}} @keyframes puff-in-hor{0%{transform: scaleX(2);filter: blur(2px);opacity: 0} to{transform: scaleX(1);filter: blur(0);opacity: 1}} @keyframes puff-in-tl{0%{transform: scale(2);transform-origin: 0% 0%;filter: blur(2px);opacity: 0} to{transform: scale(1);transform-origin: 0% 0%;filter: blur(0);opacity: 1}} @keyframes puff-in-left{0%{transform: scale(2);transform-origin: 0% 50%;filter: blur(2px);opacity: 0} to{transform: scale(1);transform-origin: 0% 50%;filter: blur(0);opacity: 1}} @keyframes puff-in-bl{0%{transform: scale(2);transform-origin: 0% 100%;filter: blur(2px);opacity: 0} to{transform: scale(1);transform-origin: 0% 100%;filter: blur(0);opacity: 1}} @keyframes puff-in-bottom{0%{transform: scale(2);transform-origin: 50% 100%;filter: blur(2px);opacity: 0} to{transform: scale(1);transform-origin: 50% 100%;filter: blur(0);opacity: 1}} @keyframes puff-in-br{0%{transform: scale(2);transform-origin: 100% 100%;filter: blur(2px);opacity: 0} to{transform: scale(1);transform-origin: 100% 100%;filter: blur(0);opacity: 1}} @keyframes puff-in-right{0%{transform: scale(2);transform-origin: 100% 50%;filter: blur(2px);opacity: 0} to{transform: scale(1);transform-origin: 100% 50%;filter: blur(0);opacity: 1}} @keyframes puff-in-tr{0%{transform: scale(2);transform-origin: 100% 0%;filter: blur(2px);opacity: 0} to{transform: scale(1);transform-origin: 100% 0%;filter: blur(0);opacity: 1}} @keyframes puff-in-top{0%{transform: scale(2);transform-origin: 50% 0%;filter: blur(2px);opacity: 0} to{transform: scale(1);transform-origin: 50% 0%;filter: blur(0);opacity: 1}} @keyframes puff-in-center{0%{transform: scale(2);filter: blur(2px);opacity: 0} to{transform: scale(1);filter: blur(0);opacity: 1}} @keyframes flicker-in-1{0%, 10%, 10.2%, 20%, 20.6%, 30%, 30.6%, 45%, 55.1%, 57%, 60.1%, 65%, 75.1%, 77%, 85.1%, 86%{opacity: 0} 10.1%, 20.1%, 30.1%, 30.5%, 45.1%, 50%, 55%, 57.1%, 60%, 65.1%, 75%, 77.1%, 85%, 86.1%, to{opacity: 1}} @keyframes flicker-in-2{0%{opacity: 0} 10%, 10.2%, 20%, 20.6%, 30%, 30.6%, 45%, 55.1%, 57%, 60.1%, 65%, 75.1%, 77%, 85.1%, 86%{opacity: 0;box-shadow: none} 10.1%{opacity: 1;box-shadow: none} 20.1%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .25)} 30.1%, 30.5%, 45.1%, 50%, 55%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .45), 0 0 60px rgba(255, 255, 255, .25)} 57.1%, 60%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .3)} 65.1%, 75%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .3), 0 0 100px rgba(255, 255, 255, .1)} 77.1%, 85%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .6), 0 0 60px rgba(255, 255, 255, .4), 0 0 110px rgba(255, 255, 255, .2), 0 0 100px rgba(255, 255, 255, .1)} 86.1%, to{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .6), 0 0 60px rgba(255, 255, 255, .45), 0 0 110px rgba(255, 255, 255, .25), 0 0 100px rgba(255, 255, 255, .1)}} @keyframes scale-out-ver-bottom{0%{transform: scaleY(1);transform-origin: 0% 100%;opacity: 1} to{transform: scaleY(0);transform-origin: 0% 100%;opacity: 1}} @keyframes scale-out-ver-top{0%{transform: scaleY(1);transform-origin: 100% 0%;opacity: 1} to{transform: scaleY(0);transform-origin: 100% 0%;opacity: 1}} @keyframes scale-out-vertical{0%{transform: scaleY(1);opacity: 1} to{transform: scaleY(0);opacity: 1}} @keyframes scale-out-hor-right{0%{transform: scaleX(1);transform-origin: 100% 100%;opacity: 1} to{transform: scaleX(0);transform-origin: 100% 100%;opacity: 1}} @keyframes scale-out-hor-left{0%{transform: scaleX(1);transform-origin: 0 0;opacity: 1} to{transform: scaleX(0);transform-origin: 0 0;opacity: 1}} @keyframes scale-out-horizontal{0%{transform: scaleX(1);opacity: 1} to{transform: scaleX(0);opacity: 1}} @keyframes scale-out-tl{0%{transform: scale(1);transform-origin: 0 0;opacity: 1} to{transform: scale(0);transform-origin: 0 0;opacity: 1}} @keyframes scale-out-left{0%{transform: scale(1);transform-origin: 0% 50%;opacity: 1} to{transform: scale(0);transform-origin: 0% 50%;opacity: 1}} @keyframes scale-out-bl{0%{transform: scale(1);transform-origin: 0% 100%;opacity: 1} to{transform: scale(0);transform-origin: 0% 100%;opacity: 1}} @keyframes scale-out-bottom{0%{transform: scale(1);transform-origin: 50% 100%;opacity: 1} to{transform: scale(0);transform-origin: 50% 100%;opacity: 1}} @keyframes scale-out-br{0%{transform: scale(1);transform-origin: 100% 100%;opacity: 1} to{transform: scale(0);transform-origin: 100% 100%;opacity: 1}} @keyframes scale-out-right{0%{transform: scale(1);transform-origin: 100% 50%;opacity: 1} to{transform: scale(0);transform-origin: 100% 50%;opacity: 1}} @keyframes scale-out-tr{0%{transform: scale(1);transform-origin: 100% 0%;opacity: 1} to{transform: scale(0);transform-origin: 100% 0%;opacity: 1}} @keyframes scale-out-top{0%{transform: scale(1);transform-origin: 50% 0%;opacity: 1} to{transform: scale(0);transform-origin: 50% 0%;opacity: 1}} @keyframes scale-out-center{0%{transform: scale(1);opacity: 1} to{transform: scale(0);opacity: 1}} @keyframes rotate-out-tl{0%{transform: rotate(0);transform-origin: top left;opacity: 1} to{transform: rotate(-360deg);transform-origin: top left;opacity: 0}} @keyframes rotate-out-left{0%{transform: rotate(0);transform-origin: left;opacity: 1} to{transform: rotate(-360deg);transform-origin: left;opacity: 0}} @keyframes rotate-out-bl{0%{transform: rotate(0);transform-origin: bottom left;opacity: 1} to{transform: rotate(-360deg);transform-origin: bottom left;opacity: 0}} @keyframes rotate-out-bottom{0%{transform: rotate(0);transform-origin: bottom;opacity: 1} to{transform: rotate(-360deg);transform-origin: bottom;opacity: 0}} @keyframes rotate-out-br{0%{transform: rotate(0);transform-origin: bottom right;opacity: 1} to{transform: rotate(-360deg);transform-origin: bottom right;opacity: 0}} @keyframes rotate-out-right{0%{transform: rotate(0);transform-origin: right;opacity: 1} to{transform: rotate(-360deg);transform-origin: right;opacity: 0}} @keyframes rotate-out-tr{0%{transform: rotate(0);transform-origin: top right;opacity: 1} to{transform: rotate(-360deg);transform-origin: top right;opacity: 0}} @keyframes rotate-out-top{0%{transform: rotate(0);transform-origin: top;opacity: 1} to{transform: rotate(-360deg);transform-origin: top;opacity: 0}} @keyframes rotate-out-center{0%{transform: rotate(0);opacity: 1} to{transform: rotate(-360deg);opacity: 0}} @keyframes rotate-out-diag-2{0%{transform: rotate3d(-1, 1, 0, 360deg);opacity: 1} to{transform: rotate3d(-1, 1, 0, 0deg);opacity: 0}} @keyframes rotate-out-diag-1{0%{transform: rotate3d(1, 1, 0, 360deg);opacity: 1} to{transform: rotate3d(1, 1, 0, 0deg);opacity: 0}} @keyframes rotate-out-ver{0%{transform: rotateY(360deg);opacity: 1} to{transform: rotateY(0deg);opacity: 0}} @keyframes rotate-out-hor{0%{transform: rotateX(360deg);opacity: 1} to{transform: rotateX(0deg);opacity: 0}} @keyframes rotate-out-2-tl-ccw{0%{transform: rotate(0);transform-origin: 0 0;opacity: 1} to{transform: rotate(-45deg);transform-origin: 0 0;opacity: 0}} @keyframes rotate-out-2-tl-cw{0%{transform: rotate(0);transform-origin: 0 0;opacity: 1} to{transform: rotate(45deg);transform-origin: 0 0;opacity: 0}} @keyframes rotate-out-2-bl-ccw{0%{transform: rotate(0);transform-origin: 0 100%;opacity: 1} to{transform: rotate(-45deg);transform-origin: 0 100%;opacity: 0}} @keyframes rotate-out-2-bl-cw{0%{transform: rotate(0);transform-origin: 0 100%;opacity: 1} to{transform: rotate(45deg);transform-origin: 0 100%;opacity: 0}} @keyframes rotate-out-2-br-ccw{0%{transform: rotate(0);transform-origin: 100% 100%;opacity: 1} to{transform: rotate(-45deg);transform-origin: 100% 100%;opacity: 0}} @keyframes rotate-out-2-br-cw{0%{transform: rotate(0);transform-origin: 100% 100%;opacity: 1} to{transform: rotate(45deg);transform-origin: 100% 100%;opacity: 0}} @keyframes rotate-out-2-tr-ccw{0%{transform: rotate(0);transform-origin: 100% 0%;opacity: 1} to{transform: rotate(-45deg);transform-origin: 100% 0%;opacity: 0}} @keyframes rotate-out-2-tr-cw{0%{transform: rotate(0);transform-origin: 100% 0%;opacity: 1} to{transform: rotate(45deg);transform-origin: 100% 0%;opacity: 0}} @keyframes rotate-out-2-fwd{0%{transform: translateZ(0) rotate(0);opacity: 1} to{transform: translateZ(180px) rotate(45deg);opacity: 0}} @keyframes rotate-out-2-bck{0%{transform: translateZ(0) rotate(0);opacity: 1} to{transform: translateZ(-180px) rotate(-45deg);opacity: 0}} @keyframes rotate-out-2-ccw{0%{transform: rotate(0);opacity: 1} to{transform: rotate(-45deg);opacity: 0}} @keyframes rotate-out-2-cw{0%{transform: rotate(0);opacity: 1} to{transform: rotate(45deg);opacity: 0}} @keyframes swirl-out-top-fwd{0%{transform: rotate(0) scale(1);transform-origin: 50% 0%;opacity: 1} to{transform: rotate(540deg) scale(5);transform-origin: 50% 0%;opacity: 0}} @keyframes swirl-out-top-bck{0%{transform: rotate(0) scale(1);transform-origin: 50% 0%;opacity: 1} to{transform: rotate(-540deg) scale(0);transform-origin: 50% 0%;opacity: 0}} @keyframes swirl-out-right-fwd{0%{transform: rotate(0) scale(1);transform-origin: 100% 50%;opacity: 1} to{transform: rotate(540deg) scale(5);transform-origin: 100% 50%;opacity: 0}} @keyframes swirl-out-right-bck{0%{transform: rotate(0) scale(1);transform-origin: 100% 50%;opacity: 1} to{transform: rotate(-540deg) scale(0);transform-origin: 100% 50%;opacity: 0}} @keyframes swirl-out-bottom-fwd{0%{transform: rotate(0) scale(1);transform-origin: 50% 100%;opacity: 1} to{transform: rotate(540deg) scale(5);transform-origin: 50% 100%;opacity: 0}} @keyframes swirl-out-bottom-bck{0%{transform: rotate(0) scale(1);transform-origin: 50% 100%;opacity: 1} to{transform: rotate(-540deg) scale(0);transform-origin: 50% 100%;opacity: 0}} @keyframes swirl-out-left-fwd{0%{transform: rotate(0) scale(1);transform-origin: 0 50%;opacity: 1} to{transform: rotate(540deg) scale(5);transform-origin: 0 50%;opacity: 0}} @keyframes swirl-out-left-bck{0%{transform: rotate(0) scale(1);transform-origin: 0 50%;opacity: 1} to{transform: rotate(-540deg) scale(0);transform-origin: 0 50%;opacity: 0}} @keyframes swirl-out-tl-fwd{0%{transform: rotate(0) scale(1);transform-origin: 0 0;opacity: 1} to{transform: rotate(720deg) scale(5);transform-origin: 0 0;opacity: 0}} @keyframes swirl-out-tl-bck{0%{transform: rotate(0) scale(1);transform-origin: 0 0;opacity: 1} to{transform: rotate(-540deg) scale(0);transform-origin: 0 0;opacity: 0}} @keyframes swirl-out-bl-fwd{0%{transform: rotate(0) scale(1);transform-origin: 0 100%;opacity: 1} to{transform: rotate(540deg) scale(5);transform-origin: 0 100%;opacity: 0}} @keyframes swirl-out-bl-bck{0%{transform: rotate(0) scale(1);transform-origin: 0 100%;opacity: 1} to{transform: rotate(-540deg) scale(0);transform-origin: 0 100%;opacity: 0}} @keyframes swirl-out-br-fwd{0%{transform: rotate(0) scale(1);transform-origin: 100% 100%;opacity: 1} to{transform: rotate(540deg) scale(5);transform-origin: 100% 100%;opacity: 0}} @keyframes swirl-out-br-bck{0%{transform: rotate(0) scale(1);transform-origin: 100% 100%;opacity: 1} to{transform: rotate(-540deg) scale(0);transform-origin: 100% 100%;opacity: 0}} @keyframes swirl-out-tr-fwd{0%{transform: rotate(0) scale(1);transform-origin: 100% 0%;opacity: 1} to{transform: rotate(540deg) scale(5);transform-origin: 100% 0%;opacity: 0}} @keyframes swirl-out-tr-bck{0%{transform: rotate(0) scale(1);transform-origin: 100% 0%;opacity: 1} to{transform: rotate(-540deg) scale(0);transform-origin: 100% 0%;opacity: 0}} @keyframes swirl-out-fwd{0%{transform: rotate(0) scale(1);opacity: 1} to{transform: rotate(540deg) scale(5);opacity: 0}} @keyframes swirl-out-bck{0%{transform: rotate(0) scale(1);opacity: 1} to{transform: rotate(-540deg) scale(0);opacity: 0}} @keyframes flip-out-diag-2-tl{0%{transform: rotate3d(1, 1, 0, 0deg);opacity: 1} to{transform: rotate3d(-1, 1, 0, -70deg);opacity: 0}} @keyframes flip-out-diag-2-br{0%{transform: rotate3d(1, 1, 0, 0deg);opacity: 1} to{transform: rotate3d(-1, 1, 0, 70deg);opacity: 0}} @keyframes flip-out-diag-1-bl{0%{transform: rotate3d(1, 1, 0, 0deg);opacity: 1} to{transform: rotate3d(1, 1, 0, -70deg);opacity: 0}} @keyframes flip-out-diag-1-tr{0%{transform: rotate3d(1, 1, 0, 0deg);opacity: 1} to{transform: rotate3d(1, 1, 0, 70deg);opacity: 0}} @keyframes flip-out-ver-right{0%{transform: rotateY(0);opacity: 1} to{transform: rotateY(70deg);opacity: 0}} @keyframes flip-out-ver-left{0%{transform: rotateY(0);opacity: 1} to{transform: rotateY(-70deg);opacity: 0}} @keyframes flip-out-hor-top{0%{transform: rotateX(0);opacity: 1} to{transform: rotateX(70deg);opacity: 0}} @keyframes flip-out-hor-bottom{0%{transform: rotateX(0);opacity: 1} to{transform: rotateX(-70deg);opacity: 0}} @keyframes slit-out-diagonal-2{0%{transform: translateZ(0) rotate3d(-1, 1, 0, 0);opacity: 1} 54%{transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);opacity: 1} to{transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);opacity: 0}} @keyframes slit-out-diagonal-1{0%{transform: translateZ(0) rotate3d(1, 1, 0, 0);opacity: 1} 54%{transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);opacity: 1} to{transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);opacity: 0}} @keyframes slit-out-horizontal{0%{transform: translateZ(0) rotateX(0);opacity: 1} 54%{transform: translateZ(-160px) rotateX(87deg);opacity: 1} to{transform: translateZ(-800px) rotateX(90deg);opacity: 0}} @keyframes slit-out-vertical{0%{transform: translateZ(0) rotateY(0);opacity: 1} 54%{transform: translateZ(-160px) rotateY(87deg);opacity: 1} to{transform: translateZ(-800px) rotateY(90deg);opacity: 0}} @keyframes roll-out-right{0%{transform: translateX(0) rotate(0deg);opacity: 1} to{transform: translateX(1000px) rotate(540deg);opacity: 0}} @keyframes roll-out-left{0%{transform: translateX(0) rotate(0deg);opacity: 1} to{transform: translateX(-1000px) rotate(-540deg);opacity: 0}} @keyframes roll-out-top{0%{transform: translateY(0) rotate(0deg);opacity: 1} to{transform: translateY(-800px) rotate(-540deg);opacity: 0}} @keyframes roll-out-bottom{0%{transform: translateY(0) rotate(0deg);opacity: 1} to{transform: translateY(800px) rotate(540deg);opacity: 0}} @keyframes roll-out-blurred-right{0%{transform: translateX(0) rotate(0deg);filter: blur(0);opacity: 1} to{transform: translateX(1000px) rotate(720deg);filter: blur(50px);opacity: 0}} @keyframes roll-out-blurred-left{0%{transform: translateX(0) rotate(0deg);filter: blur(0);opacity: 1} to{transform: translateX(-1000px) rotate(-720deg);filter: blur(50px);opacity: 0}} @keyframes roll-out-blurred-top{0%{transform: translateY(0) rotate(0deg);filter: blur(0);opacity: 1} to{transform: translateY(-800px) rotate(-720deg);filter: blur(50px);opacity: 0}} @keyframes roll-out-blurred-bottom{0%{transform: translateY(0) rotate(0deg);opacity: 1} to{transform: translateY(800px) rotate(720deg);filter: blur(50px);opacity: 0}} @keyframes slide-out-tl{0%{transform: translateY(0) translateX(0);opacity: 1} to{transform: translateY(-1000px) translateX(-1000px);opacity: 0}} @keyframes slide-out-left{0%{transform: translateX(0);opacity: 1} to{transform: translateX(-1000px);opacity: 0}} @keyframes slide-out-bl{0%{transform: translateY(0) translateX(0);opacity: 1} to{transform: translateY(1000px) translateX(-1000px);opacity: 0}} @keyframes slide-out-bottom{0%{transform: translateY(0);opacity: 1} to{transform: translateY(1000px);opacity: 0}} @keyframes slide-out-br{0%{transform: translateY(0) translateX(0);opacity: 1} to{transform: translateY(1000px) translateX(1000px);opacity: 0}} @keyframes slide-out-right{0%{transform: translateX(0);opacity: 1} to{transform: translateX(1000px);opacity: 0}} @keyframes slide-out-tr{0%{transform: translateY(0) translateX(0);opacity: 1} to{transform: translateY(-1000px) translateX(1000px);opacity: 0}} @keyframes slide-out-top{0%{transform: translateY(0);opacity: 1} to{transform: translateY(-1000px);opacity: 0}} @keyframes slide-out-bck-tl{0%{transform: translateZ(0) translateY(0) translateX(0);opacity: 1} to{transform: translateZ(-1100px) translateY(-1000px) translateX(-1000px);opacity: 0}} @keyframes slide-out-bck-left{0%{transform: translateZ(0) translateX(0);opacity: 1} to{transform: translateZ(-1100px) translateX(-1000px);opacity: 0}} @keyframes slide-out-bck-bl{0%{transform: translateZ(0) translateY(0) translateX(0);opacity: 1} to{transform: translateZ(-1100px) translateY(1000px) translateX(-1000px);opacity: 0}} @keyframes slide-out-bck-bottom{0%{transform: translateZ(0) translateY(0);opacity: 1} to{transform: translateZ(-1100px) translateY(1000px);opacity: 0}} @keyframes slide-out-bck-br{0%{transform: translateZ(0) translateY(0) translateX(0);opacity: 1} to{transform: translateZ(-1100px) translateY(1000px) translateX(1000px);opacity: 0}} @keyframes slide-out-bck-right{0%{transform: translateZ(0) translateX(0);opacity: 1} to{transform: translateZ(-1100px) translateX(1000px);opacity: 0}} @keyframes slide-out-bck-tr{0%{transform: translateZ(0) translateY(0) translateX(0);opacity: 1} to{transform: translateZ(-1100px) translateY(-1000px) translateX(1000px);opacity: 0}} @keyframes slide-out-bck-top{0%{transform: translateZ(1) translateY(0);opacity: 1} to{transform: translateZ(-1100px) translateY(-1000px);opacity: 0}} @keyframes slide-out-bck-center{0%{transform: translateZ(0);opacity: 1} to{transform: translateZ(-1100px);opacity: 0}} @keyframes slide-out-fwd-tl{0%{transform: translateZ(0) translateY(0) translateX(0);opacity: 1} to{transform: translateZ(600px) translateY(-300px) translateX(-400px);opacity: 0}} @keyframes slide-out-fwd-left{0%{transform: translateZ(0) translateX(0);opacity: 1} to{transform: translateZ(600px) translateX(-400px);opacity: 0}} @keyframes slide-out-fwd-bl{0%{transform: translateZ(0) translateY(0) translateX(0);opacity: 1} to{transform: translateZ(600px) translateY(300px) translateX(-400px);opacity: 0}} @keyframes slide-out-fwd-bottom{0%{transform: translateZ(0) translateY(0);opacity: 1} to{transform: translateZ(600px) translateY(300px);opacity: 0}} @keyframes slide-out-fwd-br{0%{transform: translateZ(0) translateY(0) translateX(0);opacity: 1} to{transform: translateZ(600px) translateY(300px) translateX(400px);opacity: 0}} @keyframes slide-out-fwd-right{0%{transform: translateZ(0) translateX(0);opacity: 1} to{transform: translateZ(600px) translateX(400px);opacity: 0}} @keyframes slide-out-fwd-tr{0%{transform: translateZ(0) translateY(0) translateX(0);opacity: 1} to{transform: translateZ(600px) translateY(-300px) translateX(400px);opacity: 0}} @keyframes slide-out-fwd-top{0%{transform: translateZ(1) translateY(0);opacity: 1} to{transform: translateZ(600px) translateY(-300px);opacity: 0}} @keyframes slide-out-fwd-center{0%{transform: translateZ(1);opacity: 1} to{transform: translateZ(600px);opacity: 0}} @keyframes slide-out-blurred-tl{0%{transform: translate(0, 0) skew(0deg, 0deg);transform-origin: 50% 50%;filter: blur(0);opacity: 1} to{transform: translate(-1000px, -1000px) skew(80deg, 10deg);transform-origin: 100% 0%;filter: blur(40px);opacity: 0}} @keyframes slide-out-blurred-left{0%{transform: translateX(0) scaleY(1) scaleX(1);transform-origin: 50% 50%;filter: blur(0);opacity: 1} to{transform: translateX(-1000px) scaleX(2) scaleY(.2);transform-origin: 100% 50%;filter: blur(40px);opacity: 0}} @keyframes slide-out-blurred-bl{0%{transform: translate(0, 0) skew(0deg, 0deg);transform-origin: 50% 50%;filter: blur(0);opacity: 1} to{transform: translate(-1000px, 1000px) skew(-80deg, -10deg);transform-origin: 100% 100%;filter: blur(40px);opacity: 0}} @keyframes slide-out-blurred-bottom{0%{transform: translateY(0) scaleY(1) scaleX(1);transform-origin: 50% 50%;filter: blur(0);opacity: 1} to{transform: translateY(1000px) scaleY(2) scaleX(.2);transform-origin: 50% 100%;filter: blur(40px);opacity: 0}} @keyframes slide-out-blurred-br{0%{transform: translate(0, 0) skew(0deg, 0deg);transform-origin: 50% 50%;filter: blur(0);opacity: 1} to{transform: translate(1000px, 1000px) skew(80deg, 10deg);transform-origin: 0% 100%;filter: blur(40px);opacity: 0}} @keyframes slide-out-blurred-right{0%{transform: translateX(0) scaleY(1) scaleX(1);transform-origin: 50% 50%;filter: blur(0);opacity: 1} to{transform: translateX(1000px) scaleX(2) scaleY(.2);transform-origin: 0% 50%;filter: blur(40px);opacity: 0}} @keyframes slide-out-blurred-tr{0%{transform: translate(0, 0) skew(0deg, 0deg);transform-origin: 50% 50%;filter: blur(0);opacity: 1} to{transform: translate(1000px, -1000px) skew(-80deg, -10deg);transform-origin: 0% 0%;filter: blur(40px);opacity: 0}} @keyframes slide-out-blurred-top{0%{transform: translateY(0) scaleY(1) scaleX(1);transform-origin: 50% 0%;filter: blur(0);opacity: 1} to{transform: translateY(-1000px) scaleY(2) scaleX(.2);transform-origin: 50% 0%;filter: blur(40px);opacity: 0}} @keyframes slide-out-elliptic-left-fwd{0%{transform: translateX(0) rotateY(0) scale(1);transform-origin: -500px 50%;opacity: 1} to{transform: translateX(-1000px) rotateY(-20deg) scale(6);transform-origin: 200% 50%;opacity: 0}} @keyframes slide-out-elliptic-left-bck{0%{transform: translateX(0) rotateY(0) scale(1);transform-origin: 2000px 50%;opacity: 1} to{transform: translateX(-1000px) rotateY(30deg) scale(0);transform-origin: -100% 50%;opacity: 1}} @keyframes slide-out-elliptic-bottom-fwd{0%{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% 500px;opacity: 1} to{transform: translateY(600px) rotateX(-20deg) scale(6);transform-origin: 50% -100%;opacity: 0}} @keyframes slide-out-elliptic-bottom-bck{0%{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% -1400px;opacity: 1} to{transform: translateY(600px) rotateX(30deg) scale(0);transform-origin: 50% 100%;opacity: 1}} @keyframes slide-out-elliptic-right-fwd{0%{transform: translateX(0) rotateY(0) scale(1);transform-origin: 600px 50%;opacity: 1} to{transform: translateX(1000px) rotateY(20deg) scale(6);transform-origin: -100% 50%;opacity: 0}} @keyframes slide-out-elliptic-right-bck{0%{transform: translateX(0) rotateY(0) scale(1);transform-origin: -1800px 50%;opacity: 1} to{transform: translateX(1000px) rotateY(-30deg) scale(0);transform-origin: -100% 50%;opacity: 1}} @keyframes slide-out-elliptic-top-fwd{0%{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% -500px;opacity: 1} to{transform: translateY(-600px) rotateX(20deg) scale(6);transform-origin: 50% 200%;opacity: 0}} @keyframes slide-out-elliptic-top-bck{0%{transform: translateY(0) rotateX(0) scale(1);transform-origin: 50% 1400px;opacity: 1} to{transform: translateY(-600px) rotateX(-30deg) scale(0);transform-origin: 50% 100%;opacity: 1}} @keyframes bounce-out-fwd{0%, 15%, 38%, 70%{transform: translateZ(0);animation-timing-function: ease-out} 5%{transform: translateZ(90px);animation-timing-function: ease-in} 25%{transform: translateZ(95px);animation-timing-function: ease-in} 52%{transform: translateZ(150px);animation-timing-function: ease-in} 85%{opacity: 1} to{transform: translateZ(500px);animation-timing-function: ease-in;opacity: 0}} @keyframes bounce-out-bck{0%, 15%, 38%{transform: translateZ(0);animation-timing-function: ease-out} 5%{transform: translateZ(-100px);animation-timing-function: ease-in} 25%{transform: translateZ(-110px);animation-timing-function: ease-in} 52%{transform: translateZ(-200px);animation-timing-function: ease-in} 70%{transform: translateZ(0) scale(1);animation-timing-function: ease-out} 85%{opacity: 1} to{transform: translateZ(-900px) scale(0);animation-timing-function: ease-in;opacity: 0}} @keyframes bounce-out-left{0%, 15%, 38%, 70%{transform: translateX(0);animation-timing-function: ease-out} 5%{transform: translateX(-30px);animation-timing-function: ease-in} 25%{transform: translateX(-38px);animation-timing-function: ease-in} 52%{transform: translateX(-80px);animation-timing-function: ease-in} 85%{opacity: 1} to{transform: translateX(-1000px);opacity: 0}} @keyframes bounce-out-bottom{0%, 15%, 38%, 70%{transform: translateY(0);animation-timing-function: ease-out} 5%{transform: translateY(30px);animation-timing-function: ease-in} 25%{transform: translateY(38px);animation-timing-function: ease-in} 52%{transform: translateY(75px);animation-timing-function: ease-in} 85%{opacity: 1} to{transform: translateY(800px);opacity: 0}} @keyframes bounce-out-right{0%, 15%, 38%, 65%{transform: translateX(0);animation-timing-function: ease-out} 5%{transform: translateX(30px);animation-timing-function: ease-in} 25%{transform: translateX(38px);animation-timing-function: ease-in} 52%{transform: translateX(80px);animation-timing-function: ease-in} 85%{opacity: 1} to{transform: translateX(1000px);opacity: 0}} @keyframes bounce-out-top{0%, 15%, 38%, 70%{transform: translateY(0);animation-timing-function: ease-out} 5%{transform: translateY(-30px);animation-timing-function: ease-in} 25%{transform: translateY(-38px);animation-timing-function: ease-in} 52%{transform: translateY(-75px);animation-timing-function: ease-in} 85%{opacity: 1} to{transform: translateY(-800px);opacity: 0}} @keyframes swing-out-left-fwd{0%{transform: rotateY(0);transform-origin: left;opacity: 1} to{transform: rotateY(-70deg);transform-origin: left;opacity: 0}} @keyframes swing-out-left-bck{0%{transform: rotateY(0);transform-origin: left;opacity: 1} to{transform: rotateY(100deg);transform-origin: left;opacity: 0}} @keyframes swing-out-bottom-fwd{0%{transform: rotateX(0);transform-origin: bottom;opacity: 1} to{transform: rotateX(-70deg);transform-origin: bottom;opacity: 0}} @keyframes swing-out-bottom-bck{0%{transform: rotateX(0);transform-origin: bottom;opacity: 1} to{transform: rotateX(100deg);transform-origin: bottom;opacity: 0}} @keyframes swing-out-right-fwd{0%{transform: rotateY(0);transform-origin: right;opacity: 1} to{transform: rotateY(70deg);transform-origin: right;opacity: 0}} @keyframes swing-out-right-bck{0%{transform: rotateY(0);transform-origin: right;opacity: 1} to{transform: rotateY(-100deg);transform-origin: right;opacity: 0}} @keyframes swing-out-top-fwd{0%{transform: rotateX(0deg);transform-origin: top;opacity: 1} to{transform: rotateX(70deg);transform-origin: top;opacity: 0}} @keyframes swing-out-top-bck{0%{transform: rotateX(0deg);transform-origin: top;opacity: 1} to{transform: rotateX(-100deg);transform-origin: top;opacity: 0}} @keyframes fade-out-left{0%{transform: translateX(0);opacity: 1} to{transform: translateX(-50px);opacity: 0}} @keyframes fade-out-bl{0%{transform: translateX(0) translateY(0);opacity: 1} to{transform: translateX(-50px) translateY(50px);opacity: 0}} @keyframes fade-out-tl{0%{transform: translateX(0) translateY(0);opacity: 1} to{transform: translateX(-50px) translateY(-50px);opacity: 0}} @keyframes fade-out-bottom{0%{transform: translateY(0);opacity: 1} to{transform: translateY(50px);opacity: 0}} @keyframes fade-out-br{0%{transform: translateX(0) translateY(0);opacity: 1} to{transform: translateX(50px) translateY(50px);opacity: 0}} @keyframes fade-out-right{0%{transform: translateX(0);opacity: 1} to{transform: translateX(50px);opacity: 0}} @keyframes fade-out-tr{0%{transform: translateX(0) translateY(0);opacity: 1} to{transform: translateX(50px) translateY(-50px);opacity: 0}} @keyframes fade-out-top{0%{transform: translateY(0);opacity: 1} to{transform: translateY(-50px);opacity: 0}} @keyframes fade-out-fwd{0%{transform: translateZ(0);opacity: 1} to{transform: translateZ(80px);opacity: 0}} @keyframes fade-out-bck{0%{transform: translateZ(0);opacity: 1} to{transform: translateZ(-80px);opacity: 0}} @keyframes fade-out{0%{opacity: 1} to{opacity: 0}} @keyframes puff-out-ver{0%{transform: scaleY(1);filter: blur(0);opacity: 1} to{transform: scaleY(2);filter: blur(2px);opacity: 0}} @keyframes puff-out-hor{0%{transform: scaleX(1);filter: blur(0);opacity: 1} to{transform: scaleX(2);filter: blur(2px);opacity: 0}} @keyframes puff-out-tl{0%{transform: scale(1);transform-origin: 0% 0%;filter: blur(0);opacity: 1} to{transform: scale(2);transform-origin: 0% 0%;filter: blur(2px);opacity: 0}} @keyframes puff-out-left{0%{transform: scale(1);transform-origin: 0% 50%;filter: blur(0);opacity: 1} to{transform: scale(2);transform-origin: 0% 50%;filter: blur(2px);opacity: 0}} @keyframes puff-out-bl{0%{transform: scale(1);transform-origin: 0% 100%;filter: blur(0);opacity: 1} to{transform: scale(2);transform-origin: 0% 100%;filter: blur(2px);opacity: 0}} @keyframes puff-out-bottom{0%{transform: scale(1);transform-origin: 50% 100%;filter: blur(0);opacity: 1} to{transform: scale(2);transform-origin: 50% 100%;filter: blur(2px);opacity: 0}} @keyframes puff-out-br{0%{transform: scale(1);transform-origin: 100% 100%;filter: blur(0);opacity: 1} to{transform: scale(2);transform-origin: 100% 100%;filter: blur(2px);opacity: 0}} @keyframes puff-out-right{0%{transform: scale(1);transform-origin: 100% 50%;filter: blur(0);opacity: 1} to{transform: scale(2);transform-origin: 100% 50%;filter: blur(2px);opacity: 0}} @keyframes puff-out-tr{0%{transform: scale(1);transform-origin: 100% 0%;filter: blur(0);opacity: 1} to{transform: scale(2);transform-origin: 100% 0%;filter: blur(2px);opacity: 0}} @keyframes puff-out-top{0%{transform: scale(1);transform-origin: 50% 0%;filter: blur(0);opacity: 1} to{transform: scale(2);transform-origin: 50% 0%;filter: blur(2px);opacity: 0}} @keyframes puff-out-center{0%{transform: scale(1);filter: blur(0);opacity: 1} to{transform: scale(2);filter: blur(2px);opacity: 0}} @keyframes flicker-out-1{0%, 13.9%, 15%, 22.9%, 25%, 34.9%, 40%, 42.9%, 45%, 50%, 54.9%, 69.5%, 69.9%, 79.9%{opacity: 1} 14%, 14.9%, 23%, 24.9%, 35%, 39.9%, 43%, 44.9%, 55%, 69.4%, 70%, 79.4%, 80%, 89.8%, 90%{opacity: 0;box-shadow: none} 89.9%{opacity: 1;box-shadow: none} to{opacity: 0}} @keyframes flicker-out-2{0%, 13.9%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .6), 0 0 60px rgba(255, 255, 255, .45), 0 0 110px rgba(255, 255, 255, .25), 0 0 100px rgba(255, 255, 255, .1)} 14%, 14.9%, 23%, 24.9%, 35%, 39.9%, 43%, 44.9%, 55%, 69.4%, 70%, 79.4%, 80%, 89.8%, 90%{opacity: 0;box-shadow: none} 15%, 22.9%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .4), 0 0 110px rgba(255, 255, 255, .2), 0 0 100px rgba(255, 255, 255, .1)} 25%, 34.9%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .35), 0 0 100px rgba(255, 255, 255, .1)} 40%, 42.9%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .35)} 45%, 50%, 54.9%, 69.5%, 69.9%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .45), 0 0 60px rgba(255, 255, 255, .25)} 79.9%{opacity: 1;box-shadow: 0 0 30px rgba(255, 255, 255, .25)} 89.9%{opacity: 1;box-shadow: none} to{opacity: 0}} @keyframes tracking-in-expand-fwd-bottom{0%{letter-spacing: -.5em;transform: translateZ(-700px) translateY(500px);opacity: 0} 40%{opacity: .6} to{transform: translateZ(0) translateY(0);opacity: 1}} @keyframes tracking-in-expand-fwd-top{0%{letter-spacing: -.5em;transform: translateZ(-700px) translateY(-500px);opacity: 0} 40%{opacity: .6} to{transform: translateZ(0) translateY(0);opacity: 1}} @keyframes tracking-in-expand-fwd{0%{letter-spacing: -.5em;transform: translateZ(-700px);opacity: 0} 40%{opacity: .6} to{transform: translateZ(0);opacity: 1}} @keyframes tracking-in-expand{0%{letter-spacing: -.5em;opacity: 0} 40%{opacity: .6} to{opacity: 1}} @keyframes tracking-in-contract-bck-bottom{0%{letter-spacing: 1em;transform: translateZ(400px) translateY(300px);opacity: 0} 40%{opacity: .6} to{transform: translateZ(0) translateY(0);opacity: 1}} @keyframes tracking-in-contract-bck-top{0%{letter-spacing: 1em;transform: translateZ(400px) translateY(-300px);opacity: 0} 40%{opacity: .6} to{transform: translateZ(0) translateY(0);opacity: 1}} @keyframes tracking-in-contract-bck{0%{letter-spacing: 1em;transform: translateZ(400px);opacity: 0} 40%{opacity: .6} to{transform: translateZ(0);opacity: 1}} @keyframes tracking-in-contract{0%{letter-spacing: 1em;opacity: 0} 40%{opacity: .6} to{letter-spacing: normal;opacity: 1}} @keyframes tracking-out-expand{0%{opacity: 1} 60%{opacity: .8} to{letter-spacing: 1em;opacity: 0}} @keyframes tracking-out-expand-fwd{0%{transform: translateZ(0);opacity: 1} 60%{opacity: .8} to{letter-spacing: 1em;transform: translateZ(300px);opacity: 0}} @keyframes tracking-out-expand-fwd-top{0%{transform: translateZ(0) translateY(0);opacity: 1} 60%{opacity: .8} to{letter-spacing: 1em;transform: translateZ(300px) translateY(-200px);opacity: 0}} @keyframes tracking-out-expand-fwd-bottom{0%{transform: translateZ(0) translateY(0);opacity: 1} 60%{opacity: .8} to{letter-spacing: 1em;transform: translateZ(300px) translateY(200px);opacity: 0}} @keyframes tracking-out-contract{0%, 50%{opacity: 1} to{letter-spacing: -.5em;opacity: 0}} @keyframes tracking-out-contract-bck{0%{transform: translateZ(0);opacity: 1} 60%{opacity: 1} to{letter-spacing: -.5em;transform: translateZ(-500px);opacity: 0}} @keyframes tracking-out-contract-bck-top{0%{transform: translateZ(0) translateY(0);opacity: 1} 60%{opacity: 1} to{letter-spacing: -.5em;transform: translateZ(-500px) translateY(-300px);opacity: 0}} @keyframes tracking-out-contract-bck-bottom{0%{transform: translateZ(0) translateY(0);opacity: 1} 60%{opacity: 1} to{letter-spacing: -.5em;transform: translateZ(-500px) translateY(300px);opacity: 0}} @keyframes text-focus-in{0%{filter: blur(12px);opacity: 0} to{filter: blur(0);opacity: 1}} @keyframes focus-in-contract-bck{0%{letter-spacing: 1em;transform: translateZ(300px);filter: blur(12px);opacity: 0} to{transform: translateZ(12px);filter: blur(0);opacity: 1}} @keyframes focus-in-contract{0%{letter-spacing: 1em;filter: blur(12px);opacity: 0} to{filter: blur(0);opacity: 1}} @keyframes focus-in-expand-fwd{0%{letter-spacing: -.5em;transform: translateZ(-800px);filter: blur(12px);opacity: 0} to{transform: translateZ(0);filter: blur(0);opacity: 1}} @keyframes focus-in-expand{0%{letter-spacing: -.5em;filter: blur(12px);opacity: 0} to{filter: blur(0);opacity: 1}} @keyframes text-blur-out{0%{filter: blur(.01)} to{filter: blur(12px) opacity(0%)}} @keyframes blur-out-contract-bck{0%{transform: translateZ(0);filter: blur(.01)} to{letter-spacing: -.5em;transform: translateZ(-500px);filter: blur(12px) opacity(0%)}} @keyframes blur-out-contract{0%{filter: blur(.01)} to{letter-spacing: -.5em;filter: blur(12px) opacity(0%)}} @keyframes blur-out-expand-fwd{0%{transform: translateZ(0);filter: blur(.01)} to{letter-spacing: 1em;transform: translateZ(300px);filter: blur(12px) opacity(0%)}} @keyframes blur-out-expand{0%{filter: blur(.01)} to{letter-spacing: 1em;filter: blur(12px) opacity(0%)}} @keyframes text-pop-up-top{0%{transform: translateY(0);transform-origin: 50% 50%;text-shadow: none} to{transform: translateY(-50px);transform-origin: 50% 50%;text-shadow: 0 1px 0 #ccc, 0 2px 0 #ccc, 0 3px 0 #ccc, 0 4px 0 #ccc, 0 5px 0 #ccc, 0 6px 0 #ccc, 0 7px 0 #ccc, 0 8px 0 #ccc, 0 9px 0 #ccc, 0 50px 30px rgba(0, 0, 0, .3)}} @keyframes text-pop-up-tr{0%{transform: translateY(0) translateX(0);transform-origin: 50% 50%;text-shadow: none} to{transform: translateY(-50px) translateX(50px);transform-origin: 50% 50%;text-shadow: 0 1px 0 #ccc, 0 2px 0 #ccc, 0 3px 0 #ccc, 0 4px 0 #ccc, 0 5px 0 #ccc, 0 6px 0 #ccc, 0 7px 0 #ccc, 0 8px 0 #ccc, 0 9px 0 #ccc, 0 50px 30px rgba(0, 0, 0, .3)}} @keyframes text-pop-up-right{0%{transform: translateX(0);transform-origin: 50% 50%;text-shadow: none} to{transform: translateX(50px);transform-origin: 50% 50%;text-shadow: 0 1px 0 #ccc, 0 2px 0 #ccc, 0 3px 0 #ccc, 0 4px 0 #ccc, 0 5px 0 #ccc, 0 6px 0 #ccc, 0 7px 0 #ccc, 0 8px 0 #ccc, 0 9px 0 #ccc, 0 50px 30px rgba(0, 0, 0, .3)}} @keyframes text-pop-up-br{0%{transform: translateY(0) translateX(0);transform-origin: 50% 50%;text-shadow: none} to{transform: translateY(50px) translateX(50px);transform-origin: 50% 50%;text-shadow: 0 1px 0 #ccc, 0 2px 0 #ccc, 0 3px 0 #ccc, 0 4px 0 #ccc, 0 5px 0 #ccc, 0 6px 0 #ccc, 0 7px 0 #ccc, 0 8px 0 #ccc, 0 9px 0 #ccc, 0 50px 30px rgba(0, 0, 0, .3)}} @keyframes text-pop-up-bottom{0%{transform: translateY(0);transform-origin: 50% 50%;text-shadow: none} to{transform: translateY(50px);transform-origin: 50% 50%;text-shadow: 0 1px 0 #ccc, 0 2px 0 #ccc, 0 3px 0 #ccc, 0 4px 0 #ccc, 0 5px 0 #ccc, 0 6px 0 #ccc, 0 7px 0 #ccc, 0 8px 0 #ccc, 0 9px 0 #ccc, 0 50px 30px rgba(0, 0, 0, .3)}} @keyframes text-pop-up-bl{0%{transform: translateY(0) translateX(0);transform-origin: 50% 50%;text-shadow: none} to{transform: translateY(50px) translateX(-50px);transform-origin: 50% 50%;text-shadow: 0 1px 0 #ccc, 0 2px 0 #ccc, 0 3px 0 #ccc, 0 4px 0 #ccc, 0 5px 0 #ccc, 0 6px 0 #ccc, 0 7px 0 #ccc, 0 8px 0 #ccc, 0 9px 0 #ccc, 0 50px 30px rgba(0, 0, 0, .3)}} @keyframes text-pop-up-left{0%{transform: translateX(0);transform-origin: 50% 50%;text-shadow: none} to{transform: translateX(-50px);transform-origin: 50% 50%;text-shadow: 0 1px 0 #ccc, 0 2px 0 #ccc, 0 3px 0 #ccc, 0 4px 0 #ccc, 0 5px 0 #ccc, 0 6px 0 #ccc, 0 7px 0 #ccc, 0 8px 0 #ccc, 0 9px 0 #ccc, 0 50px 30px rgba(0, 0, 0, .3)}} @keyframes text-pop-up-tl{0%{transform: translateY(0) translateX(0);transform-origin: 50% 50%;text-shadow: none} to{transform: translateY(-50px) translateX(-50px);transform-origin: 50% 50%;text-shadow: 0 1px 0 #ccc, 0 2px 0 #ccc, 0 3px 0 #ccc, 0 4px 0 #ccc, 0 5px 0 #ccc, 0 6px 0 #ccc, 0 7px 0 #ccc, 0 8px 0 #ccc, 0 9px 0 #ccc, 0 50px 30px rgba(0, 0, 0, .3)}} @keyframes text-shadow-drop-bl{0%{text-shadow: 0 0 0 transparent} to{text-shadow: -6px 6px 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-drop-bottom{0%{text-shadow: 0 0 0 transparent} to{text-shadow: 0 6px 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-drop-br{0%{text-shadow: 0 0 0 transparent} to{text-shadow: 6px 6px 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-drop-center{0%{text-shadow: 0 0 0 transparent} to{text-shadow: 0 0 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-drop-left{0%{text-shadow: 0 0 0 transparent} to{text-shadow: -6px 0 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-drop-right{0%{text-shadow: 0 0 0 transparent} to{text-shadow: 6px 0 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-drop-tl{0%{text-shadow: 0 0 0 transparent} to{text-shadow: -6px -6px 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-drop-top{0%{text-shadow: 0 0 0 transparent} to{text-shadow: 0 -6px 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-drop-tr{0%{text-shadow: 0 0 0 transparent} to{text-shadow: 6px -6px 18px rgba(0, 0, 0, .35)}} @keyframes text-shadow-pop-bl{0%{text-shadow: 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555;transform: translateX(0) translateY(0)} to{text-shadow: -1px 1px #555, -2px 2px #555, -3px 3px #555, -4px 4px #555, -5px 5px #555, -6px 6px #555, -7px 7px #555, -8px 8px #555;transform: translateX(8px) translateY(-8px)}} @keyframes text-shadow-pop-bottom{0%{text-shadow: 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555;transform: translateY(0)} to{text-shadow: 0 1px #555, 0 2px #555, 0 3px #555, 0 4px #555, 0 5px #555, 0 6px #555, 0 7px #555, 0 8px #555;transform: translateY(-8px)}} @keyframes text-shadow-pop-br{0%{text-shadow: 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555;transform: translateX(0) translateY(0)} to{text-shadow: 1px 1px #555, 2px 2px #555, 3px 3px #555, 4px 4px #555, 5px 5px #555, 6px 6px #555, 7px 7px #555, 8px 8px #555;transform: translateX(-8px) translateY(-8px)}} @keyframes text-shadow-pop-left{0%{text-shadow: 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555;transform: translateX(0)} to{text-shadow: -1px 0 #555, -2px 0 #555, -3px 0 #555, -4px 0 #555, -5px 0 #555, -6px 0 #555, -7px 0 #555, -8px 0 #555;transform: translateX(8px)}} @keyframes text-shadow-pop-right{0%{text-shadow: 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555;transform: translateX(0)} to{text-shadow: 1px 0 #555, 2px 0 #555, 3px 0 #555, 4px 0 #555, 5px 0 #555, 6px 0 #555, 7px 0 #555, 8px 0 #555;transform: translateX(-8px)}} @keyframes text-shadow-pop-tl{0%{text-shadow: 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555;transform: translateX(0) translateY(0)} to{text-shadow: -1px -1px #555, -2px -2px #555, -3px -3px #555, -4px -4px #555, -5px -5px #555, -6px -6px #555, -7px -7px #555, -8px -8px #555;transform: translateX(8px) translateY(8px)}} @keyframes text-shadow-pop-top{0%{text-shadow: 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555;transform: translateY(0)} to{text-shadow: 0 -1px #555, 0 -2px #555, 0 -3px #555, 0 -4px #555, 0 -5px #555, 0 -6px #555, 0 -7px #555, 0 -8px #555;transform: translateY(8px)}} @keyframes text-shadow-pop-tr{0%{text-shadow: 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555, 0 0 #555;transform: translateX(0) translateY(0)} to{text-shadow: 1px -1px #555, 2px -2px #555, 3px -3px #555, 4px -4px #555, 5px -5px #555, 6px -6px #555, 7px -7px #555, 8px -8px #555;transform: translateX(-8px) translateY(8px)}} @keyframes text-flicker-in-glow{0%{opacity: 0} 10%, 10.2%, 20%, 20.6%, 30%, 30.6%, 45%, 55.1%, 57%, 60.1%, 65%, 75.1%, 77%, 85.1%, 86%{opacity: 0;text-shadow: none} 10.1%{opacity: 1;text-shadow: none} 20.1%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .25)} 30.1%, 30.5%, 45.1%, 50%, 55%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .45), 0 0 60px rgba(255, 255, 255, .25)} 57.1%, 60%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .35)} 65.1%, 75%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .35), 0 0 100px rgba(255, 255, 255, .1)} 77.1%, 85%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .4), 0 0 110px rgba(255, 255, 255, .2), 0 0 100px rgba(255, 255, 255, .1)} 86.1%, to{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .6), 0 0 60px rgba(255, 255, 255, .45), 0 0 110px rgba(255, 255, 255, .25), 0 0 100px rgba(255, 255, 255, .1)}} @keyframes text-flicker-out-glow{0%, 13.9%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .6), 0 0 60px rgba(255, 255, 255, .45), 0 0 110px rgba(255, 255, 255, .25), 0 0 100px rgba(255, 255, 255, .1)} 14%, 14.9%, 23%, 24.9%, 35%, 39.9%, 43%, 44.9%, 55%, 69.4%, 70%, 79.4%, 80%, 89.8%, 90%{opacity: 0;text-shadow: none} 15%, 22.9%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .4), 0 0 110px rgba(255, 255, 255, .2), 0 0 100px rgba(255, 255, 255, .1)} 25%, 34.9%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .35), 0 0 100px rgba(255, 255, 255, .1)} 40%, 42.9%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .55), 0 0 60px rgba(255, 255, 255, .35)} 45%, 50%, 54.9%, 69.5%, 69.9%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .45), 0 0 60px rgba(255, 255, 255, .25)} 79.9%{opacity: 1;text-shadow: 0 0 30px rgba(255, 255, 255, .25)} 89.9%{opacity: 1;text-shadow: none} to{opacity: 0}} @keyframes blink-1{0%, 50%, to{opacity: 1} 25%, 75%{opacity: 0}} @keyframes blink-2{0%, to{opacity: 1} 50%{opacity: .2}} @keyframes bounce-top{0%{transform: translateY(-45px);animation-timing-function: ease-in;opacity: 1} 24%{opacity: 1} 40%{transform: translateY(-24px);animation-timing-function: ease-in} 65%{transform: translateY(-12px);animation-timing-function: ease-in} 82%{transform: translateY(-6px);animation-timing-function: ease-in} 93%{transform: translateY(-4px);animation-timing-function: ease-in} 25%, 55%, 75%, 87%{transform: translateY(0);animation-timing-function: ease-out} to{transform: translateY(0);animation-timing-function: ease-out;opacity: 1}} @keyframes bounce-right{0%{transform: translateX(48px);animation-timing-function: ease-in;opacity: 1} 24%{opacity: 1} 40%{transform: translateX(26px);animation-timing-function: ease-in} 65%{transform: translateX(13px);animation-timing-function: ease-in} 82%{transform: translateX(6.5px);animation-timing-function: ease-in} 93%{transform: translateX(4px);animation-timing-function: ease-in} 25%, 55%, 75%, 87%, 98%{transform: translateX(0);animation-timing-function: ease-out} to{transform: translateX(0);animation-timing-function: ease-out;opacity: 1}} @keyframes bounce-bottom{0%{transform: translateY(45px);animation-timing-function: ease-in;opacity: 1} 24%{opacity: 1} 40%{transform: translateY(24px);animation-timing-function: ease-in} 65%{transform: translateY(12px);animation-timing-function: ease-in} 82%{transform: translateY(6px);animation-timing-function: ease-in} 93%{transform: translateY(4px);animation-timing-function: ease-in} 25%, 55%, 75%, 87%{transform: translateY(0);animation-timing-function: ease-out} to{transform: translateY(0);animation-timing-function: ease-out;opacity: 1}} @keyframes bounce-left{0%{transform: translateX(-48px);animation-timing-function: ease-in;opacity: 1} 24%{opacity: 1} 40%{transform: translateX(-26px);animation-timing-function: ease-in} 65%{transform: translateX(-13px);animation-timing-function: ease-in} 82%{transform: translateX(-6.5px);animation-timing-function: ease-in} 93%{transform: translateX(-4px);animation-timing-function: ease-in} 25%, 55%, 75%, 87%, 98%{transform: translateX(0);animation-timing-function: ease-out} to{transform: translateX(0);animation-timing-function: ease-out;opacity: 1}} @keyframes flicker-1{0%, 41.99%, 43.01%, 47.99%, 49.01%, to{opacity: 1} 42%, 43%, 48%, 49%{opacity: 0}} @keyframes flicker-2{0%, 41.99%, 43.01%, 45.99%, 46.91%, 51.99%, 52.81%, to{opacity: 1} 42%, 43%, 46%, 46.9%, 52%, 52.8%{opacity: 0}} @keyframes flicker-3{0%, 32.98%, 34.02%, 34.98%, 35.92%, 38.98%, 39.82%, 83.98%, 84.92%, to{opacity: 1} 33%, 34%, 35%, 35.9%, 39%, 39.8%, 84%, 84.9%{opacity: 0}} @keyframes flicker-4{0%, 31.98%, 32.82%, 34.98%, 35.72%, 36.98%, 37.62%, 67.98%, 68.42%, 95.98%, 96.72%, 98.98%, 99.62%, to{opacity: 1} 32%, 32.8%, 35%, 35.7%, 37%, 37.6%, 68%, 68.4%, 96%, 96.7%, 99%, 99.6%{opacity: 0}} @keyframes flicker-5{-.02%, 0%, 1%, 1.02%, 101%, 101.02%, 14.98%, 15.18%, 15.48%, 15.82%, 16.02%, 16.22%, 16.98%, 17%, 17.8%, 17.82%, 20.48%, 20.98%, 21%, 21.32%, 22%, 22.02%, 39.98%, 40%, 40.48%, 41%, 41.02%, 41.42%, 41.98%, 42%, 42.8%, 42.82%, 59.98%, 60%, 60.18%, 60.78%, 61.02%, 61.38%, 61.62%, 61.78%, 61.8%, 62.22%, 62.8%, 62.82%, 75.98%, 76%, 77%, 77.02%, 77.98%, 78.82%, 78.98%, 79%, 8.98%, 80%, 80.02%, 9.48%, 9.5%, 9.6%, 9.62%, 9.82%, 99.98%, to{opacity: 1} 61.4%, 62.2%, 9%, 9.8%{opacity: 0} 15%, 15.5%, 15.8%, 16.2%{opacity: .5} 15.2%, 16%, 78%, 78.8%{opacity: .7} 20.5%, 21.3%{opacity: .9} 40.5%, 41.4%{opacity: .6} 60.2%, 61%{opacity: .2} 60.8%, 61.6%{opacity: .4}} @keyframes jello-horizontal{0%, to{transform: scale3d(1, 1, 1)} 30%{transform: scale3d(1.25, .75, 1)} 40%{transform: scale3d(.75, 1.25, 1)} 50%{transform: scale3d(1.15, .85, 1)} 65%{transform: scale3d(.95, 1.05, 1)} 75%{transform: scale3d(1.05, .95, 1)}} @keyframes jello-vertical{0%, to{transform: scale3d(1, 1, 1)} 30%{transform: scale3d(.75, 1.25, 1)} 40%{transform: scale3d(1.25, .75, 1)} 50%{transform: scale3d(.85, 1.15, 1)} 65%{transform: scale3d(1.05, .95, 1)} 75%{transform: scale3d(.95, 1.05, 1)}} @keyframes jello-diagonal-1{0%, to{transform: skew(0deg 0deg)} 30%{transform: skew(25deg 25deg)} 40%{transform: skew(-15deg, -15deg)} 50%{transform: skew(15deg, 15deg)} 65%{transform: skew(-5deg, -5deg)} 75%{transform: skew(5deg, 5deg)}} @keyframes jello-diagonal-2{0%, to{transform: skew(0deg 0deg)} 30%{transform: skew(-25deg -25deg)} 40%{transform: skew(15deg, 15deg)} 50%{transform: skew(-15deg, -15deg)} 65%{transform: skew(5deg, 5deg)} 75%{transform: skew(-5deg, -5deg)}} @keyframes pulsate-bck{0%, to{transform: scale(1)} 50%{transform: scale(.9)}} @keyframes pulsate-fwd{0%, to{transform: scale(1)} 50%{transform: scale(1.1)}} @keyframes ping{0%{transform: scale(.2);opacity: .8} 80%{transform: scale(1.2);opacity: 0} to{transform: scale(2.2);opacity: 0}} @keyframes heartbeat{0%{transform: scale(1);transform-origin: center center;animation-timing-function: ease-out} 10%{transform: scale(.91);animation-timing-function: ease-in} 17%{transform: scale(.98);animation-timing-function: ease-out} 33%{transform: scale(.87);animation-timing-function: ease-in} 45%{transform: scale(1);animation-timing-function: ease-out}} @keyframes shake-bl{0%, to{transform: rotate(0deg);transform-origin: 0 100%} 10%, 90%{transform: rotate(2deg)} 20%, 40%, 60%{transform: rotate(-4deg)} 30%, 50%, 70%{transform: rotate(4deg)} 80%{transform: rotate(-2deg)}} @keyframes shake-br{0%, to{transform: rotate(0deg);transform-origin: 100% 100%} 10%, 90%{transform: rotate(2deg)} 20%, 40%, 60%{transform: rotate(-4deg)} 30%, 50%, 70%{transform: rotate(4deg)} 80%{transform: rotate(-2deg)}} @keyframes shake-horizontal{0%, to{transform: translateX(0)} 10%, 30%, 50%, 70%{transform: translateX(-10px)} 20%, 40%, 60%{transform: translateX(10px)} 80%{transform: translateX(8px)} 90%{transform: translateX(-8px)}} @keyframes shake-left{0%, to{transform: rotate(0deg);transform-origin: 0 50%} 10%, 90%{transform: rotate(2deg)} 20%, 40%, 60%{transform: rotate(-4deg)} 30%, 50%, 70%{transform: rotate(4deg)} 80%{transform: rotate(-2deg)}} @keyframes shake-top{0%, to{transform: rotate(0deg);transform-origin: 50% 0} 10%, 90%{transform: rotate(2deg)} 20%, 40%, 60%{transform: rotate(-4deg)} 30%, 50%, 70%{transform: rotate(4deg)} 80%{transform: rotate(-2deg)}} @keyframes shake-bottom{0%, to{transform: rotate(0deg);transform-origin: 50% 100%} 10%, 90%{transform: rotate(2deg)} 20%, 40%, 60%{transform: rotate(-4deg)} 30%, 50%, 70%{transform: rotate(4deg)} 80%{transform: rotate(-2deg)}} @keyframes shake-lr{0%, to{transform: rotate(0deg);transform-origin: 50% 50%} 10%, 90%{transform: rotate(8deg)} 20%, 40%, 60%{transform: rotate(-10deg)} 30%, 50%, 70%{transform: rotate(10deg)} 80%{transform: rotate(-8deg)}} @keyframes shake-right{0%, to{transform: rotate(0deg);transform-origin: 100% 50%} 10%, 90%{transform: rotate(2deg)} 20%, 40%, 60%{transform: rotate(-4deg)} 30%, 50%, 70%{transform: rotate(4deg)} 80%{transform: rotate(-2deg)}} @keyframes shake-tl{0%, to{transform: rotate(0deg);transform-origin: 0 0} 10%, 90%{transform: rotate(2deg)} 20%, 40%, 60%{transform: rotate(-4deg)} 30%, 50%, 70%{transform: rotate(4deg)} 80%{transform: rotate(-2deg)}} @keyframes shake-tr{0%, to{transform: rotate(0deg);transform-origin: 100% 0} 10%, 90%{transform: rotate(2deg)} 20%, 40%, 60%{transform: rotate(-4deg)} 30%, 50%, 70%{transform: rotate(4deg)} 80%{transform: rotate(-2deg)}} @keyframes shake-vertical{0%, to{transform: translateY(0)} 10%, 30%, 50%, 70%{transform: translateY(-8px)} 20%, 40%, 60%{transform: translateY(8px)} 80%{transform: translateY(6.4px)} 90%{transform: translateY(-6.4px)}} @keyframes vibrate-1{0%, to{transform: translate(0)} 20%{transform: translate(-2px, 2px)} 40%{transform: translate(-2px, -2px)} 60%{transform: translate(2px, 2px)} 80%{transform: translate(2px, -2px)}} @keyframes vibrate-2{0%, to{transform: translate(0)} 20%{transform: translate(2px, -2px)} 40%{transform: translate(2px, 2px)} 60%{transform: translate(-2px, 2px)} 80%{transform: translate(-2px, -2px)}} @keyframes vibrate-3{0%, to{transform: translate(0)} 10%, 50%, 80%{transform: translate(-2px, -2px)} 20%, 60%, 90%{transform: translate(2px, -2px)} 30%, 70%{transform: translate(-2px, 2px)} 40%{transform: translate(2px, 2px)}} @keyframes wobble-hor-bottom{0%, to{transform: translateX(0%);transform-origin: 50% 50%} 15%{transform: translateX(-30px) rotate(-6deg)} 30%{transform: translateX(15px) rotate(6deg)} 45%{transform: translateX(-15px) rotate(-3.6deg)} 60%{transform: translateX(9px) rotate(2.4deg)} 75%{transform: translateX(-6px) rotate(-1.2deg)}} @keyframes wobble-hor-top{0%, to{transform: translateX(0%);transform-origin: 50% 50%} 15%{transform: translateX(-30px) rotate(6deg)} 30%{transform: translateX(15px) rotate(-6deg)} 45%{transform: translateX(-15px) rotate(3.6deg)} 60%{transform: translateX(9px) rotate(-2.4deg)} 75%{transform: translateX(-6px) rotate(1.2deg)}} @keyframes wobble-ver-left{0%, to{transform: translateY(0) rotate(0);transform-origin: 50% 50%} 15%{transform: translateY(-30px) rotate(-6deg)} 30%{transform: translateY(15px) rotate(6deg)} 45%{transform: translateY(-15px) rotate(-3.6deg)} 60%{transform: translateY(9px) rotate(2.4deg)} 75%{transform: translateY(-6px) rotate(-1.2deg)}} @keyframes wobble-ver-right{0%, to{transform: translateY(0) rotate(0);transform-origin: 50% 50%} 15%{transform: translateY(-30px) rotate(6deg)} 30%{transform: translateY(15px) rotate(-6deg)} 45%{transform: translateY(-15px) rotate(3.6deg)} 60%{transform: translateY(9px) rotate(-2.4deg)} 75%{transform: translateY(-6px) rotate(1.2deg)}} @keyframes kenburns-bottom-left{0%{transform: scale(1) translate(0, 0);transform-origin: 16% 84%} to{transform: scale(1.25) translate(-20px, 15px);transform-origin: left bottom}} @keyframes kenburns-bottom-right{0%{transform: scale(1) translate(0, 0);transform-origin: 84% 84%} to{transform: scale(1.25) translate(20px, 15px);transform-origin: right bottom}} @keyframes kenburns-bottom{0%{transform: scale(1) translateY(0);transform-origin: 50% 84%} to{transform: scale(1.25) translateY(15px);transform-origin: bottom}} @keyframes kenburns-left{0%{transform: scale(1) translate(0, 0);transform-origin: 16% 50%} to{transform: scale(1.25) translate(-20px, 15px);transform-origin: left}} @keyframes kenburns-right{0%{transform: scale(1) translate(0, 0);transform-origin: 84% 50%} to{transform: scale(1.25) translateX(20px);transform-origin: right}} @keyframes kenburns-top-left{0%{transform: scale(1) translate(0, 0);transform-origin: 16% 16%} to{transform: scale(1.25) translate(-20px, -15px);transform-origin: top left}} @keyframes kenburns-top-right{0%{transform: scale(1) translate(0, 0);transform-origin: 84% 16%} to{transform: scale(1.25) translate(20px, -15px);transform-origin: right top}} @keyframes kenburns-top{0%{transform: scale(1) translateY(0);transform-origin: 50% 16%} to{transform: scale(1.25) translateY(-15px);transform-origin: top}} @keyframes bg-pan-bl{0%{background-position: 100% 0%} to{background-position: 0% 100%}} @keyframes bg-pan-bottom{0%{background-position: 50% 0%} to{background-position: 50% 100%}} @keyframes bg-pan-br{0%{background-position: 0% 0%} to{background-position: 100% 100%}} @keyframes bg-pan-left{0%{background-position: 100% 50%} to{background-position: 0% 50%}} @keyframes bg-pan-right{0%{background-position: 0% 50%} to{background-position: 100% 50%}} @keyframes bg-pan-tl{0%{background-position: 100% 100%} to{background-position: 0% 0%}} @keyframes bg-pan-top{0%{background-position: 50% 100%} to{background-position: 50% 0%}} @keyframes bg-pan-tr{0%{background-position: 0% 100%} to{background-position: 100% 0%}} @keyframes color-change-2x{0%{background: #19dcea} to{background: #b22cff}} @keyframes color-change-3x{0%{background: #19dcea} 50%{background: #b22cff} to{background: #ea2222}} @keyframes color-change-4x{0%{background: #19dcea} 33.3333%{background: #b22cff} 66.666%{background: #ea2222} to{background: #f5be10}} @keyframes color-change-5x{0%{background: #19dcea} 25%{background: #b22cff} 50%{background: #ea2222} 75%{background: #f5be10} to{background: #3bd80d}}
vace
http://animista.net/ 这个也挺全的，看看是否有必要加一个呢？