/*
 Theme Name:     Divi Child Theme
 Theme URI:      http://www.elegantthemes.com
 Description:    Child Theme for Divi Theme by Elegant Themes
 Author:         Divi.world
 Author URI:     http://divi.world
 Template:       Divi
 Version:        1.0.0
*/
 

/* 
------------------------------------------------------- */
/* Optimierung in schmaler Ansicht * oder
 * .et_pb_row_1_tb_header 
 */
/*
@media (max-width: 1201px) {
.et_pb_row_1_tb_header {
  width: 98% !important;
    }
}
@media (max-width: 980px) {
.et_pb_row_1_tb_header,
    .et_pb_row {
  width: 90% !important;
    }
}
*/
/* Alles mit weniger Abstand*/
@media (max-width: 480px) {
.et_pb_row {
  width: 90% !important;
    }
}

/**** Logo & Hauptmenü Optimierung*****
@media (max-width: 1216px) {
#header .et_pb_menu_inner_container {
    display: block;
    }
}
@media (max-width: 981px) {
#header .et_pb_menu_inner_container {
    display: flex;
    }
}
*/
/****************************************** LOGO *****************************/

/**** Sticky Logo & Verlinkung ermöglichen ****/
.et_pb_menu__logo {
    content: '' !important;
}
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
.et_pb_sticky .et_pb_menu__logo img {
    content: url(https://adesignvision.com/wp-content/uploads/logo-harder-handwerk.svg) !important;
    width: auto;
    filter: none !important;    
    -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-duration: .2s;
  animation-duration: .2s;
}
.et_pb_menu__logo img[src$=".svg"] {
  width: 295px !important;
}
.et_pb_sticky .et_pb_menu__logo img[src$=".svg"] {
    height: 80px !important;
    width: 190px !important;
}
/*
.et_pb_menu--style-left_aligned .et_pb_menu__logo {
  margin-top: -20px !important;
}
*/
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
/*** Startseite Header Headline Box - BH Hintergrund Text ***
.et_pb_fullwidth_header .et_pb_fullwidth_header_container.left .header-content {
  padding: 20px;
  max-width: 770px;
  background: rgba(255,255,255,.5);
}
*/

/* Damit DropDown des Navis über den Headertitel geht */
.et_pb_fullwidth_header.et_pb_fullwidth_header_0 {
    z-index: 1 !important;
}

/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
/**** Icons   ************/
et_pb_text_0_tb_header.headermenu a:hover {
    color: #000 !important;
}
.et-pb-icon:hover  {
    color: #1d70b7 !important;
}
/*Awesome*/
.icon-calendar {
    font-family: 'FontAwesome';
    text-align: center;
    vertical-align: middle;
    margin-right: 10px;
    margin-left: 0px;
    color: #4c4b4b;
    font-size: 1em;
    transition: all .3s ease;
}
/****************************************** MENÜS *****************************/

/****************************** Menücons*/
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *
 * Bevor Awesome auf lokalem Server integriert
.menuicon1::before {
font-family: "ETmodules";
content: "\e090;"; /*Telefon*  &#xe00b; Mobil
color: #000;
font-size:25px;
margin-right:5px
float:left;
}
.menuicon2::before {
font-family: "ETmodules";
content: "\e023"; /* kalender
color: #000;
font-size:25px;
margin-right:5px
float:left;
}
.menuicon3::before {
font-family: "ETmodules";
content: "\"; /* Instagram
color: #000;
font-size:25px;
margin-right:5px
float:left;
}
.menuicon4::before {
font-family: "ETmodules";
content: "\e093"; /* facebook oder e0aa oder e0c1;* * YouTube: e0a3 oder e0ba*
color: #000;
font-size:25px;
margin-right:5px
float:left;
}
*/
/*
 * Facebook - Inhalt: "'e093" ;
Twitter - Inhalt: "'e094" ;
Google Plus - Inhalt: "'e096" ;
Pinterest - Inhalt; "'e095" ;
LinkedIn - Inhalt: "'e09d" ;
Instagram - Inhalt: "'e09a" ;
Tumblr - Inhalt: "'e097" ;
Skype - Inhalt: "'e0a2" ;
Flickr - Inhalt: "'e0a6" ;
Myspace - Inhalt: "'e0a1" ;
Dribbble - Inhalt: "'e09b" ;
YouTube - Inhalt: "'e0a3" ;
Vimeo - Inhalt: "'e09c" ;
RSS - Inhalt: "'e09e" ;
*/
/*********************************** Hauptmenü ***************/

/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *
/*Position Menü am Logo im Header ausrichten */
.et-menu-nav {
    height: 20px !important;
    margin-top: 62px;
}
.has_et_pb_sticky .et-menu-nav {
    margin-top: unset;
}

/* DropDown Abstand bei Sticky Menü*/
.et_pb_menu .et_pb_menu__menu > nav > ul > li > ul {
  top: calc(100% - 16px) !important;
}
.et-menu .menu-item-has-children > a:first-child { /* die die nicht verlinkten Überschriften im Hauptmenü */
  cursor: context-menu;
}

.et_pb_menu_0_tb_header.et_pb_menu .nav li ul {
    overflow: hidden;
}
/*  Farbe bei hover */
.et_pb_menu--with-logo .et_pb_menu__menu > nav > ul > li > a:hover,
.et_pb_menu_0_tb_header.et_pb_menu .nav li ul.sub-menu a:hover {
   color:#1d70b7 !important; 
}
.nav li li {
    padding: 0 !important;
}
.nav li li:hover {
    background-color: #f7f6f5 !important;
}
.nav li li a:hover {
    background-color: #f7f6f5 !important;
    opacity: 1 !important;
}
.et-menu li li a {
  width: 367px !important; /* VAR */
}


/* ***************************************  Mobiles Menu */
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
.et_mobile_menu li a:hover, 
.nav ul li a:hover {
    background-color: #1d70b7 !important;
  /*  background-color: transparent !important; wenn keine Hintergrunsfarbe bei hover */
}
/* Drop Down Rand/Rahmen entfernen */
@media (max-width: 980px) {
  .et_pb_menu .et_mobile_menu {
    padding: 0 !important;
  }
}
/* ***************************************  Hamburger Menü ********/
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
.et_pb_menu_0_tb_header .mobile_nav .mobile_menu_bar::before, .et_pb_menu_0_tb_header .et_pb_menu__icon.et_pb_menu__search-button, .et_pb_menu_0_tb_header .et_pb_menu__icon.et_pb_menu__close-search-button, .et_pb_menu_0_tb_header .et_pb_menu__icon.et_pb_menu__cart-button {
  color: #1d70b7 !important;
    font-size: 46px !important;
}
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ * MEGA MENÜ Klasse .mega-menu * ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *
.et-menu-nav li.mega-menu > ul > li > a:first-child { /* die Überschrift im Megamenü*
    font-size: 16px !important;
    color: #1d70b7;
    letter-spacing: 0.5px;
    cursor: context-menu;
}

.et-menu-nav li.mega-menu li > a {  /* die Breite der Überschrift DropDownMenüpunkte im Megamenü *
  width: 300px !important;
}
/********** MEGA MENU Drop Down *
.et_pb_menu .et_pb_menu__menu > nav > ul > li > ul {
    right: 0 !important;
    left: unset !important; 
    width: auto !important;
}
.et-menu-nav li.mega-menu > ul {
  width: 77% !important;
  right: 0 !important;
}
@media (max-width: 1129px) {
.et-menu-nav li.mega-menu > ul {
  width: 100% !important;
    }
}
*/
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
/* Ausblenden im Mobil-Menü  
@media (max-width: 768px) {
.et_mobile_menu li li.et_pb_menu_page_id-366 {
    display: none;
    }
}
*/

/* END Hauptmenü */


/* ********************************** Sidebar Seitenleiste Widget Menü  ***************/
/*  Farbe bei hover */
.et_pb_menu_0.et_pb_menu ul li a:hover {
       color: #1d70b7 !important; 
}
/*  Linien unter Menüpunkten  *
.et_pb_menu--without-logo .et_pb_menu__menu > nav > ul > li > a {
  border-bottom: 1px solid #fff !important;
}
/* *************************************** Sidebar Seitenleiste - Hamburger Menü im Widget ausblenden ***/
.lwp-hide-mobile-menu.et_pb_menu .et_pb_menu__menu,
.lwp-hide-mobile-menu.et_pb_fullwidth_menu .et_pb_menu__menu {
    display: flex!important;
}
.lwp-hide-mobile-menu .et_mobile_nav_menu {
    display: none;
}
/* Tablets und Mobil ausschalten*/
@media (max-width: 980px) {
    .lwp-hide-mobile-menu .et_pb_menu__menu > nav > ul > li {
        width:100%
    }
}
/* vertikales Menümodul */
.lwp-hide-mobile-menu .et_pb_menu__menu > nav > ul > li {
    width:100%
}
/*** END  *  Hamburger Menü im Widget ausblenden*/

/**************************** BLOG Menüs - Kategorie Menü*/


li.current-cat a,
.et_pb_sidebar_0_tb_body.et_pb_widget_area li.current-cat a,
.et_pb_sidebar_1_tb_body.et_pb_widget_area a[aria-current="page"],
.et_pb_sidebar_0.et_pb_widget_area li.current-menu-item a {
    color: #1d70b7 !important;
}
/* *************************************** Footer Menü ***************/
.dl-v-menu.et_pb_menu .et_pb_menu__menu, 
.dl-v-menu.et_pb_menu .et_pb_menu__menu > nav, 
.dl-v-menu.et_pb_menu .et_pb_menu__menu > nav > ul {
display: block;    
}
.dl-v-menu .et_mobile_nav_menu { /*  Hamburger Menü im Footer ausblenden  */
    display: none;
}
.dl-v-menu.et_pb_menu_0_tb_footer.et_pb_menu ul li a {
    border-bottom: 1px solid #293133;
    line-height: 20px!important;
}
.dl-v-menu.et_pb_menu_0_tb_footer.et_pb_menu ul li a:hover {
    border-bottom: 1px solid #ffffff !important;
    color: #ffffff !important;
}
@media (max-width: 980px) {
 .dl-v-menu.et_pb_menu--style-left_aligned .et_pb_menu__wrap {
    -webkit-box-pack: start !important;
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }
}



/* ***************************************  Buttons *************************************/
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
.btn-news button,
.btn {
    border-width: 0px !important;
    color: #fff !important;
    background-color: #1d70b7 !important; 
    padding: 6px 15px;
    font-size: 17px;
    border-radius: 6px !important;
    cursor: pointer;
    margin-top: -6px;
}
.btn-news button:hover,
.btn:hover {
background-color: #fff !important;
    color: #1d70b7 !important;
}
.btn-footernews button {
    border-width: 0px !important;
    color: #1d70b7 !important;
    background-color: #fff !important; 
    padding: 5px 10px;
    font-size: 17px;
    border-radius: 3px !important;
    cursor: pointer;
}
.btn-footernews button:hover {
background-color: #659a45 !important;
    color: #fff !important;
}
.et_pb_button {
  color: #FFFFFF !important;
  border-width: 0px !important;
  letter-spacing: 0px !important;
}
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
.et_pb_bg_layout_light.et_pb_button:hover, 
.et_pb_bg_layout_light .et_pb_button:hover {
  background-image: initial;
  background-color: rgba(39, 32, 120, 0.85) !important; /* #1d70b7 https://www.revilodesign.de/tools/hex-in-rgba-umwandeln-hex-to-rgba-converter/ */
}
/* Button Blog > mehr lesen  */
.et_pb_blog_0_tb_body .et_pb_post div.post-content a.more-link {
    border-width: 0px !important;
    background-color: #1d70b7 !important;
    color: #fff !important;
    padding: 6px 10px;
    margin-top: 20px;
    font-size: 17px;
    border-radius: 3px !important;
    cursor: pointer;
    width: 150px;
    text-align: center;
    display: inline-block;
}
.et_pb_blog_0_tb_body .et_pb_post div.post-content a.more-link:hover {
    color: #1d70b7 !important;
    background-color: #fff !important;     
}

/******************** Plugin Popups for Divi  - Kontakt */

/* um den  Hintergrund-Layer auszublenden *)
.da-overlay-visible .da-overlay {
    display: none !important;
}
*/
/** PopUp Newsletter -  da im Footer vom header verdeckt */
@media screen and (min-width: 768px) {
  #rmOrganism .rmPopup__container .rmPopup.rmPopup--modal {
    top: 18% !important;
  }
}
/* Plugin Popups for Divi -  Schatten auch um Transparenz */
#et-boc .area-outer-wrap[data-da-shadow="yes"] [data-da-area] {
        -webkit-box-shadow: none !important;
    box-shadow: none !important;
}



/* *************************************** Contact Form 7 ***/
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
.wpcf7 button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    border-width: 0px !important;
    color: #fff !important;
    background-color: #1d70b7 !important; 
    padding: 6px 20px;
    font-size: 17px;
    border-radius: 3px !important;
    cursor: pointer;
}
.wpcf7 button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
background-color: #fff important;
    color: #fff;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
	border-radius: 2px;
    padding: 7px 10px;
    color: #000;
	font-size: 18px;
    font-weight: 400;
	font-style: normal;
	line-height: 1.5; 
    margin: 0 20px 20px 0;   
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="url"],
.wpcf7 input[type="password"],
.wpcf7 input[type="search"] {
    width: 98%;
    max-width: 400px;
 
}
textarea {
    overflow: auto; 
	width: 98%;
    max-width: 820px;
    max-height: 180px;    
}
/*.wpcf7-form-control-wrap[data-name="teilnahme"] */
.clearb {
    clear: both;
    display: block;
}
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
.page-id-158 /* Contact Form 7 - Kontaktseite - Breite Formular*/ 
[data-class="wpcf7cf_group"] {
    width: 500px;
}
/* Kontaktseite - Formularfelder nebeneinander*/ 
.page-id-158 .wpcf7 input[type="text"],
.page-id-158 .wpcf7 input[type="email"],
.page-id-158 .wpcf7 input[type="url"],
.page-id-158 .wpcf7 input[type="password"],
.page-id-158 .wpcf7 input[type="search"] {
    float: left; 
}
.wpcf7-form p {
    padding-bottom: 0;
}


/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ 
/* ***************** WP Forms   Kontaktformular Nachricht nach dem senden ***
.wpforms-confirmation-container-full {
    background: #f7f6f5 !important;
    border: none !important;
    border-radius: 13px 13px 13px 13px !important;
    color: #fff !important;
}
*/
/****************************** Suchergebnisse ***
.et_pb_image_container img, .et_pb_post a img {
  max-width: 500px !important;
}
*/


/* *************************************** Beiträge - Neueste Beiträge Footer - "Breite über 2 Spalten" ***/
@media (min-width: 981px) {
    .et_pb_gutters3 .et_pb_column_1_2 
    .postlist .et_pb_widget {
    width: 98% !important;
    }
}
/* *************************************** Accordion & toggle icon left ** */
/*move the toggle icon to the left*/

.pa-toggle-icon-left .et_pb_toggle_title:before {
	left: 0 !important;
}
/*adjust spacing on the left for the icon*/

.pa-toggle-icon-left .et_pb_toggle_title,
.pa-toggle-icon-left .et_pb_toggle_content {
	padding-left: 30px !important
}

/* Accordioon (nicht verwendet) move the accordion icon to the left

.pa-accordion-icon-left .et_pb_toggle_title:before {
	left: 0 !important;
}
.pa-accordion-icon-left .et_pb_toggle_title,
.pa-accordion-icon-left .et_pb_toggle_content {
	padding-left: 2em !important
}
*/

/************************************************* Plugin Testimonial Feedback */
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
.wpmtst-testimonial {
    border: none !important;
}
h3.wpmtst-testimonial-heading {
    font-family: 'Klarika light',Helvetica,Arial,Lucida,sans-serif;
    font-size: 1.4em;
    font-weight: 400;
    margin-bottom: 0 !important;
}

.testimonial-name {
    text-align: left !important;
    margin-top: 1em;
}
 .testimonial-name:before {
    content: "– ";
}
.testimonial-name:after {
    content: " –";
}
.testimonial-thema {
    text-align: left !important;
    font-style: italic;
}
.testimonial-client {
    margin-top: 0.5em !important;
}

.strong-view.wpmtst-default .wpmtst-testimonial-inner {
    border: none !important;
    background-color: #fff;
    padding: 2em;
    margin-bottom: 3em;
}

/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
/*Slider Startseite - OBEN UNTEN*/
.et_pb_slide_image img {
    max-height: 750px !important;
    text-align: right !important;
}

/* Folgender Code in Freiform CSS des Slichers (Haupt)
  @media (max-width: 767px) {.et_pb_slide_image, .et_pb_slide_video {
      display: block !important;
    margin-bottom: 30px !important;
    padding: 0 !important;
    width: 100% !important;
    }
}
*/
/* Slideshow*/
.strong-view.wpmtst-default.slider-container.slider-adaptive:not(.slider-mode-horizontal) .wpmslider-viewport{
    border: none !important;
}
.slider-container.strong-view.wpmtst-default .wpmtst-testimonial-inner {
    background-color: unset;
}
/* Blockquotes  - Anführungszeichen*/
.strong-view.wpmtst-default .wpmtst-testimonial-heading {
  background: none !important;
    /* background: url("quotes.png") no-repeat scroll left center transparent !important;*/
  margin-top: 0;
  padding-left: 0 !important;
  text-align: left;
}

/* *************************************** eigene *********************/
/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */
a:hover {
    color: #414141;
}
.footerhref a {
    color: #fff;
}
.footerhref a:hover {
    color: #1d70b7;
}
/* Sektion Hintergrundverlauf*/
 div.et_pb_section.et_pb_section_0.gradientspieg,
 div.et_pb_section.et_pb_section_1.gradientspieg,
 div.et_pb_section.et_pb_section_2.gradientspieg,
 div.et_pb_section.et_pb_section_3.gradientspieg,
 div.et_pb_section.et_pb_section_4.gradientspieg,
 div.et_pb_section.et_pb_section_5.gradientspieg,
 div.et_pb_section.et_pb_section_6.gradientspieg,
 div.et_pb_section.et_pb_section_7.gradientspieg,
 div.et_pb_section.et_pb_section_8.gradientspieg, 
 div.et_pb_section.et_pb_section_9.gradientspieg {
  background-image: linear-gradient(-164deg, #e1e1e1 13%, rgba(255,255,255,0.58) 61%, #b4bccf 90%) !important;
}
/* Teaser Title vor Foto*/
@media (min-width: 981px) {
    .titlefirst .et_pb_blurb_content {
        display: flex !important;
        flex-direction: column-reverse !important;
        align-items: center !important;
        text-align: center !important;
    }

    .titlefirst .et_pb_main_blurb_image {
        margin-top: 10px; /* Abstand zwischen Titel und Bild */
    }
}

 blockquote { 
     font-size: 21px;
     font-style: normal !important;
     text-align: left;
     letter-spacing: 0.5px;
     line-height: 1.5;
     /*
     border: none !important;
     padding: 0 !important;
     */
}
.et_pb_text_inner ul li {
    text-align: left !important;
    margin: 10px 0 !important;
}

/*check Häkchen Bulletpoint*/
.check .et_pb_text_inner ul,
.checkw .et_pb_text_inner ul{
    list-style-type: none; /* Standard-Bulletpoints entfernen */
    padding-left: 0; /* Optional: Linkseinzug entfernen */
}
.check .et_pb_text_inner ul li,
.checkw .et_pb_text_inner ul li{
  padding-left: 35px; /* Fügt Platz für das Symbol hinzu */
  position: relative;
}
.check .et_pb_text_inner ul li::before {
  content: '✓';
  color: #1d70b7;
  font-size: 26px;
  font-weight: 700;
  position: absolute;
  left: 0;
  top: 0;
}
.checkw .et_pb_text_inner ul li::before {
  content: '✓';
  color: #fff;
  font-size: 26px;
  font-weight: 700;
  position: absolute;
  left: 0;
  top: 0;
}

img.rund {
    height: auto;
    overflow:hidden; 
	    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
	 }
@media only screen and (max-width: 700px) {
    img.alignright, 
    img.alignleft {
		float: none !important;
        display: block !important;
        margin: 10px auto;
	}
}
/* Modul Informationstext  Bild rechts – Text links */
@media (min-width:981px) {

    .blurb-icon-right .et_pb_blurb_content {
        display: flex;
        flex-direction: row-reverse;
        padding-right: 20px;
        margin-left: 0 !important;
    }
/*
    .blurb-icon-right.et_pb_blurb_position_left .et_pb_blurb_container {
       padding: 10px;
    }
  }
*/

.extern { /*externe Links im Menü*/
    font-size: 16px;
    color: #000; 
}
sup {
    vertical-align: super !important;
    font-size: 75%;
    bottom: unset !important;
    
}


/* Gitter-Kacheln auf gleiche Höhe setzen *
@media only screen and (min-width: 768px) {
.blog-teaser .et_pb_post {
min-height: 550px;
max-height:550px;
    }
}
*/


/* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ *//* ~~~~~~~~~~~~~~~~~~~~ vision ~~~~~~~~~~~~~~~~~~~~ */    
/* Teaser Blog Seite */
.blog-teaser article img {
    width: 40%; /* Festlegen einer relativen Breite, damit das Bild nicht zu viel Platz einnimmt */
    float: left;
    margin-right: 40px;
    margin-top: 30px;
}

.blog-teaser article {
    background-color: #f7f7f7 !important;
    padding: 15px 40px !important;
    overflow: hidden;
}

/* Sicherstellen, dass der Artikeltext nicht unter das Bild rutscht */
.blog-teaser article .post-content {
    overflow: hidden; /* Erzwingt, dass der Text neben dem Bild bleibt */
}

/* Einspaltiges Layout für Tablets und mobile Geräte */
@media (max-width: 980px) {
    .blog-teaser article img {
        width: 100%; /* Bild nimmt die volle Breite ein */
        float: none; /* Float entfernen, damit das Bild als Block-Element angezeigt wird */
        margin-right: 0;
        margin-top: 20px; /* Leichter Abstand von oben, falls gewünscht */
    }

    .blog-teaser article {
        padding: 15px 20px !important; /* Padding anpassen für mobile Ansicht */
    }

    .blog-teaser article .post-content {
        overflow: visible; /* Overflow auf "visible" setzen, damit sich der Text unter dem Bild korrekt ausbreitet */
    }
}
