122 lines
3.3 KiB
CSS
122 lines
3.3 KiB
CSS
@import url(https://fonts.googleapis.com/css?family=Pathway+Gothic+One);
|
|
|
|
@-webkit-keyframes rotate-right {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
}
|
|
}
|
|
@-webkit-keyframes rotate-left {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(-360deg);
|
|
}
|
|
}
|
|
@-webkit-keyframes hover {
|
|
0% {
|
|
-webkit-transform: translateY(0%);
|
|
}
|
|
50% {
|
|
-webkit-transform: translateY(5%);
|
|
}
|
|
100% {
|
|
-webkit-transform: translateY(0%);
|
|
}
|
|
}
|
|
@-webkit-keyframes pull {
|
|
0% {
|
|
-webkit-transform: scaleY(1);
|
|
}
|
|
40% {
|
|
-webkit-transform: scaleY(1.01);
|
|
}
|
|
60% {
|
|
-webkit-transform: scaleY(0.99);
|
|
}
|
|
80% {
|
|
-webkit-transform: scaleY(1.01);
|
|
}
|
|
100% {
|
|
-webkit-transform: scaleY(0.99);
|
|
}
|
|
80% {
|
|
-webkit-transform: scaleY(1.01);
|
|
}
|
|
100% {
|
|
-webkit-transform: scaleY(1);
|
|
}
|
|
}
|
|
#airplane2, #airplane1 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 200px 200px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-right 60s linear 0s infinite;
|
|
}
|
|
#countryObjects {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 200px 200px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-right 240s linear 0s infinite;
|
|
}
|
|
#floatingGlobe {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 200px 200px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-left 360s linear 0s infinite;
|
|
}
|
|
#globe {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: hover 0s linear 0s infinite;
|
|
}
|
|
#windmill {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 331px 201px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-right 2s linear 0s infinite;
|
|
}
|
|
#cloud1 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: hover 3s linear 1s infinite;
|
|
}
|
|
#cloud2 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: hover 3s linear 2s infinite;
|
|
}
|
|
#cloud3 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: hover 3s linear 3s infinite;
|
|
}
|
|
#circle1 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 200px 200px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-right 12s linear 0s infinite;
|
|
}
|
|
#circle2 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 200px 200px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-left 24s linear 0s infinite;
|
|
}
|
|
#circle3 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 200px 200px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-right 12s linear 0s infinite;
|
|
}
|
|
#circle4 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 200px 200px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-left 24s linear 0s infinite;
|
|
}
|
|
#circle5 {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-transform-origin: 200px 200px;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
-webkit-animation: rotate-right 12s linear 0s infinite;
|
|
} |