From c3c5d9f0db6a42632dbbeac83d8f02feca71c35e Mon Sep 17 00:00:00 2001
From: "Vineeth.TR"
Date: Tue, 28 Jul 2020 19:44:58 +0530
Subject: [PATCH 1/9] Initial commit
---
LICENSE | 21 +++++++++++++++++++++
1 file changed, 21 insertions(+)
create mode 100644 LICENSE
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 00000000..3f527c7d
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 Vineeth.TR
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
From 40285cbcbd7733a01492c7796b8ec4d65dad3b1d Mon Sep 17 00:00:00 2001
From: "Vineeth.tr"
Date: Tue, 28 Jul 2020 22:00:26 +0530
Subject: [PATCH 2/9] page init
---
browserconfig.xml | 9 +
css/styles.css | 4045 +++++++++++++++++++++++
data.js | 5127 +++++++++++++++++++++++++++++
images/Loader-one.png | Bin 0 -> 4899 bytes
images/Loader-screen.png | Bin 0 -> 55583 bytes
images/android-chrome-192x192.png | Bin 0 -> 14657 bytes
images/android-chrome-512x512.png | Bin 0 -> 47243 bytes
images/apple-touch-icon.png | Bin 0 -> 13497 bytes
images/favicon-16x16.png | Bin 0 -> 1193 bytes
images/favicon-32x32.png | Bin 0 -> 2105 bytes
images/favicon.ico | Bin 0 -> 15086 bytes
images/loader.png | Bin 0 -> 111637 bytes
images/mstile-150x150.png | Bin 0 -> 9482 bytes
images/safari-pinned-tab.svg | 2182 ++++++++++++
index.html | 194 ++
index.js | 64 +
scss/_keyframes.SCSS | 676 ++++
scss/_rest.scss | 209 ++
scss/styles.scss | 2796 ++++++++++++++++
site.webmanifest | 19 +
20 files changed, 15321 insertions(+)
create mode 100644 browserconfig.xml
create mode 100644 css/styles.css
create mode 100644 data.js
create mode 100644 images/Loader-one.png
create mode 100644 images/Loader-screen.png
create mode 100644 images/android-chrome-192x192.png
create mode 100644 images/android-chrome-512x512.png
create mode 100644 images/apple-touch-icon.png
create mode 100644 images/favicon-16x16.png
create mode 100644 images/favicon-32x32.png
create mode 100644 images/favicon.ico
create mode 100644 images/loader.png
create mode 100644 images/mstile-150x150.png
create mode 100644 images/safari-pinned-tab.svg
create mode 100644 index.html
create mode 100644 index.js
create mode 100644 scss/_keyframes.SCSS
create mode 100644 scss/_rest.scss
create mode 100644 scss/styles.scss
create mode 100644 site.webmanifest
diff --git a/browserconfig.xml b/browserconfig.xml
new file mode 100644
index 00000000..35157e2c
--- /dev/null
+++ b/browserconfig.xml
@@ -0,0 +1,9 @@
+
+
+
+
+
+ #da532c
+
+
+
diff --git a/css/styles.css b/css/styles.css
new file mode 100644
index 00000000..bbe97b0f
--- /dev/null
+++ b/css/styles.css
@@ -0,0 +1,4045 @@
+*, *:after, *:before {
+ box-sizing: border-box;
+}
+
+::-webkit-scrollbar {
+ width: 8px;
+ height: 8px;
+}
+
+/* Track */
+::-webkit-scrollbar-track {
+ background: #263238;
+}
+
+/* Handle */
+::-webkit-scrollbar-thumb {
+ background: #FF3D00;
+}
+
+/* Handle on hover */
+::-webkit-scrollbar-thumb:hover {
+ background: #fff;
+}
+
+body {
+ margin: 0;
+ display: flex;
+ flex-wrap: wrap;
+ background: #263238;
+ font-family: Arial, Helvetica, sans-serif;
+}
+
+body.pop {
+ overflow: hidden;
+}
+
+section {
+ min-width: 200px;
+ width: 33.33%;
+ height: 200px;
+ padding: 10px;
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #ccc;
+ cursor: pointer;
+ transition: 0.3s linear;
+}
+
+section:nth-child(2n + 1) {
+ background: rgba(0, 0, 0, 0.1);
+}
+
+section:hover {
+ background: rgba(0, 0, 0, 0.3);
+}
+
+@media (max-width: 768px) {
+ section {
+ width: 50%;
+ }
+}
+
+@media (max-width: 480px) {
+ section {
+ width: 100%;
+ }
+}
+
+header {
+ background: #0d161b;
+ padding: 10px 20px;
+ min-height: 50px;
+ width: 100%;
+}
+
+.brand {
+ color: #fff;
+ font-size: 32px;
+ display: inline-block;
+ position: relative;
+}
+
+.brand::after {
+ content: '';
+ position: absolute;
+ left: 20px;
+ bottom: 7px;
+ border: 3px solid #FFF;
+ border-bottom-color: #FF3D00;
+ width: 20px;
+ height: 20px;
+ border-radius: 50%;
+ animation: rotation 0.6s linear infinite;
+}
+
+footer {
+ background: #0d161b;
+ padding: 20px;
+ min-height: 100px;
+ width: 100%;
+}
+
+.overlay {
+ position: fixed;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background: rgba(0, 0, 0, 0.7);
+ z-index: 2000;
+ visibility: hidden;
+ opacity: 0;
+ overflow-y: auto;
+}
+
+.overlay.in {
+ visibility: visible;
+ opacity: 1;
+}
+
+.btn-close {
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ z-index: 5;
+ line-height: 20px;
+ height: 20px;
+ width: 20px;
+ font-size: 26px;
+ font-weight: 400;
+ padding: 0;
+ background: #eee;
+ border: none;
+ outline: none;
+ cursor: pointer;
+}
+
+.popup {
+ position: relative;
+ transform: translateY(-20px);
+ background: #fff;
+ padding: 20px 15px;
+ max-width: 600px;
+ min-height: 400px;
+ margin: 20px auto;
+ width: 100%;
+ transition: 0.2s ease-in;
+}
+
+.in .popup {
+ transform: translateY(10px);
+}
+
+.showcase {
+ background: #263238;
+ height: 200px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-bottom: 15px;
+}
+
+.code-area .code-header {
+ padding: 5px 10px;
+ background: #222;
+ color: #fff;
+ font-size: 14px;
+ position: relative;
+}
+
+.code-area + .code-area {
+ margin-top: 10px;
+}
+
+.copy {
+ outline: none;
+ border: none;
+ background: #000;
+ position: absolute;
+ right: 5px;
+ top: 50%;
+ transform: translateY(-50%);
+ color: #fff;
+ padding: 3px 8px;
+ cursor: pointer;
+ user-select: none;
+}
+
+.copy::before {
+ content: '';
+ display: inline-block;
+ width: 10px;
+ height: 12px;
+ border: 1px solid #fff;
+ box-shadow: 2px -2px #000, 3px -3px;
+ margin-right: 8px;
+ position: relative;
+ top: 3px;
+}
+
+code {
+ background: #000;
+ padding: 5px 10px;
+ display: block;
+ white-space: pre;
+ color: #03a9f4;
+ min-height: 30px;
+ font-size: 14px;
+ line-height: 18px;
+}
+
+#markup {
+ color: #f4a003;
+}
+
+#css {
+ max-height: 200px;
+ overflow: auto;
+}
+
+/* keyFrames */
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+
+@keyframes rotationBack {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-360deg);
+ }
+}
+
+@keyframes rotationBreak {
+ 0% {
+ transform: rotate(0);
+ }
+ 25% {
+ transform: rotate(90deg);
+ }
+ 50% {
+ transform: rotate(180deg);
+ }
+ 75% {
+ transform: rotate(270deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+
+@keyframes zeroRotation {
+ 0% {
+ transform: scale(1) rotate(0deg);
+ }
+ 100% {
+ transform: scale(0) rotate(360deg);
+ }
+}
+
+@keyframes shadowExpandX {
+ 0% {
+ box-shadow: 0 0, 0 0;
+ color: rgba(255, 255, 255, 0.2);
+ }
+ 100% {
+ box-shadow: -24px 0, 24px 0;
+ color: rgba(255, 255, 255, 0.8);
+ }
+}
+
+@keyframes shadowPulse {
+ 33% {
+ background: #FFF;
+ box-shadow: -24px 0 #FF3D00, 24px 0 #FFF;
+ }
+ 66% {
+ background: #FF3D00;
+ box-shadow: -24px 0 #FFF, 24px 0 #FFF;
+ }
+ 100% {
+ background: #FFF;
+ box-shadow: -24px 0 #FFF, 24px 0 #FF3D00;
+ }
+}
+
+@keyframes shadowRolling {
+ 0% {
+ box-shadow: 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
+ }
+ 12% {
+ box-shadow: 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
+ }
+ 25% {
+ box-shadow: 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
+ }
+ 36% {
+ box-shadow: 120px 0 white, 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 130px 0 white, 120px 0 white, 110px 0 white, 100px 0 white;
+ }
+ 62% {
+ box-shadow: 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white, 110px 0 white;
+ }
+ 75% {
+ box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white;
+ }
+ 87% {
+ box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white;
+ }
+ 100% {
+ box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader14 {
+ 0% {
+ transform: scale(0);
+ opacity: 1;
+ }
+ 100% {
+ transform: scale(1);
+ opacity: 0;
+ }
+}
+
+@keyframes scale50 {
+ 0%, 100% {
+ transform: scale(0);
+ }
+ 50% {
+ transform: scale(1);
+ }
+}
+
+@keyframes scaleOut {
+ 0% {
+ transform: scale(0);
+ }
+ 100% {
+ transform: scale(1);
+ }
+}
+
+@keyframes animloader27 {
+ 0%, 100% {
+ transform: scale(0);
+ opacity: 1;
+ }
+ 50% {
+ transform: scale(1);
+ opacity: 0;
+ }
+}
+
+@keyframes animloader28 {
+ 0% {
+ box-shadow: -72px 0 #FFF inset;
+ }
+ 100% {
+ box-shadow: 48px 0 #FFF inset;
+ }
+}
+
+@keyframes animloader38 {
+ 50% {
+ transform: scale(1) translate(-50%, -50%);
+ }
+}
+
+@keyframes animloader42 {
+ 0% {
+ box-shadow: -38px -6px, -14px 6px, 14px -6px;
+ }
+ 33% {
+ box-shadow: -38px 6px, -14px -6px, 14px 6px;
+ }
+ 66% {
+ box-shadow: -38px -6px, -14px 6px, 14px -6px;
+ }
+ 100% {
+ box-shadow: -38px 6px, -14px -6px, 14px 6px;
+ }
+}
+
+@keyframes animloader44 {
+ 0% {
+ box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 -2px;
+ }
+ 25% {
+ box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 2px;
+ }
+ 50% {
+ box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 2px, -38px 0 0 -2px;
+ }
+ 75% {
+ box-shadow: 14px 0 0 2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 -2px;
+ }
+ 100% {
+ box-shadow: 14px 0 0 -2px, 38px 0 0 2px, -14px 0 0 -2px, -38px 0 0 -2px;
+ }
+}
+
+@keyframes animloader45 {
+ 0% {
+ box-shadow: -38px -12px , -14px 0, 14px 0, 38px 0;
+ }
+ 33% {
+ box-shadow: -38px 0px, -14px -12px, 14px 0, 38px 0;
+ }
+ 66% {
+ box-shadow: -38px 0px , -14px 0, 14px -12px, 38px 0;
+ }
+ 100% {
+ box-shadow: -38px 0 , -14px 0, 14px 0 , 38px -12px;
+ }
+}
+
+@keyframes animloader46 {
+ 0% {
+ background: white;
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+ }
+ 14% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px white, 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+ }
+ 28% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px white, 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+ }
+ 42% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px white, 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+ }
+ 57% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px white, 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+ }
+ 71% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px white, 9px 16px 0 -6px rgba(255, 255, 255, 0);
+ }
+ 85% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px white;
+ }
+ 100% {
+ background: rgba(255, 255, 255, 0.5);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader34 {
+ 0% {
+ border-color: rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.75);
+ }
+ 33% {
+ border-color: rgba(255, 255, 255, 0.75) rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35);
+ }
+ 66% {
+ border-color: rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.75) rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25);
+ }
+ 100% {
+ border-color: rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.75) rgba(255, 255, 255, 0.15);
+ }
+}
+
+@keyframes animloader51 {
+ 0% {
+ border-color: white rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
+ }
+ 33% {
+ border-color: white white rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
+ }
+ 66% {
+ border-color: white white white rgba(255, 255, 255, 0);
+ }
+ 100% {
+ border-color: white white white white;
+ }
+}
+
+@keyframes animloader57 {
+ 0% {
+ box-shadow: 0 0, 0 0, 0 0;
+ }
+ 33% {
+ box-shadow: 24px 0px, 24px 0px, 24px 0px;
+ }
+ 66% {
+ box-shadow: 24px 24px, 24px 24px, 24px 0px;
+ }
+ 100% {
+ box-shadow: 0px 24px, 24px 24px, 24px 0px;
+ }
+}
+
+@keyframes animloader58 {
+ 0%, 32% {
+ box-shadow: 0 24px white, 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 33%, 65% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 66%, 99% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px white, 0px 48px rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px white, 0px 48px white;
+ }
+}
+
+@keyframes animloader58m {
+ 0% {
+ transform: translate(0, 0) rotateX(0) rotateY(0);
+ }
+ 33% {
+ transform: translate(100%, 0) rotateX(0) rotateY(180deg);
+ }
+ 66% {
+ transform: translate(100%, 100%) rotateX(-180deg) rotateY(180deg);
+ }
+ 100% {
+ transform: translate(0, 100%) rotateX(-180deg) rotateY(360deg);
+ }
+}
+
+@keyframes flipX {
+ 0% {
+ transform: perspective(200px) rotateX(0deg) rotateY(0deg);
+ }
+ 50% {
+ transform: perspective(200px) rotateX(-180deg) rotateY(0deg);
+ }
+ 100% {
+ transform: perspective(200px) rotateX(-180deg) rotateY(-180deg);
+ }
+}
+
+@keyframes fill {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 0 -48px inset;
+ }
+}
+
+@keyframes fillX {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 48px 0 inset;
+ }
+}
+
+@keyframes animloader56 {
+ 0% {
+ transform: translate(0, 0) rotateX(0) rotateY(0);
+ }
+ 25% {
+ transform: translate(100%, 0) rotateX(0) rotateY(180deg);
+ }
+ 50% {
+ transform: translate(100%, 100%) rotateX(-180deg) rotateY(180deg);
+ }
+ 75% {
+ transform: translate(0, 100%) rotateX(-180deg) rotateY(360deg);
+ }
+ 100% {
+ transform: translate(0, 0) rotateX(0) rotateY(360deg);
+ }
+}
+
+@keyframes animloader59 {
+ 0% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 12% {
+ box-shadow: 0 24px white, 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 25% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 37% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px white, 0px 48px rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px white, 0px 48px white;
+ }
+ 62% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px white, 24px 48px white, 0px 48px white;
+ }
+ 75% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px rgba(255, 255, 255, 0), 24px 48px white, 0px 48px white;
+ }
+ 87% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px white;
+ }
+ 100% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader60 {
+ 0% {
+ top: 0;
+ color: white;
+ }
+ 50% {
+ top: 30px;
+ color: rgba(255, 255, 255, 0.2);
+ }
+ 100% {
+ top: 0;
+ color: white;
+ }
+}
+
+@keyframes animloader61 {
+ 0% {
+ height: 48px;
+ }
+ 100% {
+ height: 4.8px;
+ }
+}
+
+@keyframes animloader61m {
+ 0% {
+ height: 40px;
+ transform: translateY(0);
+ }
+ 100% {
+ height: 10px;
+ transform: translateY(30px);
+ }
+}
+
+@keyframes animloader63 {
+ 0% {
+ box-shadow: 20px 0 rgba(255, 255, 255, 0.25), 40px 0 white, 60px 0 white;
+ }
+ 50% {
+ box-shadow: 20px 0 white, 40px 0 rgba(255, 255, 255, 0.25), 60px 0 white;
+ }
+ 100% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 rgba(255, 255, 255, 0.25);
+ }
+}
+
+@keyframes animloader64 {
+ 0% {
+ box-shadow: 20px -10px, 40px 10px, 60px 0px;
+ }
+ 25% {
+ box-shadow: 20px 0px, 40px 0px, 60px 10px;
+ }
+ 50% {
+ box-shadow: 20px 10px, 40px -10px, 60px 0px;
+ }
+ 75% {
+ box-shadow: 20px 0px, 40px 0px, 60px -10px;
+ }
+ 100% {
+ box-shadow: 20px -10px, 40px 10px, 60px 0px;
+ }
+}
+
+@keyframes animloader65 {
+ 0% {
+ box-shadow: -10px 20px, 10px 35px , 0px 50px;
+ }
+ 25% {
+ box-shadow: 0px 20px , 0px 35px, 10px 50px;
+ }
+ 50% {
+ box-shadow: 10px 20px, -10px 35px, 0px 50px;
+ }
+ 75% {
+ box-shadow: 0px 20px, 0px 35px, -10px 50px;
+ }
+ 100% {
+ box-shadow: -10px 20px, 10px 35px, 0px 50px;
+ }
+}
+
+@keyframes animloader66 {
+ 0% {
+ width: 4.8px;
+ }
+ 100% {
+ width: 48px;
+ }
+}
+
+@keyframes animloader68 {
+ 0% {
+ box-shadow: 20px 0 rgba(255, 255, 255, 0), 40px 0 rgba(255, 255, 255, 0), 60px 0 rgba(255, 255, 255, 0), 80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
+ }
+ 20% {
+ box-shadow: 20px 0 white, 40px 0 rgba(255, 255, 255, 0), 60px 0 rgba(255, 255, 255, 0), 80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
+ }
+ 40% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 rgba(255, 255, 255, 0), 80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
+ }
+ 60% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 white, 80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
+ }
+ 80% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 white, 80px 0 white, 100px 0 rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 white, 80px 0 white, 100px 0 white;
+ }
+}
+
+@keyframes animloader69 {
+ 0% {
+ width: 20px;
+ }
+ 100% {
+ width: 48px;
+ }
+}
+
+@keyframes animloader71 {
+ 0% {
+ left: 0;
+ transform: translateX(-100%);
+ }
+ 100% {
+ left: 100%;
+ transform: translateX(0%);
+ }
+}
+
+@keyframes animloader89 {
+ 0% {
+ box-shadow: 11px 0 rgba(255, 255, 255, 0), 22px 0 rgba(255, 255, 255, 0), 33px 0 rgba(255, 255, 255, 0), 44px 0 rgba(255, 255, 255, 0);
+ }
+ 25% {
+ box-shadow: 11px 0 white, 22px 0 rgba(255, 255, 255, 0), 33px 0 rgba(255, 255, 255, 0), 44px 0 rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 11px 0 white, 22px 0 white, 33px 0 rgba(255, 255, 255, 0), 44px 0 rgba(255, 255, 255, 0);
+ }
+ 75% {
+ box-shadow: 11px 0 white, 22px 0 white, 33px 0 white, 44px 0 rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 11px 0 white, 22px 0 white, 33px 0 white, 44px 0 white;
+ }
+}
+
+@keyframes animloader91 {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 0 -70px inset;
+ }
+}
+
+@keyframes animloader92 {
+ 0% {
+ box-shadow: 2px 0px rgba(255, 255, 255, 0), 12px 0px rgba(255, 255, 255, 0.3), 20px 0px rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 2px -5px rgba(255, 255, 255, 0.5), 12px -3px rgba(255, 255, 255, 0.5), 20px -2px rgba(255, 255, 255, 0.6);
+ }
+ 100% {
+ box-shadow: 2px -8px rgba(255, 255, 255, 0), 12px -5px rgba(255, 255, 255, 0), 20px -5px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader93 {
+ 0% {
+ transform: rotate(-70deg);
+ }
+ 10% {
+ transform: rotate(-40deg);
+ }
+ 20%, 45%, 35% {
+ transform: rotate(-10deg);
+ }
+ 40%, 30% {
+ transform: rotate(-30deg);
+ }
+ 50%, 60% {
+ transform: rotate(20deg);
+ }
+ 55%, 65%, 75% {
+ transform: rotate(40deg);
+ }
+ 70% {
+ transform: rotate(45deg);
+ }
+ 85%, 90% {
+ transform: rotate(50deg);
+ }
+ 95% {
+ transform: rotate(75deg);
+ }
+ 100%, 93% {
+ transform: rotate(70deg);
+ }
+}
+
+@keyframes animloader94 {
+ 0% {
+ transform: translate(-10px, -10px);
+ }
+ 25% {
+ transform: translate(-10px, 10px);
+ }
+ 50% {
+ transform: translate(10px, 10px);
+ }
+ 75% {
+ transform: translate(10px, -10px);
+ }
+ 100% {
+ transform: translate(-10px, -10px);
+ }
+}
+
+@keyframes animloader98 {
+ 0% {
+ background-position: 0px 80px;
+ }
+ 100% {
+ background-position: 0px 0px;
+ }
+}
+
+@keyframes animloader98s {
+ 0% {
+ box-shadow: 4px -10px rgba(255, 255, 255, 0), 6px 0px rgba(255, 255, 255, 0), 8px -15px rgba(255, 255, 255, 0), 12px 0px rgba(255, 255, 255, 0);
+ }
+ 20% {
+ box-shadow: 4px -20px rgba(255, 255, 255, 0), 8px -10px rgba(255, 255, 255, 0), 10px -30px rgba(255, 255, 255, 0.5), 15px -5px rgba(255, 255, 255, 0);
+ }
+ 40% {
+ box-shadow: 2px -40px rgba(255, 255, 255, 0.5), 8px -30px rgba(255, 255, 255, 0.4), 8px -60px rgba(255, 255, 255, 0.5), 12px -15px rgba(255, 255, 255, 0.5);
+ }
+ 60% {
+ box-shadow: 4px -60px rgba(255, 255, 255, 0.5), 6px -50px rgba(255, 255, 255, 0.4), 10px -90px rgba(255, 255, 255, 0.5), 15px -25px rgba(255, 255, 255, 0.5);
+ }
+ 80% {
+ box-shadow: 2px -80px rgba(255, 255, 255, 0.5), 4px -70px rgba(255, 255, 255, 0.4), 8px -120px rgba(255, 255, 255, 0), 12px -35px rgba(255, 255, 255, 0.5);
+ }
+ 100% {
+ box-shadow: 4px -100px rgba(255, 255, 255, 0), 8px -90px rgba(255, 255, 255, 0), 10px -120px rgba(255, 255, 255, 0), 15px -45px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader99 {
+ 0% {
+ box-shadow: 0px 0px inset;
+ }
+ 100% {
+ box-shadow: 0px -80px inset;
+ }
+}
+
+@keyframes animloader100 {
+ 0% {
+ box-shadow: 25px 0 white, 50px 0 white, 75px 0 white, 100px 0 white, 125px 0 white, 150px 0 white, 25px 0 white, 50px 0 white, 75px 0 white, 100px 0 white, 125px 0 white, 150px 0 white;
+ }
+ 50% {
+ box-shadow: 25px 20px white, 50px 60px rgba(255, 255, 255, 0), 75px 30px rgba(255, 255, 255, 0), 100px 70px rgba(255, 255, 255, 0), 125px 40px white, 150px 60px rgba(255, 255, 255, 0), 25px 20px white, 50px 30px white, 75px 10px white, 100px 30px white, 125px 30px rgba(255, 255, 255, 0), 150px 30px rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 25px 60px rgba(255, 255, 255, 0), 50px 60px rgba(255, 255, 255, 0), 75px 50px rgba(255, 255, 255, 0), 100px 70px rgba(255, 255, 255, 0), 125px 70px rgba(255, 255, 255, 0), 150px 60px rgba(255, 255, 255, 0), 25px 80px rgba(255, 255, 255, 0), 50px 80px rgba(255, 255, 255, 0), 75px 70px rgba(255, 255, 255, 0), 100px 60px rgba(255, 255, 255, 0), 125px 30px rgba(255, 255, 255, 0), 150px 30px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader105 {
+ 0% {
+ height: 64px;
+ }
+ 90%, 100% {
+ height: 0px;
+ }
+}
+
+@keyframes animloader106back {
+ 0%, 30%, 70% {
+ transform: translateY(0px);
+ }
+ 20%, 40%, 100% {
+ transform: translateY(-5px);
+ }
+}
+
+@keyframes animloader106 {
+ 0% {
+ box-shadow: 4px 4px 12px 2px rgba(255, 61, 0, 0.75);
+ width: 34px;
+ height: 34px;
+ background-position: -44px -44px;
+ background-size: 100px 100px;
+ }
+ 100% {
+ box-shadow: 2px 2px 8px 0px rgba(255, 61, 0, 0.5);
+ width: 30px;
+ height: 28px;
+ background-position: -36px -36px;
+ background-size: 80px 80px;
+ }
+}
+
+@keyframes animloader108 {
+ 0% {
+ box-shadow: 0 0 0 -2px , 0 0 0 -2px , 0 0 0 -5px , 0 0 0 -5px;
+ }
+ 20% {
+ box-shadow: 40px -1px 0 -2px , 0 0 0 -2px , 40px -1px 0 -5px , 0 0 0 -5px;
+ }
+ 40% {
+ box-shadow: 40px -1px 0 -2px , -40px -1px 0 -2px , 40px -1px 0 -5px ,-40px -1px 0 -5px;
+ }
+ 60% {
+ box-shadow: 40px -1px 0 -2px , -40px -1px 0 -2px , 23px -29px 0 -5px ,-40px -1px 0 -5px;
+ }
+ 80%, 95% {
+ box-shadow: 40px -1px 0 -2px , -40px -1px 0 -2px , 23px -29px 0 -5px , -23px -29px 0 -5px;
+ }
+ 100% {
+ box-shadow: 40px -1px 0 -2px rgba(255, 255, 255, 0), -40px -1px 0 -2px rgba(255, 255, 255, 0), 23px -29px 0 -5px rgba(255, 255, 255, 0), -23px -29px 0 -5px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader108s {
+ 0% {
+ box-shadow: 0 0 0 -2px , 0 0 0 -2px , 0 0 0 -5px , 0 0 0 -5px;
+ }
+ 20% {
+ box-shadow: 40px 2px 0 -2px , 0 0 0 -2px , 40px 2px 0 -5px , 0 0 0 -5px;
+ }
+ 40% {
+ box-shadow: 40px 2px 0 -2px , -40px 2px 0 -2px , 40px 2px 0 -5px , -40px 2px 0 -5px;
+ }
+ 60% {
+ box-shadow: 40px 2px 0 -2px , -40px 2px 0 -2px , 23px -23px 0 -5px , -40px 2px 0 -5px;
+ }
+ 80%, 95% {
+ box-shadow: 40px 2px 0 -2px , -40px 2px 0 -2px , 23px -23px 0 -5px , -23px -23px 0 -5px;
+ }
+ 100% {
+ box-shadow: 40px 2px 0 -2px rgba(255, 255, 255, 0), -40px 2px 0 -2px rgba(255, 255, 255, 0), 23px -23px 0 -5px rgba(255, 255, 255, 0), -23px -23px 0 -5px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader115 {
+ 0% {
+ box-shadow: 10px 0 rgba(255, 255, 255, 0), 20px 0 rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 10px 0 white, 20px 0 rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 10px 0 white, 20px 0 white;
+ }
+}
+
+@keyframes animloader116 {
+ 0% {
+ top: 8px;
+ transform: rotate(0deg) scale(1);
+ }
+ 100% {
+ top: 0px;
+ transform: rotate(180deg) scale(1.5);
+ }
+}
+
+@keyframes animloader117 {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 0 -28px inset;
+ }
+}
+
+@keyframes animMarker {
+ 0% {
+ transform: rotate(45deg) translate(5px, 5px);
+ }
+ 100% {
+ transform: rotate(45deg) translate(-5px, -5px);
+ }
+}
+
+@keyframes animShadow {
+ 0% {
+ transform: scale(0.5);
+ }
+ 100% {
+ transform: scale(1);
+ }
+}
+
+@keyframes bump {
+ 0% {
+ transform: translate(-50%, 5px);
+ }
+ 100% {
+ transform: translate(-50%, -5px);
+ }
+}
+
+@keyframes animPend {
+ 0% {
+ transform: rotate(22deg);
+ }
+ 50% {
+ transform: rotate(0deg);
+ }
+}
+
+@keyframes animPend2 {
+ 0%, 55% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-22deg);
+ }
+}
+
+@keyframes animloader85 {
+ 0%, 100% {
+ transform: translateX(-150%);
+ }
+ 50% {
+ transform: translateX(150%);
+ }
+}
+
+@keyframes barStripe {
+ 0% {
+ background-position: 1em 0;
+ }
+ 100% {
+ background-position: 0 0;
+ }
+}
+
+@keyframes raceBoard {
+ 0% {
+ background-position: 0 0, 16px 16px;
+ }
+ 100% {
+ background-position: 32px 0px, 48px 16px;
+ }
+}
+
+@keyframes fadePush {
+ 0% {
+ transform: translate(-50%, -15px);
+ opacity: 0;
+ }
+ 50% {
+ transform: translate(-50%, 0px);
+ opacity: 1;
+ }
+ 100% {
+ transform: translate(-50%, 15px);
+ opacity: 0;
+ }
+}
+
+@keyframes fadePull {
+ 0% {
+ transform: translate(-50%, 15px);
+ opacity: 0;
+ }
+ 50% {
+ transform: translate(-50%, 0px);
+ opacity: 1;
+ }
+ 100% {
+ transform: translate(-50%, -15px);
+ opacity: 0;
+ }
+}
+
+@keyframes hitZak {
+ 0% {
+ left: 0;
+ transform: translateX(-1%);
+ }
+ 100% {
+ left: 100%;
+ transform: translateX(-99%);
+ }
+}
+
+@keyframes animFw {
+ 0% {
+ width: 0;
+ }
+ 100% {
+ width: 100%;
+ }
+}
+
+@keyframes coli1 {
+ 0% {
+ transform: rotate(-45deg) translateX(0px);
+ opacity: 0.7;
+ }
+ 100% {
+ transform: rotate(-45deg) translateX(-45px);
+ opacity: 0;
+ }
+}
+
+@keyframes coli2 {
+ 0% {
+ transform: rotate(45deg) translateX(0px);
+ opacity: 1;
+ }
+ 100% {
+ transform: rotate(45deg) translateX(-45px);
+ opacity: 0.7;
+ }
+}
+
+@keyframes animloader121 {
+ 0% {
+ background-position: 0% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ }
+ 100% {
+ background-position: 100% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ }
+}
+
+@keyframes animloader123 {
+ 0% {
+ background-position: 0% 0, 120px 0, 120px 40px, 120px 80px;
+ }
+ 100% {
+ background-position: 100% 0, 120px 0, 120px 40px, 120px 80px;
+ }
+}
+
+@keyframes animloader124 {
+ 0% {
+ background-position: 0% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ }
+ 100% {
+ background-position: 150% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ }
+}
+
+@keyframes animloader126 {
+ 0% {
+ background-position: 0 0, 0 0, 0px 85px, 0px 110px;
+ }
+ 100% {
+ background-position: 150% 0, 0 0, 0px 85px, 0px 110px;
+ }
+}
+
+@keyframes floating {
+ 0% {
+ transform: translateY(0);
+ }
+ 100% {
+ transform: translateY(-25px);
+ }
+}
+
+@keyframes animloader110 {
+ 0% {
+ height: 100%;
+ }
+ 100% {
+ height: 0%;
+ }
+}
+
+@keyframes animloader111 {
+ 0% {
+ width: 0%;
+ }
+ 100% {
+ width: 100%;
+ }
+}
+
+@keyframes animloader113 {
+ 0% {
+ transform: translate(0px, 0px) scaleX(1);
+ }
+ 14% {
+ transform: translate(-12px, -16px) scaleX(1.05);
+ }
+ 28% {
+ transform: translate(-27px, -28px) scaleX(1.07);
+ }
+ 42% {
+ transform: translate(-46px, -35px) scaleX(1.1);
+ }
+ 57% {
+ transform: translate(-70px, -37px) scaleX(1.1);
+ }
+ 71% {
+ transform: translate(-94px, -32px) scaleX(1.07);
+ }
+ 85% {
+ transform: translate(-111px, -22px) scaleX(1.05);
+ }
+ 100% {
+ transform: translate(-125px, -9px) scaleX(1);
+ }
+}
+
+@keyframes animloader113L {
+ 0% {
+ box-shadow: 0 -6px, -122.9px -8px;
+ }
+ 25%, 75% {
+ box-shadow: 0 0px, -122.9px -8px;
+ }
+ 100% {
+ box-shadow: 0 0px, -122.9px -16px;
+ }
+}
+
+@keyframes animloader114 {
+ 0% {
+ transform: translateY(8px) scaleY(1) scaleX(1.25);
+ }
+ 25%, 75% {
+ transform: translateY(-5px) scaleY(1.2) scaleX(1);
+ }
+ 50% {
+ transform: translateY(-10px) scaleY(1) scaleX(1);
+ }
+ 100% {
+ transform: translateY(8px) scaleY(0.8) scaleX(0.8);
+ }
+}
+
+@keyframes animloader118 {
+ 0% {
+ transform: scale(0.8);
+ }
+ 100% {
+ transform: scale(1.2);
+ }
+}
+
+@keyframes animloader119 {
+ 0% {
+ filter: blur(0px);
+ transform: skew(0deg);
+ }
+ 100% {
+ filter: blur(3px);
+ transform: skew(-4deg);
+ }
+}
+
+.loader-1 {
+ width: 48px;
+ height: 48px;
+ border: 5px solid #FFF;
+ border-bottom-color: #FF3D00;
+ border-radius: 50%;
+ display: inline-block;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-2 {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-2:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ border: 3px solid transparent;
+ border-bottom-color: #FF3D00;
+}
+
+.loader-3 {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-3:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 56px;
+ height: 56px;
+ border-radius: 50%;
+ border: 3px solid transparent;
+ border-bottom-color: #FF3D00;
+}
+
+.loader-4 {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-4:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ border: 3px solid;
+ border-color: #FF3D00 transparent;
+}
+
+.loader-5 {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-5:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 56px;
+ height: 56px;
+ border-radius: 50%;
+ border: 3px solid;
+ border-color: #FF3D00 transparent;
+}
+
+.loader-6 {
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-6:after, .loader-6:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 6px;
+ height: 6px;
+ transform: translate(150%, 150%);
+ border-radius: 50%;
+}
+
+.loader-6:before {
+ left: auto;
+ top: auto;
+ right: 0;
+ bottom: 0;
+ transform: translate(-150%, -150%);
+}
+
+.loader-7 {
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-7:after, .loader-7:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 6px;
+ height: 6px;
+ border-radius: 50%;
+}
+
+.loader-7:before {
+ left: auto;
+ top: auto;
+ right: 0;
+ bottom: 0;
+}
+
+.loader-8 {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-8:after {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 16px;
+ height: 16px;
+ transform: translate(-50%, 50%);
+ border-radius: 50%;
+}
+
+.loader-9 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 2px solid #FF3D00;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-9:after {
+ content: '';
+ position: absolute;
+ left: 4px;
+ top: 4px;
+ border: 2px solid #FFF;
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+}
+
+.loader-10 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 3px solid;
+ border-color: #FFF #FFF transparent;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-10:after {
+ content: '';
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ border: 3px solid;
+ border-color: transparent #FF3D00 #FF3D00;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ animation: rotationBack 0.5s linear infinite;
+ transform-origin: center center;
+}
+
+.loader-11 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 3px solid;
+ border-color: #FFF #FFF transparent transparent;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-11:after, .loader-11:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ border: 3px solid;
+ border-color: transparent transparent #FF3D00 #FF3D00;
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ animation: rotationBack 0.5s linear infinite;
+ transform-origin: center center;
+}
+
+.loader-11:before {
+ width: 32px;
+ height: 32px;
+ border-color: #FFF #FFF transparent transparent;
+ animation: rotation 1.5s linear infinite;
+}
+
+.loader-12 {
+ width: 48px;
+ height: 48px;
+ border: 3px dotted #FFF;
+ border-style: solid solid dotted dotted;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 2s linear infinite;
+}
+
+.loader-12:after {
+ content: '';
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ border: 3px dotted #FF3D00;
+ border-style: solid solid dotted;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ animation: rotationBack 1s linear infinite;
+ transform-origin: center center;
+}
+
+.loader-13 {
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-13:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 0;
+ background: #FF3D00;
+ width: 3px;
+ height: 24px;
+ transform: translateX(-50%);
+}
+
+.loader-14 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-14::after, .loader-14::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: animloader14 2s linear infinite;
+}
+
+.loader-14::after {
+ animation-delay: 1s;
+}
+
+.loader-15 {
+ width: 48px;
+ height: 48px;
+ border: 5px dotted #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 2s linear infinite;
+}
+
+.loader-16 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ background: linear-gradient(0deg, rgba(255, 61, 0, 0.2) 33%, #ff3d00 100%);
+ animation: rotation 1s linear infinite;
+}
+
+.loader-16:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 44px;
+ height: 44px;
+ border-radius: 50%;
+ background: #263238;
+}
+
+.loader-17 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ border-top: 3px solid #FFF;
+ border-right: 3px solid transparent;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-18 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ border-top: 4px solid #FFF;
+ border-right: 4px solid transparent;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-18:after {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ border-bottom: 4px solid #FF3D00;
+ border-left: 4px solid transparent;
+}
+
+.loader-19 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ border-top: 4px solid #FFF;
+ border-right: 4px solid transparent;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-19:after {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ border-left: 4px solid #FF3D00;
+ border-bottom: 4px solid transparent;
+ animation: rotation 0.5s linear infinite reverse;
+}
+
+.loader-20 {
+ width: 48px;
+ height: 48px;
+ border: 5px solid;
+ border-color: #FF3D00 transparent;
+ border-radius: 50%;
+ display: inline-block;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-21 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 10px solid;
+ border-color: rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.5);
+ animation: rotation 1s linear infinite;
+}
+
+.loader-22 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 10px solid;
+ animation: animloader51 1s linear infinite alternate;
+}
+
+.loader-23 {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-bottom-color: transparent;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-23:after {
+ content: '';
+ position: absolute;
+ left: 20px;
+ top: 31px;
+ border: 10px solid transparent;
+ border-right-color: #FFF;
+ transform: rotate(-40deg);
+}
+
+.loader-24 {
+ width: 48px;
+ height: 48px;
+ border-width: 3px;
+ border-style: dashed solid solid dotted;
+ border-color: #FF3D00 #FF3D00 transparent #FF3D00;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-24:after {
+ content: '';
+ position: absolute;
+ left: 20px;
+ top: 31px;
+ border: 10px solid transparent;
+ border-right-color: #FF3D00;
+ transform: rotate(-40deg);
+}
+
+.loader-25 {
+ width: 48px;
+ height: 48px;
+ background: #FFF;
+ display: inline-block;
+ border-radius: 50%;
+ animation: animloader14 1s ease-in infinite;
+}
+
+.loader-26 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-26::after, .loader-26::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ background: #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: animloader14 2s linear infinite;
+}
+
+.loader-26::after {
+ animation-delay: 1s;
+}
+
+.loader-27 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-27::after, .loader-27::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ background: #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: animloader27 2s ease-in-out infinite;
+}
+
+.loader-27::after {
+ animation-delay: 1s;
+}
+
+.loader-28 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ animation: animloader28 1s linear infinite;
+}
+
+.loader-29 {
+ border: 24px solid #FFF;
+ border-bottom-color: #FF3D00;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-30 {
+ border: 2px solid #FFF;
+ width: 48px;
+ height: 48px;
+ background: #FF3D00;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 2s linear infinite;
+}
+
+.loader-30:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ border: 24px solid;
+ border-color: transparent #FFF;
+ border-radius: 50%;
+ transform: translate(-50%, -50%);
+}
+
+.loader-31 {
+ width: 48px;
+ height: 48px;
+ background: #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-31:after {
+ content: '';
+ position: absolute;
+ left: 6px;
+ top: 10px;
+ width: 12px;
+ height: 12px;
+ color: #FF3D00;
+ background: currentColor;
+ border-radius: 50%;
+ box-shadow: 25px 2px, 10px 22px;
+}
+
+.loader-32 {
+ width: 48px;
+ height: 48px;
+ border: 4px solid;
+ background: rgba(255, 255, 255, 0.2);
+ border-color: transparent #FFF #FFF transparent;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s ease-in-out infinite;
+}
+
+.loader-32:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ border: 12px solid;
+ border-color: transparent #FF3D00 #FF3D00 transparent;
+ transform: translate(-50%, -50%);
+ border-radius: 50%;
+}
+
+.loader-33 {
+ border: 2px solid;
+ border-color: transparent #FFF;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 2s linear infinite;
+}
+
+.loader-33:after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ border: 24px solid;
+ border-color: transparent rgba(255, 255, 255, 0.15);
+ border-radius: 50%;
+ transform: translate(-50%, -50%);
+}
+
+.loader-34 {
+ border: 24px solid;
+ border-color: rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.5);
+ border-radius: 50%;
+ display: inline-block;
+ animation: animloader34 1s linear infinite;
+}
+
+.loader-35 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-35:after, .loader-35:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 16px;
+ height: 16px;
+ transform: translate(-50%, 50%);
+ border-radius: 50%;
+}
+
+.loader-35:before {
+ left: auto;
+ right: 0;
+ background: #FFF;
+ transform: translate(50%, 100%);
+}
+
+.loader-36 {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ animation: zeroRotation 1s linear infinite alternate;
+}
+
+.loader-36:after, .loader-36:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 16px;
+ height: 16px;
+ transform: translate(-50%, 50%);
+ border-radius: 50%;
+}
+
+.loader-36:before {
+ left: auto;
+ right: 0;
+ transform: translate(50%, 100%);
+}
+
+.loader-37 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-37:after, .loader-37:before {
+ content: '';
+ position: absolute;
+ width: 24px;
+ height: 24px;
+ top: 0;
+ background-color: #FFF;
+ border-radius: 50%;
+ animation: scale50 1s infinite ease-in-out;
+}
+
+.loader-37:before {
+ top: auto;
+ bottom: 0;
+ background-color: #FF3D00;
+ animation-delay: 0.5s;
+}
+
+.loader-38 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-38:after, .loader-38:before {
+ content: '';
+ position: absolute;
+ width: 24px;
+ height: 24px;
+ top: 50%;
+ left: 50%;
+ transform: scale(0.5) translate(0, 0);
+ background-color: #FFF;
+ border-radius: 50%;
+ animation: animloader38 1s infinite ease-in-out;
+}
+
+.loader-38:before {
+ background-color: #FF3D00;
+ transform: scale(0.5) translate(-48px, -48px);
+}
+
+.loader-39 {
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ animation: shadowExpandX 2s linear infinite alternate;
+}
+
+.loader-40 {
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ box-shadow: -24px 0 #FFF, 24px 0 #FFF;
+ animation: shadowPulse 2s linear infinite;
+}
+
+.loader-41 {
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ background: #FF3D00;
+ color: #FFF;
+ box-shadow: -24px 0, 24px 0;
+ animation: rotation 2s ease-in-out infinite;
+}
+
+.loader-42 {
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ animation: animloader42 1s linear infinite alternate;
+}
+
+.loader-43 {
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ left: -100px;
+ animation: shadowRolling 2s linear infinite;
+}
+
+.loader-44 {
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ animation: animloader44 2s linear infinite;
+}
+
+.loader-45 {
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ animation: animloader45 1s linear infinite alternate;
+}
+
+.loader-46 {
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-46::after {
+ content: '';
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ position: absolute;
+ left: 0;
+ transform: translate(-50%, 100%);
+ animation: animloader46 1s linear infinite;
+ top: 0;
+}
+
+.loader-47 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-47::after, .loader-47::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: rotation 2s ease-in-out infinite;
+}
+
+.loader-47::after {
+ border-color: #FF3D00;
+ animation-delay: 1s;
+}
+
+.loader-48 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-48::after, .loader-48::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border: 4px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: animloader14 2s ease-in-out infinite;
+}
+
+.loader-48::after {
+ border-color: #FF3D00;
+ animation-delay: 1s;
+}
+
+.loader-49 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-49::after, .loader-49::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: rotation 2s ease-in-out infinite alternate;
+}
+
+.loader-49::after {
+ border-color: #FF3D00;
+ animation-direction: alternate-reverse;
+}
+
+.loader-50 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-50::after, .loader-50::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: scaleOut 2s ease-in-out infinite;
+}
+
+.loader-50::after {
+ border-color: #FF3D00;
+ animation-delay: 1s;
+}
+
+.loader-51 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-51::after, .loader-51::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: rotationBreak 3s ease-in-out infinite alternate;
+}
+
+.loader-51::after {
+ border-color: #FF3D00;
+ animation-direction: alternate-reverse;
+}
+
+.loader-52 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border: 2px solid #FFF;
+ animation: rotation 2s linear infinite;
+}
+
+.loader-52:after, .loader-52:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ border: 2px solid #FF3D00;
+ width: 38px;
+ height: 38px;
+ animation: rotationBack 1.5s linear infinite;
+ transform-origin: center center;
+}
+
+.loader-52:before {
+ width: 28px;
+ height: 28px;
+ border-color: #FFF;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-53 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ animation: flipX 1s linear infinite;
+}
+
+.loader-54 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ border: 1px solid;
+ animation: fill 2s linear infinite alternate;
+}
+
+.loader-55 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ animation: zeroRotation 1s ease infinite alternate-reverse;
+}
+
+.loader-56 {
+ width: 24px;
+ height: 24px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ animation: animloader56 2s linear infinite;
+}
+
+.loader-57 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-57::after {
+ content: '';
+ width: 24px;
+ height: 24px;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FFF;
+ color: #FFF;
+ animation: animloader57 2s linear infinite alternate;
+}
+
+.loader-58 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-58::before {
+ content: '';
+ width: 24px;
+ height: 24px;
+ position: absolute;
+ left: 0;
+ top: -24px;
+ animation: animloader58 2s linear infinite alternate;
+}
+
+.loader-58::after {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 24px;
+ height: 24px;
+ background: rgba(255, 255, 255, 0.85);
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
+ animation: animloader58m 2s linear infinite alternate;
+}
+
+.loader-59 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ transform: rotate(45deg);
+}
+
+.loader-59::before {
+ content: '';
+ width: 24px;
+ height: 24px;
+ position: absolute;
+ left: 0;
+ top: -24px;
+ animation: animloader59 4s ease infinite;
+}
+
+.loader-59::after {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 24px;
+ height: 24px;
+ background: rgba(255, 255, 255, 0.85);
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
+ animation: animloader56 2s ease infinite;
+}
+
+.loader-60 {
+ width: 16px;
+ height: 16px;
+ box-shadow: 0 30px, 0 -30px;
+ border-radius: 4px;
+ background: currentColor;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ left: -30px;
+ animation: animloader60 2s ease infinite;
+}
+
+.loader-60::after, .loader-60::before {
+ content: '';
+ width: 16px;
+ height: 16px;
+ box-shadow: 0 30px, 0 -30px;
+ border-radius: 4px;
+ background: currentColor;
+ color: #FFF;
+ position: absolute;
+ left: 30px;
+ top: 0;
+ animation: animloader60 2s 0.2s ease infinite;
+}
+
+.loader-60::before {
+ animation-delay: 0.4s;
+ left: 60px;
+}
+
+[data-index="61"] {
+ align-items: normal;
+ padding-top: 75px;
+}
+
+.loader-61 {
+ width: 8px;
+ height: 40px;
+ border-radius: 4px;
+ display: inline-block;
+ position: relative;
+ background: currentColor;
+ color: #FFF;
+ animation: animloader61m 0.3s 0.3s linear infinite alternate;
+}
+
+.loader-61::after, .loader-61::before {
+ content: '';
+ width: 8px;
+ height: 40px;
+ border-radius: 4px;
+ background: currentColor;
+ position: absolute;
+ bottom: 0;
+ left: 20px;
+ animation: animloader61 0.3s 0.45s linear infinite alternate;
+}
+
+.loader-61::before {
+ left: -20px;
+ animation-delay: 0s;
+}
+
+.loader-62 {
+ width: 8px;
+ height: 40px;
+ border-radius: 4px;
+ display: inline-block;
+ position: relative;
+ background: currentColor;
+ color: #FFF;
+ animation: animloader61 0.3s 0.3s linear infinite alternate;
+}
+
+.loader-62::after, .loader-62::before {
+ content: '';
+ width: 8px;
+ height: 40px;
+ border-radius: 4px;
+ background: currentColor;
+ position: absolute;
+ top: 50%;
+ transform: translateY(-50%);
+ left: 20px;
+ animation: animloader61 0.3s 0.45s linear infinite alternate;
+}
+
+.loader-62::before {
+ left: -20px;
+ animation-delay: 0s;
+}
+
+.loader-63 {
+ width: 8px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ left: -40px;
+ animation: animloader63 1s linear infinite alternate;
+}
+
+.loader-64 {
+ width: 8px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ left: -60px;
+ color: #FFF;
+ animation: animloader64 0.6s linear infinite;
+}
+
+.loader-65 {
+ width: 48px;
+ height: 6px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ top: -50px;
+ color: #FFF;
+ animation: animloader65 0.6s linear infinite;
+}
+
+[data-index="66"] {
+ justify-content: normal;
+ padding-left: 15%;
+}
+
+.loader-66 {
+ width: 4.8px;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ color: #FFF;
+ background: currentColor;
+ animation: animloader66 0.3s 0.3s linear infinite alternate;
+}
+
+.loader-66::after, .loader-66::before {
+ content: '';
+ width: 4.8px;
+ height: 4.8px;
+ border-radius: 4px;
+ background: currentColor;
+ position: absolute;
+ left: 0;
+ top: 15px;
+ animation: animloader66 0.3s 0.45s linear infinite alternate;
+}
+
+.loader-66::after {
+ top: -15px;
+ animation-delay: 0s;
+}
+
+.loader-67 {
+ width: 4.8px;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ color: #FFF;
+ background: currentColor;
+ animation: animloader66 0.3s 0.3s linear infinite alternate;
+}
+
+.loader-67::after, .loader-67::before {
+ content: '';
+ width: 4.8px;
+ height: 4.8px;
+ border-radius: 4px;
+ background: currentColor;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 15px;
+ animation: animloader66 0.3s 0.45s linear infinite alternate;
+}
+
+.loader-67::after {
+ top: -15px;
+ animation-delay: 0s;
+}
+
+.loader-68 {
+ width: 8px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ left: -100px;
+ animation: animloader68 1s linear infinite alternate;
+}
+
+.loader-69 {
+ width: 20px;
+ height: 12px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ color: #FFF;
+ background: currentColor;
+ animation: animloader69 0.6s 0.3s ease infinite alternate;
+}
+
+.loader-69::after, .loader-69::before {
+ content: '';
+ width: 20px;
+ height: 12px;
+ background: currentColor;
+ position: absolute;
+ border-radius: 4px;
+ top: 0;
+ right: 110%;
+ animation: animloader69 0.6s ease infinite alternate;
+}
+
+.loader-69::after {
+ left: 110%;
+ right: auto;
+ animation-delay: 0.6s;
+}
+
+.loader-70 {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ background: rgba(255, 255, 255, 0.15);
+ overflow: hidden;
+}
+
+.loader-70::after {
+ content: '';
+ width: 96px;
+ height: 4.8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+ animation: hitZak 1s linear infinite alternate;
+}
+
+.loader-71 {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ background: rgba(255, 255, 255, 0.15);
+ overflow: hidden;
+}
+
+.loader-71::after {
+ content: '';
+ width: 192px;
+ height: 4.8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+ animation: animloader71 2s linear infinite;
+}
+
+.loader-72 {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ background: rgba(255, 255, 255, 0.15);
+ overflow: hidden;
+}
+
+.loader-72::after {
+ content: '';
+ width: 0;
+ height: 4.8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+ animation: animFw 10s linear infinite;
+}
+
+[data-index="73"] {
+ justify-content: normal;
+}
+
+.loader-73 {
+ width: 0;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
+ animation: animFw 8s linear infinite;
+}
+
+.loader-73::after, .loader-73::before {
+ content: '';
+ width: 10px;
+ height: 1px;
+ background: #FFF;
+ position: absolute;
+ top: 9px;
+ right: -2px;
+ opacity: 0;
+ transform: rotate(-45deg) translateX(0px);
+ animation: coli1 0.3s linear infinite;
+}
+
+.loader-73::before {
+ top: -4px;
+ transform: rotate(45deg);
+ animation: coli2 0.3s linear infinite;
+}
+
+.loader-74 {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ overflow: hidden;
+}
+
+.loader-74::after {
+ content: '';
+ width: 96px;
+ height: 4.8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+ animation: hitZak 0.6s ease-in-out infinite alternate;
+}
+
+.loader-75 {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ background: rgba(255, 255, 255, 0.15);
+ position: relative;
+ overflow: hidden;
+}
+
+.loader-75::after {
+ content: '';
+ width: 0%;
+ height: 4.8px;
+ background-color: #FFF;
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ background-size: 15px 15px;
+ position: absolute;
+ top: 0;
+ left: 0;
+ animation: animFw 6s ease-in infinite;
+}
+
+.loader-76 {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ background: rgba(255, 255, 255, 0.15);
+ position: relative;
+ overflow: hidden;
+}
+
+.loader-76::after {
+ content: '';
+ width: 0%;
+ height: 4.8px;
+ background-color: #FFF;
+ font-size: 15px;
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ background-size: 1em 1em;
+ position: absolute;
+ top: 0;
+ left: 0;
+ animation: animFw 10s ease-in infinite, barStripe 1s linear infinite;
+}
+
+.loader-77 {
+ width: 100%;
+ height: 8px;
+ display: inline-block;
+ position: relative;
+ overflow: hidden;
+}
+
+.loader-77::before {
+ content: '';
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ position: absolute;
+ background-color: rgba(255, 255, 255, 0.15);
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ background-size: 15px 15px;
+ z-index: 10;
+}
+
+.loader-77::after {
+ content: '';
+ width: 0%;
+ height: 100%;
+ background-color: #FFF;
+ position: absolute;
+ border-radius: 0 4px 4px 0;
+ top: 0;
+ left: 0;
+ animation: animFw 10s ease-in infinite;
+}
+
+.loader-78 {
+ width: 100%;
+ height: 12px;
+ display: inline-block;
+ background-color: #FFF;
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ font-size: 30px;
+ background-size: 1em 1em;
+ animation: barStripe 1s linear infinite;
+}
+
+.loader-79 {
+ width: 96px;
+ height: 16px;
+ display: inline-block;
+ background-color: #FFF;
+ border: 1px solid #FFF;
+ border-radius: 4px;
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ font-size: 30px;
+ background-size: 1em 1em;
+ animation: barStripe 1s linear infinite;
+}
+
+.loader-80 {
+ width: 96px;
+ height: 24px;
+ display: inline-block;
+ background-color: #FFF;
+ border: 1px solid #FFF;
+ border-radius: 4px;
+ background: linear-gradient(45deg, transparent 49%, #FFF 50%, #FFF 50%, transparent 51%, transparent), linear-gradient(-45deg, transparent 49%, #FFF 50%, #FFF 50%, transparent 51%, transparent);
+ font-size: 15px;
+ background-size: 1em 1em;
+ animation: barStripe 0.6s linear infinite;
+}
+
+.loader-81 {
+ width: 130px;
+ height: 48px;
+ display: inline-block;
+ background: linear-gradient(45deg, #000 25%, transparent 25%, transparent 75%, #000 75%, #000 100%), linear-gradient(45deg, #000 25%, white 25%, white 75%, #000 75%, #000 100%);
+ font-size: 10px;
+ background-size: 32px 32px;
+ animation: raceBoard 0.6s linear infinite;
+ background-position: 0 0, 16px 16px;
+}
+
+.loader-82 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ background-color: #FFF;
+ background: radial-gradient(ellipse at center, #FF3D00 0%, #FF3D00 14%, #FFF 15%, #FFF 100%);
+ background-size: cover;
+ background-position: center;
+ border-radius: 50%;
+}
+
+.loader-82::after, .loader-82::before {
+ content: '';
+ position: absolute;
+ height: 16px;
+ width: 4px;
+ background: #FF3D00;
+ top: 50%;
+ left: 50%;
+ transform: translateX(-50%) rotate(0deg);
+ transform-origin: 25% 0;
+ animation: rotation 10s linear infinite;
+}
+
+.loader-82::before {
+ height: 22px;
+ width: 2px;
+ transform: translateX(-50%) rotate(0deg);
+ animation-duration: 1s;
+}
+
+.loader-83 {
+ width: 175px;
+ height: 80px;
+ position: relative;
+}
+
+.loader-83::before {
+ content: '';
+ left: 60px;
+ bottom: 18px;
+ position: absolute;
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ background-color: #FFF;
+ background-image: radial-gradient(circle 8px at 18px 18px, #263238 100%, transparent 0), radial-gradient(circle 4px at 18px 0px, #263238 100%, transparent 0), radial-gradient(circle 4px at 0px 18px, #263238 100%, transparent 0), radial-gradient(circle 4px at 36px 18px, #263238 100%, transparent 0), radial-gradient(circle 4px at 18px 36px, #263238 100%, transparent 0), radial-gradient(circle 4px at 30px 5px, #263238 100%, transparent 0), radial-gradient(circle 4px at 30px 5px, #263238 100%, transparent 0), radial-gradient(circle 4px at 30px 30px, #263238 100%, transparent 0), radial-gradient(circle 4px at 5px 30px, #263238 100%, transparent 0), radial-gradient(circle 4px at 5px 5px, #263238 100%, transparent 0);
+ background-repeat: no-repeat;
+ animation: rotationBack 3s linear infinite;
+}
+
+.loader-83::after {
+ content: '';
+ left: 94px;
+ bottom: 15px;
+ position: absolute;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ background-color: #FFF;
+ background-image: radial-gradient(circle 5px at 12px 12px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 12px 0px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 0px 12px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 24px 12px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 12px 24px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 20px 3px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 20px 3px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 20px 20px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 3px 20px, #263238 100%, transparent 0), radial-gradient(circle 2.5px at 3px 3px, #263238 100%, transparent 0);
+ background-repeat: no-repeat;
+ animation: rotationBack 4s linear infinite reverse;
+}
+
+.loader-84 {
+ width: 15px;
+ height: 20px;
+ background: #FFF;
+ display: inline-block;
+ position: relative;
+ animation: bump 0.4s ease-in infinite alternate;
+}
+
+.loader-84::after {
+ content: '';
+ left: 50%;
+ top: 100%;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-top-color: #FFF;
+}
+
+.loader-85 {
+ width: 15px;
+ height: 20px;
+ background: #FFF;
+ display: inline-block;
+ position: relative;
+ animation: bump 0.4s linear infinite alternate;
+}
+
+.loader-85::after {
+ content: '';
+ left: 50%;
+ bottom: 100%;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-bottom-color: #FFF;
+}
+
+.loader-86 {
+ width: 48px;
+ height: 12px;
+ background: #FFF;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-86::after {
+ content: '';
+ left: 50%;
+ bottom: 0;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-top-color: #FFF;
+ animation: bump 0.4s ease-in-out infinite alternate;
+}
+
+.loader-86::before {
+ content: '';
+ left: 50%;
+ bottom: 25px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ width: 15px;
+ height: 20px;
+ background: #FFF;
+ animation: bump 0.4s ease-in-out infinite alternate;
+}
+
+.loader-87 {
+ width: 48px;
+ height: 12px;
+ background: #FFF;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-87::after {
+ content: '';
+ left: 50%;
+ top: -47px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-bottom-color: #FFF;
+ animation: bump 0.4s ease-in-out infinite alternate;
+}
+
+.loader-87::before {
+ content: '';
+ left: 50%;
+ bottom: 15px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ width: 15px;
+ height: 20px;
+ background: #FFF;
+ animation: bump 0.4s ease-in-out infinite alternate;
+}
+
+.loader-88 {
+ width: 48px;
+ height: 24px;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ border: 1px solid;
+ animation: fillX 2s linear infinite;
+}
+
+.loader-88::after {
+ content: '';
+ position: absolute;
+ left: 100%;
+ top: 50%;
+ transform: translateY(-50%);
+ background: #FFF;
+ width: 5px;
+ height: 12px;
+}
+
+.loader-89 {
+ width: 48px;
+ height: 24px;
+ display: inline-block;
+ position: relative;
+ border: 1px solid #FFF;
+}
+
+.loader-89::after {
+ content: '';
+ position: absolute;
+ left: 100%;
+ top: 50%;
+ transform: translateY(-50%);
+ border: 1px solid #FFF;
+ width: 5px;
+ height: 12px;
+}
+
+.loader-89::before {
+ content: '';
+ position: absolute;
+ left: -8px;
+ top: 50%;
+ transform: translateY(-50%);
+ height: 80%;
+ width: 6px;
+ animation: animloader89 2s linear infinite;
+}
+
+.loader-90 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border: 4px solid #FFF;
+ animation: fill 2s linear infinite alternate;
+ color: rgba(255, 61, 0, 0.9);
+ border-radius: 0 0 4px 4px;
+}
+
+.loader-90::after {
+ content: '';
+ position: absolute;
+ left: 100%;
+ top: 50%;
+ transform: translateY(-50%);
+ border: 4px solid #FFF;
+ width: 20px;
+ height: 25px;
+ border-radius: 0 4px 4px 0;
+}
+
+.loader-91 {
+ width: 32px;
+ height: 72px;
+ display: inline-block;
+ position: relative;
+ border: 2px solid #FFF;
+ animation: animloader91 2s linear infinite alternate;
+ color: #FF3D00;
+ border-radius: 0 0 4px 4px;
+ transform: perspective(140px) rotateX(-45deg);
+}
+
+.loader-92 {
+ width: 48px;
+ height: 40px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ border-radius: 15% 15% 35% 35%;
+}
+
+.loader-92::after {
+ content: '';
+ position: absolute;
+ left: 45px;
+ top: 8px;
+ border: 4px solid #FFF;
+ width: 16px;
+ height: 20px;
+ border-radius: 0 4px 4px 0;
+}
+
+.loader-92::before {
+ content: '';
+ position: absolute;
+ width: 1px;
+ height: 10px;
+ color: #FFF;
+ top: -15px;
+ left: 11px;
+ animation: animloader92 1s ease infinite;
+}
+
+.loader-93 {
+ width: 96px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ border-radius: 48px 48px 0 0;
+ overflow: hidden;
+}
+
+.loader-93::after {
+ content: '';
+ position: absolute;
+ width: 24px;
+ height: 12px;
+ border-radius: 24px 24px 0 0;
+ background: #FF3D00;
+ left: 50%;
+ transform: translateX(-50%);
+ bottom: 0;
+}
+
+.loader-93::before {
+ content: '';
+ position: absolute;
+ width: 4px;
+ height: 32px;
+ left: 0;
+ right: 0;
+ margin: auto;
+ bottom: 0;
+ background: #FF3D00;
+ transform-origin: 50% 100%;
+ animation: animloader93 2s linear infinite alternate;
+}
+
+.loader-94 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ animation: animloader94 2s linear infinite;
+}
+
+.loader-94::after {
+ content: '';
+ width: 6px;
+ height: 24px;
+ background: #FFF;
+ transform: rotate(-45deg);
+ position: absolute;
+ bottom: -20px;
+ left: 46px;
+}
+
+.loader-95 {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+
+.loader-95::after {
+ content: '';
+ width: 48px;
+ height: 48px;
+ left: 0;
+ bottom: 0;
+ position: absolute;
+ border-radius: 50% 50% 0;
+ border: 15px solid #FFF;
+ transform: rotate(45deg) translate(0, 0);
+ animation: animMarker 0.4s ease-in-out infinite alternate;
+}
+
+.loader-95::before {
+ content: '';
+ position: absolute;
+ left: 0;
+ right: 0;
+ margin: auto;
+ top: 150%;
+ width: 24px;
+ height: 4px;
+ border-radius: 50%;
+ background: rgba(0, 0, 0, 0.2);
+ animation: animShadow 0.4s ease-in-out infinite alternate;
+}
+
+.loader-96 {
+ width: 48px;
+ height: 48px;
+ background: #FF3D00;
+ display: inline-block;
+ position: relative;
+ animation: rotationBack 1s ease-in-out infinite reverse;
+}
+
+.loader-96::before {
+ content: '';
+ left: 0;
+ top: 0;
+ transform: rotate(45deg);
+ position: absolute;
+ width: 48px;
+ height: 48px;
+ background: #FF3D00;
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
+}
+
+.loader-96::after {
+ content: '';
+ width: 32px;
+ height: 32px;
+ border-radius: 50%;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ background: #FFF;
+ transform: translate(-50%, -50%);
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
+}
+
+.loader-97 {
+ width: 60px;
+ height: 60px;
+ display: inline-block;
+ position: relative;
+ background: radial-gradient(ellipse at center, #FFF 69%, rgba(0, 0, 0, 0) 70%), linear-gradient(to right, rgba(0, 0, 0, 0) 47%, #FFF 48%, #FFF 52%, rgba(0, 0, 0, 0) 53%);
+ background-size: 20px 20px , 20px auto;
+ background-repeat: repeat-x;
+ background-position: center bottom, center -5px;
+}
+
+.loader-97::before, .loader-97::after {
+ content: '';
+ position: absolute;
+ left: -20px;
+ top: 0;
+ width: 20px;
+ height: 60px;
+ background: radial-gradient(ellipse at center, #FFF 69%, rgba(0, 0, 0, 0) 70%), linear-gradient(to right, rgba(0, 0, 0, 0) 47%, #FFF 48%, #FFF 52%, rgba(0, 0, 0, 0) 53%);
+ background-size: 20px 20px , 20px auto;
+ background-repeat: no-repeat;
+ background-position: center bottom, center -5px;
+ transform: rotate(0deg);
+ transform-origin: 50% 0%;
+ animation: animPend 1s linear infinite alternate;
+}
+
+.loader-97::after {
+ animation: animPend2 1s linear infinite alternate;
+ left: 100%;
+}
+
+.loader-98 {
+ width: 24px;
+ height: 80px;
+ border: 1px solid #FFF;
+ border-radius: 0 0 50px 50px;
+ position: relative;
+ box-shadow: 0px 0px #FF3D00 inset;
+ background-image: linear-gradient(#FF3D00 100px, transparent 0);
+ background-position: 0px 0px;
+ background-size: 22px 80px;
+ background-repeat: no-repeat;
+ animation: animloader98 6s linear infinite;
+}
+
+.loader-98::after {
+ content: '';
+ top: -6px;
+ left: 50%;
+ transform: translateX(-50%);
+ position: absolute;
+ border: 1px solid #FFF;
+ border-radius: 50%;
+ width: 28px;
+ height: 6px;
+}
+
+.loader-98::before {
+ content: '';
+ left: 0;
+ bottom: -4px;
+ border-radius: 50%;
+ position: absolute;
+ width: 6px;
+ height: 6px;
+ animation: animloader98s 6s linear infinite;
+}
+
+.loader-99 {
+ width: 20px;
+ height: 20px;
+ margin-top: 80px;
+ border-radius: 50%;
+ background: #FF3D00;
+ border: 5px solid #FFF;
+ position: relative;
+}
+
+.loader-99::before {
+ content: '';
+ position: absolute;
+ left: 50%;
+ bottom: 10px;
+ transform: translateX(-50%);
+ width: 8px;
+ height: 80px;
+ border: 2px solid #FFF;
+ border-bottom: none;
+ background: #FFF;
+ color: #FF3D00;
+ border-radius: 50px 50px 0 0;
+ box-shadow: 0px 0px inset;
+ animation: animloader99 6s linear infinite;
+}
+
+.loader-100 {
+ width: 180px;
+ height: 140px;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 15px at 15px 15px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 75px, 50px 50px, 30px 32px, 136px 20px;
+ background-repeat: no-repeat;
+ background-position: 0px 30px, 30px 0px, 113px 29px, 147px 50px, 23px 60px;
+ position: relative;
+}
+
+.loader-100::after {
+ content: '';
+ position: absolute;
+ left: 2px;
+ top: 65px;
+ width: 2px;
+ height: 6px;
+ color: #FFF;
+ animation: animloader100 0.6s linear infinite;
+}
+
+.loader-101 {
+ width: 175px;
+ height: 80px;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+}
+
+.loader-101::after {
+ content: '';
+ left: 50%;
+ bottom: 0;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-top-color: #FF3D00;
+ animation: fadePush 1s linear infinite;
+}
+
+.loader-101::before {
+ content: '';
+ left: 50%;
+ bottom: 30px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ width: 15px;
+ height: 15px;
+ background: #FF3D00;
+ animation: fadePush 1s linear infinite;
+}
+
+.loader-102 {
+ width: 175px;
+ height: 80px;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+}
+
+.loader-102::after {
+ content: '';
+ left: 50%;
+ bottom: 30px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-bottom-color: #FF3D00;
+ animation: fadePull 1s linear infinite;
+}
+
+.loader-102::before {
+ content: '';
+ left: 50%;
+ bottom: 15px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ width: 15px;
+ height: 15px;
+ background: #FF3D00;
+ animation: fadePull 1s linear infinite;
+}
+
+.loader-103 {
+ width: 175px;
+ height: 80px;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+}
+
+.loader-103::after {
+ content: '';
+ left: 0;
+ right: 0;
+ margin: auto;
+ bottom: 20px;
+ position: absolute;
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ border: 5px solid transparent;
+ border-color: #FF3D00 transparent;
+ animation: rotation 1s linear infinite;
+}
+
+.loader-104 {
+ width: 175px;
+ height: 80px;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+}
+
+.loader-104::before {
+ content: '';
+ left: 60px;
+ bottom: 18px;
+ position: absolute;
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ background-color: #FF3D00;
+ background-image: radial-gradient(circle 8px at 18px 18px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 18px 0px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 0px 18px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 36px 18px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 18px 36px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 30px 5px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 30px 5px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 30px 30px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 5px 30px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 5px 5px, #FFF 100%, transparent 0);
+ background-repeat: no-repeat;
+ animation: rotationBack 3s linear infinite;
+}
+
+.loader-104::after {
+ content: '';
+ left: 94px;
+ bottom: 15px;
+ position: absolute;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ background-color: #FF3D00;
+ background-image: radial-gradient(circle 5px at 12px 12px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 12px 0px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 0px 12px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 24px 12px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 12px 24px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 20px 3px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 20px 3px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 20px 20px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 3px 20px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 3px 3px, #FFF 100%, transparent 0);
+ background-repeat: no-repeat;
+ animation: rotationBack 4s linear infinite reverse;
+}
+
+.loader-105 {
+ width: 175px;
+ height: 80px;
+ background-image: linear-gradient(#263238 50px, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 64px 6px, 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 55px 60px, 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+}
+
+.loader-105::after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%) rotate(-180deg);
+ top: 62px;
+ height: 64px;
+ width: 60px;
+ background-color: #FFF;
+ background-image: linear-gradient(#DDD 20px, transparent 0), linear-gradient(#DDD 5px, transparent 0), linear-gradient(#DDD 10px, transparent 0), linear-gradient(#DDD 10px, transparent 0);
+ background-size: 50px 20px;
+ background-position: 5px 36px, 5px 25px, 5px 10px;
+ background-repeat: no-repeat;
+ border-radius: 2px 2px 4px 4px;
+ z-index: 10;
+ box-shadow: 0px -4px 7px rgba(0, 0, 0, 0.5);
+ animation: animloader105 4s linear infinite;
+}
+
+.loader-106 {
+ width: 32px;
+ height: 90px;
+ margin-bottom: 20px;
+ position: relative;
+ border-radius: 50% 50% 0 0;
+ border-bottom: 10px solid #FF3D00;
+ background-color: #FFF;
+ background-image: radial-gradient(ellipse at center, #FFF 34%, #FF3D00 35%, #FF3D00 54%, #FFF 55%), linear-gradient(#FF3D00 10px, transparent 0);
+ background-size: 28px 28px;
+ background-position: center 20px , center 2px;
+ background-repeat: no-repeat;
+ animation: animloader106back 1s linear infinite alternate;
+}
+
+.loader-106::before {
+ content: '';
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 64px;
+ height: 44px;
+ border-radius: 50%;
+ box-shadow: 0px 15px #FF3D00 inset;
+ top: 67px;
+}
+
+.loader-106::after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%) rotate(45deg);
+ width: 34px;
+ height: 34px;
+ top: 112%;
+ background: radial-gradient(ellipse at center, #ffdf00 8%, rgba(249, 62, 0, 0.6) 24%, rgba(0, 0, 0, 0) 100%);
+ border-radius: 50% 50% 0;
+ background-repeat: no-repeat;
+ background-position: -44px -44px;
+ background-size: 100px 100px;
+ box-shadow: 4px 4px 12px 0px rgba(255, 61, 0, 0.5);
+ animation: animloader106 1s linear infinite alternate;
+}
+
+.loader-107 {
+ width: 106px;
+ height: 56px;
+ background-image: linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), radial-gradient(circle 14px, #FFF 100%, transparent 0);
+ background-size: 48px 15px , 15px 35px, 15px 35px, 25px 15px, 28px 28px;
+ background-position: 25px 5px, 58px 20px, 25px 17px, 2px 37px, 76px 0px;
+ background-repeat: no-repeat;
+ position: relative;
+ transform: rotate(-45deg);
+}
+
+.loader-107::after, .loader-107::before {
+ content: '';
+ position: absolute;
+ width: 56px;
+ height: 56px;
+ border: 6px solid #FFF;
+ border-radius: 50%;
+ left: -45px;
+ top: -10px;
+ background-repeat: no-repeat;
+ background-image: linear-gradient(#FFF 64px, transparent 0), linear-gradient(#FFF 66px, transparent 0), radial-gradient(circle 4px, #FFF 100%, transparent 0);
+ background-size: 40px 1px , 1px 40px, 8px 8px;
+ background-position: center center;
+ animation: rotation 0.3s linear infinite;
+}
+
+.loader-107::before {
+ left: 25px;
+ top: 60px;
+}
+
+.loader-108 {
+ width: 48px;
+ height: 24px;
+ color: #FFF;
+ background: currentColor;
+ border-radius: 50% 50% 0 0;
+ position: relative;
+ margin-top: 36px;
+ animation: animloader108 4s linear infinite;
+}
+
+.loader-108::after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 28px;
+ height: 28px;
+ border-radius: 50%;
+ background: currentColor;
+ top: -34px;
+ animation: animloader108s 4s linear infinite;
+}
+
+.loader-109 {
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #FF3D00;
+ letter-spacing: 2px;
+ position: relative;
+}
+
+.loader-109::after {
+ content: 'Loading';
+ position: absolute;
+ left: 0;
+ top: 0;
+ color: #FFF;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ animation: animloader110 6s linear infinite;
+}
+
+.loader-110 {
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #FFF;
+ letter-spacing: 2px;
+ position: relative;
+}
+
+.loader-110::after {
+ content: 'Loading';
+ position: absolute;
+ left: 0;
+ top: 0;
+ color: #263238;
+ text-shadow: 0 0 2px #FFF, 0 0 1px #FFF, 0 0 1px #FFF;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ animation: animloader110 6s linear infinite;
+}
+
+.loader-111 {
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #263238;
+ text-shadow: 0 0 2px #FFF, 0 0 1px #FFF, 0 0 1px #FFF;
+ letter-spacing: 2px;
+ position: relative;
+}
+
+.loader-111::after {
+ content: 'Loading';
+ position: absolute;
+ left: 0;
+ top: 0;
+ color: #FFF;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ animation: animloader111 6s linear infinite;
+}
+
+.loader-112 {
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #FFF;
+ position: relative;
+}
+
+.loader-112::before {
+ content: '';
+ position: absolute;
+ left: 34px;
+ bottom: 8px;
+ width: 30px;
+ height: 30px;
+ border-radius: 50%;
+ border: 5px solid #FFF;
+ border-bottom-color: #FF3D00;
+ animation: rotation 0.6s linear infinite;
+}
+
+.loader-113 {
+ color: #FFF;
+ position: relative;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 4px;
+}
+
+.loader-113::before {
+ content: '';
+ position: absolute;
+ right: 70px;
+ bottom: 10px;
+ height: 28px;
+ width: 5.15px;
+ background: currentColor;
+ animation: animloader113L 1s linear infinite alternate;
+}
+
+.loader-113::after {
+ content: '';
+ width: 10px;
+ height: 10px;
+ position: absolute;
+ left: 125px;
+ top: 2px;
+ border-radius: 50%;
+ background: red;
+ animation: animloader113 1s linear infinite alternate;
+}
+
+.loader-114 {
+ color: #FFF;
+ position: relative;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 4px;
+}
+
+.loader-114::before {
+ content: '';
+ position: absolute;
+ right: 70px;
+ bottom: 10px;
+ height: 28px;
+ width: 5.15px;
+ background: currentColor;
+}
+
+.loader-114::after {
+ content: '';
+ width: 8px;
+ height: 8px;
+ position: absolute;
+ left: 125px;
+ top: 2px;
+ border-radius: 50%;
+ background: red;
+ animation: animloader114 1s ease-in infinite;
+}
+
+.loader-115 {
+ color: #FFF;
+ position: relative;
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+}
+
+.loader-115::after {
+ content: '';
+ width: 5px;
+ height: 5px;
+ background: currentColor;
+ position: absolute;
+ bottom: 10px;
+ right: -5px;
+ animation: animloader115 1s linear infinite;
+}
+
+.loader-116 {
+ color: #FFF;
+ position: relative;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 4px;
+}
+
+.loader-116::before {
+ content: '';
+ position: absolute;
+ right: 70px;
+ bottom: 10px;
+ height: 28px;
+ width: 5px;
+ background: currentColor;
+}
+
+.loader-116::after {
+ content: '';
+ width: 4px;
+ height: 4px;
+ background: currentColor;
+ position: absolute;
+ right: 70px;
+ top: 8px;
+ animation: animloader116 0.6s ease-out infinite alternate;
+}
+
+.loader-117 {
+ color: #FFF;
+ position: relative;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 4px;
+}
+
+.loader-117::before {
+ content: '';
+ position: absolute;
+ right: 68px;
+ bottom: 10px;
+ height: 28px;
+ width: 7px;
+ outline: 1px solid #FFF;
+ color: #FF3D00;
+ animation: animloader117 1s linear infinite alternate;
+}
+
+.loader-117::after {
+ content: '';
+ width: 4px;
+ height: 4px;
+ background: #FF3D00;
+ position: absolute;
+ right: 70px;
+ top: 8px;
+ animation: animloader116 1s ease-out infinite alternate;
+}
+
+.loader-118 {
+ position: relative;
+}
+
+.loader-118::before {
+ content: 'Loading';
+ color: #FFF;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 2px;
+ display: inline-block;
+ animation: floating 1s ease-out infinite alternate;
+}
+
+.loader-118::after {
+ content: '';
+ width: 100%;
+ height: 10px;
+ background: rgba(0, 0, 0, 0.15);
+ position: absolute;
+ left: 0;
+ top: 100%;
+ filter: blur(4px);
+ border-radius: 50%;
+ animation: animloader118 1s ease-out infinite alternate;
+}
+
+.loader-119 {
+ font-size: 48px;
+ letter-spacing: 2px;
+ font-family: Arial, Helvetica, sans-serif;
+ color: #FFF;
+ animation: animloader119 1s ease-in infinite alternate;
+}
+
+.loader-120 {
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #FF3D00;
+ letter-spacing: 2px;
+ position: relative;
+}
+
+.loader-120::after {
+ content: 'Loading';
+ position: absolute;
+ left: 0;
+ top: 0;
+ color: #FFF;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ animation: animloader111 10s ease-in infinite;
+}
+
+.loader-121 {
+ width: 95%;
+ height: 100px;
+ background-image: linear-gradient(100deg, transparent, rgba(38, 50, 56, 0.5) 50%, transparent 80%), radial-gradient(circle 50px at 50px 50px, #FFF 99%, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 100px, 100px 100px, 125px 20px, 260px 20px, 260px 20px;
+ background-position: -50% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ animation: animloader121 1s linear infinite;
+}
+
+.loader-122 {
+ width: 95%;
+ height: 100px;
+ background-image: linear-gradient(100deg, transparent, rgba(38, 50, 56, 0.5) 50%, transparent 80%), linear-gradient(#FFF 100px, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 100px, 100px 100px, 125px 20px, 260px 20px, 260px 20px;
+ background-position: -50% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ animation: animloader121 1s linear infinite;
+}
+
+.loader-123 {
+ width: 95%;
+ height: 100px;
+ position: relative;
+ background-image: linear-gradient(100deg, transparent, rgba(38, 50, 56, 0.5) 50%, transparent 80%), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 100px, 125px 20px, 260px 20px, 260px 20px;
+ background-position: 0% 0, 120px 0, 120px 40px, 120px 80px;
+ animation: animloader123 1s linear infinite;
+}
+
+.loader-123::after {
+ content: '';
+ width: 100px;
+ height: 100px;
+ border-radius: 8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+
+.loader-124 {
+ width: 320px;
+ height: 150px;
+ position: relative;
+ background: #FFF;
+}
+
+.loader-124::after {
+ content: '';
+ width: calc(100% - 30px);
+ height: calc(100% - 30px);
+ top: 15px;
+ left: 15px;
+ position: absolute;
+ background-image: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.5) 50%, transparent 80%), linear-gradient(#DDD 56px, transparent 0), linear-gradient(#DDD 24px, transparent 0), linear-gradient(#DDD 18px, transparent 0), linear-gradient(#DDD 66px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 130px, 55px 56px, 160px 30px, 260px 20px, 290px 56px;
+ background-position: 0% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ animation: animloader124 1s linear infinite;
+}
+
+.loader-125 {
+ width: 320px;
+ height: 150px;
+ position: relative;
+ background: #FFF;
+}
+
+.loader-125::after {
+ content: '';
+ width: calc(100% - 30px);
+ height: calc(100% - 30px);
+ top: 15px;
+ left: 15px;
+ position: absolute;
+ background-image: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.5) 50%, transparent 80%), radial-gradient(circle 28px at 28px 28px, #DDD 99%, transparent 0), linear-gradient(#DDD 24px, transparent 0), linear-gradient(#DDD 18px, transparent 0), linear-gradient(#DDD 66px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 130px, 55px 56px, 160px 30px, 260px 20px, 290px 56px;
+ background-position: 0% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ animation: animloader124 1s linear infinite;
+}
+
+.loader-126 {
+ width: 164px;
+ height: 170px;
+ position: relative;
+ background: #FFF;
+}
+
+.loader-126::after {
+ content: '';
+ width: calc(100% - 30px);
+ height: calc(100% - 30px);
+ top: 15px;
+ left: 15px;
+ position: absolute;
+ background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5) 50%, transparent 100%), linear-gradient(#DDD 74px, transparent 0), linear-gradient(#DDD 16px, transparent 0), linear-gradient(#DDD 24px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 50px 170px, 100% 74px, 100% 16px, 100% 32px;
+ background-position: 0 0, 0 0, 0px 85px, 0px 110px;
+ animation: animloader126 1s linear infinite;
+}
diff --git a/data.js b/data.js
new file mode 100644
index 00000000..66ec4fa5
--- /dev/null
+++ b/data.js
@@ -0,0 +1,5127 @@
+const LOADERS = [
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 5px solid #FFF;
+ border-bottom-color: #FF3D00;
+ border-radius: 50%;
+ display: inline-block;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ border: 3px solid transparent;
+ border-bottom-color: #FF3D00;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 56px;
+ height: 56px;
+ border-radius: 50%;
+ border: 3px solid transparent;
+ border-bottom-color: #FF3D00;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ border: 3px solid;
+ border-color: #FF3D00 transparent;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 56px;
+ height: 56px;
+ border-radius: 50%;
+ border: 3px solid;
+ border-color: #FF3D00 transparent;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 6px;
+ height: 6px;
+ transform: translate(150%, 150%);
+ border-radius: 50%;
+}
+.loader::before {
+ left: auto;
+ top: auto;
+ right: 0;
+ bottom: 0;
+ transform: translate(-150%, -150%);
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 6px;
+ height: 6px;
+ border-radius: 50%;
+}
+.loader::before {
+ left: auto;
+ top: auto;
+ right: 0;
+ bottom: 0;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css: `
+.loader {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 16px;
+ height: 16px;
+ transform: translate(-50%, 50%);
+ border-radius: 50%;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css: `
+.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 2px solid #FF3D00;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 4px;
+ top: 4px;
+ border: 2px solid #FFF;
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 3px solid;
+ border-color: #FFF #FFF transparent;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ border: 3px solid;
+ border-color: transparent #FF3D00 #FF3D00;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ animation: rotationBack 0.5s linear infinite;
+ transform-origin: center center;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+
+@keyframes rotationBack {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-360deg);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 3px solid;
+ border-color: #FFF #FFF transparent transparent;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ border: 3px solid;
+ border-color: transparent transparent #FF3D00 #FF3D00;
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ box-sizing: border-box;
+ animation: rotationBack 0.5s linear infinite;
+ transform-origin: center center;
+}
+.loader::before {
+ width: 32px;
+ height: 32px;
+ border-color: #FFF #FFF transparent transparent;
+ animation: rotation 1.5s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+@keyframes rotationBack {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-360deg);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 3px dotted #FFF;
+ border-style: solid solid dotted dotted;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 2s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ border: 3px dotted #FF3D00;
+ border-style: solid solid dotted;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ animation: rotationBack 1s linear infinite;
+ transform-origin: center center;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+@keyframes rotationBack {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 0;
+ background: #FF3D00;
+ width: 3px;
+ height: 24px;
+ transform: translateX(-50%);
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: animloader 2s linear infinite;
+}
+.loader::after {
+ animation-delay: 1s;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: scale(0);
+ opacity: 1;
+ }
+ 100% {
+ transform: scale(1);
+ opacity: 0;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 5px dotted #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 2s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ background: linear-gradient(0deg, rgba(255, 61, 0, 0.2) 33%, #ff3d00 100%);
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 44px;
+ height: 44px;
+ border-radius: 50%;
+ background: #263238;
+}
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ border-top: 3px solid #FFF;
+ border-right: 3px solid transparent;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ border-top: 4px solid #FFF;
+ border-right: 4px solid transparent;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ border-bottom: 4px solid #FF3D00;
+ border-left: 4px solid transparent;
+}
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ border-top: 4px solid #FFF;
+ border-right: 4px solid transparent;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ border-left: 4px solid #FF3D00;
+ border-bottom: 4px solid transparent;
+ animation: rotation 0.5s linear infinite reverse;
+}
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 5px solid;
+ border-color: #FF3D00 transparent;
+ border-radius: 50%;
+ display: inline-block;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 10px solid;
+ border-color: rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.5);
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ border: 10px solid;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite alternate;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+@keyframes animloader {
+ 0% {
+ border-color: white rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
+ }
+ 33% {
+ border-color: white white rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
+ }
+ 66% {
+ border-color: white white white rgba(255, 255, 255, 0);
+ }
+ 100% {
+ border-color: white white white white;
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 3px solid #FFF;
+ border-bottom-color: transparent;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ position: absolute;
+ box-sizing: border-box;
+ left: 20px;
+ top: 31px;
+ border: 10px solid transparent;
+ border-right-color: #FFF;
+ transform: rotate(-40deg);
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-width: 3px;
+ border-style: dashed solid solid dotted;
+ border-color: #FF3D00 #FF3D00 transparent #FF3D00;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 20px;
+ top: 31px;
+ border: 10px solid transparent;
+ border-right-color: #FF3D00;
+ transform: rotate(-40deg);
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ background: #FFF;
+ display: inline-block;
+ border-radius: 50%;
+ box-sizing: border-box;
+ animation: animloader 1s ease-in infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: scale(0);
+ opacity: 1;
+ }
+ 100% {
+ transform: scale(1);
+ opacity: 0;
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ background: #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: animloader 2s linear infinite;
+}
+.loader::after {
+ animation-delay: 1s;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: scale(0);
+ opacity: 1;
+ }
+ 100% {
+ transform: scale(1);
+ opacity: 0;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ }
+ .loader::after,
+ .loader::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ background: #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ box-sizing: border-box;
+ animation: animloader 2s ease-in-out infinite;
+ }
+ .loader::after {
+ animation-delay: 1s;
+ }
+
+@keyframes animloader {
+ 0%, 100% {
+ transform: scale(0);
+ opacity: 1;
+}
+ 50% {
+ transform: scale(1);
+ opacity: 0;
+}
+ }
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: -72px 0 #FFF inset;
+ }
+ 100% {
+ box-shadow: 48px 0 #FFF inset;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ border: 24px solid #FFF;
+ border-bottom-color: #FF3D00;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ border: 2px solid #FFF;
+ width: 48px;
+ height: 48px;
+ background: #FF3D00;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 2s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ border: 24px solid;
+ border-color: transparent #FFF;
+ border-radius: 50%;
+ transform: translate(-50%, -50%);
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ background: #FFF;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 6px;
+ top: 10px;
+ width: 12px;
+ height: 12px;
+ color: #FF3D00;
+ background: currentColor;
+ border-radius: 50%;
+ box-shadow: 25px 2px, 10px 22px;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border: 4px solid;
+ background: rgba(255, 255, 255, 0.2);
+ border-color: transparent #FFF #FFF transparent;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s ease-in-out infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ border: 12px solid;
+ border-color: transparent #FF3D00 #FF3D00 transparent;
+ transform: translate(-50%, -50%);
+ border-radius: 50%;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ border: 2px solid;
+ border-color: transparent #FFF;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 2s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ border: 24px solid;
+ border-color: transparent rgba(255, 255, 255, 0.15);
+ border-radius: 50%;
+ transform: translate(-50%, -50%);
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ border: 24px solid;
+ border-color: rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.5);
+ border-radius: 50%;
+ display: inline-block;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+ }
+
+@keyframes animloader {
+ 0% {
+ border-color: rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.75);
+}
+ 33% {
+ border-color: rgba(255, 255, 255, 0.75) rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35);
+}
+ 66% {
+ border-color: rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.75) rgba(255, 255, 255, 0.15) rgba(255, 255, 255, 0.25);
+}
+ 100% {
+ border-color: rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.75) rgba(255, 255, 255, 0.15);
+}
+ }`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+ }
+ .loader::after,
+ .loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 16px;
+ height: 16px;
+ transform: translate(-50%, 50%);
+ border-radius: 50%;
+ }
+ .loader::before {
+ left: auto;
+ right: 0;
+ background: #FFF;
+ transform: translate(50%, 100%);
+ }
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ box-sizing: border-box;
+ animation: zeroRotation 1s linear infinite alternate;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FF3D00;
+ width: 16px;
+ height: 16px;
+ transform: translate(-50%, 50%);
+ border-radius: 50%;
+}
+.loader::before {
+ left: auto;
+ right: 0;
+ transform: translate(50%, 100%);
+}
+
+@keyframes zeroRotation {
+ 0% {
+ transform: scale(1) rotate(0deg);
+ }
+ 100% {
+ transform: scale(0) rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ width: 24px;
+ height: 24px;
+ top: 0;
+ background-color: #FFF;
+ border-radius: 50%;
+ animation: scale50 1s infinite ease-in-out;
+}
+.loader::before {
+ top: auto;
+ bottom: 0;
+ background-color: #FF3D00;
+ animation-delay: 0.5s;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+@keyframes scale50 {
+ 0%, 100% {
+ transform: scale(0);
+ }
+ 50% {
+ transform: scale(1);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ width: 24px;
+ height: 24px;
+ top: 50%;
+ left: 50%;
+ transform: scale(0.5) translate(0, 0);
+ background-color: #FFF;
+ border-radius: 50%;
+ animation: animloader 1s infinite ease-in-out;
+}
+.loader::before {
+ background-color: #FF3D00;
+ transform: scale(0.5) translate(-48px, -48px);
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+@keyframes animloader {
+ 50% {
+ transform: scale(1) translate(-50%, -50%);
+}
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ background: #FFF;
+ box-sizing: border-box;
+ animation: shadowExpandX 2s linear infinite alternate;
+}
+
+@keyframes shadowExpandX {
+ 0% {
+ box-shadow: 0 0, 0 0;
+ color: rgba(255, 255, 255, 0.2);
+ }
+ 100% {
+ box-shadow: -24px 0, 24px 0;
+ color: rgba(255, 255, 255, 0.8);
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ background: #FFF;
+ box-shadow: -24px 0 #FFF, 24px 0 #FFF;
+ box-sizing: border-box;
+ animation: shadowPulse 2s linear infinite;
+}
+
+@keyframes shadowPulse {
+ 33% {
+ background: #FFF;
+ box-shadow: -24px 0 #FF3D00, 24px 0 #FFF;
+ }
+ 66% {
+ background: #FF3D00;
+ box-shadow: -24px 0 #FFF, 24px 0 #FFF;
+ }
+ 100% {
+ background: #FFF;
+ box-shadow: -24px 0 #FFF, 24px 0 #FF3D00;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ background: #FF3D00;
+ color: #FFF;
+ box-shadow: -24px 0, 24px 0;
+ box-sizing: border-box;
+ animation: rotation 2s ease-in-out infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: -38px -6px, -14px 6px, 14px -6px;
+ }
+ 33% {
+ box-shadow: -38px 6px, -14px -6px, 14px 6px;
+ }
+ 66% {
+ box-shadow: -38px -6px, -14px 6px, 14px -6px;
+ }
+ 100% {
+ box-shadow: -38px 6px, -14px -6px, 14px 6px;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ color: #FFF;
+ left: -100px;
+ box-sizing: border-box;
+ animation: shadowRolling 2s linear infinite;
+}
+
+@keyframes shadowRolling {
+ 0% {
+ box-shadow: 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
+ }
+ 12% {
+ box-shadow: 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
+ }
+ 25% {
+ box-shadow: 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
+ }
+ 36% {
+ box-shadow: 120px 0 white, 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 130px 0 white, 120px 0 white, 110px 0 white, 100px 0 white;
+ }
+ 62% {
+ box-shadow: 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white, 110px 0 white;
+ }
+ 75% {
+ box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white;
+ }
+ 87% {
+ box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white;
+ }
+ 100% {
+ box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0);
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 2s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 -2px;
+ }
+ 25% {
+ box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 2px;
+ }
+ 50% {
+ box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 2px, -38px 0 0 -2px;
+ }
+ 75% {
+ box-shadow: 14px 0 0 2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 -2px;
+ }
+ 100% {
+ box-shadow: 14px 0 0 -2px, 38px 0 0 2px, -14px 0 0 -2px, -38px 0 0 -2px;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ display: block;
+ margin:15px auto;
+ position: relative;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: -38px -12px , -14px 0, 14px 0, 38px 0;
+ }
+ 33% {
+ box-shadow: -38px 0px, -14px -12px, 14px 0, 38px 0;
+ }
+ 66% {
+ box-shadow: -38px 0px , -14px 0, 14px -12px, 38px 0;
+ }
+ 100% {
+ box-shadow: -38px 0 , -14px 0, 14px 0 , 38px -12px;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ display: inline-block;
+ position: relative;
+}
+ .loader::after {
+ content: '';
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ position: absolute;
+ left: 0;
+ transform: translate(-50%, 100%);
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+ top: 0;
+ }
+
+@keyframes animloader {
+ 0% {
+ background: white;
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+}
+ 14% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px white, 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+}
+ 28% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px white, 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+}
+ 42% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px white, 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+}
+ 57% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px white, 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+}
+ 71% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px white, 9px 16px 0 -6px rgba(255, 255, 255, 0);
+}
+ 85% {
+ background: rgba(255, 255, 255, 0);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px white;
+}
+ 100% {
+ background: rgba(255, 255, 255, 0.5);
+ box-shadow: 9px -19px 0 -1px rgba(255, 255, 255, 0), 28px -19px 0 -2px rgba(255, 255, 255, 0), 39px -5px 0 -3px rgba(255, 255, 255, 0), 34px 10px 0 -4px rgba(255, 255, 255, 0), 22px 17px 0 -5px rgba(255, 255, 255, 0), 9px 16px 0 -6px rgba(255, 255, 255, 0);
+}
+ }
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ box-sizing: border-box;
+ animation: rotation 2s ease-in-out infinite;
+}
+.loader::after {
+ border-color: #FF3D00;
+ animation-delay: 1s;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 48px;
+ height: 48px;
+ border: 4px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: animloader 2s ease-in-out infinite;
+}
+.loader::after {
+ border-color: #FF3D00;
+ animation-delay: 1s;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: scale(0);
+ opacity: 1;
+ }
+ 100% {
+ transform: scale(1);
+ opacity: 0;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: rotation 2s ease-in-out infinite alternate;
+}
+.loader::after {
+ border-color: #FF3D00;
+ animation-direction: alternate-reverse;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: scaleOut 2s ease-in-out infinite;
+}
+.loader::after {
+ border-color: #FF3D00;
+ animation-delay: 1s;
+}
+
+@keyframes scaleOut {
+ 0% {
+ transform: scale(0);
+ }
+ 100% {
+ transform: scale(1);
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 48px;
+ height: 48px;
+ border: 2px solid #FFF;
+ position: absolute;
+ left: 0;
+ top: 0;
+ animation: rotationBreak 3s ease-in-out infinite alternate;
+}
+.loader::after {
+ border-color: #FF3D00;
+ animation-direction: alternate-reverse;
+}
+
+@keyframes rotationBreak {
+ 0% {
+ transform: rotate(0);
+ }
+ 25% {
+ transform: rotate(90deg);
+ }
+ 50% {
+ transform: rotate(180deg);
+ }
+ 75% {
+ transform: rotate(270deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border: 2px solid #FFF;
+ box-sizing: border-box;
+ animation: rotation 2s linear infinite;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ margin: auto;
+ border: 2px solid #FF3D00;
+ width: 38px;
+ height: 38px;
+ animation: rotationBack 1.5s linear infinite;
+ transform-origin: center center;
+}
+.loader::before {
+ width: 28px;
+ height: 28px;
+ border-color: #FFF;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+@keyframes rotationBack {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-360deg);
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ box-sizing: border-box;
+ animation: flipX 1s linear infinite;
+}
+
+@keyframes flipX {
+ 0% {
+ transform: perspective(200px) rotateX(0deg) rotateY(0deg);
+ }
+ 50% {
+ transform: perspective(200px) rotateX(-180deg) rotateY(0deg);
+ }
+ 100% {
+ transform: perspective(200px) rotateX(-180deg) rotateY(-180deg);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ border: 1px solid;
+ box-sizing: border-box;
+ animation: fill 2s linear infinite alternate;
+}
+
+@keyframes fill {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 0 -48px inset;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ box-sizing: border-box;
+ animation: zeroRotation 1s ease infinite alternate-reverse;
+}
+
+@keyframes zeroRotation {
+ 0% {
+ transform: scale(1) rotate(0deg);
+ }
+ 100% {
+ transform: scale(0) rotate(360deg);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 24px;
+ height: 24px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ box-sizing: border-box;
+ animation: animloader 2s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: translate(0, 0) rotateX(0) rotateY(0);
+ }
+ 25% {
+ transform: translate(100%, 0) rotateX(0) rotateY(180deg);
+ }
+ 50% {
+ transform: translate(100%, 100%) rotateX(-180deg) rotateY(180deg);
+ }
+ 75% {
+ transform: translate(0, 100%) rotateX(-180deg) rotateY(360deg);
+ }
+ 100% {
+ transform: translate(0, 0) rotateX(0) rotateY(360deg);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ width: 24px;
+ height: 24px;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: #FFF;
+ color: #FFF;
+ animation: animloader 2s linear infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 0 0, 0 0, 0 0;
+ }
+ 33% {
+ box-shadow: 24px 0px, 24px 0px, 24px 0px;
+ }
+ 66% {
+ box-shadow: 24px 24px, 24px 24px, 24px 0px;
+ }
+ 100% {
+ box-shadow: 0px 24px, 24px 24px, 24px 0px;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+}
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 24px;
+ height: 24px;
+ position: absolute;
+ left: 0;
+ top: -24px;
+ animation: animloader1 2s linear infinite alternate;
+}
+.loader::after {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 24px;
+ height: 24px;
+ background: rgba(255, 255, 255, 0.85);
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
+ box-sizing: border-box;
+ animation: animloader2 2s linear infinite alternate;
+}
+
+@keyframes animloader1 {
+ 0%, 32% {
+ box-shadow: 0 24px white, 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 33%, 65% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 66%, 99% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px white, 0px 48px rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px white, 0px 48px white;
+ }
+}
+
+@keyframes animloader2 {
+ 0% {
+ transform: translate(0, 0) rotateX(0) rotateY(0);
+ }
+ 33% {
+ transform: translate(100%, 0) rotateX(0) rotateY(180deg);
+ }
+ 66% {
+ transform: translate(100%, 100%) rotateX(-180deg) rotateY(180deg);
+ }
+ 100% {
+ transform: translate(0, 100%) rotateX(-180deg) rotateY(360deg);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ transform: rotate(45deg);
+}
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 24px;
+ height: 24px;
+ position: absolute;
+ left: 0;
+ top: -24px;
+ animation: animloader 4s ease infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 24px;
+ height: 24px;
+ background: rgba(255, 255, 255, 0.85);
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
+ animation: animloader2 2s ease infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 12% {
+ box-shadow: 0 24px white, 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 25% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+ 37% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px white, 0px 48px rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 0 24px white, 24px 24px white, 24px 48px white, 0px 48px white;
+ }
+ 62% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px white, 24px 48px white, 0px 48px white;
+ }
+ 75% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px rgba(255, 255, 255, 0), 24px 48px white, 0px 48px white;
+ }
+ 87% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px white;
+ }
+ 100% {
+ box-shadow: 0 24px rgba(255, 255, 255, 0), 24px 24px rgba(255, 255, 255, 0), 24px 48px rgba(255, 255, 255, 0), 0px 48px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader2 {
+ 0% {
+ transform: translate(0, 0) rotateX(0) rotateY(0);
+ }
+ 25% {
+ transform: translate(100%, 0) rotateX(0) rotateY(180deg);
+ }
+ 50% {
+ transform: translate(100%, 100%) rotateX(-180deg) rotateY(180deg);
+ }
+ 75% {
+ transform: translate(0, 100%) rotateX(-180deg) rotateY(360deg);
+ }
+ 100% {
+ transform: translate(0, 0) rotateX(0) rotateY(360deg);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 16px;
+ height: 16px;
+ box-shadow: 0 30px, 0 -30px;
+ border-radius: 4px;
+ background: currentColor;
+ display: block;
+ margin:auto;
+ position: relative;
+ color: #FFF;
+ transform: translateY(30px);
+ box-sizing: border-box;
+ animation: animloader 2s ease infinite;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 16px;
+ height: 16px;
+ box-shadow: 0 30px, 0 -30px;
+ border-radius: 4px;
+ background: currentColor;
+ color: #FFF;
+ position: absolute;
+ left: 30px;
+ top: 0;
+ animation: animloader 2s 0.2s ease infinite;
+}
+.loader::before {
+ animation-delay: 0.4s;
+ left: 60px;
+}
+
+@keyframes animloader {
+ 0% {
+ top: 0;
+ color: white;
+ }
+ 50% {
+ top: 30px;
+ color: rgba(255, 255, 255, 0.2);
+ }
+ 100% {
+ top: 0;
+ color: white;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 8px;
+ height: 40px;
+ border-radius: 4px;
+ display: inline-block;
+ margin-left: 20px;
+ margin-top: 10px;
+ position: relative;
+ background: currentColor;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 0.3s 0.3s linear infinite alternate;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 8px;
+ height: 40px;
+ border-radius: 4px;
+ background: currentColor;
+ position: absolute;
+ bottom: 0;
+ left: 20px;
+ animation: animloader1 0.3s 0.45s linear infinite alternate;
+}
+.loader::before {
+ left: -20px;
+ animation-delay: 0s;
+}
+
+@keyframes animloader {
+ 0% {
+ height: 40px;
+ transform: translateY(0);
+ }
+ 100% {
+ height: 10px;
+ transform: translateY(30px);
+ }
+}
+
+@keyframes animloader1 {
+ 0% {
+ height: 48px;
+ }
+ 100% {
+ height: 4.8px;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 8px;
+ height: 40px;
+ border-radius: 4px;
+ display: block;
+ margin: 20px auto;
+ position: relative;
+ background: currentColor;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 0.3s 0.3s linear infinite alternate;
+}
+
+.loader::after, .loader::before {
+ content: '';
+ width: 8px;
+ height: 40px;
+ border-radius: 4px;
+ background: currentColor;
+ position: absolute;
+ top: 50%;
+ transform: translateY(-50%);
+ left: 20px;
+ box-sizing: border-box;
+ animation: animloader 0.3s 0.45s linear infinite alternate;
+}
+.loader::before {
+ left: -20px;
+ animation-delay: 0s;
+}
+
+@keyframes animloader {
+ 0% { height: 48px}
+ 100% { height: 4px}
+}
+`
+
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 8px;
+ height: 48px;
+ display: block;
+ margin: auto;
+ left: -20px;
+ position: relative;
+ border-radius: 4px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 20px 0 rgba(255, 255, 255, 0.25), 40px 0 white, 60px 0 white;
+ }
+ 50% {
+ box-shadow: 20px 0 white, 40px 0 rgba(255, 255, 255, 0.25), 60px 0 white;
+ }
+ 100% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 rgba(255, 255, 255, 0.25);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 8px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 0.6s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 20px -10px, 40px 10px, 60px 0px;
+ }
+ 25% {
+ box-shadow: 20px 0px, 40px 0px, 60px 10px;
+ }
+ 50% {
+ box-shadow: 20px 10px, 40px -10px, 60px 0px;
+ }
+ 75% {
+ box-shadow: 20px 0px, 40px 0px, 60px -10px;
+ }
+ 100% {
+ box-shadow: 20px -10px, 40px 10px, 60px 0px;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 6px;
+ display: block;
+ margin: auto;
+ position: relative;
+ border-radius: 4px;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 0.6s linear infinite;
+}
+
+@keyframes animloader {
+ 0% { box-shadow: -10px 20px, 10px 35px , 0px 50px }
+ 25% { box-shadow: 0px 20px , 0px 35px, 10px 50px }
+ 50% { box-shadow: 10px 20px, -10px 35px, 0px 50px }
+ 75% { box-shadow: 0px 20px, 0px 35px, -10px 50px }
+ 100% { box-shadow: -10px 20px, 10px 35px, 0px 50px}
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 4.8px;
+ height: 4.8px;
+ display: inline-block;
+ margin-top: 20px;
+ position: relative;
+ border-radius: 4px;
+ color: #FFF;
+ background: currentColor;
+ box-sizing: border-box;
+ animation: animloader 0.3s 0.3s linear infinite alternate;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 4.8px;
+ height: 4.8px;
+ border-radius: 4px;
+ background: currentColor;
+ position: absolute;
+ left: 0;
+ top: 15px;
+ animation: animloader 0.3s 0.45s linear infinite alternate;
+}
+.loader::after {
+ top: -15px;
+ animation-delay: 0s;
+}
+
+@keyframes animloader {
+ 0% {
+ width: 4.8px;
+ }
+ 100% {
+ width: 48px;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 4.8px;
+ height: 4.8px;
+ display: block;
+ margin: 20px auto;
+ position: relative;
+ border-radius: 4px;
+ color: #FFF;
+ background: currentColor;
+ box-sizing: border-box;
+ animation: animloader 0.3s 0.3s linear infinite alternate;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 4.8px;
+ height: 4.8px;
+ border-radius: 4px;
+ background: currentColor;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 15px;
+ animation: animloader 0.3s 0.45s linear infinite alternate;
+}
+.loader::after {
+ top: -15px;
+ animation-delay: 0s;
+}
+
+@keyframes animloader {
+ 0% { width: 4.8px }
+ 100% { width: 48px}
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 8px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border-radius: 4px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 20px 0 rgba(255, 255, 255, 0), 40px 0 rgba(255, 255, 255, 0), 60px 0 rgba(255, 255, 255, 0), 80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
+ }
+ 20% {
+ box-shadow: 20px 0 white, 40px 0 rgba(255, 255, 255, 0), 60px 0 rgba(255, 255, 255, 0), 80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
+ }
+ 40% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 rgba(255, 255, 255, 0), 80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
+ }
+ 60% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 white, 80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
+ }
+ 80% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 white, 80px 0 white, 100px 0 rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 20px 0 white, 40px 0 white, 60px 0 white, 80px 0 white, 100px 0 white;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 20px;
+ height: 12px;
+ display: block;
+ margin: auto;
+ position: relative;
+ border-radius: 4px;
+ color: #FFF;
+ background: currentColor;
+ box-sizing: border-box;
+ animation: animloader 0.6s 0.3s ease infinite alternate;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ width: 20px;
+ height: 12px;
+ background: currentColor;
+ position: absolute;
+ border-radius: 4px;
+ top: 0;
+ right: 110%;
+ animation: animloader 0.6s ease infinite alternate;
+}
+.loader::after {
+ left: 110%;
+ right: auto;
+ animation-delay: 0.6s;
+}
+
+@keyframes animloader {
+ 0% {
+ width: 20px;
+ }
+ 100% {
+ width: 48px;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ background: rgba(255, 255, 255, 0.15);
+ overflow: hidden;
+}
+.loader::after {
+ content: '';
+ width: 96px;
+ height: 4.8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+ box-sizing: border-box;
+ animation: hitZak 1s linear infinite alternate;
+}
+
+@keyframes hitZak {
+ 0% {
+ left: 0;
+ transform: translateX(-1%);
+ }
+ 100% {
+ left: 100%;
+ transform: translateX(-99%);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ background: rgba(255, 255, 255, 0.15);
+ overflow: hidden;
+}
+.loader::after {
+ content: '';
+ width: 192px;
+ height: 4.8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+ box-sizing: border-box;
+ animation: animloader 2s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ left: 0;
+ transform: translateX(-100%);
+ }
+ 100% {
+ left: 100%;
+ transform: translateX(0%);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ background: rgba(255, 255, 255, 0.15);
+ overflow: hidden;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ width: 0;
+ height: 4.8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+ animation: animFw 10s linear infinite;
+}
+
+@keyframes animFw {
+ 0% {
+ width: 0;
+ }
+ 100% {
+ width: 100%;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 0;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
+ box-sizing: border-box;
+ animation: animFw 8s linear infinite;
+}
+ .loader::after,
+ .loader::before {
+ content: '';
+ width: 10px;
+ height: 1px;
+ background: #FFF;
+ position: absolute;
+ top: 9px;
+ right: -2px;
+ opacity: 0;
+ transform: rotate(-45deg) translateX(0px);
+ box-sizing: border-box;
+ animation: coli1 0.3s linear infinite;
+ }
+ .loader::before {
+ top: -4px;
+ transform: rotate(45deg);
+ animation: coli2 0.3s linear infinite;
+ }
+
+@keyframes animFw {
+ 0% {
+ width: 0;
+}
+ 100% {
+ width: 100%;
+}
+ }
+
+@keyframes coli1 {
+ 0% {
+ transform: rotate(-45deg) translateX(0px);
+ opacity: 0.7;
+}
+ 100% {
+ transform: rotate(-45deg) translateX(-45px);
+ opacity: 0;
+}
+ }
+
+@keyframes coli2 {
+ 0% {
+ transform: rotate(45deg) translateX(0px);
+ opacity: 1;
+}
+ 100% {
+ transform: rotate(45deg) translateX(-45px);
+ opacity: 0.7;
+}
+ }
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ position: relative;
+ overflow: hidden;
+}
+.loader::after {
+ content: '';
+ width: 96px;
+ height: 4.8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+ box-sizing: border-box;
+ animation: hitZak 0.6s ease-in-out infinite alternate;
+}
+
+@keyframes hitZak {
+ 0% {
+ left: 0;
+ transform: translateX(-1%);
+ }
+ 100% {
+ left: 100%;
+ transform: translateX(-99%);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ background: rgba(255, 255, 255, 0.15);
+ position: relative;
+ overflow: hidden;
+}
+.loader::after {
+ content: '';
+ width: 0%;
+ height: 4.8px;
+ background-color: #FFF;
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ background-size: 15px 15px;
+ position: absolute;
+ top: 0;
+ left: 0;
+ box-sizing: border-box;
+ animation: animFw 6s ease-in infinite;
+}
+
+@keyframes animFw {
+ 0% {
+ width: 0;
+ }
+ 100% {
+ width: 100%;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 100%;
+ height: 4.8px;
+ display: inline-block;
+ background: rgba(255, 255, 255, 0.15);
+ position: relative;
+ overflow: hidden;
+}
+.loader::after {
+ content: '';
+ width: 0%;
+ height: 4.8px;
+ background-color: #FFF;
+ font-size: 15px;
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ background-size: 1em 1em;
+ position: absolute;
+ top: 0;
+ left: 0;
+ box-sizing: border-box;
+ animation: animFw 10s ease-in infinite, barStripe 1s linear infinite;
+}
+
+@keyframes barStripe {
+ 0% {
+ background-position: 1em 0;
+ }
+ 100% {
+ background-position: 0 0;
+ }
+}
+
+@keyframes animFw {
+ 0% {
+ width: 0;
+ }
+ 100% {
+ width: 100%;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 100%;
+ height: 8px;
+ display: inline-block;
+ position: relative;
+ overflow: hidden;
+}
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ position: absolute;
+ background-color: rgba(255, 255, 255, 0.15);
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ background-size: 15px 15px;
+ z-index: 10;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ width: 0%;
+ height: 100%;
+ background-color: #FFF;
+ position: absolute;
+ border-radius: 0 4px 4px 0;
+ top: 0;
+ left: 0;
+ animation: animFw 10s ease-in infinite;
+}
+
+
+@keyframes animFw {
+ 0% {
+ width: 0;
+ }
+ 100% {
+ width: 100%;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 100%;
+ height: 12px;
+ display: inline-block;
+ background-color: #FFF;
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ font-size: 30px;
+ background-size: 1em 1em;
+ box-sizing: border-box;
+ animation: barStripe 1s linear infinite;
+}
+
+@keyframes barStripe {
+ 0% {
+ background-position: 1em 0;
+ }
+ 100% {
+ background-position: 0 0;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 96px;
+ height: 16px;
+ display: inline-block;
+ background-color: #FFF;
+ border: 1px solid #FFF;
+ border-radius: 4px;
+ background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0.25) 75%, transparent 75%, transparent);
+ font-size: 30px;
+ background-size: 1em 1em;
+ box-sizing: border-box;
+ animation: barStripe 1s linear infinite;
+}
+
+@keyframes barStripe {
+ 0% {
+ background-position: 1em 0;
+ }
+ 100% {
+ background-position: 0 0;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 96px;
+ height: 24px;
+ display: inline-block;
+ background-color: #FFF;
+ border: 1px solid #FFF;
+ border-radius: 4px;
+ background: linear-gradient(45deg, transparent 49%, #FFF 50%, #FFF 50%, transparent 51%, transparent), linear-gradient(-45deg, transparent 49%, #FFF 50%, #FFF 50%, transparent 51%, transparent);
+ font-size: 15px;
+ background-size: 1em 1em;
+ box-sizing: border-box;
+ animation: barStripe 0.6s linear infinite;
+}
+
+@keyframes barStripe {
+ 0% {
+ background-position: 1em 0;
+ }
+ 100% {
+ background-position: 0 0;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 130px;
+ height: 48px;
+ display: inline-block;
+ background: linear-gradient(45deg, #000 25%, transparent 25%, transparent 75%, #000 75%, #000 100%), linear-gradient(45deg, #000 25%, white 25%, white 75%, #000 75%, #000 100%);
+ font-size: 10px;
+ background-size: 32px 32px;
+ box-sizing: border-box;
+ animation: raceBoard 0.6s linear infinite;
+ background-position: 0 0, 16px 16px;
+}
+
+@keyframes raceBoard {
+ 0% {
+ background-position: 0 0, 16px 16px;
+ }
+ 100% {
+ background-position: 32px 0px, 48px 16px;
+ }
+}`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ background-color: #FFF;
+ background: radial-gradient(ellipse at center, #FF3D00 0%, #FF3D00 14%, #FFF 15%, #FFF 100%);
+ background-size: cover;
+ background-position: center;
+ border-radius: 50%;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ position: absolute;
+ height: 16px;
+ width: 4px;
+ background: #FF3D00;
+ top: 50%;
+ left: 50%;
+ transform: translateX(-50%) rotate(0deg);
+ transform-origin: 25% 0;
+ box-sizing: border-box;
+ animation: rotation 10s linear infinite;
+}
+.loader::before {
+ height: 22px;
+ width: 2px;
+ transform: translateX(-50%) rotate(0deg);
+ animation-duration: 1s;
+}
+@keyframes rotation {
+ 0% { transform: rotate(0deg)}
+ 100% { transform: rotate(360deg)}
+}
+`
+ },
+
+ {
+ note: 'Set background',
+ html: '',
+ css:
+`.loader {
+ width: 60px;
+ height: 40px;
+ position: relative;
+ display: inline-block;
+ --base-color: #263238; /*use your base color*/
+}
+.loader::before {
+ content: '';
+ left: 0;
+ top: 0;
+ position: absolute;
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ background-color: #FFF;
+ background-image: radial-gradient(circle 8px at 18px 18px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 18px 0px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 0px 18px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 36px 18px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 18px 36px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 30px 5px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 30px 5px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 30px 30px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 5px 30px, var(--base-color) 100%, transparent 0), radial-gradient(circle 4px at 5px 5px, var(--base-color) 100%, transparent 0);
+ background-repeat: no-repeat;
+ box-sizing: border-box;
+ animation: rotationBack 3s linear infinite;
+}
+.loader::after {
+ content: '';
+ left: 35px;
+ top: 15px;
+ position: absolute;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ background-color: #FFF;
+ background-image: radial-gradient(circle 5px at 12px 12px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 12px 0px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 0px 12px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 24px 12px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 12px 24px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 20px 3px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 20px 3px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 20px 20px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 3px 20px, var(--base-color) 100%, transparent 0), radial-gradient(circle 2.5px at 3px 3px, var(--base-color) 100%, transparent 0);
+ background-repeat: no-repeat;
+ box-sizing: border-box;
+ animation: rotationBack 4s linear infinite reverse;
+}
+@keyframes rotationBack {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 15px;
+ height: 20px;
+ margin-left: 15px;
+ background: #FFF;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: bump 0.4s ease-in infinite alternate;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ left: 50%;
+ top: 100%;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-top-color: #FFF;
+}
+
+@keyframes bump {
+ 0% {
+ transform: translate(-50%, 5px);
+ }
+ 100% {
+ transform: translate(-50%, -5px);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 15px;
+ height: 20px;
+ background: #FFF;
+ margin-left: 15px;
+ margin-top: 15px;
+ display: inline-block;
+ position: relative;
+ box-sizing: border-box;
+ animation: bump 0.4s linear infinite alternate;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ left: 50%;
+ bottom: 100%;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-bottom-color: #FFF;
+}
+
+@keyframes bump {
+ 0% {
+ transform: translate(-50%, 5px);
+ }
+ 100% {
+ transform: translate(-50%, -5px);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 12px;
+ background: #FFF;
+ margin-top: 40px;
+ display: inline-block;
+ position: relative;
+}
+.loader::after {
+ content: '';
+ left: 50%;
+ bottom: 0;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-top-color: #FFF;
+ box-sizing: border-box;
+ animation: bump 0.4s ease-in-out infinite alternate;
+}
+.loader::before {
+ content: '';
+ left: 50%;
+ bottom: 25px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ width: 15px;
+ height: 20px;
+ background: #FFF;
+ box-sizing: border-box;
+ animation: bump 0.4s ease-in-out infinite alternate;
+}
+
+@keyframes bump {
+ 0% {
+ transform: translate(-50%, 5px);
+ }
+ 100% {
+ transform: translate(-50%, -5px);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 12px;
+ margin-top: 40px;
+ background: #FFF;
+ display: inline-block;
+ position: relative;
+}
+.loader::after {
+ content: '';
+ left: 50%;
+ top: -47px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-bottom-color: #FFF;
+ box-sizing: border-box;
+ animation: bump 0.4s ease-in-out infinite alternate;
+}
+.loader::before {
+ content: '';
+ left: 50%;
+ bottom: 15px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ width: 15px;
+ height: 20px;
+ background: #FFF;
+ box-sizing: border-box;
+ animation: bump 0.4s ease-in-out infinite alternate;
+}
+
+@keyframes bump {
+ 0% {
+ transform: translate(-50%, 5px);
+ }
+ 100% {
+ transform: translate(-50%, -5px);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 24px;
+ display: inline-block;
+ position: relative;
+ color: #FFF;
+ border: 1px solid;
+ box-sizing: border-box;
+ animation: fillX 2s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 100%;
+ top: 50%;
+ transform: translateY(-50%);
+ background: #FFF;
+ width: 5px;
+ height: 12px;
+}
+
+@keyframes fillX {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 48px 0 inset;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 24px;
+ display: inline-block;
+ position: relative;
+ border: 1px solid #FFF;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 100%;
+ top: 50%;
+ transform: translateY(-50%);
+ border: 1px solid #FFF;
+ width: 5px;
+ height: 12px;
+}
+.loader::before {
+ content: '';
+ position: absolute;
+ left: -8px;
+ top: 50%;
+ transform: translateY(-50%);
+ height: 80%;
+ width: 6px;
+ box-sizing: border-box;
+ animation: animloader 2s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 11px 0 rgba(255, 255, 255, 0), 22px 0 rgba(255, 255, 255, 0), 33px 0 rgba(255, 255, 255, 0), 44px 0 rgba(255, 255, 255, 0);
+ }
+ 25% {
+ box-shadow: 11px 0 white, 22px 0 rgba(255, 255, 255, 0), 33px 0 rgba(255, 255, 255, 0), 44px 0 rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 11px 0 white, 22px 0 white, 33px 0 rgba(255, 255, 255, 0), 44px 0 rgba(255, 255, 255, 0);
+ }
+ 75% {
+ box-shadow: 11px 0 white, 22px 0 white, 33px 0 white, 44px 0 rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 11px 0 white, 22px 0 white, 33px 0 white, 44px 0 white;
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ border: 4px solid #FFF;
+ box-sizing: border-box;
+ animation: fill 2s linear infinite alternate;
+ color: rgba(255, 61, 0, 0.9);
+ border-radius: 0 0 4px 4px;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 100%;
+ top: 50%;
+ transform: translateY(-50%);
+ border: 4px solid #FFF;
+ width: 20px;
+ height: 25px;
+ border-radius: 0 4px 4px 0;
+}
+
+@keyframes fill {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 0 -48px inset;
+ }
+} `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 32px;
+ height: 72px;
+ display: inline-block;
+ left: 5px;
+ position: relative;
+ border: 2px solid #FFF;
+ box-sizing: border-box;
+ animation: animloader 2s linear infinite alternate;
+ color: #FF3D00;
+ border-radius: 0 0 4px 4px;
+ transform: perspective(140px) rotateX(-45deg);
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 0 -70px inset;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 40px;
+ margin-top: 30px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ border-radius: 15% 15% 35% 35%;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 45px;
+ top: 8px;
+ border: 4px solid #FFF;
+ width: 16px;
+ height: 20px;
+ border-radius: 0 4px 4px 0;
+}
+.loader::before {
+ content: '';
+ position: absolute;
+ width: 1px;
+ height: 10px;
+ color: #FFF;
+ top: -15px;
+ left: 11px;
+ box-sizing: border-box;
+ animation: animloader 1s ease infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 2px 0px rgba(255, 255, 255, 0), 12px 0px rgba(255, 255, 255, 0.3), 20px 0px rgba(255, 255, 255, 0);
+}
+ 50% {
+ box-shadow: 2px -5px rgba(255, 255, 255, 0.5), 12px -3px rgba(255, 255, 255, 0.5), 20px -2px rgba(255, 255, 255, 0.6);
+}
+ 100% {
+ box-shadow: 2px -8px rgba(255, 255, 255, 0), 12px -5px rgba(255, 255, 255, 0), 20px -5px rgba(255, 255, 255, 0);
+}
+ }`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 96px;
+ height: 48px;
+ display: inline-block;
+ position: relative;
+ background: #FFF;
+ border-radius: 48px 48px 0 0;
+ box-sizing: border-box;
+ overflow: hidden;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ width: 24px;
+ height: 12px;
+ border-radius: 24px 24px 0 0;
+ background: #FF3D00;
+ left: 50%;
+ transform: translateX(-50%);
+ bottom: 0;
+}
+.loader::before {
+ content: '';
+ position: absolute;
+ width: 4px;
+ height: 32px;
+ left: 0;
+ right: 0;
+ margin: auto;
+ bottom: 0;
+ background: #FF3D00;
+ transform-origin: 50% 100%;
+ box-sizing: border-box;
+ animation: animloader 2s linear infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: rotate(-70deg);
+ }
+ 10% {
+ transform: rotate(-40deg);
+ }
+ 20%, 45%, 35% {
+ transform: rotate(-10deg);
+ }
+ 40%, 30% {
+ transform: rotate(-30deg);
+ }
+ 50%, 60% {
+ transform: rotate(20deg);
+ }
+ 55%, 65%, 75% {
+ transform: rotate(40deg);
+ }
+ 70% {
+ transform: rotate(45deg);
+ }
+ 85%, 90% {
+ transform: rotate(50deg);
+ }
+ 95% {
+ transform: rotate(75deg);
+ }
+ 100%, 93% {
+ transform: rotate(70deg);
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: block;
+ margin: 20px auto;
+ position: relative;
+ border: 3px solid #FFF;
+ border-radius: 50%;
+ box-sizing: border-box;
+ animation: animloader 2s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ width: 6px;
+ height: 24px;
+ background: #FFF;
+ transform: rotate(-45deg);
+ position: absolute;
+ bottom: -20px;
+ left: 46px;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: translate(-10px, -10px);
+ }
+ 25% {
+ transform: translate(-10px, 10px);
+ }
+ 50% {
+ transform: translate(10px, 10px);
+ }
+ 75% {
+ transform: translate(10px, -10px);
+ }
+ 100% {
+ transform: translate(-10px, -10px);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ display: block;
+ margin: 20px auto;
+ box-sizing: border-box;
+ position: relative;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ width: 48px;
+ height: 48px;
+ left: 0;
+ bottom: 0;
+ position: absolute;
+ border-radius: 50% 50% 0;
+ border: 15px solid #FFF;
+ transform: rotate(45deg) translate(0, 0);
+ box-sizing: border-box;
+ animation: animMarker 0.4s ease-in-out infinite alternate;
+}
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 0;
+ right: 0;
+ margin: auto;
+ top: 150%;
+ width: 24px;
+ height: 4px;
+ border-radius: 50%;
+ background: rgba(0, 0, 0, 0.2);
+ animation: animShadow 0.4s ease-in-out infinite alternate;
+}
+
+@keyframes animMarker {
+ 0% {
+ transform: rotate(45deg) translate(5px, 5px);
+ }
+ 100% {
+ transform: rotate(45deg) translate(-5px, -5px);
+ }
+}
+
+@keyframes animShadow {
+ 0% {
+ transform: scale(0.5);
+ }
+ 100% {
+ transform: scale(1);
+ }
+}
+ `
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 48px;
+ height: 48px;
+ background: #FF3D00;
+ display: block;
+ margin: 20px auto;
+ position: relative;
+ box-sizing: border-box;
+ animation: rotationBack 1s ease-in-out infinite reverse;
+}
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ left: 0;
+ top: 0;
+ transform: rotate(45deg);
+ position: absolute;
+ width: 48px;
+ height: 48px;
+ background: #FF3D00;
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ width: 32px;
+ height: 32px;
+ border-radius: 50%;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ background: #FFF;
+ transform: translate(-50%, -50%);
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
+}
+@keyframes rotationBack {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-360deg);
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 60px;
+ height: 60px;
+ display: block;
+ margin: 20px auto;
+ position: relative;
+ background: radial-gradient(ellipse at center, #FFF 69%, rgba(0, 0, 0, 0) 70%), linear-gradient(to right, rgba(0, 0, 0, 0) 47%, #FFF 48%, #FFF 52%, rgba(0, 0, 0, 0) 53%);
+ background-size: 20px 20px , 20px auto;
+ background-repeat: repeat-x;
+ background-position: center bottom, center -5px;
+ box-sizing: border-box;
+}
+.loader::before,
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: -20px;
+ top: 0;
+ width: 20px;
+ height: 60px;
+ background: radial-gradient(ellipse at center, #FFF 69%, rgba(0, 0, 0, 0) 70%), linear-gradient(to right, rgba(0, 0, 0, 0) 47%, #FFF 48%, #FFF 52%, rgba(0, 0, 0, 0) 53%);
+ background-size: 20px 20px , 20px auto;
+ background-repeat: no-repeat;
+ background-position: center bottom, center -5px;
+ transform: rotate(0deg);
+ transform-origin: 50% 0%;
+ animation: animPend 1s linear infinite alternate;
+}
+.loader::after {
+ animation: animPend2 1s linear infinite alternate;
+ left: 100%;
+}
+
+@keyframes animPend {
+ 0% {
+ transform: rotate(22deg);
+ }
+ 50% {
+ transform: rotate(0deg);
+ }
+}
+
+@keyframes animPend2 {
+ 0%, 55% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-22deg);
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 24px;
+ height: 80px;
+ display: block;
+ margin: 35px auto 0;
+ border: 1px solid #FFF;
+ border-radius: 0 0 50px 50px;
+ position: relative;
+ box-shadow: 0px 0px #FF3D00 inset;
+ background-image: linear-gradient(#FF3D00 100px, transparent 0);
+ background-position: 0px 0px;
+ background-size: 22px 80px;
+ background-repeat: no-repeat;
+ box-sizing: border-box;
+ animation: animloader 6s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ top: -6px;
+ left: 50%;
+ transform: translateX(-50%);
+ position: absolute;
+ border: 1px solid #FFF;
+ border-radius: 50%;
+ width: 28px;
+ height: 6px;
+}
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ left: 0;
+ bottom: -4px;
+ border-radius: 50%;
+ position: absolute;
+ width: 6px;
+ height: 6px;
+ animation: animloader1 6s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ background-position: 0px 80px;
+ }
+ 100% {
+ background-position: 0px 0px;
+ }
+}
+
+@keyframes animloader1 {
+ 0% {
+ box-shadow: 4px -10px rgba(255, 255, 255, 0), 6px 0px rgba(255, 255, 255, 0), 8px -15px rgba(255, 255, 255, 0), 12px 0px rgba(255, 255, 255, 0);
+ }
+ 20% {
+ box-shadow: 4px -20px rgba(255, 255, 255, 0), 8px -10px rgba(255, 255, 255, 0), 10px -30px rgba(255, 255, 255, 0.5), 15px -5px rgba(255, 255, 255, 0);
+ }
+ 40% {
+ box-shadow: 2px -40px rgba(255, 255, 255, 0.5), 8px -30px rgba(255, 255, 255, 0.4), 8px -60px rgba(255, 255, 255, 0.5), 12px -15px rgba(255, 255, 255, 0.5);
+ }
+ 60% {
+ box-shadow: 4px -60px rgba(255, 255, 255, 0.5), 6px -50px rgba(255, 255, 255, 0.4), 10px -90px rgba(255, 255, 255, 0.5), 15px -25px rgba(255, 255, 255, 0.5);
+ }
+ 80% {
+ box-shadow: 2px -80px rgba(255, 255, 255, 0.5), 4px -70px rgba(255, 255, 255, 0.4), 8px -120px rgba(255, 255, 255, 0), 12px -35px rgba(255, 255, 255, 0.5);
+ }
+ 100% {
+ box-shadow: 4px -100px rgba(255, 255, 255, 0), 8px -90px rgba(255, 255, 255, 0), 10px -120px rgba(255, 255, 255, 0), 15px -45px rgba(255, 255, 255, 0);
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 20px;
+ height: 20px;
+ display: block;
+ margin: 80px auto 20px;
+ border-radius: 50%;
+ background: #FF3D00;
+ border: 5px solid #FFF;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::before {
+ content: '';
+ position: absolute;
+ left: 50%;
+ bottom: 10px;
+ transform: translateX(-50%);
+ width: 8px;
+ height: 80px;
+ border: 2px solid #FFF;
+ border-bottom: none;
+ background: #FFF;
+ color: #FF3D00;
+ border-radius: 50px 50px 0 0;
+ box-shadow: 0px 0px inset;
+ box-sizing: border-box;
+ animation: animloader 6s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 0px 0px inset;
+ }
+ 100% {
+ box-shadow: 0px -80px inset;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 180px;
+ height: 140px;
+ display: block;
+ margin: 0 auto 20px;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 15px at 15px 15px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 75px, 50px 50px, 30px 32px, 136px 20px;
+ background-repeat: no-repeat;
+ background-position: 0px 30px, 30px 0px, 113px 29px, 147px 50px, 23px 60px;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ position: absolute;
+ left: 2px;
+ top: 65px;
+ width: 2px;
+ height: 6px;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 0.6s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 25px 0 white, 50px 0 white, 75px 0 white, 100px 0 white, 125px 0 white, 150px 0 white, 25px 0 white, 50px 0 white, 75px 0 white, 100px 0 white, 125px 0 white, 150px 0 white;
+ }
+ 50% {
+ box-shadow: 25px 20px white, 50px 60px rgba(255, 255, 255, 0), 75px 30px rgba(255, 255, 255, 0), 100px 70px rgba(255, 255, 255, 0), 125px 40px white, 150px 60px rgba(255, 255, 255, 0), 25px 20px white, 50px 30px white, 75px 10px white, 100px 30px white, 125px 30px rgba(255, 255, 255, 0), 150px 30px rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 25px 60px rgba(255, 255, 255, 0), 50px 60px rgba(255, 255, 255, 0), 75px 50px rgba(255, 255, 255, 0), 100px 70px rgba(255, 255, 255, 0), 125px 70px rgba(255, 255, 255, 0), 150px 60px rgba(255, 255, 255, 0), 25px 80px rgba(255, 255, 255, 0), 50px 80px rgba(255, 255, 255, 0), 75px 70px rgba(255, 255, 255, 0), 100px 60px rgba(255, 255, 255, 0), 125px 30px rgba(255, 255, 255, 0), 150px 30px rgba(255, 255, 255, 0);
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css:
+`.loader {
+ width: 175px;
+ height: 80px;
+ display: block;
+ margin: auto;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ left: 50%;
+ bottom: 0;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-top-color: #FF3D00;
+ box-sizing: border-box;
+ animation: fadePush 1s linear infinite;
+}
+.loader::before {
+ content: '';
+ left: 50%;
+ bottom: 30px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ width: 15px;
+ height: 15px;
+ background: #FF3D00;
+ box-sizing: border-box;
+ animation: fadePush 1s linear infinite;
+}
+
+@keyframes fadePush {
+ 0% {
+ transform: translate(-50%, -15px);
+ opacity: 0;
+ }
+ 50% {
+ transform: translate(-50%, 0px);
+ opacity: 1;
+ }
+ 100% {
+ transform: translate(-50%, 15px);
+ opacity: 0;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 175px;
+ height: 80px;
+ display: block;
+ margin: auto;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ left: 50%;
+ bottom: 30px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ border: 15px solid transparent;
+ border-bottom-color: #FF3D00;
+ box-sizing: border-box;
+ animation: fadePull 1s linear infinite;
+}
+.loader::before {
+ content: '';
+ left: 50%;
+ bottom: 15px;
+ transform: translate(-50%, 0);
+ position: absolute;
+ width: 15px;
+ height: 15px;
+ background: #FF3D00;
+ box-sizing: border-box;
+ animation: fadePull 1s linear infinite;
+}
+
+@keyframes fadePull {
+ 0% {
+ transform: translate(-50%, 15px);
+ opacity: 0;
+ }
+ 50% {
+ transform: translate(-50%, 0px);
+ opacity: 1;
+ }
+ 100% {
+ transform: translate(-50%, -15px);
+ opacity: 0;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 175px;
+ height: 80px;
+ display: block;
+ margin: auto;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ left: 0;
+ right: 0;
+ bottom: 20px;
+ position: absolute;
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ border: 5px solid transparent;
+ border-color: #FF3D00 transparent;
+ box-sizing: border-box;
+ animation: rotation 1s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 175px;
+ height: 80px;
+ display: block;
+ margin:auto;
+ background-image: radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::before {
+ content: '';
+ left: 60px;
+ bottom: 18px;
+ position: absolute;
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ background-color: #FF3D00;
+ background-image: radial-gradient(circle 8px at 18px 18px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 18px 0px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 0px 18px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 36px 18px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 18px 36px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 30px 5px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 30px 5px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 30px 30px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 5px 30px, #FFF 100%, transparent 0), radial-gradient(circle 4px at 5px 5px, #FFF 100%, transparent 0);
+ background-repeat: no-repeat;
+ box-sizing: border-box;
+ animation: rotationBack 3s linear infinite;
+}
+.loader::after {
+ content: '';
+ left: 94px;
+ bottom: 15px;
+ position: absolute;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ background-color: #FF3D00;
+ background-image: radial-gradient(circle 5px at 12px 12px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 12px 0px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 0px 12px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 24px 12px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 12px 24px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 20px 3px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 20px 3px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 20px 20px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 3px 20px, #FFF 100%, transparent 0), radial-gradient(circle 2.5px at 3px 3px, #FFF 100%, transparent 0);
+ background-repeat: no-repeat;
+ box-sizing: border-box;
+ animation: rotationBack 4s linear infinite reverse;
+}
+
+@keyframes rotationBack {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(-360deg);
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 175px;
+ height: 80px;
+ display: block;
+ margin:auto;
+ background-image: linear-gradient(#263238 50px, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #FFF 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #FFF 100%, transparent 0), linear-gradient(#FFF 50px, transparent 0);
+ background-size: 64px 6px, 50px 50px, 100px 76px, 50px 50px, 120px 40px;
+ background-position: 55px 60px, 0px 30px, 37px 0px, 122px 30px, 25px 40px;
+ background-repeat: no-repeat;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%) rotate(-180deg);
+ top: 62px;
+ height: 64px;
+ width: 60px;
+ background-color: #FFF;
+ background-image: linear-gradient(#DDD 20px, transparent 0), linear-gradient(#DDD 5px, transparent 0), linear-gradient(#DDD 10px, transparent 0), linear-gradient(#DDD 10px, transparent 0);
+ background-size: 50px 20px;
+ background-position: 5px 36px, 5px 25px, 5px 10px;
+ background-repeat: no-repeat;
+ border-radius: 2px 2px 4px 4px;
+ z-index: 10;
+ box-shadow: 0px -4px 7px rgba(0, 0, 0, 0.5);
+ box-sizing: border-box;
+ animation: animloader 4s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ height: 64px;
+ }
+ 90%, 100% {
+ height: 0px;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 32px;
+ height: 90px;
+ display: block;
+ margin: 20px auto;
+ position: relative;
+ border-radius: 50% 50% 0 0;
+ border-bottom: 10px solid #FF3D00;
+ background-color: #FFF;
+ background-image: radial-gradient(ellipse at center, #FFF 34%, #FF3D00 35%, #FF3D00 54%, #FFF 55%), linear-gradient(#FF3D00 10px, transparent 0);
+ background-size: 28px 28px;
+ background-position: center 20px , center 2px;
+ background-repeat: no-repeat;
+ box-sizing: border-box;
+ animation: animloaderBack 1s linear infinite alternate;
+}
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 64px;
+ height: 44px;
+ border-radius: 50%;
+ box-shadow: 0px 15px #FF3D00 inset;
+ top: 67px;
+}
+.loader::after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%) rotate(45deg);
+ width: 34px;
+ height: 34px;
+ top: 112%;
+ background: radial-gradient(ellipse at center, #ffdf00 8%, rgba(249, 62, 0, 0.6) 24%, rgba(0, 0, 0, 0) 100%);
+ border-radius: 50% 50% 0;
+ background-repeat: no-repeat;
+ background-position: -44px -44px;
+ background-size: 100px 100px;
+ box-shadow: 4px 4px 12px 0px rgba(255, 61, 0, 0.5);
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite alternate;
+}
+
+@keyframes animloaderBack {
+ 0%, 30%, 70% {
+ transform: translateY(0px);
+ }
+ 20%, 40%, 100% {
+ transform: translateY(-5px);
+ }
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 4px 4px 12px 2px rgba(255, 61, 0, 0.75);
+ width: 34px;
+ height: 34px;
+ background-position: -44px -44px;
+ background-size: 100px 100px;
+ }
+ 100% {
+ box-shadow: 2px 2px 8px 0px rgba(255, 61, 0, 0.5);
+ width: 30px;
+ height: 28px;
+ background-position: -36px -36px;
+ background-size: 80px 80px;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 106px;
+ height: 56px;
+ display: block;
+ margin: 30px auto;
+ background-image: linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), radial-gradient(circle 14px, #FFF 100%, transparent 0);
+ background-size: 48px 15px , 15px 35px, 15px 35px, 25px 15px, 28px 28px;
+ background-position: 25px 5px, 58px 20px, 25px 17px, 2px 37px, 76px 0px;
+ background-repeat: no-repeat;
+ position: relative;
+ transform: rotate(-45deg);
+ box-sizing: border-box;
+}
+.loader::after,
+.loader::before {
+ content: '';
+ position: absolute;
+ width: 56px;
+ height: 56px;
+ border: 6px solid #FFF;
+ border-radius: 50%;
+ left: -45px;
+ top: -10px;
+ background-repeat: no-repeat;
+ background-image: linear-gradient(#FFF 64px, transparent 0), linear-gradient(#FFF 66px, transparent 0), radial-gradient(circle 4px, #FFF 100%, transparent 0);
+ background-size: 40px 1px , 1px 40px, 8px 8px;
+ background-position: center center;
+ box-sizing: border-box;
+ animation: rotation 0.3s linear infinite;
+}
+.loader::before {
+ left: 25px;
+ top: 60px;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 48px;
+ height: 24px;
+ color: #FFF;
+ background: currentColor;
+ border-radius: 50% 50% 0 0;
+ position: relative;
+ display: block;
+ margin: 60px auto 0;
+ box-sizing: border-box;
+ animation: animloader 4s linear infinite;
+}
+.loader::after {
+ content: '';
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 28px;
+ height: 28px;
+ border-radius: 50%;
+ background: currentColor;
+ top: -34px;
+ box-sizing: border-box;
+ animation: animloader1 4s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 0 0 0 -2px , 0 0 0 -2px , 0 0 0 -5px , 0 0 0 -5px;
+ }
+ 20% {
+ box-shadow: 40px -1px 0 -2px , 0 0 0 -2px , 40px -1px 0 -5px , 0 0 0 -5px;
+ }
+ 40% {
+ box-shadow: 40px -1px 0 -2px , -40px -1px 0 -2px , 40px -1px 0 -5px ,-40px -1px 0 -5px;
+ }
+ 60% {
+ box-shadow: 40px -1px 0 -2px , -40px -1px 0 -2px , 23px -29px 0 -5px ,-40px -1px 0 -5px;
+ }
+ 80%, 95% {
+ box-shadow: 40px -1px 0 -2px , -40px -1px 0 -2px , 23px -29px 0 -5px , -23px -29px 0 -5px;
+ }
+ 100% {
+ box-shadow: 40px -1px 0 -2px rgba(255, 255, 255, 0), -40px -1px 0 -2px rgba(255, 255, 255, 0), 23px -29px 0 -5px rgba(255, 255, 255, 0), -23px -29px 0 -5px rgba(255, 255, 255, 0);
+ }
+}
+
+@keyframes animloader1 {
+ 0% {
+ box-shadow: 0 0 0 -2px , 0 0 0 -2px , 0 0 0 -5px , 0 0 0 -5px;
+ }
+ 20% {
+ box-shadow: 40px 2px 0 -2px , 0 0 0 -2px , 40px 2px 0 -5px , 0 0 0 -5px;
+ }
+ 40% {
+ box-shadow: 40px 2px 0 -2px , -40px 2px 0 -2px , 40px 2px 0 -5px , -40px 2px 0 -5px;
+ }
+ 60% {
+ box-shadow: 40px 2px 0 -2px , -40px 2px 0 -2px , 23px -23px 0 -5px , -40px 2px 0 -5px;
+ }
+ 80%, 95% {
+ box-shadow: 40px 2px 0 -2px , -40px 2px 0 -2px , 23px -23px 0 -5px , -23px -23px 0 -5px;
+ }
+ 100% {
+ box-shadow: 40px 2px 0 -2px rgba(255, 255, 255, 0), -40px 2px 0 -2px rgba(255, 255, 255, 0), 23px -23px 0 -5px rgba(255, 255, 255, 0), -23px -23px 0 -5px rgba(255, 255, 255, 0);
+ }
+}
+`
+ },
+
+ {
+ html: 'Loading',
+ css: `.loader {
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ display: inline-block;
+ color: #FF3D00;
+ letter-spacing: 2px;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: 'Loading';
+ position: absolute;
+ left: 0;
+ top: 0;
+ color: #FFF;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ box-sizing: border-box;
+ animation: animloader 6s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ height: 100%;
+ }
+ 100% {
+ height: 0%;
+ }
+}
+`
+ },
+
+ {
+ html: 'Loading',
+ css: `.loader {
+ font-size: 48px;
+ display: inline-block;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #FFF;
+ letter-spacing: 2px;
+ position: relative;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: 'Loading';
+ position: absolute;
+ left: 0;
+ top: 0;
+ color: #263238;
+ text-shadow: 0 0 2px #FFF, 0 0 1px #FFF, 0 0 1px #FFF;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ box-sizing: border-box;
+ animation: animloader 6s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ height: 100%;
+ }
+ 100% {
+ height: 0%;
+ }
+}
+`
+ },
+
+ {
+ html: 'Loading',
+ css: `.loader {
+ font-size: 48px;
+ display: inline-block;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #263238;
+ box-sizing: border-box;
+ text-shadow: 0 0 2px #FFF, 0 0 1px #FFF, 0 0 1px #FFF;
+ letter-spacing: 2px;
+ position: relative;
+}
+.loader::after {
+ content: 'Loading';
+ position: absolute;
+ left: 0;
+ top: 0;
+ color: #FFF;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ box-sizing: border-box;
+ animation: animloader 6s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ width: 0%;
+ }
+ 100% {
+ width: 100%;
+ }
+}
+`
+ },
+
+ {
+ html: 'L ading',
+ css: `.loader {
+ display: inline-block;
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #FFF;
+ position: relative;
+}
+.loader::before {
+ content: '';
+ position: absolute;
+ left: 34px;
+ bottom: 8px;
+ width: 30px;
+ height: 30px;
+ border-radius: 50%;
+ border: 5px solid #FFF;
+ border-bottom-color: #FF3D00;
+ box-sizing: border-box;
+ animation: rotation 0.6s linear infinite;
+}
+
+@keyframes rotation {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+} `
+ },
+
+ {
+ html: 'Load ng',
+ css: `.loader {
+ color: #FFF;
+ position: relative;
+ display: inline-block;
+ margin-top: 40px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 4px;
+ box-sizing: border-box;
+}
+.loader::before {
+ content: '';
+ position: absolute;
+ right: 70px;
+ bottom: 10px;
+ height: 28px;
+ width: 5.15px;
+ background: currentColor;
+ box-sizing: border-box;
+ animation: animloader1 1s linear infinite alternate;
+}
+.loader::after {
+ content: '';
+ width: 10px;
+ height: 10px;
+ position: absolute;
+ left: 125px;
+ top: 2px;
+ border-radius: 50%;
+ background: red;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: translate(0px, 0px) scaleX(1);
+ }
+ 14% {
+ transform: translate(-12px, -16px) scaleX(1.05);
+ }
+ 28% {
+ transform: translate(-27px, -28px) scaleX(1.07);
+ }
+ 42% {
+ transform: translate(-46px, -35px) scaleX(1.1);
+ }
+ 57% {
+ transform: translate(-70px, -37px) scaleX(1.1);
+ }
+ 71% {
+ transform: translate(-94px, -32px) scaleX(1.07);
+ }
+ 85% {
+ transform: translate(-111px, -22px) scaleX(1.05);
+ }
+ 100% {
+ transform: translate(-125px, -9px) scaleX(1);
+ }
+}
+
+@keyframes animloader1 {
+ 0% {
+ box-shadow: 0 -6px, -122.9px -8px;
+ }
+ 25%, 75% {
+ box-shadow: 0 0px, -122.9px -8px;
+ }
+ 100% {
+ box-shadow: 0 0px, -122.9px -16px;
+ }
+}
+`
+ },
+
+ {
+ html: 'Load ng',
+ css: `.loader {
+ color: #FFF;
+ position: relative;
+ display: inline-block;
+ margin-top: 20px;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 4px;
+ box-sizing: border-box;
+}
+.loader::before {
+ content: '';
+ box-sizing: border-box;
+ position: absolute;
+ right: 70px;
+ bottom: 10px;
+ height: 24px;
+ width: 5.15px;
+ background: currentColor;
+}
+.loader::after {
+ content: '';
+ width: 8px;
+ height: 8px;
+ position: absolute;
+ left: 125px;
+ top: 2px;
+ border-radius: 50%;
+ background: red;
+ box-sizing: border-box;
+ animation: animloader 1s ease-in infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ transform: translateY(8px) scaleY(1) scaleX(1.25);
+ }
+ 25%, 75% {
+ transform: translateY(-5px) scaleY(1.2) scaleX(1);
+ }
+ 50% {
+ transform: translateY(-10px) scaleY(1) scaleX(1);
+ }
+ 100% {
+ transform: translateY(8px) scaleY(0.8) scaleX(0.8);
+ }
+}
+`
+ },
+
+ {
+ html: 'Loading',
+ css: `.loader {
+ color: #FFF;
+ display: inline-block;
+ position: relative;
+ font-size: 48px;
+ font-family: Arial, Helvetica, sans-serif;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ width: 5px;
+ height: 5px;
+ background: currentColor;
+ position: absolute;
+ bottom: 10px;
+ right: -5px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ box-shadow: 10px 0 rgba(255, 255, 255, 0), 20px 0 rgba(255, 255, 255, 0);
+ }
+ 50% {
+ box-shadow: 10px 0 white, 20px 0 rgba(255, 255, 255, 0);
+ }
+ 100% {
+ box-shadow: 10px 0 white, 20px 0 white;
+ }
+}
+`
+ },
+
+ {
+ html: 'Load ng',
+ css: `.loader {
+ color: #FFF;
+ display: inline-block;
+ position: relative;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 4px;
+ box-sizing: border-box;
+}
+.loader::before {
+ content: '';
+ position: absolute;
+ right: 70px;
+ bottom: 10px;
+ height: 24px;
+ width: 5px;
+ background: currentColor;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ width: 4px;
+ height: 4px;
+ background: currentColor;
+ position: absolute;
+ right: 70px;
+ top: 8px;
+ box-sizing: border-box;
+ animation: animloader 0.6s ease-out infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ top: 8px;
+ transform: rotate(0deg) scale(1);
+ }
+ 100% {
+ top: 0px;
+ transform: rotate(180deg) scale(1.5);
+ }
+}
+`
+ },
+
+ {
+ html: 'Load ng',
+ css: `.loader {
+ color: #FFF;
+ display: inline-block;
+ position: relative;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 4px;
+ box-sizing: border-box;
+}
+.loader::before {
+ content: '';
+ position: absolute;
+ right: 68px;
+ bottom: 10px;
+ height: 24px;
+ width: 7px;
+ outline: 1px solid #FFF;
+ color: #FF3D00;
+ box-sizing: border-box;
+ animation: animloader1 1s linear infinite alternate;
+}
+.loader::after {
+ content: '';
+ width: 4px;
+ height: 4px;
+ background: #FF3D00;
+ position: absolute;
+ right: 70px;
+ top: 8px;
+ box-sizing: border-box;
+ animation: animloader 1s ease-out infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ top: 8px;
+ transform: rotate(0deg) scale(1);
+ }
+ 100% {
+ top: 0px;
+ transform: rotate(180deg) scale(1.5);
+ }
+}
+
+@keyframes animloader1 {
+ 0% {
+ box-shadow: 0 0 inset;
+ }
+ 100% {
+ box-shadow: 0 -28px inset;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ position: relative;
+ display: inline-block;
+}
+.loader::before {
+
+ content: 'Loading';
+ color: #FFF;
+ font-family: Arial, Helvetica, sans-serif;
+ font-size: 48px;
+ letter-spacing: 2px;
+ display: inline-block;
+ box-sizing: border-box;
+ animation: floating 1s ease-out infinite alternate;
+}
+.loader::after {
+ content: '';
+ width: 100%;
+ height: 10px;
+ background: rgba(0, 0, 0, 0.15);
+ position: absolute;
+ left: 0;
+ top: 100%;
+ filter: blur(4px);
+ border-radius: 50%;
+ box-sizing: border-box;
+ animation: animloader 1s ease-out infinite alternate;
+}
+
+@keyframes floating {
+ 0% {
+ transform: translateY(0);
+ }
+ 100% {
+ transform: translateY(-25px);
+ }
+}
+
+@keyframes animloader {
+ 0% {
+ transform: scale(0.8);
+ }
+ 100% {
+ transform: scale(1.2);
+ }
+}
+`
+ },
+
+ {
+ html: 'Loading',
+ css: `.loader {
+ font-size: 48px;
+ display: inline-block;
+ letter-spacing: 2px;
+ font-family: Arial, Helvetica, sans-serif;
+ color: #FFF;
+ box-sizing: border-box;
+ animation: animloader 1s ease-in infinite alternate;
+}
+
+@keyframes animloader {
+ 0% {
+ filter: blur(0px);
+ transform: skew(0deg);
+ }
+ 100% {
+ filter: blur(3px);
+ transform: skew(-4deg);
+ }
+}
+`
+ },
+
+ {
+ html: 'Loading',
+ css: `.loader {
+ font-size: 48px;
+ display: inline-block;
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: bold;
+ color: #FF3D00;
+ letter-spacing: 2px;
+ position: relative;
+}
+.loader::after {
+ content: 'Loading';
+ position: absolute;
+ left: 0;
+ top: 0;
+ color: #FFF;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ box-sizing: border-box;
+ animation: animloader 10s ease-in infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ width: 0%;
+ }
+ 100% {
+ width: 100%;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 100%;
+ height: 100px;
+ display: block;
+ background-image: linear-gradient(100deg, transparent, rgba(38, 50, 56, 0.5) 50%, transparent 80%), radial-gradient(circle 50px at 50px 50px, #FFF 99%, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 100px, 100px 100px, 125px 20px, 260px 20px, 260px 20px;
+ background-position: -50% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ background-position: 0% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ }
+ 100% {
+ background-position: 100% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 100%;
+ height: 100px;
+ display: block;
+ background-image: linear-gradient(100deg, transparent, rgba(38, 50, 56, 0.5) 50%, transparent 80%), linear-gradient(#FFF 100px, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 100px, 100px 100px, 125px 20px, 260px 20px, 260px 20px;
+ background-position: -50% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ background-position: 0% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ }
+ 100% {
+ background-position: 100% 0, 0 0, 120px 0, 120px 40px, 120px 80px, 120px 120px;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 100%;
+ height: 100px;
+ display: block;
+ position: relative;
+ background-image: linear-gradient(100deg, transparent, rgba(38, 50, 56, 0.5) 50%, transparent 80%), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0), linear-gradient(#FFF 20px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 100px, 125px 20px, 260px 20px, 260px 20px;
+ background-position: 0% 0, 120px 0, 120px 40px, 120px 80px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+}
+.loader::after {
+ content: '';
+ box-sizing: border-box;
+ width: 100px;
+ height: 100px;
+ border-radius: 8px;
+ background: #FFF;
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+
+@keyframes animloader {
+ 0% {
+ background-position: 0% 0, 120px 0, 120px 40px, 120px 80px;
+ }
+ 100% {
+ background-position: 100% 0, 120px 0, 120px 40px, 120px 80px;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 320px;
+ height: 150px;
+ margin: auto;
+ display: block;
+ position: relative;
+ background: #FFF;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ width: calc(100% - 30px);
+ height: calc(100% - 30px);
+ top: 15px;
+ left: 15px;
+ position: absolute;
+ background-image: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.5) 50%, transparent 80%), linear-gradient(#DDD 56px, transparent 0), linear-gradient(#DDD 24px, transparent 0), linear-gradient(#DDD 18px, transparent 0), linear-gradient(#DDD 66px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 130px, 55px 56px, 160px 30px, 260px 20px, 290px 56px;
+ background-position: 0% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ background-position: 0% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ }
+ 100% {
+ background-position: 150% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 320px;
+ height: 150px;
+ display: block;
+ margin: auto;
+ position: relative;
+ background: #FFF;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ width: calc(100% - 30px);
+ height: calc(100% - 30px);
+ top: 15px;
+ left: 15px;
+ position: absolute;
+ background-image: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.5) 50%, transparent 80%), radial-gradient(circle 28px at 28px 28px, #DDD 99%, transparent 0), linear-gradient(#DDD 24px, transparent 0), linear-gradient(#DDD 18px, transparent 0), linear-gradient(#DDD 66px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 75px 130px, 55px 56px, 160px 30px, 260px 20px, 290px 56px;
+ background-position: 0% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ background-position: 0% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ }
+ 100% {
+ background-position: 150% 0, 0 0, 70px 5px, 70px 38px, 0px 66px;
+ }
+}
+`
+ },
+
+ {
+ html: '',
+ css: `.loader {
+ width: 164px;
+ height: 170px;
+ display: block;
+ margin: auto;
+ position: relative;
+ background: #FFF;
+ box-sizing: border-box;
+}
+.loader::after {
+ content: '';
+ width: calc(100% - 30px);
+ height: calc(100% - 30px);
+ top: 15px;
+ left: 15px;
+ position: absolute;
+ background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5) 50%, transparent 100%), linear-gradient(#DDD 74px, transparent 0), linear-gradient(#DDD 16px, transparent 0), linear-gradient(#DDD 24px, transparent 0);
+ background-repeat: no-repeat;
+ background-size: 50px 170px, 100% 74px, 100% 16px, 100% 32px;
+ background-position: 0 0, 0 0, 0px 85px, 0px 110px;
+ box-sizing: border-box;
+ animation: animloader 1s linear infinite;
+}
+
+@keyframes animloader {
+ 0% {
+ background-position: 0 0, 0 0, 0px 85px, 0px 110px;
+ }
+ 100% {
+ background-position: 150% 0, 0 0, 0px 85px, 0px 110px;
+ }
+}
+`
+ }
+
+]
\ No newline at end of file
diff --git a/images/Loader-one.png b/images/Loader-one.png
new file mode 100644
index 0000000000000000000000000000000000000000..944ce4df518f7ea23368c4ba40de008ec06bb5b5
GIT binary patch
literal 4899
zcmeHL_fu2d)(#MwR6&D=CLm4eH6jEMLQ&+UDUn_Tk&bkbCJ&p+v;Y$6HQeJj-yd=3&il)mHM7s`Rpxotde)9J(AQ?V0KEVLftYl4G>t$Y3NgU`
zKt}_7JJD7!5QvSatEp}hV6~YW9AGlm(m$8^>2a#=osTN&*Z9=z-h;vAdt7Cg!J2A)
z7a+S72<1DskiP-UOA68~+q3<+^JwLRXZ34aFZD{@K2<>Dha&-!D@{mhV*k(sGye
z#x(xJE)%8s(YLe0|BQAjxO(fPV{QjtKW-H)ZakC1+xkI^^12!&C0&LSlG4O37O-h3
zpb&-#u#Ord1vKqS*%cA`6cAH_yc*^8YbX%YJ+ukqYp_l@st<)T>u9uwV&p3Nl4$Sy}fV;}QciGgSNObFRBb7h;m$
zS$M0qr+}dXz%6cay4NO65=%)^GeHvpjNCb~w^4Jbg;ch~sm&Usm{g`-B4NuDmSSz-
zbgFXFL%lJ*Bc1BMp=mpeFcOY%yqIq*&tSgN^@*952Kia)vr#yvIZ15;O}%={#-N_v
zUny5A^P8s<*JMsR_ouC`-eLQJ>@#ITsW8AOOsit1FS>=&-|PaZRGy)r*m-dp9c?}w
z(hEjbj6>MlObjC`Hn=uUHoP~;0lZ1MFzP)QbRxJj8N{@HLicpn-{ZY!n<<|Va@(`M
z=!$xAR_lhhHk`7n<(w(lQ^Z1oquj+A9e05C=tMl$gbn80k4*lCs)~pZ5fxQ;a-wSm
zgXMH3g%vr%=E6W>gi{Iq5)8t@p-8JC)7cv!W|l@JJK=4p?yQ|?zhuWq!E$AltKcw|
zp|Xo;d2sKd9&zI1*FkmSl-#9DkojM0va#`KwNP~mR|U?XgZPLsXL<6LwL1@rmu!Q4
z)w|8WQ2T7pti8*HC0^oLD3(3V6kDW;bC!SojQ6qPEvb>L=;5^IyYkl0?)B2=LmhK`
zr~V9oFFP#EhhEKmB+`m>6?<7^|*2{^qKHn;RMmun*8^7MW3W7yI4yMEONz
zs{*J975Q}S>g2AwOsfC$@MjXyDdu`^T(_98i4?)di)~rXQiG{6D{gD1OnWXRlJE-p
z?v*4pE<3^HAPBX
zqWb5{{y%zi&lVP?+=!7GF!FC2)61723rD69&f-2T%Dul4RmP|<8|gJJ|Abf1(0~c$
zNj=9zoyRTh^O}nc8s;zbzXg}+9<3Sk^imz@hj(@5;TQeFcInf|`v*EhhsA=kB!a$H
zIBM(@xMSQ067a;P-4xER_rSOLQd>KzR)Egqp|5uF7r)A6=V4z(O@!?@dhNac406(y
z;5&3f>_!jKm$T;2?16#RZ!&*Af_vL>7--^!OD<;=~v~{!y>hA1xBQHfx%x?|^QJ
zbq9sr&hh*4wo!a9#Ti=-Np;!Qa{<(h-`-{*jY?v0<9L3bVGo+k2nc*bDj&)mCbnE}DS|vXoT>BE3
zQ1ws)?8LdF>Z-!0DpoNpG2&O2)UWpvEMKPC6V2-PR&mCp!`+y~zLLhx(M%KNgLQ
ztH|9d$=HjzMQ#j>D!W*c3r
zf3LEz+AZ&NPgczASV*Q*B}^rGp)nU2uvqr^Y2;lEF~I;_T0AMpgJ!I8QBn}P6?Hv4JZ5D57_9=ykDB@Bt-B6yW2_DfYgJ_bFXAjG
zUYln&9YgfHvgu<-V}T{j=tuWFwoHI;}2T`snu*G8MX
zj7-?GOn;qZOFj9?_2AygyTwf*OS=PM4-ktfZ;v>48WA$YQ{3fhajiK*t#7hwz%LPq
zxOvhgOv4D|W1sRXKoymzQD@mm;24^GW*&E*GGKo=^k>9(fAlL~6jm-No7I`92*AM_
z8k=&Dl$dr>A<&q{y0v@ZsG_)iqD|aVlL=$}r3r_e`Q7fqa;H*DsB&2%w>;ZFaB241
z4m)Cxk{6M&SVfvvu&4-g>4yE&CzNs(el!Hb*)qO)Y*Y0gfqO6Uv@nL7_O%^CmmawD
zuKSq0mhyAH5;oza+-%c{-~VLZ<^BbTZz}(IOK!_7`$^(t&doco@UFl
zTb*-(9(G41j=e-$T%Il9RhbaZAC$?FSquG|CyV{vHCCqNoSnJUWt}L4DII}RFBWus
zuTeJ1Xrf!^b5RI&S4sX5rr(YY#CFJc2NaZZj3zN*zHfAPB3oSJ@Q+X&&vt6u7xBmr
z@(_lV-+mPke-+G8a~MmkhLC&RYrDuHuVy~m))89WDl*Js{wk`7!1#M|!(H!lO(>>;
z6&UFa!ZQ0y5da5xMDChLUveu~OBJUQ5R3K$G
z%|4m-hC_M#le8pf;@2Jt3ds57iY}j$P57SK924;Ro=D7XXlBQ%p?ku8vN{IKHuw7;J2VvYQ%+UxA
zye!xLQo-MZZs?gu7wu3!iMr~u>
z+rqtjeKU__3;dpz&b^Kk>LAG^ZF}eJr`*xxl@q%t)99Y!*CtsE_w15x;T~;t=_s(h
zOs@0h2yJ%c?)>uEc~+k@(5$&sNBP#e7rH&nP`^Fv##Sa^_5t>&tMznd3pGHbF
zZO%j|nl~-1nhxL#gW<*^Kv@mu%>*_K{b!QWA@Inb`KUQIp{+yEx?*P}yIaG#$wD|e
z!)FUTqjIc&cycmU^j2spAwEIcg)jmO-ENRx8`Pp~{M#xgUQEkcW{$hcPjTbFBt}ig
zAAXn@m?U?*b17xLm}ysr<%*v-7BTB>=CLLpc{>X5!I>4ZPr571o{W$NgYh-D0&kDv
z?hf7_)Zz!;yt&}rJ8%+2uOAy}QpE22Rjh
z)L)JwWU+M@fek7RrJnC%b4>`%oj4`Si}?6pxq)bZJaEqQf#Zbb%B$_Mv9bQ*Am>8}
z8<*>89+X(NXGLuL;QsPr>^h!ywhhseyKHeD2=pUs$w%>$EIe9Pq43Lm5n6vYIWAu?
zAo>B47E8Dw|qa!6_*z(R>yN2f>A)0sh-7FT55Kl{CH+mmc_E
zBfep|3CIUBRSbz76HHoLu_k?0A73~C_QeoM{tgKPTsOs;dvC@||DQ?o&3rdxC_CYm
zVLAw_P>ON)$=GE08ROd3xmD`SDTQpHWlgOrohL@p><;wOFG>Y2s7RTMdEUxpTE<-N~Lh=?SKfMx>?DA1b{@IuXh>WLJpo!E_g9$Y~E>&iG?PR$@MicSt
zu+{QcJB>re>|4%EZ>IT7Hu+n(>W92YI`PtAlj0(wKT|qCgMjp_(leGPSgz*8^2JdV
zq-m5==bd@94`=8}ii)dmSxLjv|1fdMGrzXHp$G{rFPK{!HTku?B(R9z$r`ag78g{*
zIg6^_-#VzrUz{vT@QS}5fD}1BJw>;aa<(G)R_;{QzAGp!?8(q+Mt=2#O|RHH-(UJJ
zMmY^E*G~oH*##+%0C;c9Kc=~!&jirr-{1Z%$bTC`BF?D>
Yw4?N3sSTHa$1jjBLSM7$j?Ihz0BDbt5dZ)H
literal 0
HcmV?d00001
diff --git a/images/Loader-screen.png b/images/Loader-screen.png
new file mode 100644
index 0000000000000000000000000000000000000000..7a9080ed0f3aaba1026cdfe2c07cf3fd45ea1c29
GIT binary patch
literal 55583
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