Spaces:
Sleeping
Sleeping
:root { | |
--green: #00ff9d; | |
--orange: #ff9900; | |
--bg-dark: #0a0a0a; | |
} | |
body, html { | |
margin: 0; | |
padding: 0; | |
overflow: hidden; | |
background-color: var(--bg-dark); | |
font-family: 'Orbitron', sans-serif; | |
} | |
.fullscreen-bg { | |
position: relative; | |
width: 100vw; | |
height: 100vh; | |
background: radial-gradient(circle at center, #001a12, #000000); | |
} | |
#molecule-canvas { | |
position: absolute; | |
top: 0; left: 0; | |
width: 100%; height: 100%; | |
z-index: 0; | |
} | |
.centered { | |
position: absolute; | |
top: 50%; left: 50%; | |
transform: translate(-50%, -50%); | |
text-align: center; | |
z-index: 1; | |
} | |
.title { | |
font-size: 3em; | |
color: var(--green); | |
text-shadow: 0 0 20px var(--green); | |
} | |
#enter-btn { | |
padding: 15px 40px; | |
font-size: 1.5em; | |
background: var(--green); | |
color: black; | |
border: none; | |
cursor: pointer; | |
border-radius: 8px; | |
box-shadow: 0 0 20px var(--green); | |
animation: pulse 1.5s infinite; | |
} | |
#enter-btn:hover { | |
background: var(--orange); | |
box-shadow: 0 0 20px var(--orange); | |
} | |
0% { box-shadow: 0 0 10px var(--green); } | |
50% { box-shadow: 0 0 30px var(--green); } | |
100% { box-shadow: 0 0 10px var(--green); } | |
} | |