diff --git a/css/style.css b/css/style.css index f0f965d..0b5b5b6 100644 --- a/css/style.css +++ b/css/style.css @@ -107,6 +107,7 @@ footer a:hover { color: #fff; } .page-hero { padding: 5rem 3rem 3.5rem; max-width: 820px; margin: 0 auto; animation: fadeUp 0.9s ease both; } .page-hero h1 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.8rem, 7vw, 5rem); line-height: 1; letter-spacing: 0.03em; color: #fff; margin-bottom: 2rem; } .page-hero h1 span { color: var(--accent); } +.page-hero .sub { font-size: 1.05rem; font-weight: 300; color: rgba(255,255,255,0.62); line-height: 1.8; margin-bottom: 3rem; max-width: 560px; } .page { max-width: 820px; margin: 0 auto; padding: 0 3rem 4rem; } .page hr { border: none; border-top: 1px solid rgba(255,255,255,0.07); margin: 2.5rem 0; } @@ -114,10 +115,43 @@ footer a:hover { color: #fff; } .bio, .page p { font-size: 1.05rem; font-weight: 300; color: rgba(255,255,255,0.6); line-height: 1.9; margin-bottom: 0.6rem; } .skills-label, .page .label { font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.4); margin-bottom: 1rem; } +.legal-page { max-width: 900px; padding-bottom: 5rem; } +.legal-page h1 { margin-bottom: 1rem; } +.legal-page section { + padding: 1.65rem 0 1.65rem 1.5rem; + border-left: 2px solid rgba(122,179,255,0.35); + border-bottom: 1px solid rgba(255,255,255,0.07); +} +.legal-page section + section { margin-top: 1.2rem; } +.legal-page h2 { + font-family: 'Bebas Neue', sans-serif; + font-size: 1.55rem; + font-weight: 400; + letter-spacing: 0.08em; + color: #fff; + margin-bottom: 0.9rem; +} +.legal-page p, +.legal-page address { + max-width: 680px; + font-size: 1rem; + font-style: normal; + font-weight: 300; + color: rgba(255,255,255,0.68); + line-height: 1.85; +} +.legal-page a { color: var(--accent); text-decoration: none; } +.legal-page a:hover { color: #fff; } + .skills { display: flex; flex-wrap: wrap; gap: 0.6rem; } .skill { padding: 0.4rem 1.1rem; border: 1px solid rgba(255,255,255,0.15); font-size: 0.82rem; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.7); transition: border-color 0.2s, color 0.2s; } .skill:hover { border-color: var(--accent); color: var(--accent); } +@media (max-width: 640px) { + .legal-page { padding-inline: 1.5rem; } + .legal-page section { padding-left: 1rem; } +} + /* ========================= Dark Mode ========================= */ body.dark { @@ -147,10 +181,14 @@ body.dark #dark-mode-toggle { background: var(--accent); color: #0b1220; border- body.dark .page p, body.dark .bio { color: rgba(226,232,240,0.8); } body.dark .skill { border-color: rgba(226,232,240,0.2); color: rgba(226,232,240,0.7); } +body.dark .page-hero .sub, +body.dark .legal-page p, +body.dark .legal-page address { color: rgba(226,232,240,0.78); } +body.dark .legal-page section { border-left-color: rgba(96,165,250,0.45); border-bottom-color: #334155; } .dropdown { position: relative; } .dropdown-menu { display: none; position: absolute; top: 100%; left: 0; background: rgba(0,20,60,0.97); border: 1px solid rgba(255,255,255,0.07); min-width: 160px; z-index: 200; } .dropdown-menu li { list-style: none; } .dropdown-menu a { display: block; padding: 0.7rem 1.2rem; color: var(--text-muted); font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; } .dropdown-menu a:hover { color: #fff; } -.dropdown.open .dropdown-menu { display: block; } \ No newline at end of file +.dropdown.open .dropdown-menu { display: block; } diff --git a/impressum.html b/impressum.html index 112f420..317c480 100644 --- a/impressum.html +++ b/impressum.html @@ -29,29 +29,53 @@ -
Rechtliches
Privates Lernprojekt mit Glück-Auf Potenzial.
E-Mail: info@beispiel.de
+E-Mail: kontakt@example.com
Als Diensteanbieter sind wir gemäß § 7 Abs. 1 TMG für eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen.
+Die Inhalte dieser Website wurden mit größter Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit und Aktualität der Inhalte wird jedoch keine Gewähr übernommen.
Unser Angebot enthält Links zu externen Websites Dritter, auf deren Inhalte wir keinen Einfluss haben. Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber verantwortlich.
Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Vervielfältigung und Verbreitung bedürfen der schriftlichen Zustimmung des jeweiligen Autors.
+Die auf dieser Website erstellten Inhalte und Werke unterliegen dem deutschen Urheberrecht. Die Vervielfältigung, Bearbeitung oder Verbreitung außerhalb der Grenzen des Urheberrechts bedarf der Zustimmung der jeweiligen Rechteinhaberin.
+Diese Seite ist Teil eines privaten Lernprojekts. Die Angaben sind fiktiv und nicht für eine öffentliche Veröffentlichung gedacht.