@charset "utf-8";

@media screen and (max-width:767px) {
  .less-768-noshow { display: none; }
}

/* @media screen and (min-width:768px) {
  .phone-animation { min-height: 300px; }
}
@media screen and (min-width:960px) {
  .phone-animation { min-height: 400px; }
}
@media screen and (min-width:1140px) {
  .phone-animation { min-height: 600px; }
} */

.phone-animation {
	margin-left: -200px;
    margin-top: -240px;
	min-height: 700px;
	overflow: hidden;
    position: relative;
}

.phone-animation .background {
  background-image: url("images/background.png");
  background-position: right;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
}

.phone-animation .flash {
  background-image: url("images/flash.png");
  background-position: right;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 9;
}

.phone-animation .background .logo {
  width: 100%;
  height: 100%;
  position: absolute;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 999;
}

.phone-animation .background .logo:nth-child(1) {
  background-image: url("images/logos/Adobe-Analytics.png");
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.phone-animation .background .logo:nth-child(2) {
  background-image: url("images/logos/Facebook-Pixel.png");
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.phone-animation .background .logo:nth-child(3) {
  background-image: url("images/logos/Google-Adwords.png");
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.phone-animation .background .logo:nth-child(4) {
  background-image: url("images/logos/Google-Analytics.png");
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.phone-animation .background .logo:nth-child(5) {
  background-image: url("images/logos/Mixpanel.png");
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.phone-animation .background .logo:nth-child(6) {
  background-image: url("images/logos/Tealeaf.png");
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}


.phone-animation.animate .logo:nth-child(1) {
  -webkit-animation: logoMove 2.6s forwards;
     -moz-animation: logoMove 2.6s forwards;
       -o-animation: logoMove 2.6s forwards;
          animation: logoMove 2.6s forwards;
}
.phone-animation.animate .logo:nth-child(2) {
  -webkit-animation: logoMove 2.6s forwards 2.7s;
     -moz-animation: logoMove 2.6s forwards 2.7s;
       -o-animation: logoMove 2.6s forwards 2.7s;
          animation: logoMove 2.6s forwards 2.7s;
}
.phone-animation.animate .logo:nth-child(3) {
  -webkit-animation: logoMove 2.6s forwards 5.2s;
     -moz-animation: logoMove 2.6s forwards 5.2s;
       -o-animation: logoMove 2.6s forwards 5.2s;
          animation: logoMove 2.6s forwards 5.2s;
}
.phone-animation.animate .logo:nth-child(4) {
  -webkit-animation: logoMove 2.6s forwards 7.7s;
     -moz-animation: logoMove 2.6s forwards 7.7s;
       -o-animation: logoMove 2.6s forwards 7.7s;
          animation: logoMove 2.6s forwards 7.7s;
}
.phone-animation.animate .logo:nth-child(5) {
  -webkit-animation: logoMove 2.6s forwards 10.2s;
     -moz-animation: logoMove 2.6s forwards 10.2s;
       -o-animation: logoMove 2.6s forwards 10.2s;
          animation: logoMove 2.6s forwards 10.2s;
}
.phone-animation.animate .logo:nth-child(6) {
  -webkit-animation: logoMove 2.6s forwards 12.2s;
     -moz-animation: logoMove 2.6s forwards 12.2s;
       -o-animation: logoMove 2.6s forwards 12.2s;
          animation: logoMove 2.6s forwards 12.2s;
}

.phone-animation.animate .flash {
  -webkit-animation: flash 1.3s forwards 1.5s,
             flash 1.3s forwards 4.1s,
             flash 1.3s forwards 6.8s,
             flash 1.3s forwards 9.2s,
             flash 1.3s forwards 11.9s;
     -moz-animation: flash 1.3s forwards 1.5s,
             flash 1.3s forwards 4.1s,
             flash 1.3s forwards 6.8s,
             flash 1.3s forwards 9.2s,
             flash 1.3s forwards 11.9s;
       -o-animation: flash 1.3s forwards 1.5s,
             flash 1.3s forwards 4.1s,
             flash 1.3s forwards 6.8s,
             flash 1.3s forwards 9.2s,
             flash 1.3s forwards 11.9s;
          animation: flash 1.3s forwards 1.5s,
             flash 1.3s forwards 4.1s,
             flash 1.3s forwards 6.8s,
             flash 1.3s forwards 9.2s,
             flash 1.3s forwards 11.9s;
}
@-webkit-keyframes flash {
  0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
  50% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  70% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  100% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
}
@-moz-keyframes flash {
  0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
  50% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  70% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  100% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
}
@-o-keyframes flash {
  0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
  50% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  70% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  100% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
}
@keyframes flash {
  0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
  50% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  70% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  100% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
}

@-webkit-keyframes logoMove {
  0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; left: 0%; }
  20% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  35% { left: 0%;  -webkit-transform: rotateY(0deg) skewY(0deg);  transform: rotateY(0deg) skewY(0deg); }
  60% { left: 38%; }
  70% { -webkit-transform: rotateY(40deg) skewY(-3deg); transform: rotateY(40deg) skewY(-3deg); }
  80% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  100% { left: 38%; -webkit-transform: rotateY(40deg) skewY(-3deg); transform: rotateY(40deg) skewY(-3deg); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
}

@-moz-keyframes logoMove {
  0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; left: 0%; }
  20% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  35% { left: 0%;  -moz-transform: rotateY(0deg) skewY(0deg);  transform: rotateY(0deg) skewY(0deg); }
  60% { left: 38%; }
  70% { -moz-transform: rotateY(40deg) skewY(-3deg); transform: rotateY(40deg) skewY(-3deg); }
  80% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  100% { left: 38%; -moz-transform: rotateY(40deg) skewY(-3deg); transform: rotateY(40deg) skewY(-3deg); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
}

@-o-keyframes logoMove {
  0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; left: 0%; }
  20% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  35% { left: 0%;  transform: rotateY(0deg) skewY(0deg); }
  60% { left: 38%; }
  70% { transform: rotateY(40deg) skewY(-3deg); }
  80% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  100% { left: 38%; transform: rotateY(40deg) skewY(-3deg); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
}

@keyframes logoMove {
  0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; left: 0%; }
  20% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  35% { left: 0%;  -webkit-transform: rotateY(0deg) skewY(0deg);  -moz-transform: rotateY(0deg) skewY(0deg);  transform: rotateY(0deg) skewY(0deg); }
  60% { left: 38%; }
  70% { -webkit-transform: rotateY(40deg) skewY(-3deg); -moz-transform: rotateY(40deg) skewY(-3deg); transform: rotateY(40deg) skewY(-3deg); }
  80% { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
  100% { left: 38%; -webkit-transform: rotateY(40deg) skewY(-3deg); -moz-transform: rotateY(40deg) skewY(-3deg); transform: rotateY(40deg) skewY(-3deg); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }
}
/* Animation2 css*/

.animation.mobile-lifecycle {
    position: relative;
    margin-top: 20px;
    padding: 0 10px
}

.animation.mobile-lifecycle .anim-layout-container {
    position: relative
}

@media only screen and (max-width:680px) {
    .animation.mobile-lifecycle .anim-layout-container {
        min-width: 680px;
        -webkit-transform: translateX(-20%);
        -ms-transform: translateX(-20%);
        -o-transform: translateX(-20%);
        -moz-transform: translateX(-20%);
             transform: translateX(-20%)
    }
    .animation.mobile-lifecycle .anim-layout-container .icon-hand {
        width: 15px;
        height: auto
    }
    .animation.mobile-lifecycle .anim-layout-container .icon-dot {
        width: 25px;
        height: auto
    }
}


.animation.mobile-lifecycle .anim-layout-container .layer-background {
    position: relative;
    max-width: 100%;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
         transform: translateX(-50%)
}

.animation.mobile-lifecycle .anim-layout-container .layer-circle {
    position: absolute;
    max-height: 87%;
    left: 63%;
    top: 6%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
         transform: translateX(-50%)
}

.animation.mobile-lifecycle .anim-layout-container .layer-circle-dot {
    position: absolute;
    max-height: 87%;
    left: 63%;
    top: 6%;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transform: translateX(-50%) rotate(0);
    -ms-transform: translateX(-50%) rotate(0);
    -o-transform: translateX(-50%) rotate(0);
    -moz-transform: translateX(-50%) rotate(0);
         transform: translateX(-50%) rotate(0)
}

.animation.mobile-lifecycle .anim-layout-container .layer-top {
    position: absolute;
    max-width: 100%;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
         transform: translateX(-50%)
}

/* .animation.mobile-lifecycle .anim-layout-container .icon-hand {
    display: block;
    position: absolute;
    top: 85%;
    left: 50%;
    opacity: 0;
    -webkit-transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s;
    -o-transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s;
    transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s
} */

.animation.mobile-lifecycle .anim-layout-container .icon-dot {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    display: block;
    position: absolute;

}

.animation.mobile-lifecycle.animate .layer-circle-dot {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transition: opacity .5s linear 1s;
    -o-transition: opacity .5s linear 1s;
    -moz-transition: opacity .5s linear 1s;
    transition: opacity .5s linear 1s;
    -webkit-animation: rotate 8s infinite linear 1s;
    -o-animation: rotate 8s infinite linear 1s;
    -moz-animation: rotate 8s infinite linear 1s;
         animation: rotate 8s infinite linear 1s
}



.animation.mobile-lifecycle .anim-layout-container .layer-circle {
    position: absolute;
    max-height: 87%;
    left: 63%;
    top: 6%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
         transform: translateX(-50%)
}

.animation.mobile-lifecycle .anim-layout-container .layer-circle-dot {
    position: absolute;
    max-height: 87%;
    left: 63%;
    top: 6%;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transform: translateX(-50%) rotate(0);
    -ms-transform: translateX(-50%) rotate(0);
    -o-transform: translateX(-50%) rotate(0);
    -moz-transform: translateX(-50%) rotate(0);
         transform: translateX(-50%) rotate(0)
}

.animation.mobile-lifecycle .anim-layout-container .layer-top {
    position: absolute;
    max-width: 100%;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
         transform: translateX(-50%)
}

.animation.mobile-lifecycle .anim-layout-container .icon-hand {
    display: block;
    position: absolute;
    top: 85%;
    left: 50%;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s;
    -o-transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s;
    -moz-transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s;
    transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s

}

/* .animation.mobile-lifecycle .anim-layout-container .icon-dot {
    opacity: 0;
    top: 43%;
    left: 22.2%;
    display: block;
    position: absolute;
    -webkit-transition: opacity .25s linear .75s;
    -o-transition: opacity .25s linear .75s;
    transition: opacity .25s linear .75s
} */

.animation.mobile-lifecycle.animate .layer-circle-dot {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transition: opacity .5s linear 1s;
    -o-transition: opacity .5s linear 1s;
    -moz-transition: opacity .5s linear 1s;
    transition: opacity .5s linear 1s;
    -webkit-animation: rotate 8s infinite linear 1s;
    -o-animation: rotate 8s infinite linear 1s;
    -moz-animation: rotate 8s infinite linear 1s;
         animation: rotate 8s infinite linear 1s
}

.animation.mobile-lifecycle.animate .icon-hand {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    top: 32%;
    left: 23.3%;
    -webkit-animation: moveHand 3s linear forwards 1s;
    -o-animation: moveHand 3s linear forwards 1s;
    -moz-animation: moveHand 3s linear forwards 1s;
         animation: moveHand 3s linear forwards 1s;
}

.animation.mobile-lifecycle.animate .icon-dot {
    -webkit-animation: moveDot 3s linear forwards 0.8s;
    -o-animation: moveDot 3s linear forwards 0.8s;
    -moz-animation: moveDot 3s linear forwards 0.8s;
         animation: moveDot 3s linear forwards 0.8s;

}

.animation.third-party-tech {
    position: relative;
    margin-top: -60px;
    padding: 0 30px
}

@media only screen and (max-width:768px) {
    .animation.third-party-tech {
        margin-top: 0
    }
}

.animation.third-party-tech .anim-layout-container {
    position: relative
}


.animation.mobile-lifecycle .anim-layout-container .layer-circle {
    position: absolute;
    max-height: 87%;
    left: 63%;
    top: 6%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
         transform: translateX(-50%)
}

.animation.mobile-lifecycle .anim-layout-container .layer-circle-dot {
    position: absolute;
    max-height: 87%;
    left: 63%;
    top: 6%;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transform: translateX(-50%) rotate(0);
    -ms-transform: translateX(-50%) rotate(0);
    -o-transform: translateX(-50%) rotate(0);
    -moz-transform: translateX(-50%) rotate(0);
         transform: translateX(-50%) rotate(0)
}

.animation.mobile-lifecycle .anim-layout-container .layer-top {
    position: absolute;
    max-width: 100%;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
         transform: translateX(-50%)
}

/* .animation.mobile-lifecycle .anim-layout-container .icon-hand {
    display: block;
    position: absolute;
    top: 85%;
    left: 50%;
    opacity: 0;
    -webkit-transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s;
    -o-transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s;
    transition: opacity .5s linear, top .5s linear .25s, left .5s linear .25s
} */

/* .animation.mobile-lifecycle .anim-layout-container .icon-dot {
    opacity: 0;
    top: 43%;
    left: 22.2%;
    display: block;
    position: absolute;
    -webkit-transition: opacity .25s linear .75s;
    -o-transition: opacity .25s linear .75s;
    transition: opacity .25s linear .75s
} */

.animation.mobile-lifecycle.animate .layer-circle-dot {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transition: opacity .5s linear 1s;
    -o-transition: opacity .5s linear 1s;
    -moz-transition: opacity .5s linear 1s;
    transition: opacity .5s linear 1s;
    -webkit-animation: rotate 8s infinite linear 1s;
    -o-animation: rotate 8s infinite linear 1s;
    -moz-animation: rotate 8s infinite linear 1s;
         animation: rotate 8s infinite linear 1s
}




.animation.third-party-tech {
    position: relative;
    margin-top: -60px;
    padding: 0 30px
}

@media only screen and (max-width:768px) {
    .animation.third-party-tech {
        margin-top: 0
    }
}

.animation.third-party-tech .anim-layout-container {
    position: relative
}


/* .animation.mobile-lifecycle.animate .icon-hand {
    opacity: 1;
    top: 46%;
    left: 23.3%
} */


.mobile-lifecycle { max-width: 980px; margin: auto;}




@-o-keyframes moveHand {
  0% { top: 32%; left: 23.3%;}
  100% { top: 32%; left: 23.3%; }
}
@-moz-keyframes moveHand {
  0% { top: 32%; left: 23.3%;}
  100% { top: 32%; left: 23.3%; }
}
@keyframes moveHand {
  0% { top: 32%; left: 23.3%;}
  100% { top: 32%; left: 23.3%; }
}
@-webkit-keyframes moveHand {
  0% { top: 32%; left: 23.3%;}
  100% { top: 32%; left: 23.3%; }
}

@-o-keyframes  moveDot {
  0% { top: 28%; left: 22.2%; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}
  3% { top: 28%; left: 22.2%; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
  100% { top: 28%; left: 22.2%; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
}
@-moz-keyframes  moveDot {
  0% { top: 28%; left: 22.2%; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}
  3% { top: 28%; left: 22.2%; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
  100% { top: 28%; left: 22.2%; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
}
@keyframes  moveDot {
  0% { top: 28%; left: 22.2%; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}
  3% { top: 28%; left: 22.2%; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
  100% { top: 28%; left: 22.2%; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
}
@-webkit-keyframes moveDot {
  0% { top: 28%; left: 22.2%; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}
  3% { top: 28%; left: 22.2%; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
  100% { top: 28%; left: 22.2%; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
}



@-webkit-keyframes rotate {
    from {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    to {
        -webkit-transform: translateX(-50%) rotate(360deg);
        transform: translateX(-50%) rotate(360deg)
    }
}

@-o-keyframes rotate {
    from {
        -o-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    to {
        -o-transform: translateX(-50%) rotate(360deg);
        transform: translateX(-50%) rotate(360deg)
    }
}

@-moz-keyframes rotate {
    from {
        -webkit-transform: translateX(-50%) rotate(0);
        -o-transform: translateX(-50%) rotate(0);
        -moz-transform: translateX(-50%) rotate(0);
             transform: translateX(-50%) rotate(0)
    }
    to {
        -webkit-transform: translateX(-50%) rotate(360deg);
        -o-transform: translateX(-50%) rotate(360deg);
        -moz-transform: translateX(-50%) rotate(360deg);
             transform: translateX(-50%) rotate(360deg)
    }
}

@keyframes rotate {
    from {
        -webkit-transform: translateX(-50%) rotate(0);
        -o-transform: translateX(-50%) rotate(0);
        -moz-transform: translateX(-50%) rotate(0);
             transform: translateX(-50%) rotate(0)
    }
    to {
        -webkit-transform: translateX(-50%) rotate(360deg);
        -o-transform: translateX(-50%) rotate(360deg);
        -moz-transform: translateX(-50%) rotate(360deg);
             transform: translateX(-50%) rotate(360deg)
    }
}

/* CSS Document */