/**
    Overwrite/remove parent styles
 */

html body {
    background-color:#fff;
}

@media (min-width: 700px) {
    .entry-content > .alignwide:not(.wp-block-group.has-background), .entry-content > .alignfull:not(.wp-block-group.has-background) {
        margin-bottom: 0 !important;
        margin-top: 0 !important;
    }
}
/** width
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
    max-width: 100vw !important;
    width: 100vw !important;
}
 **/

/** paddings & margins **/

/** > 1 figures in entry-content */

.single-post .entry-content figure {
    margin-top:0;
    margin-bottom:0;

}

@media (min-width: 1000px) {
    article .entry-content > .alignwide:not(.wp-block-group.has-background), article .entry-content > .alignfull:not(.wp-block-group.has-background) {
        margin-bottom: 0;
        margin-top: 0;
    }
}




/** display nones **/
body figure.featured-media,
.singular .entry-header,
.post-meta-wrapper,
.pagination-single,
.comments-wrapper,
#site-footer {
    display: none;
}

/** Header **/

#site-header .header-inner {
    max-width: 168rem;
    padding: 1.15rem 0;
    z-index: 100;
}

#site-header .header-inner .mobile-search-toggle {
    display:none;
}

figcaption.media-license__figcaption,
.wp-block-image figcaption.media-license__figcaption {
    display:none;
}

.nav-toggle .toggle-text {
    display: none;
}



body #site-header {
    background:#000;
    color:#f9f9f9;
}


body:not(.overlay-header) #site-header .header-inner .toggle,
body:not(.overlay-header) #site-header .toggle-inner .toggle-text {
    color: #f9f9f9;
}


article .post-inner {
    padding-top:0;
}



.entry-content > h2.has-text-align-center {
    margin-top:.5em;
    margin-bottom:0;

    max-width:100vw !important;
    width:100vw !important;
    font-family: "GodfreyWeb-Black", sans-serif !important;
    letter-spacing: 0;
}

.entry-content > h5.has-text-align-center {
    margin-top:0;
    font-size:4.8rem;
}

/** Glossary/Source **/

    /** glossary back links on glossary page **/

    .page-glossary .entry-content a.backlink:before {
        background: url(/wp-content/plugins/ph-annemarie-mods-plastic/images/pfeil_orange.svg) no-repeat center;
        background-size: contain;
    }

    /** inline text **/
p.glossary {
    border-top:2px solid #000;
    padding-top:.5em;
}


p.glossary .title {
    display: inline-block;
    margin-right:2rem;
    font-family: 'GodfreyWeb-Black',sans-serif;
    text-transform: uppercase;
    font-size: 2.4rem;
}

p.glossary a {
    display: inline-block;
    margin-right: .5em;

    font-size:88%;
}

.page-sources .entry-content > p > a,
.page-quellen .entry-content > p > a {
    position:relative;
    padding-left:0;
}

.page-sources .entry-content > p strong a:before,
.page-quellen .entry-content > p strong a:before {
    display: inline-block;
    position: relative;
    padding-left: 22px;
    box-sizing: border-box;

    background: url(/wp-content/plugins/ph-annemarie-mods-plastic/images/pfeil_orange.svg) no-repeat center;
    background-size: contain;
}

.page-sources .entry-content > p a:before,
.page-quellen .entry-content > p a:before {
    position:relative;
    width: 19px;
    min-height: 1.5rem;
    background: url(/wp-content/plugins/ph-annemarie-mods-plastic/images/pfeil_next.svg) no-repeat left top;
    background-size: contain;

}


/** Relateds **/

.relateds {
    max-width: inherit;
    margin-top:0;
    margin-bottom: 3em !important;

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    gap: 0;
}

@media screen and (min-width: 900px){
    .relateds,
    #social-sharing {
        max-width: 55vw !important;
        gap: 20px 20px;
    }
}

.entry-content h4.related-heading,
.entry-content h4.share-heading {
    padding:0 !important;
    margin-bottom:0 !important;

    letter-spacing: 0;
}

@media screen and (min-width: 700px) {
    .entry-content h4.related-heading,
    .entry-content h4.share-heading {
        max-width: 55vw !important;
    }

}

.relateds .related-item {
    position: relative;
}

.related-item figure {

}
.related-item figure img {
    width:100%;
    max-height: 45vh;
}

/** Post Navi **/

#post_navi {
    max-width:inherit;
    text-align: right;
}

#post_navi a {
    display: inline-block;
    position: relative;
    padding-left: 22px;
    box-sizing: border-box;
}

#post_navi a:before {
    content: '';
    display: inline-block;
    position: absolute;
    left: 0;
    width: 19px;
    height: 100%;
    background: url(/wp-content/plugins/ph-annemarie-mods-plastic/images/pfeil_next.svg) no-repeat center;
    background-size: contain;
}



@media screen and (min-width: 700px) {
    #post_navi {
        max-width: 55vw !important;
    }
}

.relateds + #post_navi {
    margin-top: -2em;
}

/** Mosaic Block **/

.front-mosaic {
    max-width: 100vw !important;
    width: 100vw !important;


    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    grid-column-gap: 0;
    grid-row-gap: 0;

}

@media screen and (min-width:600px){
    .front-mosaic {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}

@media screen and (min-width:1000px){
    .front-mosaic {
        grid-template-columns: repeat(auto-fit, minmax(15vw, 1fr));
    }
}

.front-mosaic .mosaic-item {
    position:relative;
}

.front-mosaic .mosaic-item img {
    width:100%;
}

.mosaic-item h3.title,
.related-item h3.title {

    display: none;
    position: absolute;
    top: 50%;
    left:50%;

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


    font-size: 1.5rem;
    width: 100%;
    text-align: center;
    color: #000;
    margin:0;
    padding: 0 1vw;


    font-family: 'GodfreyWeb-Black',sans-serif;
    text-transform: uppercase;
    letter-spacing: 0;

    z-index: 9;

    transition:all 200ms linear;
}

@media screen and (min-width:700px){
    .mosaic-item h3.title,
    .related-item h3.title {
        font-size: 2.5rem;
    }
}

.front-mosaic .mosaic-item:hover a:before,
.relateds .related-item:hover a:before {
    content:'';
    display:block;
    position:absolute;
    top:0;
    left:0;
    height:100%;
    width:100%;
    background:rgba(255,255,255,.9);
}

.relateds .related-item:hover a:before {
    background:rgba(0,0,0,.8);
}

.front-mosaic .mosaic-item:hover h3.title,
.relateds .related-item:hover h3.title {
    display: block;
}

/** cat dependant background colors **/

/** Worum geht es bei Plastik **/
.front-mosaic .mosaic-item.category-5:hover a:before,
.relateds .related-item.category-5:hover a:before {
    background:rgba(248, 172, 8, .95);
}

/** Was ist das Problem mit Muell **/
.front-mosaic .mosaic-item.category-7:hover a:before,
.relateds .related-item.category-7:hover a:before {
    background:rgba(234, 116, 36, .95);
}

/** Was hat das mit mir zu tun? **/
.front-mosaic .mosaic-item.category-9:hover a:before,
.relateds .related-item.category-9:hover a:before {
    background:rgba(0, 128, 194, .95);
}

/** Git es Loesungen? **/
.front-mosaic .mosaic-item.category-11:hover a:before,
.relateds .related-item.category-11:hover a:before {
    background:rgba(0, 154, 121, .95);
}

/** Links **/

.entry-content p a,
.entry-content div a {
    color: #000;
    text-decoration: none;
    font-family: 'GodfreyWeb-BoldItalic';
}

.entry-content p > a {
    display: inline-block;
    position: relative;
    padding-left: 22px;
    box-sizing: border-box;
}

.entry-content p > a:before {
    content: '';
    display: inline-block;
    position: absolute;
    left: 0;
    width: 19px;
    height: 100%;
}

/** anchor links **/
.entry-content a[href^="#"]:before {
    background: url(/wp-content/plugins/ph-annemarie-mods-plastic/images/pfeil_next.svg) no-repeat center;
    background-size: contain;
}

/** external links **/

.entry-content a[href^="http"]:before {
    background: url(/wp-content/plugins/ph-annemarie-mods-plastic/images/pfeil_next.svg) no-repeat center;
    background-size: contain;
}

/** glossary links **/
.entry-content a[href*="/glossary"]:before,
.entry-content a[href*="/glossar"]:before,
.page-glossary .entry-content p a[href^=\#]:not([href=\#]):before {
    background: url(/wp-content/plugins/ph-annemarie-mods-plastic/images/pfeil_blau.svg) no-repeat center;
    background-size: contain;
}

/** sources links **/
.entry-content a[href*="/sources"]:before,
.entry-content a[href*="/quellen"]:before {
    background: url(/wp-content/plugins/ph-annemarie-mods-plastic/images/pfeil_pink.svg) no-repeat center;
    background-size: contain;
}


/** Nav toggle / hamburger **/
@media screen and (min-width:700px){
    .nav-toggle .toggle-inner .dashicons.dashicons-menu {
        font-size:50px;
        width:50px;
        height:50px;
    }

    .nav-toggle .toggle-icon {
        min-width: 50px;
    }
}

/** Menu Modal **/

@media screen and (max-width:700px){

    body .menu-modal.active {
        top:3vh;
        left:15vw;

    }

    .mobile-menu .modal-menu {
        left:0;
        width:79.5vw;

        text-align: right;
    }

    body .menu-modal {
        bottom:auto;
    }

    .menu-modal button.close-nav-toggle {
        padding: 3.1rem 0;
    }


}

.modal-menu .wpml-ls-current-language {

}

.modal-menu .wpml-ls-menu-item {
    display: inline-block;
}

.modal-menu .wpml-ls-menu-item a {
    padding:0 0 0 0;
    margin:0;
}

.modal-menu .wpml-ls-menu-item a:after {
    content: ' / ';
    font-style:normal;
}

.modal-menu .wpml-ls-last-item a {
    padding:0 2.5rem 0 0;
}

.modal-menu .wpml-ls-last-item a:after {
    content: '';
}


.menu-modal .menu-modal-inner {
    background:#f8b201;
}

.menu-top .modal-menu {
    text-align: right;
    padding-right: 6px;
}

.menu-modal .menu-modal-inner .modal-menu > li > .ancestor-wrapper > a {
    padding: 1rem 0;

    color:#111;

}

.menu-wrapper .wpml-ls-last-item {
    margin-bottom:2rem;
}

.mobile-menu .menu-item,
.menu-top .modal-menu li {
    border:none;
}


.modal-menu .menu-item:nth-of-type(7),
.modal-menu .menu-item:nth-of-type(9) {
    margin-top:2rem;
}

.menu-modal button.close-nav-toggle {
    padding-right:1em !important;
}

.menu-modal button.close-nav-toggle svg {
    height: 3.6rem;
    width: 3.6rem;
}


.menu-top .modal-menu a:focus,
.menu-top .modal-menu a:hover,
.menu-top .modal-menu li.current-menu-item > .ancestor-wrapper > a,
.menu-top .modal-menu li.current_page_ancestor > .ancestor-wrapper > a {
    text-decoration: none;
}

/** Fonts **/

article .entry-content {
    font-family: "GodfreyWeb-ThinItalic", sans-serif !important;
    font-size:2.5rem;
}

nav.expanded-menu li,
.entry-content strong {
    font-family: "GodfreyWeb-BoldItalic", sans-serif !important;

}

.cover-modal.show-modal {
    font-family: "GodfreyWeb-BoldItalic", sans-serif !important;
}

.entry-content strong {
    font-weight: 100;
}

.entry-content > h2 {
    font-family: "GodfreyWeb-Black", sans-serif !important;
    text-transform: uppercase;
    letter-spacing: 0px;

}

.entry-content > h5 {
    font-family:"GodfreyWeb-ThinItalic", sans-serif !important;
}


article .entry-content p {
    margin: 0 auto 1.6em auto !important;
    max-width:inherit;

    font-size:2.1rem;
}


@media screen and (min-width:800px){
    article .entry-content p {
        max-width:55vw !important;
        font-size:25px;
    }
}

article .related-heading,
article .share-heading,
#post_navi a {
    font-family: "GodfreyWeb-Black", sans-serif !important;
    text-transform: uppercase;
}


body.single-post .entry-content figure.wp-block-image:last-of-type {
    margin-bottom: 1.6em !important;
}

html {
    scroll-padding-top: 32px;
}