/** * Loaders.css * * Copyright (c) 2016 Jovey Zheng * * All animations must live in their own file * in the animations directory and be included * here. * */ [data-loader] { margin: 8px; } [data-loader='circle'] { width: 25px; height: 25px; -webkit-animation: circle infinite .75s linear; -moz-animation: circle infinite .75s linear; -o-animation: circle infinite .75s linear; animation: circle infinite .75s linear; /*border: 2px solid #fff;*/ border: 2px solid #1a93f7; border-top-color: transparent; border-radius: 100%; } [data-loader='circle-side'] { position: relative; width: 25px; height: 25px; -webkit-animation: circle infinite .75s linear; -moz-animation: circle infinite .75s linear; -o-animation: circle infinite .75s linear; animation: circle infinite .75s linear; border: 2px solid #fff; border-top-color: rgba(0, 0, 0, .2); border-right-color: rgba(0, 0, 0, .2); border-bottom-color: rgba(0, 0, 0, .2); border-radius: 100%; } @-webkit-keyframes circle { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-moz-keyframes circle { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-o-keyframes circle { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes circle { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } [data-loader='arrow-circle'] { position: relative; width: 25px; height: 25px; -webkit-animation: arrow-circle infinite .75s linear; -moz-animation: arrow-circle infinite .75s linear; -o-animation: arrow-circle infinite .75s linear; animation: arrow-circle infinite .75s linear; border: 2px solid #fff; border-top-color: transparent; border-bottom-color: transparent; border-radius: 100%; } [data-loader='arrow-circle']:before, [data-loader='arrow-circle']:after { position: absolute; top: 19px; left: -3px; content: ''; -webkit-transform: rotate(-30deg); -ms-transform: rotate(-30deg); -o-transform: rotate(-30deg); transform: rotate(-30deg); border-top: 5px solid #fff; border-right: 5px solid transparent; border-left: 5px solid transparent; } [data-loader='arrow-circle']:after { top: 0; left: 17px; -webkit-transform: rotate(150deg); -ms-transform: rotate(150deg); -o-transform: rotate(150deg); transform: rotate(150deg); } @-webkit-keyframes arrow-circle { 0% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } } @-moz-keyframes arrow-circle { 0% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } } @-o-keyframes arrow-circle { 0% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } } @keyframes arrow-circle { 0% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); } } [data-loader='ball-scale'] { width: 50px; height: 50px; -webkit-animation: ball-scale infinite linear .75s; -moz-animation: ball-scale infinite linear .75s; -o-animation: ball-scale infinite linear .75s; animation: ball-scale infinite linear .75s; border-radius: 100%; background-color: #fff; } @-webkit-keyframes ball-scale { 0% { -webkit-transform: scale(.1); -ms-transform: scale(.1); -o-transform: scale(.1); transform: scale(.1); opacity: 1; } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 0; } } @-moz-keyframes ball-scale { 0% { -webkit-transform: scale(.1); -ms-transform: scale(.1); -o-transform: scale(.1); transform: scale(.1); opacity: 1; } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 0; } } @-o-keyframes ball-scale { 0% { -webkit-transform: scale(.1); -ms-transform: scale(.1); -o-transform: scale(.1); transform: scale(.1); opacity: 1; } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 0; } } @keyframes ball-scale { 0% { -webkit-transform: scale(.1); -ms-transform: scale(.1); -o-transform: scale(.1); transform: scale(.1); opacity: 1; } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 0; } } [data-loader='ball-rotate'] { position: relative; width: 15px; height: 15px; -webkit-animation: ball-rotate 1s 0s cubic-bezier(.7, -.13, .22, .86) infinite; -moz-animation: ball-rotate 1s 0s cubic-bezier(.7, -.13, .22, .86) infinite; -o-animation: ball-rotate 1s 0s cubic-bezier(.7, -.13, .22, .86) infinite; animation: ball-rotate 1s 0s cubic-bezier(.7, -.13, .22, .86) infinite; border-radius: 100%; background-color: #fff; -webkit-animation-fill-mode: both; animation-fill-mode: both; } [data-loader='ball-rotate']:before, [data-loader='ball-rotate']:after { position: absolute; width: 15px; height: 15px; margin: 2px; content: ''; opacity: .8; border-radius: 100%; background-color: #fff; } [data-loader='ball-rotate']:before { top: 0; left: -28px; } [data-loader='ball-rotate']:after { top: 0; left: 25px; } @-webkit-keyframes ball-rotate { 0% { -webkit-transform: rotate(0deg) scale(1); -ms-transform: rotate(0deg) scale(1); -o-transform: rotate(0deg) scale(1); transform: rotate(0deg) scale(1); } 50% { -webkit-transform: rotate(180deg) scale(.6); -ms-transform: rotate(180deg) scale(.6); -o-transform: rotate(180deg) scale(.6); transform: rotate(180deg) scale(.6); } 100% { -webkit-transform: rotate(360deg) scale(1); -ms-transform: rotate(360deg) scale(1); -o-transform: rotate(360deg) scale(1); transform: rotate(360deg) scale(1); } } @-moz-keyframes ball-rotate { 0% { -webkit-transform: rotate(0deg) scale(1); -ms-transform: rotate(0deg) scale(1); -o-transform: rotate(0deg) scale(1); transform: rotate(0deg) scale(1); } 50% { -webkit-transform: rotate(180deg) scale(.6); -ms-transform: rotate(180deg) scale(.6); -o-transform: rotate(180deg) scale(.6); transform: rotate(180deg) scale(.6); } 100% { -webkit-transform: rotate(360deg) scale(1); -ms-transform: rotate(360deg) scale(1); -o-transform: rotate(360deg) scale(1); transform: rotate(360deg) scale(1); } } @-o-keyframes ball-rotate { 0% { -webkit-transform: rotate(0deg) scale(1); -ms-transform: rotate(0deg) scale(1); -o-transform: rotate(0deg) scale(1); transform: rotate(0deg) scale(1); } 50% { -webkit-transform: rotate(180deg) scale(.6); -ms-transform: rotate(180deg) scale(.6); -o-transform: rotate(180deg) scale(.6); transform: rotate(180deg) scale(.6); } 100% { -webkit-transform: rotate(360deg) scale(1); -ms-transform: rotate(360deg) scale(1); -o-transform: rotate(360deg) scale(1); transform: rotate(360deg) scale(1); } } @keyframes ball-rotate { 0% { -webkit-transform: rotate(0deg) scale(1); -ms-transform: rotate(0deg) scale(1); -o-transform: rotate(0deg) scale(1); transform: rotate(0deg) scale(1); } 50% { -webkit-transform: rotate(180deg) scale(.6); -ms-transform: rotate(180deg) scale(.6); -o-transform: rotate(180deg) scale(.6); transform: rotate(180deg) scale(.6); } 100% { -webkit-transform: rotate(360deg) scale(1); -ms-transform: rotate(360deg) scale(1); -o-transform: rotate(360deg) scale(1); transform: rotate(360deg) scale(1); } } [data-loader='ball-pulse'] { position: relative; width: 1px; height: 1px; } [data-loader='ball-pulse']:before, [data-loader='ball-pulse']:after { position: absolute; display: inline-block; width: 15px; height: 15px; content: ''; border-radius: 100%; background-color: #fff; } [data-loader='ball-pulse']:before { left: -15px; -webkit-animation: ball-pulse infinite .75s -.4s cubic-bezier(.2, .68, .18, 1.08); -moz-animation: ball-pulse infinite .75s -.4s cubic-bezier(.2, .68, .18, 1.08); -o-animation: ball-pulse infinite .75s -.4s cubic-bezier(.2, .68, .18, 1.08); animation: ball-pulse infinite .75s -.4s cubic-bezier(.2, .68, .18, 1.08); } [data-loader='ball-pulse']:after { right: -15px; -webkit-animation: ball-pulse infinite .75s cubic-bezier(.2, .68, .18, 1.08); -moz-animation: ball-pulse infinite .75s cubic-bezier(.2, .68, .18, 1.08); -o-animation: ball-pulse infinite .75s cubic-bezier(.2, .68, .18, 1.08); animation: ball-pulse infinite .75s cubic-bezier(.2, .68, .18, 1.08); } @-webkit-keyframes ball-pulse { 0% { transform: scale(1); opacity: 1; } 50% { transform: scale(.1); opacity: .6; } 100% { transform: scale(1); opacity: 1; } } @-moz-keyframes ball-pulse { 0% { transform: scale(1); opacity: 1; } 50% { transform: scale(.1); opacity: .6; } 100% { transform: scale(1); opacity: 1; } } @-o-keyframes ball-pulse { 0% { transform: scale(1); opacity: 1; } 50% { transform: scale(.1); opacity: .6; } 100% { transform: scale(1); opacity: 1; } } @keyframes ball-pulse { 0% { transform: scale(1); opacity: 1; } 50% { transform: scale(.1); opacity: .6; } 100% { transform: scale(1); opacity: 1; } } [data-loader='ball-circle'] { position: relative; width: 40px; height: 40px; } [data-loader='ball-circle']:before, [data-loader='ball-circle']:after { position: absolute; width: 10px; height: 10px; content: ''; border-radius: 100%; background-color: #fff; } [data-loader='ball-circle']:before { transform: translate(0, 0); -webkit-animation: ball-circle-before infinite 1.5s linear; -moz-animation: ball-circle-before infinite 1.5s linear; -o-animation: ball-circle-before infinite 1.5s linear; animation: ball-circle-before infinite 1.5s linear; } [data-loader='ball-circle']:after { transform: translate(30px, 30px); -webkit-animation: ball-circle-after infinite 1.5s linear; -moz-animation: ball-circle-after infinite 1.5s linear; -o-animation: ball-circle-after infinite 1.5s linear; animation: ball-circle-after infinite 1.5s linear; } @-webkit-keyframes ball-circle-after { 0% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } 25% { -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); -o-transform: translate(0, 30px); transform: translate(0, 30px); } 50% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 75% { -webkit-transform: translate(30px, 0); -ms-transform: translate(30px, 0); -o-transform: translate(30px, 0); transform: translate(30px, 0); } 100% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } } @-moz-keyframes ball-circle-after { 0% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } 25% { -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); -o-transform: translate(0, 30px); transform: translate(0, 30px); } 50% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 75% { -webkit-transform: translate(30px, 0); -ms-transform: translate(30px, 0); -o-transform: translate(30px, 0); transform: translate(30px, 0); } 100% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } } @-o-keyframes ball-circle-after { 0% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } 25% { -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); -o-transform: translate(0, 30px); transform: translate(0, 30px); } 50% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 75% { -webkit-transform: translate(30px, 0); -ms-transform: translate(30px, 0); -o-transform: translate(30px, 0); transform: translate(30px, 0); } 100% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } } @keyframes ball-circle-after { 0% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } 25% { -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); -o-transform: translate(0, 30px); transform: translate(0, 30px); } 50% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 75% { -webkit-transform: translate(30px, 0); -ms-transform: translate(30px, 0); -o-transform: translate(30px, 0); transform: translate(30px, 0); } 100% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } } @-webkit-keyframes ball-circle-before { 0% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 25% { -webkit-transform: translate(30px, 0); -ms-transform: translate(30px, 0); -o-transform: translate(30px, 0); transform: translate(30px, 0); } 50% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } 75% { -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); -o-transform: translate(0, 30px); transform: translate(0, 30px); } 100% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } } @-moz-keyframes ball-circle-before { 0% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 25% { -webkit-transform: translate(30px, 0); -ms-transform: translate(30px, 0); -o-transform: translate(30px, 0); transform: translate(30px, 0); } 50% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } 75% { -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); -o-transform: translate(0, 30px); transform: translate(0, 30px); } 100% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } } @-o-keyframes ball-circle-before { 0% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 25% { -webkit-transform: translate(30px, 0); -ms-transform: translate(30px, 0); -o-transform: translate(30px, 0); transform: translate(30px, 0); } 50% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } 75% { -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); -o-transform: translate(0, 30px); transform: translate(0, 30px); } 100% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } } @keyframes ball-circle-before { 0% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 25% { -webkit-transform: translate(30px, 0); -ms-transform: translate(30px, 0); -o-transform: translate(30px, 0); transform: translate(30px, 0); } 50% { -webkit-transform: translate(30px, 30px); -ms-transform: translate(30px, 30px); -o-transform: translate(30px, 30px); transform: translate(30px, 30px); } 75% { -webkit-transform: translate(0, 30px); -ms-transform: translate(0, 30px); -o-transform: translate(0, 30px); transform: translate(0, 30px); } 100% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } } [data-loader='rectangle'] { position: relative; width: 10px; height: 30px; -webkit-animation: rectangle infinite 1s ease-in-out -.2s; -moz-animation: rectangle infinite 1s ease-in-out -.2s; -o-animation: rectangle infinite 1s ease-in-out -.2s; animation: rectangle infinite 1s ease-in-out -.2s; background-color: #fff; } [data-loader='rectangle']:before, [data-loader='rectangle']:after { position: absolute; width: 10px; height: 30px; content: ''; background-color: #fff; } [data-loader='rectangle']:before { left: -20px; -webkit-animation: rectangle infinite 1s ease-in-out -.4s; -moz-animation: rectangle infinite 1s ease-in-out -.4s; -o-animation: rectangle infinite 1s ease-in-out -.4s; animation: rectangle infinite 1s ease-in-out -.4s; } [data-loader='rectangle']:after { right: -20px; -webkit-animation: rectangle infinite 1s ease-in-out; -moz-animation: rectangle infinite 1s ease-in-out; -o-animation: rectangle infinite 1s ease-in-out; animation: rectangle infinite 1s ease-in-out; } @-webkit-keyframes rectangle { 0%, 80%, 100% { height: 35px; -webkit-box-shadow: 0 0 #fff; box-shadow: 0 0 #fff; } 40% { height: 45px; -webkit-box-shadow: 0 -20px #fff; box-shadow: 0 -20px #fff; } } @-moz-keyframes rectangle { 0%, 80%, 100% { height: 35px; -webkit-box-shadow: 0 0 #fff; box-shadow: 0 0 #fff; } 40% { height: 45px; -webkit-box-shadow: 0 -20px #fff; box-shadow: 0 -20px #fff; } } @-o-keyframes rectangle { 0%, 80%, 100% { height: 35px; -webkit-box-shadow: 0 0 #fff; box-shadow: 0 0 #fff; } 40% { height: 45px; -webkit-box-shadow: 0 -20px #fff; box-shadow: 0 -20px #fff; } } @keyframes rectangle { 0%, 80%, 100% { height: 35px; -webkit-box-shadow: 0 0 #fff; box-shadow: 0 0 #fff; } 40% { height: 45px; -webkit-box-shadow: 0 -20px #fff; box-shadow: 0 -20px #fff; } } [data-loader='heart'] { position: relative; width: 100px; height: 90px; -webkit-animation: heart infinite .85s linear; -moz-animation: heart infinite .85s linear; -o-animation: heart infinite .85s linear; animation: heart infinite .85s linear; } [data-loader='heart']:before, [data-loader='heart']:after { position: absolute; top: 0; left: 30px; width: 30px; height: 50px; content: ''; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; -ms-transform-origin: 0 100%; -o-transform-origin: 0 100%; transform-origin: 0 100%; -moz-border-radius: 30px 30px 0 0; border-radius: 30px 30px 0 0; background: #fff; } [data-loader='heart']:after { left: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); -webkit-transform-origin: 100% 100%; -moz-transform-origin: 100% 100%; -ms-transform-origin: 100% 100%; -o-transform-origin: 100% 100%; transform-origin: 100% 100%; } @-webkit-keyframes heart { 0% { -webkit-transform: scale(.8); -ms-transform: scale(.8); -o-transform: scale(.8); transform: scale(.8); } 50% { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 100% { -webkit-transform: scale(.8); -ms-transform: scale(.8); -o-transform: scale(.8); transform: scale(.8); } } @-moz-keyframes heart { 0% { -webkit-transform: scale(.8); -ms-transform: scale(.8); -o-transform: scale(.8); transform: scale(.8); } 50% { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 100% { -webkit-transform: scale(.8); -ms-transform: scale(.8); -o-transform: scale(.8); transform: scale(.8); } } @-o-keyframes heart { 0% { -webkit-transform: scale(.8); -ms-transform: scale(.8); -o-transform: scale(.8); transform: scale(.8); } 50% { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 100% { -webkit-transform: scale(.8); -ms-transform: scale(.8); -o-transform: scale(.8); transform: scale(.8); } } @keyframes heart { 0% { -webkit-transform: scale(.8); -ms-transform: scale(.8); -o-transform: scale(.8); transform: scale(.8); } 50% { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 100% { -webkit-transform: scale(.8); -ms-transform: scale(.8); -o-transform: scale(.8); transform: scale(.8); } } [data-loader='jumping'] { position: relative; width: 50px; -webkit-perspective: 200px; -moz-perspective: 200px; -ms-perspective: 200px; perspective: 200px; } [data-loader='jumping']:before, [data-loader='jumping']:after { position: absolute; width: 20px; height: 20px; content: ''; animation: jumping .5s infinite alternate; background: rgba(0,0,0,0); } [data-loader='jumping']:before { left: 0; } [data-loader='jumping']:after { right: 0; animation-delay: .15s; } @-webkit-keyframes jumping { 0% { -webkit-transform: scale(1.0) translateY(0px) rotateX(0deg); -ms-transform: scale(1.0) translateY(0px) rotateX(0deg); -o-transform: scale(1.0) translateY(0px) rotateX(0deg); transform: scale(1.0) translateY(0px) rotateX(0deg); -webkit-box-shadow: 0 0 0 rgba(0,0,0,0); box-shadow: 0 0 0 rgba(0,0,0,0); } 100% { -webkit-transform: scale(1.2) translateY(-25px) rotateX(45deg); -ms-transform: scale(1.2) translateY(-25px) rotateX(45deg); -o-transform: scale(1.2) translateY(-25px) rotateX(45deg); transform: scale(1.2) translateY(-25px) rotateX(45deg); background: rgb(255,255,255); -webkit-box-shadow: 0 25px 40px rgb(255,255,255); box-shadow: 0 25px 40px rgb(255,255,255); } } @-moz-keyframes jumping { 0% { -webkit-transform: scale(1.0) translateY(0px) rotateX(0deg); -ms-transform: scale(1.0) translateY(0px) rotateX(0deg); -o-transform: scale(1.0) translateY(0px) rotateX(0deg); transform: scale(1.0) translateY(0px) rotateX(0deg); -webkit-box-shadow: 0 0 0 rgba(0,0,0,0); box-shadow: 0 0 0 rgba(0,0,0,0); } 100% { -webkit-transform: scale(1.2) translateY(-25px) rotateX(45deg); -ms-transform: scale(1.2) translateY(-25px) rotateX(45deg); -o-transform: scale(1.2) translateY(-25px) rotateX(45deg); transform: scale(1.2) translateY(-25px) rotateX(45deg); background: rgb(255,255,255); -webkit-box-shadow: 0 25px 40px rgb(255,255,255); box-shadow: 0 25px 40px rgb(255,255,255); } } @-o-keyframes jumping { 0% { -webkit-transform: scale(1.0) translateY(0px) rotateX(0deg); -ms-transform: scale(1.0) translateY(0px) rotateX(0deg); -o-transform: scale(1.0) translateY(0px) rotateX(0deg); transform: scale(1.0) translateY(0px) rotateX(0deg); -webkit-box-shadow: 0 0 0 rgba(0,0,0,0); box-shadow: 0 0 0 rgba(0,0,0,0); } 100% { -webkit-transform: scale(1.2) translateY(-25px) rotateX(45deg); -ms-transform: scale(1.2) translateY(-25px) rotateX(45deg); -o-transform: scale(1.2) translateY(-25px) rotateX(45deg); transform: scale(1.2) translateY(-25px) rotateX(45deg); background: rgb(255,255,255); -webkit-box-shadow: 0 25px 40px rgb(255,255,255); box-shadow: 0 25px 40px rgb(255,255,255); } } @keyframes jumping { 0% { -webkit-transform: scale(1.0) translateY(0px) rotateX(0deg); -ms-transform: scale(1.0) translateY(0px) rotateX(0deg); -o-transform: scale(1.0) translateY(0px) rotateX(0deg); transform: scale(1.0) translateY(0px) rotateX(0deg); -webkit-box-shadow: 0 0 0 rgba(0,0,0,0); box-shadow: 0 0 0 rgba(0,0,0,0); } 100% { -webkit-transform: scale(1.2) translateY(-25px) rotateX(45deg); -ms-transform: scale(1.2) translateY(-25px) rotateX(45deg); -o-transform: scale(1.2) translateY(-25px) rotateX(45deg); transform: scale(1.2) translateY(-25px) rotateX(45deg); background: rgb(255,255,255); -webkit-box-shadow: 0 25px 40px rgb(255,255,255); box-shadow: 0 25px 40px rgb(255,255,255); } } [data-loader='satellite'] { position: relative; width: 48px; height: 48px; animation: satellite 3s infinite linear; border: 1px solid #1a93f7; border-radius: 100%; } [data-loader='satellite']:before, [data-loader='satellite']:after { position: absolute; left: 0; width: 15px; height: 15px; content: ''; border-radius: 100%; background-color: #1a93f7; -webkit-box-shadow: 0 0 10px #1a93f7; box-shadow: 0 0 10px #1a93f7; } [data-loader='satellite']:after { right: 0; width: 24px; height: 24px; margin: 12px; } @-webkit-keyframes satellite { from { -webkit-transform: rotate(0) translateZ(0); -ms-transform: rotate(0) translateZ(0); -o-transform: rotate(0) translateZ(0); transform: rotate(0) translateZ(0); } to { -webkit-transform: rotate(360deg) translateZ(0); -ms-transform: rotate(360deg) translateZ(0); -o-transform: rotate(360deg) translateZ(0); transform: rotate(360deg) translateZ(0); } } @-moz-keyframes satellite { from { -webkit-transform: rotate(0) translateZ(0); -ms-transform: rotate(0) translateZ(0); -o-transform: rotate(0) translateZ(0); transform: rotate(0) translateZ(0); } to { -webkit-transform: rotate(360deg) translateZ(0); -ms-transform: rotate(360deg) translateZ(0); -o-transform: rotate(360deg) translateZ(0); transform: rotate(360deg) translateZ(0); } } @-o-keyframes satellite { from { -webkit-transform: rotate(0) translateZ(0); -ms-transform: rotate(0) translateZ(0); -o-transform: rotate(0) translateZ(0); transform: rotate(0) translateZ(0); } to { -webkit-transform: rotate(360deg) translateZ(0); -ms-transform: rotate(360deg) translateZ(0); -o-transform: rotate(360deg) translateZ(0); transform: rotate(360deg) translateZ(0); } } @keyframes satellite { from { -webkit-transform: rotate(0) translateZ(0); -ms-transform: rotate(0) translateZ(0); -o-transform: rotate(0) translateZ(0); transform: rotate(0) translateZ(0); } to { -webkit-transform: rotate(360deg) translateZ(0); -ms-transform: rotate(360deg) translateZ(0); -o-transform: rotate(360deg) translateZ(0); transform: rotate(360deg) translateZ(0); } } [data-loader='circle-scale'] { position: relative; width: 36px; } [data-loader='circle-scale']:before, [data-loader='circle-scale']:after { position: absolute; left: 0; width: 32px; height: 32px; content: ''; -webkit-animation: .75s circle-scale infinite linear alternate; -o-animation: .75s circle-scale infinite linear alternate; animation: .75s circle-scale infinite linear alternate; border: 3px solid #fff; border-radius: 100%; } [data-loader='circle-scale']:before { margin: 2px; -webkit-animation-delay: .35s; -o-animation-delay: .35s; animation-delay: .35s; } [data-loader='circle-scale']:after { width: 36px; height: 36px; } @-webkit-keyframes circle-scale { 0% { -webkit-transform: scale(.2); -ms-transform: scale(.2); -o-transform: scale(.2); transform: scale(.2); } 100% { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } } @-moz-keyframes circle-scale { 0% { -webkit-transform: scale(.2); -ms-transform: scale(.2); -o-transform: scale(.2); transform: scale(.2); } 100% { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } } @-o-keyframes circle-scale { 0% { -webkit-transform: scale(.2); -ms-transform: scale(.2); -o-transform: scale(.2); transform: scale(.2); } 100% { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } } @keyframes circle-scale { 0% { -webkit-transform: scale(.2); -ms-transform: scale(.2); -o-transform: scale(.2); transform: scale(.2); } 100% { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } } [data-loader='ball-fade'] { position: relative; width: 15px; height: 15px; -webkit-animation: 1.2s ball-fade infinite cubic-bezier(.78, .14, .15, .86) .2s; -o-animation: 1.2s ball-fade infinite cubic-bezier(.78, .14, .15, .86) .2s; animation: 1.2s ball-fade infinite cubic-bezier(.78, .14, .15, .86) .2s; border-radius: 100%; background-color: rgba(255, 255, 255, .0); } [data-loader='ball-fade']:before, [data-loader='ball-fade']:after { position: absolute; width: 15px; height: 15px; content: ''; -webkit-animation: 1.2s ball-fade infinite cubic-bezier(.78, .14, .15, .86); -o-animation: 1.2s ball-fade infinite cubic-bezier(.78, .14, .15, .86); animation: 1.2s ball-fade infinite cubic-bezier(.78, .14, .15, .86); border-radius: 100%; background-color: rgba(255, 255, 255, .0); } [data-loader='ball-fade']:before { left: -20px; } [data-loader='ball-fade']:after { right: -20px; -webkit-animation-delay: .4s; -o-animation-delay: .4s; animation-delay: .4s; } @-webkit-keyframes ball-fade { 0% { background-color: rgba(255, 255, 255, 1); } 100% { background-color: rgba(255, 255, 255, 0); } } @-moz-keyframes ball-fade { 0% { background-color: rgba(255, 255, 255, 1); } 100% { background-color: rgba(255, 255, 255, 0); } } @-o-keyframes ball-fade { 0% { background-color: rgba(255, 255, 255, 1); } 100% { background-color: rgba(255, 255, 255, 0); } } @keyframes ball-fade { 0% { background-color: rgba(255, 255, 255, 1); } 100% { background-color: rgba(255, 255, 255, 0); } } [data-loader='spinner'] { width: 25px; height: 25px; -webkit-animation: spinner 1.2s infinite ease-in-out; -o-animation: spinner 1.2s infinite ease-in-out; animation: spinner 1.2s infinite ease-in-out; background-color: #fff; box-shadow: 0 0 10px #fff; } @-webkit-keyframes spinner { 0% { -webkit-transform: perspective(120px) rotateX(0) rotateY(0); -ms-transform: perspective(120px) rotateX(0) rotateY(0); -o-transform: perspective(120px) rotateX(0) rotateY(0); transform: perspective(120px) rotateX(0) rotateY(0); } 50% { -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(0); -ms-transform: perspective(120px) rotateX(-180deg) rotateY(0); -o-transform: perspective(120px) rotateX(-180deg) rotateY(0); transform: perspective(120px) rotateX(-180deg) rotateY(0); } 100% { -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); -ms-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); -o-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); } } @-moz-keyframes spinner { 0% { -webkit-transform: perspective(120px) rotateX(0) rotateY(0); -ms-transform: perspective(120px) rotateX(0) rotateY(0); -o-transform: perspective(120px) rotateX(0) rotateY(0); transform: perspective(120px) rotateX(0) rotateY(0); } 50% { -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(0); -ms-transform: perspective(120px) rotateX(-180deg) rotateY(0); -o-transform: perspective(120px) rotateX(-180deg) rotateY(0); transform: perspective(120px) rotateX(-180deg) rotateY(0); } 100% { -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); -ms-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); -o-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); } } @-o-keyframes spinner { 0% { -webkit-transform: perspective(120px) rotateX(0) rotateY(0); -ms-transform: perspective(120px) rotateX(0) rotateY(0); -o-transform: perspective(120px) rotateX(0) rotateY(0); transform: perspective(120px) rotateX(0) rotateY(0); } 50% { -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(0); -ms-transform: perspective(120px) rotateX(-180deg) rotateY(0); -o-transform: perspective(120px) rotateX(-180deg) rotateY(0); transform: perspective(120px) rotateX(-180deg) rotateY(0); } 100% { -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); -ms-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); -o-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); } } @keyframes spinner { 0% { -webkit-transform: perspective(120px) rotateX(0) rotateY(0); -ms-transform: perspective(120px) rotateX(0) rotateY(0); -o-transform: perspective(120px) rotateX(0) rotateY(0); transform: perspective(120px) rotateX(0) rotateY(0); } 50% { -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(0); -ms-transform: perspective(120px) rotateX(-180deg) rotateY(0); -o-transform: perspective(120px) rotateX(-180deg) rotateY(0); transform: perspective(120px) rotateX(-180deg) rotateY(0); } 100% { -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); -ms-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); -o-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); transform: perspective(120px) rotateX(-180deg) rotateY(-180deg); } } [data-loader='ball-roll'] { position: relative; left: -20px; width: 15px; height: 15px; -webkit-animation: ball-roll 1s linear infinite alternate; -moz-animation: ball-roll 1s linear infinite alternate; animation: ball-roll 1s linear infinite alternate; border-radius: 50%; } @-webkit-keyframes ball-roll { 0% { background-color: rgba(255,255,255, 1); box-shadow: 22px 0 0 0 rgba(255,255,255,.2), 44px 0 0 0 rgba(255,255,255,.2); } 25% { background-color: rgba(255,255,255, .4); box-shadow: 22px 0 0 0 rgba(255,255,255,2), 44px 0 0 0 rgba(255,255,255,.2); } 75% { background-color: rgba(255,255,255, .4); box-shadow: 22px 0 0 0 rgba(255,255,255,.2), 44px 0 0 0 rgba(255,255,255,1); } } @-moz-keyframes ball-roll { 0% { background-color: rgba(255,255,255, 1); box-shadow: 22px 0 0 0 rgba(255,255,255,.2), 44px 0 0 0 rgba(255,255,255,.2); } 25% { background-color: rgba(255,255,255, .4); box-shadow: 22px 0 0 0 rgba(255,255,255,2), 44px 0 0 0 rgba(255,255,255,.2); } 75% { background-color: rgba(255,255,255, .4); box-shadow: 22px 0 0 0 rgba(255,255,255,.2), 44px 0 0 0 rgba(255,255,255,1); } } @-o-keyframes ball-roll { 0% { background-color: rgba(255,255,255, 1); box-shadow: 22px 0 0 0 rgba(255,255,255,.2), 44px 0 0 0 rgba(255,255,255,.2); } 25% { background-color: rgba(255,255,255, .4); box-shadow: 22px 0 0 0 rgba(255,255,255,2), 44px 0 0 0 rgba(255,255,255,.2); } 75% { background-color: rgba(255,255,255, .4); box-shadow: 22px 0 0 0 rgba(255,255,255,.2), 44px 0 0 0 rgba(255,255,255,1); } } @keyframes ball-roll { 0% { background-color: rgba(255,255,255, 1); box-shadow: 22px 0 0 0 rgba(255,255,255,.2), 44px 0 0 0 rgba(255,255,255,.2); } 25% { background-color: rgba(255,255,255, .4); box-shadow: 22px 0 0 0 rgba(255,255,255,2), 44px 0 0 0 rgba(255,255,255,.2); } 75% { background-color: rgba(255,255,255, .4); box-shadow: 22px 0 0 0 rgba(255,255,255,.2), 44px 0 0 0 rgba(255,255,255,1); } } [data-loader='ball-auto'] { width: 8px; height: 8px; animation: ball-auto 2.5s infinite linear; box-shadow: 0 -20px 0 -3px #de5454, 20px 0 0 -3px #1ecaba, 0 20px 0 -3px #ffeb02, -20px 0 0 -3px #2c89e8; } @-webkit-keyframes ball-auto { 0% { transform: rotate(0); } 45% { transform: rotate(360deg); border-radius: 100%; box-shadow: 0 -20px 0 10px #de5454, 20px 0 0 10px #1ecaba, 0 20px 0 10px #decf20, -20px 0 0 10px #2c89e8; } 100% { transform: rotate(720deg); } } @-moz-keyframes ball-auto { 0% { transform: rotate(0); } 45% { transform: rotate(360deg); border-radius: 100%; box-shadow: 0 -20px 0 10px #de5454, 20px 0 0 10px #1ecaba, 0 20px 0 10px #decf20, -20px 0 0 10px #2c89e8; } 100% { transform: rotate(720deg); } } @-o-keyframes ball-auto { 0% { transform: rotate(0); } 45% { transform: rotate(360deg); border-radius: 100%; box-shadow: 0 -20px 0 10px #de5454, 20px 0 0 10px #1ecaba, 0 20px 0 10px #decf20, -20px 0 0 10px #2c89e8; } 100% { transform: rotate(720deg); } } @keyframes ball-auto { 0% { transform: rotate(0); } 45% { transform: rotate(360deg); border-radius: 100%; box-shadow: 0 -20px 0 10px #de5454, 20px 0 0 10px #1ecaba, 0 20px 0 10px #decf20, -20px 0 0 10px #2c89e8; } 100% { transform: rotate(720deg); } } [data-loader='wave'] { width: 3em; height: 2em; animation: wave 1.5s linear infinite; background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em .25em, .5em .25em; } @-webkit-keyframes wave { 25% { background: linear-gradient(#3498db, #3498db) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em 2em, .5em .25em, .5em .25em, .5em .25em, .5em .25em; } 37.5% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#3498db, #3498db) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em 2em, .5em .25em, .5em .25em, .5em .25em; } 50% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#3498db, #3498db) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em 2em, .5em .25em, .5em .25em; } 62.5% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#3498db, #3498db) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em 2em, .5em .25em; } 75% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#3498db, #3498db) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em .25em, .5em 2em; } } @-moz-keyframes wave { 25% { background: linear-gradient(#3498db, #3498db) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em 2em, .5em .25em, .5em .25em, .5em .25em, .5em .25em; } 37.5% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#3498db, #3498db) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em 2em, .5em .25em, .5em .25em, .5em .25em; } 50% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#3498db, #3498db) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em 2em, .5em .25em, .5em .25em; } 62.5% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#3498db, #3498db) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em 2em, .5em .25em; } 75% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#3498db, #3498db) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em .25em, .5em 2em; } } @-o-keyframes wave { 25% { background: linear-gradient(#3498db, #3498db) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em 2em, .5em .25em, .5em .25em, .5em .25em, .5em .25em; } 37.5% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#3498db, #3498db) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em 2em, .5em .25em, .5em .25em, .5em .25em; } 50% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#3498db, #3498db) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em 2em, .5em .25em, .5em .25em; } 62.5% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#3498db, #3498db) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em 2em, .5em .25em; } 75% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#3498db, #3498db) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em .25em, .5em 2em; } } @keyframes wave { 25% { background: linear-gradient(#3498db, #3498db) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em 2em, .5em .25em, .5em .25em, .5em .25em, .5em .25em; } 37.5% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#3498db, #3498db) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em 2em, .5em .25em, .5em .25em, .5em .25em; } 50% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#3498db, #3498db) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em 2em, .5em .25em, .5em .25em; } 62.5% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#3498db, #3498db) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em 2em, .5em .25em; } 75% { background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) .625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#3498db, #3498db) 2.5em 50%; background-repeat: no-repeat; background-size: .5em .25em, .5em .25em, .5em .25em, .5em .25em, .5em 2em; } } [data-loader='spinner-circle'] { width: 25px; height: 25px; animation: .4s infinite linear spinner-circle; border-radius: 50%; box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } @-webkit-keyframes spinner-circle { 12.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, 1), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 25% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, 1); } 37.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, 1), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 50% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, 1), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 62.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, 1), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 75% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, 1), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 87.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, 1), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 100% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, 1), 21px -21px 0 -6px rgba(255, 255, 255, .2); } } @-moz-keyframes spinner-circle { 12.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, 1), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 25% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, 1); } 37.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, 1), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 50% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, 1), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 62.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, 1), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 75% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, 1), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 87.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, 1), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 100% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, 1), 21px -21px 0 -6px rgba(255, 255, 255, .2); } } @-o-keyframes spinner-circle { 12.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, 1), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 25% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, 1); } 37.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, 1), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 50% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, 1), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 62.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, 1), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 75% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, 1), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 87.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, 1), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 100% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, 1), 21px -21px 0 -6px rgba(255, 255, 255, .2); } } @keyframes spinner-circle { 12.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, 1), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 25% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, 1); } 37.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, 1), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 50% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, 1), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 62.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, 1), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 75% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, 1), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 87.5% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, 1), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, .2), 21px -21px 0 -6px rgba(255, 255, 255, .2); } 100% { box-shadow: 30px 0 0 -6px rgba(255, 255, 255, .2), 0 30px 0 -6px rgba(255, 255, 255, .2), -30px 0 0 -6px rgba(255, 255, 255, .2), 0 -30px 0 -6px rgba(255, 255, 255, .2), 21px 21px 0 -6px rgba(255, 255, 255, .2), -21px 21px 0 -6px rgba(255, 255, 255, .2), -21px -21px 0 -6px rgba(255, 255, 255, 1), 21px -21px 0 -6px rgba(255, 255, 255, .2); } } [data-loader='circle-clock'] { width: 1em; height: 1em; -webkit-animation: circle-clock .75s infinite alternate ease-in-out; -o-animation: circle-clock .75s infinite alternate ease-in-out; animation: circle-clock .75s infinite alternate ease-in-out; border-radius: 50%; background: #fff; box-shadow: 1.5em 0 0 0 #fff; } @-webkit-keyframes circle-clock { 0% { -webkit-transform: rotate(-150deg) scale(1); -ms-transform: rotate(-150deg) scale(1); -o-transform: rotate(-150deg) scale(1); transform: rotate(-150deg) scale(1); } 100% { -webkit-transform: rotate(210deg) scale(.35); -ms-transform: rotate(210deg) scale(.35); -o-transform: rotate(210deg) scale(.35); transform: rotate(210deg) scale(.35); background: rgba(255, 255, 255, .3); } } @-moz-keyframes circle-clock { 0% { -webkit-transform: rotate(-150deg) scale(1); -ms-transform: rotate(-150deg) scale(1); -o-transform: rotate(-150deg) scale(1); transform: rotate(-150deg) scale(1); } 100% { -webkit-transform: rotate(210deg) scale(.35); -ms-transform: rotate(210deg) scale(.35); -o-transform: rotate(210deg) scale(.35); transform: rotate(210deg) scale(.35); background: rgba(255, 255, 255, .3); } } @-o-keyframes circle-clock { 0% { -webkit-transform: rotate(-150deg) scale(1); -ms-transform: rotate(-150deg) scale(1); -o-transform: rotate(-150deg) scale(1); transform: rotate(-150deg) scale(1); } 100% { -webkit-transform: rotate(210deg) scale(.35); -ms-transform: rotate(210deg) scale(.35); -o-transform: rotate(210deg) scale(.35); transform: rotate(210deg) scale(.35); background: rgba(255, 255, 255, .3); } } @keyframes circle-clock { 0% { -webkit-transform: rotate(-150deg) scale(1); -ms-transform: rotate(-150deg) scale(1); -o-transform: rotate(-150deg) scale(1); transform: rotate(-150deg) scale(1); } 100% { -webkit-transform: rotate(210deg) scale(.35); -ms-transform: rotate(210deg) scale(.35); -o-transform: rotate(210deg) scale(.35); transform: rotate(210deg) scale(.35); background: rgba(255, 255, 255, .3); } } [data-loader='500px-spinner'] { width: 32px; height: 16px; -webkit-animation: infinity_spinner 2s steps(60) infinite; -o-animation: infinity_spinner 2s steps(60) infinite; animation: infinity_spinner 2s steps(60) infinite; background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAPACAYAAABU1nvrAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpCNjI2N0ZFOThFMjE2ODExODIyQTk2NDZFMjJDMzI5NCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpDNkRDMjIwNEU3RDIxMUUyQUQ0NkM0Mjk2RTM0NjAxRiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpDNkRDMjIwM0U3RDIxMUUyQUQ0NkM0Mjk2RTM0NjAxRiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QjYyNjdGRTk4RTIxNjgxMTgyMkE5NjQ2RTIyQzMyOTQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QjYyNjdGRTk4RTIxNjgxMTgyMkE5NjQ2RTIyQzMyOTQiLz4gPC9yZGY6RGVzY3JpcHRpb24%2BIDwvcmRmOlJERj4gPC94OnhtcG1ldGE%2BIDw%2FeHBhY2tldCBlbmQ9InIiPz6doOLOAAAjTElEQVR42uydCXwV1b3Hb%2B5NgORmNwuBhDWIIAQChDVAAigioBaxrUutvvfUVv1Un7UVfa64a7W2lVrt9qpWqyyK%2BqBhMQECgZCARgiILGYhZA9kM5jt%2Ff7hDD05zF2SO3PGwpnPZz6EuTPnf%2Bac%2F%2FKd%2F5k5x6%2Bzs9Oms4Vgd2IPwN6BvQn7Key6J%2BtsduyhrAz6u5WV0SCe6CdUIAx7Ava%2BOoW2YT%2BBvdKD8Bjscdj9dX47jb2E3cw5FYjFPpCOeRDQiP0ouyt%2Bo9Yahj3Yw%2FUk8Dj2Cr4C1FyJXgjXNhL%2BFfZv2P%2BD2PUBXl5PQg9jr9cqMBp7IHcC9XstE9APeyR2h1BIOyvExoTr%2FV7Dmj2QlWHnfqeyC6kCVPtRQu0Osabmm3cw0xGbUFGbULCN9XGR0E3UNRcLrXyAKkB9H88dpDs%2F5qLp4pmu2Hbu3Dmvtrb2XhIeGxv71MSJE3ewc6hvS11cP5S1hLaV2nX6rclN31HBpdu3b19aXV39bEdHR3%2FsMRUVFQ%2Fxv7u5Xiw7wN%2FWw23jxo13nT59epmO3fdq82f2zW%2BBrk7etGnTCgi%2FU7QIdMEzXBcFuGkFp3itXVA22iKY5ndrquzs7HtaWlpE4d%2FExcXdi%2F7P5o7FujDJYFY2vzX4s375FnsfdpDM6RJmQi2aCbW2to7r5kL9%2FJr69u17LYRv1zFDspZLdczQTzDDZjszuzKhZg7mUgdhj6b%2FDxgwYL3WWna7vRLC52HLYMcO6XhGrQxy7VGCnnRq3cS74gR2gcutsrIyoqioKD4gIODD8ePHnzTSFWsb1XSAC5dqejA6e4wLx%2F5mh2O7iybq7IEwnzbFA4oHFA8oHvCaBxD9%2FDIyMlZ8%2B%2B23PzWSB0gHSDlGCtp7kIXiri0rKyseLPBWW1tbmg4P3I%2F%2B3%2BWLEtKBMRwP8CbUkpeXNw19%2FBbOC9XjAYTk7b6YoT%2FHA0N0YrkNmn6fjvBqCF8M4TvZoUM6jsjhJryf5QGtRjWufDzg41Q3ynA49gQGBk7ihNPWTM2pg3fuXHG9VzyA5g8vKCh4sL29vb%2B%2Fv%2F%2FbdXV1L1533XXtigcUDygeUDygeEA6DzzxxBP2adOmvQYeuN0qHngHPDBTGg%2Bcwpafn59GEIK7Xsps3XAe0PzARQIP2IBfv25tbZ3pAs8qEJKvmjNnTq6vjkiXBxoaGvq5Eo6QvAd3PpkT7hMP8E1SovVbSEhIC8DjS%2BGuT0Lwo6jcZDR7sQv3%2FCUrp82FcOqOI1occMsDBw8eHFxaWnorfg8AFe0KCgpaDSv4xux0vRovUDygeEDxgOIBXR7YunVrQnNz89%2Bl8AAYYEZNTc0i%2FEkB5wh%2BH4XIeK0UHjh27NiA%2Ffv3r3HhRt3lB4zhgZMnTw70JJx4wMj8QDceiI6O%2FhgcUOjirs%2FyAGCkyDQegA4E1NfXL0a%2FT6PhGghuRKV24a5XKR5QPKB4QPGA4gFTeSA7O%2Fv7cMG34DGsGD7%2FlvT09P3SeABh%2BDKE4X9qP1KsR9RbjX8Pms0DXeMFVVVVtXzNINQJoTf3gAd8Gy%2BYPHlyXp8%2Bfd7wSmkM5oFuwWjz5s0%2Fa2lpeRjHovV4AJV8GdDyjKnjBevXr%2B%2BLu7wSAqe1t7dHQymbiAeghKsXLVrUrHhA8YDigfOTB7755ps%2BBQUF4%2BFkgqXzQHFxcdi%2BffveR0HxJSUl9TExMQtSUlIqZfGA%2FciRI7NJOAtCoWjWe1zxwIYNG16H8Ec88EC8G3m67xN%2B3c3btLVdhZiQwh8jHpgyZUqWDoz4%2FD6hX2Zmpj%2F8%2FHHqS75gBJ7ViAMHEQ9Gmp4f2LRp092Igr%2Fztt%2BMzA%2BcdcUZGRl%2FcwchPA%2BgdZboPKL7%2Fj4h%2Bv4%2BxgMRlvIAtqvQ91PwW5SWH1A8oHjAVB7AQ8nimpqaOZGRkXvGjBlTKJUH4GaT8Ei2CxUhQe0JCQm3jRs3bqUsHvCHf7%2BaCe96msFTUjL%2B%2FatOkx%2F2kQfohuoEHgixw94Hdruljo4aqTyAu3cIHq9Van6ABqKFFkiSmR%2Bww81mdzvS2ko8kCSNB%2FLy8gLQh8XUn7zCBAQErETrfCVlvAB3fBfA9FVLeQC8979o4h9%2FF3jgIRy7yDIeyMrK6odjV9J4AfGAlh9Q4wWm8wDI%2BL%2FR7LdByY4lJye%2FEBUV1SiNByB8CZRvlRapgoKC3oaWvyKDB%2Bz0yjbM7wU%2BTMIpheOfatZcVcypiHc7kt2tFmYDdBxRJSujmgvdNiar6xHOH8FlNu5%2BOF87aP1zLJ5r2wkdHiDPN6IHPFAj8AB5xyCKhumCo1mfnp6%2BXRoPoLkHdLMfuz3H0vECqESH4gHFA4oHLigeOKeWeDJq7d%2B%2F%2F9ejR4%2FeC%2FNq43igxWbCJnbBD%2BFkXoBFJKDJay6%2B%2BOLbR4wYUWQmD5w1Cyjhk7CEd0k4S1peVFJScq3QWgksCuppuxYhE2yuX4Qh0BmuxZOzFcCdL4UFPCyeDaU7oVNIMMuu8%2Bl9LeMe7E2rs0RI16dDXTyAZn9RdCKw8z9NmDDhZbN5wA93P6e5uXkzz34gInppeb2U%2FAAez9MER7NBEG46DwwUKpArmwe6xX9ov8oPKB5QPHBh8cA59rtlyxYKuy2443atvy%2B99NIMCJfLA%2FxJ%2Ffr1WwOFW242DzwOS3hHFE4blHOsqTxA%2BQEIedTVeIHT6dxoFg%2FQf%2Fw%2B%2BeSTQ%2BiKRN4hQuPX0Ce%2BCM3H0P9fmTZekJmZmdrY2LiN5wH0%2BSI2yYmU8YJ53ToyIOCfgnBzecB25kNn3uHskj1e4KfyA4oHFA8oHnDHA6gE9LOjHXfeYRkPsC6oRSs8gL7%2FkynjBcQD7kKyhgbjx4%2BfGR8fv9eo8QKveIBPGTB7NjY%2FAIV7XhBOPPAemvwh%2FPsmU55OsMFbuPsqQ%2FMDuPuZcEJb3fFAaWlpIOo5cuDAgQ4z8gNzPfEA7prM7zPFA4oHFA8oHrggeYBqd5pyh7j7Nst5AIr3XF1d3cumdIGXPNCVykVUXDpr1qwSw5RQfH%2FAYwfb7SfggCYlJyeX%2BWqGDjQtRbO1tjPfHvM8sAr7OxBWii4ZYeMmSkGlQ%2FBbRUJCQgE7PkKnydsZB9QyJezH3aAfq3SVf2pq6gw4oUSBBxbzIRmu%2BJGmpqa3EbpnaaAaFRV11GbA%2BwN2b3iA%2Bjs3Nzfd6XT%2BEpX7EHxwd01NTeK6M9s%2F8%2FPzp3OnV7DmbXXBA%2FwW4u8tDzz22GMUpmloJxY8cC%2Bs4QHtbhgPLGJRsMIDD0QqHlA8oHhA8UBP8wN%2BUNAA2L7DUh4gy0AXvJKTk%2FMEvGKbZTyALvkcPHBNWlra15bxALqnir5DMcIM3fIAnNHfccdFjAf41zydbW1tPywuLt4zbNiwCl94wKv8wKeffjoQ3UOffs8WvWFSUtISgElNb%2FMDXvEAnM7xXbt2zUGrvN6tHTs7nQUFBW%2F7wgNe5weIBy6%2F%2FPKfoO%2BfFCoR7Ut%2BwN5THnDjeBQPKB5QPHCe8oDZW0%2FyA%2BZ2QQ%2FyA8YrYS94wDgztLl5fwCCCtAdl5jqiLzhAVdTwaASLf379%2F%2B5L1PBeJ0fAA%2BkoVX%2BKITifidOnHgF7nyWLB64XeQBqjNiyQOW8gCNO8nigT%2FAVG8TY3pMTMyzsnjgNj0emDRp0jbFA4oHFA8oHvj35oF169YdQlRUPOAND7yhxwM7d%2B6cL4sH7tDjgerq6qeys7OvszI%2F4AfzfACVmGVFfoAP5TRqkiM1P8D2roGssLCwHdJ5ADu9bX1jRETEPjaFiOIBxQOKBxQPKB6QzwP47XJLeaCqquppesfQUh6oq6tbRu8W9HigoSc84GJ%2Bwn8ZOX7DOSvcyDOWB0gJaeeP4Zw7QUZ3ecsD%2FuHh4ZtR83KOBwJhFdszMjK84gF256tpAOusGbW10XoIXq13bAgP4PppcGQf0Iyf%2BK1u9OjRtwwdOvS4VB7Iz8%2Bnb5AWDh8%2B%2FDhatVHxgOIBxQOKBxQPXNA88Hs3Axjnrl8AJbwCSsjPOfEN3O7UuXPnFnijhJouCL4iC%2FpyE7174kkJfc4P6PEA%2B%2F1UbGzsDZMmTcozPT%2Fw6aefTsf1ayl48eehFTZCcR9054i6aoTmXoGT%2F%2BZVUkln%2FQI09Q46Rh9K8%2Bfi%2F7VuXHH39YxQ01tQyM9pEhwXd%2B12PSM61tjYOBlO7EFUsgDnroODek0nGLlfz0jxgOIBxQOKBxQPGMADr9O5VvPANijyDWlpaaWW8QA9%2B6MMejU4c8aMGVtxbphpPJCZmTkFLbSWrQhyzgbr2QQFXmYaD6Snp%2B%2BiNZARNXe70I05aEW7qTxAayBfeeWVU3DO%2F9C5gm%2FZh71DGg%2Fk5%2BcHIWougV5NIUUdMmTIXxMTE0ts3sxPSDwAz9fFAy7mMva4wTWTdXxC6sEBieIBxQOKBxQPXGA8EBQUdKPwbbI1PIBY8iXKprGDQZGRkR%2BmpKRkScsP6GxtSUlJ3xs0aFCZKfkB%2Bs3T5YglsablB%2Bg3OkfkAa7yu4cOHfqh6TwAS3BC2BJaEwn970SFytHCiPRbNrDvl83lAbQmVfRjUg8%2BQQFK7lA8oHhA8YDiAct5gFaTtIQH0DpzYU1vUdh3Op3v4IH219J4AIqejJ0W7zrrJ4YPH75w1KhR62TzwFkfERUVNXbq1KkHZPNAV4%2FBzzxOwqXzAH3FDd34ASr%2FlEweCEIZ5Sgja9u2bZss5QG0kuIBxQOKB6znga%2B%2B%2BmpwTk7OQlSc3HbP5yPywAOtl1122aOuToLg5JqamncpfVxbW3sqMTFxnlQeqK%2Bvp7WU%2B7DuCystLZ1uxvuEt9O5dA1%2FHBFzMcq%2BTNChAhk8cBhlT2BfX%2FhzgenowoULE63igU5Q0VJQ0RrD3idEJQbj%2BjXwFRM8lYHKL4eyPmYFD5RCxg814VJ4AGUEY68gUM3Ozl5nKQ8A%2FRQPfPd4oGs%2Bori4uLXCm7Rd8xHhbt%2BFEpax%2BYj4woOgYNcXFxfn93Q%2Boj179kxCQFoIi7HFxMQckMoDEH5jWVnZa6ylvw0ODp4ilQcQMcdy3dwHOnetVB7AzVYJhwZIzQ%2FolN0ulQdQ9mThUJk0HoCyz0fZV%2FDHaFRdSn4AvyWhYkt4U8b1hxctWnSxZTwAU1%2BK6y3hgU5cvxwW9bgVPFACGTdowqWNF6AM4gHo5dYN4sx%2BUnkADNh24fIATD38888%2FfwjdkoDr%2FwA6elkqD6B1l8FUl4pmqK1vqLt%2BAb0RA2fyFjkVIQpG4ZpN5N1sXq5fgDvnW6ZrjWWS7RMP2M5MBXO%2FNzwA5Z4JM93C3yjkpPvEA5T58JYHZs%2BevY3WUhZaMl0qD4hrKdNay7J5QJTVqXhA8YDigQuDB0pKSvrgOTJi9OjRndJ54NChQ4l4GH2d8oLUBeiiXyIU%2F%2BNst3DN5nJ9Q%2Ba3w1G55SEhIbmkcDqn6K5viLu%2FjoQzR5RAayrDYy7vVoEerGdE3xRPQCF5uGYq%2F7huc7GeEfq%2BTM9j0hrL2tCty%2FWMjOCBsWPHvoCy%2FmIT1kymNZal8kBmZuaVTU1Na%2FnuCQoKmiuNB0DE62gtZeFxPU0qD9CLTEJ0HCiVByCrXZCl8gOKBxQPWM8DpnxvSDwwZsyYDRBc61GfzOIBmN3TeOJeKHaBNB6AQibpOCLigXdIluk8gEi3wVWrkyySaWMCTXt%2FYMeOHZcgBA9G6yW7dESyxgvIFUMnPuF5IDg4eKa08QIqk8oW4sY82fmBXEvHC3QrpXhA8YDigfOSB9DE7bRGMs3cKZ0H8Ax4O%2BLGsyg3Uq8LRB4wdLygqKgo5YsvvtjiYrDCtRIaxQP4LcaD8HN4wND8wPDhw0nLV7Mua8C1b7I1k98TomPXGIXP%2BQFXPFBSUkJF72fLFMvngYSEhDxeuOIBxQOKBxQPXHg8AC%2FYSmsk284M13dK44GVK1c6IiIi7oMuLEMZcnmA7B5PwqvR7Ck9UUJD3h%2FYvXt3QmVl5W5X04C4M0Nv3ycUxwO6vU8IEroDfuAq0VGhjHexv48y6P2BkVwOwQ%2F%2Fnzhy5MhXDeEBWMipo0ePvq0dh9VsdTqdN%2FGfehnFA7rrGcH%2BB8XExPwcFf%2B%2FoKCgB2ltZHFNbFc80NP1jm9HyC0XImIXD0D7n4eQ%2FyQggYK644FFigcUDygeUDxgOg%2FADdvRFX1EH2M6D8D%2B%2FdFKFNbvsemMpJvKA%2Bi6IWQJaPYk6TzApg3%2FqDdm6PP3BQjDiRBO74uEC5VsQCXfIoeGMmpM4wGWiAoSumkLbuBGfqpY0%2FIDonBaE5nWRhbmqTWMB%2B5AyK1wFREpd0Cf%2B0HBpPNArzfFA4oHFA%2BcnzzQowcKo%2FMD4eHhD0EX7qPhfqk80FslNIQHfDJDm4%2FvD%2FjsiHzlAS4s8910zlQwpvGAKJzOoXPNyg8oHnjDah64TfGA4gHFA4oHFA8oHlA84E3uz9T8AJrtYSN5wKv5CWFmAyGYlHC2qOmUZfNFCd3yADOhETDD7%2BPfEEF4I9myVTxQBYW7yhIeQGQsQBddnZaW9rVUHqAmx4VP5%2BbmThSFCzzwmKE8gMKacWE%2BFOt9CG6UzgNd3wbb7a24M1P4QPGA4gHFA%2F9%2BPAABKyIiIp6zeXg%2FyBQegLYvQ1%2F%2BGU1ZFRUVRVzQ2hMeIM%2FYKx5g7wi9jQJmaceGDRt2E64LKy8vf8k0HkDrHMLfXfkB0cwiIyMfnj59%2Bm9Q8AwreKAcXZAyZcqUUl8dUY%2FnK6Y1i0JCQiZrwlko7tF8xeSKSXhP8wO1qPUvGxsbp4k2bnZ%2BoBb7bkS51RMnTmy1Ij%2FQF38HQIn8bSZsigcUDygeUDzgNQ%2BwLZ72GTNmrOoND%2FR6vKC0tDSwpKRkEv48%2B9ru1KlTM%2BLi4u41e7xA44HvUX6APuGBF3tWAxzsh6XzwJgxY64ZMmTIMfz5le3M3ONSeaCNkhP494AmXCoPOJ3OuwYPHrzDprNan2H5gZycnEB4rAVcfqABF%2B7E%2F1cvWLDgtOk8gItbhfwArrdTmLUrHlA8oHhA8cCFywNMexOl8wAqdwABqHTatGkU%2FfSWCfHIA7CIg1D0cT7xAMzlz2lpaa%2FxDSWVB%2BADeLVulM4DuIDyRRRGyba%2F9MADxuUH8N9o6EHx2LFjV8TExFR6a3qG5Qc66b3tjo7Iffv2XQ5Q6ad4QPGA4oHzlgfEIOOQygO06prQrKOl8oA4jTM0fjHMaoI0HsjMzPRvamoqw51H84MW6M83cKfPQ5tJeKSpPIBC7oaJ%2FE5sstDQ0N9Cm9%2FUaU1jeQB%2FvEqTlohnodZDdC42hwfmz5%2F%2FYzQ7zwM0Ceoa3kFJ4YH169f3RfOkJiQklCcmJtKqzGT%2FtD7pKTN44JwxgNzc3Hb0e99jx4796MiRI7G9eaFR8YDiAcUD%2F148ID4bqPwA5QfweHaJ1PxAeXl5MZSpP9eXH6OpaToHKjzQTB6w04A0zO5JUbttZ6Z8HUQPqDrCW1lUbCTtRpy4nJyTcE4Q7vhmmPgzEP4DW%2Ffvljtxkw%2FQs6eWH%2Fg9DqygFqQlgYcOHfq6Gz0wlAfEcEx3G2fTXxKGwugJ25nVWWyGByPeErHT%2B6NO5rXk8gBMyAEvlgq3OwsXKx5QPKB44ALgAQj0tzQ%2FgL1cOBYrlQegMBlCZpyW%2FegnjQdoyAZKc9%2BpU6eugLv9bObMmf%2Bw%2FWvJcNN5QPOENAfJkB50nWH5AT4WJDAI8bQRDxwV%2B98nV8xtUcwsL2we8EtNTZ3F3G6MbB74ATT6V6h1vHQegIt9AsIf9VRjU3ggMzNzSVNTkyU80DUfUUxMzMfCFM9tcCIfYX%2BHVur2Yj6iT3SanBzRu9jfhw65np8QTZ%2BGAjJ54Yjl1MQfS%2BEBbJMEHtjECzebB%2BzR0dG5XEBpdzqdK1zxgIv5irvxAJ0jrm0u8AC%2FDfAfO3bsUdT65oqKihkwob1JSUm5nnhg%2B%2FbtAXV1dQ94q7Se%2FAA9FQ%2FkjtFDZpEbHugKyTt37pxfXV39uOi2qQtycnJ%2BqtcKGRkZHyMkL%2BLOfYIqQBOYjRTC7EEWinkeoLVLwvgC8%2FPzp%2Fj8fQF7hWMMVUiohOIBxQPW8QDAdCqtukYvtuDiZpk8sJTxwGDpPABzehh2utyS%2FEB2dvY4uNY9FJpl80CXDoSEhFyCprVzAlrR72ux79XLD3DrF%2FQ2P6CtX%2FABtUDX6gvggqdxcD7dHWp3Pfppkwwe8GPTPHdBaGVlZURYWNjXaN7DOtZhhxW8Js5PJ269CUbxwhNxiTtnQwtkesoPuLn2EVqYi6vAH3v8rrAZ%2BQFxMfRAmfkBxQOKBxQP%2BOvchR0mNg0eK42QXWp%2BAA8nMXv37t2AfhwnnQfIHefl5V0Pu%2F61TB7QPFYoPR3BMVR46me99YyYGeZ5Ibzrprutb8haYLTmgnfs2LG4oaFhAf48gibbZ%2Fp4gcYDfBNhP8Ts3fz8ADM5fqvjhZudH1A8oHhA8YDige8eDzAhnYWFhbHHjx%2B%2F9UzF7bug1atN5wFmZqQLfdevX78KdzBEKg%2BwhKUfwCRs9%2B7dm13xAPbvQYOLDecBLTkRGxt7Cja8yxUPwO5p0eXJpvCA5jXr6%2Bsb9%2BzZMwsn036d6KK95QFvHJHiAcUDigcUDygesJQH7K54wCg77zUPaAdKS0uj9%2B%2Ff%2Fz%2B4myj6LrWuru5F03lAaM5nUeBl2v8dDsceFGJOfkBvsAJ92C1YoSXMzQ9ocrHXkp3n5OTMqKmp%2BZsYNaXmB7KysuLhRt%2FCHaZZwgNpaWmlCxYsmIO%2Be81oHvDXcTpNuppzpq%2FuREyvNvr7AsUDigcUDyge%2BG7zgMwuiHUVkjk4iTl%2B%2FHhCa2vrytTU1DojlZB4INGd8MLCwlFHjx6lxXb74U4qUcjVhr0%2FwFysnx4P2M68ZR0Jj7eA%2FU0uNcbw9wfc8QBdmJ2d%2FbOTJ0%2F%2ByhIeIKeDPn%2FJDB6we8sDtEFx7jT6fULFA4oHFA8oHlA80CMeMFMJPfKAWWboNQ%2FwjojGERobG2%2BDM%2FkrnFC0FB7QXHFubu68ysrK56TzALld7BUNDQ0plvEAcanD4fjQUh5IS0vbCFN73lIeAJ6tBA88onhA8YDiAcUDigcs4wFmJSNtvZ84vfc8YLQr7jEPaAcAJnNOnDjxirTxAo0HWGXiq6qqlonXShkvELrKGh6gP6Kjo59RPKB4QPGA4gHFA4oHLOWBvLy8mZbyQGVl5YNW80CHpTwQGxv7DFvXRuSBP0jjgaKiopgvvviCpg8JEpRwS0hIyA0zZswok8IDbE6z4G4u1s%2BvAQr5Hv49gjsfbyoPbN68eRoqsVaYdFkuD2RlZQ0hb4gImNQTV8wrC9ltkU1nLmIuGLmcr5jWQKa1kGlNZB0%2FcjYYeZyv2AgegCMKPXXqFL0OPoE8rXQegPB2CPyW1kpWPKB4QPHAd54HfFm7lOeBzoiIiOcR%2FVZI5QF6m4bWP4iKinrQ4XA0ggXeRmB6SBoPaK1QUFAwobi4%2BE%2FaQVRmq9PpvMkbJfRnff4txwNkbpd4ywP0R0NDwzXdfmhvn4VjB9Aiq1CZL7n8gD%2FPA%2Bnp6dv9mdmVCTzg8BCauzkiFPYX7HewGT3OKAX8AoT%2B2JUj6jZfMbvbSi%2F15pz5iqdPn16EJp9EayF74wXdzVfsc34A1nAf7nwZrQJkWX6gsLCwD5zUElQiBXsEWYtUHigtLQ2gNZJZWPdTPKB4QPGA4gEpPEDvGPK%2FS%2BUB0aMWFRVBFfp8HhcX1yyFB5gPcbA88VNQrisoPwBr%2BEAYLzCHB5jZJh46dGgUCWc8EELrF2B3ywP%2BHA8E%2BZAfoKY%2BADMLZy3jsIQHmFv%2BCdzy08LMr3J5gNZIRFAiHphKXSE9PwA9cNAayd5Mtqd4QPGA4gHFA%2BcnDzC33S3vbNp4gcgD%2FO%2Fbt2%2B%2FtLm5OR4ykl2NFxjKA7yAzMzM%2B5uamm6Ukh%2FQeIA3X3jGy7zhAcPGC2z%2FWuWJzmmDMyqwbLyAZAFMY4Fod0PzB%2FRqPiJfeABgGgiB83SsRvGA4gHFAxc4D6DPuwUsWmtZKg%2FARFOEFjkujQcQHa9EdFzLKyEUda6pPEBllJWV2fbv30%2BLtNzMn4O7%2F3rhwoXDTOMBrYzDhw%2F%2FF4TfKhYAhf2FqTzAmVq8jvAnEQ9WmcoD2sG4uLiVWsUYD1zPTx1mGg%2Bw%2BEJl2I8ePRoIXYiA48oTZ%2FIxkwcWiy80FhYW%2BikeUDygeODC5oFOweYpEErlAQgUeaBMJg%2FMAA9k8UoIU0w3fLyA86iXsjJOUxmtra2P8cIdDsdh6MsW03mAa24%2BfHfCIrryA4a9T8iED7MJb1aejfUlJVEHDhx4BK46HtbyO8SDl0wZL2A3Eeci0p5mvHBKKg%2Bw1qIyGjyFY23TKhBgM%2FkDB8UDigcUD1xw%2BQExajpk80B%2Fy8YLSOegtLdCb36rOTYo6hTT8wMaD7Ay7KhEan19fTI8ZkZycvK7hnxfYDsz9J%2FoIoraXDx%2FUuXrpfGAIPy4ZtKKB0znAbIy7MQD27Kzs9eJk6TI5oFSeMv7wQPvWckD5LKXw2U%2FZikPOJ3Openp6VJ44DC4cAJb1U%2BT54cKvyiVB9BKi5ubm9eIj2bSeIDWUEaLbOwWCh2OZKk8AAJ6ta6ujkZU%2FWnKaUTRnVJ5AL%2Fn4fHsR7W1teMGDBiQM3To0JJer3eM%2Fp9eUVFBcxR2REZGvjJ16lRtTcwK1lJ621Cm0GdbVCoPYL9YsLYD0nmA%2B51MvFDxgOIBGfkB%2BuCxHF4va9u2bZus5oEixgOrLM0PIAg9imfFpyzjAZzXcdFFF42bPn36Pin5AehCMvarcU6A9owYGho6An92VSBIeB7sZHfHh%2BQTOq7YgXhwM4R7xQMbN26cCyh5hyZbDgwM%2FGDMmDG0JFVQt%2FWO2UZ3fsxTMCIeAIy8IPoMd%2Bsdk6Oqrq5OQBhu5INRj9YzYufGr8NGd6PHAx6cVAL3%2F4oL631C5ty6WZPiAcUDigekjBfA95fDQ26pqqraKL7AIJUHACV7x48ff3lcXFy1ZTwA4XdNnDhxtaaEHtcz0nvEY0%2FTgZxwr9YzIg5AGK5gskL5FnC5npELHjjriLzhAegBObohYWFhn%2BARLkN0RFLyA65csbT8ACuzTrQ2xQOKBxQPKB6wnAdMeZ8QLrrfyZMnF8FRTQELtA4cOPAvo0aN0k2ASuEBmoljwYIFN3rqAp94AFFxEMLxB65C8uzZs1NDQkJaRCU0hAcyMzOn0BrIroQjQG1lwjUdk8cD%2Ffr1ywKGbQULhLpyRKbwAATfQMsSWsYDgnDFA4oHFA8oHvju8sD5N18xHNIvEBVvAgOUJyUlPQt%2FcdLbLvA5P4CouIaWI9aOISB9NG%2FevOXulNDQ%2FAAvvMtLdXToffLZjQfsbsYLqllzVTGnYtMZLwim1%2FQgfIM4WAEWrEd3vMTKqBZih5%2Fmss3igSyE5ZvmzJlz3BtXbPR4wWvz58%2B%2Fq1M%2F%2FXbO4HWP1zNiu83V%2BwO0BqIL4XplBygeUDygeEDxwPnFA752gU888Nlnn4W3trZeM3jw4NKYmJi6niqhT%2B8P0LThgJEP2bNi44gRI%2F5j5MiRR70xQ0N4oKWlZSP3oBpcVla2gF1T6YkHTHl%2FICAg4HP8s1%2FophrBFZPMIMPzA%2BDA36empv5Gx1Hp5gcM5wFA6F1urlc8oHhA8YDiAcUD5vGAr0roEw8YYYa9Hi%2FIyspK9PPzuxmxoDApKWlvbxyRL%2FmByXhEf1kLyYgP96akpGT3xBX3mgfoky3wwG94Hqivr5%2FKzjlsOg9UVFQ8JF7r7%2B%2F%2Fkc31m%2FXm8kB4ePgLIKFPLeEBYPiDtAay4gHFA4oHFA8oHrCEB4xwRL3mAaNcca%2FGC9jHbhSS7QhMT02cOHEHO6dHH7v5wgMPd3R09KfUDKtIt9%2B95QGj1jfsdTmG8AB1gfi74gHFA4oHFA8oHlA8YDoP5Obmzquurr7XEh7Izs6%2BrrKy8lkjeKDH%2BYEtW7bMaWhoeMALf2IOD7S1tV0lWgSxQW95wK6TD4pgmi%2FaOGl6bGho6E5ek%2BPi4u5B%2F2dzx2JdmGQwK5vfGnrFAwUFBcl1dXWjce2baWlphxUPKB7whQf%2BX4ABAGSSMYsxT5XaAAAAAElFTkSuQmCC) center top no-repeat; } @-webkit-keyframes infinity_spinner { from { background-position: center 0; }to { background-position: center -960px; } } @-moz-keyframes infinity_spinner { from { background-position: center 0; }to { background-position: center -960px; } } @-o-keyframes infinity_spinner { from { background-position: center 0; }to { background-position: center -960px; } } @keyframes infinity_spinner { from { background-position: center 0; }to { background-position: center -960px; } } [data-loader='timer'] { position: relative; width: 24px; height: 24px; border: 2px solid #fff; border-radius: 50%; background-color: transparent; } [data-loader='timer']:after, [data-loader='timer']:before { position: absolute; content: ''; background-color: #fff; } [data-loader='timer']:after { top: 11px; left: 11px; width: 10px; height: 2px; -webkit-transform-origin: 1px 1px; -moz-transform-origin: 1px 1px; transform-origin: 1px 1px; -webkit-animation: timerhand 2s linear infinite; -moz-animation: timerhand 2s linear infinite; animation: timerhand 2s linear infinite; } [data-loader='timer']:before { top: 11px; left: 11px; width: 8px; height: 2px; -webkit-transform-origin: 1px 1px; -moz-transform-origin: 1px 1px; transform-origin: 1px 1px; -webkit-animation: timerhand 8s linear infinite; -moz-animation: timerhand 8s linear infinite; animation: timerhand 8s linear infinite; } @-webkit-keyframes timerhand { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @-moz-keyframes timerhand { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @-o-keyframes timerhand { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @keyframes timerhand { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } }