/* =====================================
   MEER DER IDEEN – VARIABLEN
   ===================================== */

:root {

    /* MEER DER IDEEN Farben */

    --mdib-mdi7:          #3b1f12; /* Sehr dunkles Braun */
    --mdib-mdi6:          #5b3419; /* Dunkles Braun */
    --mdib-mdi5:          #9f6c32; /* Mittleres Braun */
    --mdib-mdi4:          #be955b; /* Braun */
    --mdib-mdi3:          #caa977; /* HAUPTFARBE (Logo z.B.) */
    --mdib-mdi2:          #e6d0af; /* Helles Braun */
    --mdib-mdi1:          #f6ece0; /* Sehr helles Braun */

    --mdib-akzent-hinweis:  #b4061d; /* Hinweise */
    --mdib-akzent-werbung:  #579725; /* Affiliates, Shop */

    --mdib-schwarz:       #000000;
    --mdib-weiss:         #ffffff;
    
    /* Schriftgrößen */

    --mdib-fs-xxl: 30px;   /* Hauptüberschrift, H1 */
    --mdib-fs-xl:  25px;   /* H2 */
    --mdib-fs-l:   22px;   /* H3 */
    --mdib-fs-m:   20px;   /* H4 */
    --mdib-fs-s:   17px;   /* H5 */
    --mdib-fs-xs:  15px;   /* Artikeltext */
    --mdib-fs-xxs: 12px;   /* Mini-Hinweise (Footer z.B.) */

}

		/* Verwendung:
   		color: var(--mdib-mdi3);
   		font-size: var(--mdib-fs-xl);
		*/


/* =====================================
   GLOBAL: BASIS, TYPOGRAFIE, HILFSKLASSEN
   ===================================== */

/* Grundlayout (html, body, Standard-Schriften, Links, etc.) */


/* Hilfsklassen (z.B. .hidden, .clearfix, Abstände, Ausrichtungen) */



/* =====================================
   LAYOUT-RAHMEN
   (Wrapper, Content-Bereich, Spalten)
   ===================================== */

/* Gesamtlayout, Content-Breite, Hauptspalte vs. Sidebar */



/* =====================================
   HEADER & NAVIGATION
   ===================================== */





/* =====================================
   STARTSEITE
   ===================================== */





/* =====================================
   ARTIKEL
   ===================================== */





/* =====================================
   SEITEN
   ===================================== */





/* =====================================
   ARCHIV & SUCHE
   ===================================== */





/* =====================================
   SEITENLEISTE
   ===================================== */





/* =====================================
   WIDGETS
   ===================================== */





/* =====================================
   FOOTER
   ===================================== */




/* =====================================
   PLUGIN-ANPASSUNGEN
   ===================================== */

/* Plugin: Kontaktformulare */


/* Plugin: Slider / Galerie */


/* Plugin: Cookie-Banner */


/* weitere Plugins */



































/* =====================================
   RESPONSIVE: TABLETS, GROSS
   729px bis 1050px
   ===================================== */

@media only screen and (min-width:910px) and (max-width:1050px) {
@media only screen and (min-width:910px) and (max-width:1050px) {

    /* Layout-Anpassungen für größeren Tablet-Bereich */
    /* Startseite (Tablet, groß) */
    /* Artikel (Tablet, groß) */
    /* Seiten (Tablet, groß) */
    /* Archive/Suche (Tablet, groß) */
    /* Sidebar/Widgets (Tablet, groß) */
    /* Footer (Tablet, groß) */
    /* Plugin-Anpassungen (falls nötig) */

}




































/* =====================================
   RESPONSIVE: TABLETS, KLEIN
   729px bis 910px
   ===================================== */

@media only screen and (min-width:729px) and (max-width:910px) {

    /* Feinanpassungen speziell für kleinere Tablets */
    /* Startseite (Tablet, klein) */
    /* Artikel (Tablet, klein) */
    /* Seiten (Tablet, klein) */
    /* Archive/Suche (Tablet, klein) */
    /* Sidebar/Widgets (Tablet, klein) */
    /* Footer (Tablet, klein) */
    /* Plugin-Anpassungen (falls nötig) */

}














































/* =====================================
   RESPONSIVE: SMARTPHONES
   0px bis 729px
   ===================================== */

@media only screen and (min-width:0px) and (max-width:729px) {

    /* Mobile Layout: einspaltig, Abstände, Schriftgrößen-Anpassungen */
    /* Startseite (Smartphone) */
    /* Artikel (Smartphone) */
    /* Seiten (Smartphone) */
    /* Archive/Suche (Smartphone) */
    /* Sidebar/Widgets (Smartphone – meist unter dem Content) */
    /* Footer (Smartphone) */
    /* Plugin-Anpassungen (falls nötig) */

}