Update sermon-a4.css

sermon-a4.css

@@ -1,139 +1,115 @@
-/* @theme a4-clean */
+/* @theme sermon-a4 */
 
 @import 'base';
 
+:root {
+    /* --- DEINE STEUERZENTRALE --- */
+    --font-size: 18pt;           /* 18pt für Kanzel, 12pt für Handout */
+    --line-height: 1.6;
+    --font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    --primary-color: #3498db;    /* Das Blau aus deiner Vorlage */
+    --text-color: #1a1a1a;
+    --heading-color: #2c3e50;
+    --regie-color: #cc0000;      /* Rot für Regieanweisungen */
+    
+    /* Ränder: Oben, Rechts, Unten, Links (breiter zum Lochen) */
+    --margin-page: 25px 35px 25px 55px; 
+}
+
 section {
     width: 21cm;
     height: 29.7cm;
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    padding: var(--margin-page);
     background: white;
-    color: #1a1a1a;
+    color: var(--text-color);
-    font-size: 12px;
+    font-family: var(--font-family);
-    line-height: 1.6;
+    font-size: var(--font-size);
-    padding: 25px 35px;
+    line-height: var(--line-height);
+    display: block; /* Wichtig für Dokumentenfluss */
 }
 
+/* Seitenzahlen */
 section::after {
     content: attr(data-marpit-pagination) ' / ' attr(data-marpit-pagination-total);
     font-size: 12px;
+    position: absolute;
+    bottom: 25px;
+    right: 35px;
+    color: #555;
 }
 
+/* Überschriften mit deinen Farben */
 h1 {
-    color: #2c3e50;
+    color: var(--heading-color);
-    font-size: 18px;
+    font-size: 1.8em;
     font-weight: bold;
     margin-bottom: 20px;
-    border-bottom: 3px solid #3498db;
+    border-bottom: 3px solid var(--primary-color);
     padding-bottom: 10px;
 }
 
 h2 {
     color: #34495e;
-    font-size: 16px;
+    font-size: 1.5em;
     font-weight: bold;
     margin-top: 30px;
     margin-bottom: 15px;
+    border-bottom: 1px solid #eee;
 }
 
 h3 {
     color: #555;
-    font-size: 14px;
+    font-size: 1.2em;
     margin-top: 20px;
     margin-bottom: 10px;
 }
 
-p {
+p, li {
     margin: 10px 0;
-    font-size: 12px;
+    /* Erbt automatisch die 18pt/12pt aus section */
 }
 
-a {
+/* Regieanweisungen: *Kursiv* wird Fett & Rot */
-    color: #3498db;
+em {
-    text-decoration: none;
+    color: var(--regie-color);
-}
+    font-style: italic;
-
+    font-weight: bold;
-a:hover {
-    text-decoration: underline;
 }
 
 strong {
-    color: #2c3e50;
+    color: var(--heading-color);
-}
-
-em {
-    color: #555;
-}
-
-ul, ol {
-    margin: 10px 0;
-    padding-left: 30px;
-    font-size: 12px;
-}
-
-li {
-    margin: 5px 0;
-    font-size: 12px;
 }
 
 blockquote {
     color: #555;
     padding: 10px 20px;
     margin: 20px 0;
-    border-left: 4px solid #3498db;
+    border-left: 4px solid var(--primary-color);
     background-color: #f8f9fa;
+    font-style: italic;
 }
 
+/* Tabellen-Logik aus deiner Vorlage */
 table {
     width: 100%;
     border-collapse: collapse;
     margin: 20px 0;
-    font-size: 12px;
+    font-size: 0.9em;
-    table-layout: auto;
-    word-wrap: break-word;
 }
 
 table th {
-    background-color: #3498db;
+    background-color: var(--primary-color);
     color: white;
-    font-weight: bold;
+    padding: 8px;
-    padding: 6px 8px;
     border: 1px solid #2980b9;
-    text-align: left;
-    word-wrap: break-word;
 }
 
 table td {
-    padding: 5px 8px;
+    padding: 8px;
     border: 1px solid #ddd;
-    word-wrap: break-word;
-    max-width: 300px;
-}
-
-table tr:nth-child(even) {
-    background-color: #f8f9fa;
-}
-
-img {
-    max-width: 100%;
-    height: auto;
-    display: block;
-    margin: 20px auto;
-}
-
-header, footer {
-    text-align: center;
-    font-size: 12px;
-    color: #555;
-}
-
-header {
-    top: 20px;
-}
-
-footer {
-    bottom: 20px;
 }
 
+/* Code & Pre-Blöcke (für Zitate oder spezielle Formatierung) */
 code, pre {
     font-family: Consolas, 'Courier New', monospace;
 }
@@ -142,7 +118,8 @@ code {
     background-color: #f6f8fa;
     padding: 2px 6px;
     border-radius: 3px;
-    color: #2c3e50;
+    color: var(--heading-color);
+    font-size: 0.9em;
 }
 
 pre {
@@ -151,10 +128,18 @@ pre {
     border-radius: 5px;
     overflow-x: auto;
     line-height: 1.4;
-    border-left: 3px solid #3498db;
+    border-left: 3px solid var(--primary-color);
+    margin: 20px 0;
 }
 
 pre code {
     background-color: transparent;
     padding: 0;
+}
+
+img {
+    max-width: 100%;
+    height: auto;
+    display: block;
+    margin: 20px auto;
 }