body{margin:auto;font-family:-apple-system,BlinkMacSystemFont,sans-serif;overflow:auto;animation:gradient 15s ease infinite;background-size:400% 400%;background-attachment:fixed}.wrapper{height:100%;width:100%;background:linear-gradient(135deg,#61aff1,#e0f3ff);position:absolute}.wrapper h1{top:50%;left:50%;transform:translate(-50%,-50%);position:absolute;font-family:sans-serif;letter-spacing:1px;word-spacing:2px;color:#fff;font-size:40px;font-weight:888;text-transform:uppercase}.wrapper .saleh{height:60px;width:60px;border:2px solid rgba(255,255,255,.7);border-radius:50px;position:absolute;top:10%;left:10%;animation:4s linear infinite}div .dot{height:10px;width:10px;border-radius:50px;background:#ffffff80;position:absolute;top:20%;right:20%}.wrapper .saleh:nth-child(1){top:20%;left:20%;animation:animate 8s linear infinite}.wrapper .saleh:nth-child(2){top:60%;left:80%;animation:animate 10s linear infinite}.wrapper .saleh:nth-child(3){top:40%;left:40%;animation:animate 3s linear infinite}.wrapper .saleh:nth-child(4){top:66%;left:30%;animation:animate 7s linear infinite}.wrapper .saleh:nth-child(5){top:90%;left:10%;animation:animate 9s linear infinite}.wrapper .saleh:nth-child(6){top:30%;left:60%;animation:animate 5s linear infinite}.wrapper .saleh:nth-child(7){top:70%;left:20%;animation:animate 8s linear infinite}.wrapper .saleh:nth-child(8){top:75%;left:60%;animation:animate 10s linear infinite}.wrapper .saleh:nth-child(9){top:50%;left:50%;animation:animate 6s linear infinite}.wrapper .saleh:nth-child(10){top:45%;left:20%;animation:animate 10s linear infinite}.wrapper .saleh:nth-child(11){top:10%;left:90%;animation:animate 9s linear infinite}.wrapper .saleh:nth-child(12){top:20%;left:70%;animation:animate 7s linear infinite}.wrapper .saleh:nth-child(13){top:20%;left:20%;animation:animate 8s linear infinite}.wrapper .saleh:nth-child(14){top:60%;left:5%;animation:animate 6s linear infinite}.wrapper .saleh:nth-child(15){top:90%;left:80%;animation:animate 9s linear infinite}@keyframes animate{0%{transform:scale(0) translateY(0) rotate(70deg)}to{transform:scale(1.3) translateY(-100px) rotate(360deg)}}.loader-container{display:flex;justify-content:center;align-items:center}.loader{border:5px solid #f3f3f3;border-top:5px solid #3498db;border-radius:50%;width:50px;height:50px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}