
/*----------------------------------------
            REGISTER STYLE
------------------------------------------*/

.register-area {
    background-size: 100% 100%;
    background-position: center;
    background-color: #2c82c9;
    position: relative;
    z-index: 0;
    padding-top: 60px;
    background-repeat: no-repeat;
    padding-bottom: 60px;
}
.register-heading h2 {
    font-size: 24px;
    font-weight: 700;
    color: #f3f8ff;
    line-height: 56px;
}
.register-heading span {
    font-size: 14px;
    color: #fff;
    font-weight: 500;
    margin-bottom: 20px;
    display: inline-block;
}
a.pricing-btn.blue-btn.homepage-one-all-features-btn.register-btn {    
    font-size: 12px;
    font-weight: 600;
    text-transform: capitalize;
    color: #3464e0;
    background-color: #ffffff;
    border-radius: 5px 5px 5px 5px;
    opacity: 1;
    padding: 17px 35px 17px 35px;
    text-decoration: none;
}
a.pricing-btn.blue-btn.homepage-one-all-features-btn.register-btn:hover {
    box-shadow: none;
    color: #3464e0;
}
<div class="clouds">


/*----------------------------------------
      CLOUDS
------------------------------------------*/
.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: 170px;
    -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: 50px;
    -webkit-animation: cloud2 45s linear 6s infinite;
    animation: cloud2 45s 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: 215px;
    -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: 75px;
    -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: 230px;
    -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: 50px;
    -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: 190px;
    -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%
    }
}


