@charset "UTF-8";

/* SYSTEMS ICON ANIMATE */
.image-systems {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -60px;
}

.spinner-systems {
    -webkit-animation:spin 10s linear infinite;
    -moz-animation:spin 10s linear infinite;
    animation:spin 10s linear infinite;
    transform-origin: 81px 77px;
}

.spinner-2-systems {
    -webkit-animation:spinny 10.06s linear infinite;
    -moz-animation:spinny 10.06s linear infinite;
    animation:spinny 10s linear infinite;
    transform-origin: 41px 40px;
}



/* VIRTUAL ICON ANIMATE */
.image-virtual {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -60px;
}

.spinner-virtual {
    -webkit-animation:spin 10s linear infinite;
    -moz-animation:spin 10s linear infinite;
    animation:spin 10s linear infinite;
    transform-origin: 51px 56px;
}

@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

@-moz-keyframes spinny { 100% { -moz-transform: rotate(-360deg); } }
@-webkit-keyframes spinny { 100% { -webkit-transform: rotate(-360deg); } }
@keyframes spinny { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }



/* MAGNIFY ANIMATE */
.magnify-wave {
    -webkit-animation: waver infinite 8s ease-in-out;
    -moz-animation: waver infinite 8s ease-in-out;
    animation: waver infinite 8s ease-in-out;
    animation-fill-mode: forwards;
    transform-origin: left bottom;
}

@-webkit-keyframes waver {
  0% {transform: rotate(4deg);}
  50% {transform: rotate(-4deg);}
  100% {transform: rotate(4deg);}
}
@keyframes waver {
  0% {transform: rotate(4deg);}
  50% {transform: rotate(-4deg);}
  100% {transform: rotate(4deg);}
}



/* SUBWAY ANIMATE */
.speed-lines {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: speed 1s linear infinite;
    animation-delay: 100ms;
}

.speed-lines-2 {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: speed 1s linear infinite;
    animation-delay: 300ms;
}

.speed-lines-3 {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: speed 1s linear infinite;
    animation-delay: 800ms;
}

@keyframes speed {
    to {stroke-dashoffset: 0;}
}



/* TROPHY ANIMATE */
.shine-lines {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: shine 5s ease-in-out infinite;
    animation-delay: 100ms;
    animation-direction: reverse;
}

.shine-lines-2 {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: shine 5s ease-in-out infinite;
    animation-delay: 200ms;
    animation-direction: reverse;
}

.shine-lines-3 {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: shine 5s ease-in-out infinite;
    animation-delay: 300ms;
    animation-direction: reverse;
}

.shine-lines-4 {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: shine 5s ease-in-out infinite;
    animation-delay: 400ms;
    animation-direction: reverse;
}

@keyframes shine {
    to {stroke-dashoffset: 0;}
}

.star-swell {
	animation: swell 8s linear infinite;
	transform-origin: center top;
}

@keyframes swell {
  0% {transform: scale(1);}
  50% {transform: scale(1.05);}
  100% {transform: scale(1);}
}



/* REGISTER ANIMATE */
.check-box {
    animation: checked 5s linear infinite;
    transform-origin: center;
}

.check-box-2 {
    animation: checked 5s linear infinite;
    transform-origin: center;
    animation-delay: 300ms;
}

.check-box-3 {
    animation: checked 5s linear infinite;
    transform-origin: center;
    animation-delay: 600ms;
}

@keyframes checked {
  0% {opacity: 0;}
  40% { opacity: 0;}
  50% { opacity: 1;}
  95% {opacity: 1;}
  100% {opacity: 0;}
}

.list-line {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: todo 5s ease-in infinite;
}

.list-line-2 {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: todo 5s ease-in infinite;
    animation-delay: 300ms;
}

.list-line-3 {
    stroke-dasharray: 100;
    stroke-dashoffset: 200;
    animation: todo 5s ease-in infinite;
    animation-delay: 600ms;
}

@keyframes todo {
    to {stroke-dashoffset: 0;}
}

.cursor-wave {
    -webkit-animation: hover infinite 6s ease-in-out;
    -moz-animation: hover infinite 6s ease-in-out;
    animation: hover infinite 6s ease-in-out;
    animation-fill-mode: forwards;
    transform-origin: right bottom;
}

@-webkit-keyframes hover {
  0% {transform: translate(-5px, -5px);}
  50% {transform: translate(0px, 0px);}
  100% {transform: translate(-5px, -5px);}
}
@keyframes hover {
  0% {transform: translate(-5px, -5px);}
  50% {transform: translate(0px, 0px);}
  100% {transform: translate(-5px, -5px);
}
