More actions
mNo edit summary |
mNo edit summary |
||
| (29 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
#neo-europa-homepage { | |||
background: #0b0b0b; | |||
color: #ccc; | |||
padding: 2em; | |||
} | |||
#neo-europa-homepage { | |||
opacity: 0; | |||
animation: fadeIn 2s ease-in forwards; | |||
} | |||
@keyframes fadeIn { | |||
to { opacity: 1; } | |||
} | |||
#neo-europa-homepage .panel:hover { | |||
box-shadow: 0 0 12px rgba(0, 255, 255, 0.2); | |||
transform: scale(1.02); | |||
transition: transform 0.2s ease, box-shadow 0.2s ease; | |||
} | |||
.panel-header { | |||
font-family: 'Orbitron', sans-serif; | |||
font-weight: 700; | |||
letter-spacing: 1px; | |||
text-transform: none; | |||
color: #00ffff; | |||
} | |||
.panel-tech { | |||
background: | |||
linear-gradient(rgba(27,27,27,0.80), rgba(27,27,27,0.80)), | |||
url('images/panel-BG.jpg'); | |||
background-size: cover; | |||
background-repeat: no-repeat; | |||
background-position: center; | |||
border: 1px solid #00ccff; | |||
} | |||
#neo-europa-homepage img { | |||
animation: pulseGlow 4s infinite alternate ease-in-out; | |||
} | |||
@keyframes pulseGlow { | |||
0% { filter: drop-shadow(0 0 5px #0ff); } | |||
100% { filter: drop-shadow(0 0 12px #0ff); } | |||
} | |||
body::before { | |||
content: ""; | |||
position: fixed; | |||
top: 0; left: 0; | |||
width: 100%; height: 100%; | |||
background: repeating-linear-gradient( | |||
0deg, | |||
rgba(255,255,255,0.01), | |||
rgba(255,255,255,0.01) 1px, | |||
transparent 1px, | |||
transparent 2px | |||
); | |||
pointer-events: none; | |||
z-index: 1; | |||
animation: flicker 2s infinite; | |||
} | |||
@keyframes flicker { | |||
0%, 100% { opacity: 0.04; } | |||
50% { opacity: 0.06; } | |||
} | |||
/* Flicker effect for redlinks (nonexistent pages) */ | |||
a.new { | |||
color: #ff0066; | |||
animation: flicker 1.2s infinite alternate; | |||
text-shadow: 0 0 2px #ff0066; | |||
font-weight: bold; | |||
} | |||
@keyframes flicker { | |||
0% { opacity: 1; text-shadow: 0 0 2px #ff0066; } | |||
25% { opacity: 0.4; text-shadow: 0 0 6px #ff3388; } | |||
50% { opacity: 0.8; text-shadow: 0 0 1px #ff0066; } | |||
75% { opacity: 0.3; text-shadow: 0 0 5px #ff0055; } | |||
100% { opacity: 1; text-shadow: 0 0 3px #ff0066; } | |||
} | |||
.cyberpunk-link { | |||
color: #00ffff; | |||
text-shadow: none; | |||
} | |||
.cyberpunk-link:hover, | |||
.cyberpunk-link:focus, | |||
.cyberpunk-link:active { | |||
text-shadow: 0 0 5px #00ffff, 0 0 12px #00ffff; | |||
color: #00ffff; | |||
} | |||
.topnav { | .topnav { | ||
background-color: #1a1a1a; | background-color: #1a1a1a; | ||
| Line 41: | Line 137: | ||
} | } | ||
.tile | .logo-grid-menu { | ||
transition: box-shadow 0.3s ease, transform 0. | display: grid; | ||
grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); | |||
gap: 20px; | |||
justify-items: center; | |||
align-items: center; | |||
padding: 20px; | |||
} | |||
.logo-tile img { | |||
display: block; | |||
border-radius: 8px; | |||
transition: box-shadow 0.3s ease, transform 0.2s ease; | |||
} | } | ||
.tile | |||
box-shadow: 0 0 12px | .logo-tile:hover img { | ||
box-shadow: 0 0 12px rgba(0, 255, 255, 0.8); | |||
transform: scale(1.05); | transform: scale(1.05); | ||
} | |||
.alliance-table-wrapper { | |||
overflow-x: auto; | |||
margin: 1em 0; | |||
} | |||
.alliance-table { | |||
width: 100%; | |||
border-collapse: collapse; | |||
font-family: 'Orbitron', sans-serif; | |||
background-color: #101010; | |||
color: #e0e0e0; | |||
} | |||
.alliance-table caption { | |||
text-align: left; | |||
font-size: 1.2em; | |||
color: #00ffff; | |||
margin-bottom: 0.5em; | |||
} | |||
.alliance-table thead { | |||
background-color: #1a1a1a; | |||
} | |||
.alliance-table th, .alliance-table td { | |||
border: 1px solid #333; | |||
padding: 0.75em; | |||
text-align: center; | |||
} | |||
.alliance-table tbody tr:hover { | |||
background-color: #222; | |||
box-shadow: inset 0 0 15px #00ffff40; | |||
transition: background 0.2s ease; | |||
} | |||
.alliance-table td:first-child { | |||
color: #ffaa00; | |||
font-weight: bold; | |||
} | |||
div[style*="border: 1px"] { | |||
transition: transform 0.2s ease, box-shadow 0.3s ease; | |||
} | |||
div[style*="border: 1px"]:hover { | |||
box-shadow: 0 0 10px rgba(0,255,255,0.4); | |||
transform: scale(1.02); | |||
} | } | ||
#footer-info-lastmod { display: none; } | #footer-info-lastmod { display: none; } | ||
Latest revision as of 01:33, 9 June 2025
/* CSS placed here will be applied to all skins */
#neo-europa-homepage {
background: #0b0b0b;
color: #ccc;
padding: 2em;
}
#neo-europa-homepage {
opacity: 0;
animation: fadeIn 2s ease-in forwards;
}
@keyframes fadeIn {
to { opacity: 1; }
}
#neo-europa-homepage .panel:hover {
box-shadow: 0 0 12px rgba(0, 255, 255, 0.2);
transform: scale(1.02);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.panel-header {
font-family: 'Orbitron', sans-serif;
font-weight: 700;
letter-spacing: 1px;
text-transform: none;
color: #00ffff;
}
.panel-tech {
background:
linear-gradient(rgba(27,27,27,0.80), rgba(27,27,27,0.80)),
url('images/panel-BG.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
border: 1px solid #00ccff;
}
#neo-europa-homepage img {
animation: pulseGlow 4s infinite alternate ease-in-out;
}
@keyframes pulseGlow {
0% { filter: drop-shadow(0 0 5px #0ff); }
100% { filter: drop-shadow(0 0 12px #0ff); }
}
body::before {
content: "";
position: fixed;
top: 0; left: 0;
width: 100%; height: 100%;
background: repeating-linear-gradient(
0deg,
rgba(255,255,255,0.01),
rgba(255,255,255,0.01) 1px,
transparent 1px,
transparent 2px
);
pointer-events: none;
z-index: 1;
animation: flicker 2s infinite;
}
@keyframes flicker {
0%, 100% { opacity: 0.04; }
50% { opacity: 0.06; }
}
/* Flicker effect for redlinks (nonexistent pages) */
a.new {
color: #ff0066;
animation: flicker 1.2s infinite alternate;
text-shadow: 0 0 2px #ff0066;
font-weight: bold;
}
@keyframes flicker {
0% { opacity: 1; text-shadow: 0 0 2px #ff0066; }
25% { opacity: 0.4; text-shadow: 0 0 6px #ff3388; }
50% { opacity: 0.8; text-shadow: 0 0 1px #ff0066; }
75% { opacity: 0.3; text-shadow: 0 0 5px #ff0055; }
100% { opacity: 1; text-shadow: 0 0 3px #ff0066; }
}
.cyberpunk-link {
color: #00ffff;
text-shadow: none;
}
.cyberpunk-link:hover,
.cyberpunk-link:focus,
.cyberpunk-link:active {
text-shadow: 0 0 5px #00ffff, 0 0 12px #00ffff;
color: #00ffff;
}
.topnav {
background-color: #1a1a1a;
overflow: hidden;
padding: 10px;
text-align: center;
}
.topnav a {
display: inline-block;
color: #eaeaea;
text-align: center;
padding: 10px 20px;
text-decoration: none;
font-family: 'Segoe UI', sans-serif;
font-weight: bold;
font-size: 15px;
}
.topnav a:hover {
background-color: #444;
color: #fff;
border-radius: 5px;
}
.infobox {
border-collapse: collapse;
background-color: #000000;
color: white;
margin: 0.5em 0 0.5em 1em;
padding: 0.4em;
float: right;
clear: right;
}
.infobox th {
background-color: #000000;
padding: 0.25em;
}
.infobox td {
padding: 0.25em;
}
.logo-grid-menu {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
gap: 20px;
justify-items: center;
align-items: center;
padding: 20px;
}
.logo-tile img {
display: block;
border-radius: 8px;
transition: box-shadow 0.3s ease, transform 0.2s ease;
}
.logo-tile:hover img {
box-shadow: 0 0 12px rgba(0, 255, 255, 0.8);
transform: scale(1.05);
}
.alliance-table-wrapper {
overflow-x: auto;
margin: 1em 0;
}
.alliance-table {
width: 100%;
border-collapse: collapse;
font-family: 'Orbitron', sans-serif;
background-color: #101010;
color: #e0e0e0;
}
.alliance-table caption {
text-align: left;
font-size: 1.2em;
color: #00ffff;
margin-bottom: 0.5em;
}
.alliance-table thead {
background-color: #1a1a1a;
}
.alliance-table th, .alliance-table td {
border: 1px solid #333;
padding: 0.75em;
text-align: center;
}
.alliance-table tbody tr:hover {
background-color: #222;
box-shadow: inset 0 0 15px #00ffff40;
transition: background 0.2s ease;
}
.alliance-table td:first-child {
color: #ffaa00;
font-weight: bold;
}
div[style*="border: 1px"] {
transition: transform 0.2s ease, box-shadow 0.3s ease;
}
div[style*="border: 1px"]:hover {
box-shadow: 0 0 10px rgba(0,255,255,0.4);
transform: scale(1.02);
}
#footer-info-lastmod { display: none; }