h1{font-size:4rem;font-family:arial,helvetica;color:#fff;margin:0;padding:0}.section{text-align:center}.section0,.section1,.section2,.section3{background-size:cover;overflow:hidden}.instro-bg{width:100%;padding:10px 0;background:rgba(0,0,0,.5)}.ball-cover{position:absolute;top:50%;left:50%;margin-left:-109px;margin-top:-362px}.ball{min-width:283px;min-height:316px}.guide{position:absolute;left:50%;bottom:20px;width:105px;height:100px;margin-left:-70px;background-image:url(../imgs/guide.png);background-repeat:no-repeat;background-position:0 0;background-size:100%;-webkit-transform:rotate(221deg);overflow:hidden}.guide a{display:block;width:105px;height:100px;overflow:hidden}.me{width:200px;height:200px;border:2px solid #fff;border-radius:50%;background-image:url(../imgs/me.png);background-repeat:no-repeat;background-position:0 -13px;background-size:100%}.teach{font-size:2.5em;color:#fff}.super-women{font-size:1.5em;color:#fff}.guide-one{position:absolute;left:50%;bottom:0;width:105px;height:100px;margin-left:-55px}.guide-one a{position:absolute;left:50%;bottom:20px;display:block;width:105px;height:100px;margin-left:-55px;background-image:url(../imgs/guide.png);background-repeat:no-repeat;background-position:0 0;background-size:100%;-webkit-transform:rotate(221deg);overflow:hidden}.total{margin:0 20px;padding-right:10px;padding-bottom:10px;text-align:left;border-radius:10px;background:rgba(0,0,0,.5);-webkit-transform:skew(0deg)}.total li{padding:10px 0 10px 20px;line-height:1.3;font-size:2.5em;color:#fff;opacity:1}.total li:nth-child(1){list-style:none;text-align:center}.guide-two{position:absolute;left:50%;bottom:0;width:105px;height:100px;margin-left:-55px}.guide-two a{position:absolute;left:50%;bottom:20px;display:block;width:105px;height:100px;margin-left:-55px;background-image:url(../imgs/guide.png);background-repeat:no-repeat;background-position:0 0;background-size:100%;overflow:hidden}.active{overflow:hidden}.active .ball-cover{-webkit-animation:ball-act 3s linear 1 alternate}.active .ball{-webkit-animation:ball 1s linear infinite alternate}.active .guide{-webkit-animation:guide 1s linear infinite alternate}.active .delay1{-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:4s}.active .delay2{-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:4.5s}.active .super-women{-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:5s}.active .guide-one{-webkit-animation:guideOne 3s ease-in 1 alternate}.active .guide-one a{-webkit-animation:guide 1s linear infinite alternate}.active .total{-webkit-animation-name:background;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:4s}.active .total li:nth-child(1){-webkit-animation-name:scaleFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:4.5s}.active .total li:nth-child(2){-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:5.5s}.active .total li:nth-child(3){-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:6s}.active .total li:nth-child(4){-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:6.5s}.active .total li:nth-child(5){-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:7s}.active .total li:nth-child(6){-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:7.5s}.active .total li:nth-child(7){-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:8s}.active .total li:nth-child(8){-webkit-animation-name:showFont;-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;-webkit-animation-delay:8.5s}.active .guide-two{-webkit-animation:guideOne 4s ease-in 1 alternate}.active .guide-two a{-webkit-animation:last-guide 4s linear 1}@-webkit-keyframes guide{from{bottom:100px}to{bottom:20px}}@-webkit-keyframes last-guide{from{-webkit-transform:rotate(221deg)}to{-webkit-transform:rotate(0deg)}}@-webkit-keyframes ball-act{0%{margin-top:-500px;left:0}48.5%{margin-top:-400px;left:40%}51.5%{margin-top:-400px;left:40%}100%{margin-top:-362px;left:50%}}@-webkit-keyframes ball{0%{-webkit-transform:rotate(-7deg)}100%{-webkit-transform:rotate(5deg)}}@-webkit-keyframes guideOne{from{bottom:100%}to{bottom:0}}@-webkit-keyframes scaleFont{from{opacity:0;-webkit-transform:scale(0.5)}to{opacity:1;-webkit-transform:scale(1)}}@-webkit-keyframes background{from{-webkit-transform:skew(20deg);background:rgba(0,0,0,0)}to{-webkit-transform:skew(0deg);background:rgba(0,0,0,.5)}}@-webkit-keyframes showFont{from{opacity:0}to{opacity:1}}