@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:300,400);*{margin:0;padding:0}#section01{background:url(https://picsum.photos/1200/800?image=575) center center/cover no-repeat}#section02{background:url(https://picsum.photos/1200/800?image=1016) center center/cover no-repeat}#section03{background:url(https://picsum.photos/1200/800?image=869) center center/cover no-repeat}#section04{background:url(https://picsum.photos/1200/800?image=506) center center/cover no-repeat}#section05{background:url(https://picsum.photos/1200/800?image=1037) center center/cover no-repeat}#section06{background:url(https://picsum.photos/1200/800?image=901) center center/cover no-repeat}#section07{background:url(https://picsum.photos/1200/800?image=675) center center/cover no-repeat}#section08{background:url(https://picsum.photos/1200/800?image=1050) center center/cover no-repeat}#section09{background:url(https://picsum.photos/1200/800?image=902) center center/cover no-repeat}#section10{background:url(https://picsum.photos/1200/800?image=516) center center/cover no-repeat}.demo a{position:absolute;bottom:20px;left:50%;z-index:9999;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacing:.1em;text-decoration:none;transition:opacity .3s}.demo a:hover{opacity:.5}#section01 a{padding-top:60px}#section01 a span{position:absolute;top:0;left:50%;width:24px;height:24px;margin-left:-12px;border-left:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);box-sizing:border-box}#section02 a{padding-top:60px}#section02 a span{position:absolute;top:0;left:50%;width:46px;height:46px;margin-left:-23px;border:1px solid #fff;border-radius:100%;box-sizing:border-box}#section02 a span::after{position:absolute;top:50%;left:50%;content:'';width:16px;height:16px;margin:-12px 0 0 -8px;border-left:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);box-sizing:border-box}#section03 a{padding-top:60px}#section03 a span{position:absolute;top:0;left:50%;width:46px;height:46px;margin-left:-23px;border:1px solid #fff;border-radius:100%;box-sizing:border-box}#section03 a span::after{position:absolute;top:50%;left:50%;content:'';width:16px;height:16px;margin:-12px 0 0 -8px;border-left:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);box-sizing:border-box}#section03 a span::before{position:absolute;top:0;left:0;z-index:9999;content:'';width:44px;height:44px;box-shadow:0 0 0 0 rgba(255,255,255,.1);border-radius:100%;opacity:0;-webkit-animation:sdb03 3s infinite;animation:sdb03 3s infinite;box-sizing:border-box}sdb03{0% {opacity:0;}30% {opacity:1;}60% {box-shadow:0 0 0 60px rgba(255,255,255,.1);opacity:0;}100% {opacity:0;}}sdb03{0% {opacity:0;}30% {opacity:1;}60% {box-shadow:0 0 0 60px rgba(255,255,255,.1);opacity:0;}100% {opacity:0;}}#section04 a{padding-top:100px}#section04 a span{position:absolute;top:0;left:50%;width:24px;height:24px;margin-left:-12px;border-left:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-animation:sdb04 2s infinite;animation:sdb04 2s infinite;box-sizing:border-box}sdb04{0% {-webkit-transform:rotate(-45deg)translate(0,0);}20% {-webkit-transform:rotate(-45deg)translate(-10px,10px);}40% {-webkit-transform:rotate(-45deg)translate(0,0);}}sdb04{0% {transform:rotate(-45deg)translate(0,0);}20% {transform:rotate(-45deg)translate(-10px,10px);}40% {transform:rotate(-45deg)translate(0,0);}}#section05 a{padding-top:70px}#section05 a span{position:absolute;top:0;left:50%;width:24px;height:24px;margin-left:-12px;border-left:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-animation:sdb05 1.5s infinite;animation:sdb05 1.5s infinite;box-sizing:border-box}sdb05{0% {-webkit-transform:rotate(-45deg)translate(0,0);opacity:0;}50% {opacity:1;}100% {-webkit-transform:rotate(-45deg)translate(-20px,20px);opacity:0;}}sdb05{0% {transform:rotate(-45deg)translate(0,0);opacity:0;}50% {opacity:1;}100% {transform:rotate(-45deg)translate(-20px,20px);opacity:0;}}#section06 a{padding-top:70px}#section06 a span{position:absolute;top:0;left:50%;width:24px;height:24px;margin-left:-12px;border-left:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:rotateZ(-45deg);transform:rotateZ(-45deg);-webkit-animation:sdb06 1.5s infinite;animation:sdb06 1.5s infinite;box-sizing:border-box}sdb06{0% {-webkit-transform:rotateY(0)rotateZ(-45deg)translate(0,0);opacity:0;}50% {opacity:1;}100% {-webkit-transform:rotateY(720deg)rotateZ(-45deg)translate(-20px,20px);opacity:0;}}sdb06{0% {transform:rotateY(0)rotateZ(-45deg)translate(0,0);opacity:0;}50% {opacity:1;}100% {transform:rotateY(720deg)rotateZ(-45deg)translate(-20px,20px);opacity:0;}}#section07 a{padding-top:80px}#section07 a span{position:absolute;top:0;left:50%;width:24px;height:24px;margin-left:-12px;border-left:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-animation:sdb07 2s infinite;animation:sdb07 2s infinite;opacity:0;box-sizing:border-box}#section07 a span:nth-of-type(1){-webkit-animation-delay:0s;animation-delay:0s}#section07 a span:nth-of-type(2){top:16px;-webkit-animation-delay:.15s;animation-delay:.15s}#section07 a span:nth-of-type(3){top:32px;-webkit-animation-delay:.3s;animation-delay:.3s}sdb07{0% {opacity:0;}50% {opacity:1;}100% {opacity:0;}}sdb07{0% {opacity:0;}50% {opacity:1;}100% {opacity:0;}}#section08 a{padding-top:60px}#section08 a span{position:absolute;top:0;left:50%;width:30px;height:50px;margin-left:-15px;border:2px solid #fff;border-radius:50px;box-sizing:border-box}#section08 a span::before{position:absolute;top:10px;left:50%;content:'';width:6px;height:6px;margin-left:-3px;background-color:#fff;border-radius:100%;box-sizing:border-box}#section09 a{padding-top:80px}#section09 a span{position:absolute;top:0;left:50%;width:30px;height:50px;margin-left:-15px;border:2px solid #fff;border-radius:50px;box-sizing:border-box}#section09 a span::before{position:absolute;top:10px;left:50%;content:'';width:6px;height:6px;margin-left:-3px;background-color:#fff;border-radius:100%;box-sizing:border-box}#section09 a span::after{position:absolute;bottom:-18px;left:50%;width:18px;height:18px;content:'';margin-left:-9px;border-left:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);box-sizing:border-box}#section10 a{padding-top:60px}#section10 a span{position:absolute;top:0;left:50%;width:30px;height:50px;margin-left:-15px;border:2px solid #fff;border-radius:50px;box-sizing:border-box}#section10 a span::before{position:absolute;top:10px;left:50%;content:'';width:6px;height:6px;margin-left:-3px;background-color:#fff;border-radius:100%;-webkit-animation:sdb10 2s infinite;animation:sdb10 2s infinite;box-sizing:border-box}sdb10{0% {-webkit-transform:translate(0,0);opacity:0;}40% {opacity:1;}80% {-webkit-transform:translate(0,20px);opacity:0;}100% {opacity:0;}}sdb10{0% {transform:translate(0,0);opacity:0;}40% {opacity:1;}80% {transform:translate(0,20px);opacity:0;}100% {opacity:0;}}