/*
* Created by CeLa
* Copyright by Amdre GmbH
* Main Theme CSS
*/

/* Titillium Web */
@font-face {
  font-display: swap;
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/titillium-web-300.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/titillium-web-regular.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 600;
	src: url('../fonts/titillium-web-600.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 700;
	src: url('../fonts/titillium-web-700.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 900;
	src: url('../fonts/titillium-web-900.woff2') format('woff2');
}

/*
 * Default styles
 */
:root {
	--base-color: #322f31;
	--pri-color: #00617a;
	--sec-color: #007b8e;
	--light-blue: #D3E0EA;
	--light-grey: #F6F5F5;
}

/*
 * Base styles
 */
html,
body {
	margin: 0;
	padding: 0;
	font-display: swap;
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 400;
}
body {
	background-color: transparent;
	background-image: url('../images/main-section-bg.png'), url('../images/main-section-bg.png');
	background-repeat: no-repeat;
	background-position: -10% 12%, 85% -10%;
}
/*
 * Headline styles
 */

.sppb-section.heading > .sppb-row-container .sppb-title-heading {
	font-weight: 700 !important;
	text-transform: uppercase;
	color: var(--pri-color);
}
.sppb-section.heading > .sppb-row-container h2.sppb-title-heading {
	font-size: 2.5rem;
}

.sppb-addon.heading > .sppb-addon-title {
	color: var(--pri-color);
	font-weight: 700;
	text-transform: uppercase;
}
.sppb-addon.heading > h2.sppb-addon-title {
	font-size: 2.5rem;
}

/*
 * Text styles
 */
.uppercase {
	text-transform: uppercase;
}
.lowercase {
	text-transform: lowercase;
}
.text-bold {
	font-weight: 800;
}
.text-left {
	text-align: left ! important;
}
.text-xs {
	font-size: 0.875rem;
}
.text-sm {
	font-size: 1rem;
}
.text-md {
	font-size: 1.125rem;
}
.text-lg {
	font-size: 1.25rem;
}
.text-xl {
	font-size: 1.5rem;
}

strong {
	font-weight: 700;
}
@media(min-width: 768px){
	.two-column .sppb-addon-content,
	.column-two .sppb-addon-content {
		column-count: 2;
		column-gap: 30px;
	}
}


/* 
 * List styles
 */
ul.list-arrow,
ul.list-dots,
ul.list-check,
ul.list-plus {
	list-style: none;
	margin: 0;
	padding: 0;
}
ul.list-arrow li,
ul.list-dots li,
ul.list-check li,
ul.list-plus li {
	position: relative;
	padding-left: 25px;
}
ul.list-arrow li:before,
ul.list-dots li:before,
ul.list-check li:before,
ul.list-plus li:before {
	position: absolute;
	top: 5px;
	left: 2px;
	line-height: 1;
	color: var(--pri-color);
}
ul.list-arrow li:before {
	content: "\00BB";
	font-weight: 800;
	font-size: 1.25rem;
}
ul.list-dots li:before {
	content: "\2022";
	font-weight: 800;
	font-size: 1.25rem;
}
ul.list-check li:before {
	content: "\2714";
	position: absolute;
	top: 6px;
}
ul.list-plus li:before {
	content: "\271A";
	position: absolute;
	top: 6px;
	font-weight: 300 !important;
}

/*
 * Colors
 */
.pri-color {
	color: var(--pri-color);
}
.sec-color {
	color: var(--sec-color);
}
.base-color {
	color: var(--base-color);
}


/*
 * Content sizes
 */
.sppb-column.content-xs,
.sppb-column.content-sm,
.sppb-column.content-md,
.sppb-column.content-lg,
.sppb-column.content-xl {
	margin: 0 auto;
}
.sppb-column.content-xs {
	max-width: 480px;
}
.sppb-column.content-sm {
	max-width: 600px;
}
.sppb-column.content-md {
	max-width: 768px;
}
.sppb-column.content-lg {
	max-width: 992px;
}
.sppb-column.content-xl {
	max-width: 1140px;
}


/*
 * Section styles
 */
@media(min-width: 600px){
	.section-xs > .sppb-row-container {
		max-width: 600px !important;
		margin: 0 auto !important;
	}
}
@media(min-width: 768px){
	.section-sm > .sppb-row-container {
		max-width: 768px !important;
		margin: 0 auto !important;
	}
}
@media(min-width: 992px){
	.section-md > .sppb-row-container {
		max-width: 900px !important;
		margin: 0 auto !important;
	}
}
@media(min-width: 1140px){
	.section-lg > .sppb-row-container {
		max-width: 1140px !important;
		margin: 0 auto !important;
	}
}
@media(min-width: 600px){
	.content-xs {
		max-width: 600px !important;
		margin: 0 auto !important;
	}
}
@media(min-width: 768px){
	.content-sm {
		max-width: 768px !important;
		margin: 0 auto !important;
	}
}
@media(min-width: 900px){
	.content-md {
		max-width: 900px !important;
		margin: 0 auto !important;
	}
}
@media(min-width: 1140px){
	.content-lg {
		max-width: 1140px !important;
		margin: 0 auto !important;
	}
}

.v-center.sppb-column > .sppb-column-addons {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.btn-custom {
	padding: 12px 24px;
	font-weight: 600;
	font-size: 1.125rem;
	text-transform: uppercase;
	background: rgb(0,101,122);
	background: linear-gradient(
		90deg,
		rgba(0,101,122,1) 25%,
		rgba(0,130,144,1) 100%
	);
	color: rgba(255,255,255,1);
	border: 0;
}
a.btn-custom:hover {
	color: rgba(255,255,255,.6);
}

/*
 * Overrides
 */
@media (min-width: 1200px) {
    .sppb-row-container {
        max-width: 1320px !important;
    }
}
@media (min-width: 992px) {
	#offcanvas-toggler {
		display: none !important;
	}
}
.offcanvas-overlay {
	display: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/* Header */
@media (max-width: 992px) {
	#sp-header {
		height: 80px;
		padding-top: 12px;
		padding-bottom: 12px;
	}
}

/*
 * Main Navbar
 */
#sp-header {
	height: auto;
	box-shadow: none;
	z-index: 120;
}
#sp-header > .container {
	padding-left: 0;
	padding-right: 0;
	max-width: 100%;
}
#sp-header > .container > .container-inner > .row {
	flex-direction: column-reverse;
}
#sp-menu {
	padding-top: 25px;
	background-color: var(--pri-color);
	color: #fff;
}
#sp-menu > .justify-content-end {
	justify-content: center !important;
}
#sp-logo {
	margin: 60px auto 0 auto;
	max-width: 600px;
	padding-right: 30px;
	padding-left: 30px;
}
#sp-logo > .sp-column {
	text-align: center;
}
#sp-logo > .sp-column .logo {
	height: auto;
}
.logo-image  {
	height: auto;
	max-width: 100%;
}
/* Main navbar */
#sp-menu {
	
}
.sp-megamenu-wrapper ul.sp-megamenu-parent > li > a {
	padding: 15px 20px !important;
	text-transform: uppercase;
	font-size: 1.125rem;
	font-weight: 300;
	line-height: normal;
}
.sp-megamenu-wrapper ul.sp-megamenu-parent > li > a,
.sp-megamenu-wrapper ul.sp-megamenu-parent > li > a:visited {
	color: #fff;
}
.sp-megamenu-wrapper ul.sp-megamenu-parent > li > a:hover,
.sp-megamenu-wrapper ul.sp-megamenu-parent > li > a:active,
.sp-megamenu-wrapper ul.sp-megamenu-parent > li > a:focus {
	color: #edf6f8;
}

/*
 * Footer styles
 */
.footer-contact-section {
	background: rgb(0,101,122);
	background: linear-gradient(
		90deg,
		rgba(0,101,122,1) 25%,
		rgba(0,130,144,1) 100%
	);
	color: #fff;
}
@media(max-width: 991px){
	.footer-branding .sppb-addon-content .sppb-addon-single-image-container img {
		max-width: 320px;
	}
}

.footer-contact-section a,
.footer-contact-section a:visited {
	color: #fff !important;
}
.footer-contact-section a:hover,
.footer-contact-section a:active,
.footer-contact-section a:focus {
	color: #edf6f8 !important;
}
.footer-contact {
	font-size: 1.125rem;
	text-transform: uppercase;
}
.footer-navbar-section {}
.footer-navbar ul.menu li {
	padding-right: 10px;
	padding-left: 10px;
	margin: 0 !important;
}
.footer-navbar ul.menu li:not(:first-child) {
	border-left: 1px solid var(--base-color);
}
.footer-navbar ul.menu li a {
	text-transform: uppercase;
}
.footer-navbar ul.menu li a,
.footer-navbar ul.menu li a:visited {
	color: var(--base-color) !important;
}
.footer-navbar ul.menu li a:hover,
.footer-navbar ul.menu li a:active,
.footer-navbar ul.menu li a:focus {
	color: var(--sec-color) !important;
}

/*
 * Main section
 */
.main-section {}

.fixed-navbar-module {
	position: fixed;
	z-index: 1001;
	right: 10%;
	top: 300px;
}
.fixed-navbar {
	margin: 0;
	padding: 0;
	list-style: none;
}
.fixed-navbar > li:not(:first-child){
	margin-top: 15px;
}
.fixed-navbar > li > a {
	display: block;
	height: 60px;
	width:60px;
	line-height: 65px;
	text-align: center;
	transition: all ease-in-out .25s;
	-webkit-box-shadow: 6px 6px 6px 0px rgba(0,0,0,0.25); 
	box-shadow: 6px 6px 6px 0px rgba(0,0,0,0.25);
}
.fixed-navbar > li > a,
.fixed-navbar > li > a:visited {
	color: #fff !important;
	background-color: var(--pri-color);
}
.fixed-navbar > li > a:hover,
.fixed-navbar > li > a:active,
.fixed-navbar > li > a:focus {
	opacity: .75;
}
.fixed-navbar > li > a i {
	font-size: 1.85rem;
	line-height: 0;
}

/*
 * Startpage - Service section
 */
.hkl-service {}
.hkl-service .sppb-addon-body {
	padding: 45px 30px;
}
.hkl-service .sppb-addon-image {
	margin-bottom: 0;
}
.hkl-service .sppb-addon-body .sppb-image-content-title,
.hkl-service .sppb-addon-body .sppb-image-content-text {
	display: inline !important;
}
.hkl-service .sppb-addon-body .sppb-image-content-title {
	padding-right: 10px;
	text-transform: lowercase;
	font-weight: 600;
}

/*
 * Startpage - Visual section
 */
.visual-section {}

.separator-home-section {
	position: relative;
	z-index: 95;
}
.separator-home-section:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 100;
	background-color: rgba(0,85,100,.80);
}
.separator-home-section > .sppb-row-container {
	position: relative;
	z-index: 105;	
}
.separator-home-section .sppb-section-title {
	margin-bottom: 0 !important;
}
.separator-home-section .sppb-section-title .sppb-title-heading {
	color: #fff !important;
}

/*
 * Startpage - Full service section
 */
.full-service-section {}
.service-image .sppb-addon-image {
	margin-bottom: 0;
}
.service-image .sppb-addon-body .sppb-image-content-title,
.service-image .sppb-addon-body .sppb-image-content-text {
	display: inline !important;
}
.service-image {
	position: relative;
	z-index: 98;
	overflow: hidden;
	cursor: pointer;
}
.service-image .sppb-addon-body .sppb-image-content-title {
	padding-right: 10px;
	font-weight: 600;
}
.service-image .sppb-addon-body {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 30px;
	color: #fff;
	font-size: 1.125rem;
	font-weight: 300;
	z-index: 102;
	transition: all ease-in-out .25s;
	transform: translateY(100%);
	opacity: 0;
}
.service-image:hover .sppb-addon-body {
	transform: translateY(0%);
	opacity: 1;
}
.service-image.bg-green .sppb-addon-body {
	background-color: rgba(0,95,45,.9);
}
.service-image.bg-orange .sppb-addon-body {
	background-color: rgba(184,90,28,.9);
}
.service-image.bg-blue .sppb-addon-body {
	background-color: rgba(0,66,122,.9);
}

.main-service-outer > div,
.main-service-outer > div > div,
.main-service-outer > div > div > div {
	display: block;
	height: 100%;
}
.main-service {
	height: calc(100% - 30px);
	display: flex;
	flex-direction: column;
}
.main-service .sppb-addon-body {
	flex-grow: 1;
	padding: 30px;
	color: #fff;
	background: rgb(0,101,122);
	background: linear-gradient(
		90deg,
		rgba(0,101,122,1) 25%,
		rgba(0,130,144,1) 100%
	);
}
.main-service .sppb-addon-body .sppb-image-content-title {
	margin: 0 10px 0 0;
	padding: 0;
	line-height: .9;
	float: left;
	font-weight: 600;
	font-size: 1.35rem;
}
	
/*
 * Startpage - Disturber
 */
.disturber-text-column > .sppb-column-addons {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.disturber-text .sppb-addon-title {
}
@media (max-width: 767px){
	.disturber-text .sppb-addon-title {
		font-size: 3rem !important;
	}
}
@media (min-width: 768px) and (max-width: 991px){
	.disturber-text .sppb-addon-title {
		font-size: 3.5rem !important;
	}
}
@media (min-width: 992px){
	.disturber-text .sppb-addon-title {
		font-size: 4.5rem !important;
	}
}
.disturber-text .sppb-addon-content {
	margin-top: 30px;
	font-size: 1.875rem;
	font-weight: 300;
	color: var(--base-color);
}

/*
 * Visual styles
 */
.visual-popup-outer {
	max-width: 1000px;
	margin: 0 auto;
}
.visual-popup-outer > .sppb-column-addons {
	position: relative;
	z-index: 98;
	display: inline-block !important;
	width: auto !important;
	margin: 0 auto;
}
.visual-popup {
	position: absolute;
	z-index: 102;
}
.visual-popup .sppb-addon-image {
	cursor: pointer;
}
.visual-popup .sppb-addon-body {
	position: absolute;
	left: 50%;
	padding: 20px;
	width: 400px;
	color: #fff;
	transform: translateX(-50%);
	opacity: 0;
	transition: opacity ease-in-out .25s;
}
.visual-popup.show-info .sppb-addon-body,
.visual-popup:hover .sppb-addon-body {
	opacity: 1;
}
.visual-popup .sppb-addon-body .sppb-image-content-title {
	text-transform: lowercase;
}
.visual-popup .sppb-addon-body .sppb-image-content-title,
.visual-popup .sppb-addon-body .sppb-image-content-text {
	display: inline !important;
}
.visual-popup .sppb-addon-body .sppb-image-content-title {
	padding-right: 10px;
	font-weight: 600;
}
/*
 * Popups
 */
.biogas-popup {
	top: 70%;
	right: 5%;
}
.biogas-popup .sppb-addon-body {
	background: rgb(0,98,51);
	background: linear-gradient(
		60deg, 
		rgba(0,98,51,1) 40%, 
		rgba(29,173,74,1) 100%
	);
}
.logistik-popup {
	top: 6%;
	left: 70%;
}
.logistik-popup .sppb-addon-body {
	background: rgb(0,69,127);
	background: linear-gradient(
		60deg,
		rgba(0,69,127,1) 40%,
		rgba(58,119,186,1) 100%
	);
}
.agrar-popup {
	top: 70%;
	left: 5%;
}
.agrar-popup .sppb-addon-body {
	background: rgb(182,91,38);
	background: linear-gradient(
		60deg,
		rgba(182,91,38,1) 40%,
		rgba(228,172,20,1) 100%
	);
}


/*
 * Career Page
 * 
 * Main section
 */
.career-header {
	position: relative;
	z-index: 105 !important;
}
 
/* Speed application*/
.speed-application {
	padding: 20px 40px;
	text-align: center;
	-webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.5);
}
.speed-application {
	background-color: #fff;
}
@media(min-width: 992px){
	.speed-application {
		position: absolute;
		width: 400px;
		bottom: -30px;
		/*
		right: calc(50vw - (1450px/2));
		*/
		left: 0px;
		z-index: 301;
	}
}
.speed-application .sppb-addon-image {
	margin-bottom: 5px;
}
@media(max-width: 991px){
	.speed-application .sppb-addon-image > img {
		max-width: 320px;
		margin: 0 auto;
		height: auto;
	}
}
@media(min-width: 992px){
	.speed-application .sppb-addon-image > img {
		max-width: 25%;
		margin: 0 auto;
		height: auto;
	}
}
.speed-application .sppb-image-content-title {
	margin-top: 15px;
	font-weight: 600;
	text-transform: uppercase;
	font-size: 1.75rem;
	line-height: 1;
	color: var(--pri-color);
}
.speed-application .sppb-image-content-text {
	font-weight: 500;
	font-size: 1.125rem;
	color: var(--pri-color) !important;
}
.speed-application .sppb-addon-body .sppb-btn-custom {
	padding: 12px 24px;
	font-weight: 700;
	font-size: 1.25rem;
	text-transform: uppercase;
	background: rgb(0,101,122);
	background: linear-gradient(
		90deg,
		rgba(0,101,122,1) 25%,
		rgba(0,130,144,1) 100%
	);
	color: #fff;
	border: 0;
}

/*
 * Benefits section
 */
.benefits-section {
	position: relative;
	z-index: 100;
}
.benefit-info {}
.benefit-info figure.sppb-addon-image {}
.benefit-info .sppb-addon-body {}
.benefit-info .sppb-addon-body .sppb-image-content-subtitle {}
.benefit-info .sppb-addon-body .sppb-image-content-title {
	font-weight: 700;
	font-size: 1.5rem;
	text-transform: uppercase;
	color: var(--base-color);
}
.benefit-info .sppb-addon-body .sppb-image-content-text {}

/*
 * Facts section
 */
.facts-section {}
.facts-section .branding .sppb-addon-single-image-container img {
	max-width: 500px;
	height: auto;
}
.fact-item {}
.fact-item .sppb-animated-number {
	font-size: 5rem;
	font-weight: 700;
}
.fact-item .sppb-animated-number-title {
	text-transform: uppercase;
	font-size: 1.5rem;
}

/*
 * Process Section Styles
 */
.carriere-prozess {
	position: relative;
	z-index: 99;
	cursor: help;
	background-color: #d9e8ee;
}
.carriere-prozess .sppb-addon-image {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 100;
	transform: translate(-50%, -50%);
	cursor: pointer;
}
.carriere-prozess .sppb-addon-image:after {
	content: 'Mehr erfahren';
	display: block;
	margin-top: 20px;
	opacity: 1;
	transition: opacity ease-in-out .25s;
	color: var(--sec-color);
	text-transform: uppercase;
	font-size: 1.125rem;
}
.carriere-prozess:hover .sppb-addon-image:after {
	opacity: 0;
}
.carriere-prozess .sppb-addon-image img {
	margin: 0 auto;
}
.carriere-prozess .sppb-addon-body {
	position: relative;
	padding: 30px;
	background: rgba(255,255,255,.9);
	text-align: center;
	opacity: 0;
	transition: all .25s ease-in-out;
	z-index: 102;
	display: flex;
	flex-direction: column;
}
.carriere-prozess .sppb-addon-body .sppb-image-content-title {
	min-height: 35px;
	font-weight: 700 !important;
	color: var(--pri-color);
}
.carriere-prozess .sppb-addon-body .sppb-image-content-text {
	flex-grow: 1;
	color: var(--pri-color);
}
@media (min-width: 992px){
	.carriere-prozess .sppb-addon-body {
		min-height: 250px;
	}
}
.carriere-prozess.show-body .sppb-addon-body,
.carriere-prozess:hover .sppb-addon-body {
	opacity: 1;
}
.carriere-prozess .sppb-addon-body .sppb-image-content-title {
	margin-top: 0;
	text-transform: uppercase;
	font-size: 1.25rem;
	font-weight: 700;
}

/*
 * Contact section
 */
@media(max-width: 991px){
	.carriere-contact-person .sppb-addon-image img {
		max-width: 480px;
		margin: 0 auto;
	}
	.carriere-contact-person .sppb-addon-body {
		margin-bottom: 75px;
	}
}
@media(min-width: 992px){
	.carriere-contact-person {
		display: flex;
		flex-direction: row-reverse;
	}
	.carriere-contact-person .sppb-addon-image {
		flex-basis: 40%;
		overflow: hidden;
		margin-bottom: 0;
	}
	.carriere-contact-person .sppb-addon-image img {
		transform: translateY(15%);
		margin-top: -15%;
	}
}
.carriere-contact-person .sppb-addon-body {
	text-align: center;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.carriere-contact-person .sppb-addon-body .sppb-addon-title {
	display: block !important;
}
.carriere-contact-person .sppb-addon-body .sppb-image-content-subtitle {
	text-transform: uppercase;
	color: var(--pri-color);
	font-weight: 600;
	font-size: 1.25rem;
	letter-spacing: 2px;
}
.carriere-contact-person .sppb-addon-body .sppb-image-content-title {
	text-transform: uppercase;
	color: var(--pri-color);
	font-size: 2.5rem;
	font-weight: 700;
}
.carriere-contact-person .sppb-addon-body .sppb-btn-custom {
	display: inline-block !important;
	margin: 0 auto;
	padding: 12px 24px;
	width: 50% !important;
	background: rgb(0,101,122);
	background: linear-gradient(
		90deg,
		rgba(0,101,122,1) 25%,
		rgba(0,130,144,1) 100%
	);
	color: #fff;
	font-weight: 600;
	font-size: 1.25rem;
	letter-spacing: 2px;
	text-transform: uppercase;
}
.carriere-contact-person .sppb-addon-body .sppb-btn-custom:hover {
	background: rgb(0,101,122);
	background: linear-gradient(
		90deg,
		rgba(0,101,122,1) 45%,
		rgba(0,130,144,1) 100%
	);
}


/*
 * Groups page styles
 */
@media(min-width: 576px){
	.group-image .sppb-addon-single-image-container img {
		max-height: 55px;
		width: auto;
	}
}

.groups-section {}
@media(min-width: 992px){
	.group-details {
		display: flex;
	}
	.group-details .sppb-addon-image {
		margin-bottom: 0;
		flex-basis: 40%;
	}
	.group-details .sppb-addon-body {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
}
.group-details {
	position: relative;
	z-index: 95;
}
.group-details:before {
	content: '';
	position: absolute;
	width: 120px;
	height: 120px;
	z-index: 105;
	background-color: rgba(0,0,0,.2);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	transform: translate(-30%, -30%);
	-webkit-box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.2);
	-webkit-border-radius: 60px;
	-moz-border-radius: 60px;
	border-radius: 60px;
}
.group-details.gruppe-biogas:before {
	background-image: url(../images/symbole-biogas.png);
}
.group-details.gruppe-agrar:before {
	background-image: url(../images/symbole-agrar.png);
}
.group-details.gruppe-logistik:before {
	background-image: url(../images/symbole-logistik.png);
}
.group-details .sppb-addon-body {
	padding: 60px;
	color: #fff;
}
.group-details .sppb-addon-body .sppb-image-content-title {
	font-weight: 600;
	font-size: 1.5rem;
	display: block;
}
.group-details .sppb-addon-body .sppb-image-content-text {
	font-size: 1.125rem;
}
.group-details .sppb-addon-body {
	position: relative;
	z-index: 95;
}
.group-details .sppb-addon-body:after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 135px;
	z-index: 105;
	transform: translateY(35%);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% auto;
}
.group-details.gruppe-biogas .sppb-addon-body {
	background: rgb(0,98,51);
	background: linear-gradient(
		45deg, 
		rgba(0,98,51,1) 0%, 
		rgba(31,176,74,1) 100%
	);
}
.group-details.gruppe-biogas .sppb-addon-body:after {
	background-image: url(../images/hkl-biogas-light.png);
}
.group-details.gruppe-agrar .sppb-addon-body {
	background: rgb(182,91,38);
	background: linear-gradient(
		45deg, 
		rgba(182,91,38,1) 0%, 
		rgba(218,167,16,1) 100%
	);
}
.group-details.gruppe-agrar .sppb-addon-body:after {
	background-image: url(../images/hkl-agrar-light.png);
}
.group-details.gruppe-logistik .sppb-addon-body {
	background: rgb(0,69,127);
	background: linear-gradient(
		45deg, 
		rgba(0,69,127,1) 0%, 
		rgba(61,122,189,1) 100%
	);
}
.group-details.gruppe-logistik .sppb-addon-body:after {
	background-image: url(../images/hkl-logistik-light.png);
}

#biogas:after,
#agrar:after,
#logistik:after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 60px;
	height: 100%;
	min-width: 300px;
	background-repeat: no-repeat;
	background-position: 50% 100%;
	background-size: 100% auto;
	z-index: 110;
}
#biogas:after {
	width: 400px;
	background-image: url(../images/image-bild-biogas.webp);
}
#agrar:after {
	width: 400px;
	background-image: url(../images/image-bild-agrar.webp);
}
#logistik:after {
	width: 600px;
	background-image: url(../images/image-bild-logistik.webp);
}
@media(max-width: 991px){
	#biogas:after,
	#agrar:after,
	#logistik:after {
		opacity: .2;
	}
}

/* 
 * Vesion 2 
 */
.group-main-section {}

.history-section {
	background-image: url(../images/branding-bg.webp);
	background-repeat: no-repeat;
	background-position: 0 50%;
	background-size: auto 90%;
}
.history-timeline {}
.history-timeline .sppb-addon-timeline-wrapper:before {
	background-color: var(--pri-color) !important;
}
.history-timeline .timeline-movement .timeline-panel {
	padding: 30px 20px !important;
	background-color: var(--sec-color) !important;
	color: #fff;
	border: 0 !important;
	-webkit-border-radius: 30px !important;
	-webkit-border-top-left-radius: 0 !important;
	-webkit-border-bottom-right-radius: 0 !important;
	-moz-border-radius: 30px !important;
	-moz-border-radius-topleft: 0 !important;
	-moz-border-radius-bottomright: 0 !important;
	border-radius: 30px !important;
	border-top-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	text-align: left !important;
}
.history-timeline .timeline-movement .timeline-panel:before {
	display: none;
}
.history-timeline .timeline-movement .timeline-panel .title {
	font-size: 1.35rem !important;
	font-weight: 600 !important;
	text-transform: uppercase;
}
.history-timeline .timeline-movement .timeline-panel .details {
	font-size: 1.125rem !important;
}
.history-timeline .timeline-movement .timeline-date {
	font-size: 1.5rem !important;
	font-weight: 700;
	color: var(--pri-color);
}
.history-timeline .timeline-movement .timeline-badge:before {
	border-color: var(--pri-color) !important;
	transform: translateX(calc(-50% + 1px));
}
.history-timeline .timeline-movement .timeline-badge:after {
	display: none !important;
}

/* Contact form */
.contact-form-section .sppb-section-title .sppb-title-heading {
	color: #fff !important;
}

.contact-form ::placeholder {
	color: var(--pri-color);
	font-weight: 600;
}
.contact-form .rsform-block.rsform-block-anrede {
	display: inline-flex;
	gap: 15px;
	width: 100%;
	padding: 20px 15px;
	background-color: #fff;
	color: var(--pri-color);
}
.contact-form .rsform-block.rsform-block-anrede * {
	font-weight: 600;
}
.contact-form .rsform-block.rsform-block-datenschutz {
	padding: 20px 15px;
	background-color: #fff;
	color: var(--pri-color);
}
.contact-form .rsform-block.rsform-block-captcha {
	padding: 20px 15px;	
	background-color: #fff;
}
.contact-form .rsform-block.rsform-block-anrede .form-label {
	margin-bottom: 0;
}
.contact-form .rsform-block:not(.rsform-block-anrede):not(.rsform-block-datenschutz) .form-label {
	display: none;
}
.contact-form .rsform-block .form-control {
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.contact-form .rsform-block .rsform-input-box,
.contact-form .rsform-block .rsform-text-box {
	padding: 20px 15px;
	border: 0;
}
@media(min-width: 992px){
	.contact-form .rsform-block #nachricht {
		height: 318px;
	}
}
.contact-form .rsform-block #captcha {
	border: 0;
	background-color: transparent;
	color: var(--pri-color);
}
.contact-form .rsform-block .hashcash {
	width: 32px;
	height: 32px;
	margin-right: 10px;
}
.contact-form .rsform-block-send {
	margin-top: 15px;
	text-align: center;
}
.contact-form .rsform-block-send .btn-primary {
	padding: 15px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	border: 0;
	background-color: #fff;
	color: var(--pri-color);
	text-transform: uppercase;
	font-size: 1.5rem;
	font-weight: 700;
}
@media(max-width: 599px){
	.contact-form .rsform-block-send .btn-primary {
		min-width: 100%;
	}
}
@media(min-width: 600px){
	.contact-form .rsform-block-send .btn-primary {
		min-width: 600px;
	}
}

/* Conatct section */
.contact-outer {
}
.contact-person .sppb-person-image  {
	margin-bottom: 0;
}
.contact-person .sppb-person-information {
	padding: 20px 20px 30px 20px;
	color: #fff;
	background: rgb(0,101,122);
	background: linear-gradient(
		90deg,
		rgba(0,101,122,1) 25%,
		rgba(0,130,144,1) 100%
	);
}
.contact-person .sppb-person-information .sppb-person-name {
	font-size: 1.25rem;
	font-weight: 600;
}
.contact-person .sppb-person-information .sppb-person-designation:after {
	content: '';
	display: block;
	height: 1px;
	max-width: 150px;
	margin: 14px auto 0 auto;
	background-color: #fff;
}
.contact-person .sppb-person-information .sppb-person-contact {
	display: inline-flex;
	margin-top: 20px;
	gap: 20px;
}
.contact-person .sppb-person-information .sppb-person-contact a {
	color: rgba(255,255,255,1);
}
.contact-person .sppb-person-information .sppb-person-contact a:hover {
	color: rgba(255,255,255,.6);
}
.contact-person .sppb-person-information .sppb-person-contact a i {
	font-size: 2rem;
}
/*
 * Career page
 *
 */
.header-image {
	display: flex;
	gap: 50px;
}
@media(max-width: 767px){
	.header-image {
		max-width: 600px;
		margin: 0 auto;
		padding-right: 60px;
		padding-left: 60px;
		flex-direction: column;
	}
}
@media(min-width: 768px){
	.header-image {
		flex-direction: row-reverse;
	}
	.header-image .sppb-addon-body {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
}
.header-image > * {
	flex: 1;
}
.header-image .sppb-image-content-title {
	font-size: 2.5rem;
	font-weight: 700 !important;
	text-transform: uppercase;
	color: var(--pri-color);
}


body.karriereseite #sp-logo {
	position: absolute;
	left: 50%;
	margin: 0;
	transform: translate(-50%, calc(100% + 30px));
	z-index: 110;
}

@media(max-width: 767px){
	.jobs-articles .carriere-module > li:not(:first-child) {
		margin-top: 30px;
	}
}
@media(min-width: 768px){
	.jobs-articles .carriere-module {
		display: grid;
		grid-gap: 30px;
		grid-template-columns: repeat(2, 1fr);
	}
}
.jobs-articles .carriere-module > li {
	padding: 0;
	background-color: #e5f1f5;
	-webkit-border-top-right-radius: 25px;
	-webkit-border-bottom-left-radius: 25px;
	-moz-border-radius-topright: 25px;
	-moz-border-radius-bottomleft: 25px;
	border-top-right-radius: 25px;
	border-bottom-left-radius: 25px;
	overflow: hidden;
}
.jobs-articles .carriere-module > li .mod-articles-category-image {
	position: relative;
	margin-bottom: 0;
	z-index: 95;
}
@media(max-width: 479px){
	.jobs-articles .carriere-module > li .mod-articles-category-body {
		padding: 30px;
	}
}
@media(min-width: 480px){
	.jobs-articles .carriere-module > li {
		display: flex;
		gap: 30px;
	}
	.jobs-articles .carriere-module > li .mod-articles-category-image {
		flex: 0 0 33.3334%;
	}
	.jobs-articles .carriere-module > li .mod-articles-category-image img {
		object-fit: cover;
		object-position: center top;
		width: 100% !important;
		height: 100% !important;
	}
	.jobs-articles .carriere-module > li .mod-articles-category-body {
		padding: 30px 30px 30px 0px;
		display: flex;
		flex-direction: column;
	}
}


.jobs-articles .carriere-module > li .mod-articles-category-body .mod-articles-category-head {
	color: var(--pri-color);
	display: inline-block;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 1.5rem;
}
.jobs-articles .carriere-module > li .mod-articles-category-body .mod-articles-category-head:after {
	content: '(m/w/d)';
	font-weight: 400;
	white-space: nowrap;
	text-transform: none;
}
.jobs-articles .carriere-module > li .mod-articles-category-body .mod-articles-category-introtext {
	margin-top: 20px;
	flex-grow: 1;
	color: var(--pri-color);
}
.jobs-articles .carriere-module > li .mod-articles-category-body .mod-articles-category-readmore a {
	display: block;
	padding: 10px 30px;
	text-align: center;
	text-transform: uppercase;
	font-size: 1.25rem;
	font-weight: 600;
}
.jobs-articles .carriere-module > li .mod-articles-category-body .mod-articles-category-readmore a {
	color: #fff;
	background: rgb(0,101,122);
	background: linear-gradient(90deg, rgba(0,101,122,1) 0%, rgba(0,130,144,1) 100%);
}
@media(max-width: 479px){
	.jobs-articles .carriere-module > li .mod-articles-category-body .mod-articles-category-readmore {
		margin-top: 20px;
	}
}
/*
 * Form styles
 */
#bewerbungsformular {}
#bewerbungsformular > h2 {
	padding: 15px 30px;
	text-transform: uppercase;
	font-weight: 600;
	text-align: center;
	font-size: 2.25rem;
	color: #fff;
	background: #8d79b5;
	background-image: linear-gradient(
		90deg,
		rgba(123,61,127,1) 25%, 
		rgba(0,20,57,1) 100%
	);
}

/*
 * Contactform section
 */
#bewerbungsformular input[type='text'].form-control,
#bewerbungsformular textarea.form-control {
	padding: 15px 20px;
	background-color: #e5f1f5;
	border: 0;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
#bewerbungsformular input[type='file'].form-control {
	background-color: #e5f1f5;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	border: 0;
}
#bewerbungsformular input[type='file'].form-control::file-selector-button {
	background-color: var(--pri-color);
	color: #fff;
	padding: 12px 30px;
}
#bewerbungsformular .rsform-block-infotext {
	margin-bottom: 20px;
	padding: 20px 30px;
	background-color: #e5f1f5;
	text-align: center;
	color: var(--pri-color);
	text-transform: uppercase;
}
#bewerbungsformular .rsform-block-infotext > * {
	margin: 0;
	font-weight: 700;
}
#bewerbungsformular .rsform-block-anrede {
	padding: 16px 24px 10px 24px;
	margin-top: 10px !important;
	margin-bottom: 20px !important;
	display: flex;
	gap: 15px;
	font-size: 1rem;
	background-color: #e5f1f5;
	color: var(--pri-color);
}
#bewerbungsformular input::placeholder,
#bewerbungsformular textarea::placeholder {
	color: var(--pri-color);
}
#bewerbungsformular [data-rsfp-hashcash] {
	border: 0 !important;
	background-color: transparent !important;
}
#bewerbungsformular .rsform-type-submitbutton {
	margin-top: 15px;
	text-align: center;
}
@media(min-width: 576px){
	#bewerbungsformular .rsform-type-submitbutton .btn-primary {
		min-width: 360px;
	}
}
#bewerbungsformular .rsform-type-submitbutton .btn-primary {
	display: block !important;
	width: 100%;
	padding-top: 15px;
	padding-bottom: 15px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	text-transform: uppercase;
	border: 0;
	font-weight: 600;
	font-family: var(--sec-font);
	letter-spacing: .5px;
	font-size: 1.5rem;
}
#bewerbungsformular .rsform-type-submitbutton .btn-primary {
	background-color: var(--pri-color);
}
#bewerbungsformular .rsform-type-submitbutton .btn-primary:hover {
	background-color: var(--sec-color);
}
/*
 * Contact person
 */
.career-contact {
	background-color: #02657a;
	color: #fff;
	-webkit-border-top-right-radius: 25px;
	-webkit-border-bottom-left-radius: 25px;
	-moz-border-radius-topright: 25px;
	-moz-border-radius-bottomleft: 25px;
	border-top-right-radius: 25px;
	border-bottom-left-radius: 25px;
	overflow: hidden;
}
.career-contact a,
.career-contact a:visited {
	color: rgba(255,255,255,1);
}
.career-contact a:hover,
.career-contact a:active,
.career-contact a:focus {
	color: rgba(255,255,255,.5);
}
.career-contact .sppb-person-title {
	display: block;
	margin: 0;
	padding-right: 30px;
	padding-left: 30px;
	font-size: 1.5rem;
	font-weight: 600;
	text-transform: uppercase;
}
.career-contact .sppb-person-information {
	padding: 0px 30px 30px 30px;
}
.career-contact .sppb-person-information .sppb-person-name {
	margin-bottom: 20px;
	font-weight: 600;
	font-size: 1.5rem;
}
.career-contact .sppb-person-information .sppb-person-email {
	margin-bottom: 5px;
	text-transform: uppercase;
}
.career-contact .sppb-person-information .sppb-person-wahtsapp {
	margin-top: 15px;
	padding: 6px 15px;
	background-color: #fff;
	color: var(--pri-color);
	font-size: 1.5rem;
}
.career-contact .sppb-person-information .sppb-person-wahtsapp a {
	color: var(--pri-color);
	text-transform: uppercase;
	font-weight: 600;
}
.career-contact .sppb-person-information .sppb-person-wahtsapp a:hover {
	color: var(--sec-color);
}

/* Map styles */
.custom-openstreetmap .sppb-openstreetmap-title {
	display: block;
	margin: 0;
	padding: 15px 30px;
	text-align: center;
	background-color: var(--pri-color);
	font-weight: 600;
	font-size: 1.5rem;
	text-transform: uppercase;
	color: #fff;
}

/*
 * Article details
 */
.article-details .article-header {
	margin-top: 60px;
	margin-bottom: 60px;
}
.article-details .article-header .career-headline {
	text-align: center;
	color: var(--sec-color);
	font-weight: 700;
	text-transform: uppercase;
	display: flex;
	gap: 10px;
	justify-content: center;
}
.article-details .article-header .career-headline span {
	order: 3;
	font-weight: 400;
}
.article-details .article-header .career-headline:after {
	content: '(m/w/d)';
	color: var(--pri-color);
	order: 2;
}
.article-details .article-custom-fields {
	margin-bottom: 30px;
	padding: 45px;
	background-color: #e5f1f5;
	-webkit-border-top-right-radius: 25px;
	-webkit-border-bottom-left-radius: 25px;
	-moz-border-radius-topright: 25px;
	-moz-border-radius-bottomleft: 25px;
	border-top-right-radius: 25px;
	border-bottom-left-radius: 25px;
	color: var(--pri-color);
}
.article-details .article-custom-fields [class^='article-']:not(:first-child), 
.article-details .article-custom-fields [class*=' article-']:not(:first-child) {
	margin-top: 30px;
}
.article-details .article-custom-fields [class^='article-'] h4, 
.article-details .article-custom-fields [class*=' article-'] h4 {
	font-weight: 700;
	text-transform: uppercase;
}


/*
 * Location page
 * 
 */
.locations-section {}
@media(min-width: 768px){
	.locations-grid > .sppb-column-addons {
		column-count: 2;
		gap: 30px;
	}
	.locations-grid > .sppb-column-addons > div {
		break-inside: avoid;
	}
}
.locations-grid > .sppb-column-addons > div:last-child .sppb-addon-body {}
.location-info .sppb-addon-image {
	position: relative;
	margin-bottom: 0;
	transform: translateY(30px);
	z-index: 100;
}
.location-info .sppb-addon-image img {
	-webkit-border-top-right-radius: 30px;
	-moz-border-radius-topright: 30px;
	border-top-right-radius: 30px;
}
.location-info .sppb-addon-body {
	position: relative;
	padding: 30px;
	background-color: var(--pri-color);
	color: #fff;
	z-index: 105;
	-webkit-border-top-right-radius: 30px;
	-webkit-border-bottom-left-radius: 30px;
	-moz-border-radius-topright: 30px;
	-moz-border-radius-bottomleft: 30px;
	border-top-right-radius: 30px;
	border-bottom-left-radius: 30px;
}
.location-info .sppb-addon-body .sppb-image-content-title {
	font-weight: 600;
	text-transform: uppercase;
}
ul.list-arrows {
	padding: 0;
	margin: 0;
	list-style: none;
}
ul.list-arrows > li {
	position: relative;
	z-index: 95;
	margin-top: 8px;
	margin-bottom: 8px;
}
ul.list-arrows > li:before {
	content: '\00BB';
	position: absolute;
	top: -1px;
	left: 0px;
	font-weight: 700;
	font-size: 24px;
	font-family: 'Arial';
	line-height: 1;
	transform: translateX(-18px);
}
/* Teaser styles */
@media(max-width: 767px){
	.location-teaser {
		padding-bottom: 315px !important;
		background-size: auto 350px !important;
		background-position: 50% calc(100% + 40px) !important;
	}
}
@media(min-width: 768px){
	.location-teaser {
		background-size: auto 100% !important;
		background-position: 80% calc(100% + 40px) !important;
	}
}


/*
 * Products page
 */
.products-section {
	position: relative;
	z-index: 95;
}
.products-section > div {
	position: relative;
	z-index: 100;
}
.products-section:after {
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	height: 420px;
	aspect-ratio: 1.015 / 1;
	z-index: 105;
	background-image: url(../images/zapfhahn-alt.webp);
	background-repeat: no-repeat;
	background-size: auto 100%;
}

@media(max-width: 1399px){
	.products-section:after {
		right: 0;
	}
}
@media(min-width: 1400px){
	.products-section:after {
		right: calc(50% - 800px);
	}
}
ul.list-checkmark {
	margin: 0 0 auto 0;
	padding: 0;
	list-style: none;
}
ul.list-checkmark > li {
	position: relative;
	padding-left: 28px;
	margin-top: 4px;
	margin-bottom: 4px;
}
ul.list-checkmark > li:before {
	content: '\2714';
	display: inline-block;
	position: absolute;
	top: 2px;
	left: 0;
	margin-right: 6px;
	width: 20px;
	height: 20px;
	line-height: 16px;
	text-align: center;
	font-size: 12px;
	font-weight: 600;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
ul.list-checkmark:not(.list-style-light) > li:before {
	color: var(--pri-color);
	border: 2px solid var(--pri-color);
}
ul.list-checkmark.list-style-light > li:before {
	color: #fff;
	border: 2px solid #fff;
}
@media(max-width: 767px){
	.product-item {
		margin-bottom: 30px;
	}
}
@media(min-width: 768px){
	.products-grid > .sppb-column-addons {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 30px;
	}
	.products-grid > .sppb-column-addons > div > div {
		height: 100%;
	}
}
.product-item {
	display: flex;
	flex-direction: column;
}
.product-item {
	height: 100%;
}
.product-item .sppb-addon-image {
	margin-bottom: 0;
	margin-top: -30px;
	transform: translateY(30px);
	flex-grow: 0;
}
.product-item .sppb-addon-image img {
	-webkit-border-top-right-radius: 30px;
	-moz-border-radius-topright: 30px;
	border-top-right-radius: 30px;
}
.product-item .sppb-addon-body {
	position: relative;
	padding: 30px;
	flex-grow: 1;
	background: #00657A;
	background: linear-gradient(
		45deg,
		rgba(0, 101, 122, 1) 0%,
		rgba(0, 127, 138, 1) 100%
	);
	color: #fff;
	z-index: 105;
	-webkit-border-top-right-radius: 30px;
	-webkit-border-bottom-left-radius: 30px;
	-moz-border-radius-topright: 30px;
	-moz-border-radius-bottomleft: 30px;
	border-top-right-radius: 30px;
	border-bottom-left-radius: 30px;
}

/* Contact section */
.contact-section {}
.contact-outer > .sppb-column-addons {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 30px;
}

/* Services styles */
.product-service-section {
	position: relative;
	z-index: 95;
}
.product-service-section > div {
	position: relative;
	z-index: 100;
}
/*
.product-service-section:after {
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 275px;
	background-image: url(../images/zapfhahn.webp);
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-position: 20% 0;
	z-index: 105;
}
@media(max-width: 1399px){
	.product-service-section:after {
		left: 0;
	}
}
@media(min-width: 1400px){
	.product-service-section:after {
		left: calc(50% - 1200px);
	}
}
*/

/* Solucions styles */
.solution-outer > .sppb-column-addons {
	margin-bottom: 30px;
}
.solution-outer > .sppb-column-addons > .sppb-addon-wrapper,
.solution-outer > .sppb-column-addons > .sppb-addon-wrapper > div {
	height: 100%;
}
.solution-outer > .sppb-column-addons > .sppb-addon-wrapper > div {
	-webkit-border-top-right-radius: 30px;
	-webkit-border-bottom-left-radius: 30px;
	-moz-border-radius-topright: 30px;
	-moz-border-radius-bottomleft: 30px;
	border-top-right-radius: 30px;
	border-bottom-left-radius: 30px;
}
.solution-info {}