/* Fonts */
/* open-sans-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v40-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-700 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/open-sans-v40-latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* Farben */

:root {
	--grau: #595756;
	--hellgrau: #dcdcdc;
	--rot: #e20613;
}

.rot {
	color: var(--rot);
}

body {
	background-color: #ffffff;
	font-family: "Open Sans",Helvetica,Arial,sans-serif;
	font-size: 16px;
	color: var(--grau);
	line-height: 1.8em;
}
h1, h2, h3 {
	font-family: "Open Sans",Helvetica,Arial,sans-serif;
	color: var(--grau);
}
h1{
	font-size:36px;
	font-weight: bold;
}

h2{
	font-weight:bold;
	font-size: 30px;
}
h3{
	font-weight: bold;
	font-size: 28px;
}
h4 {
	font-size: 18px;
	font-weight: bold;
}
h5 {
	font-size: 14px;
	font-weight: 500;
}
a:not([class]), a {
	text-decoration: none;
	color: var(--rot);
}
.wf_file_text, a.wf_file {
	color: var(--rot);
	text-decoration: none;
}

.com-content-article h1, .com-content-article h2, 
.com-content-article h3, .com-content-article h4 {
	margin-bottom: 0.5rem;
	margin-top: 1.5rem;
}
 
button.btn-primary, button.btn-primary:hover  {
	background-color: var(--rot);
	border-color: var(--rot);
}

header.container-header {
	background-image: none;
	background-color: transparent;
	padding-top: 10px;
}

header.container-header .suche {
	text-align: right;
	padding-top: 20px;
}

form.mod-finder {
	float: right;
}
#bitFinder .awesomplete input {
	padding: 2px;
}

/* Burger Menü */
#maximenuck110-mobile-bar {
	padding-top: 20px;
}
#maximenuck110-mobile-bar .mobilemenuck-bar-title {
	width: 100px;
	float: right;
	margin-right: 10px;
	color: var(--grau);
	background-color: transparent;
	font-size: 16px;
	font-weight: normal;
}
#maximenuck110-mobile-bar .mobilemenuck-bar-button {
	color: var(--grau);
	background-color: transparent;
	padding-top: 10px;
	top: 18px;
}

#maximenuck110-mobile {
	background-color: #fff;
	box-shadow: -4px -5px 4px var(--hellgrau);
	padding-top: 20px;
}

#maximenuck110-mobile .mobilemenuck-topbar .mobilemenuck-title {
	color: var(--grau);
	background-color: transparent;
	font-weight: normal;
	font-size: initial;
	padding-left: 10px;
}
#maximenuck110-mobile .mobilemenuck-button {
	color: var(--grau);
	font-weight: normal;
}	
#maximenuck110-mobile .mobilemenuck-topbar .mobilemenuck-backbutton {
	color: var(--rot);
	padding-left: 0px;
}
#maximenuck110-mobile .mobilemenuck-backbutton svg {
	fill: var(--rot);
	width: 10px;
}

#maximenuck110-mobile .mobilemenuck-item > .level1, 
#maximenuck110-mobile .mobilemenuck-item > .level2,
#maximenuck110-mobile .mobilemenuck-item > .level3 {
	background-color: #fff;
}
#maximenuck110-mobile .level2, #maximenuck110-mobile .level3  {
	padding-left: 15px;
}
#maximenuck110-mobile a.maximenuck span.titreck-title,
#maximenuck110-mobile span.titreck-text span.titreck-title {
	text-transform: uppercase;
	color: var(--grau);
	font-weight: normal;
	font-size: initial;
	padding-left: 10px;
}
#maximenuck110-mobile a.maximenuck:hover span.titreck-title,
#maximenuck110-mobile .parent:hover span.titreck-title {
	color: var(--rot);
}
#maximenuck110-mobile .maximenuck a,
#maximenuck110-mobile .parent
 {
	border-bottom: 1px solid var(--hellgrau);
}
#maximenuck110-mobile .maximenuck.active a {
	border-bottom: 1px solid var(--rot);
}
#maximenuck110-mobile .maximenuck.active a span.titreck-title {
	color: var(--rot);
}
#maximenuck110-mobile .mobilemenuck-togglericon:after {
	font-family: "Font Awesome 6 Free";
	content:"\f054";
	background-color: transparent;
	color: var(--grau);
	font-weight: bold;
	font-size: 20px;
	width: 100%;
	text-align: right;
	padding-right:15px;
}

#mobilemenuck-bottom-module {
	margin-top: 70px;
	margin-left: 30px;
	color: var(--grau);
	font-weight: normal;
	font-size: 14px;
}
#mobilemenuck-bottom-module p {
	margin-bottom:0px;
}

#mobilemenuck-bottom-module .contact-icon {
	display: inline-block;
	width: 35px;
}
#mobilemenuck-bottom-module .rot, #mobilemenuck-bottom-module .rot a {
	font-size: 1.3rem;
	color: var(--rot);
	font-weight: normal;
}
#mobilemenuck-bottom-module .rot a {
	display: inline;
}


/* Slider oben Startseite und Unternehmen */
.container-banner {
	position: relative;
}
.container-banner .banner.small {
	display: none;
}
body.itemid-101 .container-banner, body.itemid-122 .container-banner {
	margin-top: -165px;
}

.container-banner .carouselimgs .carousel-cell, 
.container-banner .carouselimgs .carousel-cell img,
.container-banner > .mod-custom img {
	width: 100%;
}



/* Header bei kleinen Ansichten */
@media (width < 980px) {
	body.itemid-101 .container-banner,body.itemid-122 .container-banner  {
		margin-top: 0px;
	}
}
@media (width < 768px) {
	#maximenuck110-mobile-bar .mobilemenuck-bar-title,
	.social-title	{
		display: none;
	}
	#socialLinks button {
		padding-left: 5px;
		padding-right: 5px;
	}
	.container-header .container-nav {
		display: block;
	}
	.container-header .container-nav .logo {
		float: left;
		width: 40%;
	}
	.container-header .container-nav .suche {
		width: auto;
		float: right;
		margin-right: 40px;
	}
	
	.container-banner .banner.large {
		display: none;
	}
	.container-banner .banner.small {
		display: initial;
	} 
}

@media (width < 480px) {
	#maximenuck110-mobile {
		width: 100% !important;
	}
}

/* Slogan Startseite */
.banner.slogan {
/*	background-color: var(--hellgrau); */
	background-color: var(--grau);
	color: var(--hellgrau);
	border-bottom: 3px solid var(--rot);
}
.banner.slogan .mod-custom {
	width: 100%;
	max-width: 1320px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 40px;
	padding-bottom: 30px;
	font-size: 18px;
}
.banner.slogan .large {
	display: flex;align-items:flex-end;
}
.banner.slogan .medium, .banner.slogan .small {
	display: none;
}
.banner.slogan .mod-custom p {
	margin-bottom: 0px;
}
.banner.slogan .slogan-grey {
	font-size:36px;
	font-weight: bold;
}
/*
.banner.slogan .slogan-red {
	font-size:26px;
	font-weight: bold;
	color: var(--rot);
}*/
.banner.slogan .sub-slogan {
	clear: both;
	display: block;
	margin-top: -20px;
}
.banner.slogan img {
	display: inline;
	max-height: 100px;
}

@media (width < 1350px) {
  .banner.slogan .mod-custom {
	padding-left: 15px;
	padding-right: 15px; 
  }
}
@media (width < 800px) {
	.banner.slogan .large {
		display: none;
	}
	.banner.slogan .medium {
		display: initial;
	}
	.banner.slogan .sub-slogan {
		margin-top: 30px;
	}
	.banner.slogan .medium .slogan-grey::nth-child(2){
		margin-top: -30px;
		display: block;
	}
}
@media (width < 600px) {
	.banner.slogan .medium {
		display: none;
	}
	.banner.slogan .small {
		display: initial;
		font-size: 20px;
	}
	.banner.slogan .slogan-grey {
		display: block;
		margin-bottom: 20px;
		line-height: 1.2em;
	}
	.banner.slogan .sub-slogan {
		margin-top: 10px;
		margin-bottom: 10px;
	}
}

/* Text + Bild Startseite */
body.itemid-101 .container-component {
	flex-direction: row;
}
body.itemid-101 .container-component img {
	padding-right: 3em;
}


@media (width > 768px) {
	@keyframes slide-left {
		from {margin-left:-200px;}
		to {margin-left: 0px;}
	}
	@keyframes slide-right {
		from {margin-left:700px;padding-left:200px}
		to {margin-left: 0px;padding-left:0px;}
	}

	body.itemid-101 .container-component div:nth-child(2) {
		animation-name: slide-right;
		animation-duration: 2s;
		}
	body.itemid-101 .container-component div:first-child {
		animation-name: slide-left;
		animation-duration: 2s;
	}
}
@media (width < 768px) {
	.d-sm-none {
		display: none;
	}
}

/* Vielfalt Startseite, Stellenangebote */
@media (width < 1350px) {
  .container-bottom-a  .grid-child {
	padding-left: 15px;
	padding-right: 15px; 
  }
}
.container-bottom-a {
	color: #fff;
	background-color: var(--grau);
	margin-top: 3em;
}
.container-bottom-a  .grid-child, .container-bottom-b .grid-child {
	margin-left: auto;
	margin-right: auto;
	padding-top: 2em;
	padding-bottom: 2em;
}
body.itemid-125 .container-bottom-a  .grid-child {
	padding-top: 4em;
	padding-bottom: 1em;
}
.container-bottom-a .bottom-a {
	width: 100%;
}
.container-bottom-a h2, .container-bottom-a h1 {
	color: #fff;
}
#tischler-cube {
	position: relative;
	top: -6em;
	height: 70px;
}
@media (width < 480px) {
	#tischler-cube {
		position: absolute;
		right: 0px;
		top: -4em;
		width: 40%;
	}
	.container-bottom-a .bottom-a {
		width: 60%;
	}
}

.container-bottom-a h1 {
	font-size: 48px;
}
.container-bottom-a .wf-columns {
	align-items: flex-end;
}
#quereinsteiger {
	position: absolute;
	top: -4em;
	height: 70px;
	width: 100%;
}
#quereinsteiger img {
	width: 55%;
	margin-left: auto;
	margin-right: auto;
	display: block;
	min-width: 300px;
	max-width: 500px;
}
@media (width < 768px) {
	#quereinsteiger {
		top: -3em;
	}
}

#wirsuchendich {
	position: absolute;
	bottom: 7em;
	right: 20%;
/*	height: 40px; */
	width: 15vw;
}
#wirsuchendich img {
	margin-left: auto;
	margin-right: auto;
	display: block;
	min-width: 200px;
	max-width: 300px;
}
@media (width < 1200px) {
	#wirsuchendich {
		bottom: 10em;
	}
}
@media (width < 768px) {
	#wirsuchendich {
		bottom: 17em;
	}
}
@media (width < 640px) {
	#wirsuchendich {
		bottom: 22em; 
		right: 30%;
	}
}
@media (width < 480px) {
	#wirsuchendich {
		bottom: 23em; 
		right: 40%;
	}
}

.container-bottom-b {
	background: url('../images/00_paralax_saegeblatt.jpg');
	background-size: cover;
	background-attachment: fixed;
}
.container-bottom-b .grid-child {
	justify-content: center;
	padding-top: 150px;
	padding-bottom: 150px;
}
.container-bottom-b h2, .container-bottom-b h3 {
	text-align: center;
	color: var(--rot);
	font-size: 30px;
	font-weight: bold;
	background-color: var(--hellgrau);
	padding-top: 20px;
	padding-bottom: 10px;
}
.container-bottom-b h2 {
	width: 95%;
	margin-left: auto;
	margin-right: auto;
	box-shadow: 8px 8px 10px var(--grau);
}
.container-bottom-b h3 {
	padding-left: 10px;
	padding-right: 10px;
	box-shadow: 4px 5px 10px var(--grau);
}

/* Produkt-Slider */
.container-bottom-c .bottom-c {
	width: 100%;
	max-width: 1320px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 50px;
}

.container-bottom-c .bottom-c h3 {
	color: var(--grau);
	margin-bottom: 20px;
}
body.itemid-125 .container-bottom-c .bottom-c h3 {
	color: var(--rot);
}
.carouselproducts {
	padding-left: 100px;
	padding-right: 100px;
	margin-top: 40px;
	margin-bottom: 40px;
}
.carouselproducts .flickity-viewport {
	min-height: 209px;
}
.carouselproducts .flickity-slider {
	display: flex;
	align-items: center;
}
.carouselproducts .carousel-cell {
	padding-left: 50px;
	padding-right: 50px;
	width: 25%;
	text-align: center;
}
.carouselproducts .carousel-cell a {
	color: var(--grau);
	display: flex;
	justify-content: center;
}
.carouselproducts .carousel-cell a:hover {
	color: var(--rot);
}
.carouselproducts img.sliderpic {
	max-width: 160px;
}
.carouselproducts img.sliderpic.red {
	display: none;
}
.carouselproducts .carousel-cell a:hover img.sliderpic.red {
	display: block;
}
.carouselproducts .carousel-cell a:hover img.sliderpic.grey {
	display: none;
}
.carouselproducts .carousel-cell h4 {
	margin-top: 20px;
	text-indent: -15px;
}

@media (width < 1350px) {
  .container-bottom-c .bottom-c, .container-bottom-d .bottom-d {
	padding-left: 15px;
	padding-right: 15px; 
  }
}
@media (width < 980px) {
	.carouselproducts .carousel-cell {
		width: 33%;
	}
}
@media (width < 768px) {
	.carouselproducts .carousel-cell {
		width: 50%;
		padding-left: 30px;
		padding-right: 30px;
	}
	.carouselproducts {
		padding-left: 10px;
		padding-right: 10px;
	}
}
@media (width < 480px) {
	.carouselproducts .carousel-cell {
		width: 100%;
	}
	.carouselproducts {
		padding-left: 0px;
		padding-right: 0px;
	}
}

/* Fragen Startseite */
.container-bottom-d {
	background-color: var(--rot);
	color: #fff;
	margin-top: 50px;
}
.container-bottom-d .bottom-d {
	margin-top: 30px;
	margin-bottom: 30px;
}
.container-bottom-d .bottom-d:nth-child(2) {
	text-align: right;
}
.container-bottom-d .bottom-d a, .container-bottom-d .bottom-d h3 {
	color: #fff;
}
@media (width < 768px) {
	.container-bottom-d .grid-child {
		flex-direction: column;
	}
	.container-bottom-d .bottom-d:nth-child(2) {
		text-align: left;
	}
}

/* Footer */
footer.container-footer {
	margin-top: 0px;
	background-color: var(--hellgrau);
	background-image: none;
	color: var(--grau);
}
footer .footer-left, footer .footer-right {
	background-color: var(--hellgrau);
	background-image: none;
	color: var(--grau);
}
footer .footer-left h2 {
	text-transform: uppercase;
}
footer .footer-left p {
	display: block;
	float: left;
}
footer .footer-left img {
	margin-top: -80px;
	width: 400px;
}
footer .footer-right img {
	max-width: 70%;
	float: right;
}
footer.container-footer .grid-child {
	padding-left: 0px;
	padding-right: 0px;
	align-items: flex-start;
}
footer.container-footer .grid-child a:hover {
	color: var(--rot);
}
@media (width < 1350px) {
  footer.container-footer .grid-child {
	padding-left: 15px;
	padding-right: 15px; 
  }
}
@media (width < 1100px) {
	footer .footer-left, footer .footer-right {
		width: 100%;
	}
}
@media (width < 768px) {
	footer .footer-left img {
		margin-top: 0px;
	}
	
}
/* bottom Menü */
footer.container-footer.bottom .grid-child {
	padding-top: 0px;
	padding-bottom: 0px;
	justify-content: flex-end;
}
footer.bottom .grid-child ul.mod-menu {
	flex-direction: row;
	margin-top: -150px;
}
footer.bottom .grid-child ul.mod-menu li a, footer.bottom .grid-child ul.mod-menu li span {
	text-transform: uppercase;
	color: var(--grau);
	padding-left: 10px;
	padding-right: 10px;
}
footer.bottom .grid-child ul.mod-menu li a:hover, footer.bottom .grid-child ul.mod-menu li.active a {
	text-decoration: none;
	color: var(--rot);
}
@media (width < 768px) {
	footer.container-footer.bottom .grid-child {
		align-items: flex-end;
	}
	footer.bottom .grid-child ul.mod-menu {
		margin-top: 0px;
	}
}

/* Balbooa Gallery */
.com-content-article .ba-gallery .category-filter a:hover, .ba-gallery .category-filter a.ba-filter-active {
}

/* Bewerbungsformular */
#cf_1 {
	margin-bottom: 60px;
}
#cf1 .cf-form-wrap {
	padding: 0px;
}
.cf-control-input input.cf-input::placeholder, .cf-control-input textarea.cf-input::placeholder {
	color: var(--grau);
	opacity: 1;
}
.cf-control-input input.cf-input::-ms-input-placeholder, .cf-control-input textarea.cf-input::-ms-input-placeholder {
	color: var(--grau);
	opacity: 1;
}
button.cf-btn {
	text-align: left;
}
button.cf-btn::after {
	font-family: "Font Awesome 6 Free";
	content:"\f054";
	font-weight: bold;
	float: right;
}

/* Suche */
.result__description mark, .result__title-text mark {
	background-color: var(--rot);
	color: #fff;
}

/* Partner */
body.itemid-126 .wf-columns {
	align-items: center;
	height: 220px;
	margin-top: -1px;
}
body.itemid-126 .wf-columns .wf-column {
	padding: 20px;
	border-left: 1px solid var(--grau);
	border-bottom: 1px solid var(--grau);
	border-top: 1px solid var(--grau);
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
body.itemid-126 .wf-columns .wf-column:last-child {
  border-right: 1px solid var(--grau);
}
body.itemid-126 .wf-columns .wf-column img {
	max-height: 180px;
	max-width: 90%;
}