@keyframes gradientShift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } body { background: linear-gradient(135deg, #0f172a, #0e7490, #065f46, #064e3b); background-size: 400% 400%; animation: gradientShift 15s ease infinite; font-family: system-ui, sans-serif; } .glass { background: rgba(255, 255, 255, 0.07); border-radius: 1rem; border: 1px solid rgba(255, 255, 255, 0.12); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); } .loading { display: inline-block; width: 1rem; height: 1rem; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: spin 0.8s linear infinite; margin-left: 0.5rem; } @keyframes spin { to { transform: rotate(360deg); } } .glass:hover { transform: scale(1.05); box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3); background: rgba(255, 255, 255, 0.15); }
MGZon Chatbot Logo by Mark Al-Asfar

Register for MGZon Chatbot

Sign Up with Google Sign Up with GitHub

Already have an account? Login