/*
Theme Name: St.Petri - St.Marien Child
Author: mankon
Author URI: https://mankon.de
Template: BasicMK
Description: Theme für St.Petri - St.Marien 
Version: 1.0.0
Text Domain: basismk-child
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Custom CSS
--------------------------------------------------------------*/
/* 
/* Document
	 ========================================================================== */

/**
* Farben
* weiß
* schwarz
* tuerkis gruen #639BA8
* orange #F47F13
* hell tuerkis Farbe Page Title home
* grau footer #505050
* hellgrau background #EAE9E5
* Farbverlauf Header 180deg
* dunkel #EAE9E5
* hell #7BB6C4
*


Breiten:
Blogübersicht (außer Termine) und Detailansicht, Termindetailansicht: 800px
normal: 1200px
weite Breite 1600px
gemsate Breite: 100%
**/

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
/**
* Typo lokal einbinden
*/
@font-face {
    font-family: 'fira_sansmedium';
    src: url('fonts/FiraSans-Medium.woff2') format('woff2'),
         url('fonts/FiraSans-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'fira_sansregular';
    src: url('fonts/FiraSans-Regular.woff2') format('woff2'),
         url('fonts/FiraSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'fira_sanssemibold';
    src: url('fonts/FiraSans-SemiBold.woff2') format('woff2'),
         url('fonts/FiraSans-SemiBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body,
button,
input,
select,
optgroup,
textarea {
	font-family: 'fira_sansregular', Verdana, sans-serif;
	font-size: 15px;
	font-size: 1rem;
/*    letter-spacing: .1px;*/
}

/*a:hover, a:focus, a:active {
	color: #999999;
}*/
/*
.main-navigation .current-menu-item > a, 
.current-menu-parent > a {
	color: #a80523;
}
*/

b, strong {font-family: 'fira_sanssemibold', Verdana, sans-serif; font-weight: normal;}


body {
    /*
    overflow: hidden; /* Spalt rechts entfernen oder Ursache für Spalt herausfinden */
}

/*
p, h2, h3, h4, h5, h6 {background-color: #ffffff;}
.hg-trans, .wp-block-cover p, .wp-block-cover h2, .wp-block-cover h3, .wp-block-cover h4,
.blog p, .blog h2 {
    background-color: transparent;
}*/

/* Seitenlayout Desktop */

@media screen and (min-width: 62rem){
    #page {
        display: grid;
        grid-template-columns: minmax(min-content,1fr) minmax(min-content,3fr);
    }
    #masthead {
      grid-row: 1/3;
      grid-column: 1;
    }
    #content {
      grid-row: 1;
      grid-column: 2;
    }
    #colophon {
      grid-row: 2;
      grid-column: 2;
    }
}






/*--------------------------------------------------------------
# Breiten
--------------------------------------------------------------*/
p.has-text-align-center {
    max-width: 864px !important;
    margin-left: auto;
    margin-right: auto;
}
.blog article, .single article, .archive  article, .category article, .comments-area, .search article {
    max-width: 864px;
    margin: 0 auto;
}
section.error-404, .search article {
    max-width: 864px;
    width: calc(100% - 3rem);
    margin: 0 auto;
}
.archive.category-termine  article {
    max-width: 1200px;
}
.logo-nav {
    max-width: 1600px;
    margin: 0 auto;
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

header#masthead {
    /*-webkit-box-shadow: 12px 12px 12px -12px rgba(238,238,238,1);
    -moz-box-shadow: 12px 12px 12px -12px rgba(238,238,238,1);
    box-shadow: 12px 12px 12px -12px rgba(238,238,238,1);*/
    background-color: #383737;
}



.site-description {font-size:0;}





/* Header Buttons und Socials */

header#masthead .has-black-color.has-white-background-color {
    width: 10rem;
}
header#masthead .has-black-color.has-white-background-color:hover {
    color: #ffffff;
    background-color: #BB261F;
    opacity: 1;
}




.entry-content {
    
}
.logo-nav {
    position: relative;
    transition-property: all; /* wenn body.down benutzt wird, smoothy Übergänge*/
    -webkit-transition: 0.2s ease;
    -moz-transition: 0.2s ease;
    -o-transition: 0.2s ease;
    transition: 0.2s ease;
    padding: 0;
    
    margin: 0 auto;

    display: flex;
}




/* zusätzliche Icons unter Navi - hart kodiert in header.php */
/*  
Abstand unten content bzw. footer für < 62rem
Größe kleiner
alles inline Blöcke
1 Zeile nebeneinander
100% Breite
*/
#mk-icons-menu .wp-block-social-links {
    display: flex;
}
.wp-block-social-links.is-style-logos-only .wp-social-link-facebook  a svg { fill: #1778f2 !important; }
.wp-block-social-links.is-style-logos-only .wp-social-link-instagram a svg { fill: #f00075 !important; }
.wp-block-social-links.is-style-logos-only .wp-social-link-youtube a svg { fill: red !important; }


@media screen and (min-width: 62rem){
    #mk-icons-menu {
        margin: 0 auto;
        padding-left: 2.5rem;
        max-width: 16rem;

    }
    #mk-icons-menu .wp-block-buttons .wp-block-button {
        margin-bottom: 1rem;
    }

}
@media screen and (max-width: 62rem){

    #mk-icons-menu {
        position: fixed;
        bottom: 0;
        left: 0;
        background:#383737;
        width: 100%;
        z-index: 1;
        display: flex;
        align-items: center;
    justify-content: center;
    }

    /*
    #mk-icons-menu .wp-block-buttons, .wp-block-social-links {
        display: inline-block;
    }
    */
    #mk-icons-menu .wp-block-buttons {
        padding: 0;
    }
    #mk-icons-menu .wp-block-button a {
        background-color: transparent !important;
        padding: 8px 2px;
        width: auto !important;
        color: #ffffff !important;
        font-size: 1rem;
    }
    .wp-block-social-links, #mk-icons-menu .wp-block-button {
        margin-bottom: 0;
    }
}


/* Standardbutton umstylen */
.wp-block-button__link {
    background-color: #bb261f;
    border-radius: 0;
}





/* aus basisMK überschreiben 
#Haupt-Menu {
    float: none;
    position: relative;
}
#Service-Menu, #Haupt-Menu {
    display: block;
}
*/


/* aus basisMK 
.main-navigation {
        flex: 1 1 auto;
        align-self: flex-start;
        padding-left: 40px;
    } 
*/


/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	width:230px;
	height:156px;
    padding-top: 0;
}
.logo {
    width: 230px;
    padding: 20px 0 0 20px;
}



@media screen and (min-width: 62rem){
    
    
    .logo-nav {
        max-width: 16rem;
        display: block;
    }
        
        
    
    .logo {
      width: 230px;
/*      padding-top: 20px;*/
    }
    /* Make sure logo link wraps around logo image. */
    .custom-logo-link {
        width: 230px;
        height: 156px;
    }

    
}
/*@media screen and (min-width: 1220px){
    .logo {
      padding-left: 0;
    }
    
}*/



/* Element | https://waschkueche-brunnenviertel.de/ 

#content {
  margin-top: -200px;
}

*/














/*
.logo {
    width: 170px;
    height: auto;
    transition: all 1s;
    padding: 50px 0 0 3px; 
}

home .logo {
    width: 200px;
}*/

.archive h1.page-title {
    background-color: transparent;    
}


















h1.entry-title, h1.page-title {
   
    width: calc(100% - 4rem);
    margin: 2rem auto 0;
    line-height: 1.4;
    letter-spacing: 1px;
     padding-top: 1.5rem;
     padding-bottom: 1.5rem;
    
/*    background-color: beige;*/
}


@media screen and (min-width: 62rem){
    h1.entry-title, h1.page-title  {
        max-width: 1200px !important;
        margin: 0px auto 0 !important; 
        
    }
    body.home h1.entry-title  {
        margin: 0 auto 0 !important; 
        
    }
}






/* sticky
@media screen and (min-width: 53em){
    .site-header  {
        position: fixed;
        transition: all 1s;
        width: 100%;
       
    }
    /*Abstand nach oben, Platz für sticky Menu * /
    .site-content {
        padding-top: 84px;
    }

    
}*/


/* Abstände in Navigationsleiste */
.menu-item-100, .menu-item-146, .menu-item-150 {margin-top: 1rem;}

.main-navigation   {
    font-family: 'fira_sansmedium', Verdana, sans-serif;
    letter-spacing: .2px;
}
.main-navigation a {
    color: #fff;
}

#Haupt-Menu {
    margin-left: 1.5rem;
}

/*.main-navigation .menu > li {
    float: none;
    
}*/



/*.main-navigation ul ul  {
    background-color: rgba(255,255,255,.5);
}*/
.main-navigation ul ul  {
    min-width: 170px;
}

/* wenn HMP aktiv, submenü anzeigen */
.main-navigation .current-menu-item.menu-item-has-children .sub-menu
{display: block;}
.main-navigation .current-menu-item.menu-item-has-children::after
{color:#a8a8a8;}















/*body.down .site-header .logo { 
    transition: all 1s;
    width: 80px;
}

body.down .site-header .main-navigation:not(.toggled) a { 
    margin-top:0.2rem;     
/*    transition: margin .5s;   * /
}
body.down .main-navigation:not(.toggled) .menu-service-menu-container,
body.down .main-navigation:not(.toggled) .menu-oberes-menue-container {
    height:0;
}
body.down .main-navigation:not(.toggled) #Service-Menu,
body.down .main-navigation:not(.toggled) #Haupt-Menu {
    position:static;
}


body.down .logo-nav {
    height: 40px;
}
*/
/*

body.down #Service-Menu .kalender { 
    font-size: 0;
    transition: font-size .5s;
}
#Service-Menu .kalender::before { 
    content: url(svg/kalender.svg);
    width:0;
    height: 0;
    display: block;
    transition: width .5s;
    transform-origin: right;
  /*  transition-delay: .2s;* /
}
body.down #Service-Menu .kalender::before { 
    content: url(svg/kalender.svg);
    width:17px;
    height: 18px;
}








body.down #Service-Menu .aktuell { 
    font-size: 0;
    transition: font-size .5s;
}
#Service-Menu .aktuell::before { 
    content: url(svg/news.svg);
    width:0;
    height: 0;
    display: block;
    transition: width .5s;
}
body.down #Service-Menu .aktuell::before { 
    width: 23px;
    height: 18px;
}
*/

/* alternativ: background image icon nur anzeigen, wenn Klasse down 
body .main-navigation:not(.toggled) #Service-Menu .aktuell { 
    background-image: url(svg/news.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 0;
    transition: all .5s;
}
body.down .main-navigation:not(.toggled) #Service-Menu .aktuell { 
    font-size: 0;
    background-size: 26px 22px;
    transition: all .5s;
    padding: 10px 5px;
}





body .main-navigation:not(.toggled) #Service-Menu .kalender { 
    background-image: url(svg/kalender.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 0;
    transition: all .5s;
}
body.down .main-navigation:not(.toggled) #Service-Menu .kalender { 
    font-size: 0;
    background-size: 22px 22px;
    transition: all .5s;
    padding: 10px 5px;
}






.main-navigation #Service-Menu .current-menu-item > a,
body #Service-Menu .aktuell:hover,
body .menu-item-search .search-field:hover,
body #Service-Menu .kalender:hover {
    opacity: .6;
    transition: all .5s;
}


*/





/*Abstand nach oben, nicht für Platzhalterseite 
.page-id-126 .site-content {
    padding-top: 0;
}


body.down .site-content {

    padding-top: 5rem;

}
*/
.page-content, .entry-content, .entry-summary {
    margin: 0;
}



/*

/*
** Homepage Hero 2-teiliger Rahmen um Bild
********************************************************** /
.hero img {
    padding: 3% 4% 3% 8%;
    
}
.hero figure {
    background-image: url(https://beta.gemeinde-versoehnung.de/wp-content/themes/kapelle-child/svg/hero_back.svg);
    background-size: cover;
    max-width: 1200px;
    width:100%;
    position: relative;
}
.home .hero figure {
    background-image: url(https://beta.gemeinde-versoehnung.de/wp-content/themes/kapelle-child/svg/hero_back_home.svg);
}


.hero figcaption {
    text-transform: uppercase;
    position: absolute;
    bottom: 20%;
    left: 15%;
    background-color: rgba(0,0,0,.5);
    text-align: left !important;
    color: #ffffff;
    width: auto;
    max-width: 29rem;
    line-height: 1.3;
    font-size: 1.5rem;
    font-size: 5vw;
    letter-spacing: 1px;
    padding: .5rem 1rem;
    
    /*
       text-shadow: 
     -1px 0px 1px hsl(0,0%,0%), 
     1px 0px 1px hsl(0,0%,0%), 
     0px -1px 1px hsl(0,0%,0%), 
     0px 1px 1px hsl(0,0%,0%);
    * /
}

@media screen and (min-width:53em) {
    
    .hero figcaption {
        font-size:2.5rem;
    }
}



*/



/********************************/

/* Blogauszug auf Home 

bracuehnw ir das? 5.3.2021 * /
ul.wp-block-latest-posts {
    padding: 0 1rem 4rem;
}
@media screen and (min-width:50em) {
    ul.wp-block-latest-posts {
        display: block;
    }

    .wp-block-latest-posts > li {
        margin-right: auto !important;
    }

}
*/



/*???

.archive .page-title, .search .page-title, .error404 .page-title   {
    margin-top: 1rem !important;
}
.blog h2.entry-title a, .archive h2.entry-title a {
    text-decoration: none;
}
.blog h2.entry-title {
    margin-bottom: 0;
}
*/





/*--------------------------------------------------------------
# Custom CSS
--------------------------------------------------------------*/
.wp-block-separator {
  border-top: none;
  border-bottom: none;
}

h1, h2 {
    font-family: 'fira_sanssemibold', Verdana, sans-serif;
}
h3, h4 {
    font-family: 'fira_sansmedium', Verdana, sans-serif;
}
h1, h2 {
text-align: center;
}

.home .wp-block-latest-posts li a {
    font-family: 'fira_sansmedium', Verdana, sans-serif;
    font-size: 1.4rem;
    
}
.home .wp-block-latest-posts.wp-block-latest-posts__list li {
    padding-bottom: 2rem;
}


h1 {
    font-size: 2.5rem;
   
}
h2 {
    font-size: 2rem;
}
h3 {
    font-size: 1.6rem;
}



@media screen and (max-width:781px) {
    h1 { font-size: 2.1rem; }
    h2 { font-size: 1.7rem; }
    h3 { font-size: 1.4rem; }
}
    
h1 a, h2 a, h3 a, h4 a, .home .wp-block-latest-posts li a {
    text-decoration: none;
}








.hentry, .page-header, .page-content {
    margin: 0;
}

.site-main {
    padding: 0;
}


/* @media screen and (min-width: 59.6875em) {
    .sidebar {
        float: left;
        margin-right: -100%;
        max-width: 313px;
        position: relative;
        width: 29.4118%;
    }
} */

/*Anpassungen Sprungmarken */
.entry-content h3:target {
    padding-top: 100px;
    margin-top: -100px;
    color: #a80523;
}
.entry-content h3:target + p {
    background-color: #f0eeee  !important;
}



/* 
* Custom CSS für Blog */
/*.blog article, .single article, .archive  article, .category article */
body:not(.page)
.entry-header > :not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
    max-width: 1200px;
    width: calc(100% - 4rem);
    margin-top: 2rem;
    margin-right: auto;
    margin-bottom: 2rem;
    margin-left: auto;
    position: relative;
}



/* Zitat */
.wp-block-quote.is-large p, .wp-block-quote.is-style-large p {
    font-style: normal;  
}


/* Blog figure auf max 1200px begrenzen */
.single .wp-block-image {
    max-width: 800px;
    margin: 0 auto;
}
.alleBeitraege {
    max-width: 1200px;
    margin: 0 auto;
    display: block;
    text-transform: uppercase;
    padding-top: 3rem;
    letter-spacing: 1px;
    font-size: 1.1rem;
}
/*
.single .page-title, .blog .page-title, .archive .page-title  {
    border: none;
    background-color: #ffffff;
}

.single .entry-content, .blog .entry-content, .archive .entry-content {
    padding: 20px;
    background-color: #f2f0ef;
    margin-bottom: 2rem;
}
*/

/* Überschriften im Blog korrigieren */
.blog h2.entry-title, .single h2.entry-title, .search h2.entry-title, .archive h2.entry-title {text-align: left; margin-bottom: .5rem !important;}
.blog .entry-meta, .single .entry-meta, .search .entry-meta, .archive .entry-meta {margin-top: 0 !important;}



/* Element Spalten mit Klasse Featured Pages */
/*.featured-pages .wp-block-image {   /* figure * /
    position: relative;
}
.featured-pages .wp-block-image figcaption {   
    position: absolute;
    background: rgba(0,0,0,.35);
    top: 30%;
    text-align: center;
    width: 100%;
    font-size: 2.25rem;
}
.featured-pages .wp-block-image figcaption a {   
    background: rgba(56,55,55,.2);
    padding: 1rem;
    display: block;
    width: 100%;
    margin: 0;
    color: #ffffff;
    text-decoration: none;
    font-size: 2rem;
    font-family: 'fira_sansmedium', Verdana, sans-serif;
    line-height: 1.2;
}

.featured-pages .wp-block-image figcaption a:hover {
    background: rgba(0,0,0,.8);
}

@media screen and (min-width:600px) and (max-width:781px) {
    .featured-pages .wp-block-column:last-child {
        flex-basis: 100%!important;
        display: flex;
    }
    .featured-pages .wp-block-column:last-child figure:nth-child(2n) {
        margin-left: 2em!important;
    }
    
    
    .featured-pages .wp-block-column:last-child[style*='33.33%']
    {background-color: red;}
}
*/

.featured-pages .wp-block-group__inner-container {
    display: flex;
    flex-wrap: wrap;
}

.featured-pages .wp-block-image {
    flex: 0 0 100%;
    margin-bottom: 0;
}
@media screen and (min-width:600px) and (max-width:781px) {
    .featured-pages .wp-block-image {
        flex: 0 0 48%;
    }
    .featured-pages .wp-block-image:nth-child(2n) {
        margin-left: 4%!important;
    }

}
@media screen and (min-width:781px) {
    .featured-pages .wp-block-image {
        flex: 0 0 32%;
    }
    .featured-pages .wp-block-image:nth-child(3n+2), 
    .featured-pages .wp-block-image:nth-child(3n+3) {
        margin-left: 2%!important;
    }

}
.featured-pages .wp-block-image {   /* figure */
    position: relative;
}
.featured-pages .wp-block-image figcaption {   
    position: absolute;
    background: rgba(0,0,0,.35);
    top: 30%;
    text-align: center;
    width: 100%;
    font-size: 2.25rem;
}
.featured-pages .wp-block-image figcaption a {   
    background: rgba(56,55,55,.2);
    padding: 1rem;
    display: block;
    width: 100%;
    margin: 0;
    color: #ffffff;
    text-decoration: none;
    font-size: 2rem;
    font-family: 'fira_sansmedium', Verdana, sans-serif;
    line-height: 1.2;
}

.featured-pages .wp-block-image figcaption a:hover {
    background: rgba(0,0,0,.8);
}




/*--------------------------------------------------------------
# Medien und Text, Bilder obenbündig und Reihenfolge mobile
--------------------------------------------------------------*/
div.wp-block-media-text.is-stacked-on-mobile figure.wp-block-media-text__media {
    align-self: flex-start;
}

@media (max-width:600px) {
    .wp-block-media-text.is-stacked-on-mobile.has-media-on-the-right figure.wp-block-media-text__media {
        grid-row: 1;
    }
    .wp-block-media-text.is-stacked-on-mobile.has-media-on-the-right .wp-block-media-text__content {
        grid-row: 2;
    }
}



/*
* grün       #809628

*/
/* Hamburger Icon weiß */
.line {
    background-color: #ffffff;
}
    
    

.sub-menu a, .sub-menu a:hover {
    border-bottom: none !important;
}
    

@media screen and (min-width: 62rem){
    #Service-Menu {
        background-color: #E58032;
    }
    .menu-service-menu-container a {
        color: #aaa;
    }
    .main-navigation #Service-Menu > li > a {
        color:#ffffff;
        margin: 0.2em 0 0 0;
    }

}

    



/* Suche * /
.search article, .archive article {
    max-width: 800px;
    margin: 0 auto;
}
.search article h2, .archive article h2 {
    padding-left: 0 !important;
}
.search article h2 a, .archive article h2 a {
    color:#E58032;
}
.search article h2 a:hover, .archive article h2 a:hover {
    opacity: .7;
}


.menu-item-search .search-field {
	background-color: transparent;
	background-color: #E58032;
    background-image: url(img/lupe.svg);
	background-position: 5px center;
	background-repeat: no-repeat;
	background-size: 20px 18px;
	border: none;
	cursor: pointer;
	height: 37px;
	margin: 0;
	padding: 0 0 0 34px;
	position: relative;
	-webkit-transition: width 400ms ease, background 400ms ease;
	transition:         width 400ms ease, background 400ms ease;
	width: 0;
}
 
.menu-item-search .search-field:focus {
	background-color: #fff;
	border: 1px solid #666;
	cursor: text;
	outline: 0;
	width: 200px;
}
.toggled .menu-item-search .search-field {
	background-color: #fff;
	border: 1px solid #666;
	cursor: text;
	outline: 0;
	width: 90%;
    margin: 1rem;
}
.search-form
.search-submit { 
    display:none;
}
 */


.wp-block-cover-text, .wp-block-cover, .wp-block-quote {
    font-family: 'fira_sansmedium', Verdana, sans-serif;
    font-weight: normal;
}


/*
.volle-breite a {
    border: none;
    text-transform: none;
        padding: 0;
}
.volle-breite a:hover {
    background-color: transparent !important;
    
}

*/
/*
<div class="wp-block-buttons aligncenter">
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-white-color has-text-color no-border-radius" href="https://waschkueche-brunnenviertel.de/chronik/">Chronik der St.Petri - St.Marien</a></div>
</div>
*/

/* Button hover wenn weiß */
.is-style-outline  a.has-white-color:hover {
    border-color: #fff;
    background-color: #fff;
    color: #000;
    opacity: 1;
}

/*
a.btn {
    border-color: #809628;
    color: #809628;
}
a.btn:hover {
    background-color: #809628;
}
*/

/*
.has-4-columns img {
    border-color: #c5c5c5;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
}
*/

/* Infografik 
.content-zentriert {
  text-align: center;
}
.content-zentriert iframe {
  border: none;
  background-color: #ffffff;
}
div.wp-block-group:nth-child(4) > div:nth-child(1) > iframe:nth-child(1) {
  /* margin: 0 auto; * /
}
*/





.site-footer  {
   /* background-image: url('https://waschkueche-brunnenviertel.de/wp-content/themes/waschkueche-child/svg/footer-welle-Pfad.svg');
    
    background-repeat: repeat-x;
    background-size: 3000px;
    background-position: top center;
    background-color: #505050;
    padding-bottom: 1rem;
    padding-top: 170px;*/
    background-color: #4E4E4E;
    padding-bottom: 3rem;
}
.site-footer .menu {
    margin-top: 1rem;
    margin-left: 0;
}


.site-footer section, .site-footer .site-info {
    width: calc(100% - 4rem);
    margin-left: auto;
    margin-right: auto;
}



/* Footer 4-spaltig */

/*@media screen and (min-width: 53rem){*/
@media screen and (min-width: 62rem){
    .site-footer {
        display: grid;
        grid-template-columns: repeat(4, minmax(100px, 300px) );
        grid-gap: 20px;
        align-content: center;
        justify-content: center;
        padding-bottom: 0;
    }
    .site-footer section:first-of-type {
        flex: 1 1 22%;
        grid-row: 1; 
        grid-column: 1;
    }
    .site-footer section:nth-child(2){
        flex: 1 1 22%;
        grid-row: 1; 
        grid-column: 2;
    }
    .site-footer section:nth-child(3){
        flex: 1 1 22%;
        grid-row: 1; 
        grid-column: 3;
    }
    .site-footer section:nth-child(4){
        flex: 1 1 22%;
        grid-row: 1; 
        grid-column: 4;
    }
    .site-footer div.site-info  {
        grid-row: 2;
        grid-column: 1 / 4;
    }
}






.site-footer, .site-footer a  {
    color: #ffffff;
    text-decoration: none;
}
.site-footer a:hover, footer .current-menu-item a  {
    opacity: .8;
    text-decoration: underline;
    text-underline-position: under;
    text-decoration-skip-ink: none;
}
.site-footer .logo {
    padding: 0 0 0 2rem;
    width: 250px;
}




    




/* Akzent für geklammerte Blöcke
 * 2-spaltig favorisiert
 * 2 Varianten: links gruen, rechts grau und umgekehrt
 */


/* mit content before und after
.wp-block-columns.akzent {
    position: relative;
}
.wp-block-columns.akzent .wp-block-column:first-of-type::before {
    content: "";
    position: absolute;
    width: 50%;
    height: 20px;
    top: 0;
    left: 0;
    background-color: #809628;
    display: block;
}
.wp-block-columns.akzent .wp-block-column:first-of-type::after {
    content: "";
    position: absolute;
    background-color: 
    #809628;
    display: block;
    width: 40px;
    height: 50%;
    top: 0px;
    left: -20px;
}
.wp-block-columns.akzent .wp-block-column:last-of-type::before {
    content: "";
    position: absolute;
    width: 50%;
    height: 20px;
    bottom: 0;
    right: 0;
    background-color: #353535;
    display: block;
}
.wp-block-columns.akzent .wp-block-column:last-of-type::after {
    content: "";
    position: absolute;
    background-color:     #353535;
    display: block;
    width: 40px;
    height: 50%;
    bottom: 0px;
    right: -20px;
}
.wp-block-columns.akzent .wp-block-column {
    padding: 20px ;
   
}
.wp-block-columns.akzent .wp-block-column figure {
    margin: 0 ;
   
}*/

/* mit 1-px-Bild im Hintergrund. Problem: Text
.wp-block-columns.akzent .wp-block-column:first-of-type {
    background-image: url(https://beta.gemeinde-versoehnung.de/wp-content/themes/kapelle-child/img/grau.gif);
    padding: 20px 40px;
  background-size: 70%;
  background-repeat: no-repeat;
  background-position: top left;
}
.wp-block-columns.akzent .wp-block-column figure {
    padding: 0;
}
.wp-block-columns.akzent .wp-block-column:first-of-type h2,
.wp-block-columns.akzent .wp-block-column:first-of-type h3,
.wp-block-columns.akzent .wp-block-column:first-of-type h4,
.wp-block-columns.akzent .wp-block-column:first-of-type p {
    padding-left: 20px;
    background-color: #ffffff;
}
*/






/******************/

.wp-block-latest-posts.has-dates time::before {
    content: "Veröffentlicht am ";
}

/*ul.wp-block-latest-posts > li {
    background-image: url(https://);
    background-size: 120%;
      margin-bottom: 1rem;
      
  }
@media screen and (min-width: 50em) {
  ul.wp-block-latest-posts > li {
    background-size: 260%;      
      margin-bottom: 0;
  }
}

.wp-block-latest-posts > li:nth-child(1) {
    background-position: left bottom;
}
.wp-block-latest-posts > li:nth-child(2) {
    background-position: center bottom;
}
.wp-block-latest-posts > li:nth-child(3) {
    background-position: right bottom;
}


.wp-block-latest-posts > li:nth-child(1) {
    background-color: #b36d04;
}
.wp-block-latest-posts > li:nth-child(2) {
    background-color: #c8842b;
}
.wp-block-latest-posts > li:nth-child(3) {
    background-color: #333;
}
ul.wp-block-latest-posts > li a {
    border: thin solid white;
    
}
*/

.wp-block-latest-posts > li {
    background-color: transparent !important;
    max-width: 800px;
    margin: 1rem auto .5rem;
    text-align: left !important;
}
.wp-block-latest-posts > li a {
    color: #000000 !important;
}
.wp-block-latest-posts__post-date {
/*    margin-top: .5rem !important;*/
    font-size: 1rem !important;
    color: #616161 !important;

}



.has-huge-font-size .dashicons {
    font-size: 4rem;
    color: #e89211;
    width: 70px;
    height: 70px;
}

@media screen and (max-width: 50em){
    .has-huge-font-size, .has-larger-font-size {
        font-size: 2rem;
    }
}

/*********************************************/

/* Element | https://stage.marienkirche-berlin.de/ */
/*3 Spalten mit 3 Covern, Link drauf für featured Pages * /
.wp-block-columns .wp-block-cover a {
  background: rgba(0,0,0,.35);
  padding: 1rem;
  display: block;
  width: 100%;
  margin: 0;
    color: #ffffff;
    text-decoration: none;
}
.wp-block-columns .wp-block-cover a:hover {
  background: rgba(0,0,0,.2);
}*/
.wp-block-columns .wp-block-cover {
    padding-left: 0;
    padding-right: 0;
}



/* Termine und Aktuelles auf der Homepage */
.termine-aktuelles .wp-block-column {position: relative;}
.termine-aktuelles .wp-block-column:first-of-type {background-color: #BB261F;}
.untenrechts {
    position: absolute;
    bottom: 0;
    right: 0;
    margin: 0 -.2rem -.6rem 0;
    line-height: 1;
    color: #fff;
    font-size: 3.75rem;
}

.bg-beige {background-color: #fafafa; padding-left: 1rem; padding-right: 1rem;}
.bg-beige .untenrechts {
    color: #383737; 
}



/* 

kann weg? 

/* CSS für Blo Grid Plugin 
/* Grid style 
.display-posts-listing.grid {
	display: grid;
	grid-gap: 16px;
    max-width: 1200px;
    margin: 0 auto;
}

.display-posts-listing.grid .title {
	display: block;
    padding-top: 1.5rem;
  text-decoration: none;
  border-bottom: #8e8e8e solid thin;
  display: inline-block;
  line-height: 1.2em;
  font-size: 1rem;
}

.display-posts-listing.grid .date {
    font-size: .8rem;
    display: block;
    margin-top: .5rem;
}
.display-posts-listing.grid .title, .display-posts-listing.grid .date  {
    color: #8e8e8e;
}

.display-posts-listing.grid img { 
	display: block; 
	max-width: 100%; 
	height: auto; 
}

@media (min-width: 600px) {
	.display-posts-listing.grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media (min-width: 1024px) {
	.display-posts-listing.grid {
		grid-template-columns: repeat( 3, 1fr );
	}
}

*/