/*
Theme Name: Divi Child
Theme URI: https://www.elegantthemes.com/gallery/divi/
Template: Divi/Divi
Author: Elegant Themes
Description: MeshCore Hessen Divi Child Theme
Version: 1.0.12
*/


/* ==========================================================
   MESHCORE HESSEN
   DARK / LIGHT
   ========================================================== */


/* ==========================================================
   1. HEADER – VOLLE BREITE
   ========================================================== */

.et_pb_section_0_tb_header {
    position: relative !important;
    isolation: isolate !important;
    overflow: visible !important;
}


/*
 * Hintergrund über die komplette Browserbreite,
 * ohne die eigentliche Divi-Row zu verbreitern.
 */

.et_pb_section_0_tb_header::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    bottom: 0 !important;

    left: 50% !important;

    width: 100vw !important;

    transform: translateX(-50%) !important;

    pointer-events: none !important;

    z-index: 0 !important;
}


/* Header-Inhalt vor Hintergrund */

.et_pb_section_0_tb_header
.et_pb_row_0_tb_header {
    position: relative !important;
    z-index: 1 !important;
}


/* DARK */

html:not(.mesh-light)
.et_pb_section_0_tb_header::before {
    background-color: #0C1210 !important;
}

html:not(.mesh-light)
.et_pb_section_0_tb_header {
    background-color: #0C1210 !important;
}


/* LIGHT */

html.mesh-light
.et_pb_section_0_tb_header::before {
    background-color: #FFFFFF !important;
}

html.mesh-light
.et_pb_section_0_tb_header {
    background-color: #FFFFFF !important;
}


/* ==========================================================
   2. HEADER-INNERE BEREICHE
   ========================================================== */

/* DARK */

html:not(.mesh-light)
.et_pb_row_0_tb_header,

html:not(.mesh-light)
.et_pb_column_0_tb_header,

html:not(.mesh-light)
.et_pb_column_1_tb_header,

html:not(.mesh-light)
.et_pb_menu_0_tb_header,

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et_pb_menu_inner_container,

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et_pb_menu__wrap,

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et_pb_menu__menu {
    background-color: #0C1210 !important;
}


/* LIGHT */

html.mesh-light
.et_pb_row_0_tb_header,

html.mesh-light
.et_pb_column_0_tb_header,

html.mesh-light
.et_pb_column_1_tb_header,

html.mesh-light
.et_pb_menu_0_tb_header,

html.mesh-light
.et_pb_menu_0_tb_header
.et_pb_menu_inner_container,

html.mesh-light
.et_pb_menu_0_tb_header
.et_pb_menu__wrap,

html.mesh-light
.et_pb_menu_0_tb_header
.et_pb_menu__menu {
    background-color: #FFFFFF !important;
}


/* ==========================================================
   3. DESKTOP-MENÜ – DARK
   ========================================================== */

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et-menu > li > a {
    color: #F4F7F5 !important;
}


html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et-menu > li.current-menu-item > a,

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et-menu > li.current_page_item > a {
    color: #50D926 !important;
}


/* ==========================================================
   4. DESKTOP-MENÜ – LIGHT
   ========================================================== */

html.mesh-light
.et_pb_menu_0_tb_header
.et-menu > li > a {
    color: #000000 !important;
}


html.mesh-light
.et_pb_menu_0_tb_header
.et-menu > li.current-menu-item > a,

html.mesh-light
.et_pb_menu_0_tb_header
.et-menu > li.current_page_item > a {
    color: #087A2B !important;
}


/* ==========================================================
   5. DESKTOP-DROPDOWN – DARK
   ========================================================== */

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.sub-menu {
    background-color: #0C1210 !important;
    border-color: #1D2923 !important;
}


html:not(.mesh-light)
.et_pb_menu_0_tb_header
.sub-menu a {
    color: #F4F7F5 !important;
}


/* ==========================================================
   6. DESKTOP-DROPDOWN – LIGHT
   ========================================================== */

html.mesh-light
.et_pb_menu_0_tb_header
.sub-menu {
    background-color: #FFFFFF !important;
    border-color: #DCE5EF !important;
}


html.mesh-light
.et_pb_menu_0_tb_header
.sub-menu a {
    color: #000000 !important;
}


/* ==========================================================
   7. SUCHE
   ========================================================== */

/* DARK */

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et_pb_menu__search-button,

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et_pb_menu__close-search-button {
    color: #50D926 !important;
}


/* LIGHT */

html.mesh-light
.et_pb_menu_0_tb_header
.et_pb_menu__search-button,

html.mesh-light
.et_pb_menu_0_tb_header
.et_pb_menu__close-search-button {
    color: #087A2B !important;
}


html.mesh-light
.et_pb_menu_0_tb_header
.et_pb_menu__search-container {
    background-color: #FFFFFF !important;
}


html.mesh-light
.et_pb_menu_0_tb_header
.et_pb_menu__search-input {
    color: #000000 !important;
}


/* ==========================================================
   8. CODE-MODUL DES THEME-SCHALTERS
   ========================================================== */

.et_pb_code_0_tb_header,
.et_pb_code_0_tb_header
.et_pb_code_inner {
    overflow: visible !important;
    background: transparent !important;
}


/* ==========================================================
   9. THEME-SCHALTER
   ========================================================== */

#mesh-theme-toggle {
    -webkit-appearance: none !important;
    appearance: none !important;

    position: relative !important;

    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

    width: 104px !important;
    min-width: 104px !important;
    max-width: 104px !important;

    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;

    padding: 0 8px !important;
    margin: 0 !important;

    box-sizing: border-box !important;

    border-radius: 19px !important;

    box-shadow: none !important;

    cursor: pointer !important;

    white-space: nowrap !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 16px !important;
    line-height: 1 !important;
}


#mesh-theme-toggle::before,
#mesh-theme-toggle::after {
    display: none !important;
    content: none !important;
}


/* ==========================================================
   10. SONNE / MOND
   ========================================================== */

#mesh-theme-toggle
.mesh-theme-icon {
    position: static !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 17px !important;

    width: 17px !important;
    min-width: 17px !important;
    max-width: 17px !important;

    height: 20px !important;

    padding: 0 !important;
    margin: 0 !important;

    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 20px !important;

    transform: none !important;
}


/* ==========================================================
   11. TRACK
   ========================================================== */

#mesh-theme-toggle
.mesh-toggle-track {
    position: relative !important;

    display: inline-block !important;

    flex: 0 0 40px !important;

    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;

    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;

    padding: 0 !important;
    margin: 0 !important;

    box-sizing: border-box !important;

    border-radius: 999px !important;

    overflow: hidden !important;
}


/* ==========================================================
   12. PUNKT
   ========================================================== */

#mesh-theme-toggle
.mesh-toggle-dot {
    position: absolute !important;

    display: block !important;

    top: 2px !important;
    left: 2px !important;

    width: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;

    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    box-shadow: none !important;

    transition:
        transform 0.2s ease,
        background-color 0.2s ease !important;
}


/* ==========================================================
   13. THEME-SCHALTER – DARK
   SONNE LINKS / MOND RECHTS
   DARK = PUNKT RECHTS
   ========================================================== */

#mesh-theme-toggle,
#mesh-theme-toggle[aria-pressed="false"] {
    background-color: #0C1210 !important;
    border: 1px solid #405348 !important;
}


#mesh-theme-toggle
.mesh-theme-icon,

#mesh-theme-toggle[aria-pressed="false"]
.mesh-theme-icon {
    color: #F4F7F5 !important;
}


#mesh-theme-toggle
.mesh-toggle-track,

#mesh-theme-toggle[aria-pressed="false"]
.mesh-toggle-track {
    background-color: #24332C !important;
    border: 1px solid #506158 !important;
}


#mesh-theme-toggle
.mesh-toggle-dot,

#mesh-theme-toggle[aria-pressed="false"]
.mesh-toggle-dot {
    background-color: #50D926 !important;

    transform: translateX(18px) !important;
}


/* ==========================================================
   14. THEME-SCHALTER – LIGHT
   LIGHT = PUNKT LINKS BEI SONNE
   ========================================================== */

html.mesh-light
#mesh-theme-toggle,

#mesh-theme-toggle[aria-pressed="true"] {
    background-color: #FFFFFF !important;
    border: 1px solid #AEBCC9 !important;
}


html.mesh-light
#mesh-theme-toggle
.mesh-theme-icon,

#mesh-theme-toggle[aria-pressed="true"]
.mesh-theme-icon {
    color: #000000 !important;
}


html.mesh-light
#mesh-theme-toggle
.mesh-toggle-track,

#mesh-theme-toggle[aria-pressed="true"]
.mesh-toggle-track {
    background-color: #E2E8EE !important;
    border: 1px solid #AAB7C4 !important;
}


html.mesh-light
#mesh-theme-toggle
.mesh-toggle-dot,

#mesh-theme-toggle[aria-pressed="true"]
.mesh-toggle-dot {
    background-color: #087A2B !important;

    transform: translateX(0) !important;
}


/* ==========================================================
   15. SCHALTER HOVER / FOCUS
   ========================================================== */

#mesh-theme-toggle:hover {
    border-color: #50D926 !important;
}


html.mesh-light
#mesh-theme-toggle:hover,

#mesh-theme-toggle[aria-pressed="true"]:hover {
    border-color: #087A2B !important;
}


#mesh-theme-toggle:focus-visible {
    outline: 3px solid #50D926 !important;
    outline-offset: 3px !important;
}


/* ==========================================================
   16. MOBILES MENÜ – GRUNDFARBEN
   ========================================================== */

/* DARK */

html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et_mobile_menu {
    background-color: #0C1210 !important;
    border-top-color: #50D926 !important;
}


html:not(.mesh-light)
.et_pb_menu_0_tb_header
.et_mobile_menu a {
    color: #F4F7F5 !important;
}


/* LIGHT */

html.mesh-light
.et_pb_menu_0_tb_header
.et_mobile_menu {
    background-color: #FFFFFF !important;
    border-top-color: #087A2B !important;
}


html.mesh-light
.et_pb_menu_0_tb_header
.et_mobile_menu a {
    color: #000000 !important;
}


/* ==========================================================
   17. MOBILER HEADER
   LINKS  = THEME-SCHALTER
   MITTE  = LOGO
   RECHTS = HAMBURGER
   ========================================================== */

@media (max-width: 980px) {


    /* ------------------------------------------------------
       NICHTS DARF HAMBURGER / DROPDOWN ABSCHNEIDEN
       ------------------------------------------------------ */

    .et_pb_section_0_tb_header,
    .et_pb_row_0_tb_header,
    .et_pb_column_0_tb_header,
    .et_pb_column_1_tb_header,
    .et_pb_menu_0_tb_header,
    .et_pb_menu_0_tb_header
    .et_pb_menu_inner_container,
    .et_pb_menu_0_tb_header
    .et_pb_menu__wrap {
        overflow: visible !important;
    }


    /* ------------------------------------------------------
       HEADER ROW
       ------------------------------------------------------ */

    .et_pb_row_0_tb_header {
        position: relative !important;

        min-height: 76px !important;

        margin-left: auto !important;
        margin-right: auto !important;
    }


    /* ------------------------------------------------------
       MENÜSPALTE NIMMT DIE VOLLE BREITE EIN
       ------------------------------------------------------ */

    .et_pb_column_0_tb_header {
        position: relative !important;

        display: block !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;

        z-index: 10 !important;
    }


    /* ------------------------------------------------------
       MENÜMODUL
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header {
        position: relative !important;

        display: block !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;

        z-index: 10 !important;
    }


    /* ------------------------------------------------------
       INNERER MENÜCONTAINER
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header
    .et_pb_menu_inner_container {
        position: relative !important;

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;

        min-height: 76px !important;

        padding: 0 62px 0 104px !important;

        box-sizing: border-box !important;
    }


    /* ------------------------------------------------------
       DESKTOP-MENÜ AUF MOBILE AUS
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header
    .et_pb_menu__menu {
        display: none !important;
    }


    /* ------------------------------------------------------
       LOGO MITTIG
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header
    .et_pb_menu__logo-wrap {
        position: absolute !important;

        left: 50% !important;
        top: 50% !important;

        transform: translate(-50%, -50%) !important;

        margin: 0 !important;
        padding: 0 !important;

        z-index: 20 !important;

        pointer-events: auto !important;
    }


    .et_pb_menu_0_tb_header
    .et_pb_menu__logo {
        display: block !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    .et_pb_menu_0_tb_header
    .et_pb_menu__logo img {
        display: block !important;

        width: auto !important;
        height: auto !important;

        max-width: 150px !important;
        max-height: 58px !important;

        object-fit: contain !important;
    }


    /* ------------------------------------------------------
       MENU-WRAP
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header
    .et_pb_menu__wrap {
        position: static !important;

        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ------------------------------------------------------
       SUCHLUPE MOBILE AUS
       damit rechts nur der Hamburger sitzt
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header
    .et_pb_menu__search-button {
        display: none !important;
    }


    /* ------------------------------------------------------
       DIVI MOBILE NAV RECHTS
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header
    .et_mobile_nav_menu {
        display: block !important;

        visibility: visible !important;
        opacity: 1 !important;

        position: absolute !important;

        top: 50% !important;
        right: 12px !important;
        left: auto !important;

        transform: translateY(-50%) !important;

        width: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;

        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;

        margin: 0 !important;
        padding: 0 !important;

        z-index: 100 !important;
    }


    /* ------------------------------------------------------
       DIVIS CLICKBARE MOBILE_NAV
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header
    .mobile_nav {
        display: block !important;

        visibility: visible !important;
        opacity: 1 !important;

        position: relative !important;

        width: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;

        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;

        cursor: pointer !important;

        z-index: 101 !important;
    }


    /* ------------------------------------------------------
       HAMBURGER – CLICKFLÄCHE
       ------------------------------------------------------ */

    .et_pb_menu_0_tb_header
    .mobile_menu_bar {
        display: block !important;

        visibility: visible !important;
        opacity: 1 !important;

        position: absolute !important;

        top: 50% !important;
        left: 50% !important;

        transform: translate(-50%, -50%) !important;

        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;

        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #50D926 !important;

        background:
            linear-gradient(
                currentColor,
                currentColor
            )
            center 10px / 26px 3px no-repeat,

            linear-gradient(
                currentColor,
                currentColor
            )
            center 19px / 26px 3px no-repeat,

            linear-gradient(
                currentColor,
                currentColor
            )
            center 28px / 26px 3px no-repeat !important;

        border: 0 !important;
        border-radius: 6px !important;

        cursor: pointer !important;

        z-index: 102 !important;
    }


    /*
     * Divis eigenes ETmodules-Pseudoicon ausblenden.
     * Der Hamburger wird oben mit echten CSS-Linien gezeichnet.
     */

    .et_pb_menu_0_tb_header
    .mobile_menu_bar::before {
        content: none !important;

        display: none !important;
    }


    /* Hamburger DARK */

    html:not(.mesh-light)
    .et_pb_menu_0_tb_header
    .mobile_menu_bar {
        color: #50D926 !important;
    }


    /* Hamburger LIGHT */

    html.mesh-light
    .et_pb_menu_0_tb_header
    .mobile_menu_bar {
        color: #087A2B !important;
    }


    /* ------------------------------------------------------
       THEME-SCHALTER LINKS
       ------------------------------------------------------ */

    .et_pb_column_1_tb_header {
        position: absolute !important;

        top: 50% !important;
        left: 12px !important;
        right: auto !important;

        transform: translateY(-50%) !important;

        display: block !important;

        width: 92px !important;
        min-width: 92px !important;
        max-width: 92px !important;

        height: 36px !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;

        z-index: 110 !important;
    }


    /* ------------------------------------------------------
       CODE-MODUL LINKS
       ------------------------------------------------------ */

    .et_pb_code_0_tb_header,
    .et_pb_code_0_tb_header
    .et_pb_code_inner {
        display: block !important;

        width: 92px !important;
        min-width: 92px !important;
        max-width: 92px !important;

        height: 36px !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;

        overflow: visible !important;
    }


    /* ------------------------------------------------------
       THEME-SCHALTER MOBILE
       ------------------------------------------------------ */

    #mesh-theme-toggle {
        width: 92px !important;
        min-width: 92px !important;
        max-width: 92px !important;

        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;

        gap: 5px !important;

        padding: 0 6px !important;

        border-radius: 18px !important;
    }


    #mesh-theme-toggle
    .mesh-theme-icon {
        flex: 0 0 15px !important;

        width: 15px !important;
        min-width: 15px !important;
        max-width: 15px !important;

        height: 18px !important;

        font-size: 15px !important;
        line-height: 18px !important;
    }


    #mesh-theme-toggle
    .mesh-toggle-track {
        flex: 0 0 38px !important;

        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;

        height: 20px !important;
        min-height: 20px !important;
        max-height: 20px !important;
    }


    #mesh-theme-toggle
    .mesh-toggle-dot {
        top: 2px !important;
        left: 2px !important;

        width: 14px !important;
        min-width: 14px !important;
        max-width: 14px !important;

        height: 14px !important;
        min-height: 14px !important;
        max-height: 14px !important;
    }


    /* DARK = Punkt rechts beim Mond */

    #mesh-theme-toggle
    .mesh-toggle-dot,

    #mesh-theme-toggle[aria-pressed="false"]
    .mesh-toggle-dot {
        transform: translateX(18px) !important;
    }


    /* LIGHT = Punkt links bei Sonne */

    html.mesh-light
    #mesh-theme-toggle
    .mesh-toggle-dot,

    #mesh-theme-toggle[aria-pressed="true"]
    .mesh-toggle-dot {
        transform: translateX(0) !important;
    }


    /* ------------------------------------------------------
       MOBILES DROPDOWN
       ====================================================== */

    .et_pb_menu_0_tb_header
    .et_mobile_menu {
        position: absolute !important;

        top: 76px !important;

        left: 0 !important;
        right: 0 !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 12px 0 !important;

        box-sizing: border-box !important;

        z-index: 500 !important;
    }


    /* Normale Menüeinträge */

    .et_pb_menu_0_tb_header
    .et_mobile_menu
    > li {
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    .et_pb_menu_0_tb_header
    .et_mobile_menu
    > li
    > a {
        display: block !important;

        width: 100% !important;

        padding: 12px 20px !important;

        box-sizing: border-box !important;

        font-size: 18px !important;
        line-height: 1.35 !important;
    }


    /* Mobile Untermenüs */

    .et_pb_menu_0_tb_header
    .et_mobile_menu
    .sub-menu {
        position: static !important;

        display: block;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 0 0 16px !important;

        box-sizing: border-box !important;

        box-shadow: none !important;
    }


    .et_pb_menu_0_tb_header
    .et_mobile_menu
    .sub-menu
    a {
        padding: 10px 20px !important;

        font-size: 16px !important;
        line-height: 1.35 !important;
    }

}


/* ==========================================================
   18. SEHR KLEINE SMARTPHONES
   ========================================================== */

@media (max-width: 480px) {

    /*
     * Etwas kompakter,
     * damit links Toggle + Mitte Logo + rechts Hamburger
     * auch auf kleinen Geräten passen.
     */

    .et_pb_menu_0_tb_header
    .et_pb_menu_inner_container {
        padding-left: 96px !important;
        padding-right: 58px !important;
    }


    .et_pb_menu_0_tb_header
    .et_pb_menu__logo img {
        max-width: 120px !important;
        max-height: 50px !important;
    }


    .et_pb_column_1_tb_header {
        left: 8px !important;

        width: 86px !important;
        min-width: 86px !important;
        max-width: 86px !important;
    }


    .et_pb_code_0_tb_header,
    .et_pb_code_0_tb_header
    .et_pb_code_inner {
        width: 86px !important;
        min-width: 86px !important;
        max-width: 86px !important;
    }


    #mesh-theme-toggle {
        width: 86px !important;
        min-width: 86px !important;
        max-width: 86px !important;

        gap: 3px !important;

        padding-left: 4px !important;
        padding-right: 4px !important;
    }


    .et_pb_menu_0_tb_header
    .et_mobile_nav_menu {
        right: 8px !important;
    }

}


/* ==========================================================
   19. DIVI-SEITEN – LIGHT
   ========================================================== */

html.mesh-light #main-content {
    background-color: #F7FAFC !important;
}


html.mesh-light #main-content h1,
html.mesh-light #main-content h2,
html.mesh-light #main-content h3,
html.mesh-light #main-content h4,
html.mesh-light #main-content h5,
html.mesh-light #main-content h6,
html.mesh-light #main-content p,
html.mesh-light #main-content li,
html.mesh-light #main-content blockquote {
    color: #000000 !important;
}


/* ==========================================================
   20. KLASSISCHER BLOG – DARK
   ========================================================== */

html:not(.mesh-light) #page-container,
html:not(.mesh-light) #et-main-area,
html:not(.mesh-light) #main-content,
html:not(.mesh-light) #main-content > .container,
html:not(.mesh-light) #left-area,
html:not(.mesh-light) #left-area article,
html:not(.mesh-light) #sidebar,
html:not(.mesh-light) #sidebar .et_pb_widget {
    background-color: #050907 !important;
}


html:not(.mesh-light)
#main-content
.container::before {
    background-color: #1D2923 !important;
}


html:not(.mesh-light) #left-area h1,
html:not(.mesh-light) #left-area h2,
html:not(.mesh-light) #left-area h3,
html:not(.mesh-light) #left-area h4,
html:not(.mesh-light) #left-area h5,
html:not(.mesh-light) #left-area h6,

html:not(.mesh-light) #left-area .entry-title,
html:not(.mesh-light) #left-area .entry-title a,

html:not(.mesh-light) #sidebar h1,
html:not(.mesh-light) #sidebar h2,
html:not(.mesh-light) #sidebar h3,
html:not(.mesh-light) #sidebar h4,
html:not(.mesh-light) #sidebar h5,
html:not(.mesh-light) #sidebar h6,

html:not(.mesh-light) #sidebar .widgettitle {
    color: #F4F7F5 !important;
}


html:not(.mesh-light) #left-area,
html:not(.mesh-light) #left-area p,
html:not(.mesh-light) #left-area li,
html:not(.mesh-light) #left-area .entry-content,
html:not(.mesh-light) #left-area .post-content,
html:not(.mesh-light) #left-area .post-meta,

html:not(.mesh-light) #sidebar,
html:not(.mesh-light) #sidebar p,
html:not(.mesh-light) #sidebar li {
    color: #A8B0AC !important;
}


html:not(.mesh-light) #left-area a,
html:not(.mesh-light) #sidebar a {
    color: #F4F7F5 !important;
}


html:not(.mesh-light) #left-area a:hover,
html:not(.mesh-light) #sidebar a:hover {
    color: #50D926 !important;
}


/* ==========================================================
   21. KLASSISCHER BLOG – LIGHT
   ========================================================== */

html.mesh-light #page-container,
html.mesh-light #et-main-area,
html.mesh-light #main-content,
html.mesh-light #main-content > .container,
html.mesh-light #left-area,
html.mesh-light #left-area article,
html.mesh-light #sidebar,
html.mesh-light #sidebar .et_pb_widget {
    background-color: #FFFFFF !important;
}


html.mesh-light
#main-content
.container::before {
    background-color: #DCE5EF !important;
}


html.mesh-light #left-area,
html.mesh-light #left-area p,
html.mesh-light #left-area li,
html.mesh-light #left-area .entry-content,
html.mesh-light #left-area .post-content,
html.mesh-light #left-area .post-meta,

html.mesh-light #left-area h1,
html.mesh-light #left-area h2,
html.mesh-light #left-area h3,
html.mesh-light #left-area h4,
html.mesh-light #left-area h5,
html.mesh-light #left-area h6,

html.mesh-light #left-area .entry-title,
html.mesh-light #left-area .entry-title a,

html.mesh-light #sidebar,
html.mesh-light #sidebar p,
html.mesh-light #sidebar li,

html.mesh-light #sidebar h1,
html.mesh-light #sidebar h2,
html.mesh-light #sidebar h3,
html.mesh-light #sidebar h4,
html.mesh-light #sidebar h5,
html.mesh-light #sidebar h6,

html.mesh-light #sidebar .widgettitle,
html.mesh-light #sidebar a {
    color: #000000 !important;
}


/* ==========================================================
   22. SIDEBAR-SUCHE
   ========================================================== */

html:not(.mesh-light) #sidebar input,
html:not(.mesh-light) #sidebar textarea,
html:not(.mesh-light) #sidebar select {
    background-color: #0C1210 !important;

    color: #F4F7F5 !important;

    border-color: #1D2923 !important;
}


html.mesh-light #sidebar input,
html.mesh-light #sidebar textarea,
html.mesh-light #sidebar select {
    background-color: #FFFFFF !important;

    color: #000000 !important;

    border-color: #DCE5EF !important;
}


/* ==========================================================
   23. ACCESSIBILITY
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    #mesh-theme-toggle
    .mesh-toggle-dot {
        transition: none !important;
    }

}