.scroll_box{width:40px;height:80px;display:flex;flex-direction:column;align-items:center;justify-content:center;bottom:60px;left:50%;transform:translateX(-50%);position:absolute;z-index:99}.scroll{width:26px;height:44px;display:flex;position:relative;animation:nudgeText 5s ease-out infinite}.scroll .mouse_on{width:100%;height:100%;border:2px solid #fff;border-radius:19px;box-sizing:border-box;position:absolute;top:0;left:0;animation:mouse_move 2s ease-out infinite}.scroll .mouse_off{width:100%;height:100%;border:2px solid rgba(255,255,255,0.5);border-radius:19px;box-sizing:border-box}.scroll::after{content:'';width:5px;height:5px;border-radius:50%;background:#fff;position:absolute;left:50%;transform:translateX(-50%);top:10px;animation:ball 2s linear infinite}.p{margin-top:8px !important;font-family:"Saira",sans-serif;letter-spacing:.4em;text-indent:.4em;color:#fff;font-size:12px;animation:colorText 5s ease-out infinite,nudgeText 5s ease-out infinite}@keyframes mouse_move{from{clip-path:inset(0 0 0 0);-webkit-clip-path:inset(0 0 0 0)}to{clip-path:inset(100% 0 0 0);-webkit-clip-path:inset(100% 0 0 0)}}@keyframes ball{0{top:10px;opacity:1}50%{top:28px;opacity:0}100%{top:10px;opacity:1}}@keyframes nudgeText{0{transform:translateY(0)}20%{transform:translateY(5px)}30%{transform:translateY(0)}50%{transform:translateY(5px)}60%{transform:translateY(0)}80%{transform:translateY(5px)}90%{transform:translateY(0)}}@keyframes colorText{21%{color:#4e5559}30%{color:#fff}51%{color:#4e5559}60%{color:#fff}81%{color:#4e5559}90%{color:#fff}}@media all and (max-width:768px){.scroll_box{bottom:40px}.scroll{width:20px;height:36px}.scroll::after{width:3px;height:3px}.p{font-size:10px}}@media all and (max-width:425px){.scroll_box{bottom:20px}}