/*
Theme Name: divi child
Version: 1.0
Description: A child theme of Divi
Template: Divi
Author: Administrator
Text Domain:  divi-child
*/
/****** ANFANG BLOG†BERSICHTS-SEITE ******/

/*** Anpassung des Abstandes unten zum Footer ***/
.post-60 .et_pb_section {
    padding-bottom: 0px !important;
  }

body.et_pb_pagebuilder_layout.page-id-60 #main-content {
    margin-bottom: 0 !important;
}

/* Letzter Container im Blog-Grid */
.blog-grid .et_pb_ajax_pagination_container:last-child {
  margin-bottom: -20px;
}
/*** ENDE: Anpassung des Abstandes unten zum Footer ***/

/* Grid-Layout fŸr Blog-BeitrŠge */
.blog-grid .et_pb_ajax_pagination_container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: 1fr;
  column-gap: 0.8em;
}

/* Artikel-Margin im Blog-Grid */
.blog-grid .et_pb_ajax_pagination_container article {
  margin-top: 10px;
}

/* Div-Elemente im Blog-Grid, die Ÿber die gesamte Spaltenbreite gehen */
.blog-grid .et_pb_ajax_pagination_container div {
  grid-column: 1 / -1;
}

/* Positionierung des "Weiterlesen"-Links */
.blog-grid .et_pb_post div.post-content a.more-link {
  position: absolute;
  bottom: 8px;
}

/* Padding fŸr den Beitragsinhalt */
.blog-grid .post-content {
  padding-bottom: 1.5em;
}

/* Responsive Anpassung fŸr kleinere Bildschirme (Blog-Grid) */
@media all and (max-width: 767px) {
  .blog-grid .et_pb_ajax_pagination_container {
    grid-template-columns: 1fr; /* Eine Spalte auf kleinen Bildschirmen */
  }
}

/* Textbereiche der Artikelinformationen */
.blog-grid .entry-title {
  text-align: center !important;
  padding: 20px 10px 0;
}

/* Hintergrund und Positionierung fŸr Titel, Meta und Inhalt im Blog-Grid */
.blog-grid .entry-title,
.blog-grid .post-meta,
.blog-grid .post-content {
  position: relative;
  z-index: 9;
  background: var(--color-white-off);
  width: 90% !important;
  left: 5% !important;
}

/* Margin fŸr Post-Meta im Blog-Grid */
.blog-grid .et_pb_post .post-meta {
  margin-bottom: 0;
}

/* Textausrichtung fŸr Post-Content im Blog-Grid */
.blog-grid .post-content {
  text-align: center !important;
}

/* Margin fŸr AbsŠtze innerhalb von post-content-inner */
.blog-grid .post-content-inner p {
  margin-bottom: 1em !important;
}

/* Padding fŸr AbsŠtze im Post-Content */
.blog-grid .post-content p {
  padding-left: 10px;
  padding-right: 10px;
}

/* Bildgrš§en fŸr Featured Image auf grš§eren Bildschirmen */
@media only screen and (min-width: 961px) {
  .blog-grid .et_pb_post .entry-featured-image-url img {
    width: 280px !important;
    height: 350px !important;
    display: block;
    margin: 0 auto; /* Zentrierung des Bildes */
  }
}

/* Bildgrš§en fŸr Featured Image auf mittleren Bildschirmen */
@media only screen and (min-width: 1px) and (max-width: 960px) {
  .blog-grid .et_pb_post .entry-featured-image-url img {
    width: 200px !important;
    height: 250px !important;
    display: block;
    margin: 0 auto; /* Zentrierung des Bildes */
  }
}

/* Styling fŸr den "Weiterlesen"-Link */
.blog-grid a.more-link {
  color: var(--color-dark-grey) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 50%, var(--color-gold-accent) 50%) !important;
  padding: 13px 25px;
  border: none !important;
  clear: both;
  line-height: 0.45em !important;
  text-decoration: none !important;
  left: 50%;
  transform: translateX(-50%);
  min-width: 150px !important;
}

/* Hover-Zustand fŸr den "Weiterlesen"-Link */
.blog-grid a.more-link:hover {
  color: #000 !important; /* Beibehalten, da spezifisch */
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 50%, var(--color-gold-accent) 50%) !important;
}

/* Pseudo-Element vor dem Beitragstitel fŸr visuellen Effekt */
.blog-grid .et_pb_post .entry-title:before {
  content: "";
  position: absolute;
  display: block;
  background: var(--color-gold-accent);
  left: 0;
  top: 0;
  height: 3px;
  width: 0;
  z-index: 9999;
  transition: all 0.5s ease-in-out;
}

/* Hover-Effekt fŸr das Pseudo-Element */
.blog-grid .et_pb_post:hover .entry-title:before {
  width: 100%;
}

/*** Seitennavigation unten auf der Blog-†bersicht-Seite / es wird das Plugin WP-PageNavi genutzt ***/
.wp-pagenavi a,
.wp-pagenavi span {
  color: #000;
  background: #f1f3f5;
  font-size: 1em !important;
  line-height: 1em;
  font-weight: bold !important;
  padding: 0.45em 0.8em !important;
  border-radius: 100px;
  border: none;
  transition: all 0.5s;
}

/* Style the wp-pagenavi current page number */
.wp-pagenavi span.current {
  color: #fff !important;
  background: var(--color-dark-lila) !important;
  border-radius: 100px;
}

/* Style the wp-pagenavi pagination links on hover */
.wp-pagenavi a:hover {
  color: #fff !important;
  background: var(--color-dark-lila) !important;
}

/* Style the wp-pagenavi pages text */
.wp-pagenavi .pages {
  background: none;
}

/* Remove border and center the wp-pagenavi links */
.wp-pagenavi {
  border-top: none;
  text-align: center;
  margin-bottom: 130px !important;
}

/*** Seitennavigation unten auf der Blog-†bersicht-Seite / es wird das Plugin WP-PageNavi genutzt ***/

/****** ENDE BLOG†BERSICHTS-SEITE ******/

/****** ANFANG BLOG-ARTIKEL ******/

/* Padding fŸr den †berschriftencontainer */
.et_pb_heading_container {
  padding-top: 15px !important;
}

/* Featured image auf der Blog-Post-Einzelansichtsseite */
#blogimageabstand img {
  float: left !important;
}

/* Textfarbe Blogartikel und BlogŸbersicht */
.et_pb_bg_layout_light .et_pb_post .post-meta,
.et_pb_bg_layout_light .et_pb_post .post-meta a,
.et_pb_bg_layout_light .et_pb_post p {
  color: var(--color-dark-grey);
}

/* Padding und Margin fŸr einzelne BlogbeitrŠge */
.single .et_pb_post .entry-content {
  padding-top: 0 !important;
}
.single .et_pb_post {
  margin-bottom: 0 !important;
}

.single #main-content {
  margin-bottom: 0 !important;
}

/* Margin-Anpassung fŸr Divi-Spalten auf grš§eren Bildschirmen */
@media (min-width: 981px) {
  .eeeet_pb_gutters3 .et_pb_column_4_4 .et_pb_module {
    margin-bottom: 0 !important;
  }
}

/* Abstand Blogartikel Ende und Abschlussgru§ */
.custom-trennung-schmetterlinge {
  padding-bottom: 2em !important;
}
.herzlichst {
  padding-top: 23px !important;
}

/* AbstŠnde fŸr Unterschriftsbild */
.unterschriftabst {
  margin: 30px 0 15px;
}
.uunterschriftabstimg {
  margin-bottom: 70px;
}

/*** Related Posts auf der Blog-Artikel-Seite ***/
#related-post {
  padding-top: 50px !important; 
}

#related-post h3 {
  font-size: 18px;
  text-align: center;
  z-index: 1;
  position: relative;
  overflow: hidden;
}

#related-post h3:after,
#related-post h3:before {
  position: absolute;
  top: 30%;
  overflow: hidden;
  width: 50%;
  height: 5px;
  content: '\a0';
  background-color: var(--color-dark-lila);
}

#related-post h3:before {
  margin-left: -52%;
}

#related-post h3:after {
  margin-left: 2%;
}

ul#related-posts-list {
  list-style: none;
  display: block;
  padding: 0;
  clear: both;
  overflow: hidden;
}

ul#related-posts-list li {
  width: 31.3%;
  float: left;
  margin: 2% 1%;
  text-align: center;
}

ul#related-posts-list li span.text a {
  padding-top: 20px !important;
  font-family: Raleway-SemiBold, Helvetica, Arial, sans-serif !important;
  text-decoration: underline;
}

ul#related-posts-list li a {
  display: block;
}

.related-posts p {
  text-align: center !important;
}

ul#related-posts-list li img {
  min-width: 100%;
}

ul#related-posts-list li .img-wrap {
  position: relative;
  display: block;
  max-height: 320px;
  overflow: hidden;
}

ul#related-posts-list li .img-wrap:after {
  content: '';
  display: block;
  position: absolute;
  bottom: -1px;
  right: 0;
  left: 0;
  top: 70%;
  z-index: 3;
}

.thumb a img {
  max-width: 100% !important;
  margin: 0 !important;
}

/* Responsive Anpassungen fŸr Related Posts */
@media (max-width: 767px) {
  ul#related-posts-list {
    flex-wrap: wrap; /* War display: block, jetzt flex-wrap fŸr bessere Kontrolle bei Flexbox */
  }
  ul#related-posts-list li {
    width: 48%;
  }
  /*ul#related-posts-list li:nth-child(3) { display: none; }*/ /* Auskommentiert gelassen, wie im Original */
  .post-67 .et_pb_text_3 {
    margin: 0 !important;
  }
}

@media (max-width: 550px) {
  ul#related-posts-list li {
    width: 100% !important;
    margin: 0 !important;
  }
  ul#related-posts-list li span.text a {
    padding-bottom: 20px !important;
  }
}
/*** ENDE Related Posts auf der Blog-Artikel-Seite ***/

/* Lesezeit in Blogartikeln anzeigen */
.single .ohspicy-reading-time {
  font-size: 14px;
  margin-bottom: 15px !important;
}

/* Reading progress bar / Leseleiste Fortschrittsbalken */
@media (max-width: 767px) {
  .the-today-blog-meter {
    position: fixed;
    top: 0 !important;
    z-index: 1111;
    width: 100%;
  }
  .the-today-blog-progress {
    width: 100%;
    height: 6px;
    z-index: 1111;
  }
  .progress-bar {
    height: 6px;
    background-color: var(--color-gold-accent);
    width: 0;
  }
}

/* Blocks: allgemeine Style Angaben */
.wp-block-columns,
.wp-block-columns p,
.wp-block-columns ul,
.wp-block-columns ul li,
.wp-block-column,
.wp-block-table,
.wp-block-table tbody,
.wp-block-table td,
.wp-block-table th,
.wp-block-table tr,
.wp-block-image,
.wp-block-image img {
  margin: 0 !important;
  padding: 0 !important;
}
/* Ende Blocks: allgemeine Style Angaben */

/* Nummerierung fŸr h2 †berschriften in Listenblogartikeln */
numbueberschr {
  counter-reset: h2counter;
}
numbueberschr h2::before {
  counter-increment: h2counter;
  content: counter(h2counter) ". ";
  font-family: Raleway-SemiBold, Helvetica, Arial, sans-serif !important;
  width: 2.5rem;
  height: 2.5rem;
  margin-right: 30px !important;
  color: #fff;
  background: var(--color-dark-lila) linear-gradient(to bottom right, var(--color-dark-lila) 25%, var(--color-gold-accent));
  text-shadow: 0 0 2px var(--color-dark-lila);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  shape-outside: ellipse();
  z-index: 1;
}
/****** ENDE BLOG ARTIKEL ******/

/****** KOMMENTARBEREICH STYLEN ******/ 
#comment-wrap {
  padding-top: 0;
}

#comment-wrap h2 {
  text-align: center;
  z-index: 1;
  position: relative;
  overflow: hidden;
  margin-top: 50px;
  margin-bottom: -50px;
  font-size: 24px !important;
}

#comment-wrap h2:after,
#comment-wrap h2:before {
  position: absolute;
  top: 30%;
  overflow: hidden;
  width: 50%;
  height: 5px;
  content: '\a0';
  background-color: var(--color-dark-lila);
}

#comment-wrap h2:before {
  margin-left: -52%;
}

#comment-wrap h2:after {
  margin-left: 2%;
}

h4#comments.page_title {
  color: #72afbf !important;
  font-size: 24px !important;
}

.comment-body {
  padding-left: 20px;
  padding-bottom: 10px;
  border-bottom-left-radius: 15px;
  margin-bottom: 0 !important;
}

.comment-content p {
    font-size: 16px !important;
    padding-bottom: 0.75em !important;
}

.depth-1 {
  margin-top: 50px !important;
}
.depth-2 {
  margin-top: 10px !important;
}

.depth-1 .comment-body {
    border-left: 1px solid #3d3d3d;
    border-bottom: 1px solid #3d3d3d;
}

.depth-2 .comment-body {
    border-left: 1px solid #3d3d3d;
    border-bottom: 1px solid #3d3d3d;
}

.comment .children {
  margin-left: 20px !important;
}

#respond {
  background: #fbfbfb;
  padding: 50px 50px 10px;
  margin-top: 50px !important;
  margin-bottom: 50px !important;
  box-sizing: border-box;
  border-radius: 30px;
  border: 1px solid #d9ac08;
}

/* Highlight active form field */
#respond textarea {
  transition: all 0.3s ease-in-out;
  outline: none;
  padding: 13px 0 13px 13px;
  margin: 5px 1px 3px 0;
  border: 1px solid #ddd;
}
#respond textarea:focus {
  box-shadow: 0 0 5px #ba84fe;
  margin: 5px 1px 3px 0;
  border: 2px solid #ba84fe;
}

#respond input[type="text"] {
  transition: all 0.3s ease-in-out;
  outline: none;
  padding: 13px 0 13px 13px;
  margin: 5px 1px 3px 0;
  border: 1px solid #ddd;
}

#respond input[type="text"]:focus,
#respond input[type="email"]:focus,
#respond input[type="url"]:focus {
  box-shadow: 0 0 5px #ba84fe;
  margin: 5px 1px 3px 0;
  border: 2px solid #ba84fe;
}

#commentform input.error,
#commentform textarea.error {
  background: #ffd2d2;
  color: #000;
}

a.comment-reply-link,
a.comment-edit-link {
  color: var(--color-dark-lila) !important;
  font-size: 13px;
  font-size: 0.928571429rem;
  line-height: 1.846153846;
  text-decoration: none !important;
  margin-bottom: 20px !important;
}
.comment-reply-link.et_pb_button:hover,
.comment-edit-link.et_pb_button:hover {
  color: var(--color-gold-accent) !important;
  border-radius: 4px !important;
}

#commentform .et_pb_button {
  text-transform: uppercase !important;
  font-family: 'Raleway-Bold', Helvetica, Arial, Lucida, sans-serif !important;
}
#commentform .et_pb_button:hover {
  background-color: var(--color-gold-accent) !important;
  border-radius: 4px !important;
}

.llogged-in-as {
  display: none;
}

/* Antwort - Ebene 2-10 */
.depth-2::before,
.depth-3::before,
.depth-4::before,
.depth-5::before,
.depth-6::before,
.depth-7::before,
.depth-8::before,
.depth-9::before,
.depth-10::before {
  content: "Antwort";
  background-color: #eaeaea;
  padding: 3px 8px;
  font-size: 14px;
  color: var(--color-dark-grey);
}

/* Name des Kommentierenden */
span.fn a,
span.fn {
  color: var(--color-dark-grey);
}
span.fn {
  padding-top: 0.9em !important;
}

/* Datum Uhrzeit bei den Kommentaren rausnehmen */
.comment_date {
  display: none;
}

/* Vorherige / nŠchste Kommentare Navi stylen */
.paginate-com {
  margin: 0 0 30px;
  padding: 5px 1px 5px;
  text-align: left;
}
.paginate-com-2 {
  margin-top: -15px !important;
}

.paginate-com a,
.paginate-com-2 a {
  padding: 3px 6px 4px;
  margin: 3px;
  text-decoration: none;
  border: 1px solid #51a8a1;
  color: #51a8a1;
  font-size: 14px;
  text-transform: uppercase;
  font-family: Raleway-Bold, Helvetica, Arial, sans-serif !important;
  font-weight: bold;
  background-color: inherit;
  border-radius: 5px;
}
.paginate-com a:hover,
.paginate-com-2 a:hover {
  border: 1px solid #51a8a1;
  color: #51a8a1;
  background-color: #d6ebea;
}
.paginate-com .current,
.paginate-com-2 .current {
  padding: 3px 6px 4px;
  margin: 3px;
  font-weight: bold;
  text-transform: uppercase;
  border: 1px solid #51a8a1;
  font-family: Raleway-Bold, Helvetica, Arial, sans-serif !important;
  font-weight: bold;
  color: #51a8a1;
  font-size: 14px;
  background-color: #d6ebea;
  border-radius: 5px;
}

/* Nachricht (dass abgeschickter Kommentar noch moderiert wird, bevor er erscheint) mit Hintergrund hervorheben */
.moderation {
  background-color: #d2b45e;
  padding: 5px;
}

/* Styling Error Messages, wenn Pflichtfelder nicht ausgefŸllt wurden */
.error {
  padding: 10px 0 20px;
  color: var(--color-dark-lila);
}
.error:before {
  content: '\21';
  display: inline-block;
  padding-right: 23px;
  font-family: 'ETmodules';
  font-size: 1.2em;
  vertical-align: middle;
}

/* DSGVO Checkbox Text kleiner */
.comment-form-cookies-consent {
  font-size: 15px !important;
  line-height: 1.4em;
  padding-bottom: 35px;
}

/* Spam-Schutz */
.comment-form-interessen {
  display: none !important;
}

#trackbacks h3 {
  margin-top: 50px !important;
  padding-bottom: 0 !important;
}
/****** ENDE KOMMENTARBEREICH STYLEN ******/