/* Animazioni */ .titolo { animation: fadeIn 2s ease-in-out; } @keyframes fadeIn { 0% { opacity: 0; will-change: opacity;} 100% { opacity: 1; will-change: opacity;} } #spade-animazione { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: black; display: flex; justify-content: center; align-items: center; z-index: 9999; transition: opacity 0.5s ease-in-out; /* Durata ridotta a 0.5 secondi */ } #spade-animazione img { width: auto; max-width: 80%; height: auto; position: static; transform: none; transition: opacity 0.5s ease-in-out; /* Durata ridotta a 0.5 secondi */ } /* Animazione di apertura */ #spade-animazione.apertura img { animation: spada-apertura 0.5s ease-in-out forwards; /* Durata ridotta a 0.5 secondi */ } @keyframes spada-apertura { to { opacity: 0; } } /* Animazione di chiusura */ #spade-animazione.chiusura img { animation: spada-chiusura 0.5s ease-in-out forwards; /* Durata ridotta a 0.5 secondi */ } @keyframes spada-chiusura { from { opacity: 0; } to { opacity: 1; } }