smn.content.full .boxline .box:first-child, .boxr:first-child, .content .col.full .boxline  {
    margin: 0px 0px 1em;
}
/*Änderungen CLS Wert optimieren START*/
@media (min-width: 992px) { /* Nur für Desktop */
    .header-wrapper-fix {
        min-height: 130px; /* Die Summe aller Höhen deiner Header-Leisten */
        display: block;
        width: 100%;
    }
}

.contact-video-wrap {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 9999;
}

#carouselExampleIndicators .carousel-inner{
  height: 310px;     /* entspricht euren Bildern */
}
#carouselExampleIndicators img{
  height: 310px;
  object-fit: cover;
}
/*Änderungen CLS Wert optimieren ENDE*/

.card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.25rem;
	/*background-color: var(--lightdark-gray-color);*/
	border-bottom-left-radius: calc(.4rem - 1px);
	border-bottom-right-radius: calc(.4rem - 1px);
}

.card-img, .card-img-top {
    border-top-left-radius: calc(.4rem - 1px);
    border-top-right-radius: calc(.4rem - 1px);
}

.card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,0.125);
    border-radius: .4rem;
}

.card .card-title {
	color: white;
	font-size: 15px;
}

.card .card-title.second {
	color: var(--main-color-1);
}

.card-header h3 {
    font-size: 1.1rem; /* Passt die Schriftgröße an, um sie kleiner als die Standard-h3 zu machen */
    font-weight: normal; /* Entfernt die Standard-Fettschrift für den Haupttext der Überschrift */
    margin: 0; /* Entfernt Standard-Ränder */
    color: #333; /* Eine dunklere Farbe für besseren Kontrast, anpassbar */
    padding: 0;
}

.shadow {
    box-shadow: 0 0 1rem rgba(0,0,0,0.15) !important;
}

.link-text,
.link-text a,
.link-text a:hover {
	text-decoration: none;
}

/** basic.css Start **/

div.wolke {
	margin-top:20px;
	margin-bottom:20px;
}

a.top:link,a.top:active,a.top:visited {
	font-weight:bold;
	font-size: 12px;
	color:#BF9782;
	text-decoration:none;
	}

.box {
	
	position: relative;
	background-color: #FFF;
/*	margin: 0px 3.4em 1.5em 0px;*/
	box-shadow: 0.1428em 0.1428em 0.2142em rgba(112, 112, 112, 0.3);
	-webkit-box-shadow: 0.1428em 0.1428em 0.2142em rgba(112, 112, 112, 0.3);
	padding-left:-15px;
	padding-rigth:-15px;
	margin-bottom:5px;
}

#custom-search-input button:hover {
    border: 0;
    box-shadow: none;
    border-left: solid 1px #ccc;
}

/* BEGIN Filter */

.filter_menu.borderfilter{
	padding-bottom: 15px;
	border-bottom: 1px solid #ccc;
	margin-bottom: 20px;
}

#Filter.btn-primary {
	background-color: #e7e7e7;
	border: 1px solid #ccc;
	color: #333;
}

	#Filter.btn-primary:hover {
		background-color: #C41220;
		color: #fff;
		border-color: #a00a16;
	}

/* END Filter */

.contact-video {
    background-color: var(--main-color-1);
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    -webkit-border-bottom-left-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    -moz-border-bottom-right-radius: 2px;
    -moz-border-bottom-left-radius: 2px;
    border-color: #ffffff;
    border: 1px solid;
    color: #ffffff;
    cursor: pointer;
    font-weight: 700;
    float: right;
    margin: 0px;
    top: 260px;
    right: -21px;
    width: 120px;
    padding: 12px;
    position: fixed;
    z-index: 400;
    transform: rotate(90deg);
	text-align: center; 
}

.btn-primary:hover {
	background-color: #a00a16;
	border-color: #a00a16;
}

.sub_nav {
	border-color: black;
	border: 0.5px solid #d8d8d8;
}

.sub_nav a {
	color: #777;
}

.sub_nav a:hover {
	color: #C3071E;
}

.sub-nav-md {
	margin: 0 auto;
}

.nav-li {
/*	margin: 10px 0px;  */
}

.nav-li a {
	color: #000;
}

.nav-li a.mappenshop,
.text-sub-nav.mappenshop {
	color: gray;
}

.text-sub-nav.mappenshop {
	font-size: 13px;
}

.sub-nav-headline {
	margin: 0px;
	color: var(--a-allgemein);
}

/** li.css START **/

/** Abstandhalter Container **/

.container-standard {
	padding: 20px;
}

.container-big {
	padding: 30px;
}

.container-balken-standard {
	padding: 30px;
}

.container-ids-standard {
	margin: 10px 0px;
}

.text-headline-ab-standard,
.text-container-ab-standard {
	margin: 50px 0px;
}

.text-ab-standard {
	margin: 20px 0px;
}

/** Abstandhalter Container **/

/** IDS Bilder **/

.transparent {
	mix-blend-mode: multiply;
}

.img-fluid.transparent {
	mix-blend-mode: multiply;
}

.bg-white {
	background-color: white;
	height: auto;
	width: 100%;
}

.bg-white.ids-img {
	margin-right: 0px;
}

.ids-text {
	padding-left: 20px !important;
	display: flex;
  	flex-direction: column;
 	justify-content: space-between; /* Verteilt den Platz gleichmäßig */
 	height: 100%; /* Füllt die Höhe des Containers aus */
}

.ids-text ul {
	margin-top: 0.5rem; /* Etwas Abstand unter der Liste */
	margin-bottom: 0.9rem; /* Etwas Abstand unter der Liste */
  flex-grow: 1; /* Lässt die Liste wachsen, um Platz zu füllen */
}

.ids-img {
  position: relative; /* Notwendig für absolute Positionierung des Small-Elements */
}

.imagehinweis {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.8); /* Optional: Hintergrund für bessere Lesbarkeit */
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
}


a.foolink
{
	color:#000000;
	font-size:14px;
}

.footer2
{
	bottom: 0pt;
	color: #fff;
	font-weight:300;
	min-height: 50px;
	padding: 12px 0px 12px 0px;
	text-align:center;
	vertical-align: middle;
	z-index: 102;
}

	.footer2 .text {
		font-size: 14px;
	}

		.footer2 .text.phone {
			font-size: 17px;
		}

.parallax {
  /* The image used */
  background-image: url('/content/imgs/kartothek/website_kartothek-mailing-landingpage_background.jpg');

  /* Full height */
  height: 100%; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Turn off parallax scrolling for tablets and phones. Increase the pixels if needed */
@media only screen and (max-device-width: 1366px) {
  .parallax {
    background-attachment: scroll;
  }
}

/** li.css END **/

.text-sm {
	font-size: 0.9em;
}

.contentteaser {
	display: table-cell;
	padding: 0px;
	padding-bottom: 3px;
	padding-top: 14px;
	position: absolute;
	bottom: 0px;
	text-align: center;
	width: 100%;
	font-size: 21px;
	height: 65px;
	line-height: 24px;
	text-transform: uppercase;
	background-color: var(--main-color-1);
	color: white;
	border-bottom-left-radius: calc(.4rem - 1px);
	border-bottom-right-radius: calc(.4rem - 1px);
}

/*@font-face {
	font-family:'Glyphicons Halflings';
	src:url(fonts/ghr/glyphicons-halflings-regular.eot);
	src:url(fonts/ghr/glyphicons-halflings-regular.eot?#iefix) format('embedded-opentype'),url(fonts/ghr/glyphicons-halflings-regular.woff) format('woff'),url(fonts/ghr/glyphicons-halflings-regular.ttf) format('truetype'),url(fonts/ghr/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format('svg');
	font-display: swap;
  size-adjust: 100%;
  ascent-override: 90%;
  descent-override: 22%;
  line-gap-override: 0%;
}*/

.glyphicon {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.glyphicon-search:before {
  content: "\e003";
}
.glyphicon-user:before {
  content: "\e008";
}
.glyphicon-ok:before {
  content: "\e013";
}
.glyphicon-menu-right:before {
  content: "\e258";
}




.img-rounded {
	border-radius: 6px;
}

/* BEGIN Suchfeld */

#custom-search-input{
    padding: 3px;
    border: solid 1px #E4E4E4;
    border-radius: 6px;
    background-color: #fff;
}

#custom-search-input input{
    border: 0;
    box-shadow: none;
}

#custom-search-input button {
    margin: 0 0 0 0;
    background: none;
    box-shadow: none;
    border: 0;
    color: #666666;
    padding: 0 8px 0 10px;
    border-left: solid 1px #ccc;
	border-radius: 0px;
}

#custom-search-input .glyphicon-search{
    font-size: 21px;
}

#custom-search-input .input-group-btn {
	display: block;
}

/* END Suchfeld */

/* BEGIN Login */

.btn-primary {
	border-color: #a00a16;
}

/* END Login */

/* BEGIN Navi */

.navbar-nav > li > a {
	line-height: 1.42857143;
}

.glyphicon.angepasst {
	margin-right: 5px;
}

.nav-figure {
  margin: 0;
}

.nav-img {
  width: 184px;
  height: 150px;
  object-fit: cover;
  display: block;
  transition: transform 0.2s ease;
  border-radius: 4px; /* optional, für weicheres Design */
}

.link_box:hover .nav-img {
  transform: scale(1.05);
}

.text-sub-nav {
  text-align: center;
  margin-top: 8px;
  font-size: 0.95rem;
  color: #333;
}

.box-4-raster-box.nav {
  text-align: center;
}

/* verhindert Layout-Sprünge (CLS) */
.nav-img {
  aspect-ratio: 184 / 150;
}

/* Container wie die alten Kacheln: 184 × 150, zentriert */
.nav-figure { display:flex; justify-content:center; }
.nav-thumb {
  width:184px; height:150px;
  display:block; margin:0 auto;
  background:#fff;        /* falls gewünscht */
  overflow:hidden;        /* falls das Bild größer sein sollte */
  position:relative;
}

/* Bild im Container: 90 % Breite, volle Höhe, ohne Beschnitt */
.nav-thumb-img {
  width:90%;
  height:100%;
  object-fit:contain;     /* skaliert vollständig, kein Crop */
  display:block;
  margin:0 auto;
}

/* Überschreibt globale Regel wie img[loading="lazy"] { width:100% } */
figure.nav-figure img[loading="lazy"] {
  width:90% !important;
  height:100%;
}


.text-sub-nav {
	font-size: 15px;
}

.zoomnavimage {
	padding: 50px;
	transition: transform .2s;
	width: 200px;
	height: 200px;
	margin: 0 auto;
	background-color: white;
	}

.zoomnavimage:hover,
.zoomnavimage:focus {
	-ms-transform: scale(1.1); /* IE  */
	-webkit-transform: scle(1.1); /* Safari */
	transform: scale(1.1); 
	background-color: white;
}

/* END Navi */

/* BEGIN Allgemein */
a {
	color: var(--a-allgemein);
}

a:hover {
	color: var(--main-color-1);
}

h2 {
	color: var(--main-color-2);
}

small.smaller {
	font-size: 12pt;
}

.text-responsive {
  font-size: calc(100% + 1vw + 1vh);
}

.ids-text-id {
	font-size: 0.7em;
	color: var(--light-gray-color);
}

.verwandte-produkte h1,
.verwandte-produkte h2,
.verwandte-produkte h3,
.verwandte-produkte h4,
.verwandte-produkte h5 {
	font-size: 1em;
}

.btn-text-fit {
    /* Setzt das Padding oben/unten auf 1rem, links/rechts auf 0.75rem */
    padding: 1rem 0.75rem !important;
}


/* Lazy Load Images */
img[loading="lazy"] {
    display: block;
    width: 100%;
    height: auto;
}


a.box-verlinkung:hover {
	text-decoration: none;
}

a.box-verlinkung:hover p,
a.box-verlinkung p{
	color: black;
	font-size: 0.9em;
}

.zNavi-bg a {
	color: var(--main-color-1);
}

.baukasten h2 {
	word-wrap: break-word;
}

hr.anfrage-trennstrich {
	width: 100%;
	border-color: #ccc;
}

.product-features.galerie a {
	color: var(--secondary-color);
}

.product-features.galerie a:hover {
	color: var(--secondary-color-hover);
}

.product-features .btn {
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
}

.seo-headline h1,
.seo-headline h2 {
	font-size: 18px;
	color: black;
}

.seo-headline .panel-heading {
	background-color: #F0EFEF;
	padding: 20px;
	margin: 50px 0px 20px 0px;
}

.seo-headline.after .panel-heading {
	margin: 20px 0px 20px 0px;
}

.seo-headline .panel-body {
	padding-bottom: 20px;
	column-count: 2;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-width: 43%;
}

.seo-headline .panel-body.sm {
	padding-bottom: 20px;
}

.quick-info .items {
    display: flex;
    display: -ms-flexbox;
    flex: 1;
    -ms-flex: 1;
    flex-wrap: wrap;
    padding: 0 9px;
    width: 100%;
	list-style: none;
}

.quick-info .items .item {
	display: flex;
}

.bi-check:before {
	font-size: 30px;
}


h4.pop-up {
	font-size: 19px;
	margin: 0px !important;
}

.modal-dialog.special {
	max-width: 400px;
}

.container-all-ab-ids {
	margin: 10px 0px 20px 0px;
}

.container-all-ab-search {
	margin: 5px 0px 5px 0px;
}

.container-all-ab-small{
	margin: 5px 0px 10px 0px;
}

.container-search-titel {
	margin-bottom: 10px;
}

.container-all-ab {
	margin-top: 25px;
}

.container-all-ab.anfrage {
	margin-top: 25px;
	margin-bottom: 0px;
}

.container-all-ab .landing-streifen {
	margin: 30px 0px 50px 0px;
}

.landing-streifen.beratung {
	padding: 30px 0px;
}

.container-all-ab.taller {
	margin-top: 55px;
}

.container-all-ab.taller.bt {
	margin-bottom: 55px;
}

.container-all-ab.bt {
	margin-bottom: 20px;
}

.container-all-ab .absenden {
	margin-bottom: 60px;
	margin-top: 20px;
}

	.container-all-ab.more {
		margin-top: 50px;
	}

.container-ab-top-bottom {
	margin: 0px 0px 20px 0px;
}

.container-ab-top-bottom.more {
	margin: 0px 0px 30px 0px;
}

.container-form-ab {
	margin: 10px 0px 0px 0px;
	border-bottom: 2px solid var(--bg-anfrage);
	padding: 5px;
}

.container-form-ab-two {
	margin: 10px 0px 5px 0px;
	border-bottom: 2px solid var(--bg-anfrage);
}

.form-control.bottom-ab {
	margin-bottom: 10px;
}

.container-ab-top {
	margin-top: 10px;
}

.nav-li-icon a:link,.nav-li-icon a:visited {
	color: var(--main-color-bg-dark);
	text-decoration:none;
}

.nav-li-icon a:hover, .nav-li-icon a:focus {
	color: var(--main-color-bg-dark-hover);
	text-decoration: none;
}

.container-highlight {
	background-color: var(--light-main-color) !important;
}

#mappenSV,
#mappenAH,
#mappenFT,
#mappenVEL {
	display: none;
}

.box {
	border: 1px solid #dfdfdf;
	box-shadow: none;
	border-radius: 6px;
	margin: 15px 0px;
}

.fadeInOnTouch { opacity: 1}

.box_all {
	margin-top: 15px;
}

.box_start {
	margin-top: 15px;
	margin-bottom: 15px;
}

.box.start ul {
	margin: 10px;
}

.banner_all_start {
	margin-top: 15px;
}

h2, .h2 {
	border-color: #ccc;
	border: 0;
}

.color_red_li {
	color: #C31924;
}

.btn-primary {
	background-color: #C31924;
}

.btn-primary:focus,
.btn-primary.focus {
  color: #fff;
  background-color: #590001;
  border-color: #590001;
}

.button_small a {
	color: #fff;
}

.button_small {
	font-size: 0.9em;
}

.button_small.btn-primary {
	background-color: #d26068;
}

.button_small.btn-primary:hover {
	background-color: #c0484f;
}

.boxen_right_content {
	padding: 15px;
	height: 70px;
}

.mitarbeiter-box {
	padding-top: 15px;
	width: auto; 
	height: auto;
}

.mitarbeiter-box .opentimes {
	display: inline-block;
	vertical-align: top;
	font-size: 0.83em;
}

.mitarbeiter-box .info-box {
	font-size: 1em;
	padding-bottom: 15px;
}

.mitarbeiter-box .info-box .number_text {
	background-color: #C31924;
	color: white;
	line-height: 35px;
	padding: 5px;
}

.mitarbeiter-box .info-box .number_text a {
	color: #fff;
}

.mitarbeiter-box .pic_person {
	display: inline-block;
}

.mitarbeiter-box .abstandkleinmini {
	position: relative;
}

.mitarbeiter-box .person_name {
	position: absolute;
	bottom: 9px;
	text-align: center;
	vertical-align: middle;
	width: 100%;
	font-size: 11px;
	text-transform: uppercase;
}

.desktop_breadcrumb {
	margin-bottom: 10px; 
	margin-top: 5px;
}

.mobile_breadcrumb {
	width: auto;
	margin-bottom: 5px;
	margin-top: 0px;
}

.breadcrumb_bg { 
	display: inline-block;
}

	.breadcrumb_bg.all a {
		color: #666666; 
	}

	.breadcrumb_bg.all a:hover {
		color: #C41220; 
	}

	.breadcrumb_bg.select {
		color: #C41220; 
		font-size: 14px;
	}

.tcenter {
	text-align: center;
}

.ver-mid {
	position: relative;
	top: 23%;
	-webkit-transform: translateY(23%);
	-ms-transform: translateY(23%);
	transform: translateY(23%);
}

.box-index-text {
	font-size:0.80em;
}

.danke-bestaetigung {
	margin: 30px 0px;
}

.link-hover-box-bg a:hover {
	text-decoration: none;
}

.link-hover-box-bg a {
	color: black;
}

/* END Allgemein */

/* BEGIN FORUMLAR */

label h5 {
	margin: 0px;
}

#anfrage h4 {
	color: var(--main-color-1);
}

#anfrage h5 {
	font-weight: bold;
}

#anfrage .form-check-inline {
	margin-right: 0px;
}

.higlight {
	color: var(--main-color-1);
}

.panel-heading {
  position: relative;
}
.panel-heading[data-toggle="collapse"]:after {
  font-family: 'Glyphicons Halflings';
  content: "\e072"; /* "play" icon */
  position: absolute;
  color: #b0c5d8;
  font-size: 18px;
  line-height: 22px;
  right: 20px;
  top: calc(50% - 10px);

  /* rotate "play" icon from > (right arrow) to down arrow */
  -webkit-transform: rotate(-90deg);
  -moz-transform:    rotate(-90deg);
  -ms-transform:     rotate(-90deg);
  -o-transform:      rotate(-90deg);
  transform:         rotate(-90deg);
}
.panel-heading[data-toggle="collapse"].collapsed:after {
  /* rotate "play" icon from > (right arrow) to ^ (up arrow) */
  -webkit-transform: rotate(90deg);
  -moz-transform:    rotate(90deg);
  -ms-transform:     rotate(90deg);
  -o-transform:      rotate(90deg);
  transform:         rotate(90deg);
}


.list-group-item.anfrage {
	background-color: #F0EFEF !important;
	border: none;
	padding: 0px 15px;
}

.btn.specialhilfe {
	padding: 0px;
	background-color: var(--main-color-1);
	border-color: var(--main-color-2);
}

.modal-dialog.erklaerung {
	max-width: 500px;
}

.descriptions.formular {
    cursor: pointer;
    color: var(--main-color-1);
	background-color: transparent;
	border-radius: 13px;
	padding: 1px 7px;
	border-color: var(--main-color-1);
	border: 2px solid;
	font-size: 14px;
	margin-left: 10px;
	margin-bottom: .5rem;
	line-height: 1.2;
	position: absolute;
}

.descriptions.allgemein {
	cursor: pointer;
    color: var(--main-color-1);
	background-color: transparent;
	border-radius: 13px;
	padding: 1px 7px;
	border-color: var(--main-color-1);
	border: 2px solid;
	font-size: 14px;
	margin-left: 10px;
	margin-bottom: .5rem;
	line-height: 1.2;
}

.cardflex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

@media (max-width: 576px) {
  .headline-collapse {
    font-size: 0.85em;
  }
}

.form-group.nmbottom {
	margin-bottom: 0px;
}

/* END FORMULAR */

/* BEGIN Content left */

	.aktuelles_box h5 {
		color: #C31924;
	}

.text_news {
	font-size: 0.9em;
}

.text_news.link:hover {
	color: var(--main-color-1);
	cursor: pointer;
	text-decoration: underline;
}

.text_news.link {
	color: var(--a-allgemein);
	cursor: pointer;
}

/* END Content left */

/* BEGIN Marken Landingpage */

/* Link soll neben dem Text stehen und nicht abgeschnitten werden */
.teaser-text {
  display: inline;                /* oder inline-block – je nach Bedarf */
  white-space: normal !important; /* nicht einzeilig */
  overflow: visible !important;   /* nichts abschneiden */
  text-overflow: clip !important; /* keine CSS-Ellipsis */
}

.read-more-link {
  margin-left: .25rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.read-more-link:hover { text-decoration: underline; }


.btn.btn-primary.lp {
	width: 100%;
	line-height: 1em;
}

@media (min-width: 992px) {
.product-landing.mh button {
	font-size: 1.5em;
}
	
.product-landing button {
	font-size: 1em;
}
}

@media (max-width: 576px) {
  .product-landing.mh button {
    font-size: 0.8em;
  }
	h2.font-size {
		word-wrap: break-word;
	}
	
	h1 {
		font-size: 1.8em;
		word-wrap: break-word;
	}
	
	h2 {
		font-size: 1.5em;
		word-wrap: break-word;
	}
}

.box-4-raster-box.marken h3.headline,
.box-4-raster-box.marken h5.headline{
	border-bottom: 1px solid #ccc;
}

.box-4-raster-box.marken h5.headline.top {
	margin-top: 25px;
}

.box-4-raster-box.marken {
	text-align: left;
	padding: 12px;
}

.box-4-raster-box.marken:hover {
	border: none;
}

.marken-landing h2, h1 {
	color: var(--main-color-1);
}

.box-info-big {
	min-height: 180px;
}

.box-info-big h4 {
	margin: 0px;
}

.preis {
	font-size: 1.4em;
	font-weight: bold;
	background-color: var(--main-color-price-bg);
	color: white;
	border-radius: 6px;
	padding: 6px;
}

.box-land {
	min-height: 110px;
}

.box-land h4 {
	color: var(--main-color-1);
}

.box-land.mh h4,
.box-land.mh .highlight,
.box-land.mh a {
	color: var(--cta-color);
}

.text-small-subheadline {
	font-size: 25px;
	margin-bottom: 40px;
	font-weight: 300;
	line-height: 1.2;
}

.caption-box {
	background-color: #f2f2f2;
	padding: 22px 15px 20px;
	width: 100%;
	min-height: 215px;
	font-size: 14px;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
}

.caption-box h4 {
	color: var(--main-color-1);
	margin-bottom: 25px;
}

.caption-box.product-detail {
	background-color: var(--main-color-light);
	color: var(--dark-gray-color);
}

.note-product {
	margin-top: 10px;
}

.zfcontainer h4 {
	font-size: 1.2em;
}

.lb .caption-box {
	min-height: 100px;
}

.lb .product-features .caption-box {
	min-height: 100px;
}


.product-features .caption-box {
	min-height: 330px;
}

.product-features.firmenordner .caption-box {
	min-height: 240px;
}

.caption-box.small {
	min-height: 125px;
}

.product-features .buttons {
	margin-top: 20px;
}

.product-features .buttons.bt {
	margin:0px 0px 10px 0px;
}

.product-features .buttons button {
	font-size: 0.9em;
}

.product-features a.link_box:hover {
	text-decoration: none;
}

.tall-letters {
	text-transform: uppercase;
	font-size: 1.6em;
}

.product-landing.mh .tall-letters {
	font-size: 1.3em;
	color: var(--cta-color);
	text-transform: lowercase;
}


.product-landing.mh a {
	text-decoration: none;
}

.product-landing.mh p.sml {
	margin-bottom: 0px;
}


/* END Marken Landingpage */

/* BEGIN Landingpage Mailing 2020 */
ul .text-left {
	text-align: left;
}

.content-info-margin li {
	background-color: #f5f5f5;
    padding: 4px;
    margin: 0px 0 2px 0;
    display: block;
}

.product-landing.muna .list-unstyled li {
	line-height: 30px;
}

.ld-b-font {
	color: var(--a-allgemein) !important;
	cursor: pointer;
}

/* END Landingpage Mailing 2020 */




/* BEGIN Slider Logos */

.slick-slide {
    margin: 0px 20px;
}

.slick-slide img {
    width: 100%;
}

.slick-slider
{
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
            user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;
    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;
    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;
    min-height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;
    height: auto;
    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

.slick-dots
{
    position: absolute;
    bottom: -25px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 22px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}


/* END Slider Logos */

/* BEGIN Kategorien IDS */

.box-ids {
	background-color: #F8F8F8;
	border: 1px solid #F8F8F8;
	text-align: center;
	margin-top: 15px;
	padding-bottom: 10px;
	font-size: 0.8em;
}

.box-ids.standard {
	padding: 10px;
}

	.box-ids .box_text_ids {
		line-height: 35px;
		vertical-align: middle;
	}

	.box-ids .box_text_ids.extra {
		line-height: normal;
		min-height: 35px; 
	}

.box_text_ids.standard {
	font-size: 1.5em;
	border: 1px solid;
	border-color: var(--main-color-1);
	border-radius: 10px;
	padding: 5px;
}

.box_text_ids.standard:hover,
.box_text_ids.standard:active {
	background-color: var(--main-color-1);
	color: white;
}

.box-ids:hover {
	background-color: #e7e7e7;
}

/* END Kategorien IDS */

/* BEGIN Mappenliste */

.mappenliste_mobile {
	margin-bottom: 10px; 
	font-size: 11px; 
	padding-left: 0px;
}

.mappenliste_desk {
	width: 100%; 
	margin-bottom: 10px; 
	font-size: 12px;
}

.mappen_box_info,
.ordner_box_info {
	background-color: var(--lightdark-gray-color); 
	padding-top: 5px; 
	padding-bottom: 5px;
}

.ordner_box_info {
	color: white;
}

	.mappen_box_info .text_title {
		font-size:14px;
	}

	.mappen_box_info .text_format {
		font-size: 16px; 
		text-align: right;
	}

.mappen_box_content,
.ordner_box_content {
	background-color: #eee; 
	min-height: 190px; 
	padding-bottom: 10px;
}

.ordner_box_content {
	margin-bottom: 10px;
}

.zoom_mappen {
	width: 20px; 
	height: 18px; 
	border: 0px;
}

.produkt_bilder_mappen {
	width: 180px; 
	height: 30px; 
	margin-bottom: 5px; 
	margin-top: 5px;
}

.produkt_bilder_mappen .box {
	width: 33px; 
	height: 33px; 
	float: left; 
	margin-left: 2px;
}

.text_content_mappen {
	padding: 13px 0px 0px 12px;
}

.text_content_mappen .info_text {
	padding: 0px 0px 0px 0px; 
}

.text_content_mappen .details {
	margin-top: 10px;
}

.button_mappen_box {
	margin-top: 3px; 
	text-align: right;
}

.mappen_box_zubehoer {
	background-color: #eee; 
	padding-top: 5px; 
	padding-bottom: 10px; 
	border-top: 1px solid #ccc;
}

/* END Mappenliste */

/* BEGIN Zubehoer */

.zubehoer_box_info {
	font-weight: bold;
	font-size: 13px;
	color: #C31924;
	padding: 7px 0px;
}

.zubehoer_box_info.ange {
	font-size: 17px;
}

.zubehoer_box_content {
	padding-bottom: 10px;
}

	.zubehoer_box_content img,
	.zubehoer_box_content .text{
		margin-bottom: 10px;
		width: 100%;
	}

	.zubehoer_box_content img {
		width: 100%;
	}

.zubehoer-box {
	margin: 15px 0px;
	border-bottom: 1px solid #ccc;
	padding: 10px 0px;
}

.artkl-nr {
	color:#a2a2a2;
	font-size: 12px;
}

.carousel-control {
	width: 13px;
}

a.carousel-control {
	color: #bfbfbf;
	text-shadow: none;
}

.zubehoer h4 {
	font-size: 1.3em;
}

/* END Zubehoer */

/* BEGIN Werbung */

.werbung .image_werbung {
	width: 100%;
	margin-bottom: 15px;
}

.werbung .werbung_congtainer_box {
	margin-bottom: 0px;
	margin-top: 50px;
}

/* END Werbung */

/* BEGIN Footer */

menufooter .row .row {
	margin: 0 auto;
}

.content.row.second {
	margin: 15px 0px;
}

.content.row.second.all {
	padding-bottom: 50px;
}

	.row.second-footer {
		border-top: 1px solid #e2e2e2;
	}

	menufooter .row .row {
	}

		menufooter .row .row .menuline,
		.second-footer .col-footer li{
			list-style: none
		}

		.container-links {
			margin: 10px 0px;
		}

			menufooter .row .row .container-links {
				min-height: 150px;
			}

			menufooter .row .row .container-links .link-icon {
				font-size: 11px;
				padding: 0px 5px 0px 0px;
			}

	menufooter .row .footer_adress a,
	menufooter .row .footer_adress {
		color: #333;
	}

	menufooter .row .footer_adress {
		padding: 15px 0px;
		border-top: 1px solid #e2e2e2;
		margin-top:  10px;
	}

.text_align_footer {
	
}

.text.phone,
.text.phone a{
	color: var(--main-text-color-bg);
}

.carousel-item.big {
  height: 40vh;
  min-height: 150px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.carousel-caption.big {
	bottom: 50px;
}

.carousel-caption.big.first {
	bottom: 80px;
}

.carousel-caption.big.mobile {
	left: 0px;
}


.carousel-caption.big p {
	width: 100%;
}

/* END Footer */

/* BGEIN Ideenschmiede 9er Raster */

.border-raster-neun {
	border: 1px solid #ccc;
	opacity: 0.8;
	padding: 5px;
	margin: 0px 5px 0px 5px;
}

/* END 9er Raster */

/* BEGIN Mappenhaus Präsentationsmappe */

.box_praesi h2 {
	margin-top: 0px;
}

.vorteile {
	margin-top: 15px;
}

.vorteile.pos h3 {
	color: var(--positiv-color);
}

.vorteile.neg h3 {
	color: var(--negativ-color);
}

details.vorteile {
	background-color: #f8f8f8;
	padding: 10px;
}

summary:after {
	content: "+";
	float: right;
	font-size: 28px;
	margin-right: 5px;
	line-height: 18px;
}

details[open] summary:after,
.toggleBox .close_toogle:after{
  content: "-";
}

.vorteile_auflistung {
	margin-top: 15px;
}

.toggleBox {
    position: relative;
    border-bottom: 1px solid #ddd;
	margin-top: 15px;
	margin-bottom: 10px;
}

.toggleBox .open:after{
	content: "+";
	float: right;
	font-size: 28px;
	margin-right: 5px;
	line-height: 18px;
}

.toggleBox .close_toogle:after{
	float: right;
	font-size: 38px;
	line-height: 18px;
}
 
/* Ausblenden des input-Feldes */
.toggleBox input{
    position: absolute;
    left: -99999px;
}
 
/* Gestaltung der labels */
.toggleBox label {
    display: block;
    background: #f8f8f8;
	font-weight: normal;
	margin-bottom: 0px;
    padding: 8px;
    text-align: left;
    cursor: pointer;
}
 
.toggleBox label:hover {
    background: #ddd;
}
 
/* Der Aufklappmechanismus */
.toggleBox input:not(:checked) ~ div {
    opacity: 0;
    height: 0;
}
 
.toggleBox input:checked ~ div {
    opacity: 1;
    padding: .8em;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}
 
/* Steuerung der Sichtbarkeit der labels */
.toggleBox input:not(:checked) ~ .close_toogle,
.toggleBox input:checked ~ .open
{
    display: none;
}

/* END Mappenhaus Präsentationsmappe */

/* BEGIN Landingpages */

.landing_headl {
	padding: 0px;
	border: 0px;
	margin: 0px;
	font-size: 19px;
	word-wrap: break-word;
	white-space: normal;
}

	.landing_headl.mappenfamilie {
		font-size: 17px;
	}

.landing_first {
	text-align: center;
}

.landing_first .headline_first,
.landing_first .teaser_first{
	float: none; 
	margin: 0 auto;
}

.teaser_first button,
button.landing {
	margin-top: 10px;
}

button.green {
	background-color: #01a20d; 
	border-color: #007e09;
}

button.green:hover {
	background-color: green; 
	border-color: darkgreen;
}

.container_boxen_lp {
	margin-top: 30px;
}

.container_boxen_lp_beratung {
	margin-top: 45px;
}

.lpginfotextr{
	margin: 0px;
	float:right;
	width:45%;
	/*background-color:##F1D1D1;*/
	position:absolute;
	top:15px;
	left:48%;
	padding:10px;
	
}

@media (max-width: 1199px) {
.lpginfotextl{
	visibility: hidden;}
}
@media (min-width: 1200px) {
  .lpginfotextl{
	position: absolute;
	top: 120px;
	padding: 10px;
	margin-left:9px;
}
}

.produkt_container_lp {
	margin-top: 25px;
}

	.produkt_container_lp .container_bg {
		background-color: #ededed;
		padding: 10px;
		min-height: 220px;
	}

	.produkt_container_lp .teaser_bg {
		float: none;
		margin: 0 auto;
	}

	.produkt_container_lp .headline {
		font-size: 14px;
		min-height: 50px;
	}

		.produkt_container_lp .headline.mappen {
			min-height: 40px;
		}

.lb h3 {
	color: var(--main-color-bg-dark-hover);
}

.zNavi-bg {
	background-color: var(--bg-containers);
	height: auto;
	width: 100%;
}

.navbar-znavi {
	height: 50px;
	line-height: 50px;
	text-align: center;
	cursor: pointer;
}

.bg-w-100-color {
	background-color:  var(--main-color-1);
}

.bg-w-100-color-2 {
	background-color:  var(--bg-containers);
	border-top: 3px solid var(--main-color-1);
}

.bg-w-100-color-li {
	background-color:  var(--main-color-bg-dark);
	border-top: 3px solid var(--main-color-1);
}

.bg-w-100-color.pd {
	padding: 15px;
}

.bg-w-100-color h2, .bg-w-100-color p {
	color: white;
}

.footer-fix-landing {
	padding: 5px;
}

.footer-fix-landing .font-size {
	font-size: 0.98em;
}

.landing-faq .panel-heading {
	background-color: #F0EFEF;
	padding: 20px;
	margin: 10px 0px 20px 0px;
}

.landing-faq.after .panel-heading {
	margin: 20px 0px 20px 0px;
}

.landing-faq h1,
.landing-faq h2 {
	font-size: 18px;
	color: black;
}

.icon-footer-fix {
	width: 50px;
	height: 50px;
	background-color: var(--main-color-1);
	border-radius: 25px;
}

.descriptions li p {
	display: none;
	position: absolute;
    left: -150px;
    top: -130px;
    width: auto;
	text-align: center;
    display: inline;
    opacity: 0;
	font-size: 1em;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.8s ease-in;
    background: var(--main-color-2);
    padding: 30px;
    color: white;
    line-height: 1.7;
    z-index: 100;
    border: 1px solid var(--main-color-1);
}

.descriptions.right li p {
	z-index: 102;
	left: -10px;
	top: 0px;
}

.description li p h4 {
	font-size: 20px;
	opacity: 0;
}

.descriptions {
	list-style: none;
}

.headline-description {
	font-size: 25px;
}

ul.descriptions h2 {
    cursor: pointer;
    color: white;
    -webkit-transition: all 0.15s ease-in;
    -moz-transition: all 0.15s ease-in;
    -o-transition: all 0.15s ease-in;
    transition: all 0.15s ease-in;
    font-size: 20px;
    position: relative;
    z-index: 101;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
	background-color: var(--main-color-1);
	border-radius: 45px;
	height: 45px;
	width: 45px;
	line-height: 10px;
	padding: 15px;
	font-size: 25px;
	border-color: white;
	border: solid;
	box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.2);
}

ul.descriptions h2.vordergrund {
	z-index: 103;
}

ul.descriptions h2:hover {
    background-color: var(--main-color-2);
}

ul.descriptions h2:hover+p {
    visibility: visible;
    opacity: 1;
    left: -180px;
}

.kantenschoner-description,
.ringloch-description{
	position: absolute;
}

.kantenschoner-description {
	top: 75%;
	left: 60%;
}

.griffloch-description {
	top: 65%;
	left: 20%;
}

.radooesen-description {
	top: 27%;
	left: 33%;
}

.reuckentasche-description {
	top: 25%;
	left: 20%;
}

.dreiecksfolie-description {
	top: 60%;
	left: 15%;
}

.Mechanik-description {
	top: 40%;
	left: 55%;
}

.list-unstyled.landing {
	line-height: 28px;
}

.kreis-nr {
	background-color: var(--main-color-1);
	width: 15px;
	height: 15px;
	border-radius: 15px;
	line-height: 10px;
	padding: 8px;
	font-size: 14px;
	color: white;
}

.content-landing-aufzaehlung h4 {
	margin-bottom: 0px;
}

.content-landing-aufzaehlung .ab {
	
}

.footer-fix-landing .align-middle {
	text-align: right;
}

.bg-highlight {
	background-color: var(--main-color-1); 
	padding: 12px; 
	position: absolute; 
	border-radius: 20px; 
	color: white;
}

	.bg-highlight.right {
		right: 0;
	}

.ideens-button-hover {
	margin-top: 10px;
}

.btn-primary.versionzwei {
	background-color: var(--positiv-color);
	border-color: var(--positiv-darker-color);
}

.btn-primary.versionzwei:hover {
	background-color: var(--positiv-darker-color);
	border-color: var(--positiv-color);
}

#buttontest {
  display: inline-block;
  background-color: #FF9800;
  width: 50px;
  height: 50px;
  text-align: center;
  border-radius: 4px;
  margin: 30px;
  position: fixed;
  bottom: 80px;
  right: 30px;
  transition: background-color .3s;
  z-index: 1000;
	transition: background-color .3s, 
 opacity .5s, visibility .5s;
  visibility: hidden;
}
#buttontest:hover {
  cursor: pointer;
  background-color: #333;
}
#buttontest:active {
  background-color: #555;
}

#buttontest::after {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 2em;
  line-height: 50px;
  color: #fff;
}

#buttontest.show {
  opacity: 1;
  visibility: visible;
}

.produkt-info {
	margin-top: 10px;
}

.produkt-info .text {
	margin-top: 10px;
}

.check-icon::before {
	display: inline-block;
	content: url(/content/imgs/SVG/check2.svg) " " attr(href) " ";	
	color: var(--main-color-1);
	transform: scale(2.25);
    position: absolute;
    left: 20px;
	padding: 7px 0px 0px 0px;
}

.check-icon.header::before {
	padding: 3px 0px 0px 0px;
	transform: scale(1.25);
    position: absolute;
}

.check-icon.smallmodul::before {
	transform: scale(1.55);
    left: 25px;
	padding: 4px 0px 0px 0px;
}

.check-icon.smallmodul span,
.richtext-content span {
	font-family: 'Ubuntu', Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
	font-size: 0.8em !important;
}

.ab {
	margin-bottom: 10px;
}

.richtext-content.largetext span {
	font-size: 1.0em !important;
}

.richtext-content.largetext.bullet ul {
	margin-top: 20px; 
}

ul.check-icon-ul {
	list-style: none;
}

ul.check-icon-ul.header {
	margin-bottom: 0px;
}


.ab-standard-auflistung:first-child {
	margin-top: 30px;
}

.ab-standard-auflistung:last-child {
	margin-bottom: 30px;
}

.ab-standard-auflistung {
	margin-bottom: 30px;
}

.hinweis-container-small {
	border:1px solid var(--lightdark-gray-color);
	padding: 8px;
	position: absolute;
	display: inline-block;
	font-size: 0.8em;
	cursor: pointer;
}

.hinweis-container-small.iconsvg {
	padding-left: 60px;
	bottom: 50px;
	right: 0px;
}

.imagehinweis.iconsvg {
	padding-left: 30px;
	bottom: 5px;
}

a .hinweis-container-small,
a .imagehinweis.iconsvg,
a .imagekontakt.iconsvg {
	color: black;
}

/* Text + Icon nebeneinander */
.imagekontakt.iconsvg,
.imagesearch.iconsvg {
  display: inline-flex;
  align-items: center;
  gap: 6px;                 /* Abstand zwischen Icon und Text */
  color: black;
}

/* SVG-Icon links */
.imagekontakt.iconsvg::before{
  content: "";
  width: 16px;
  height: 16px;
	transform: scale(1.75);
  display: inline-block;
  background: url("/content/imgs/SVG/user-solid-full.svg") no-repeat center / contain;
}

/* SVG-Icon links */
.imagesearch.iconsvg::before{
  content: "";
  width: 16px;
  height: 16px;
	transform: scale(1.75);
  display: inline-block;
  background: url("/content/imgs/SVG/magnifying-glass-solid-full.svg") no-repeat center / contain;
}

.hinweis-container-small.iconsvg::before,
.imagehinweis.iconsvg::before {
	content: url(/content/imgs/SVG/card-image.svg) " " attr(href) " ";
}

.hinweis-container-small.iconsvg::before {
	transform: scale(2.75);
	left: 25px;
	padding: 8px 0px 0px 0px;
}

.imagehinweis.iconsvg::before,
.telephone.iconsvg::before,
.mailadress.iconsvg::before {
	transform: scale(1.15);
	left: 10px;
	padding: 5px 0px 0px 0px;
}

.telephone.iconsvg::before,
.mailadress.iconsvg::before {
	left: 25px;
}

.telephone a,
.mailadress a {
	color: black;
	text-decoration: underline;
}

.telephone::before {
	content: url(/content/imgs/SVG/telephone.svg) " " attr(href) " ";
}

.mailadress::before {
	content: url(/content/imgs/SVG/envelope-at.svg) " " attr(href) " ";
}

.standardicon::before {
	display: inline-block;
	position: absolute;
}

.more-products-icon {
	margin: 0px;
	cursor: pointer;
}

.more-products-icon img {
	cursor: pointer;
}

.ulliende ul {
	margin-bottom: 0px;
}

.container-min-standard {
	min-height: 100px;
}

/* Für Desktop-Ansichten (mittlere und größere Bildschirme) */
@media (min-width: 768px) {
  .made-in-germany-desktop {
    flex-shrink: 0;
    max-width: 80px; /* Anpassen nach Bedarf */
  }

  .made-in-germany-desktop img {
    max-width: 100%;
    height: auto;
  }

  .button-container {
    min-width: 200px; /* Diesen Wert anpassen! */
    padding-left: 1rem; /* Entspricht pl-md-2 */
  }
}

/* Für mobile Ansichten (kleinere Bildschirme) */
@media (max-width: 767px) {
  .made-in-germany-mobile {
    flex-shrink: 0;
    max-width: 60px; /* Behält den bisherigen Wert bei */
  }

  .made-in-germany-mobile img {
    max-width: 100%;
    height: auto;
  }

  .button-container {
	min-width: auto; /* Oder ggf. einen spezifischen Wert für Mobil */
    padding-left: 0.5rem; /* Ggf. angepasster Wert für mobil */
  }
}

/* Standardmäßig (Mobile zuerst) für diesen spezifischen Container */
.landingpage-button-container .col-12 > a.landingpage-button-link {
    display: block;
}

.landingpage-button-container .col-md-12 {
        display: flex;
        justify-content: center; /* Zentriert horizontale auf der Hauptachse */
        align-items: center; /* Optional: Zentriert vertikal auf der Kreuzachse */
    }

/* Für Desktop-Ansichten (mittlere und größere Bildschirme) für diesen spezifischen Container */
@media (min-width: 768px) {
    .landingpage-button-container .col-md-12 > a.landingpage-button-link {
        display: inline-block !important; /* !important zur Not, sollte aber vermieden werden */
        text-align: center;
    }
	
	.landingpage-button-container .col-md-12 {
        display: flex;
        justify-content: center; /* Zentriert horizontale auf der Hauptachse */
        align-items: center; /* Optional: Zentriert vertikal auf der Kreuzachse */
    }
}

.zoomnavimage {
    transition: transform .2s;
    background-repeat: no-repeat;
    background-position: center center;
}

/* Mobile Ansicht (Extra Small und Small) */
@media (max-width: 767.98px) {
    .zoomnavimage.mappen-navi,
    .zoomnavimage.mappen,
    .zoomnavimage.ordner-galerie,
    .zoomnavimage.ideenschmiede {
        width: 50%; /* 50% Breite für beide Elemente */
        height: auto;
        aspect-ratio: 144 / 116;
        background-size: contain;
        display: flex; /* Flexbox verwenden */
        align-items: center; /* Vertikal zentrieren */
        justify-content: center; /* Horizontal zentrieren */
    }

    .zoomnavimage.mappen-familien {
        width: 100%;
        height: auto;
        aspect-ratio: 184 / 116;
        background-size: contain;
    }

    /* Flexbox für Mappen-Konfigurator und Ideenschmiede Container */
    .col-12.col-xs-8.col-sm-8.col-md-2.sub-nav-main {
        display: flex;
        flex-wrap: nowrap; /* Nicht umbrechen */
        align-items: stretch; /* Stretch the items vertically */
        justify-content: space-between;
    }

    .col-md-12.col-xs-12.col-sm-12.d-flex.align-items-stretch {
        width: 50%;
    }
	
	.specific-landing-page-container .col-6.col-md-6.container-ids-standard {
		padding-left: 5px;
		padding-right: 5px;
	}
}

/* Medium Breakpoint (und der problematische Übergangsbereich) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .zoomnavimage.mappen-navi,
    .zoomnavimage.mappen,
    .zoomnavimage.ordner-galerie,
    .zoomnavimage.ideenschmiede {
        width: 144px;
        height: 116px;
        background-size: 95%;
    }

    .zoomnavimage.mappen-familien {
        width: 184px;
        height: 116px;
        background-size: 90%;
    }

    /* Flexbox-Steuerung für die Spalten */
    .specific-landing-page-container .sub-nav-main {
        display: flex;
        flex-wrap: wrap;
    }

    .specific-landing-page-container .box-4-raster-box.nav {
        flex: 0 0 calc(50% - 10px);
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .specific-landing-page-container .box-4-raster-box.nav:nth-child(2n) {
        margin-right: 0;
    }
}

/* Large und Extra Large Breakpoints */
@media (min-width: 992px) {
    .zoomnavimage.mappen-navi,
    .zoomnavimage.mappen,
    .zoomnavimage.ordner-galerie,
    .zoomnavimage.ideenschmiede {
        width: 144px;
        height: 116px;
        background-size: 95%;
    }

    .zoomnavimage.mappen-familien {
        width: 184px;
        height: 116px;
        background-size: 90%;
    }

    /* Flexbox-Steuerung für die Spalten */
    .specific-landing-page-container .sub-nav-main {
        display: flex;
        flex-wrap: wrap;
    }

    .specific-landing-page-container .box-4-raster-box.nav {
        flex: 0 0 calc(25% - 10px);
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .specific-landing-page-container .box-4-raster-box.nav:nth-child(4n) {
        margin-right: 0;
    }
}



/* Padding innerhalb der Elemente */
.specific-landing-page-container .text-center.h3, 
.specific-landing-page-container .text-center p {
    padding-top: 10px; /* Ursprünglicher Wert oder 0 */
    padding-bottom: 10px;
}

@media (max-width: 767px) {
    .specific-landing-page-container .text-center.h3, 
    .specific-landing-page-container .text-center p {
        padding-top: 5px;
        padding-bottom: 5px;
    }
}



@media (max-width: 767px) {
	.check-icon.smallmodul::before {
		left: 10px;
	}
}

/* Button */
.specific-landing-page-container .btn.btn-primary.btn-block.btn-lg.lp {
    padding-top: 12px; /* Ursprünglicher Wert */
    padding-bottom: 12px;
}

@media (max-width: 767px) {
    .specific-landing-page-container .btn.btn-primary.btn-block.btn-lg.lp {
        padding-top: 8px;
        padding-bottom: 8px;
    }
}

/* Padding der Spalten */
.specific-landing-page-container .col-12.col-md-6,
.specific-landing-page-container .col-12.col-md-4,
.specific-landing-page-container .col-12.col-md-4 .col-12 {
    padding-left: 15px; /* Ursprünglicher Wert */
    padding-right: 15px;
}

@media (max-width: 767px) {
    .specific-landing-page-container .col-12.col-md-6,
	.specific-landing-page-container .col-12.col-md-4,
	.specific-landing-page-container .col-12.col-md-4 .col-12,
	.specific-landing-page-container .col-12.col-md-12.text-container-ab-standard,
	.specific-landing-page-container .col-12.col-md-5.container-ids-standard,
	.specific-landing-page-container .slide,
	.specific-landing-page-container .col-12.col-md-7{
        padding-left: 5px;
        padding-right: 5px;
    }
	
	.specific-landing-page-container.container-balken-standard {
		padding-top: 35px;
		padding-bottom: 35px;
	}
	
	.specific-landing-page-container h2.text-headline-ab-standard,
	.specific-landing-page-container .text-container-ab-standard{
		margin: 0px;

	}
	
}

/* END Landingpages */

/* BEGIN index */

.icons_abl img {
	width: 30%;
}

.h2_abstand {
	margin-bottom: 0px;
}

.headline_box_abl {
	margin-bottom: 15px;
}

.info_abl {
	font-size: 20px;
}

.icons_al {
	
}

.gly-icon i {
	color: var(--main-color-bg-dark-hover); 
	margin-right: 5px;
}

.product-landing.mh .gly-icon i,
.box-land.mh .gly-icon i {
	color: var(--cta-color); 
	margin-right: 5px;
}

.product-landing.mh .gly-icon.mh i {
	color: white; 
	margin-right: 5px;
}

.landingmhn.col-12 {
	paddung-left: 0px !important;
	paddung-right: 0px !important;
}

#musterpaket {
  margin-top: 90px;
  margin-bottom: 80px;
}


/* END index */

/* BEGIN Guide */

@media only screen and (min-width: 150px) and (max-width: 560px) { 
	ul.ablauf.text.small li,
	.ablauf.text.small,
	.head-bg.advantages,
	.mobile-nav-icon{
		display: none;
	}
}


.head-gui {
	margin-top: 20px;
}

.ab-top {
	margin-top: 10px;
	margin-bottom: 10px;
}

.adresse_input input:focus:invalid {
	border-color: red;
}

.adresse_input input:required:focus:valid {
   border-color:#0c0;
 }

.adresse_input.button {
	padding-top: 15px;
	padding-bottom: 25px;
}

.content-center-text {
	margin: 0 auto;
    text-align: -webkit-center;
	text-align: -moz-center;
	text-align: -o-center;
	text-align: -ms-center;
}

:invalid {
    box-shadow: none; /* FF */
    outline: 0;       /* IE */
}

input:required:valid + label::after {
  content: "✔";
  color: green;
}

.news-mail {
	display: inline;
	margin-bottom: 10px;
}

.daten {
	margin-top: 10px;
}

.posbut {
	z-index: 1000;
	/*top: 10px;
	position: absolute;
	right: 0px;*/
	float: right;
	color: white;
}

.posbut .next,
.posbut .back {
	line-height: 35px;
}

ul.ablauf.text {
	text-align: center;
	padding-left: 0px;
	padding-right: 5px;
	display: table-cell;
	width: 60%;
	align-content: center;
	display: flex;
	margin: 0 auto;
}

.bg-warning {
	padding: 10px;
}

.ablauf.text.small {
	font-size: 12px;
	margin-top: 10px;
}

ul.ablauf li {
	list-style: none;
	display: inline;
}

ul.ablauf {
	padding: 0px;
	display: inline-flex;
	width: 6%;
/*	display: contents;
	display: -ms-inline-grid;

	display: -ms-grid;
	display: -ms-inline-flexbox;
	display: -ms-inline-grid;
*/
}

.ablauf.number {
	width: 40%;
}

.ablauf.line {
	vertical-align: top; 
	width: 100%;
}

.line-container {
	padding: 0px; 
	width: 4%; 
	display: inline-block; 
	float: left;
}

.line-container hr {
	width: 100%
}

.button.end-site {
	margin-top: 20px;
}

.button.end-site button {
	float: right;
}

ul li.line {
	width: 100%;
}

ul.ablauf.text li,
ul.ablauf p {
	font-size: 13px;
}

ul.ablauf.text.small li {
	font-size: 13px;
}

ul.ablauf li hr {
	/*width: 6%;
	display: inline-block;
	margin: 6px;*/
	display: inline-flex;
	width: 80%;
	vertical-align: middle;
}

.zusatzdetail {
	font-size: 14px;
}

.head-guide h1 {
	color: #C3071E;
}

.head-guide .beraten {
	vertical-align: middle;
}

	.head-guide .beraten button {
		background-color: #32a318;
		border-color: #1f710c;
		color: #fff;
	}

	.head-guide .beraten button:hover {
		background-color: #1f710c;
		border-color: #32a318;
	}

.navi-guide {
	margin-top: 40px;
}

.navi-guide .ablauf.last {
	text-align: left;
}

.navi-guide .rounded,
.content-guide .rounded {
	border-radius: 50% 50%;
	color: #fff;
	display: inline-block;
	height: 23px;
	margin:  0 auto;
	padding: 0px;
	text-align: center;
	width: 23px;
	vertical-align: top;
}

.back_deact,
.content-guide .rounded {
	background-color:  #74777c;
}

.back_activ {
	background-color:  var(--main-color-2);
}

.content-guide .rounded {
	line-height: 21px;
	font-size: 13px;
}

.content-guide .rounded {
	margin-right: 5px;
}

.navi-guide .center {
	display: inline-block;
	text-align: center;
	width: 70%;
}

.navi-guide .first {
	text-align: center;
	padding-bottom: 0px;
	display: inline-block;
}

.first.circle {
	display: inline-block; 
	padding: 0px;
}

.navi-guide .verlauf {
	float: none; 
	margin: 0 auto; 
	text-align: center;
}

hr {
	border-color: #74777c;
	margin-top: 10px;
}

.full-width-row > div {
  margin-left: -15px;
  margin-right: -15px;
}

.content-guide .panel {
	border: 0px;
}

.content-guide .icon {
	float: right;
}

.content-guide .panel-default > .panel-heading {
	border-bottom: 1px solid #ccc;
}

.flex-container .panel-heading {
	padding: 15px 0px 0px 0px;
}

.box-6-raster {
	height: 100px;
	background-size: cover;
}

.box-6-raster-box,
.box-4-raster-box {
	border-bottom: 1px solid #fff;
	text-align: center;
	margin-top: 8px;
	margin-bottom: 5px;
	background-color: #fafafa;
	min-height: 150px;
}

.box-4-raster-box.nav figure,
.box-4-raster-box.nav p{
	margin: 0px;
}

.box-4-raster-box.nav {
	background-color: white;
}

.box-4-raster-box.nav p {
	background-color: white;
}

.box-6-raster-box:hover,
.box-4-raster-box:hover{
	border-bottom: 1px solid var(--main-color-2);
}

.box-4-raster-box.unused:hover{
	border-bottom: 1px solid #fff;
}

.box-4-raster-box.g-3,
.box-4-raster-box.g-3 .box-4-raster{
	min-height: 10px;
}

.box-6-raster-box .text {
	background-color: #fafafa;
}

.box-6-raster-box p {
	margin: 0px;
}

.box-6-raster-box.special,
.box-6-raster-box.special figure{
	background-color: #fff5be;
}

.box-6-raster .text {
	background-color: white;
}

.box-4-raster {
	border: 1px solid #fff;
	min-height: 140px;
	width: 100%;
}

.img-boxen {
	width: 100%;
}

.box-6-raster-box figure {
	width: 100%;
	margin-bottom: 0px;
}

.box_produkt.selection {
	padding: 10px;
	margin: 7px 0px;
}

a.dropdown-item:hover {
	background-color: #E6E6E6;
}

.dropdown-item.picer {
	padding: 0px;
}

.dropdown-item {
	padding: 0.15rem 1.5rem;
}

/**.box_produkt.selection img {
	width: 100%;
	height: 92px;
}**/

figure {
    /**display: inline-block;
	display: -webkit-inline-block;**/
	display: grid;
    background: #fff;
    overflow: hidden;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}

figure.unused img {
    /**display: inline-block;
	display: -webkit-inline-block;**/
	display: grid;
    background: gray;
    overflow: hidden;
	-webkit-transition: all 0s ease;
    -moz-transition: all 0s ease;
    transition: all 0s ease;
	opacity: .3;
}

.option figure {
	display: block;
}

.option.mappeninh figure {
	display: inline-block;
	background: none;
}

.option.mappeninh figure img {
	
	display: inline-block;
}

.option.mappeninh figure p {
	
	display: inline-block;
	text-align: left;
}

.mappeninh.selection_container label {
	border-bottom: 1px solid #ccc;
}

.gu-head-bg {
	background-color: #bbbbbb; 
	color: #4a4a4a;
}

.card-header.bg {
	background-color: #fbfbfb;
}

.card-title.an {
	margin-bottom: 0px;
}

figure img,
figure:hover input{
    display: block;
    margin: 0;
    padding: 0;
	width: 100%;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}


figure:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    transform: scale(1.2);
    opacity: .5;
    filter: alpha(opacity=50);
}

figure:hover input {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transform: scale(1.1);
    opacity: .5;
    filter: alpha(opacity=50);
}

.unused figure:hover input,
.unused figure:hover img {
    display: block;
    margin: 0;
    padding: 0;
	width: 100%;
	-webkit-transition: none;
    -moz-transition: none;
    transition: none;
	transition: width 0s;
	filter: alpha(opacity=80);
	-webkit-transform: none;
    -moz-transform: none;
    transform: none;
	opacity: .3;
}

.unused .text {
	opacity: .3;
}

.content-guide .panel-default > .panel-heading + .panel-collapse > .panel-body,
.content-guide .panel-group .panel-heading + .panel-collapse > .panel-body, 
.content-guide .panel-group .panel-heading + .panel-collapse > .list-group {
	border: none;
}

.info {
	display: inline-block;
	background-color:  #ccc;
	border-radius: 50%;
	font-size: 13px;
	width: 22px;
	height: 22px;
	border: 1px solid #ccc;
	vertical-align: middle;
	margin-left: 5px;
	text-align: center;
}

.info.pos {
	float: right;
}

.info:hover {
	background-color: #C3071E;
	color: white;
}

.message {
    position: absolute;
    left: 0;
    width: 100%;
    opacity: 0;
    -webkit-transform: scale(.9, .9);
}
.info:hover + .message {
    opacity: 1;
	visibility: visible;
	transition: opacity 1s, visibility 1s;
	background-color: #fff;
	width: 100%;
	z-index: 2000;
}

.img_box {
	width: 100%;
}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #C3071E;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#myBtn:hover {
  background-color: #555;
}

.muster-option li {
	list-style: none;
	color: #32a318;
}

.muster-option ul {
	padding-left: 0px;
	margin-top: 10px;
}

.btn-link {
	color: #74777c;
}

.dropdown-submenu {
			    position: relative;
			}

			.dropdown-submenu > .dropdown-menu {
			    top: 0;
			    left: 100%;
			    margin-top: -6px;
			    margin-left: 0;
			    border-radius: 0.25rem;
			}

			.dropdown-submenu:hover > .dropdown-menu {
			    display: block;
			}

			.dropdown-submenu > a::after {
				border-bottom: 0.3em solid transparent;
				border-left-color: inherit;
				border-left-style: solid;
				border-left-width: 0.3em;
				border-top: 0.3em solid transparent;
				content: " ";
				display: block;
				float: right;
				height: 0;
				margin-right: -0.6em;
				margin-top: -0.95em;
				width: 0;
			}

			.dropdown-submenu.pull-left {
			    float: none;
			}

			.dropdown-submenu.pull-left > .dropdown-menu {
			    left: -75%;
			}

			.dropdown-menu .divider {
				background-color: #e5e5e5;
				height: 1px;
				margin: 9px 0;
				overflow: hidden;
			}

.btn-link:hover {
	color: var(--main-color-2);
}

.box_produkt,
.container-box {
	/**width: 100%;**/
	background-color:  #fbfbfb;
	/**min-height: 300px;**/
	padding-top: 15px;
	padding-bottom: 15px;
}

.box_produkt .bild {
	
}

.box_produkt.selection .text {
	font-size: 14px;
}

.box_produkt .anmerkung,
.top-an {
	margin-top: 15px;
}

.box_produkt .button {
	
}

.box_produkt .button button {
	float: right;
}

.anmerkung .checkbox {
	background-color: #fffea7;
	padding: 10px;
	margin-top: 10px;
}

.content-guide h4,
.content-guide h2,
.head-guide h1 {
	color: var(--main-color-2);
}

.content-guide h2 {
	color: var(--dark-gray-color);
}

.red-headline {
	color: #C31924;
}

.checkbox label {
	margin-right: 15px;
}

.flex-container {
   display: -webkit-flex;
   display: -ms-flex;
   display: flex;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
}

	.flex-container.box_produkt {
		margin-top: 30px;
	}

	.flex-container .button {
		margin-top: 20px;
	}

	.flex-inner {
	  display: -webkit-flex; 
	  display: -ms-flexbox; 
	  display: flex;
	}

	.flex-background {
		display: inline-block; 
		background-color: #e7e7e7; 
		padding: 10px;
		width:  100%;
		margin: 10px 0px;
	}

.flex-background.search {
	background-color: var(--secondary-color-3);
	padding: 15px;
}

.flex-container.border {
	background-color: #e7e7e7;
	padding: 10px;
}

.chance {
	background-color: #949494;
	border-color: #ccc;
}

.option-product {
	margin: 15px 0px;
	background-color: #fbfbfb;
	padding: 15px;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance:textfield;
}


/* RADIO IMAGE */

.selection_container {
	text-align: center;
	font-size: 13px;
}

.selection_container label {
	font-weight: 100;
	border-bottom: 1px solid #fff;
	width: 100%;
}

.selection_container label:hover {
	border-bottom: 1px solid #C31924;
}

label > figure {
	background-color: transparent;
}

label > figure > input.radio_image { /* HIDE RADIO */
  visibility: hidden; /* Makes input not-clickable */
  position: absolute; /* Remove input from document flow */
}
label > figure > input.radio_image + img { /* IMAGE STYLES */
  cursor:pointer;
  border:1px solid transparent;
}
label > figure > input.radio_image.zubehoer:checked + img,
label > figure > input.radio_image.abheftungen:checked + img,
label > figure > input.radio_image.schlitzungen:checked + img,
label > figure > input.radio_image.folientaschen:checked + img,
label > figure > input.radio_image.verschluesse:checked + img{ /* (RADIO CHECKED) IMAGE STYLES */
	background-color: var(--main-color-1);
}

.selection_container > input.radio_image:checked {
	border: 1px solid red;
}

/**.selection_container p {
	height: 40px;
	min-width: 150px;
	vertical-align: middle;
	text-align: center;
	display: table-cell;
}**/

.selection_container p:checked {
	border-bottom: 1px solid #ccc;
}

/* RADIO IMAGE */

.overview {
	line-height: 35px;
}

	.overview-between hr {
		border-color: #d5d5d5;
		margin-bottom: 10px;
	}

	.overview .selection {
		color: #686868;
		font-weight: 600;
	}

	.overview .selection.top,
	.overview .top {
		font-weight: 600;
	}

	.overview.product {
		background-color: #c6f8bd;
		overflow: hidden;
	}

.top-overview {
	margin-bottom: 20px;
}

.top-overview img {
	width: 20%;
}

/* Toogle */
.panel-title > a:before {
    float: right !important;
    font-family: FontAwesome;
    content:"-";
	font-size: 28px;
    padding-right: 5px;
}
.panel-title > a.collapsed:before {
    float: right !important;
    content:"+";
	font-size: 28px;
}
.panel-title > a:hover, 
.panel-title > a:active, 
.panel-title > a:focus  {
    text-decoration:none;
}
.panel {
	box-shadow: none;
}

.panel.top {
	margin-top: 15px;
}

.pa.top {
	margin-top: 8px;
	margin-bottom: 20px;
}

.container-g-3-box {
	padding: 25px 10px;
}

.container-g-3-box h5,
.container-g-3-02-box h5{
	color: var(--main-color-2);
}

.container-g-3-box.second {
	padding: 0px 10px 25px 10px;
}

.left-space {
	background-color: var(--secondary-color-3);
	border: 1px solid #dee2e6;
	border-radius: 10px;
	min-height: 700px;
}

.container-g-3-box .navi-drei .selection_container label figure,
.container-g-3-box .navi-drei .selection_container label p {
	margin: 3px 0px;
}

.container-zubehoer {
	margin-top: 50px;
}

.box-g-3-padding {
	padding: 8px;
}

.btn.collap-g {
	border-radius: 0px;
	background-color: var(--secondary-color-3);
	border-bottom-color: var(--secondary-color-4);
	color: black;
	border-left: none;
	border-right: none;
	border-top: none;
}

.card.collap-g-card {
	background-color: var(--secondary-color-3);
	border: none;
	border-radius: 0px;
}

.filter-ab {
	margin-top: 5px;
}

.filter-ab:first-child {
	margin-top: 0px;
}

.filter-ab:last-child {
	margin-top: 15px;
}

.filter-ab hr {
	border-color: #ccc;
}

.dropdfilter {
	z-index: 10;
	position: absolute; 
	background-color: white;
	border: 1px solid #ccc;
	border-top: none;
}

.scroll-card {
	height:280px;
	overflow-y: scroll;
}

.zubupo {
	bottom: 0px;
    background-color: rgba(118,118,118,0.50);
    width: 100%;
    padding: 8px;
}

.top-ab {
	margin-top: 10px;
}

.berater-head {
	color: var(--main-color-2);
}

.filter-h:last-child {
	margin-bottom: 25px;
}

#modell1,
#modell2,
#modell3 {
	display: none;
}


#vier-seiter-unten-rechts, 
#vier-seiter-lasche-rechts,
#vier-seiter-lasche-oben-rechts,
#vier-seiter-lasche-unten-links,
#vier-seiter-lasche-links,
#vier-seiter-lasche-oben-links,
#vier-seiter-tasche-unten-rechts,
#vier-seiter-tasche-rechts,
#vier-seiter-tasche-unten-links,
#vier-seiter-tasche-links,
#sechs-seiter-mappe,
#innenabheftung, 
#innenAussenabheftung,
#topallround,
#transparentAbheftung,
#klemmschiene,
#magnetklemme,
#dreieckstascheR,
#dreieckstascheL, 
#maxifR, 
#maxifL,
#rechteckL,
#rechteckR,
#visitascheR, 
#visitascheL,
#zubeh,
#visitascheH
{
	display: none;
}

.modal {
	z-index: 3000;
}

.bilder-tl {
	position: absolute; 
	top: 0px;
}

.bilder-tl.mappenmodell {
	width: 100%;
}

/*.content-plus-minus-li {
	position: relative;
}*/

.bilder-tl.plus-minus {
	left: 0px;
	z-index: 2000;
}

.hinweis-info-mappennavi {
	font-size: 0.8em;
	color: var(--dark-gray-color);
	
}

.plus-minus.zusatz {
	position: relative;
	margin-left: 5px;
	margin-right: 5px;
}

.plus-minus {
	background-color: var(--main-color-2);
	height: 20px;
	width: 20px;
	border-radius: 20px;
	color: white;
	text-align: center;
	margin: 0px;
	line-height: 19px;
}

.plus-minus.minus { 
	display: none;
}

.plus-minus.s4-oben-rechts {
    left: 70%;
    top: 12%;
}

.plus-minus.s4-unten-rechts {
    left: 70%;
    top: 78%;
}

.plus-minus.s4-rechts {
    left: 89%;
    top: 45%;
}

.plus-minus.s4-unten-links {
    left: 25%;
    top: 78%;
}

.plus-minus.s4-links {
    left: 10%;
    top: 45%;
}

.plus-minus.s4-oben-links {
    left: 25%;
    top: 12%;
}

.plus-minus.s6-rechts {
    left: 92%;
    top: 45%;
}

.plus-minus.s6-oben-rechts {
    left: 80%;
    top: 10%;
}

.plus-minus.s6-unten-rechts {
    left: 80%;
    top: 75%;
}

.plus-minus.s6-unten-mitte {
    left: 50%;
    top: 75%;
}

.plus-minus.s6-oben-mitte {
    left: 50%;
    top: 10%;
}

.plus-minus.s6-unten-links {
    left: 20%;
    top: 75%;
}

.plus-minus.s6-links {
    left: 10%;
    top: 45%;
}

.plus-minus.s6-oben-links {
    left: 25%;
    top: 12%;
}

.plus-minus {
	position: absolute;
}

.svg-lei-sp path {
	fill: var(--main-color-1);
}

.svg-lei-sp {
	width: 55px;
}

svg:hover path {
    fill: var(--main-color-3);
}

.highlight {
	color: var(--main-color-2);
}

.highlight h6 {
	margin: 0px;
	font-weight: bold;
}

.product-landing.mh h1 {
	color: black;
}

.product-detail .highlight {
	color: var(--dark-gray-color);
}

#navshow {
	display: none;
}

.box-bg {
	background-color: #F0EFEF; 
	border-radius: 10px; 
}

.box-bg.white {
	background-color: #ffffff;
}

box-ecken {
	border-radius: 10px; 
	background-color: #F0EFEF; 
}

.box-bg.berater {
	padding: 8px;
}

.box-bg.achtung {
	background-color: var(--red);
	color: white;
	margin: 15px 0px;
}

.box-bg.verlinkung {
	padding: 8px 15px;
}

.box-bg.lan h4 {
	margin-top: 15px;
	margin-bottom: 0px;
}

.box-bg.lan h4:first-child,
.box-bg.lan h4.headline-collapse {
	margin: 0px;
}



.box-bg.berater.vorteile {
	padding: 20px;
}

.box-bg.form {
	padding: 12px;
}

.box-bg .table {
	margin-bottom: 0px;
	font-size: 1em;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus,
.btn-primary.disabled, .btn-primary:disabled {
	background-color: var(--main-color-2);
	border-color: var(--main-color-2);
	box-shadow: 0 0 0 0.2rem var(--main-color-hover-pic);
}

.btn-primary:focus, .btn-primary.focus {
	box-shadow: 0 0 0 0.2rem var(--main-color-hover-pic);
}

.box-bg.leistungen,
.box-bg.vorteile {
	padding: 15px;
	cursor: pointer;
}

.box-bg.optionen .panel.panel-default a {
	padding: 15px;
	border-radius: 10px;
}

.box-bg.optionen .panel.panel-default a h4 {
	margin: 0px;
}

.box-bg.optionen.positionzwei {
	margin-top: 15px;
}

.box-bg.optionen .panel .collapse .row {
	padding-bottom: 20px;
}

.box-bg.vorteile.box-land h4 {
	margin-bottom: 0px;
}

.box-bg.vorteile.box-land.fo h4.box-head-between {
	margin-top: 15px;
	margin-bottom: 0px;
}

.box-bg.vorteile.box-land.fo h4 {
	margin-bottom: 15px;
}

.box-bg .list-unstyled {
	margin-bottom: 0px;
}

.box-bg.material {
	margin-top: 20px;
}

.al-wa-li {
	margin-top: 5px;
	color: var(--main-color-2);
}

.bg-light {
	background-color: #f3f3f3 !important; 
}

.nav-tabs.g-3.unvis {
	display: none;
}

.nav-tabs.g-3 .nav-item.active,
.nav-tabs .nav-link.active {
	background-color: var(--main-color-1);
	border-bottom: 1px solid var(--secondary-color-3);
	color: white;
	border-top-left-radius: 0.25rem;
	border-top-right-radius: 0.25rem;
}

.nav-tabs.g-3 .nav-item {
	background-color: var(--secondary-color-3);
	border: 1px solid #dee2e6;
	border-top-left-radius: 0.25rem;
	border-top-right-radius: 0.25rem;
}

.content-right-g3 {
	padding-left: 20px;
}

.mappen-modell-ab {
	margin-top: 15px;
}

.nav-item a.nav-link:hover {
	color: var(--main-color-1);
}

.nav-item a.nav-link.active:focus,
.nav-item a.nav-link.active:active{
	color: white;
}

.nav-tabs .nav-link.active, 
.nav-tabs .nav-item.show .nav-link {
	border: none;

}

.nav-tabs .nav-item.active a {
	color: white;
}

/* END Guide */

/* BEGIN NAV HEAD */

.bg-nav-mp {
	background-color: #f3f3f3;
}

.navbar {

	padding: 0rem 1rem;
	z-index: 2000;
}

.navbar-nav.padd .nav-item .nav-link {
	padding: 0.8rem 0rem;
}

.navbar-nav .nav-item a:focus,
.navbar-nav .nav-item a:hover {
	background-color: var(--main-color-1);
	color: #ffffff !important;
}

.box-4-raster-box.nav .box-4-raster a:hover{
	background-color: #ffffff !important;
	color: red !important;
}

.content-guide .nav-item a:focus {
	color: var(--main-color-1);
}

.produkt-hin {
	position: absolute; 
	background-color: var(--main-color-2); 
	color: white; 
	width: 54px; 
	height: 54px; 
	border-radius: 50% / 50%; 
	line-height: 13px; 
	right: 13%; 
	top: 10%;
	padding-top: 10px;
}

.produkt-hin .text {
	position: relative; 
	vertical-align: middle; 
	font-size: 11px; 
	top: 10%;
}

.head-bg {
	background-color: var(--main-color-1);
	padding: 5px 0px;
	z-index: 2000;
}

.head-bg.advantages {
	background-color: var(--main-color-2);
	color: white;
	font-size: 0.9em;
}

.head-bg.advantages .col:last-child {
	text-align: right;
}

.text-color-head-nav {
	color: var(--main-color-bg-dark);
	font-size: 1em;
	text-align: right;
}

.text-color-head-nav:hover {
	color: var(--main-color-bg-dark-hover);
	cursor: pointer
}

.carousel-caption h4,
.carousel-caption h5 {
	color: #ffffff;
	text-align: left;
}

.carousel-caption h4 {
	padding: 0px;
	margin: 0px;
}


.carousel-caption h5 {
	font-weight: 300;
}

.carousel-caption p {
	color: #3f3f3e;
	text-align: left;
	width: 60%;
}

.carousel-caption.firmen h4,
.carousel-caption.firmen h5 {
	color: var(--main-color-1);
	text-align: left;
}

.carousel-caption.firmen {
	left: 10%;
	bottom: 20%;
}

.carousel-caption.firmen p {
	width: 95%;
}

.navbar-static-top .container {
	padding: 0px;
}

.navbar-expand-lg {
	padding-left: 0px;
	padding-right: 0px;
}


/**Search**/

#custom-search-input.indi .input-group .form-control {
	padding: 0px 0px 0px 10px;
	
}

#custom-search-input .input-group-btn.bl {
	border-left: 1px solid #ccc;
}

#custom-search-input .input-group-btn.bl button {
	border: none;
}

.search-text {
	font-size: 0.9em;
	color:var(--dark-gray-color);
}

.search-text h5,
.search-text h1,
.search-text h2,
.search-text h3,
.search-text h4 {
	font-size: 1em;
}

.container-search a:hover {
	text-decoration: none;
}

/**New Page**/

.content-ab-all {
	margin: 50px 0px;
}

	.content-ab-all.ideens {
		margin: 40px 0px 20px 0px;
	}

	.content-ab-all.ideens.tb {
		margin: 50px 0px 20px 0px;
	}

	.content-ab-all.sml {
		margin: 40px 0px 0px 0px;
	}

	.content-ab-all.sml.bt {
		margin: 15px 0px 0px 0px;
	}
	
	.content-ab-all.zwanzig {
		margin: 20px 0px 0px 0px;
	}

.content-ab-all.small {
	margin: 5px 0px 18px 0px;
}

.content-ab-all.ab-innen-top {
	padding: 20px 0px;
}

.head-l-height {
	margin-bottom: 20px;
}


.service-wrapper {
	overflow: hidden;
	position: relative;
}

.service-wrapper-inner {
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: 1;
	top: 100px;
	padding: 15px 20px;
	-webkit-transition: 0.1s;
	-moz-transition: 0.1s;
	-ms-transition: 0.1s;
	-o-transition: 0.1s;
	transition: 0.1s;
	background: rgb(32,32,32,0.9);
}

.service-wrapper:hover, .service-wrapper-inner {
	top: 0;
}

.btn-primary.mappenh.small {
	font-size: 0.95rem;
}

.btn-primary.mappenh.big {
	font-size: 1.25rem;
}

.btn-primary.mappenh {
	border-color: var(--main-color-2);
	background-color: var(--main-color-button);
}

.btn-primary.mappenh.landing {
	border-color: white;
	background-color: white;
	color: black;
}

.btn-primary.mappenh:hover,
.btn-primary.mappenh.small:hover,
.btn-primary.mappenh.small.btn-lg:hover,
.btn-primary.mappenh.small.btn-lg.btn-block:hover,
a:hover .btn-primary.mappenh.small {
	background-color: var(--main-color-1);
	border-color: 1px solid var(--main-color-button);
	text-decoration: none;
}

.btn-primary.mappenh.landing:hover {
	background-color: var(--main-color-2);
	border-color: 1px solid var(--main-color-button);
	text-decoration: none;
}

.product-landing.mh.bggefuellt,
.product-landing.mh.bggefuellt h1{
	color: white !important;
	margin-top: 30px;
}

.product-landing.mh .btn-primary.mappenh {
	border-color: var(--cta-color2-hover);
	background-color: var(--cta-color2);
}

.product-landing.mh .btn-primary.mappenh:hover {
	border-color: var(--cta-color2);
	background-color: var(--cta-color2-hover);
}

.btn-primary.mappenh.galerie {
	border-color: var(--secondary-color-hover);
	background-color: var(--secondary-color);
}

.btn-primary.mappenh.galerie:hover {
	background-color: var(--secondary-color-hover);
	border-color: var(--secondary-color);
}

.btn-primary.mappenh.muster {
	border-color: var(--cta-color-hover);
	background-color: var(--cta-color);
}

.btn-primary.mappenh.muster:hover {
	background-color: var(--cta-color-hover);
	border-color: var(--cta-color);
}

.btn-primary.next {
	border-color: var(--main-color-2);
	background-color: var(--main-color-button);
}

.btn-primary.next:hover {
	background-color: var(--main-color-2);
	border-color: var(--main-color-button);
}

.btn-primary.back {
	border-color: var(--lightdark-gray-color);
	background-color: var(--light-gray-color);
}

.btn-primary.back:hover {
	background-color: var(--lightdark-gray-color);
	border-color: var(--light-gray-color);
}

.btn-primary.hinweis {
	background-color: var(--bg-hinweis);
	border-color: var(--bg-hinweis-hover);
}

body {
	background-color: #ffffff;
}

.bg-footer-full {
	background-color: var(--main-color-1);
	width: 100%;
}

/**.footer2 {
	background-color:#eccd23;
}**/


.hovereffect {
width:100%;
height:100%;
float:left;
overflow:hidden;
position:relative;
text-align:center;
cursor:default;
}

.hovereffect a {
	cursor: pointer;
}

.hovereffect .overlay,
.hovereffect .overlay:hover,
.hovereffect .overlay:active{
width:100%;
height:100%;
position:absolute;
overflow:hidden;
top:0;
left:0;
opacity:0;
background-color: var(--main-color-hover-pic);
-webkit-transition:all .4s ease-in-out;
transition:all .4s ease-in-out;
	-webkit-user-select: none; 
	-webkit-touch-callout: non
}

.hovereffect img {
display:block;
position:relative;
-webkit-transition:all .4s linear;
transition:all .4s linear;
}

.overlay h3 {
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 22px;
	margin: 0 30px;
	padding: 45px 0 0 0;
	min-height: 180px;
	text-shadow: 
		0 0 1px #fff, 
		0 1px 2px rgba(0,0,0,0.3);
	hyphens: auto;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

.overlay p {
	color: #fff;
}

.hovereffect:hover img {
-ms-transform:scale(1.2);
-webkit-transform:scale(1.2);
transform:scale(1.2);
}

.hovereffect:hover .overlay {
opacity:1;
filter:alpha(opacity=100);
}

.hovereffect:hover h2,.hovereffect:hover a.info {
opacity:1;
filter:alpha(opacity=100);
-ms-transform:translatey(0);
-webkit-transform:translatey(0);
transform:translatey(0);
}

.hovereffect:hover a.info {
-webkit-transition-delay:.2s;
transition-delay:.2s;
}

.bg-streifen {
	background-color: #f0eff0; 
	width: 100%;
}

.bg-streifen.landing {
	min-height: 220px;
}

.bg-streifen.landing.small {
	min-height: 130px;
}

.bg-streifen.landing.small.mh {
	background-color: var(--main-color-1);
}

.bg-streifen.landing.small.mh .beratung {
	font-size: 16px;
	color: white;
}

.bg-streifen.landing.small.mh .beratung a {
	color: white;
}

.bg-streifen.landing.small.mh .beratung a:hover {
	color: var(--main-color-2);
}

.fullscreen {
   background-repeat: no-repeat;
   background-position: center;
   -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
   width: 100vw;
   height: 70vh;
   display: flex; 
   justify-content: center; 
   align-items: center;
	background-image: url("/content/imgs/mappenhaus/landingpage-background-image-new-mappen-1936031902.jpg"); 
}

/*@media screen and (max-width: 600px) {
  div.fullscreen {
    background-image: url("/content/imgs/mappenhaus/landingpage-background-image-new-mappen-1936031902-3.jpg"); 
	height: 100vh;
  }
}*/

/*@media screen and (min-width: 800px){ 
	div.fullscreen { 
		background-position: -1350px;
		height: 70vh;
	}
	div.fullscreen .container {
		position: absolute;
		top: 200px;
	}
}

@media screen and (min-width: 700px){ 
	div.fullscreen { 
		background-position: -1350px;
		height: 70vh;
	}
	div.fullscreen .container {
		position: absolute;
		top: 200px;
	}
}

@media screen and (min-width: 390px){ 
	div.fullscreen { 
		background-position: -750px;
		height: 80vh;
	}
	div.fullscreen .container {
		position: absolute;
		top: 150px;
	}
}*/

@media screen and (min-width: 300px) { 
	div.fullscreen { 
		background-position: -1940px; 
		height: 800px;
	} 
}
@media screen and (min-width: 600px) { 
	div.fullscreen { 
		background-position: -1420px; 
		/*height: 600px;*/
		height: 110vh;
	} 
}
@media screen and (min-width: 750px) { 
	div.fullscreen { 
		background-position: -1370px; 
		/*height: 600px;*/
		height: 110vh;
	} 
}
@media screen and (min-width: 1000px) { 
	div.fullscreen { 
		background-position: -1150px; 
		/*height: 600px;*/
		height: 85vh;
	} 
}
@media screen and (min-width: 1200px) { div.fullscreen { background-position: -550px; height: 600px;} }
@media screen and (min-width: 1400px) { div.fullscreen { background-position: -400px; height: 600px;} }
@media screen and (min-width: 1600px) { div.fullscreen { background-position: -250px; height: 600px;} }
@media screen and (min-width: 1800px) { div.fullscreen { background-position: -150px; height: 600px;} }
@media screen and (min-width: 1810px) { div.fullscreen { background-position: 0px} }



/*fullscreen {
   background-repeat: no-repeat;
   background-position: center;
   -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
   width: 100vw;
   height: 50vh;
   display: flex; 
   justify-content: center; 
   align-items: center;
	background-image: url("/content/imgs/mappenhaus/landingpage-background-image-new-mappen-1936031902.jpg"); 
}

@media only screen and (max-width: 480px) {
	.fullscreen {
		height: 100vh;
	}
}*/

/** BEGIN Dropdown **/

.dropdown-menu.all-dropdown {
	min-width: 100%;
	border: 0px;
	border-radius: 0px;
	background-color: #F8F9F9;
	padding: 15px;
	margin: 0px;
}

.dropdown-menu.all-dropdown-angep {
	border: 0px;
	border-radius: 0px;
	background-color: #F8F9F9;
	padding: 15px;
	margin: 0px;
	right: 0px;
	left: auto;
}

.sub-nav-main {
	padding: 5px;
	/***margin-left: 15px;***/
}

.image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.hovering,.box, .boxn {
	border:1px solid #ececec;
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-ms-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out
}

.hovering:hover,.box:hover, .boxn:hover {
	border-color: var(--a-allgemein);
}

.boxn:hover .image {
  opacity: 0.3;
}

.boxn:hover .middle,
.box:hover .middle {
  opacity: 1;
}

.text-ideen {
	background-color: white;
	opacity: 0.8;
	font-size: 16px;
	padding: 16px 32px;
}

.text-ideen.mappen {
	color: var(--main-color-2) !important;
}

.box-container-zubehoer {
	margin-bottom: 50px;
}

.box-material {
	margin-bottom: 50px;
}

.produktnummer {
	color: #dfad00;
}

/* END Dropdown */

/* BEGIN Stellenangebote */

.container-ab {
	margin: 20px 0px;
}

/* END Stellenangebote */

.gewinnspiel-sc ol li {
	line-height: 25px;
	margin-top: 15px;
}

.gewinnspiel-sc h4 {
	margin-top: 45px;
}

.bw-text {
	word-wrap:break-word;
	cursor: pointer;
}

.hr-light {
	border-color: #ccc;
}

/* Hover Effekt li-print.de */

.marken-text-box {
	margin-top: 280px;
	margin-bottom: 20px;
}



.circle-container {
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  position: relative;
}

.circle-container .circle-inner {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: var(--main-color-1);
	border-radius: 50%;
	color: white;
  
	/* center content */
	display: flex;
	align-items: center;
	justify-content: center;
	align-content: center;
}

.circle-container .circle-inner.klein {
	background-color: var(--main-color-2);
}

.circle-container .circle-inner:hover {
  background-color: var(--main-color-2);
  color: white;
}

.circle1 {

  width: 100%;
}

.circle2 {
	position: absolute;
	top: 50%;
	left: -15%;
	width: 50%;
}

.line-vertical {
	height: 40px;
	width: 4px;
	background-color: var(--main-color-1);
	margin: 10px 0px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.text-vertical-center {
	display: -webkit-flex; 
	display: -webkit-box; 
	display: -ms-flexbox; 
	display: flex; 
	-webkit-align-items: center; 
	-webkit-box-align: center; 
	-ms-flex-align: center; 
	align-items: center;
	margin-top: 20px;
	margin-bottom: 20px;
}

.counter-value {
	margin-top: 15px;
	font-size: 1.3em;
}

/* START Pop-Up Element */

.popup_content {
	padding: 20px;
	max-width: 60%;
	background: white;
	border-radius: 10px;
}

.changecontainerbutton {
	border-radius: 10px;
	border: 1px solid #e5e5e5;
}

.changecontainerbutton figure {
	margin: 0px;
	padding: 5px 0px;
	cursor: pointer;
}

/* START Datenblaetter/Downloads */

.datenblaetter{
	list-style-type: square;
	margin-left:0;
	padding: 0;
}

.datenblaetter a{
	color: black;
}

.datenblaetter a:hover{
	text-decoration: none;
}

.icon{
	background-color:#F0EFEF;
	width: auto;
	padding: auto;
	height: auto;
	border-radius: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

.form{
margin: 15px 0px;
}

.atab {
	tab-size: 65; 
	-moz-tab-size: 65; 
	-ms-tab-size: 65;
	-webkit-tab-size: 65;
	white-space: pre;
}

/* START Produktionsablauf */

.produktionsablauf .Datenblatt{
	margin-top: 40px;
	background-color: var(--main-color-2);
	text-align: center;
	padding: 15px 0 0 0;
	-moz-border-radius: 10px; 
	-ms-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px; 
	color: white;
	text-transform: uppercase;
}


.produktionsablauf .Herunterladen{
	font-size: 180%;
}

.produktionsablauf .ueberschrift{
	text-transform: uppercase;
	color: var(--main-color-2);
	margin-left: 10px;
	font-size: 110%;
}

.produktionsablauf .text{
	margin-top: 15px;
}

.produktionsablauf .schluss{
	font-size: 150%;
	color: var(--main-color-2);

}

.produktionsablauf hr {
	border:none;
	border-right:3px dotted;
	color: var(--main-color-2);
	height:100px;
	width:10%;
	margin: 20px auto; /*zum zentrieren*/
}


/* END Produktionsablauf */

/* START Lieferservice */

.lieferanweisung{
	background-color: #f0eff0;
	margin: 30px 0px 50px 0px;
	padding: 10px 20px;
	border-radius: 5px;
}

.versandfragen{
	margin-top: 50px;
}

.lieferservice .img-fluid{
	max-width: 130%;
	height: auto;
	margin: 15px;
}

/* END Lieferservice */

/* START Über uns */



.ueberuns h1{
	font-size: 130%;
	color: black;
}

.ueberuns h2{
	font-size: 130%;
	color: black;
	cursor: pointer;
}

.ueberuns h2:hover{
	font-size: 130%;
	color:  var(--main-color-2);
	cursor: pointer;
}


.wunschkunde{
position: absolute;
top: 22%;
left: 50%;
}

.Stiftebox{
	margin-top: 15%;
}

.wunschkunde ul {
    list-style-image:url("https://bilder.li-print.de/produktbld/orginal/aufzaehlungszeichen-punkte-Druckbetrieb-Lindner-Web-00.jpg");
	padding-left: 1.5em;
	font-size: 100%;
	
}

.wunschkunde h4{
font-size: 120%;
	}

.wunschkunde p{
font-size: 100%;
	}

@media screen and (max-width:1199px) {
.wunschkunde h4{
	font-size: 100%;
	color: var(--main-color-2);
	text-transform: uppercase;}
.wunschkunde p{
font-size: 85%;
} 	

.wunschkunde ul{
font-size: 85%;
} 	

}
	
@media screen and (min-width:768px) and (max-width:991px) {
.wunschkunde h4{
	font-size: 80%;
	color: var(--main-color-2);
	text-transform: uppercase;
}
.wunschkunde ul{
font-size: 60%;
	    list-style-image:url("https://bilder.li-print.de/produktbld/orginal/aufzaehlungszeichen-punkte-klein-Druckbetrieb-Lindner-Web-00.jpg");

} 	
.wunschkunde p{
font-size: 60%;

} }

@media screen and (max-width:767px) {
.wunschkunde h4{
	font-size: 90%;
	color: var(--main-color-2);
	text-transform: uppercase;}
.wunschkunde p{
font-size: 74%;
} 	

.wunschkunde ul{
font-size: 74%;	
	}

.selection_container {
	text-align: center;
	font-size: 0.5rem;
}
	
}



.ueberuns .kunde{
	margin-top: 30px;
	background-color:#f0eff0;
	padding-top: 10px;
	display: flex;
	
}


.ueberuns .staerken{
	margin-top: 30px;
	background-color:#f0eff0;
	padding:20px 0 20px 0;
}

.staerken img{
	margin-bottom: 10px;
}


.ueberuns .verantwortung{
	margin-top: 30px;
	padding:20px 0 20px 0;
}

.weiss{
	background-color: white;
	padding: 23px 10px 0px 10px;
	margin: 10px 5px 0px 5px;
	border-radius: 5px;
	width: 100%;
	vertical-align: middle;
	min-height: 215px;
}

.weiss h2 a{
	color:rgba(100,100,100,1.00);
}

.weiss h2 a:hover{
	color: var(--main-color-2);
	text-decoration: none;
}

.weiss p{
	font-size: 90%;
}

.grau{
	background-color: #f0eff0;
	padding: 10px;
	border-radius: 5px;
}

.ueberuns .orgadoc{
	margin-top: 30px;
	background-color:#f0eff0;
	padding:20px 0 20px 0;
}


.staerken-second{
	background-color: #f0eff0;
	padding: 10px;
	margin: 0 20px 2px 20px;
	border-radius: 5px;
}

.verantwortung a{
	color: black;
}

.verantwortung .massnahmen{
	background-color: white;
	box-shadow: 0px 0px 3px grey;	
	border-radius: 5px;
	text-align: center;	
	min-height: 150px;
	margin-bottom: 20px;
}

.verantwortung .massnahmen-second{
	background-color: white;
	box-shadow: 0px 0px 3px grey;	
	border-radius: 5px;
display: grid;
justify-content: center;
align-items: center;
	text-align: center;	
	min-height: 150px;
	padding: 10px 10px;
	margin-bottom: 20px;
	font-size: 85%;
}

.verantwortung .massnahmen h2 a{
	color:rgba(100,100,100,1.00);
}

.verantwortung .massnahmen h2 a:hover{
	color: var(--main-color-2);
	text-decoration: none;
}

.verantwortung .massnahmen-second h2 a{
	color:rgba(100,100,100,1.00);
}

.verantwortung .massnahmen-second h2 a:hover{
	color: var(--main-color-2);
	text-decoration: none;
}

.kleine-bilder {
    max-width: 80%; /* Oder eine andere passende Prozentzahl */
    height: auto;
    display: block;
    margin: 0 auto; /* Zentriert das Bild horizontal */
}

.ueberuns-container {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Zentriert vertikal */
}

.massnahmen {
    text-align: center; /* Zentriert den Inhalt horizontal */
}

.massnahmen p {
    margin-top: 0.5em; /* Fügt etwas Abstand zwischen Bild und Text hinzu */
}

/* END Über uns */

/* START Layoutservice */

.Layoutservice h4{
	color: var(--main-color-2);
}

.Layoutservice h6{
	color: var(--main-color-2);
}

.Kopf-LS{
	margin-bottom: 10px;
	vertical-align: middle;
}

.rechts-LS{
	text-align: right;
}

.unverbindlicheAnfrage{
	font-size: 70%;
}

.grau-LS{
	background-color: #f0eff0;
	padding-top: 15px;
	padding-bottom: 5px;
	border-radius: 5px;
	margin: 10px 0px 10px 0px;
}

.grau-LS p{
	font-size: 70%;
	margin-top: 5px;
}

.durchstarten{
	background-color: var(--main-color-2);
	margin-top: 10px;
	padding: 10px;

	
}

.durchstarten h3{
	color: white;
}

.durchstarten p{
	color: white;
}

.Vorteile-LS{
	background-color: #f0eff0;
	margin-bottom: 40px;
	padding: 10px;
}


.Vorteile-LS h3{
		color: var(--main-color-2);
}

.Vorteile-LS ul{
	list-style-type: none;
}

.Druckproukt-LS ul{
	list-style-type: square;
	padding-left: 1.5em;
}

.btn-primary{
	background-color: var(--main-color-2);
	border: none;
}

.btn-secondary{
	color: var(--main-color-2);
	background-color: white;
	border: none;
}

.WWWWWB{
	color: var(--main-color-2);
	text-transform:uppercase;
}

.Ablauf{
	margin-top: 15px;
}

.Abstand{
	margin: 15px 0px 5px 0px;
}

/* END Layoutservice */


.kontaktbanner{
	position: absolute;
	top: 81%; 
	left: 21.5%;
}

.kontaktbanner a{
	color: black;
}

@media screen and (max-width:1199px) {
.kontaktbanner p{
	font-size: 84%;
} 	

}
	
@media screen and (min-width:768px) and (max-width:991px) {
.kontaktbanner p{
	font-size: 64%;
}}

@media screen and (max-width:767px) {
.kontaktbanner p{
font-size: 47%;
	}}

@media screen and (max-width:430px) {
.kontaktbanner{
	position: absolute;
	top: 81%; 
	left: 38%;
}	
	
.kontaktbanner p{
font-size: 47%;
	text-align: center;
	line-height: 1.2;
	}
.umbruch::after {
    content: '\A';
    white-space: pre;    
}
}

/* BEGINN Anfrage Seite */

@media screen and (min-width:1200px) {
.Anfrage-MH	.vielenDank{
		margin-left: 5px;

}

	.Anfrage-MH	.text-anfrage-mh{
			font-size: 100%;

	}
}

@media screen and (min-width:992px) and (max-width:1199px) {
.Anfrage-MH	.vielenDank{
		margin-left: 10px;
	}

.Anfrage-MH	.text-anfrage-mh{
		font-size: 90%;

}
}
	
@media screen and (min-width:768px) and (max-width:991px) {
.Anfrage-MH	.vielenDank{
		margin-left: 25px;
	}

	.Anfrage-MH	.text-anfrage-mh{
		font-size: 65%;

}

}


@media screen and (max-width:767px) {
.Anfrage-MH h2{
	text-align: center;
}


.Anfrage-MH h3{
	text-align: center;
	}}




.Anfrage-MH .aussenabstand{
	margin-top: 20px;
	margin-bottom: 40px;
}

.Anfrage-MH .btn-anfrage{
	color: white;
	background-color: var(--main-color-1);
	border: none;
	font-size: 90%;
	padding: 15px;
	border-radius: 4px;
	  font-weight: normal;
	text-transform: uppercase;
}


.Anfrage-MH .btn-anfrage:hover{
		color: white;
	background-color: var(--main-color-2);
	  text-decoration: none;
}

.Anfrage-MH .marken{
	margin-top: 30px;
	background-color:#f0eff0;
	padding:20px 0 20px 0;
}

.Anfrage-MH .firmenorder{
	background-color: #136767;
		border-radius: 4px;
	  padding: 20px;
		margin: 20px 0px; 
}

.Anfrage-MH .kreativesdrucken{
	background-color: #ff661f;
		border-radius: 4px;
	  padding: 20px;
	margin: 20px 0px; 
}

.fo-ks-icon-anfrage{
	padding-right: 20px;
}

.Anfrage-MH .firmenrubriken{
	margin: 20px 0px; 
}

.Anfrage-MH .icon-MH{
	margin: 10px 0px; 
}

/* ENDE Anfrage Seite */

/* CSS Document */


@‌keyframes pulsieren {
0% {
transform: scale(1) !important;
}
50% {
transform: scale(1.2) !important;
}
100% {
transform: scale(1) !important;
}
}
.chatbase-bubble {
background-color: green !important; /* Hintergrundfarbe /
animation: pulsieren 3s infinite ease-in-out !important;
width: 60px !important; / Falls du die Größe anpassen willst /
height: 60px !important;
border-radius: 50% !important; / Rundes Design /
bottom: 20px !important; / Abstand nach unten /
right: 20px !important; / Abstand nach rechts /
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3) !important; / Schatteneffekt */
}

/* Container für die Kachel */
.industry-card {
    transition: all 0.3s ease;
    border: 1px solid #eee; /* Ganz feiner Rahmen */
    background: #fff;
    height: 100%; /* Wichtig damit alle gleich hoch sind */
    display: flex;
    flex-direction: column;
}

/* Hover Effekt für die ganze Karte */
.industry-card:hover {
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    transform: translateY(-5px);
    text-decoration: none; /* Unterstrich beim Link entfernen */
}

/* Das Bild */
.industry-img-container {
    overflow: hidden;
    height: 200px; /* Feste Höhe für Gleichmäßigkeit */
}
.industry-img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Bild füllt den Bereich ohne Verzerren */
    transition: transform 0.5s ease;
}
.industry-card:hover .industry-img {
    transform: scale(1.05); /* Leichter Zoom beim Hover */
}

/* Der gelbe Balken */
.industry-bar {
    background-color: var(--main-color-1); /* Dein Gelb-Ton (angepasst aus Screenshot) */
    color: #fff; /* Dunkle Schrift für Lesbarkeit! */
    padding: 10px 15px;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 1.1rem;
}

/* Der Textbereich darunter */
.industry-body {
    padding: 15px;
    flex-grow: 1; /* Füllt den restlichen Platz */
    color: #555;
    font-size: 0.95rem;
    line-height: 1.5;
}

/* Text kürzen mit ... (aus deiner vorherigen Frage) */
.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ... (anderer CSS Code von oben bleibt gleich) ... */

/* Das Bild */
.industry-img-container-2 {
    overflow: hidden;
    height: 200px; /* Feste Höhe für Gleichmäßigkeit */
    
    /* NEU: Zentriert das Bild horizontal und vertikal */
    display: flex; 
    align-items: center;
    justify-content: center;
    background-color: #fff; /* Optional: Weißer Hintergrund für die "leeren" Bereiche */
}

.industry-img-2 {
    /* HIER SIND DIE WICHTIGEN ÄNDERUNGEN */
    max-width: 100%; /* Bild darf nicht breiter als der Container sein */
    max-height: 100%; /* Bild darf nicht höher als der Container sein */
    width: auto;      /* Breite passt sich automatisch an */
    height: auto;     /* Höhe passt sich automatisch an */
    
    object-fit: contain; /* Sorgt dafür, dass das Bild vollständig sichtbar ist */
    
    transition: transform 0.5s ease;
}

/* Der Zoom-Effekt funktioniert weiterhin */
.industry-card:hover .industry-img-2 {
    transform: scale(1.05);
}

/* ... (restlicher CSS Code von oben bleibt gleich) ... */

/* Ergänzung für Kacheln ohne Bild (Icon statt Foto) */
.industry-icon-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa; /* Leichtes Grau statt Weiß für Kontrast */
    color: #ebd02d; /* Dein CI-Gelb für das Icon */
    font-size: 4rem; /* Großes Icon */
}