html,body{margin:0;font-size:16px}.clearfix:after{content:"";clear:both;display:table}.container{width:80%;max-width:1440px;margin:0 auto}.w100v{width:100vw}.w100{width:100%}.h100v{height:100vh}.h100{height:100%}.p0,.m0{margin:0!important}.grid{display:grid;grid-template-columns:1fr}.grid.gutter{column-gap:30px;row-gap:30px}.grid.grid-2{grid-template-columns:repeat(2,1fr)}.grid.grid-3{grid-template-columns:repeat(3,1fr)}.grid.grid-4{grid-template-columns:repeat(4,1fr)}.grid.grid-5{grid-template-columns:repeat(5,1fr)}.grid.grid-6{grid-template-columns:repeat(6,1fr)}@media (min-width: 768px) and (max-width: 1024px){.grid[class*=grid-]{grid-template-columns:1fr 1fr}.container{max-width:900px}}@media (max-width: 768px){.grid[class*=grid-]{grid-template-columns:1fr}.container{width:calc(100% - 30px);margin:0 auto}}.card{position:relative;box-sizing:border-box;margin:15px 50px;width:100%;height:500px;border-radius:4px;background-size:cover!important;background-position:center!important;display:flex;align-items:center;justify-content:center;padding:50px}.card.bg1{background:url(/_astro/shallow-focus-of-white-mushroom-painting-733107.60587a49.jpg)}.card.bg2{background:url(/_astro/concrete-road-surrounded-by-trees-831243.9c590d49.jpg)}.card__content{font-family:monospace;font-weight:600;color:#999;line-height:30px;font-size:1rem}.scroll-down{position:absolute;left:50%;width:75px;height:80px;text-align:center;text-decoration:none;cursor:pointer;bottom:0;transform:translate(-50%)}.scroll-down>label{pointer-events:none;font-family:monospace;font-weight:600;font-size:1.1rem;color:#dffffd}.scroll-down.arrow span{position:absolute;display:inline-block;top:20px;height:30px;width:2px;left:calc(50% - 1px);animation:animateArrow 1.5s infinite linear}@keyframes animateArrow{0%{transform:translateY(0)}to{transform:translateY(40px);opacity:0}}.scroll-down.arrow span:before,.scroll-down.arrow span:after{position:absolute;content:"";width:3px;height:100%;top:0;left:0;background:#fff;border-radius:3px}.scroll-down.arrow span:before{transform-origin:bottom;transform:rotate(-45deg)}.scroll-down.arrow span:after{transform-origin:bottom;margin-left:-1px;transform:rotate(45deg)}.scroll-down.arrows span{position:absolute;display:inline-block;top:20px;height:25px;width:2px;left:calc(50% - 1px);animation:animateArrows 1.25s infinite linear}@keyframes animateArrows{0%,40%,to{opacity:0}75%{opacity:1}}.scroll-down.arrows span:first-child{top:35px;animation-delay:0s}.scroll-down.arrows span:nth-child(2){top:35px;animation-delay:.33s}.scroll-down.arrows span:last-child{top:50px;animation-delay:.66s}.scroll-down.arrows span:before,.scroll-down.arrows span:after{position:absolute;content:"";width:3px;height:100%;top:0;left:0;background:#fff;border-radius:3px}.scroll-down.arrows span:before{transform-origin:bottom;transform:rotate(-45deg)}.scroll-down.arrows span:after{transform-origin:bottom;margin-left:-1px;transform:rotate(45deg)}.scroll-down.mouse{height:100px}.scroll-down.mouse span{position:relative;display:inline-block;width:30px;height:60px;border:2px solid #fff;border-radius:50px;top:5px}.scroll-down.mouse.effect1 span:after{position:absolute;content:"";top:10px;left:0;right:0;margin:0 auto;width:6px;height:6px;border-radius:100%;background:#fff;animation:animateMousePointer 1.5s infinite}@keyframes animateMousePointer{0%{transform:translateY(0)}50%{opacity:.7}to{opacity:0;transform:translateY(20px)}}.scroll-down.mouse.effect2 span:after{position:absolute;content:"";top:10px;left:0;right:0;margin:0 auto;width:2px;height:20px;border-radius:2px;background:#fff;animation:animateMouseScrollBar 1.5s infinite linear}@keyframes animateMouseScrollBar{0%{height:20px;top:10px}50%{height:0;top:30px}50.01%{top:10px}to{height:20px}}.card.shape{overflow:hidden}.card.shape:before,.card.shape:after{position:absolute;content:"";bottom:0;width:50%;height:100px;background-color:#fff;z-index:2}.card.shape:before{left:0;clip-path:polygon(0 50%,0% 100%,100% 100%)}.card.shape:after{left:50%;clip-path:polygon(100% 50%,0% 100%,100% 100%)}.scroll-down.semicircle span{position:absolute;width:100px;height:100px;left:-10px;border-radius:50%;background:#ffc2f0;bottom:-50px;display:inline-block;z-index:1}.scroll-down.semicircle span svg{position:absolute;left:0;right:0;margin:0 auto;top:15px;animation:animateLargeArrow 1.25s infinite linear}@keyframes animateLargeArrow{0%{opacity:0;top:0}25%,75%{opacity:1}50%{top:15px}to{opacity:0;top:30px}}.card.radius{border-radius:0 0 50% 50%/0 0 25% 25%;overflow:hidden}.card.radius .scroll-down .scroll-down__btn{position:absolute;bottom:0;left:50%;transform:translate(-50%);background:#ffc2f0;display:inline-block;padding:15px 60px;border:none;font-family:monospace;font-weight:600;border-radius:10px 10px 0 0;cursor:pointer}.card.radius .scroll-down .scroll-down__btn svg{position:absolute;top:5px;right:30px;animation:animateBtnArrow 1s infinite linear}@keyframes animateBtnArrow{0%,to{transform:translateY(5px)}50%{transform:translateY(10px)}}.scroll-down.pattern{height:100px}.scroll-down.pattern>label{display:inline-block;margin-bottom:10px}.scroll-down.pattern span{display:flex;flex-direction:column;width:100%;animation:animatePattern 1.5s infinite}.scroll-down.pattern span:nth-child(2){animation-delay:.1s}.scroll-down.pattern span:nth-child(3){animation-delay:.2s}.scroll-down.pattern span:nth-child(4){animation-delay:.3s}@keyframes animatePattern{0%{opacity:0}25%{opacity:1;transform:translateY(3px)}75%,to{opacity:0;transform:translateY(3px)}}.scroll-down.pattern.circle span img{margin-bottom:3px}