/*---------------------------------------------------------------------------------

 Theme Name:   Divi Child Theme
 Theme URI:    https://lukas-fischer.de/
 Description:  Child Theme für Divi erstellt von Lukas Fischer.
 Author:       Lukas Fischer
 Author URI:   https://lukas-fischer.de
 Template:     Divi
 Version:      1.1.9


------------------------------ ADDITIONAL CSS HERE ------------------------------*/


/* -------------------------------------------------
   KRENZ Mobile Header Phase 1
--------------------------------------------------*/

@media (max-width:980px){

/* Header */

#main-header{
    height:78px;
    min-height:78px;
    box-shadow:none;
}

.et_menu_container{
    height:78px;
    min-height:78px;
    padding-left:0 !important;
    padding-right:0 !important;
}

/* Logo */

.logo_container{
    height:78px;
    margin-left:-8px;
}

.logo_helper{
    display:none;
}

#logo{
    height:62px !important;
    width:auto !important;
    max-width:none !important;
    max-height:62px !important;
}

/* Navigation */

#et-top-navigation{
    padding-left:0 !important;
}

#et_mobile_nav_menu{
    position:relative;
}

/* Divi Standardicon ausblenden */

.mobile_menu_bar:before{
    display:none !important;
}

/* Hamburger Button */

.mobile_menu_bar{

    position:relative;

    width:60px;
    height:60px;

    padding:0 !important;
    margin:0 !important;

    background:none !important;

    cursor:pointer;

}

/* Hamburger Icon */

.mobile_menu_bar:after{

    content:"";

    position:absolute;

    width:50px;
    height:50px;

    left:5px;
    top:-10px;

    background:url('/wp-content/uploads/2026/07/krenz-mobile-menu.svg') no-repeat center center;
    background-size:contain;

}

/* Close Icon */

.mobile_nav.opened .mobile_menu_bar:after{

    background-image:url('/wp-content/uploads/2026/07/krenz-mobile-menu-closed.svg');

}

	/* Chat Button */

	.krenz-chat-button{

		display:block;
		position:absolute !important;

		position:absolute;

		width:57px;
		height:57px;

		right:60px;
		top:10px;

		background:url('/wp-content/uploads/2026/07/krenz-chat-icon.svg') no-repeat center center;
		background-size:contain;

		cursor:pointer;

		z-index:99999;

	}

}







/* =====================================================
   KRENZ Mobile Menü - Phase 2
=====================================================*/

@media (max-width:980px){

/* Menü vom Header lösen */

.et_mobile_menu{

    position:fixed !important;

    top:78px !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;

    width:100vw !important;
    max-width:100vw !important;

    height:calc(100vh - 78px) !important;
    max-height:none !important;

    margin:0 !important;

    padding:15px !important;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    border-top:none !important;

    background:#fff;

    box-shadow:none;

    z-index:99998;

}


/* Divi Standardposition entfernen */

.mobile_nav{

    position:static !important;
	z-index: 9999;

}

#et_mobile_nav_menu{

    position:static !important;

}


/* Animation */

.et_mobile_menu{

    transform:translateX(100%);
    transition:transform .35s ease;

}

.mobile_nav.opened .et_mobile_menu{

    transform:translateX(0);

}

}


/* =====================================================
   KRENZ Mobile Secondary Bereich
=====================================================*/

@media (max-width:980px){

/* Abstand vor dem Secondary */

.et_mobile_menu li.menu-rueckruf{

    margin-top:48px !important;
    padding-top:20px !important;

}

/* Icons */

.menu-rueckruf > a:before,
.menu-kundenportal > a:before,
.menu-oeffnungszeiten > a:before,
.menu-adresse > a:before,
.menu-tel > a:before,
.menu-email > a:before{

    color:#00509D !important;

    display:inline-block;

    width:24px;

    margin-left:0 !important;
    margin-right:14px !important;

    text-align:center;

}

/* Secondary Links */

.et_mobile_menu li.menu-rueckruf > a,
.et_mobile_menu li.menu-kundenportal > a,
.et_mobile_menu li.menu-oeffnungszeiten > a,
.et_mobile_menu li.menu-adresse > a,
.et_mobile_menu li.menu-tel > a,
.et_mobile_menu li.menu-email > a{

    padding:5px 0 5px 18px !important;

    border-bottom:none !important;

    font-size:15px !important;

}

/* Listenelemente */

.et_mobile_menu li.menu-rueckruf,
.et_mobile_menu li.menu-kundenportal,
.et_mobile_menu li.menu-oeffnungszeiten,
.et_mobile_menu li.menu-adresse,
.et_mobile_menu li.menu-tel,
.et_mobile_menu li.menu-email{

    margin-bottom:2px !important;
    padding:0 !important;

    border-bottom:none !important;

}

}

/*Superchat Standardbutton mobil ausblenden*/

@media (max-width:980px){
	#superchat-widget-widget-button {
		display: none !important;
	}
	
	#main-header {
		z-index: 9999;
		border-bottom: 1px solid #ababab !important;
	}
	
	.container.clearfix.et_menu_container {
		width: 90%;
	}
}


#superchat-widget {
	z-index: 100000 !important;
}

.mobile_menu_bar.mobile_menu_bar_toggle {
	z-index: 100001;
}


/* =======================================================
   KRENZ Fahrzeug Preis Anpassung
======================================================= */

.vehicle-on-archive > .price_wrapper.dxim_vehicle_price {
	padding-top: 1em;
}


.vehicle-on-single.dxim_clearfix {
	padding-top: 2em;
	padding-bottom: 5em;
}

.price_big {
    line-height: 1;
}

@media (max-width: 762px) {
	.dxim_control_buttons {
		display: none !important;
	}
}



/* =======================================================
   KRENZ Mobile Bottom Navigation
======================================================= */

@media (max-width:980px){

#lf-mobile-bottom-nav{

    position:fixed;
    left:0;
    right:0;
    bottom:0;

    display:flex;

    height:70px;

    background:#00509D;

    z-index:999999;

    box-shadow:0 -4px 18px rgba(0,0,0,.14);

    padding-bottom:env(safe-area-inset-bottom);

}

/* Nur auf der Startseite zunächst ausblenden */
#lf-mobile-bottom-nav[data-home="1"]{

    opacity:0;
    visibility:hidden;

    transform:translateY(100%);

    transition:
        opacity .25s ease,
        transform .25s ease,
        visibility .25s;

}

/* Nach Scrollen einblenden */
#lf-mobile-bottom-nav.show{

    opacity:1;
    visibility:visible;

    transform:translateY(0);

}

#lf-mobile-bottom-nav a{

    flex:1;

    display:flex;
    flex-direction:column;

    justify-content:center;
    align-items:center;

    padding-top:2px;
    padding-bottom:6px;

    text-decoration:none;

    color:#fff;

    font-size:12px;
    font-weight:700;
    line-height:1.1;

    transition:.2s;

    position:relative;

}

#lf-mobile-bottom-nav img{

    width:34px;
    height:34px;

    margin-bottom:-2px;

    display:block;

}

/* Werkstatttermin */
#lf-mobile-bottom-nav a:nth-child(1) img{

    transform:translateY(3px);

}

/* Auto verkaufen */
#lf-mobile-bottom-nav a:nth-child(2) img{

    transform:translateY(3px);

}

/* Auto finden */
#lf-mobile-bottom-nav a:nth-child(3) img{

    transform:translateY(0);

}

#lf-mobile-bottom-nav a.active{

    background:rgba(255,255,255,.08);

}

#lf-mobile-bottom-nav a.active::before{

    content:"";

    position:absolute;

    top:0;
    left:14px;
    right:14px;

    height:3px;

    background:#FDB515;

    border-radius:0 0 4px 4px;

}

#lf-mobile-bottom-nav a:active{

    transform:scale(.96);

}

body{

    padding-bottom:70px;

}

}

@media (min-width:981px){

#lf-mobile-bottom-nav{

    display:none;

}

}




body.audaris-lightbox-open #top-header,
body.audaris-lightbox-open #main-header{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
}





/* Set the Divi Mobile Nav to Fixed on scroll */
@media (max-width: 980px) {
.et_non_fixed_nav.et_transparent_nav #main-header, .et_non_fixed_nav.et_transparent_nav #top-header, .et_fixed_nav #main-header, .et_fixed_nav #top-header {
    position: fixed;
	width: 100% !important;
}
}
.et_mobile_menu {
    overflow: scroll !important;
    max-height: 83vh;
}

/* Change the hamburger icon to an X when opened 
.mobile_nav.opened .mobile_menu_bar:before {
    content: '\4d';
}*/


/* Alle mobilen Menü-Items fett darstellen */
.et_mobile_menu li a,
.et-db #et-boc .et-l .et_mobile_menu li a {
    font-weight: bold !important;
}


/*adjust the new toggle element which is added via jQuery*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
ul.et_mobile_menu li.page_item_has_children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle {
	width: 44px;
	height: 100%;
	padding: 0px !important;
	max-height: 44px;
	border: none;
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 999;
	background-color: transparent;
}


/*some code to keep everyting positioned properly*/

ul.et_mobile_menu>li.menu-item-has-children,
ul.et_mobile_menu>li.page_item_has_children,
ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.page_item_has_children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children {
	position: relative;
}


/*remove default background color from menu items that have children*/

.et_mobile_menu .menu-item-has-children>a,
.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children>a {
	background-color: transparent;
}


/*hide the submenu by default*/

ul.et_mobile_menu .menu-item-has-children .sub-menu,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
	display: none !important;
	visibility: hidden !important;
}


/*show the submenu when toggled open*/

ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
	display: block !important;
	visibility: visible !important;
}


/*adjust the toggle icon position and transparency*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle {
	text-align: center;
	opacity: 1;
}


/*submenu toggle icon when closed*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after {
	top: 10px;
	position: relative;
	font-family: "ETModules";
	content: '\33';
	color: #00d263;
	background: #f0f3f6;
	border-radius: 50%;
	padding: 3px;
}


/*submenu toggle icon when open*/

ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after {
	content: '\32';
}


/*add point on top of the menu submenu dropdown*/

.et_pb_menu_0.et_pb_menu .et_mobile_menu:after {
	position: absolute;
	right: 5%;
	margin-left: -20px;
	top: -14px;
	width: 0;
	height: 0;
	content: '';
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid #ffffff;
}


/*adjust the position of the hamburger menu*/

.mobile_menu_bar {
	position: relative;
	display: block;
	bottom: 1px;
	line-height: 0;
}


/*force the background color and add a rounded border*/

.et_pb_menu_0.et_pb_menu .et_mobile_menu,
.et_pb_menu_0.et_pb_menu .et_mobile_menu ul {
	background-color: #ffffff!important;
	border-radius: 10px;
}

/* Mobile Menüeinträge klarer trennen */
.et_mobile_menu li {
  border-bottom: 2px solid #e0e0e0 !important; /* gut sichtbares Hellgrau */
}

/* Letztes Menü-Item ohne Linie */
.et_mobile_menu li:last-child {
  border-bottom: none !important;
}









/* Divi Buttons nebeneinander platzieren */
.inline-btns .et_pb_button_module_wrapper {
  display: inline-block;
  margin: 0 10px;
}



.buttons-nebeneinander .et_pb_button_module_wrapper {
    display: inline-block;
}

.buttons-nebeneinander {
text-align: left !important; /* sorgt dafür, dass die Buttons zentriert ausgerichtet werden! Wenn du die Buttons linksbündig möchtest, dann ersetze center durch left */
}



/* =========================================================
   GRAVITY FORMS - GLOBAL STYLING
========================================================= */



/* =========================================================
   BUTTONS
========================================================= */

.gform_wrapper .gform-theme-button,
.gform_wrapper .gform_button,
.gform_wrapper .gform_next_button,
.gform_wrapper .gform_previous_button {

    background: #014A8C !important;
    border: 4px solid #b2cbe5 !important;
    color: #ffffff !important;

    font-family: 'OpenSans-Semibold', sans-serif !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;

    padding: 14px 30px !important;

    border-radius: 28px !important;

    transition: none !important;

    box-shadow: none !important;
    text-shadow: none !important;

    appearance: none;
    -webkit-appearance: none;

    box-sizing: border-box;

    min-height: auto !important;
}


/* Hover identisch */

.gform_wrapper .gform-theme-button:hover,
.gform_wrapper .gform_button:hover,
.gform_wrapper .gform_next_button:hover,
.gform_wrapper .gform_previous_button:hover {

    background: #014A8C !important;
    border-color: #b2cbe5 !important;
    color: #ffffff !important;

    box-shadow: none !important;
    transform: none !important;
}


/* Focus entfernen */

.gform_wrapper .gform-theme-button:focus,
.gform_wrapper .gform_button:focus,
.gform_wrapper .gform_next_button:focus,
.gform_wrapper .gform_previous_button:focus {

    outline: none !important;
    box-shadow: none !important;
}



/* =========================================================
   FORMULAR TITEL
========================================================= */

.gform_wrapper .gform_title {

    font-family: 'OpenSans-Semibold', sans-serif !important;
    color: #014A8C !important;

}



/* =========================================================
   SECTION HEADINGS / H3
========================================================= */

.gform_wrapper .gsection_title {

    font-family: 'OpenSans-Semibold', sans-serif !important;
    color: #014A8C !important;

}



/* =========================================================
   PROGRESS BAR
========================================================= */

.gform_wrapper .gf_progressbar_percentage,
.gform_wrapper .percentbar_blue {

    background: #014A8C !important;

}


/* =========================================================
   RADIO BUTTONS + CHECKBOXEN
========================================================= */


/* Native Browserstyles neutralisieren */

.gform_wrapper input[type="radio"],
.gform_wrapper input[type="checkbox"] {

    -webkit-appearance: none !important;
    appearance: none !important;

    width: 28px;
    height: 28px;

    background: #ffffff !important;
    border: 2px solid #7b8794 !important;

    margin: 0;
    padding: 0;

    cursor: pointer;

    outline: none !important;
    box-shadow: none !important;

    transition: none !important;

    position: relative;
}


/* Radio rund */

.gform_wrapper input[type="radio"] {

    border-radius: 50% !important;

}


/* Checkbox eckig */

.gform_wrapper input[type="checkbox"] {

    border-radius: 4px !important;

}


/* Hover */

.gform_wrapper input[type="radio"]:hover,
.gform_wrapper input[type="checkbox"]:hover {

    border-color: #014A8C !important;
    background: #ffffff !important;

}


/* Focus */

.gform_wrapper input[type="radio"]:focus,
.gform_wrapper input[type="checkbox"]:focus,
.gform_wrapper input[type="radio"]:active,
.gform_wrapper input[type="checkbox"]:active,
.gform_wrapper input[type="radio"]:focus-visible,
.gform_wrapper input[type="checkbox"]:focus-visible {

    outline: none !important;
    box-shadow: none !important;
    background: #ffffff !important;
    border-color: #014A8C !important;

}


/* AUSGEWÄHLTER RADIO BUTTON */

.gform_wrapper input[type="radio"]:checked::before {

    content: "";

    width: 14px;
    height: 14px;

    border-radius: 50%;

    background: #014A8C;

    position: absolute;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

}


/* AUSGEWÄHLTE CHECKBOX */

.gform_wrapper input[type="checkbox"]:checked::before {

    content: "";

    width: 8px;
    height: 14px;

    border-right: 3px solid #014A8C;
    border-bottom: 3px solid #014A8C;

    position: absolute;

    top: 45%;
    left: 50%;

    transform: translate(-50%, -50%) rotate(45deg);

}


/* Checked State */

.gform_wrapper input[type="radio"]:checked,
.gform_wrapper input[type="checkbox"]:checked {

    background: #ffffff !important;
    border-color: #014A8C !important;

}


/* Auch Wrapper neutralisieren */

.gform_wrapper .gchoice input,
.gform_wrapper .gchoice input:focus,
.gform_wrapper .gchoice input:active,
.gform_wrapper .gchoice input:focus-visible {

    outline: none !important;
    box-shadow: none !important;

}


/* Keine Animationen beim Anklicken */

.gform_wrapper input[type="radio"],
.gform_wrapper input[type="checkbox"] {

    transition: none !important;

}



/* =========================================================
   INPUT FELDER
========================================================= */

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="file"],
.gform_wrapper textarea,
.gform_wrapper select {

    border-color: #7b8794 !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;

}


/* Aktives Feld */

.gform_wrapper input[type="text"]:focus,
.gform_wrapper input[type="email"]:focus,
.gform_wrapper input[type="tel"]:focus,
.gform_wrapper input[type="number"]:focus,
.gform_wrapper input[type="file"]:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {

    border-color: #014A8C !important;
    box-shadow: 0 0 0 2px rgba(1,74,140,0.15) !important;

    outline: none !important;

}



/* =========================================================
   LEERE HEADINGS AUSBLENDEN
========================================================= */

.gform_wrapper h3:empty,
.gform_wrapper h4:empty {

    display: none !important;

}





.krenz-button {
    background: #0d2d52;
    border: 4px solid #b2cbe5;
    color: #fff;
    transition: all 0.25s ease;
    box-sizing: border-box;
}

.krenz-button:hover {
    border-color: #c1d7ee;
    box-shadow: 0 0 0 2px #c1d7ee;
}









.menu-rueckruf > a:before {
    font-family: 'ETMODULES';
    content: '\e065';
    text-align: center;
    vertical-align: middle;
    margin-right: 8px;
  	color: #ffffff;
    font-size: 1em;
    transition: all .3s ease;
}



.menu-adresse > a:before {
    font-family: 'ETMODULES';
    content: '\e081';
    text-align: center;
    vertical-align: middle;
    margin-right: 8px;
    margin-left: 10px;
    color: #ffffff;
    font-size: 1em;
    transition: all .3s ease;
}


.menu-oeffnungszeiten > a:before {
    font-family: 'ETMODULES';
    content: '\7d';
    text-align: center;
    vertical-align: middle;
    margin-right: 10px;
    margin-left: 8px;
    color: #ffffff;
    font-size: 1em;
    transition: all .3s ease;
}

.menu-kundenportal > a:before {
    font-family: 'ETMODULES';
    content: '\e08b';
    text-align: center;
    vertical-align: middle;
    margin-right: 8px;
    margin-left: 10px;
    color: #ffffff;
    font-size: 1em;
    transition: all .3s ease;
}


.menu-email > a:before {
    font-family: 'ETMODULES';
    content: '\e076';
    text-align: center;
    vertical-align: middle;
    margin-right: 8px;
    margin-left: 10px;
    color: #ffffff;
    font-size: 1em;
    transition: all .3s ease;
}


.menu-tel > a:before {
    font-family: 'ETMODULES';
    content: '\e090';
    text-align: center;
    vertical-align: middle;
    margin-right: 8px;
    margin-left: 10px;
    color: #ffffff;
    font-size: 1em;
    transition: all .3s ease;
}





/* Abstand für h2 nach unten im Blog*/

h2.wp-block-heading {
 	margin-top: 7px !important;
	margin-bottom: 16px !important;
}


/* Abstand für h3 nach unten im Blog*/

h3.wp-block-heading {
 	margin-top: 7px !important;
	margin-bottom: 16px !important;
}

/* Abstand für h4 nach unten im Blog*/

h4.wp-block-heading {
  	margin-top: 7px !important;
	margin-bottom: 16px !important;
}




/* Divi + Gutenberg: Überschriften sicher umbrechen */
.wp-block-post-content .wp-block-heading,
.et_pb_post_content .wp-block-heading,
.entry-content .wp-block-heading,
.wp-block-heading {
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
}






/* Erste und zweite Ebene im Dropdown-Menü: Trennlinie zwischen Listenelementen */
#top-menu .sub-menu li {
    border-bottom: 2px solid #e0e0e0;
    padding: 8px 16px;
}

/* Letztes Element ohne Linie */
#top-menu .sub-menu li:last-child {
    border-bottom: none;
}

/* Increase inner width of drop-down menu */
.et-menu li li a {
    padding: 8px 24px;
    width: 320px;
    font-size: 15px;
    line-height: 1.3;
}

/* Increase width of drop-down menu */
.nav li ul {
    position: absolute;
    padding: 20px 4;
    width: 360px;
}

#top-menu li li a {
    padding: 4px 20px;
    width: 320px;
    font-size: 15px;
    line-height: 1.3;
}

/*Kontaktformular*/

.et_contact_bottom_container {
    float: none;
    text-align: right;
    display: block !important;
  margin-top:30px;
  margin-left:20px;
}

@media (min-width: 768px) and (max-width: 991.98px){
  .et_contact_bottom_container {
     margin-top: -17px;
  }
}

@media (min-width: 300px) and (max-width: 767.98px){
  .et_contact_bottom_container {
     margin:25px;
    text-align:center;
  }
}




/*design back to top button*/

.et_pb_scroll_top.et-pb-icon {
	    background: rgba(0, 81, 157, 0.5);
		bottom: 280px;
		right: 20px;
    	border-radius: 25px;
}

.et_pb_scroll_top.et-pb-icon:hover {
	    background: #00509D;
		bottom: 280px;
		right: 20px;
    	border-radius: 25px;
}

.et_pb_scroll_top.et-visible {
    opacity: 1;
    -webkit-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
    -moz-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
    -o-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
    animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
} 



.inline-buttons .et_pb_button_module_wrapper {
    display: inline-block;
}

.inline-buttons {
text-align: center !important;
}








/*prevent horizontal scroll on mobile*/

@media all and (max-width: 980px) {
	html,
	body {
		overflow-x: hidden;
	}
	body {
		position: relative
	}
}

@media all and (max-width: 980px) {
#page-container {overflow:hidden;}	
}