/*
Theme Name: Elbnetz
Template: Impreza
Version: 1.0
Author:	Elbnetz GmbH
Theme URI: https://elbnetz.com/
Author URI: https://elbnetz.com/
*/

/*Add your own styles here:*/
:root {
  /* Style */
  --blur: ;
  --shadow: ;
  --border: ;

/* Variable Abstände */
  --padding-xl: clamp(4rem, 2.667rem + 4vw, 6rem);
  --padding-l: clamp(3rem, 1.667rem + 4vw, 5rem);
	--padding-m: clamp(1.5rem, 0.5rem + 3vw, 3rem);
  --padding-s: clamp(1rem, 0.333rem + 2vw, 2rem);

/* Radius */
  --radius: 0.3em;
  --radius-box: clamp(1.2rem, -0.479rem + 4.372vw, 2.8rem);
	--radius-box-s: clamp(1rem, -0.479rem + 4.372vw, 2.4rem);
  --radius-btn: 5rem; 
}



/* ---
* Theme-Korrekturen 
* —-- */
/* Fix für feststehende Bilder mobil iOS */
@media only screen and (max-device-width: 1300px) {
  .state_mobiles section {
  background-attachment: initial!important;
  }
}
.state_mobiles .l-section {
	padding-left: 2rem;
	padding-right: 2rem;
}

/* Horizontales Seitenscrolling verhindern */
.l-canvas {
  overflow: hidden;
}

/* Farben für Text-Markierungen */
::-moz-selection { 
  background: var(--color-focus);
  color: var(--color-white);
}
::selection { 
   background: var(--color-focus);
  color: var(--color-white);
}

/* Abstände angleichen - Section */
.l-section.height_small {
  padding-top: var(--padding-s);
  padding-bottom: var(--padding-s);
}
.l-section.height_medium {
  padding-top: var(--padding-m);
  padding-bottom: var(--padding-m);
}
.l-section.height_large {
  padding-top: var(--padding-l);
  padding-bottom: var(--padding-l);
}
.l-section.height_huge {
  padding-top: var(--padding-xl);
  padding-bottom: var(--padding-xl);
}

/* Abstände angleichen - Trenner ohne Inhalt */
.w-separator.size_small:empty {
  height: var(--padding-s);
}
.w-separator.size_medium:empty {
  height: var(--padding-m);
}
.w-separator.size_large:empty {
  height: var(--padding-l);
}
.w-separator.size_huge:empty {
  height: var(--padding-xl);
}


/* ---
 * Schriften 
 * --- */
/* --- Wortumbruch - Hyphens/Silbentrennung --- */
h1, h2, h3, h4  {
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto!important; 
	
  -webkit-hyphenate-limit-before: 3; /* Safari */
  -webkit-hyphenate-limit-after: 4; /* Safari */
  -ms-hyphenate-limit-chars: 12 3 4;
  hyphenate-limit-chars: 12 3 4; 
}

/* --- Uppercase --- */
span.en_uppercase, 
.en_uppercase {
  text-transform: uppercase;
}

/* --- Link-Unterstreichung --- */
p > a,
.wpb_text_column ul:not(.menu) > li > a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* --- H1 --- */
body h1,
.en_like_h1 {
	font-size: var(--h1-font-size);
  line-height: var(--h1-line-height);
}

/* --- H2 --- */
body h2,
.en_like_h2 {
	font-size: var(--h2-font-size);
  line-height: var(--h2-line-height); 
}

/* --- H3 --- */
body h3,
.en_like_h3 {
	font-size: var(--h3-font-size);
  line-height: var(--h3-line-height); 
}


/* --- 
 * Design Standards
 * --- */
/* --- Section --- */
.l-canvas section {
	background: var(--color-body-bg);
}

.l-canvas section .g-cols.vc_row .wpb_row {
	padding: var(--padding-m);
	border-radius: var(--radius-box);
	margin: 0;
}


.l-canvas section .g-cols.vc_row .wpb_row .wpb_column,
.l-canvas section .g-cols.vc_row .wpb_row .wpb_column .vc_column-inner {
	padding: 0!important
}
.l-canvas section .g-cols.vc_row .wpb_row .vc_col-sm-6:first-child {
	padding-right: calc(var(--padding-m))!important;
}

/* Hintergrund der zwei Spalten auf eine Höhe setzen */
.l-canvas section:not(.en_opener_video) .g-cols.vc_row > .vc_col-sm-6 > .vc_column-inner > .wpb_wrapper {
	flex: 1;
  display: flex;
}

/* Beiträge */
.single-post .l-canvas section .g-cols.vc_row .wpb_row .vc_col-sm-8 {
	padding-right: calc(var(--padding-l))!important;
}

/* --- Farbeinstellungen automatisch nach Inhaltsfarbe oder Alternative Inhaltsdarbe */
.l-canvas section .g-cols.vc_row .wpb_row {
	background: var(--color-content-bg); 
}
.l-canvas section.color_alternate .g-cols.vc_row .wpb_row {
	background: var(--color-alt-content-bg); 
}


/* --- mobile Optimierung */
.state_mobiles .l-canvas section .g-cols.vc_row > .wpb_column > .vc_column-inner {
	padding-left: 0rem;
	padding-right: 0rem;
}

/* --- Ausnahme Konfiguratorseite */
body.page-id-47 section {
	background: black!important;
}
/* ---
 * Header 
 * --- */
#page-header {
	transform: translateX(-50%);
	left: 50%;
	width: 100%;
	padding-left: 2.5rem;
	padding-right: 2.5rem;
}
#page-header .l-subheader.at_middle {
	border-radius: 50px;
	margin-top: 1.5rem;
	background: var(--color-black)!important;
	max-width: 1500px;
}
.state_mobiles #page-header {
	padding-left: 0.4rem;
	padding-right: 0.4rem;
}
@media screen and (max-width: 900px) {
	.l-subheader {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
	}
}

/* --- Logo --- */
body .en_spacial_logo {
	background: none!important;
}

/* --- Menü 1. Ebene --- */
.en_spacial_menu ul.level_1 {
	gap: 0.5rem;
}
.en_spacial_menu.type_desktop .menu-item.level_1 {
	background: var(--color-black)!important;
	border-radius: var(--radius-btn);	
}
.en_spacial_menu.type_desktop .menu-item.level_1:hover {
	background: var(--color-orange)!important;
	
}
.en_spacial_menu.type_desktop .menu-item.level_1:hover > .w-nav-anchor > .w-nav-title,
.en_spacial_menu.type_desktop .menu-item.level_1:hover > .w-nav-anchor > .w-nav-arrow{
	color: var(--color-white)!important;
}

/* --- Submenu --- */
nav.type_desktop .en_hide_desktop  {
  display: none;
}
.en_spacial_menu.type_desktop .w-nav-list .w-nav-list.level_2 {
	padding-top: 1rem;
}
.en_spacial_menu.type_desktop .w-nav-list .w-nav-list{
	border-radius: 1.5rem 1.5rem;
	background: none!important;
	box-shadow: none!important;
}
.en_spacial_menu.type_desktop .w-nav-list .w-nav-list li {
	background: var(--color-header-middle-bg);
}
.en_spacial_menu.type_desktop .w-nav-list .w-nav-list li:nth-child(2) {
	border-radius: 1.5rem 1.5rem 0 0;
}
.en_spacial_menu.type_desktop .w-nav-list .w-nav-list li:last-child {
	border-radius: 0 0 1.5rem 1.5rem;
}

/* --- Burger-Menu --- */
.en_spacial_menu.type_mobile ul.w-nav-list.level_1 {
	border-radius: var(--radius-box);
	margin-top: 0.2rem;
}
.en_spacial_menu.type_mobile li.opened > a {
	color: var(--color-header-middle-text-hover)!important;
}


/* ---
 * Footer
 * --- */
.en_footer .g-cols.vc_row .wpb_row {
	background: var(--color-content-bg);
	padding: var(--padding-m);
	margin: 0;
	border-radius: var(--radius-box);
}
.en_footer .g-cols.vc_row .wpb_row .wpb_column,
.en_footer .g-cols.vc_row .wpb_row .wpb_column .vc_column-inner {
	padding: 0!important
}
.en_footer .g-cols.vc_row .wpb_row .vc_col-sm-4 {
	padding-right: calc(var(--padding-m))!important;
}
/* mobil */
.state_mobiles #page-footer section .g-cols.vc_row > .wpb_column > .vc_column-inner {
	padding-left: 0rem;
	padding-right: 0rem;
}

/* --- Footer-Icons --- */
.en_footer_icons  {
	gap: 1rem;
}
.en_footer_icons .w-gallery-list {
	height: 67.5px;
}

@media only screen and (max-width: 600px) {
	.en_footer_icons .w-gallery-list {
		display: flex;
	}
}

/* --- Footer-Menu --- */
.state_tablets #page-footer nav ul {
	gap: 0.5rem!important;
}

.state_mobiles #page-footer nav ul {
	gap: 0.7rem!important;
}


/* ---
 * Opener
 * --- */
/* --- Startseite --- */
.en_opener_startseite .l-section-h {
	padding-top: 0!important;
}

.en_opener_startseite .vc_col-sm-3 {
	overflow: visible!important;
	position: relative;
	z-index: 1!important;
}
.en_opener_startseite .vc_col-sm-3:before {
	content: "";
  display: block;
  background-image: url("https://laserteileonline.de/wp-content/uploads/2025/05/LTO-Form.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 0;
  left: -40%;
  width: 200%;
  height: 100%;
  z-index: 0;
	overflow: visible;
}

.en_opener_startseite .vc_col-sm-9 {
	position: relative;
	z-index: 0;
}

/* --- mobil */
body.state_mobiles section.en_opener_startseite {
	height: 90svh;
}
.state_mobiles .en_opener_startseite .l-section-video {
	margin-top: 20svh;
}


/* --- Opener Seiten --- */
/* Video */
body:not(.state_default) .en_opener_seiten .en_opener_video {
	margin-top: calc(var(--padding-m))!important;
}
.state_tablets .en_opener_seiten .en_opener_video {
	margin-bottom: calc(var(--padding-s))!important;
}
body:not(.state_default) .en_opener_seiten .en_opener_video .w-video-h {
	padding-bottom: 40svh!important;
}

/* Inhalt */
.en_opener_seiten .en_opener_inhalt {
	margin-top: -5svw!important;
}

body.state_mobiles .en_opener_seiten .en_opener_inhalt {
	margin-top: var(--padding-m)!important;
}


/* ---
 * Teaser (Raster / Karussell)
 * --- */
.en_teaser .w-grid-item-h {
	border-radius: var(--radius-box) var(--radius-box) 0 0;
}

.en_teaser_kat .w-grid-item-h {
	border-radius: var(--radius-box);
}


/* --- Button --- */
.owl-nav button {
	background: var(--color-orange)!important;
}
.owl-carousel.navpos_outside .owl-prev {
  right: 90%;
}
.owl-carousel.navpos_outside .owl-next {
	left: 90%;
}

/* --- Dots --- */

.owl-dots button span {
  width: 70px!important;
	height: 5px!important;
  background: var(--color-orange)!important;
  box-shadow: none!important;
	transition: all 0.4s ease-in-out;
	border-radius: 3px;
	opacity: 1!important;
}

.owl-dots button.active span {
  width: 40px!important;
  background: var(--color-white)!important;
}


/* ---
 * FAQ / Akkordeon 
 * --- */
.en_acc .w-tabs-section,
.single-post .accordion .w-tabs-section {
	border: 0px!important;
}
.en_acc .w-tabs-section:not(:last-child),
.single-post .accordion .w-tabs-section {
	margin-bottom: 0.5rem;
}
.en_acc .w-tabs-section-header,
.single-post .accordion .w-tabs-section-header {
	background: var(--color-darkergrey);
	border-radius: var(--radius-box);
	color: var(--color-white)!important;
}
.en_acc .w-tabs-section-header .w-tabs-section-title,
.single-post .accordion .w-tabs-section-header .w-tabs-section-title {
	color: var(--color-white)!important;
}


/* -- auf dunkel */
.en_acc_hell .w-tabs-section-header {
	background: var(--color-white);
}
.en_acc_hell .w-tabs-section-header .w-tabs-section-title {
	color: var(--color-black)!important;
}


.en_acc .w-tabs-section-header:hover,
.en_acc .w-tabs-section-header.active:hover,
.single-post .accordion .w-tabs-section-header:hover,
.single-post .accordion .w-tabs-section-header.active:hover {
	background: var(--color-orange);
}

.en_acc .w-tabs-section-header:focus,
.single-post .accordion .w-tabs-section-header:focus {
	background: var(--color-darkergrey)!important;
}

/* --- auf dunkel */
.en_acc_hell .w-tabs-section-header:focus {
	background: var(--color-white)!important;
}


.en_acc .w-tabs-section-header.active:focus,
.single-post .accordion .w-tabs-section-header.active:focus {
	background: var(--color-black)!important;
}

.en_acc .w-tabs-section-header.active:focus .w-tabs-section-title,
.en_acc .w-tabs-section-header.active .w-tabs-section-title,
.single-post .accordion .w-tabs-section-header:focus .w-tabs-section-title,
.single-post .accordion .w-tabs-section-header.active .w-tabs-section-title {
	color: var(--color-orange)!important;
}

.en_acc h3.w-tabs-section-title,
.single-post .accordion h3.w-tabs-section-title {
	font-size: clamp(1.1rem, 0.967rem + 0.4vw, 1.3rem)!important;
	line-height: 1.1;
}

/* --- auf dunkel */
.en_acc_hell .w-tabs-section-content {
	color: var(--color-white);
}


/* --- 
 * Tour / Reiter 
 * --- */
/* Button */
.en_tour {
	background: var(--color-black);
	border-radius: var(--radius-box);
	padding-bottom: 1rem;
	overflow: hidden;
}
.en_tour .w-tabs-list {
	border-radius: var(--radius-box) var(--radius-box) 0 0;
}
.en_tour .w-tabs-list button {
	background: var(--color-orange);
	color: var(--color-white);
	border-radius: 0!important;
	margin: 0!important;
	transition: all 0.3s ease-in-out;
}
.en_tour .w-tabs-list button.active {
	background: var(--color-black)!important;
}
.en_tour .w-tabs-list button:hover {
	background: var(--color-black)!important;
}

/* Inhalt */
.en_tour:not(.accordion) .w-tabs-section-content-h {
	padding-left: 180px;
	position: relative;
}
.en_tour .en_konfi_bild {
	margin-bottom: 1.5rem;
}
.en_tour:not(.accordion) .w-tabs-section-content-h .en_konfi_bild {
	position: absolute;
	left: 0;
	max-width: 150px;
}
.en_tour.accordion .w-tabs-section-content-h .en_konfi_bild {
	max-width: 100px;
}

.en_tour .w-tabs-section-content {
	padding: 2rem 1.5rem;
}
.en_tour .w-tabs-section-content h3 {
	color: var(--color-content-heading)!important;
}

/* --- mobil */
.en_tour.accordion .w-tabs-sections .w-tabs-section-header {
	color: var(--color-white);
	font-family: var(--h1-font-family);
}
.en_tour.accordion .w-tabs-section.active .w-tabs-section-header {
	color: var(--color-orange);
}

/* --- Content-Slider */
.w-content-carousel .w-iconbox.icontype_img {
	margin-left: -30px!important;
}
.w-content-carousel .w-iconbox.icontype_img .w-iconbox-icon {
	width: 150px;
}
.w-content-carousel .w-iconbox.icontype_img img {
	width: 100%;
}

/* --- 
 * Formulare
 * --- */
.gform_required_legend {
	display: none;
}
.gfield_description,
.gform-field-label--type-sub{
	padding-top: 0!important;
	margin-top: 0!important;
}
.color_alternate .gform_wrapper.us-field-style_1 input:not(:focus),
.color_alternate .gform_wrapper.us-field-style_1 textarea:not(:focus),
input[type="checkbox"]:not(:focus)::before {
	color: var(--color-white);
}


::-ms-input-placeholder { /* Edge 12-18 */
  color: var(--color-white)!important;
  /*opacity: 1;*/
}

::placeholder {
  color: var(--color-white)!important;
  /*opacity: 1;*/
}
select:not(:focus) {
	color: var(--color-white)!important;
}

/* ---
 * Newsletter
 * --- */


/* ---
 * Einzel Beitrag (... Template)
 * --- */
/* --- Tabelle --- */
.table_component {
	display: block;
  max-width: 100%;
  overflow-x: auto;              /* Scrollbar nur bei Bedarf */
  scrollbar-gutter: stable;      /* Verhindert Layout-Sprung bei Scrollbar */
  scrollbar-width: auto;         	/* Für Firefox */
	color: var(--color-black)!important;
}

.table_component table {
	table-layout: auto!important;
	width: 100%!important;
	color: var(--color-black)!important;
	
	-moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto!important; 
	
  -webkit-hyphenate-limit-before: 3; /* Safari */
  -webkit-hyphenate-limit-after: 4; /* Safari */
  -ms-hyphenate-limit-chars: 12 3 4;
  hyphenate-limit-chars: 12 3 4;
}

.table_component table thead tr th {
	min-width: 150px!important;
}
.table_component table tbody td {
	line-height: 1.2;
}

/* --- Farben des Scrollens */
.table_component::-webkit-scrollbar {
  height: 10px;
}

.table_component::-webkit-scrollbar-thumb {
  background-color: var(--color-orange); 
  border-radius: 10px;
}

.table_component::-webkit-scrollbar-track {
  background-color: #f1f1f1;
	border-radius: 10px;  
}

/* --- Text "Erstellt von" */
.table_component > div {
	display: none;
}


/* --- 
 * Tabellen in Seiten 
 * --- */

.en_tabelle {
	display: block;
  max-width: 100%;
	max-height: 700px;
	overflow-y: auto; 
  overflow-x: auto;    
	/* Scrollbar nur bei Bedarf */
  scrollbar-gutter: stable;      /* Verhindert Layout-Sprung bei Scrollbar */
  scrollbar-width: auto;         /* Für Firefox */
}
section.color_alternate table td {
	border: 1px solid var(--color-black)!important;
}
section:not(.color_alternate) .en_tabelle table {
	background: var(--color-white);
}
.en_tabelle table {
	table-layout: auto!important;
	
	-moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto!important; 
	
  -webkit-hyphenate-limit-before: 3; /* Safari */
  -webkit-hyphenate-limit-after: 4; /* Safari */
  -ms-hyphenate-limit-chars: 12 3 4;
  hyphenate-limit-chars: 12 3 4;
}

.en_tabelle::-webkit-scrollbar {
  height: 10px;
	width: 10px;
}
.en_tabelle::-webkit-scrollbar-thumb {
  background-color: var(--color-orange); 
  border-radius: 10px;
}
.en_tabelle::-webkit-scrollbar-track{
  background-color: #f1f1f1;
	border-radius: 10px;  
}


/* ---
 * Barrierefreiheit
 * --- */
*:focus:not(:focus-visible) {
  outline: none!important;
}

*:focus-visible {
  outline: 2px solid var(--color-foocus)!important;
    outline-offset: 2px;
}

/* --- Skip Link Header --- */
.en_skip_link {
	position: absolute;
	left: -999px;
	padding: 5px;
}
.en_skip_link:focus {
	left: 1rem!important;
	top: 0rem;
	background: var(--color-focus)!important;
	color: var(--color-white)!important;
	z-index: 2;
	outline: none!important;
	height: var(--header-height);
	text-align: center;
	line-height: 4;
}
/* --- Impreza-Standard --- */
a:focus-visible, button:focus-visible, input[type=checkbox]:focus-visible + i, input[type=checkbox]:focus-visible + .w-color-switch-box, input[type=submit]:focus-visible {
  outline: 2px solid var(--color-focus)!important; 
/*ggf. "solid" austauschen mit "dotted"*/
}
/* --- Grids/Raster & Karussell --- */
/* Variante 1: Funktioniert nur wenn im Raster-Element der Link überschrieben wurde */
article .w-grid-item-h:focus-within  {
  border: var(--border) solid var(--color-focus)!important;
  outline-offset: 4px!important;
}

/* --- Dots & Arrows --- */

/* --- Links --- */
p > a:focus {
  outline: 1px solid var(--color-focus)!important;
outline-offset: 2px!important;
  color: var(--color-focus);
}

/* --- Button (a) --- */
.w-btn:focus-visible  {
  outline: 2px solid var(--color-focus)!important;
/*background: var(--color-focus)!important;
  color: var(--color-white)!important;*/
}

/* --- Formulare --- */
form input:focus-visible {
  outline: 2px solid var(--color-focus-2)!important;
}
form button:focus-visible {
  outline: 2px solid var(--color-focus-2)!important;
}