123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475 |
- /*========================================================
- DARK LAYOUT
- =========================================================*/
- @-webkit-keyframes ball-scale-ripple-multiple {
- 0% {
- transform: scale(0.1);
- opacity: 1;
- }
- 70% {
- transform: scale(1);
- opacity: 0.7;
- }
- 100% {
- opacity: 0;
- }
- }
- @keyframes ball-scale-ripple-multiple {
- 0% {
- transform: scale(0.1);
- opacity: 1;
- }
- 70% {
- transform: scale(1);
- opacity: 0.7;
- }
- 100% {
- opacity: 0;
- }
- }
- .ball-scale-ripple-multiple {
- position: relative;
- transform: translateY(-25px);
- }
- .ball-scale-ripple-multiple > div:nth-child(0) {
- -webkit-animation-delay: -0.8s;
- animation-delay: -0.8s;
- }
- .ball-scale-ripple-multiple > div:nth-child(1) {
- -webkit-animation-delay: -0.6s;
- animation-delay: -0.6s;
- }
- .ball-scale-ripple-multiple > div:nth-child(2) {
- -webkit-animation-delay: -0.4s;
- animation-delay: -0.4s;
- }
- .ball-scale-ripple-multiple > div:nth-child(3) {
- -webkit-animation-delay: -0.2s;
- animation-delay: -0.2s;
- }
- .ball-scale-ripple-multiple > div {
- -webkit-animation-fill-mode: both;
- animation-fill-mode: both;
- position: absolute;
- top: -2px;
- left: -26px;
- width: 50px;
- height: 50px;
- border-radius: 100%;
- border: 2px solid #b8c2cc;
- -webkit-animation: ball-scale-ripple-multiple 1.25s 0s infinite cubic-bezier(0.21, 0.53, 0.56, 0.8);
- animation: ball-scale-ripple-multiple 1.25s 0s infinite cubic-bezier(0.21, 0.53, 0.56, 0.8);
- }
|