
    section{position: relative;}
    #sec-11{position: relative;padding: 80px 0 400px 0;}
    .cloud-animate, .boat-animate{
        position: absolute;
        bottom:0;
        left:0;
        -o-transition: all 1s ease-in-out;
        -moz-transition: all 1s ease-in-out;
        -webkit-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;
    }
    .ani-cloud1{
        width: 20%;
        left: 2%;
        bottom: 35%;
        -webkit-animation: ani-cloud 60s linear infinite;
        -moz-animation: ani-cloud1 60s linear infinite;
        -o-animation: ani-cloud1 60s linear infinite;
        animation: ani-cloud1 60s linear infinite;
    }
    .ani-cloud2{
        width: 15%;
        left: 35%;
        bottom: 30%;
        -webkit-animation: ani-cloud1 90s linear infinite;
        -moz-animation: ani-cloud1 90s linear infinite;
        -o-animation: ani-cloud1 90s linear infinite;
        animation: ani-cloud1 90s linear infinite;
    }
    .ani-cloud3{
        width: 10%;
        left: 55%;
        bottom: 40%;
        -webkit-animation: ani-cloud1 120s linear infinite;
        -moz-animation: ani-cloud1 120s linear infinite;
        -o-animation: ani-cloud1 120s linear infinite;
        animation: ani-cloud1 120s linear infinite;
    }
	#sec-2 .ani-cloud1{top:0;}
	#sec-2 .ani-cloud2{top:10%;}
	#sec-2 .ani-cloud3{top:30%}
	#sec-6 .ani-cloud1{bottom: 45%;}
	#sec-6 .ani-cloud2{bottom: 40%;}
	#sec-6 .ani-cloud3{bottom: 50%;}
    @keyframes ani-cloud1 {
        0% {left: 0%;}
        100% {left: 100%;}
    }
    .ani-boat1{
        width: 4%;
        bottom: 10%;
        left:40%;
        -webkit-animation: ani-boat1 60s linear infinite;
        -moz-animation: ani-boat1 60s linear infinite;
        -o-animation: ani-boat1 60s linear infinite;
        animation: ani-boat1 60s linear infinite;
    }
    .ani-boat2{
        width: 2%;
        bottom: 12%;
        left:70%;
        -webkit-animation: ani-boat1 40s linear infinite;
        -moz-animation: ani-boat1 40s linear infinite;
        -o-animation: ani-boat1 40s linear infinite;
        animation: ani-boat1 40s linear infinite;
    }
    @keyframes ani-boat1 {
        0% {left: 40%;}
        50% {left: 90%;}
        100% {left: 40%;}
    }
    .balloon-animate{
        position: absolute;
        right:18%;
        bottom:20%;
        width:40px;
        -webkit-animation: ani-balloon 6s linear infinite;
        -moz-animation: ani-balloon 6s linear infinite;
        -o-animation: ani-balloon 6s linear infinite;
        animation: ani-balloon 6s linear infinite;
    }
    
    @keyframes ani-balloon {
        0% {bottom: 20%;}
        50% {bottom: 28%;}
        100% {bottom: 20%;}
    }

    .sec-ten-creative{position: absolute;left:0;bottom:0;width:100%;pointer-events:none;}
    .lights-animate{
        width:4%;
        position: absolute;
        bottom:0;
        left: 10%;
        transform:rotate(0deg);
        -ms-transform:rotate(0deg);
        -webkit-transform:rotate(0deg);
    }
    .ani-rlight{
        width:9%;
        left:7%;
        -webkit-animation: ani-rlight 3s linear infinite;
        -moz-animation: ani-rlight 3s linear infinite;
        -o-animation: ani-rlight 3s linear infinite;
        animation: ani-rlight 3s linear infinite;
    }
    .ani-llight{
        width:11%;
        left:10%;
        -webkit-animation: ani-llight 3s linear infinite;
        -moz-animation: ani-llight 3s linear infinite;
        -o-animation: ani-llight 3s linear infinite;
        animation: ani-llight 3s linear infinite;
    }
    @keyframes ani-rlight {
        0% {  
            transform:rotate(0deg);
            -ms-transform:rotate(0deg);
            -webkit-transform:rotate(0deg);
            transform-origin: bottom right;
        }
        50% {
            transform:rotate(45deg);
            -ms-transform:rotate(45deg);
            -webkit-transform:rotate(45deg);
            transform-origin: bottom right;
        }
        100% {
            transform:rotate(0deg);
            -ms-transform:rotate(0deg);
            -webkit-transform:rotate(0deg);
            transform-origin: bottom right;
        }
    }
    @keyframes ani-llight {
        0% {  
            transform:rotate(0deg);
            -ms-transform:rotate(0deg);
            -webkit-transform:rotate(0deg);
            transform-origin: bottom left;
        }
        50% {
            transform:rotate(-45deg);
            -ms-transform:rotate(-45deg);
            -webkit-transform:rotate(-45deg);
            transform-origin: bottom left;
        }
        100% {
            transform:rotate(0deg);
            -ms-transform:rotate(0deg);
            -webkit-transform:rotate(0deg);
            transform-origin: bottom left;
        }
    }
    .rocket-fly{
        width:500px;
        height: auto;
        position: absolute;
        -o-transition: all 1s ease-in-out;
        -moz-transition: all 1s ease-in-out;
        -webkit-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;
    }
    .rocket-fly.cloud1{
        z-index: 99;
        bottom: 0;
        left: 35%;
        -webkit-animation: cloud1 2s ease-in-out infinite;
        -moz-animation: cloud1 2s ease-in-out infinite;
        -o-animation: cloud1 2s ease-in-out infinite;
        animation: cloud1 2s ease-in-out infinite;
    }
    .rocket-fly.cloud2{
        z-index: 0;
        bottom: 25px;
        left: 28%;
        -webkit-animation: cloud2 3s ease-in-out infinite;
        -moz-animation: cloud2 3s ease-in-out infinite;
        -o-animation: cloud2 3s ease-in-out infinite;
        animation: cloud2 3s ease-in-out infinite;
    }
    .rocket-fly.cloud3{
        z-index: 0;
        bottom: 48px;
        left: 38%;
        -webkit-animation: cloud3 2.5s ease-in-out infinite;
        -moz-animation: cloud3 2.5s ease-in-out infinite;
        -o-animation: cloud3 2.5s ease-in-out infinite;
        animation: cloud3 2.5s ease-in-out infinite;
    }
    .rocket-fly.rocket{
        width:80px;
        left: 47%;
        bottom: 66px;
        z-index: 0;
        -webkit-animation: rocket 3s linear infinite;
        -moz-animation: rocket 3s linear infinite;
        -o-animation: rocket 3s linear infinite;
        animation: rocket 3s linear infinite;
    }

@keyframes cloud1 {
    0% {
        bottom: 0px;
        -ms-transform: scale(1); 
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }50% {
        bottom: 15px;
        -ms-transform: scale(1.05); 
        -moz-transform: scale(1.05);
        -o-transform: scale(1.05);
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }100% {
        bottom: 0px;
        -ms-transform: scale(1); 
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
@keyframes cloud2 {
    0% {
        bottom: 25px;
        -ms-transform: scale(1); 
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        bottom: 40px;
        -ms-transform: scale(1.05); 
        -moz-transform: scale(1.05);
        -o-transform: scale(1.05);
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
    100% {
        bottom: 25px;
        -ms-transform: scale(1); 
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
@keyframes cloud3 {
    0% {
        bottom: 45px;
        -ms-transform: scale(1); 
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        bottom: 55px;
        -ms-transform: scale(1.05); 
        -moz-transform: scale(1.05);
        -o-transform: scale(1.05);
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
    100% {
        bottom: 45px;
        -ms-transform: scale(1); 
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
@keyframes rocket {0% {bottom: 70px;}50% {bottom: 50px;}100% {bottom: 70px;}}

.ani-starts{position: absolute;left:0;top:0;width:100%;pointer-events: 
none;}
.star1{
    -moz-animation:twink-back normal 1s infinite ease-in-out;
    -webkit-animation:twink-back normal 1s infinite ease-in-out;
    -ms-animation:twink-back normal 1s infinite ease-in-out;
    animation:twink-back normal 1s infinite ease-in-out;
}
.star2{
    -moz-animation:twink-back normal 2s infinite ease-in-out;
    -webkit-animation:twink-back normal 2s infinite ease-in-out;
    -ms-animation:twink-back normal 2s infinite ease-in-out;
    animation:twink-back normal 2s infinite ease-in-out;
}
.star3{
    -moz-animation:twink-back normal 1.5s infinite ease-in-out;
    -webkit-animation:twink-back normal 1.5s infinite ease-in-out;
    -ms-animation:twink-back normal 1.5s infinite ease-in-out;
    animation:twink-back normal 1.5s infinite ease-in-out;
}
@-moz-keyframes twink-back {0%{opacity:1;} 25%{opacity:0.5;} 50%{opacity:0;} 75%{opacity:0.5;} 100%{opacity:1;}}
@-webkit-keyframes twink-back {0%{opacity:1;} 25%{opacity:0.5;} 50%{opacity:0;} 75%{opacity:0.5;} 100%{opacity:1;}}
@-ms-keyframes twink-back {0%{opacity:1;} 25%{opacity:0.5;} 50%{opacity:0;} 75%{opacity:0.5;} 100%{opacity:1;}}
@keyframes twink-back {0%{opacity:1;} 25%{opacity:0.5;} 50%{opacity:0;} 75%{opacity:0.5;} 100%{opacity:1;}}

@media only screen and (max-width:1100px){
	.rocket-fly.rocket{
		width:45px;
	}
	.rocket-fly {
		width: 280px;
	}
	.rocket-fly.cloud2 {
		left:32%;
	}
}
@media only screen and (max-width:650px){
	
	.rocket-fly.rocket{
		width:20px;
	}
	@keyframes rocket {0% {bottom: 30px;}50% {bottom: 40px;}100% {bottom: 30px;}}
	.rocket-fly{
		width: 120px;
	}
	@keyframes cloud1 {
		0% {
			bottom: 0px;
		}50% {
			bottom: 10px;
		}100% {
			bottom: 0px;
		}
	}
	.rocket-fly.cloud2 {
		bottom: -58px;
		left: 27;
	}
	@keyframes cloud2 {
		0% {
			bottom: 15px;
		}
		50% {
			bottom: 30px;
		}
		100% {
			bottom: 15px;
		}
	}
	.rocket-fly.cloud3 {
		bottom: -295px;
		left: 38%;
	}
	@keyframes cloud3 {
		0% {
			bottom: 20px;
		}
		50% {
			bottom: 10px;
		}
		100% {
			bottom: 20px;
		}
	}
	.ani-boat1 {
		bottom:5%;
	}
	.ani-boat2 {
   		width: 3%;
		bottom: 6%;
	}
}


