/* Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library
  By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets */
/****************************************/
.circle-animation {
  position: relative; }
  .circle-animation .outer-circle, .circle-animation .inner-circle {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0; }
  .circle-animation .outer-circle {
    -webkit-animation: expanding-circle-outer 3s 0s infinite ease-out;
    -khtml-animation: expanding-circle-outer 3s 0s infinite ease-out;
    -moz-animation: expanding-circle-outer 3s 0s infinite ease-out;
    -ms-animation: expanding-circle-outer 3s 0s infinite ease-out;
    -o-animation: expanding-circle-outer 3s 0s infinite ease-out;
    animation: expanding-circle-outer 3s 0s infinite ease-out;
    background-color: #428bca; }
  .circle-animation .inner-circle {
    -webkit-animation: expanding-circle-inner 3s 0s infinite ease-out;
    -khtml-animation: expanding-circle-inner 3s 0s infinite ease-out;
    -moz-animation: expanding-circle-inner 3s 0s infinite ease-out;
    -ms-animation: expanding-circle-inner 3s 0s infinite ease-out;
    -o-animation: expanding-circle-inner 3s 0s infinite ease-out;
    animation: expanding-circle-inner 3s 0s infinite ease-out;
    background-color: #fff;
    width: 36px;
    height: 36px; }

@-webkit-keyframes expanding-circle-position {
  0% {
    top: -20px;
    left: -20px; }
  40% {
    top: -40px;
    left: -40px; }
  100% {
    top: -40px;
    left: -40px; } }
@-moz-keyframes expanding-circle-position {
  0% {
    top: -20px;
    left: -20px; }
  40% {
    top: -40px;
    left: -40px; }
  100% {
    top: -40px;
    left: -40px; } }
@-o-keyframes expanding-circle-position {
  0% {
    top: -20px;
    left: -20px; }
  40% {
    top: -40px;
    left: -40px; }
  100% {
    top: -40px;
    left: -40px; } }
@keyframes expanding-circle-position {
  0% {
    top: -20px;
    left: -20px; }
  40% {
    top: -40px;
    left: -40px; }
  100% {
    top: -40px;
    left: -40px; } }
@-webkit-keyframes expanding-circle-outer {
  0% {
    opacity: 1;
    width: 40px;
    height: 40px;
    -webkit-transform: translate(-4px, -2px);
    -khtml-transform: translate(-4px, -2px);
    -moz-transform: translate(-4px, -2px);
    -ms-transform: translate(-4px, -2px);
    -o-transform: translate(-4px, -2px);
    transform: translate(-4px, -2px); }
  40% {
    opacity: 0;
    width: 80px;
    height: 80px;
    -webkit-transform: translate(-24px, -22px);
    -khtml-transform: translate(-24px, -22px);
    -moz-transform: translate(-24px, -22px);
    -ms-transform: translate(-24px, -22px);
    -o-transform: translate(-24px, -22px);
    transform: translate(-24px, -22px); }
  100% {
    opacity: 0;
    width: 80px;
    height: 80px;
    -webkit-transform: translate(-24px, -22px);
    -khtml-transform: translate(-24px, -22px);
    -moz-transform: translate(-24px, -22px);
    -ms-transform: translate(-24px, -22px);
    -o-transform: translate(-24px, -22px);
    transform: translate(-24px, -22px); } }
@-moz-keyframes expanding-circle-outer {
  0% {
    opacity: 1;
    width: 40px;
    height: 40px;
    -webkit-transform: translate(-4px, -2px);
    -khtml-transform: translate(-4px, -2px);
    -moz-transform: translate(-4px, -2px);
    -ms-transform: translate(-4px, -2px);
    -o-transform: translate(-4px, -2px);
    transform: translate(-4px, -2px); }
  40% {
    opacity: 0;
    width: 80px;
    height: 80px;
    -webkit-transform: translate(-24px, -22px);
    -khtml-transform: translate(-24px, -22px);
    -moz-transform: translate(-24px, -22px);
    -ms-transform: translate(-24px, -22px);
    -o-transform: translate(-24px, -22px);
    transform: translate(-24px, -22px); }
  100% {
    opacity: 0;
    width: 80px;
    height: 80px;
    -webkit-transform: translate(-24px, -22px);
    -khtml-transform: translate(-24px, -22px);
    -moz-transform: translate(-24px, -22px);
    -ms-transform: translate(-24px, -22px);
    -o-transform: translate(-24px, -22px);
    transform: translate(-24px, -22px); } }
@-o-keyframes expanding-circle-outer {
  0% {
    opacity: 1;
    width: 40px;
    height: 40px;
    -webkit-transform: translate(-4px, -2px);
    -khtml-transform: translate(-4px, -2px);
    -moz-transform: translate(-4px, -2px);
    -ms-transform: translate(-4px, -2px);
    -o-transform: translate(-4px, -2px);
    transform: translate(-4px, -2px); }
  40% {
    opacity: 0;
    width: 80px;
    height: 80px;
    -webkit-transform: translate(-24px, -22px);
    -khtml-transform: translate(-24px, -22px);
    -moz-transform: translate(-24px, -22px);
    -ms-transform: translate(-24px, -22px);
    -o-transform: translate(-24px, -22px);
    transform: translate(-24px, -22px); }
  100% {
    opacity: 0;
    width: 80px;
    height: 80px;
    -webkit-transform: translate(-24px, -22px);
    -khtml-transform: translate(-24px, -22px);
    -moz-transform: translate(-24px, -22px);
    -ms-transform: translate(-24px, -22px);
    -o-transform: translate(-24px, -22px);
    transform: translate(-24px, -22px); } }
@keyframes expanding-circle-outer {
  0% {
    opacity: 1;
    width: 40px;
    height: 40px;
    -webkit-transform: translate(-4px, -2px);
    -khtml-transform: translate(-4px, -2px);
    -moz-transform: translate(-4px, -2px);
    -ms-transform: translate(-4px, -2px);
    -o-transform: translate(-4px, -2px);
    transform: translate(-4px, -2px); }
  40% {
    opacity: 0;
    width: 80px;
    height: 80px;
    -webkit-transform: translate(-24px, -22px);
    -khtml-transform: translate(-24px, -22px);
    -moz-transform: translate(-24px, -22px);
    -ms-transform: translate(-24px, -22px);
    -o-transform: translate(-24px, -22px);
    transform: translate(-24px, -22px); }
  100% {
    opacity: 0;
    width: 80px;
    height: 80px;
    -webkit-transform: translate(-24px, -22px);
    -khtml-transform: translate(-24px, -22px);
    -moz-transform: translate(-24px, -22px);
    -ms-transform: translate(-24px, -22px);
    -o-transform: translate(-24px, -22px);
    transform: translate(-24px, -22px); } }
@-webkit-keyframes expanding-circle-inner {
  0% {
    opacity: 1;
    width: 36px;
    height: 36px;
    -webkit-transform: translate(-2px, 0px);
    -khtml-transform: translate(-2px, 0px);
    -moz-transform: translate(-2px, 0px);
    -ms-transform: translate(-2px, 0px);
    -o-transform: translate(-2px, 0px);
    transform: translate(-2px, 0px); }
  40% {
    opacity: 0;
    width: 76px;
    height: 76px;
    -webkit-transform: translate(-22px, -20px);
    -khtml-transform: translate(-22px, -20px);
    -moz-transform: translate(-22px, -20px);
    -ms-transform: translate(-22px, -20px);
    -o-transform: translate(-22px, -20px);
    transform: translate(-22px, -20px); }
  100% {
    opacity: 0;
    width: 76px;
    height: 76px;
    -webkit-transform: translate(-22px, -20px);
    -khtml-transform: translate(-22px, -20px);
    -moz-transform: translate(-22px, -20px);
    -ms-transform: translate(-22px, -20px);
    -o-transform: translate(-22px, -20px);
    transform: translate(-22px, -20px); } }
@-moz-keyframes expanding-circle-inner {
  0% {
    opacity: 1;
    width: 36px;
    height: 36px;
    -webkit-transform: translate(-2px, 0px);
    -khtml-transform: translate(-2px, 0px);
    -moz-transform: translate(-2px, 0px);
    -ms-transform: translate(-2px, 0px);
    -o-transform: translate(-2px, 0px);
    transform: translate(-2px, 0px); }
  40% {
    opacity: 0;
    width: 76px;
    height: 76px;
    -webkit-transform: translate(-22px, -20px);
    -khtml-transform: translate(-22px, -20px);
    -moz-transform: translate(-22px, -20px);
    -ms-transform: translate(-22px, -20px);
    -o-transform: translate(-22px, -20px);
    transform: translate(-22px, -20px); }
  100% {
    opacity: 0;
    width: 76px;
    height: 76px;
    -webkit-transform: translate(-22px, -20px);
    -khtml-transform: translate(-22px, -20px);
    -moz-transform: translate(-22px, -20px);
    -ms-transform: translate(-22px, -20px);
    -o-transform: translate(-22px, -20px);
    transform: translate(-22px, -20px); } }
@-o-keyframes expanding-circle-inner {
  0% {
    opacity: 1;
    width: 36px;
    height: 36px;
    -webkit-transform: translate(-2px, 0px);
    -khtml-transform: translate(-2px, 0px);
    -moz-transform: translate(-2px, 0px);
    -ms-transform: translate(-2px, 0px);
    -o-transform: translate(-2px, 0px);
    transform: translate(-2px, 0px); }
  40% {
    opacity: 0;
    width: 76px;
    height: 76px;
    -webkit-transform: translate(-22px, -20px);
    -khtml-transform: translate(-22px, -20px);
    -moz-transform: translate(-22px, -20px);
    -ms-transform: translate(-22px, -20px);
    -o-transform: translate(-22px, -20px);
    transform: translate(-22px, -20px); }
  100% {
    opacity: 0;
    width: 76px;
    height: 76px;
    -webkit-transform: translate(-22px, -20px);
    -khtml-transform: translate(-22px, -20px);
    -moz-transform: translate(-22px, -20px);
    -ms-transform: translate(-22px, -20px);
    -o-transform: translate(-22px, -20px);
    transform: translate(-22px, -20px); } }
@keyframes expanding-circle-inner {
  0% {
    opacity: 1;
    width: 36px;
    height: 36px;
    -webkit-transform: translate(-2px, 0px);
    -khtml-transform: translate(-2px, 0px);
    -moz-transform: translate(-2px, 0px);
    -ms-transform: translate(-2px, 0px);
    -o-transform: translate(-2px, 0px);
    transform: translate(-2px, 0px); }
  40% {
    opacity: 0;
    width: 76px;
    height: 76px;
    -webkit-transform: translate(-22px, -20px);
    -khtml-transform: translate(-22px, -20px);
    -moz-transform: translate(-22px, -20px);
    -ms-transform: translate(-22px, -20px);
    -o-transform: translate(-22px, -20px);
    transform: translate(-22px, -20px); }
  100% {
    opacity: 0;
    width: 76px;
    height: 76px;
    -webkit-transform: translate(-22px, -20px);
    -khtml-transform: translate(-22px, -20px);
    -moz-transform: translate(-22px, -20px);
    -ms-transform: translate(-22px, -20px);
    -o-transform: translate(-22px, -20px);
    transform: translate(-22px, -20px); } }

/*# sourceMappingURL=circle-animation.css.map */