%PDF- %PDF-
Direktori : /home/opti/workflow/src/public/app-assets/css-rtl/plugins/loaders/animations/ |
Current File : /home/opti/workflow/src/public/app-assets/css-rtl/plugins/loaders/animations/pacman.css |
@-webkit-keyframes rotate_pacman_half_up { 0% { -webkit-transform: rotate(-270deg); transform: rotate(-270deg); } 50% { -webkit-transform: rotate(-360deg); transform: rotate(-360deg); } 100% { -webkit-transform: rotate(-270deg); transform: rotate(-270deg); } } @-moz-keyframes rotate_pacman_half_up { 0% { -moz-transform: rotate(-270deg); transform: rotate(-270deg); } 50% { -moz-transform: rotate(-360deg); transform: rotate(-360deg); } 100% { -moz-transform: rotate(-270deg); transform: rotate(-270deg); } } @-o-keyframes rotate_pacman_half_up { 0% { -o-transform: rotate(-270deg); transform: rotate(-270deg); } 50% { -o-transform: rotate(-360deg); transform: rotate(-360deg); } 100% { -o-transform: rotate(-270deg); transform: rotate(-270deg); } } @keyframes rotate_pacman_half_up { 0% { -webkit-transform: rotate(-270deg); -moz-transform: rotate(-270deg); -o-transform: rotate(-270deg); transform: rotate(-270deg); } 50% { -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -o-transform: rotate(-360deg); transform: rotate(-360deg); } 100% { -webkit-transform: rotate(-270deg); -moz-transform: rotate(-270deg); -o-transform: rotate(-270deg); transform: rotate(-270deg); } } @-webkit-keyframes rotate_pacman_half_down { 0% { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } 50% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } } @-moz-keyframes rotate_pacman_half_down { 0% { -moz-transform: rotate(-90deg); transform: rotate(-90deg); } 50% { -moz-transform: rotate(0deg); transform: rotate(0deg); } 100% { -moz-transform: rotate(-90deg); transform: rotate(-90deg); } } @-o-keyframes rotate_pacman_half_down { 0% { -o-transform: rotate(-90deg); transform: rotate(-90deg); } 50% { -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -o-transform: rotate(-90deg); transform: rotate(-90deg); } } @keyframes rotate_pacman_half_down { 0% { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); } 50% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); } } @-webkit-keyframes pacman-balls { 75% { opacity: 0.7; } 100% { -webkit-transform: translate(100px, -6.25px); transform: translate(100px, -6.25px); } } @-moz-keyframes pacman-balls { 75% { opacity: 0.7; } 100% { -moz-transform: translate(100px, -6.25px); transform: translate(100px, -6.25px); } } @-o-keyframes pacman-balls { 75% { opacity: 0.7; } 100% { -o-transform: translate(100px, -6.25px); transform: translate(100px, -6.25px); } } @keyframes pacman-balls { 75% { opacity: 0.7; } 100% { -webkit-transform: translate(100px, -6.25px); -moz-transform: translate(100px, -6.25px); -o-transform: translate(100px, -6.25px); transform: translate(100px, -6.25px); } } .pacman { position: relative; } .pacman > div:nth-child(2) { -webkit-animation: pacman-balls 1s -0.99s infinite linear; -moz-animation: pacman-balls 1s -0.99s infinite linear; -o-animation: pacman-balls 1s -0.99s infinite linear; animation: pacman-balls 1s -0.99s infinite linear; } .pacman > div:nth-child(3) { -webkit-animation: pacman-balls 1s -0.66s infinite linear; -moz-animation: pacman-balls 1s -0.66s infinite linear; -o-animation: pacman-balls 1s -0.66s infinite linear; animation: pacman-balls 1s -0.66s infinite linear; } .pacman > div:nth-child(4) { -webkit-animation: pacman-balls 1s -0.33s infinite linear; -moz-animation: pacman-balls 1s -0.33s infinite linear; -o-animation: pacman-balls 1s -0.33s infinite linear; animation: pacman-balls 1s -0.33s infinite linear; } .pacman > div:nth-child(5) { -webkit-animation: pacman-balls 1s 0s infinite linear; -moz-animation: pacman-balls 1s 0s infinite linear; -o-animation: pacman-balls 1s 0s infinite linear; animation: pacman-balls 1s 0s infinite linear; } .pacman > div:first-of-type { width: 0px; height: 0px; border-left: 25px solid transparent; border-top: 25px solid #6B6F82; border-right: 25px solid #6B6F82; border-bottom: 25px solid #6B6F82; border-radius: 25px; -webkit-animation: rotate_pacman_half_up 0.5s 0s infinite; -moz-animation: rotate_pacman_half_up 0.5s 0s infinite; -o-animation: rotate_pacman_half_up 0.5s 0s infinite; animation: rotate_pacman_half_up 0.5s 0s infinite; position: relative; right: -30px; } .pacman > div:nth-child(2) { width: 0px; height: 0px; border-left: 25px solid transparent; border-top: 25px solid #6B6F82; border-right: 25px solid #6B6F82; border-bottom: 25px solid #6B6F82; border-radius: 25px; -webkit-animation: rotate_pacman_half_down 0.5s 0s infinite; -moz-animation: rotate_pacman_half_down 0.5s 0s infinite; -o-animation: rotate_pacman_half_down 0.5s 0s infinite; animation: rotate_pacman_half_down 0.5s 0s infinite; margin-top: -50px; position: relative; right: -30px; } .pacman > div:nth-child(3), .pacman > div:nth-child(4), .pacman > div:nth-child(5), .pacman > div:nth-child(6) { background-color: #6B6F82; width: 15px; height: 15px; border-radius: 100%; margin: 2px; width: 10px; height: 10px; position: absolute; -webkit-transform: translate(0, -6.25px); -moz-transform: translate(0, -6.25px); -ms-transform: translate(0, -6.25px); -o-transform: translate(0, -6.25px); transform: translate(0, -6.25px); top: 25px; right: 70px; }