/*Using -webkit-animation: movebounce 5s linear infinite; animation: movebounce 5s linear infinite; */  @-webkit-keyframes fadeInUp3 { 0% {-webkit-transform: translateY(30px);transform: translateY(30px)} 100% {-webkit-transform: translateY(0);transform: translateY(0)} }  @keyframes fadeInUp3 { 0% {-webkit-transform: translateY(30px);-ms-transform: translateY(30px);transform: translateY(30px)} 100% {-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0)} }  .fadeInUp3 {-webkit-animation-name: fadeInUp3;animation-name: fadeInUp3;}  @-webkit-keyframes moveLeftBounces { 0% {-webkit-transform: translateX(0);transform: translateX(0);} 50% {-webkit-transform: translateX(45px);transform: translateX(45px);} 100% {-webkit-transform: translateX(0);transform: translateX(0);} }  @keyframes moveLeftBounces { 0% {-webkit-transform: translateX(0);transform: translateX(0);} 50% {-webkit-transform: translateX(45px);transform: translateX(45px);} 100% {-webkit-transform: translateX(0);transform: translateX(0);} }  @-webkit-keyframes rotation { from {-webkit-transform: rotate(0deg);transform: rotate(0deg);} to {-webkit-transform: rotate(359deg);transform: rotate(359deg);} }  @keyframes rotation { from {-webkit-transform: rotate(0deg);transform: rotate(0deg);} to {-webkit-transform: rotate(359deg);transform: rotate(359deg);} }  @-webkit-keyframes movebounce { 0% {-webkit-transform: translateY(0px);transform: translateY(0px);} 50% {-webkit-transform: translateY(20px);transform: translateY(20px);} 100% {-webkit-transform: translateY(0px);transform: translateY(0px);} }  @keyframes movebounce { 0% {-webkit-transform: translateY(0px);transform: translateY(0px);} 50% {-webkit-transform: translateY(20px);transform: translateY(20px);} 100% {-webkit-transform: translateY(0px);transform: translateY(0px);} }  .anm-movebounce {-webkit-animation: movebounce 5s linear infinite;animation: movebounce 5s linear infinite;animation-name: movebounce;animation-duration: 5s;animation-timing-function: linear;animation-delay: 0s;animation-iteration-count: infinite;animation-direction: normal;animation-fill-mode: none;animation-play-state: running;}  @-webkit-keyframes moVEbounce { 0% {-webkit-transform: translateY(0px);transform: translateY(0px);} 50% {-webkit-transform: translateY(100px);transform: translateY(100px);} 100% {-webkit-transform: translateY(0px);transform: translateY(0px);} }  @keyframes moVEbounce { 0% {-webkit-transform: translateY(0px);transform: translateY(0px);} 50% {-webkit-transform: translateY(100px);transform: translateY(100px);} 100% {-webkit-transform: translateY(0px);transform: translateY(0px);} }  @-webkit-keyframes moVebounce { 0% {-webkit-transform: translateY(0px);transform: translateY(0px);} 50% {-webkit-transform: translateY(50px);transform: translateY(50px);} 100% {-webkit-transform: translateY(0px);transform: translateY(0px);} }  @keyframes moVebounce { 0% {-webkit-transform: translateY(0px);transform: translateY(0px);} 50% {-webkit-transform: translateY(50px);transform: translateY(50px);} 100% {-webkit-transform: translateY(0px);transform: translateY(0px);} }  @-webkit-keyframes Movebounce { 0% {-webkit-transform: translateY(0px) rotate(-90deg);transform: translateY(0px) rotate(-90deg);} 50% {-webkit-transform: translateY(20px) rotate(-90deg);transform: translateY(20px) rotate(-90deg);} 100% {-webkit-transform: translateY(0px) rotate(-90deg);transform: translateY(0px) rotate(-90deg);} }  @keyframes Movebounce { 0% {-webkit-transform: translateY(0px) rotate(-90deg);transform: translateY(0px) rotate(-90deg);} 50% {-webkit-transform: translateY(20px) rotate(-90deg);transform: translateY(20px) rotate(-90deg);} 100% {-webkit-transform: translateY(0px) rotate(-90deg);transform: translateY(0px) rotate(-90deg);} }  @-webkit-keyframes animationFramesOne { 0% {-webkit-transform: translate(0px, 0px) rotate(0deg);transform: translate(0px, 0px) rotate(0deg);} 80% {-webkit-transform: translate(-300px, 0px) rotate(360deg);transform: translate(-300px, 0px) rotate(360deg);} 100% {-webkit-transform: translate(0px, 0px) rotate(0deg);transform: translate(0px, 0px) rotate(0deg);} }  @keyframes animationFramesOne { 0% {-webkit-transform: translate(0px, 0px) rotate(0deg);transform: translate(0px, 0px) rotate(0deg);} 80% {-webkit-transform: translate(-300px, 0px) rotate(360deg);transform: translate(-300px, 0px) rotate(360deg);} 100% {-webkit-transform: translate(0px, 0px) rotate(0deg);transform: translate(0px, 0px) rotate(0deg);} }  @-webkit-keyframes focus-one { 0% {opacity: 0;} 75% {opacity: 1;} 100% {opacity: 0;} }  @keyframes focus-one { 0% {opacity: 0;} 75% {opacity: 1;} 100% {opacity: 0;} }  .rotateme {-webkit-animation-name: rotateme;animation-name: rotateme;-webkit-animation-duration: 20s;animation-duration: 20s;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;-webkit-animation-timing-function: linear;animation-timing-function: linear;}  @keyframes rotateme { from {-webkit-transform: rotate(0deg);transform: rotate(0deg);} to {-webkit-transform: rotate(360deg);transform: rotate(360deg);} }  @-webkit-keyframes rotateme { from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(360deg);} }  /*Using -webkit-animation: move 5s infinite; animation: move 5s infinite; or -webkit-animation: move2 5s infinite; animation: move2 5s infinite; */  @-webkit-keyframes move { 0% {-webkit-transform: rotate(-1deg) translate(-5px, -5px);transform: rotate(-1deg) translate(-5px, -5px);} 50% {-webkit-transform: rotate(1deg) translate(5px, 5px);transform: rotate(1deg) translate(5px, 5px);} 100% {-webkit-transform: rotate(-1deg) translate(-5px, -5px);transform: rotate(-1deg) translate(-5px, -5px);} }  @keyframes move { 0% {-webkit-transform: rotate(-1deg) translate(-5px, -5px);transform: rotate(-1deg) translate(-5px, -5px);} 50% {-webkit-transform: rotate(1deg) translate(5px, 5px);transform: rotate(1deg) translate(5px, 5px);} 100% {-webkit-transform: rotate(-1deg) translate(-5px, -5px);transform: rotate(-1deg) translate(-5px, -5px);} }  @-webkit-keyframes move2 { 0% {-webkit-transform: rotate(1deg) translate(2px, 2px);transform: rotate(1deg) translate(2px, 2px);} 50% {-webkit-transform: rotate(-1deg) translate(-2px, -2px);transform: rotate(-1deg) translate(-2px, -2px);} 100% {-webkit-transform: rotate(1deg) translate(2px, 2px);transform: rotate(1deg) translate(2px, 2px);} }  /*---------------------------------------- CLOUDS ------------------------------------------*/  .clouds {position: relative;z-index: 1;}  .clouds img.cloud5 {top: 150px;-webkit-animation: cloud5 25s linear 20s infinite;animation: cloud5 25s linear 20s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  .clouds img {position: absolute;top: 0;z-index: -1;}  .clouds img.cloud1 {top: -200px;-webkit-animation: cloud1 45s linear 1s infinite;animation: cloud1 45s linear 1s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  @-webkit-keyframes cloud1 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  @keyframes cloud1 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  .clouds img.cloud2 {top: -100px;-webkit-animation: cloud2 25s linear 6s infinite;animation: cloud2 25s linear 6s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  @-webkit-keyframes cloud2 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  @keyframes cloud2 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  .clouds img.cloud3 {top: 115px;-webkit-animation: cloud3 45s linear 11s infinite;animation: cloud3 45s linear 11s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  @-webkit-keyframes cloud3 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  @keyframes cloud3 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  .clouds img.cloud4 {top: 5px;-webkit-animation: cloud4 45s linear 16s infinite;animation: cloud4 45s linear 16s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  @-webkit-keyframes cloud4 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  @keyframes cloud4 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  .clouds img.cloud5 {top: 130px;-webkit-animation: cloud5 45s linear 21s infinite;animation: cloud5 45s linear 21s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  @-webkit-keyframes cloud5 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  @keyframes cloud5 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  .clouds img.cloud6 {top: 0px;-webkit-animation: cloud1 45s linear 26s infinite;animation: cloud1 45s linear 26s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  @-webkit-keyframes cloud6 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  @keyframes cloud6 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  .clouds img.cloud7 {top: 90px;-webkit-animation: cloud2 45s linear 31s infinite;animation: cloud2 45s linear 31s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  @-webkit-keyframes cloud7 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  @keyframes cloud7 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  .clouds img.cloud8 {top: 50px;-webkit-animation: cloud3 45s linear 36s infinite;animation: cloud3 45s linear 36s infinite;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}  @-webkit-keyframes cloud8 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  @keyframes cloud8 { 0% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 0} 10% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 10%;} 90% {opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";right: 90%} 100% {opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";right: 100%} }  .img-move-left {-webkit-animation: move 5s infinite;animation: move 5s infinite;}  .img-move-right {-webkit-animation: move2 5s infinite;animation: move2 5s infinite;}  @-webkit-keyframes move { 0% {-webkit-transform: rotate(-1deg) translate(-5px, -5px);transform: rotate(-1deg) translate(-5px, -5px);} 50% {-webkit-transform: rotate(1deg) translate(5px, 5px);transform: rotate(1deg) translate(5px, 5px);} 100% {-webkit-transform: rotate(-1deg) translate(-5px, -5px);transform: rotate(-1deg) translate(-5px, -5px);} }  @keyframes move { 0% {-webkit-transform: rotate(-1deg) translate(-5px, -5px);transform: rotate(-1deg) translate(-5px, -5px);} 50% {-webkit-transform: rotate(1deg) translate(5px, 5px);transform: rotate(1deg) translate(5px, 5px);} 100% {-webkit-transform: rotate(-1deg) translate(-5px, -5px);transform: rotate(-1deg) translate(-5px, -5px);} }  .img-move2 {-webkit-animation: move2 5s infinite;animation: move2 5s infinite;}  @-webkit-keyframes move2 { 0% {-webkit-transform: rotate(1deg) translate(2px, 2px);transform: rotate(1deg) translate(2px, 2px);} 50% {-webkit-transform: rotate(-1deg) translate(-2px, -2px);transform: rotate(-1deg) translate(-2px, -2px);} 100% {-webkit-transform: rotate(1deg) translate(2px, 2px);transform: rotate(1deg) translate(2px, 2px);} }  @-webkit-keyframes move2 { 0% {-webkit-transform: rotate(1deg) translate(2px, 2px);transform: rotate(1deg) translate(2px, 2px);} 50% {-webkit-transform: rotate(-1deg) translate(-2px, -2px);transform: rotate(-1deg) translate(-2px, -2px);} 100% {-webkit-transform: rotate(1deg) translate(2px, 2px);transform: rotate(1deg) translate(2px, 2px);} }  /************************* Using <div class="animated-bg"><i></i><i></i><i></i></div> ************************/  .animated-bg {}  .animated-bg i {background: #dddddd;bottom: 0;-webkit-box-shadow: 0 15px 30px 0 #ffe9ea;box-shadow: 0 15px 30px 0 #ffe9ea;position: absolute;height: 100px;width: 100px;border-radius: 100%;opacity: 0.3;-webkit-transform: scale(1.3);transform: scale(1.3);-webkit-animation: ripple1 3s linear infinite;animation: ripple1 3s linear infinite;}  .animated-bg i:nth-child(2) {-webkit-animation: ripple2 3s linear infinite;animation: ripple2 3s linear infinite;}  .animated-bg i:nth-child(3) {-webkit-animation: ripple3 3s linear infinite;animation: ripple3 3s linear infinite;}  @-webkit-keyframes ripple1 { 0% {-webkit-transform: scale(5.5);transform: scale(5.5);opacity: 0.3;} 100% {-webkit-transform: scale(8.5);transform: scale(8.5);opacity: 0.0;} }  @keyframes ripple1 { 0% {-webkit-transform: scale(5.5);transform: scale(5.5);opacity: 0.3;} 100% {-webkit-transform: scale(8.5);transform: scale(8.5);opacity: 0.0;} }  @-webkit-keyframes ripple2 { 0% {-webkit-transform: scale(3.5);transform: scale(3.5);} 100% {-webkit-transform: scale(5.5);transform: scale(5.5);} }  @keyframes ripple2 { 0% {-webkit-transform: scale(3.5);transform: scale(3.5);} 100% {-webkit-transform: scale(5.5);transform: scale(5.5);} }  @-webkit-keyframes ripple3 { 0% {-webkit-transform: scale(1.5);transform: scale(1.5);} 100% {-webkit-transform: scale(3.5);transform: scale(3.5);} }  @keyframes ripple3 { 0% {-webkit-transform: scale(1.5);transform: scale(1.5);} 100% {-webkit-transform: scale(3.5);transform: scale(3.5);} }  @keyframes sun-animation { 0% {transform: rotate(0deg) scale(1);opacity: 1;} 50% {transform: rotate(0deg) scale(0.85);opacity: 0.8;} 100% {transform: rotate(0deg) scale(1);opacity: 1;} }  @-webkit-keyframes sun-animation { 0% {-webkit-transform: rotate(0deg) scale(1);opacity: 1;} 50% {-webkit-transform: rotate(0deg) scale(0.85);opacity: 0.8;} 100% {-webkit-transform: rotate(0deg) scale(1);opacity: 1;} }  .animate-downup{-webkit-animation: fadeInUp3 2.5s 1s both alternate infinite;animation: fadeInUp3 2.5s 1s both alternate infinite;}