MediaWiki:Common.css: Unterschied zwischen den Versionen
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| Zeile 1.035: | Zeile 1.035: | ||
/* | /* ------------------------------------------------- | ||
HERO-BEREICH (oben, whiskyfarbener ConanWiki-Style) | |||
------------------------------------------------- */ | |||
.ados-hero { | |||
margin: 0 | margin: 0 -1rem 1.5rem; | ||
padding: 1. | padding: 1.5rem 1.75rem 2rem; | ||
border-radius: 18px; | |||
background: radial-gradient(circle at top left, #f7e4c3 0, #f0d7af 40%, #e8c894 100%); | |||
background: | box-shadow: 0 10px 25px rgba(0,0,0,.07); | ||
box-shadow: 0 | |||
} | } | ||
.ados-hero__grid { | |||
display: flex; | display: flex; | ||
gap: 1. | flex-wrap: wrap; | ||
align-items: | gap: 1.75rem; | ||
align-items: stretch; | |||
} | } | ||
/* | /* Linke Spalte: großer Titel */ | ||
.ados-hero__title { | |||
flex: 0 0 230px; | |||
max-width: 260px; | |||
font-family: "Georgia","Times New Roman",serif; | |||
font-weight: 700; | |||
font-size: 2.4rem; | |||
line-height: 1.15; | |||
color: #4b2b14; | |||
} | |||
.ados-hero__title span { | |||
display: block; | |||
} | } | ||
.ados-hero__title hr { | |||
margin-top: .75rem; | |||
border: 0; | |||
border-top: 1px solid rgba(75,43,20,.35); | |||
} | } | ||
/* Mitte: Beschreibung */ | |||
.ados-hero__center { | |||
flex: 1 1 260px; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
} | } | ||
.ados-hero__center-box { | |||
max-width: 460px; | |||
padding: 1.2rem 1.6rem; | |||
text-align: center; | |||
border-radius: 14px; | |||
background: rgba(255,255,255,.25); | |||
border: 1px solid rgba(255,255,255,.55); | |||
font-size: 0. | box-shadow: 0 6px 14px rgba(0,0,0,.04); | ||
font-family: "Courier New",ui-monospace,monospace; | |||
font-size: 0.95rem; | |||
line-height: 1.6; | |||
color: #3b2a1a; | |||
display: inline-block; | |||
} | } | ||
.ados-hero__center-box strong { | |||
font-weight: 700; | |||
font-weight: | color: #4b2b14; | ||
color: # | |||
} | } | ||
/* Rechte Spalte: 3 Spalten */ | |||
.ados-hero__cols { | |||
flex: 0 0 260px; | |||
display: flex; | |||
flex-wrap: wrap; | |||
gap: 1.25rem; | |||
} | } | ||
.ados-hero__col { | |||
flex: 1 1 120px; | |||
font-size: 0.95rem; | |||
} | } | ||
.ados-hero__col-title { | |||
font-weight: 700; | |||
margin-bottom: .35rem; | |||
color: #4b2b14; | |||
} | } | ||
.ados-hero__col ul { | |||
margin: 0; | |||
padding-left: 1.1rem; | |||
} | } | ||
.ados-hero__col li { | |||
margin: .12rem 0; | |||
} | } | ||
/* Mobil */ | |||
/* | @media (max-width: 720px) { | ||
.ados-hero { | |||
margin: 0 0 1.25rem; | |||
} | |||
@media (max-width: | .ados-hero__grid { | ||
flex-direction: column; | flex-direction: column; | ||
align-items: | align-items: stretch; | ||
} | } | ||
.ados-hero__title { | |||
max-width: none; | |||
text-align: center; | text-align: center; | ||
font-size: 2.1rem; | |||
} | } | ||
.ados-hero__title hr { | |||
margin-left: auto; | |||
margin-right: auto; | |||
width: 50%; | |||
width: | |||
} | } | ||
.ados-hero__center { | |||
order: 2; | |||
} | } | ||
.ados-hero__cols { | |||
order: 3; | |||
justify-content: center; | |||
} | } | ||
.ados-hero__col { | |||
flex: 0 0 150px; | |||
text-align: center; | text-align: center; | ||
} | } | ||
} | } | ||