/* https://preview.linon.de/idastyles/franz-marc/fmm.css */

body * {-webkit-tap-highlight-color: transparent;}


/* MARK: Variables */
body {
    --background-color: #ffffff;
    --topbar-background: #ffffff;
    --menu-background: #ffffff;
    --slider-bg: #f7f7f7;
    --fullscreen-button-bg: #ffffff;
    --fullscreen-button-color: #222;
    --fullscreen-player-bg: #ffffff;
    --fullscreen-player-button-color: var(--darker);
    --slider-caption-fullscreen-color: var(--darkest);
    --list-item-background: #ffffff;
    --list-border-color: #adadad;
    --list-border-width: 1px;
    --thumb-border-color: #ddd;
    --thumb-border-width: 0px;
    --thumbnail-width: 120px;
    --thumbnail-height: 120px;
    --thumbnail-margin-top-bottom: 10px;
    --font-color: var(--darker);
    --font-family-sans: opensans, Verdana, Helvetica, Arial, sans-serif;
    --font-family-serif: serif;
    --link-font-color: var(--accent-color), var(--color-primary);
    --page-headline-font-family: var(--font-family-sans);
    --page-headline-font-size: clamp(1.75rem, 1.25rem + 2vw, 2.375rem);
    --page-headline-padding: 18px 8px;
    --page-headline-color: var(--accent-foreground-color, inherit);
    --page-headline-background-color: var(--accent-color, inherit);
    --richtext-headline-font-family: inherit;
    --richtext-headline-color: inherit;
}

body.dark {
    background-color: #000000;
}

.dark {
    --topbar-background: #333333;
    --menu-background: #333;
    --list-border-color: #666;
    --slider-bg: #333;
    --fullscreen-player-bg: #111;
    --fullscreen-button-bg: #111;
    --fullscreen-button-color: #FFF;
    --fullscreen-player-button-color: #FFF;
}

/* MARK: Topbar ------------------------------------------------------------------------------------------------ */
.MainContainer-main .TopBar-appBar {
    background-color: var(--topbar-background);
    }
.MainContainer-main .MainMenu-menu {
    background-color: var(--menu-background);
    position: absolute;
    text-align: left;
    top: clamp(48px, 6vh, 70px);
    }
.MainContainer-main .MainMenu-SlideRoot {
    background-color: var(--menu-background);
    position: absolute;
    min-height: 100dvh;
    }



    /* MARK: Large Image */
.large-image {
    width: 100%;
    height: clamp(255px, 58vw, 600px);
}




/* MARK: Liste ------------------------------------------------------------------------------------------------ */
.MainContainer-main:has(.page-headline):has(.base-list) .base-list {
    margin-top: -8px;
}
.base .list-item {
    margin-bottom: 0;
}
.base .List-listItem {
    border-bottom: var(--list-border-width) var(--list-border-color) solid
}
.base ul div.list-item:last-of-type li.List-listItem {
    /* border-bottom: unset; */
}
.base .list-item:not(:has(.gatsby-image-wrapper)) .List-titleDiv {
    padding-left: 0;
}
.base .list-item:not(.inline-list-headline) .List-titleDiv {
    padding-top: 10px;
    padding-bottom: 10px;
}
.base .List-listImg:not(.hero):not(.icon) {
        width: clamp(var(--thumbnail-width), 20vw, 180px);
        min-width: clamp(var(--thumbnail-width), 20vw, 180px);
        min-height: clamp(var(--thumbnail-height), 20vw, 180px);
        margin: var(--thumbnail-margin-top-bottom) 0 var(--thumbnail-margin-top-bottom) 0;
        border-width: var(--thumb-border-width);
        border-radius: 4px;
}
.base .list-item:not(.inline-list-headline) .List-titleFlex {
    min-height: clamp(70px, 14vw, 120px);
}
.base .List-title1 {
    font-size: clamp(1rem, 2.6vw, 1.4rem) !important;
    text-transform: uppercase;
    font-weight: 100;
}
.base .List-title2 {
    font-size: clamp(1rem, 2.6vw, 1.3rem) !important;
}
.base .List-title3 {
    font-size: clamp(0.9375rem, 2.4vw, 1.125rem) !important;
    /* margin-top: 20px; */
}
.base .List-numCode {
    font-size: .8125em;
    color: var(--font-color);
    opacity: .7;
}

h1.page-headline {
    font-weight: 500;
    text-transform: uppercase;
    font-family: var(--font-family-sans);
    font-size: clamp(1.5rem, 3vw, 1.8rem);
}

[data-id="Audioguide_exhibition_list_MiZ-25"] h1.page-headline {
    font-size: clamp(1.7rem, 3vw, 1.8rem);
    margin: 10px 0;
}

/* MARK: Richtext ------------------------------------------------------------------------------------------------ */
.richtext {
    font-size: clamp(1rem, 3vw, 1.4rem);
    font-weight: 100;
}
.richtext h2 {
    font-family: var(--font-family-sans);
    text-transform: uppercase;
    font-size: clamp(1.25rem, 3vw, 1.6rem);
    line-height: 1.2;
    font-weight: 200;
    margin-bottom: 8px;
}
.richtext h3 {
    margin-bottom: 10px;
    margin-top: 18px;
    line-height: 1.2;
    font-weight: 700;
    font-size: clamp(1rem, 3vw, 1.4rem);
}



/* MARK: Fullscreen restrict 900px ------------------------------------------------------------------------------------------------ */
.FullScreenWrapper-fullscreen {
    width: 100%;
    height: 100%;
    max-width: 900px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
}
.OuterMainContainer-main {
    max-width: 900px;
    margin: 0 auto;
}



/* MARK: Menu ------------------------------------------------------------------------------------------------ */
.MainContainer-main .TopBar-appBar {
    overflow-x: clip;
    }
 /* hack for safari only. overflow clip on fixed element bug*/
    @supports (-webkit-appearance:none) and (stroke-color:transparent) {
    .MainContainer-main .TopBar-appBar {overflow-x: visible !important;}
    }

.TopBar-rightItems .MainMenu-SlideRoot {
    position: absolute;
    z-index: 100;
    height: 100vh;
    top: 0px;
    left: 0px;
    right: 0;
    margin: auto;
}
.TopBar-rightItems .MainMenu-SlideRoot .MainMenu-menu {
    width: 94%;
    height: auto;
    position: absolute;
    right: 0;
    top: 49px;
    z-index: 8000;
    margin: 0px 10px;
    overflow: auto;
    max-height: 90vh;
}
.MainMenu-menu .MainMenu-item {
    font-size: clamp(1.25rem, 3vw, 1.6rem);
    border-bottom: 1px solid var(--list-border-color);
    color: var(--font-color);
    -webkit-text-decoration: none;
    text-decoration: none;
    font-weight: 400;
}



.TopBar-rightItems button { margin-left: 8px; } .Collapsible__trigger {font-weight: 400 !important;font-size: 1.25rem;padding-inline-start: 0;} .Collapsible__trigger:after { font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-weight: normal; font-family: inherit; font-size: 24px; line-height: 1; top: 12px; content: '+'; transform: rotate(0deg); } .Collapsible__trigger.is-open:after { transform: rotateZ(135deg); top: 12px; font-size: 24px; } .Collapsible__contentOuter { transition: height 150ms ease-out 0s !important; } main { animation: fadeup 350ms ease-out 0s 1 forwards; } @keyframes fadeup { 0% { margin-left: 200px; } 100% { margin-left: 0; } } [data-testid="ArrowForwardIosIcon"] { font-size: 1em; }
/* wenn main von links kommt overflow abschneiden */
.OuterMainContainer-main {
    overflow-x: clip;
}
main {
    min-width: 100%;
}

.entity-overlays {
    max-width: 900px;
    margin: 0 auto;
}

/* MARK: language */
.language-selection .List-listImg:not(.hero):not(.svg) {
    border: 1px solid;
    border-color: var(--thumb-border-color);
    border-radius: 100%;
    width: 60px;
    min-width: 60px;
    height: 60px;
    margin: 15px;
}
.language-selection .large-image {
    width: 100%;
    height: calc(100vh - 281px);
}
.language-selection .List-title1 {
    font-size: 1.125rem;
    text-transform: uppercase;
}
.language-selection.wma.wma-list {
    max-width: 900px;
    margin: 0 auto;
    border: 1px solid #eee;
    box-shadow: 0 0 50px hsl(0deg 0% 0% / 25%);
}



/* MARK: helle buttons fullscreen */
.imageslider-advanced .FullScreenWrapper-fullScreenButton {
    background-color: var(--fullscreen-button-bg) !important;
}
.imageslider-advanced .FullScreenWrapper-fullScreenButton svg {
    color: var(--fullscreen-button-color) !important;
    font-size: 24px
}
.swiper .overlay-toggle {
    background-color: var(--fullscreen-button-bg) !important;
}
.swiper .overlay-toggle {
    color: var(--fullscreen-button-color) !important;
    font-size: 24px;
}
.FullScreenWrapper-fullscreen swiper-container::part(pagination) {
    background: var(--slider-bg);
    bottom: 0px;
    height: 25px;
}

/* MARK:  caption inline positioning TODO */
.imageslider-advanced .caption-inline {
    font-weight: 400;
}
.imageslider-advanced .FullScreenWrapper-fullscreen:has(.swiper-custom-buttons):not(:has(.swiper-pagination)) .caption-inline {
    bottom: 20px !important;
}
.imageslider-advanced .FullScreenWrapper-fullscreen:has(.swiper-custom-buttons):has(.swiper-pagination) .caption-inline {
    bottom: 25px !important;
}


.MuiMenu-list a {
    font-size: clamp(1rem, 2.6vw, 1.4rem);
}










.player-controls .MuiBox-root {
    padding-top: 6px;
}





.inline-player .title .title1 {
    font-size: 1.125rem;
    font-family: var(--font-family-sans);
    font-weight: 100;
    line-height: 1.1;
    text-transform: uppercase;
}

.inline-player {
    width: 96% !important;
    margin: 0 auto;
    margin-bottom: 8px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 15px;
}
.inline-player .player-controls {
    background-color: #fff
}

.player-icon {
    opacity: .5;
        background: #FFF;
}
.player-icon svg {
    font-size: 2em
}




[data-id="root"] .wrapper2 {
    height: 100dvh !important;
    max-height: 100dvh !important;
    position: relative;
}
.wma-hp .topbar .wrapper2 {
    height: calc(100vh - 56px) !important;
    max-height: calc(100vh - 56px) !important;
}
.wma-hp .homepage-linklist-wrapper {
    display: flex;
    flex-direction: column;
    z-index: 2;
    width: 100%;
    min-height: 100dvh;
    max-width: 900px;
    position: absolute;
    bottom: 0;
}
.homepage-linklist .childlink {
    background: #ffffff;
    padding: 10px 15px;
    margin-top: clamp(20px, 2vh, 25px);
    border-radius: 0;
    display: block;
    width: fit-content;
    text-decoration: none;
    text-transform: uppercase;
    color: #000;
    font-size: clamp(1.125rem, 5vw, 1.5rem);
    font-weight: 100;
    box-shadow: 5px 5px 14px hsl(0deg 0% 0% / 29%);
}
.wma-hp .homepage-linklist-wrapper .homepage-linklist {
    margin: 20px !important;
    margin-bottom: 30px !important;
}


.base .list-item:not(.inline-list-headline) .List-listItem.hero .List-titleFlex  {
    min-height: 50px;
}
.base .list-item:not(.inline-list-headline) .List-listItem.hero .List-title1 {
    font-weight: 100;
}

.list-item:only-child {
    border-top: 1px solid;
    border-bottom: 1px solid;
    margin: 1em 0;
}
.list-item:only-child .List-listItem {
    border-top: 0px solid;
    border-bottom: 0px solid !important;
}


.leaflet-popup-content {
    width: 139px !important;
}

.label {
    margin: 6px;
}
.EntityPage-root:has(.ida-map) .List-titleDiv {
    padding-left: 12px !important;
}

.List-listImg.svg.icon svg text {
    font-weight: 700;
    font-size: 2.5em;
}

.leaflet-marker-icon svg text {
    font-weight: 700;
    font-size: 3.5em;
}

/* img#overlay-0 {
    filter: drop-shadow(0px 0px 10px hsl(207.12deg 25.74% 29.71% / 58%));
} */

.base .list-item:not(.inline-list-headline) li.List-listItem.hero .List-titleDiv {
    padding-top: 0;
    padding-left: 0;
}

.only-menu-button {
    position: absolute !important;
    overflow-x: clip;
    width: 100%;
    text-align: right;
    height: clamp(56px, 6vh, 70px);
}
.only-menu-button button {
    height: clamp(56px, 6vh, 70px);
}
.only-menu-button button svg {
    font-size: clamp(24px, 4vw, 40px)
}
.MainContainer-main {
    position: relative;
}

@media (min-width: 900px) {
    .FullScreenWrapper-fullscreen {
        box-shadow: 0 0 50px hsl(0deg 0% 0% / 16%);
        max-width: 900px;
    }
}
@media (min-width: 900px) {
.outer-main-container {
        box-shadow: 0 0 50px hsl(0deg 0% 0% / 16%);
        max-width: 900px;
    }
    .imageslider-advanced img {
        max-height: 80vh;
    }
}

.FullScreenWrapper-fullscreen:has(video) .player-controls {
    background: transparent;
    width: 100%;
    margin: 0;
    position: fixed;
    bottom: 0;
    border-radius: 0;
    border: 0;
    height: 56px;
    z-index: 99;
    /*max-width: 900px;*/
}
.FullScreenWrapper-fullscreen:has(video) .player-controls * {
    color: gray;
}







.rm-action-button-container button {
    font-size: 1rem;
    padding: 12px;
    text-decoration: underline;
    text-underline-offset: 3px;
    color: var(--font-color);
}

.FullScreenWrapper-fullscreen .player-controls {
    position: fixed;
    bottom: 0;
    max-width: 900px;
}

.List-listImg.svg.icon {
    min-width: 48px;
    min-height: 48px;
}

html:has(.dark) {
    background: #000;
}

img#overlay-0 {
    width: clamp(130px, 25vw, 240px) !important;
  
}

.ck-table-resized {
    width: 100% !important;
    border-spacing: 0;
}
figure.table {
width: 100% !important;
margin-inline: 0 !important;
margin-block-end: 2em !important;

}
figure.table td {
    vertical-align:top;
    border-bottom: 1px solid #ddd;
    padding-block: .8em;
    line-height: 1.2;
}

.Collapsible {
    width: 96%;
    margin-inline-start: 2%;
    display: block;
    border-bottom: 1px solid #999;
    position: relative;
}


.base .inline-list-headline .List-title1 {
    font-weight: 500;
    font-size: clamp(1.3rem, 3vw, 1.8rem) !important;
}

/*  show more button übersetzungen */ .rm-action-button-container button { font-size: 0px; padding-block: 10px; padding-inline: 0; } .rm-more-button:before, .rm-less-button:before { content: ''; display: inline-block; font-size: 16px; color: var(--font-color); text-decoration: underline; text-underline-offset: 3px; } [lang="de"] .rm-more-button:before { content: 'Mehr anzeigen'; } [lang="de"] .rm-less-button:before { content: 'Weniger anzeigen'; } [lang="en"] .rm-more-button:before { content: 'More'; } [lang="en"] .rm-less-button:before { content: 'Less'; } [lang="fr"] .rm-more-button:before { content: 'Voir plus'; } [lang="fr"] .rm-less-button:before { content: 'Voir moins'; } [lang="it"] .rm-more-button:before { content: 'Mostra di più'; } [lang="it"] .rm-less-button:before { content: 'Mostra meno'; } [lang="es"] .rm-more-button:before { content: 'Ver más'; } [lang="es"] .rm-less-button:before { content: 'Ver menos'; } [lang="nl"] .rm-more-button:before { content: 'Meer tonen'; } [lang="nl"] .rm-less-button:before { content: 'Minder tonen'; } /* xx */