/* e-wie-evanagelisch */
.ev-widget {
    width:100%;
    position:relative;
}
.bgtrans {
    position:absolute;
    width:100%;
    height:100%;
    z-index:100;
    opacity:0
}
.svg_wrapper {
    position:absolute;
    top: 100px;
    text-align:center;
    z-index:80;
    width:90%;
    height:auto;
    display:block;
    margin:0 auto;

}
.ev-widget-inner {
    position:relative;
    height:auto;
    background-color:#444;
}
.ev-widget-inner img {
    width:100%
}
.headerwrapper {
    width:100%;
    background-color:#444;
}
.headerwrapper h1 {
    margin:0;
    text-align:center;
    padding:15px;
    z-index:2;
    color:white;
    opacity:0.85;
    background-color:grey;
}
.headerwrapper div {
    color:#fff;
    text-align:center;
    font-size:12px;
    padding:10px;
    line-height:15px;
}
/* Newsletter */
.newletter-wrapper {
    background-color:#f5f5f5;
    padding:15px 0;
    border-radius:4px;
}

.newsletter .submit_container {
    padding:15px 0;
}
.newletter-wrapper .body {
  padding-bottom: 1rem;
  font-size: 1rem;
}
.newletter-wrapper .footer {
  font-size: 0.8rem
}
/* tageslosung */

.tageslosung_wrapper {
    padding:15px;
    border-radius:4px;
}
.losung_lehrtext {
    margin-top:15px;
}
.losung_bibelstelle, .losung_lehrstelle {
    color:gray;
}

/* Banner*/
.banner-img {
    width: 100%;
    height: auto;
}
.banner_mess {
    padding:10px 0;
    color: #737373;
}
/* Twitter / Facebook */
.vk_mwsblocks_small {
  color:grey;
  font-size:0.9rem;
}
/* Video */
.mwsvideowrapper {
  /*display: flow-root;*/
  position: relative;
}
/*
.mwsvideo_info {
  background-color: rgba(255,255,255,.80);
  padding:10px;
  margin:5px 10px;
  border-radius: 6px;
  position: absolute;
  overflow: scroll;
  font-size:.85rem;
}
.showvideoselection_inside {
  font-size:1rem;
}
.mwsvideowrapper:after {
  content: '';
  display: block;
  padding-bottom: 56.25%;
}
.mwsvideowrapperpreview {
  padding:5px 0;
  aspect-ration: 16/9;
}
.mwsvideowrapperpreview:after {
  content: '';
  display: block;
  padding-bottom: 56.25%;
}
.mwsvideowrapper iframe {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
}*/
.responsive-video-iframe {
  position: relative;
  width: 100%; /* Volle Breite */
  overflow: hidden;
}


.responsive-video-iframe iframe {
  /*position: absolute;
  top: 0;
  left: 0;*/
  width: 100%;
  height: auto;
  border: 0;
}
.mwsvideowrapper video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Teaser nach Schlagwort */
teaser-by-tag-wrapper h2 {
    font-size: 1.8rem;
    border-bottom: 0;
}

.teaser_by_tag > h2 {
    font-size: 1.25rem
}

.teaser-by-tag-wrapper .fa {
    display: none;
}

.path-frontpage .container.vk_tags {
    display: none;
    visibility: hidden;
}

li.page-item.pager__item.is-active .page-link {
    background-color: #dedede;
}

.teaser-by-tag-wrapper .vk_tags {
    display: none;
}

.teaser_by_tag > h2 {
    font-size: 2rem;
    border-bottom: 1px solid #dedede;
}

#crtextemail {
  width: 100%;
  margin-bottom: 15px;
}

form#newsletter-form .cr_button{
  margin-top: 10px;
  border: 1px solid #d3d3d3;
}
/* Liturgischer kalender */
.lk_widget h2 {
  display:none;
}
.lk_widget_inner {
  margin: 5% 5% 1em !important;
}

/*Spendenbutton*/
.spendenbutton_wrapper {
  margin: 0 auto;
  text-align: center;
  padding: 15px;

  img {
    width: 100%;
    max-width: 200px;
  }

  .spendenbutton_message {
    margin-top: 15px;
  }
}

/* Facebook-Fallback */
.vk-fb-embed {
  position: relative;
  min-height: var(--vk-fb-height, 500px);
  max-width: 500px; /* Facebook liefert max. 500px Breite */
}

.vk-fb-embed__fallback {
  border: 1px solid #d3d3d3;
  border-radius: 6px;
  min-height: var(--vk-fb-height, 500px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
}

.vk-fb-embed__fallback-inner {
  text-align: center;
}

/* Sobald FB geladen hat, Fallback ausblenden */
.vk-fb-embed.is-loaded .vk-fb-embed__fallback {
  display: none;
}

/* Wenn Klaro Consent-Box angezeigt wird, Fallback verstecken */
.vk-fb-embed.has-consent .vk-fb-embed__fallback {
  display: none;
}

/* Video-Fallback */
.vk-video-embed {
  position: relative;
}

/* Fallback liegt über dem Video-Bereich */
.vk-video-embed__fallback {
  position: absolute;
  inset: 0;
  border: 1px solid #d3d3d3;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
  z-index: 2;
}

.vk-video-embed__fallback-inner {
  text-align: center;
}

/* Wenn Video geladen: Fallback weg */
.vk-video-embed.is-loaded .vk-video-embed__fallback {
  display: none;
}

/* Wenn Klaro-Consent-Box sichtbar ist: Fallback weg (wie bei Facebook) */
.vk-video-embed.has-consent .vk-video-embed__fallback {
  display: none;
}
.vk-video-embed__fallback {
  pointer-events: none;
}

/* iFrame-Fallback */
.vk-iframe-embed {
  position: relative;
  min-height: var(--vk-iframe-height, 500px);
}

/* Fallback als Rahmen in iFrame-Höhe */
.vk-iframe-embed__fallback {
  border: 1px solid #d3d3d3;
  border-radius: 6px;
  min-height: var(--vk-iframe-height, 500px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
  pointer-events: none;
}

.vk-iframe-embed__fallback-inner {
  text-align: center;
}

/* Wenn iframe geladen: Fallback weg */
.vk-iframe-embed.is-loaded .vk-iframe-embed__fallback {
  display: none;
}

/* Wenn Klaro-Consent-Box sichtbar ist: Fallback weg */
.vk-iframe-embed.has-consent .vk-iframe-embed__fallback {
  display: none;
}

/* Icon-Color-Block: Design 2 */
.symbolcolorwrapper--design2 {
  border: 1px solid #e0e0e0;
  background-color: #ffffff;
  padding: 16px 16px 20px;
  text-align: center;
  min-height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.symbolcolorwrapper {
  min-height: 260px;
}


.symbolcolorwrapper--design2 .symbolcolor-circle {
  width: 130px;
  height: 130px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background-color: #f2f2f2;
  display: flex;
  align-items: center;
  justify-content: center;
}

.symbolcolorwrapper--design2 .symbolcolor-circle i {
  font-size: 3.3rem;
  transition: transform 140ms ease, filter 140ms ease;
}

.symbolcolorwrapper--design2 .symbolcolor-text {
  color: #000;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}


/* Icon-Color-Block: Design 3 (Orbis) */
.symbolcolorwrapper--design3 {
  border: 1px solid #e0e0e0;
  background-color: #ffffff;
  padding: 16px 16px 20px;
  text-align: center;
  min-height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.symbolcolorwrapper--design3 .symbolcolor-circle {
  width: 130px;
  height: 130px;
  margin: 0 auto 14px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.symbolcolorwrapper--design3 .symbolcolor-circle i {
  color: #fff;
  font-size: 3.3rem;
  transition: transform 140ms ease, filter 140ms ease;
}

.symbolcolorwrapper--design3 .symbolcolor-text {
  color: #000;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}

.symbolcolorwrapper--design2.symbolcolorwrapper--no-border,
.symbolcolorwrapper--design3.symbolcolorwrapper--no-border {
  border: none;
}

/* Terra: Icon/Kreis auf Aero/Orbis-Größe angleichen */
.symbolcolorwrapper:not(.symbolcolorwrapper--design2):not(.symbolcolorwrapper--design3) .symbolcolor {
  width: 130px;
  height: 130px;
  border-radius: 50%;
  font-size: 3.3rem;
}

.symbolcolorwrapper:not(.symbolcolorwrapper--design2):not(.symbolcolorwrapper--design3) {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

/* Text nur bei Hover unterstreichen (alle Designs) */
.symbolcolor-link .symbolcolortext,
.symbolcolor-link .symbolcolor-text {
  text-decoration: none;
}

.symbolcolor-link:hover .symbolcolortext,
.symbolcolor-link:hover .symbolcolor-text {
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-underline-offset: 0.15em;
}

/* Link-Unterstreichung in Design 2 entfernen */
.symbolcolor-link,
.symbolcolor-link:hover,
.symbolcolor-link:focus {
  text-decoration: none !important;
}

.symbolcolorwrapper--design2 .symbolcolor-circle i {
  text-decoration: none !important;
}


/* Dezenter Hover-Effekt nur fuer das Icon */
.symbolcolor-link:hover .symbolcolor-circle i,
.symbolcolorwrapper--design2:hover .symbolcolor-circle i {
  transform: scale(1.03);
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.22));
}