/*
 Theme Name:     Divi Child Theme
 Theme URI:      http://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Viktor Zapik // NEXT LEVEL Agenten GmbH
 Author URI:     https://www.next-level-agenten.de
 Template:       Divi
 Version:        1.0.0
*/

/* =Theme customization starts here
------------------------------------------------------- */

.container {
    width: 90%;
}
.ft-li ul,
.ft-li-2 ul{
    list-style: none;
    padding: 0px 0px 0px 33px;
	position:relative;
}
.ft-li ul li,
.ft-li-2 ul li{
    margin-bottom: 15px;
}
.ft-li ul li::before,
.ft-li-2 ul li::before{
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
}
.ft-li ul li::before{
	background-image: url('https://www.dvhl.de/wp-content/uploads/2023/09/li-icon.svg');
}
.ft-li-2 ul li::before{
	background-image: url('https://www.dvhl.de/wp-content/uploads/2023/10/Rectangle-55.svg');
}
.ft-ol-li ol li{
    margin-bottom: 15px;	
}
.ft-ol-li ol li::marker {
    color: #e30613;
    font-weight:500;
}

.et_pb_toggle_title::before{
	right:0 !important;
	top: 30%;
}
.ft-li-group {
    display: flex;
    justify-content: space-between;
}

.ft-li-group-1,
.ft-li-group-2 {
    flex-basis: 48%;
}
.ft-lines-fw img{
	width:100% !important;
}
/*add icon to the opened accordion*/
.et_pb_accordion_item.et_pb_toggle_open .et_pb_toggle_title::before {
	display: block;
	content: "\e043"!important;
	color:#1d1d1d20!important;
}
#ft-blog-carousel .slick-prev::before, #ft-blog-carousel .slick-next::before{
    font-size: 35px;
    font-family: ETmodules!important;
    font-weight: 400!important;	
}
#ft-blog-carousel .slick-prev::before{
    content: "\34"!important;	
}
#ft-blog-carousel .slick-next::before{
    content: "\35"!important;	
}
#ft-popup-slider .et_pb_slide_image {
   width:20% !important;
}

#ft-popup-slider .et_pb_slide_description  {
   width:70% !important;
}
#ft-popup-slider .et-pb-arrow-next, #ft-popup-slider .et-pb-arrow-prev {
    opacity: 1;
    position: relative !important;
}

#ft-popup-slider .et-pb-arrow-next {
    right: 0 !important;
}

#ft-popup-slider .et-pb-arrow-prev {
    left: 0 !important;
}
#ft-popup-slider .et-pb-slider-arrows {
    /* text-align: center; */
    position: absolute;
    top: 5%;
    right: 3%;
}

#ft-popup-slider  .et-pb-arrow-next::before, #ft-popup-slider  .et-pb-arrow-prev::before {
    border: 1px solid #fff;
    border-radius: 50%;
    margin: 0px 10px;
    transition: all .3s;
}

#ft-popup-slider  .et-pb-arrow-next:hover::before, #ft-popup-slider .et-pb-arrow-prev:hover::before {
    background: #fff;
    color: #E30613;
}
#et-boc .area-outer-wrap .da-close {
    margin: 10px 30px;
    background: #1d1d1d20 !important;
    font-size: 30px;
    border-radius: 50%;
    opacity: 1 !important;
    transform: none !important;
}
/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f8f8f8;
	border-radius:5px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #E30613;
	border-radius:5px;
}
.ft-carousel-2 .slick-track {
    display:flex;
    align-items:center;
}
.ft-carousel-2 .slick-list {
    overflow: visible;
}


@media only screen and (max-width: 768px) {
.ft-li-group {
    display: block;
}

.ft-li-group-1,
.ft-li-group-2 {
    flex-basis: 100%;
}
}

@media only screen and (max-width: 767px) {
		#ft-popup-slider .et_pb_slide_image {
   width:100% !important;
}

#ft-popup-slider .et_pb_slide_description  {
   width:100% !important;
}
#ft-popup-slider .et-pb-arrow-next,#ft-popup-slider .et-pb-arrow-prev{
		font-size:35px !important;
	}
}


/* Display field titles above fields */
.et_pb_contact_form_label {
display: block;
font-weight:bold;
bottom:3px;
}

/* Hide duplicate placeholders */
.et_pb_contact_form_container .input::placeholder {
    opacity:0;
}

/*Hide duplicate titles in radio buttons and checkboxes */
.et_pb_contact_field_options_title {
display:none;
}

/* Remove title above dropdown */
.et_pb_contact_field[data-type=select] .et_pb_contact_form_label {
    display:none;
}

/* Grundlegende Stil-Anpassungen fur das Formular */
.wpcf7-form {
    font-weight: normal; /* Nicht fett gedruckt */
    border: 2px solid #e30613; /* Rand mit der Farbe #e30613 */
    padding: 15px; /* Etwas Abstand um das Formular */
    border-radius: 5px; /* Abgerundete Ecken */
    max-width: 600px; /* Maximale Breite */
    margin: auto; /* Zentriert das Formular */
    box-sizing: border-box; /* Inkludiert Padding und Border in der Breite */
}

/* Stil fur Uberschriften im Formular */
.wpcf7-form h1, .wpcf7-form h2, .wpcf7-form h3, .wpcf7-form h4, .wpcf7-form h5, .wpcf7-form h6 {
    color: #e30613; /* Rote Uberschriften */
}

/* Stil fur alle Eingabefelder und Textareas */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea {
    width: 100%; /* Vollstandige Breite */
    padding: 8px; /* Abstand im Feld */
    margin-bottom: 10px; /* Abstand zwischen den Feldern */
    border: 1px solid #ddd; /* Leicht sichtbarer Rand */
    border-radius: 4px; /* Abgerundete Ecken */
    box-sizing: border-box; /* Inkludiert Padding und Border in der Breite */
}

/* Stil fur Checkboxen und Radio-Buttons */
.wpcf7-form input[type="checkbox"],
.wpcf7-form input[type="radio"] {
    margin-right: 10px; /* Abstand rechts von der Checkbox */
}
/* ... (vorheriger CSS-Code) ... */

/* Stil fur den Container der Checkboxen */
.wpcf7-form .wpcf7-checkbox {
    display: flex; /* Flexbox-Layout aktivieren */
    flex-wrap: wrap; /* Ermoglicht das Umfliessen auf mehrere Zeilen */
    gap: 10px; /* Abstand zwischen den Checkboxen */
}

/* Stil fur einzelne Checkboxen */
.wpcf7-form .wpcf7-checkbox .wpcf7-list-item {
    flex: 1 1 calc(50% - 10px); /* Flexible Basisgrosse und Schrumpfen/Dehnen erlauben */
    box-sizing: border-box; /* Inkludiert Padding und Border in der Breite */
    min-width: 140px; /* Minimale Breite festlegen, um zu fruhes Umfliessen zu verhindern */
}

/* Media Queries fur Responsivitat auf kleineren Bildschirmen */
@media (max-width: 768px) {
    .wpcf7-form .wpcf7-checkbox .wpcf7-list-item {
        flex-basis: 100%; /* Vollstandige Breite auf kleineren Geraten */
    }
}

/* Stil fur den Abstand zwischen Uberschrift und Checkbox-Container */
.wpcf7-form .wpcf7-checkbox {
    margin-top: 5px; /* Abstand zur vorherigen Uberschrift */
}

/* Alternativ, wenn die Uberschriften innerhalb des Checkbox-Containers sind */
.wpcf7-form .wpcf7-list-item:first-child {
    margin-top: 5px; /* Abstand zur Uberschrift innerhalb des Containers */
}


/* Stil fur den Senden-Button */
.wpcf7-form input[type="submit"] {
    background-color: #e30613; /* Rote Hintergrundfarbe */
    color: white; /* Weisse Textfarbe */
    border: none; /* Kein Rand */
    padding: 10px 20px; /* Padding */
    border-radius: 4px; /* Abgerundete Ecken */
    cursor: pointer; /* Cursor-Stil */
}

/* Stil fur Fehlermeldungen */
.wpcf7-not-valid-tip {
    color: #e30613; /* Farbe der Fehlermeldung */
    margin-top: 5px; /* Abstand nach oben */
}

/* Stil fur die Bestatigungsnachricht */
.wpcf7-mail-sent-ok {
    color: green; /* Farbe der Bestatigungsnachricht */
}

/* Media Queries fur Responsivitat */
@media (max-width: 768px) {
    .wpcf7-form {
        max-width: 100%; /* Volle Breite auf kleineren Geraten */
        padding: 10px; /* Etwas weniger Abstand */
    }

    .wpcf7-form input[type="text"],
    .wpcf7-form input[type="email"],
    .wpcf7-form input[type="tel"],
    .wpcf7-form textarea,
    .wpcf7-form input[type="submit"] {
        width: calc(100% - 20px); /* Berucksichtigt das Padding */
    }
}

@media (max-width: 480px) {
    .wpcf7-form label {
        display: block; /* Stellt sicher, dass Labels oberhalb der Eingabefelder stehen */
        margin-bottom: 5px; /* Abstand unter Labels */
    }

    .wpcf7-form input[type="checkbox"],
    .wpcf7-form input[type="radio"] {
        display: block; /* Checkboxen und Radiobuttons nehmen eigene Zeile ein */
    }
}

/*Formular englisch-Button"Dursuchen" angepasst*/
#file-upload[type="file"] {display: none; /*Button ausblenden*/
	}
.file-upload {
	background: #f7f7fc;
	border: 1px solid #e30613;
	border-radius: 5px;
    padding: 3px 10px;
	margin-top: 10px;
	cursor: pointer;
	font-size: 17px;
}

/* h1 {
    font-size: 50 px !important;
}

h2 {
    font-size: 40px !important;
}

@media only screen and (max-width: 767px) {
    h2 {
        font-size: 30px !important;
    }
	h3 {
    font-size: 30px !important;
}

	@media only screen and (max-width: 767px) {
    h3 {
        font-size: 22px !important;
    }
}

	h5 {
    font-size: 20px !important;
}
@media only screen and (max-width: 767px) {
    h5 {
        font-size: 16px !important;
    }
}

}

p {
    font-size: 16px !important;
}

/*Button in Menu*/
.ft-menu-btn a {
  background-color: #e30613;
  color: #fff !important;
  border-radius: 25px;
  text-align: center;
  align-items: center;
  /* text-transform: uppercase;  /* Grossbuchstaben fur typischen Button-Look */
}
.ft-menu-btn:hover a {
  background-color: #a52c34;
  color: #fff !important;
  padding: 15px !important;
  border-radius: 25px;
  text-align: center;
}
.ft-menu-btn a {
  padding: 9px !important;
  margin: -5px !important;
 }
/* Breite Innen Drop-Down-Menu*/
.et-menu li li a {
    padding: 6px 20px; 
    width: 210px;
}
/* Breite Aussen Drop-Down-Menu*/
.nav li ul {
    position: absolute;
    padding: 20px 0; 
    width: 250px;
}
/* Sandwichmenu mobil --> X*/
.mobile_menu_bar::before {
    display: block;
    transition: all .4s ease;
}
.mobile_nav.opened .mobile_menu_bar::before {
    content: "M";
    transform: rotate(90deg);
}
/*mobiles menu auf ganze breite*/
.et_mobile_menu {
 min-width: 50vw !important;
 margin-left: -190.5%;
}

/*Button "Pfeil nach oben" - rund gestalten*/
.et_pb_scroll_top.et-pb-icon { border-radius:50%; right:1rem; }
.et_pb_scroll_top.et-pb-icon {
    border-radius:50%;
    right:1rem;
}
/*Button "Pfeil nach oben" - Groesse*/
.et_pb_scroll_top.et-pb-icon {
  width: 60px;          /* Breite */
  height: 60px;         /* Hohe */
  line-height: 45px;    /* sorgt, dass das Icon mittig steht */
  font-size: 50px;      /* Grosse des Icons */
}

/*Button "Pfeil nach oben" - Farbe + hover gestalten*/
.et_pb_scroll_top.et-pb-icon {
background-color: #e30613;
color: #ffffff;
}
.et_pb_scroll_top.et-pb-icon:hover {
background-color: #ffffff;
color: #e30613;
border: 1px solid #e30613;
}

/* Unterstreichung fur alle Links in Divi deaktivieren, auch beim Hovern: Word-Press-Fehler */
a, a:hover {
text-decoration: none !important;
}
/*Postslider-Homepage Modul Post-Slider (rote Flache)*/
/* Titel/Linkbezeichnung im Postslider ausblenden */
.et_pb_post_slider .et_pb_slide_title {
    display: none !important;
}

/* 1. Die Hauptzeile (1-Uberschrift H1) im Auszug!! nicht Link*/
.slider-subline {
    display: block;
    font-weight: bold !important;
    font-size: 16px !important;
	line-height: 1.6em !important;
    text-transform: uppercase !important;
    margin-bottom: 0px;
	margin-top: 6px;
}

/* 2. Die zweite Zeile (2-Uberschrift H2 oder H3) im Auszug !!*/
.slider-subline-2 {
    font-size: 17px !important;
    line-weight: bold !important; /* Optional: Falls sie auch fett sein soll */
    line-height: 1.2em !important;
    margin-bottom: 18px; /* Abstand zum Fliesstext darunter */
	margin-top: 8px;
}

/* Beitragstitel bzw.Linkbezeichnung im Modul Blog-Einstellungen /nachrichten-einblicke-seite/ ausblenden */
.et_pb_blog_grid.clearfix .entry-title {
    display: none !important;
}
/* Beitragstitel bzw.Linkbezeichnung im Modul Blog-Einstellungen Spalte rechts /Blogbeitrag-seite/ ausblenden */
.et_pb_post.clearfix .entry-title {
    display: none !important;
}
