@charset "UTF-8";


@media only screen and (max-width:421px) {
#rotating-section{
    position: relative;
    background: #26C9FF  top center no-repeat fixed;
    height: 280px;
    overflow: hidden;
    z-index: -50;
}
}

@media only screen and (min-width:420px) and (max-width:650px){
#rotating-section{
    position: relative;
    background: #26C9FF  top center no-repeat fixed;
    height: 300px;
    overflow: hidden;
    z-index: -50;
}
}

@media only screen and (min-width:651px) and (max-width:850px){
#rotating-section{
    position: relative;
    background: #26C9FF  top center no-repeat fixed;
    height: 340px;
    overflow: hidden;
	z-index: -50;
}
}

@media only screen and (min-width:850px) {
#rotating-section{
    position: relative;
    background: #26C9FF  top center no-repeat fixed;
    height: 340px;
    overflow: hidden;
    z-index: -50;
}
}

#rotating-animation{
    z-index: -50;
}

.rect1,.rect2,.rect3,.rect4{
		position:absolute;
		width:100px;
		height:100px;
		bottom:-150px;
		background:#fff;
		-webkit-animation: mymove2 4s linear infinite;
}

.rect1{left:50%;z-index: -50;}
.rect2{left:10%;-webkit-animation-delay:0.3s;z-index: -50;}
.rect3{left:25%;-webkit-animation-delay:2s;z-index: -50;}
.rect4{left:85%;-webkit-animation-delay:1s;z-index: -50;}


.rect5,.rect6,.rect7,.rect8{
		position:absolute;
		width:50px;
		height:50px;
		background:#fff;
		bottom:-150px;
		-webkit-animation: mymove2 4s linear infinite;	
}

.rect5{left:0%;z-index: -50;}
.rect6{left:15%;-webkit-animation-delay:2.2s;z-index: -50;}
.rect7{left:45%;-webkit-animation-delay:0.8s;z-index: -50;}
.rect8{left:77%;-webkit-animation-delay:1.4s;z-index: -50;}


.rect9,.rect10{
		position:absolute;
        width: 180px;
        height: 180px;
        border: 60px solid #FFFFFF;
        -webkit-border-radius: 180px;
        -moz-border-radius: 180px;
        -o-border-radius: 180px;
		bottom:-350px;
		border-radius:50%;
		-webkit-animation: mymove3 5s linear infinite;	
}

.rect9{left:3%;z-index: -50;}
.rect10{left:95%;-webkit-animation-delay:0s;z-index: -50;}

.rect13,.rect14{
    position: absolute;
    width: 0px;
    height: 0px;
    border: solid 40px transparent;
    border-bottom: solid 40px #fff;
    bottom: -147px;
    -webkit-animation: mymove4 4s linear infinite;
}


.rect13{left:45%;border-bottom:solid 65px #fff;-webkit-animation-delay:0.6s;z-index: -50;}
.rect14{left:72%;border-bottom:solid 120px #fff;-webkit-animation:mymove5 6s liner infinte;-webkit-animation-delay:1s;z-index: -50;}


.rect11,.rect12{
    position: absolute;
    width: 0px;
    height: 0px;
    border: solid 40px transparent;
    border-bottom: solid 40px #fff;
    bottom: -150px;
    -webkit-animation: mymove5 4s linear infinite;
}

.rect11{left:30%;z-index: -50;}
.rect12{left:65%;border-bottom:solid 60px #fff;-webkit-animation-delay:1.3s;z-index: -50;}

.rect15{
    position: absolute;
    width: 100px;
    height: 400px;
    background: #fff;
    bottom: -401px;
    -webkit-animation: mymove3 6s linear infinite;
}

.rect15{
    left: 480px;
    z-index: -50;
}


.rect17{
    position: absolute;
    width: 150px;
    height: 150px;
    background: #fff;
    bottom: -402px;
    left: -3px;
	}

@-webkit-keyframes mymove2{
	
	0%{	transform:rortate(0deg);opacity:1;z-index: -50;}
	100%{transform:rotate(540deg);opacity:0;bottom:340px;z-index: -50;}
	}

@-webkit-keyframes mymove3{
	
	0%{	transform:rortate(0deg);opacity:1;z-index: -50;}
	100%{transform:rotate(720deg);opacity:0;bottom:540px;z-index: -50;}
	}

@-webkit-keyframes mymove4{	
	0%{	transform:rortate(0deg);opacity:1;z-index: -50;}
	100%{transform:rotate(720deg);opacity:0;bottom:540px;z-index: -50;}
	}

@-webkit-keyframes mymove5{	
	0%{	opacity:1;}
	100%{opacity:0;bottom:540px;z-index: -50;}
	}