File size: 1,246 Bytes
7d15772 c1cbe5d 7d15772 c1cbe5d 7d15772 c1cbe5d 7d15772 c1cbe5d 7d15772 c1cbe5d 7d15772 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
/* Basic Reset & Body Style */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background-color: #000011; /* Dark space blue */
color: #f0f0f0;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
overflow-x: hidden; /* Prevent horizontal scrollbar */
}
/* Three.js Canvas */
#bg {
position: fixed;
top: 0;
left: 0;
z-index: -1; /* Place canvas behind all other content */
}
/* Content Centering */
.content-wrapper {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
padding: 2rem;
}
/* Iframe Container Styling */
.iframe-container {
width: 90%;
max-width: 1200px;
background: rgba(0, 20, 30, 0.6); /* Semi-transparent background */
border: 1.5px solid #00ffff;
border-radius: 10px;
padding: 10px;
box-shadow:
0 0 10px rgba(0, 255, 255, 0.5),
0 0 25px rgba(0, 255, 255, 0.4),
0 0 50px rgba(0, 255, 255, 0.3),
inset 0 0 10px rgba(0, 255, 255, 0.3); /* Glowing effect */
backdrop-filter: blur(3px); /* Frosted glass effect */
-webkit-backdrop-filter: blur(3px);
}
iframe {
display: block;
border-radius: 5px; /* Match container's rounded corners */
} |