OwlCyberSecurity - MANAGER
Edit File: mprogress.css
/* Make clicks pass-through */ .ui-mprogress { pointer-events: none; } .ui-mprogress .deter-bar, .ui-mprogress .indeter-bar, .ui-mprogress .query-bar, .ui-mprogress .bar-bg, .ui-mprogress .buffer-bg, .ui-mprogress .mp-ui-dashed { position: fixed; z-index: 1032; top: 0; left: 0; width: 100%; height: 3px; background: #3a81f0; } .ui-mprogress .bar-bg, .ui-mprogress .buffer-bg { z-index: 1031; background: #b0d0ef; } .ui-mprogress .mp-ui-dashed { z-index: 1030; background: transparent; } .ui-mprogress .mp-ui-dashed:before { content: ""; display: block; height: 3px; width: 100%; margin-top: 0px; position: absolute; background: radial-gradient(#a9c0e9 0%, #a9c0e9 16%, transparent 42%); background-size: 10px 10px !important; background-position: 0px -23px; -webkit-animation: buffer 3s infinite linear; -moz-animation: buffer 3s infinite linear; -ms-animation: buffer 3s infinite linear; -o-animation: buffer 3s infinite linear; animation: buffer 3s infinite linear; } .ui-mprogress .peg { position: absolute; display: block; right: 0px; width: 100px; height: 100%; box-shadow: 0 0 10px #3a81f0, 0 0 5px #29d; opacity: 1; -webkit-transform: rotate(3deg) translate(0px, -4px); -moz-transform: rotate(3deg) translate(0px, -4px); -ms-transform: rotate(3deg) translate(0px, -4px); -o-transform: rotate(3deg) translate(0px, -4px); transform: rotate(3deg) translate(0px, -4px); } .ui-mprogress .query-bar { -webkit-animation: querying 2800ms infinite linear; -moz-animation: querying 2800ms infinite linear; -ms-animation: querying 2800ms infinite linear; -o-animation: querying 2800ms infinite linear; animation: querying 2800ms infinite linear; } .ui-mprogress .query-bar.end { -webkit-animation: endquery 1500ms linear; -moz-animation: endquery 1500ms linear; -ms-animation: endquery 1500ms linear; -o-animation: endquery 1500ms linear; animation: endquery 1500ms linear; } .ui-mprogress .indeter-bar { -webkit-animation: indeterminate 2800ms infinite linear; -moz-animation: indeterminate 2800ms infinite linear; -ms-animation: indeterminate 2800ms infinite linear; -o-animation: indeterminate 2800ms infinite linear; animation: indeterminate 2800ms infinite linear; } .mprogress-custom-parent { overflow: hidden; position: relative; } .mprogress-custom-parent .deter-bar, .mprogress-custom-parent .indeter-bar, .mprogress-custom-parent .query-bar, .mprogress-custom-parent .bar-bg, .mprogress-custom-parent .buffer-bg, .mprogress-custom-parent .mp-ui-dashed { position: absolute; } @-moz-keyframes querying { 0% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 20% { -webkit-transform: translateX(30%) scaleX(0.7); -moz-transform: translateX(30%) scaleX(0.7); -ms-transform: translateX(30%) scaleX(0.7); -o-transform: translateX(30%) scaleX(0.7); transform: translateX(30%) scaleX(0.7); } 30% { -webkit-transform: translateX(-20%) scaleX(0.4); -moz-transform: translateX(-20%) scaleX(0.4); -ms-transform: translateX(-20%) scaleX(0.4); -o-transform: translateX(-20%) scaleX(0.4); transform: translateX(-20%) scaleX(0.4); } 55% { -webkit-transform: translateX(-100%) scaleX(0.1); -moz-transform: translateX(-100%) scaleX(0.1); -ms-transform: translateX(-100%) scaleX(0.1); -o-transform: translateX(-100%) scaleX(0.1); transform: translateX(-100%) scaleX(0.1); } 55.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 56% { -webkit-transform: translateX(100%) scaleX(0); -moz-transform: translateX(100%) scaleX(0); -ms-transform: translateX(100%) scaleX(0); -o-transform: translateX(100%) scaleX(0); transform: translateX(100%) scaleX(0); } 56.99% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 70% { -webkit-transform: translateX(35%) scaleX(0.7); -moz-transform: translateX(35%) scaleX(0.7); -ms-transform: translateX(35%) scaleX(0.7); -o-transform: translateX(35%) scaleX(0.7); transform: translateX(35%) scaleX(0.7); } 85% { -webkit-transform: translateX(-28%) scaleX(0.3); -moz-transform: translateX(-28%) scaleX(0.3); -ms-transform: translateX(-28%) scaleX(0.3); -o-transform: translateX(-28%) scaleX(0.3); transform: translateX(-28%) scaleX(0.3); } 95% { -webkit-transform: translateX(-100%) scaleX(0.1); -moz-transform: translateX(-100%) scaleX(0.1); -ms-transform: translateX(-100%) scaleX(0.1); -o-transform: translateX(-100%) scaleX(0.1); transform: translateX(-100%) scaleX(0.1); } 95.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 100% { -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); } } @-webkit-keyframes querying { 0% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 20% { -webkit-transform: translateX(30%) scaleX(0.7); -moz-transform: translateX(30%) scaleX(0.7); -ms-transform: translateX(30%) scaleX(0.7); -o-transform: translateX(30%) scaleX(0.7); transform: translateX(30%) scaleX(0.7); } 30% { -webkit-transform: translateX(-20%) scaleX(0.4); -moz-transform: translateX(-20%) scaleX(0.4); -ms-transform: translateX(-20%) scaleX(0.4); -o-transform: translateX(-20%) scaleX(0.4); transform: translateX(-20%) scaleX(0.4); } 55% { -webkit-transform: translateX(-100%) scaleX(0.1); -moz-transform: translateX(-100%) scaleX(0.1); -ms-transform: translateX(-100%) scaleX(0.1); -o-transform: translateX(-100%) scaleX(0.1); transform: translateX(-100%) scaleX(0.1); } 55.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 56% { -webkit-transform: translateX(100%) scaleX(0); -moz-transform: translateX(100%) scaleX(0); -ms-transform: translateX(100%) scaleX(0); -o-transform: translateX(100%) scaleX(0); transform: translateX(100%) scaleX(0); } 56.99% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 70% { -webkit-transform: translateX(35%) scaleX(0.7); -moz-transform: translateX(35%) scaleX(0.7); -ms-transform: translateX(35%) scaleX(0.7); -o-transform: translateX(35%) scaleX(0.7); transform: translateX(35%) scaleX(0.7); } 85% { -webkit-transform: translateX(-28%) scaleX(0.3); -moz-transform: translateX(-28%) scaleX(0.3); -ms-transform: translateX(-28%) scaleX(0.3); -o-transform: translateX(-28%) scaleX(0.3); transform: translateX(-28%) scaleX(0.3); } 95% { -webkit-transform: translateX(-100%) scaleX(0.1); -moz-transform: translateX(-100%) scaleX(0.1); -ms-transform: translateX(-100%) scaleX(0.1); -o-transform: translateX(-100%) scaleX(0.1); transform: translateX(-100%) scaleX(0.1); } 95.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 100% { -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); } } @-o-keyframes querying { 0% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 20% { -webkit-transform: translateX(30%) scaleX(0.7); -moz-transform: translateX(30%) scaleX(0.7); -ms-transform: translateX(30%) scaleX(0.7); -o-transform: translateX(30%) scaleX(0.7); transform: translateX(30%) scaleX(0.7); } 30% { -webkit-transform: translateX(-20%) scaleX(0.4); -moz-transform: translateX(-20%) scaleX(0.4); -ms-transform: translateX(-20%) scaleX(0.4); -o-transform: translateX(-20%) scaleX(0.4); transform: translateX(-20%) scaleX(0.4); } 55% { -webkit-transform: translateX(-100%) scaleX(0.1); -moz-transform: translateX(-100%) scaleX(0.1); -ms-transform: translateX(-100%) scaleX(0.1); -o-transform: translateX(-100%) scaleX(0.1); transform: translateX(-100%) scaleX(0.1); } 55.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 56% { -webkit-transform: translateX(100%) scaleX(0); -moz-transform: translateX(100%) scaleX(0); -ms-transform: translateX(100%) scaleX(0); -o-transform: translateX(100%) scaleX(0); transform: translateX(100%) scaleX(0); } 56.99% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 70% { -webkit-transform: translateX(35%) scaleX(0.7); -moz-transform: translateX(35%) scaleX(0.7); -ms-transform: translateX(35%) scaleX(0.7); -o-transform: translateX(35%) scaleX(0.7); transform: translateX(35%) scaleX(0.7); } 85% { -webkit-transform: translateX(-28%) scaleX(0.3); -moz-transform: translateX(-28%) scaleX(0.3); -ms-transform: translateX(-28%) scaleX(0.3); -o-transform: translateX(-28%) scaleX(0.3); transform: translateX(-28%) scaleX(0.3); } 95% { -webkit-transform: translateX(-100%) scaleX(0.1); -moz-transform: translateX(-100%) scaleX(0.1); -ms-transform: translateX(-100%) scaleX(0.1); -o-transform: translateX(-100%) scaleX(0.1); transform: translateX(-100%) scaleX(0.1); } 95.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 100% { -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); } } @keyframes querying { 0% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 20% { -webkit-transform: translateX(30%) scaleX(0.7); -moz-transform: translateX(30%) scaleX(0.7); -ms-transform: translateX(30%) scaleX(0.7); -o-transform: translateX(30%) scaleX(0.7); transform: translateX(30%) scaleX(0.7); } 30% { -webkit-transform: translateX(-20%) scaleX(0.4); -moz-transform: translateX(-20%) scaleX(0.4); -ms-transform: translateX(-20%) scaleX(0.4); -o-transform: translateX(-20%) scaleX(0.4); transform: translateX(-20%) scaleX(0.4); } 55% { -webkit-transform: translateX(-100%) scaleX(0.1); -moz-transform: translateX(-100%) scaleX(0.1); -ms-transform: translateX(-100%) scaleX(0.1); -o-transform: translateX(-100%) scaleX(0.1); transform: translateX(-100%) scaleX(0.1); } 55.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 56% { -webkit-transform: translateX(100%) scaleX(0); -moz-transform: translateX(100%) scaleX(0); -ms-transform: translateX(100%) scaleX(0); -o-transform: translateX(100%) scaleX(0); transform: translateX(100%) scaleX(0); } 56.99% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 70% { -webkit-transform: translateX(35%) scaleX(0.7); -moz-transform: translateX(35%) scaleX(0.7); -ms-transform: translateX(35%) scaleX(0.7); -o-transform: translateX(35%) scaleX(0.7); transform: translateX(35%) scaleX(0.7); } 85% { -webkit-transform: translateX(-28%) scaleX(0.3); -moz-transform: translateX(-28%) scaleX(0.3); -ms-transform: translateX(-28%) scaleX(0.3); -o-transform: translateX(-28%) scaleX(0.3); transform: translateX(-28%) scaleX(0.3); } 95% { -webkit-transform: translateX(-100%) scaleX(0.1); -moz-transform: translateX(-100%) scaleX(0.1); -ms-transform: translateX(-100%) scaleX(0.1); -o-transform: translateX(-100%) scaleX(0.1); transform: translateX(-100%) scaleX(0.1); } 95.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 100% { -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); } } @-moz-keyframes endquery { 0% { opacity: 0; -webkit-transform: translateX(-100%) scaleX(1); -moz-transform: translateX(-100%) scaleX(1); -ms-transform: translateX(-100%) scaleX(1); -o-transform: translateX(-100%) scaleX(1); transform: translateX(-100%) scaleX(1); } 10% { opacity: 1; -webkit-transform: translateX(-100%) scaleX(1); -moz-transform: translateX(-100%) scaleX(1); -ms-transform: translateX(-100%) scaleX(1); -o-transform: translateX(-100%) scaleX(1); transform: translateX(-100%) scaleX(1); } 99% { opacity: 1; -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -ms-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); } 100% { opacity: 0; } } @-webkit-keyframes endquery { 0% { opacity: 0; -webkit-transform: translateX(-100%) scaleX(1); -moz-transform: translateX(-100%) scaleX(1); -ms-transform: translateX(-100%) scaleX(1); -o-transform: translateX(-100%) scaleX(1); transform: translateX(-100%) scaleX(1); } 10% { opacity: 1; -webkit-transform: translateX(-100%) scaleX(1); -moz-transform: translateX(-100%) scaleX(1); -ms-transform: translateX(-100%) scaleX(1); -o-transform: translateX(-100%) scaleX(1); transform: translateX(-100%) scaleX(1); } 99% { opacity: 1; -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -ms-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); } 100% { opacity: 0; } } @-o-keyframes endquery { 0% { opacity: 0; -webkit-transform: translateX(-100%) scaleX(1); -moz-transform: translateX(-100%) scaleX(1); -ms-transform: translateX(-100%) scaleX(1); -o-transform: translateX(-100%) scaleX(1); transform: translateX(-100%) scaleX(1); } 10% { opacity: 1; -webkit-transform: translateX(-100%) scaleX(1); -moz-transform: translateX(-100%) scaleX(1); -ms-transform: translateX(-100%) scaleX(1); -o-transform: translateX(-100%) scaleX(1); transform: translateX(-100%) scaleX(1); } 99% { opacity: 1; -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -ms-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); } 100% { opacity: 0; } } @keyframes endquery { 0% { opacity: 0; -webkit-transform: translateX(-100%) scaleX(1); -moz-transform: translateX(-100%) scaleX(1); -ms-transform: translateX(-100%) scaleX(1); -o-transform: translateX(-100%) scaleX(1); transform: translateX(-100%) scaleX(1); } 10% { opacity: 1; -webkit-transform: translateX(-100%) scaleX(1); -moz-transform: translateX(-100%) scaleX(1); -ms-transform: translateX(-100%) scaleX(1); -o-transform: translateX(-100%) scaleX(1); transform: translateX(-100%) scaleX(1); } 99% { opacity: 1; -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -ms-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); } 100% { opacity: 0; } } @-moz-keyframes indeterminate { 0% { -webkit-transform: translateX(-100%) scaleX(0.2); -moz-transform: translateX(-100%) scaleX(0.2); -ms-transform: translateX(-100%) scaleX(0.2); -o-transform: translateX(-100%) scaleX(0.2); transform: translateX(-100%) scaleX(0.2); } 20% { -webkit-transform: translateX(-40%) scaleX(0.2); -moz-transform: translateX(-40%) scaleX(0.2); -ms-transform: translateX(-40%) scaleX(0.2); -o-transform: translateX(-40%) scaleX(0.2); transform: translateX(-40%) scaleX(0.2); } 30% { -webkit-transform: translateX(0%) scaleX(0.5); -moz-transform: translateX(0%) scaleX(0.5); -ms-transform: translateX(0%) scaleX(0.5); -o-transform: translateX(0%) scaleX(0.5); transform: translateX(0%) scaleX(0.5); } 55% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 55.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 56% { -webkit-transform: translateX(-100%) scaleX(0); -moz-transform: translateX(-100%) scaleX(0); -ms-transform: translateX(-100%) scaleX(0); -o-transform: translateX(-100%) scaleX(0); transform: translateX(-100%) scaleX(0); } 56.99% { -webkit-transform: translateX(-100%) scaleX(0.6); -moz-transform: translateX(-100%) scaleX(0.6); -ms-transform: translateX(-100%) scaleX(0.6); -o-transform: translateX(-100%) scaleX(0.6); transform: translateX(-100%) scaleX(0.6); } 75% { -webkit-transform: translateX(-5%) scaleX(0.6); -moz-transform: translateX(-5%) scaleX(0.6); -ms-transform: translateX(-5%) scaleX(0.6); -o-transform: translateX(-5%) scaleX(0.6); transform: translateX(-5%) scaleX(0.6); } 85% { -webkit-transform: translateX(30%) scaleX(0.3); -moz-transform: translateX(30%) scaleX(0.3); -ms-transform: translateX(30%) scaleX(0.3); -o-transform: translateX(30%) scaleX(0.3); transform: translateX(30%) scaleX(0.3); } 98% { -webkit-transform: translateX(100%) scaleX(0.2); -moz-transform: translateX(100%) scaleX(0.2); -ms-transform: translateX(100%) scaleX(0.2); -o-transform: translateX(100%) scaleX(0.2); transform: translateX(100%) scaleX(0.2); } 99.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 100% { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); } } @-webkit-keyframes indeterminate { 0% { -webkit-transform: translateX(-100%) scaleX(0.2); -moz-transform: translateX(-100%) scaleX(0.2); -ms-transform: translateX(-100%) scaleX(0.2); -o-transform: translateX(-100%) scaleX(0.2); transform: translateX(-100%) scaleX(0.2); } 20% { -webkit-transform: translateX(-40%) scaleX(0.2); -moz-transform: translateX(-40%) scaleX(0.2); -ms-transform: translateX(-40%) scaleX(0.2); -o-transform: translateX(-40%) scaleX(0.2); transform: translateX(-40%) scaleX(0.2); } 30% { -webkit-transform: translateX(0%) scaleX(0.5); -moz-transform: translateX(0%) scaleX(0.5); -ms-transform: translateX(0%) scaleX(0.5); -o-transform: translateX(0%) scaleX(0.5); transform: translateX(0%) scaleX(0.5); } 55% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 55.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 56% { -webkit-transform: translateX(-100%) scaleX(0); -moz-transform: translateX(-100%) scaleX(0); -ms-transform: translateX(-100%) scaleX(0); -o-transform: translateX(-100%) scaleX(0); transform: translateX(-100%) scaleX(0); } 56.99% { -webkit-transform: translateX(-100%) scaleX(0.6); -moz-transform: translateX(-100%) scaleX(0.6); -ms-transform: translateX(-100%) scaleX(0.6); -o-transform: translateX(-100%) scaleX(0.6); transform: translateX(-100%) scaleX(0.6); } 75% { -webkit-transform: translateX(-5%) scaleX(0.6); -moz-transform: translateX(-5%) scaleX(0.6); -ms-transform: translateX(-5%) scaleX(0.6); -o-transform: translateX(-5%) scaleX(0.6); transform: translateX(-5%) scaleX(0.6); } 85% { -webkit-transform: translateX(30%) scaleX(0.3); -moz-transform: translateX(30%) scaleX(0.3); -ms-transform: translateX(30%) scaleX(0.3); -o-transform: translateX(30%) scaleX(0.3); transform: translateX(30%) scaleX(0.3); } 98% { -webkit-transform: translateX(100%) scaleX(0.2); -moz-transform: translateX(100%) scaleX(0.2); -ms-transform: translateX(100%) scaleX(0.2); -o-transform: translateX(100%) scaleX(0.2); transform: translateX(100%) scaleX(0.2); } 99.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 100% { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); } } @-o-keyframes indeterminate { 0% { -webkit-transform: translateX(-100%) scaleX(0.2); -moz-transform: translateX(-100%) scaleX(0.2); -ms-transform: translateX(-100%) scaleX(0.2); -o-transform: translateX(-100%) scaleX(0.2); transform: translateX(-100%) scaleX(0.2); } 20% { -webkit-transform: translateX(-40%) scaleX(0.2); -moz-transform: translateX(-40%) scaleX(0.2); -ms-transform: translateX(-40%) scaleX(0.2); -o-transform: translateX(-40%) scaleX(0.2); transform: translateX(-40%) scaleX(0.2); } 30% { -webkit-transform: translateX(0%) scaleX(0.5); -moz-transform: translateX(0%) scaleX(0.5); -ms-transform: translateX(0%) scaleX(0.5); -o-transform: translateX(0%) scaleX(0.5); transform: translateX(0%) scaleX(0.5); } 55% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 55.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 56% { -webkit-transform: translateX(-100%) scaleX(0); -moz-transform: translateX(-100%) scaleX(0); -ms-transform: translateX(-100%) scaleX(0); -o-transform: translateX(-100%) scaleX(0); transform: translateX(-100%) scaleX(0); } 56.99% { -webkit-transform: translateX(-100%) scaleX(0.6); -moz-transform: translateX(-100%) scaleX(0.6); -ms-transform: translateX(-100%) scaleX(0.6); -o-transform: translateX(-100%) scaleX(0.6); transform: translateX(-100%) scaleX(0.6); } 75% { -webkit-transform: translateX(-5%) scaleX(0.6); -moz-transform: translateX(-5%) scaleX(0.6); -ms-transform: translateX(-5%) scaleX(0.6); -o-transform: translateX(-5%) scaleX(0.6); transform: translateX(-5%) scaleX(0.6); } 85% { -webkit-transform: translateX(30%) scaleX(0.3); -moz-transform: translateX(30%) scaleX(0.3); -ms-transform: translateX(30%) scaleX(0.3); -o-transform: translateX(30%) scaleX(0.3); transform: translateX(30%) scaleX(0.3); } 98% { -webkit-transform: translateX(100%) scaleX(0.2); -moz-transform: translateX(100%) scaleX(0.2); -ms-transform: translateX(100%) scaleX(0.2); -o-transform: translateX(100%) scaleX(0.2); transform: translateX(100%) scaleX(0.2); } 99.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 100% { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); } } @keyframes indeterminate { 0% { -webkit-transform: translateX(-100%) scaleX(0.2); -moz-transform: translateX(-100%) scaleX(0.2); -ms-transform: translateX(-100%) scaleX(0.2); -o-transform: translateX(-100%) scaleX(0.2); transform: translateX(-100%) scaleX(0.2); } 20% { -webkit-transform: translateX(-40%) scaleX(0.2); -moz-transform: translateX(-40%) scaleX(0.2); -ms-transform: translateX(-40%) scaleX(0.2); -o-transform: translateX(-40%) scaleX(0.2); transform: translateX(-40%) scaleX(0.2); } 30% { -webkit-transform: translateX(0%) scaleX(0.5); -moz-transform: translateX(0%) scaleX(0.5); -ms-transform: translateX(0%) scaleX(0.5); -o-transform: translateX(0%) scaleX(0.5); transform: translateX(0%) scaleX(0.5); } 55% { -webkit-transform: translateX(100%) scaleX(0.7); -moz-transform: translateX(100%) scaleX(0.7); -ms-transform: translateX(100%) scaleX(0.7); -o-transform: translateX(100%) scaleX(0.7); transform: translateX(100%) scaleX(0.7); } 55.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 56% { -webkit-transform: translateX(-100%) scaleX(0); -moz-transform: translateX(-100%) scaleX(0); -ms-transform: translateX(-100%) scaleX(0); -o-transform: translateX(-100%) scaleX(0); transform: translateX(-100%) scaleX(0); } 56.99% { -webkit-transform: translateX(-100%) scaleX(0.6); -moz-transform: translateX(-100%) scaleX(0.6); -ms-transform: translateX(-100%) scaleX(0.6); -o-transform: translateX(-100%) scaleX(0.6); transform: translateX(-100%) scaleX(0.6); } 75% { -webkit-transform: translateX(-5%) scaleX(0.6); -moz-transform: translateX(-5%) scaleX(0.6); -ms-transform: translateX(-5%) scaleX(0.6); -o-transform: translateX(-5%) scaleX(0.6); transform: translateX(-5%) scaleX(0.6); } 85% { -webkit-transform: translateX(30%) scaleX(0.3); -moz-transform: translateX(30%) scaleX(0.3); -ms-transform: translateX(30%) scaleX(0.3); -o-transform: translateX(30%) scaleX(0.3); transform: translateX(30%) scaleX(0.3); } 98% { -webkit-transform: translateX(100%) scaleX(0.2); -moz-transform: translateX(100%) scaleX(0.2); -ms-transform: translateX(100%) scaleX(0.2); -o-transform: translateX(100%) scaleX(0.2); transform: translateX(100%) scaleX(0.2); } 99.99% { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } 100% { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); } } @-moz-keyframes buffer { 0% { opacity: 1; background-position: 0px -23px; } 50% { opacity: 0; } 100% { opacity: 1; background-position: -200px -23px; } } @-webkit-keyframes buffer { 0% { opacity: 1; background-position: 0px -23px; } 50% { opacity: 0; } 100% { opacity: 1; background-position: -200px -23px; } } @-o-keyframes buffer { 0% { opacity: 1; background-position: 0px -23px; } 50% { opacity: 0; } 100% { opacity: 1; background-position: -200px -23px; } } @keyframes buffer { 0% { opacity: 1; background-position: 0px -23px; } 50% { opacity: 0; } 100% { opacity: 1; background-position: -200px -23px; } }