.content-box .cloud-bg {
    position: absolute;
    content: "";
    bottom: 0;
    margin-left: -33px;
    width: 100%;
    height: 100%;
    background-image: url(../img/cloud-bg.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: 50% 100%;
    opacity: .1;
    z-index: 0
}

.content-box .bgImg.bg1 {
    background-image: url(../img/bg11.png)
}

.content-box .bgImg.bg2 {
    background-image: url(../img/bg12.png)
}

.content-box .bgImg.bg3 {
    background-image: url(../img/bg13.png)
}

.content-box .bgImg.bg4 {
    background-image: url(../img/bg14.png)
}

.content-box .bgImg {
    position: absolute;
    content: "";
    bottom: 0;
    margin-left: -33px;
    width: 85%;
    height: 90%;
    background-repeat: no-repeat;
    background-size: 100%;
    opacity: .8
}

.bg-animation img.move-1 {
    position: absolute;
    max-width: 70px;
    top: 20%;
    left: 20%;
    opacity: .3;
    -webkit-animation-duration: 8s;
    animation-duration: 8s;
    -webkit-perspective: 150px;
    perspective: 150px;
    -webkit-animation-name: bubbleMover;
    animation-name: bubbleMover;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.bg-animation img.move-2 {
    position: absolute;
    max-width: 90px;
    top: 45%;
    left: 30%;
    opacity: .5;
    -webkit-animation: featureImgBounce 5s ease-in-out 0s infinite alternate;
    animation: featureImgBounce 5s ease-in-out 0s infinite alternate
}

.bg-animation img.move-3 {
    position: absolute;
    max-width: 120px;
    top: 65%;
    left: 85%;
    opacity: .3;
    -webkit-animation: rotation 15s infinite linear;
    animation: rotation 15s infinite linear
}

.bg-animation img.move-4 {
    position: absolute;
    max-width: 70px;
    top: 25%;
    left: 80%;
    opacity: .5;
    -webkit-animation: featureImgBounce 5s ease-in-out 0s infinite alternate;
    animation: featureImgBounce 5s ease-in-out 0s infinite alternate
}

@-webkit-keyframes bubbleMover {
    0% {
        -webkit-transform: translateY(0px) translateX(0) rotate(0);
        transform: translateY(0px) translateX(0) rotate(0)
    }
    30% {
        -webkit-transform: translateY(30px) translateX(50px) rotate(15deg);
        transform: translateY(30px) translateX(50px) rotate(15deg);
        -webkit-transform-origin: center center;
        transform-origin: center center
    }
    50% {
        -webkit-transform: translateY(50px) translateX(100px) rotate(45deg);
        transform: translateY(50px) translateX(100px) rotate(45deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom
    }
    80% {
        -webkit-transform: translateY(30px) translateX(50px) rotate(15deg);
        transform: translateY(30px) translateX(50px) rotate(15deg);
        -webkit-transform-origin: left top;
        transform-origin: left top
    }
    100% {
        -webkit-transform: translateY(0px) translateX(0) rotate(0);
        transform: translateY(0px) translateX(0) rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center
    }
}

@keyframes bubbleMover {
    0% {
        -webkit-transform: translateY(0px) translateX(0) rotate(0);
        transform: translateY(0px) translateX(0) rotate(0)
    }
    30% {
        -webkit-transform: translateY(30px) translateX(50px) rotate(15deg);
        transform: translateY(30px) translateX(50px) rotate(15deg);
        -webkit-transform-origin: center center;
        transform-origin: center center
    }
    50% {
        -webkit-transform: translateY(50px) translateX(100px) rotate(45deg);
        transform: translateY(50px) translateX(100px) rotate(45deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom
    }
    80% {
        -webkit-transform: translateY(30px) translateX(50px) rotate(15deg);
        transform: translateY(30px) translateX(50px) rotate(15deg);
        -webkit-transform-origin: left top;
        transform-origin: left top
    }
    100% {
        -webkit-transform: translateY(0px) translateX(0) rotate(0);
        transform: translateY(0px) translateX(0) rotate(0);
        -webkit-transform-origin: center center;
        transform-origin: center center
    }
}

@-webkit-keyframes featureImgBounce {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px)
    }
}

@keyframes featureImgBounce {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px)
    }
}

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(359deg)
    }
}

.home_bubble .bubble {
    position: absolute;
    border-radius: 50%
}

.home_bubble .bubble.b_one,
.home_bubble .bubble.b_four {
    width: 20px;
    height: 20px
}

.home_bubble .bubble.b_two,
.home_bubble .bubble.b_five {
    width: 40px;
    height: 40px
}

.home_bubble .bubble.b_three,
.home_bubble .bubble.b_six {
    width: 14px;
    height: 14px
}

.home_bubble .bubble.b_one {
    background: rgba(14, 125, 147, .8);
    top: 20%;
    left: 385px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-animation: spin2 2s infinite alternate;
    animation: spin2 2s infinite alternate
}

.home_bubble .bubble.b_two {
    background: rgba(46, 139, 228, .8);
    top: 50%;
    left: 355px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-animation: pulse 2s infinite alternate;
    animation: pulse 2s infinite alternate
}

.home_bubble .bubble.b_three {
    background: #7d95fa;
    top: 85%;
    left: 255px;
    -webkit-animation: spin1 1s infinite alternate;
    animation: spin1 1s infinite alternate
}

.home_bubble .bubble.b_four {
    background: rgba(125, 250, 167, .5);
    top: 20%;
    right: 85px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-animation: spin1 2s infinite alternate;
    animation: spin1 2s infinite alternate
}

.home_bubble .bubble.b_five {
    background: rgba(255, 147, 152, .6);
    top: 50%;
    right: 155px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-animation: pulse 3s infinite alternate;
    animation: pulse 3s infinite alternate
}

.home_bubble .bubble.b_six {
    background: rgba(241, 213, 59, .5);
    top: 85%;
    right: 55px;
    -webkit-animation: spin2 2s infinite alternate;
    animation: spin2 2s infinite alternate
}

.home_bubble .triangle {
    position: absolute
}

.home_bubble .triangle.b_seven {
    left: 25%;
    top: 400px
}

.home_bubble .triangle.b_eight {
    left: -100px;
    bottom: -45px
}

.home_bubble .triangle.b_nine {
    right: 28%;
    bottom: 250px;
    -webkit-animation: spin2 2s infinite alternate;
    animation: spin2 2s infinite alternate
}

.home_analytics_banner_area .elements_item {
    position: absolute
}

.home_analytics_banner_area .elements_item:nth-child(1) {
    right: -30px;
    top: 165px
}

.home_analytics_banner_area .elements_item:nth-child(2) {
    bottom: 250px;
    right: 100px
}

.home_analytics_banner_area .elements_item:nth-child(3) {
    bottom: 66px;
    left: 280px
}

.home_analytics_banner_area .elements_item:nth-child(4) {
    bottom: -80px;
    left: 100px
}

.home_analytics_banner_area .elements_item:nth-child(5) {
    top: 250px;
    left: 180px
}

.home_analytics_banner_area .elements_item:nth-child(6) {
    top: 180px;
    left: 150px
}

@-webkit-keyframes pulse {
    0% {
        opacity: 1;
        -webkit-transform: translate(-50%, -50%) scale(1);
        transform: translate(-50%, -50%) scale(1)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate(-50%, -50%) scale(2);
        transform: translate(-50%, -50%) scale(2)
    }
}

@keyframes pulse {
    0% {
        opacity: 1;
        -webkit-transform: translate(-50%, -50%) scale(1);
        transform: translate(-50%, -50%) scale(1)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate(-50%, -50%) scale(2);
        transform: translate(-50%, -50%) scale(2)
    }
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: translateX(-10px) scale(.9);
        transform: translateX(-10px) scale(.9)
    }
    100% {
        -webkit-transform: translateX(30px) scale(1.3) translateY(10px);
        transform: translateX(30px) scale(1.3) translateY(10px)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: translateX(-10px) scale(.9);
        transform: translateX(-10px) scale(.9)
    }
    100% {
        -webkit-transform: translateX(30px) scale(1.3) translateY(10px);
        transform: translateX(30px) scale(1.3) translateY(10px)
    }
}

@-webkit-keyframes spin1 {
    0% {
        -webkit-transform: scale(.9);
        transform: scale(.9)
    }
    100% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5)
    }
}

@keyframes spin1 {
    0% {
        -webkit-transform: scale(.9);
        transform: scale(.9)
    }
    100% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5)
    }
}

@-webkit-keyframes spin2 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(40px);
        transform: translateY(40px)
    }
}

@keyframes spin2 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(40px);
        transform: translateY(40px)
    }
}

@-webkit-keyframes spin3 {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    25% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px)
    }
    50% {
        -webkit-transform: translateX(30px);
        transform: translateX(30px)
    }
    100% {
        -webkit-transform: translateX(50px);
        transform: translateX(50px)
    }
}

@keyframes spin3 {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    25% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px)
    }
    50% {
        -webkit-transform: translateX(30px);
        transform: translateX(30px)
    }
    100% {
        -webkit-transform: translateX(50px);
        transform: translateX(50px)
    }
}

@media screen and (max-width:768px) {
    .content-box .bgImg {
        position: absolute;
        content: "";
        bottom: 0;
        margin-left: -33px;
        width: 85%;
        height: 90%;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        opacity: .8
    }
}