.whirl {position: relative;}.whirl:before {content: "";z-index: 1;position: absolute;top: 0;right: 0;bottom: 0;left: 0;background-color: #999999;opacity: 0.6;}.whirl:after {z-index: 2;content: "";height: 40px;width: 40px;position: absolute;top: 50%;left: 50%;margin: -20px 0 0 -20px;-webkit-transition: all .75s ease 0s;transition: all .75s ease 0s;border-radius: 100%;border-top: 4px solid #555555;-webkit-animation: standard .75s infinite linear;animation: standard .75s infinite linear;-webkit-transform-origin: center;-ms-transform-origin: center;transform-origin: center;}.whirl.no-overlay:before {content: none;display: none;}@-webkit-keyframes standard {from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}@keyframes standard {from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}.whirl.bar.follow:after {-webkit-animation: bar-follow 1s infinite linear;animation: bar-follow 1s infinite linear;}@-webkit-keyframes bar-follow {0% {-webkit-box-shadow: inset 40px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset 40px 0px 0px rgba(0, 0, 0, 0.5);}100% {-webkit-box-shadow: inset -40px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset -40px 0px 0px rgba(0, 0, 0, 0.5);}}@keyframes bar-follow {0% {-webkit-box-shadow: inset 40px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset 40px 0px 0px rgba(0, 0, 0, 0.5);}100% {-webkit-box-shadow: inset -40px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset -40px 0px 0px rgba(0, 0, 0, 0.5);}}.whirl.bar:after {height: 20px;width: 40px;border-radius: 0;border: none;-webkit-animation: bar 1s infinite linear;animation: bar 1s infinite linear;}@-webkit-keyframes bar {from {-webkit-box-shadow: inset 0px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset 0px 0px 0px rgba(0, 0, 0, 0.5);}to {-webkit-box-shadow: inset 80px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset 80px 0px 0px rgba(0, 0, 0, 0.5);}}@keyframes bar {from {-webkit-box-shadow: inset 0px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset 0px 0px 0px rgba(0, 0, 0, 0.5);}to {-webkit-box-shadow: inset 80px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset 80px 0px 0px rgba(0, 0, 0, 0.5);}}.whirl.blade:after {height: 20px;width: 20px;margin: -10px 0 0 10px;border-right: 4px solid transparent;border-top: 4px solid transparent;border-left: 4px solid transparent;border-bottom: 4px solid #e74c3c;opacity: 1;-webkit-transform-origin: left;-ms-transform-origin: left;transform-origin: left;}.whirl.double-up:after {border-right: 4px solid #e74c3c;border-top: 4px double #e74c3c;border-left: 4px double #e74c3c;border-bottom: 4px double #e74c3c;}.whirl.duo:after {border-right: 4px solid #333333;border-left: 4px solid #333333;border-top: 4px solid #f1c40f;border-bottom: 4px solid #f1c40f;}.whirl.helicopter:after {height: 10px;width: 40px;margin: -10px 0 0 -20px;border: none;border-radius: 0;opacity: 1;-webkit-transform-origin: center;-ms-transform-origin: center;transform-origin: center;background-color: #8e44ad;}.whirl.line.back-and-forth.grow:after {-webkit-animation: line-back-and-forth 1s infinite linear, line-back-and-forth-grow 1s infinite linear;animation: line-back-and-forth 1s infinite linear, line-back-and-forth-grow 1s infinite linear;}@-webkit-keyframes line-back-and-forth-grow {0% {-webkit-transform: scaleY(1);transform: scaleY(1);}25% {-webkit-transform: scaleY(2);transform: scaleY(2);}50% {-webkit-transform: scaleY(1);transform: scaleY(1);}75% {-webkit-transform: scaleY(2);transform: scaleY(2);}100% {-webkit-transform: scaleY(1);transform: scaleY(1);}}@keyframes line-back-and-forth-grow {0% {-webkit-transform: scaleY(1);transform: scaleY(1);}25% {-webkit-transform: scaleY(2);transform: scaleY(2);}50% {-webkit-transform: scaleY(1);transform: scaleY(1);}75% {-webkit-transform: scaleY(2);transform: scaleY(2);}100% {-webkit-transform: scaleY(1);transform: scaleY(1);}}.whirl.line.back-and-forth:after {-webkit-animation: line-back-and-forth 1s infinite linear;animation: line-back-and-forth 1s infinite linear;}@-webkit-keyframes line-back-and-forth {0% {width: 10px;}50% {width: 50px;}100% {width: 10px;}}@keyframes line-back-and-forth {0% {width: 10px;}50% {width: 50px;}100% {width: 10px;}}.whirl.line.grow:after {-webkit-animation: line 0.75s infinite linear, line-grow 0.75s infinite linear;animation: line 0.75s infinite linear, line-grow 0.75s infinite linear;}@-webkit-keyframes line-grow {0% {-webkit-transform: scaleY(1);transform: scaleY(1);}50% {-webkit-transform: scaleY(2);transform: scaleY(2);}100% {-webkit-transform: scaleY(1);transform: scaleY(1);}}@keyframes line-grow {0% {-webkit-transform: scaleY(1);transform: scaleY(1);}50% {-webkit-transform: scaleY(2);transform: scaleY(2);}100% {-webkit-transform: scaleY(1);transform: scaleY(1);}}.whirl.line:after {height: 20px;border-radius: 0;border: none;-webkit-box-shadow: inset -10px 0px 0px rgba(0, 0, 0, 0.5);box-shadow: inset -10px 0px 0px rgba(0, 0, 0, 0.5);-webkit-animation: line .75s infinite linear;animation: line .75s infinite linear;}@-webkit-keyframes line {from {width: 10px;}to {width: 50px;}}@keyframes line {from {width: 10px;}to {width: 50px;}}.whirl.ringed:after {border-right: 4px solid #e74c3c;border-top: 4px solid #2ecc71;border-left: 4px solid #2ecc71;border-bottom: 4px solid #2ecc71;opacity: 1;}.whirl.shadow.oval.left:after,.whirl.shadow.oval:after {-webkit-animation: spin-shadow 0.25s infinite linear;animation: spin-shadow 0.25s infinite linear;border: none;border-radius: 40% 100%;}@-webkit-keyframes spin-shadow {0% {-webkit-box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.5);}25% {-webkit-box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.5);}50% {-webkit-box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.5);}100% {-webkit-box-shadow: inset 5px -5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset 5px -5px 5px rgba(0, 0, 0, 0.5);}}@keyframes spin-shadow {0% {-webkit-box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.5);}25% {-webkit-box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.5);}50% {-webkit-box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.5);}100% {-webkit-box-shadow: inset 5px -5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset 5px -5px 5px rgba(0, 0, 0, 0.5);}}.whirl.shadow.oval.right:after {-webkit-animation: spin-shadow 0.25s infinite linear;animation: spin-shadow 0.25s infinite linear;border: none;border-radius: 100% 40%;}@keyframes spin-shadow {0% {-webkit-box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.5);}25% {-webkit-box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.5);}50% {-webkit-box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.5);}100% {-webkit-box-shadow: inset 5px -5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset 5px -5px 5px rgba(0, 0, 0, 0.5);}}.whirl.shadow:after {-webkit-animation: spin-shadow 0.25s infinite linear;animation: spin-shadow 0.25s infinite linear;border-radius: 100%;border: none;}@keyframes spin-shadow {0% {-webkit-box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.5);}25% {-webkit-box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.5);}50% {-webkit-box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.5);}100% {-webkit-box-shadow: inset 5px -5px 5px rgba(0, 0, 0, 0.5);box-shadow: inset 5px -5px 5px rgba(0, 0, 0, 0.5);}}.whirl.sphere.horizontal:after,.whirl.sphere:after {border-radius: 100%;-webkit-animation: sphere .5s infinite;animation: sphere .5s infinite;border: none;height: 40px;}@-webkit-keyframes sphere {from {-webkit-box-shadow: inset 45px 0px 10px rgba(0, 0, 0, 0.5);box-shadow: inset 45px 0px 10px rgba(0, 0, 0, 0.5);}to {-webkit-box-shadow: inset -45px 0px 10px rgba(0, 0, 0, 0.5);box-shadow: inset -45px 0px 10px rgba(0, 0, 0, 0.5);}}@keyframes sphere {from {-webkit-box-shadow: inset 45px 0px 10px rgba(0, 0, 0, 0.5);box-shadow: inset 45px 0px 10px rgba(0, 0, 0, 0.5);}to {-webkit-box-shadow: inset -45px 0px 10px rgba(0, 0, 0, 0.5);box-shadow: inset -45px 0px 10px rgba(0, 0, 0, 0.5);}}.whirl.sphere.vertical:after {border-radius: 100%;-webkit-animation: sphere-v 0.5s infinite;animation: sphere-v 0.5s infinite;border: none;height: 40px;}@-webkit-keyframes sphere-v {from {-webkit-box-shadow: inset 0px 45px 10px rgba(0, 0, 0, 0.5);box-shadow: inset 0px 45px 10px rgba(0, 0, 0, 0.5);}to {-webkit-box-shadow: inset 0px -45px 10px rgba(0, 0, 0, 0.5);box-shadow: inset 0px -45px 10px rgba(0, 0, 0, 0.5);}}@keyframes sphere-v {from {-webkit-box-shadow: inset 0px 45px 10px rgba(0, 0, 0, 0.5);box-shadow: inset 0px 45px 10px rgba(0, 0, 0, 0.5);}to {-webkit-box-shadow: inset 0px -45px 10px rgba(0, 0, 0, 0.5);box-shadow: inset 0px -45px 10px rgba(0, 0, 0, 0.5);}}.whirl.traditional:after {border-right: 4px solid #777777;border-top: 4px solid #777777;border-left: 4px solid #999999;border-bottom: 4px solid #bbbbbb;}