/* styles.css */ body { margin: 0; padding: 0; background: radial-gradient(circle, #000000, #1a1a1a); color: white; font-family: 'Courier New', Courier, monospace; overflow: hidden; } .black-hole-container { position: relative; width: 100%; height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: antiquewhite; } .black-hole { position: absolute; width: 250px; height: 250px; background: radial-gradient(circle, rgba(0, 0, 0, 0.8), #000000); border-radius: 50%; box-shadow: 0 0 80px 40px rgba(0, 0, 0, 0.7); animation: spin 2s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .content { opacity: 0; transform: translateY(30px); animation: fadeIn 2s ease-in-out forwards 0.5s; } @keyframes fadeIn { to { opacity: 1; transform: translateY(0); } } #name { font-size: 3.5rem; letter-spacing: 3px; margin-bottom: 10px; color: #bfbfbf; /* Grigio chiaro per armonizzare con il tema */ text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7); /* Ombra scura per contrasto */ font-weight: bold; } #subtitle { font-size: 1.5rem; margin-bottom: 30px; } #skills .icon-link { display: inline-flex; align-items: center; gap: 8px; font-size: 1.2rem; color: #ffffff; text-decoration: none; transition: color 0.3s ease; } #skills .icon-link i { font-size: 1.5rem; } #skills .icon-link:hover { color: #00c1ff; } #social-links .social-link { display: inline-flex; align-items: center; gap: 8px; font-size: 1.2rem; color: #ffffff; text-decoration: none; padding: 5px 10px; border: 1px solid #ffffff; border-radius: 5px; transition: all 0.3s ease; } #social-links .social-link i { font-size: 1.5rem; } #social-links .social-link:hover { color: #000000; background-color: #ffffff; }