MediaWiki:Common.css
Zur Navigation springen
Zur Suche springen
Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.
- Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
- Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
- Internet Explorer/Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
- Opera: Strg+F5
:root {\\n --submers-deep: #06283d;\\n --submers-blue: #00a9e0;\\n --submers-cyan: #22d3ee;\\n --submers-green: #7dd3a8;\\n --submers-paper: #f8fbfc;\\n}\\nbody.mediawiki {\\n background:\\n radial-gradient(circle at 12% 8%, rgba(34,211,238,.20), transparent 24rem),\\n linear-gradient(135deg, #e9fbff 0%, #eef7f2 45%, #e8e0ff 100%);\\n}\\n#content, .mw-body {\\n border-radius: 0 0 18px 18px;\\n box-shadow: 0 18px 45px rgba(6,40,61,.12);\\n}\\n#siteNotice { margin: 0 0 1.2rem 0; }\\n#siteNotice .mw-dismissable-notice-close { z-index: 5; }\\n.submers-hero {\\n margin: -1.1rem -1.5rem 1.4rem -1.5rem;\\n border-radius: 0 0 24px 24px;\\n overflow: visible;\\n color: #fff;\\n background:\\n linear-gradient(120deg, rgba(6,40,61,.92), rgba(8,145,178,.74), rgba(4,120,87,.72)),\\n image-set(url('/resources/assets/submers/hero-crayfish.jpg') 1x);\\n background-size: cover;\\n background-position: center 42%;\\n box-shadow: 0 20px 55px rgba(6,40,61,.28);\\n position: relative;\\n}\\n.submers-hero::after {\\n content: '';\\n position: absolute;\\n inset: auto 4% -14px 4%;\\n height: 28px;\\n background: radial-gradient(ellipse at center, rgba(6,40,61,.25), transparent 65%);\\n filter: blur(8px);\\n pointer-events: none;\\n}\\n.submers-hero__overlay {\\n padding: 1.2rem 1.35rem 1rem;\\n backdrop-filter: saturate(120%);\\n}\\n.submers-hero__brand {\\n display: flex;\\n align-items: center;\\n gap: 1rem;\\n min-height: 120px;\\n}\\n.submers-hero__logo {\\n width: 106px;\\n height: 106px;\\n object-fit: contain;\\n flex: 0 0 auto;\\n filter: drop-shadow(0 12px 20px rgba(0,0,0,.35));\\n}\\n.submers-hero__kicker {\n display: block;\\n font-size: .82rem;\\n letter-spacing: .14em;\\n text-transform: uppercase;\\n color: #cffafe;\\n font-weight: 700;\\n}\\n.submers-hero__title {\n display: block;\\n font-size: clamp(2.1rem, 5vw, 4.4rem);\\n line-height: .95;\\n font-weight: 900;\\n letter-spacing: -.04em;\\n text-shadow: 0 4px 18px rgba(0,0,0,.35);\\n}\\n.submers-hero__subtitle {\n display: block;\\n margin-top: .45rem;\\n font-size: clamp(1rem, 1.5vw, 1.25rem);\\n color: #ecfeff;\\n max-width: 52rem;\\n}\\n.submers-topnav {\\n display: flex;\\n flex-wrap: wrap;\\n gap: .55rem;\\n margin-top: .8rem;\\n}\\n.submers-navgroup {\\n position: relative;\\n display: inline-flex;\\n align-items: center;\\n gap: .35rem;\\n min-height: 2.25rem;\\n padding: .35rem .55rem;\\n border: 1px solid rgba(255,255,255,.20);\\n border-radius: 999px;\\n background: rgba(255,255,255,.13);\\n box-shadow: inset 0 1px 0 rgba(255,255,255,.16);\\n}\\n.submers-navgroup > span:first-child {\\n font-weight: 850;\\n color: #fff;\\n padding: .15rem .45rem;\\n border-radius: 999px;\\n background: rgba(6,40,61,.55);\\n}\\n.submers-navgroup a {\\n color: #e0fbff !important;\\n text-decoration: none;\\n padding: .18rem .42rem;\\n border-radius: 999px;\\n white-space: nowrap;\\n font-weight: 650;\\n}\\n.submers-navgroup a:hover, .submers-navgroup a:focus {\\n color: #06283d !important;\\n background: #a7f3d0;\\n text-decoration: none;\\n}\\n.mw-wiki-logo {\\n background-size: contain !important;\\n filter: drop-shadow(0 10px 20px rgba(6,40,61,.22));\\n}\\n.submers-taxobox {\\n width: min(850px, 100%);\\n margin: 1.6rem auto 1.3rem;\\n border-collapse: separate;\\n border-spacing: 0;\\n overflow: hidden;\\n border: 1px solid rgba(6,40,61,.22);\\n border-radius: 16px;\\n box-shadow: 0 14px 35px rgba(6,40,61,.13);\\n background: #fff;\\n}\\n.submers-taxobox th,\\n.submers-taxobox td {\\n padding: .62rem .85rem;\\n border-bottom: 1px solid rgba(6,40,61,.13);\\n vertical-align: top;\\n}\\n.submers-taxobox tr:last-child td { border-bottom: 0; }\\n.submers-taxobox__title th {\\n text-align: center;\\n color: #ecfeff;\\n background: linear-gradient(90deg, #075985, #06b6d4 55%, #10b981);\\n font-size: 1.05rem;\\n letter-spacing: .04em;\\n}\\n.submers-taxobox__head th {\\n color: #083344;\\n background: linear-gradient(180deg, #dff7ff, #eefdf5);\\n text-align: center;\\n font-weight: 850;\\n}\\n.submers-taxobox__data td { background: rgba(248,251,252,.92); }\\n.submers-fundortbox {\\n width: min(360px, 90%);\\n margin: .6rem auto 1.3rem;\\n border: 1px solid rgba(6,40,61,.22);\\n border-radius: 999px;\\n overflow: hidden;\\n box-shadow: 0 10px 24px rgba(6,40,61,.10);\\n}\\n.submers-fundortbox td {\\n padding: .45rem 1rem;\\n text-align: center;\\n font-weight: 850;\\n color: #083344;\\n background: linear-gradient(90deg, #bbf7d0, #bfdbfe);\\n}\\n.gallery, ul.gallery {\\n clear: both;\\n}\\n@media (max-width: 900px) {\\n .submers-hero { margin-left: -.5rem; margin-right: -.5rem; }\\n .submers-hero__brand { align-items: flex-start; min-height: auto; }\\n .submers-hero__logo { width: 78px; height: 78px; }\\n .submers-navgroup { border-radius: 18px; align-items: flex-start; flex-wrap: wrap; }\\n}
/* SubmersWiki first-pass visual hardening: MediaWiki/Vector overrides */
#siteNotice .submers-hero,
.mw-body #siteNotice .submers-hero {
color: #ecfeff !important;
}
#siteNotice .submers-hero__brand {
display: flex !important;
align-items: center !important;
gap: 1.05rem !important;
max-width: 840px !important;
min-height: 112px !important;
margin: 0 auto 1.1rem auto !important;
padding: 1rem 1.4rem !important;
border: 1px solid rgba(255,255,255,.22) !important;
border-radius: 22px !important;
background: linear-gradient(135deg, rgba(6,40,61,.72), rgba(6,182,212,.20)) !important;
box-shadow: 0 18px 40px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.18) !important;
backdrop-filter: blur(6px) saturate(130%) !important;
}
#siteNotice .submers-hero__logo {
display: inline-block !important;
width: 104px !important;
height: 104px !important;
flex: 0 0 104px !important;
background: url('/resources/assets/submers/submers-logo.svg') center / contain no-repeat !important;
}
#siteNotice .submers-hero__copy {
display: flex !important;
flex-direction: column !important;
gap: .18rem !important;
color: #ecfeff !important;
}
#siteNotice .submers-hero__kicker {
display: block !important;
color: #a5f3fc !important;
font-size: .83rem !important;
font-weight: 800 !important;
letter-spacing: .16em !important;
text-transform: uppercase !important;
text-shadow: 0 2px 12px rgba(0,0,0,.48) !important;
}
#siteNotice .submers-hero__title {
display: block !important;
color: #ffffff !important;
font-size: clamp(2.4rem, 5vw, 4.8rem) !important;
line-height: .95 !important;
font-weight: 950 !important;
letter-spacing: -.045em !important;
text-shadow: 0 5px 22px rgba(0,0,0,.55) !important;
}
#siteNotice .submers-hero__subtitle {
display: block !important;
color: #dcfce7 !important;
font-size: clamp(1rem, 1.45vw, 1.25rem) !important;
font-weight: 650 !important;
text-shadow: 0 2px 12px rgba(0,0,0,.45) !important;
}
#siteNotice .submers-topnav {
max-width: 900px !important;
margin: .6rem auto 0 auto !important;
padding: .85rem !important;
border-radius: 22px !important;
background: rgba(6,40,61,.55) !important;
border: 1px solid rgba(255,255,255,.20) !important;
box-shadow: 0 18px 36px rgba(0,0,0,.22) !important;
}
#siteNotice .submers-navgroup {
color: #e0fbff !important;
background: rgba(255,255,255,.10) !important;
border: 1px solid rgba(255,255,255,.22) !important;
}
#siteNotice .submers-navgroup > span:first-child {
color: #06283d !important;
background: linear-gradient(90deg, #a7f3d0, #67e8f9) !important;
}
#siteNotice .submers-navgroup a {
color: #ecfeff !important;
text-shadow: 0 1px 5px rgba(0,0,0,.35) !important;
}
#siteNotice .submers-navgroup a:hover,
#siteNotice .submers-navgroup a:focus {
color: #06283d !important;
background: #bbf7d0 !important;
text-shadow: none !important;
}