/* barlow-regular - latin-ext */
@font-face {
	font-display: fallback;
	font-family: 'Barlow';
	font-style: normal;
	font-weight: 400;
	src: url('/shared/fonts/2023/barlow-v12-latin_latin-ext-regular.woff2') format('woff2');
}
/* barlow-italic - latin-ext */
@font-face {
	font-display: fallback;
	font-family: 'Barlow';
	font-style: italic;
	font-weight: 400;
	src: url('/shared/fonts/2023/barlow-v12-latin_latin-ext-italic.woff2') format('woff2');
}
/* barlow-500 - latin-ext */
@font-face {
	font-display: fallback;
	font-family: 'Barlow';
	font-style: normal;
	font-weight: 500;
	src: url('/shared/fonts/2023/barlow-v12-latin_latin-ext-500.woff2') format('woff2');
}
/* barlow-500italic - latin-ext */
@font-face {
	font-display: fallback;
	font-family: 'Barlow';
	font-style: italic;
	font-weight: 500;
	src: url('/shared/fonts/2023/barlow-v12-latin_latin-ext-500italic.woff2') format('woff2');
}
/* barlow-600 - latin-ext */
@font-face {
	font-display: fallback;
	font-family: 'Barlow';
	font-style: normal;
	font-weight: 600;
	src: url('/shared/fonts/2023/barlow-v12-latin_latin-ext-600.woff2') format('woff2');
}
/* barlow-600italic - latin-ext */
@font-face {
	font-display: fallback;
	font-family: 'Barlow';
	font-style: italic;
	font-weight: 600;
	src: url('/shared/fonts/2023/barlow-v12-latin_latin-ext-600italic.woff2') format('woff2');
}
/* barlow-900 - latin-ext */
@font-face {
	font-display: fallback;
	font-family: 'Barlow';
	font-style: normal;
	font-weight: 900;
	src: url('/shared/fonts/2023/barlow-v12-latin_latin-ext-900.woff2') format('woff2');
}
@font-face {
	font-family: 'Amatic SC';
	font-display: block;
	src: url('/shared/fonts/amaticsc-regular-webfont.woff2') format('woff2'),
		url('/shared/fonts/amaticsc-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Amatic SC';
	font-display: block;
	src: url('/shared/fonts/amaticsc-bold-webfont.woff2') format('woff2'),
		url('/shared/fonts/amaticsc-bold-webfont.woff') format('woff');
	font-weight: bold;
	font-style: normal;
}
:root {
	--main-nav-text: rgb(186,185,184);
	--meta-nav-text: rgb(152,152,152);
	--highlight-color: rgb(230,76,5);
	--highlight-rgb: 230,76,5;
	--highlight-color-hover: rgba(230,76,5,.7);
	--lowlight-color: rgb(45,45,47);
	--negative-highlight-color: rgb(255,255,255);
	--default-background: rgb(240,238,237);
	--bg-default-rgb: 240,238,237;
	--bs-primary-rgb: 240,238,237;
	--highlight-background: rgb(255,255,255);
	--bs-light-rgb: 255,255,255;
	--collapse-filter-background: rgb(240,238,237);
	--bs-body-color: rgb(60,60,62);
	--bs-body-color-rgb: 60,60,62;
	--link-text: rgb(60,60,62);
	--hover-text: rgb(230,76,5);
	--h1-text: rgb(0,0,0);
	--h2-text: rgb(27,31,36);
	--mainnav-font-size: 1.5rem;
	--metanav-font-size: 1rem;
	--body-text-size: 1.25rem;
	/*
	--h1-font-size: 3.125rem;
	--h2-font-size: 2rem;
	--h3-font-size: 1.75rem;
	--h4-font-size: 1.5rem;
	*/
}
*[class*="container"],
.row {
	--bs-gutter-x: 1rem;
}
/*######--------------------Allgemein---------------------######*/
::selection {
	background: #afca00;
	color: #fff
}
.bg-default {
	background-color: var(--default-background)!important;
}
.text-orange{
	color:var(--highlight-color) !important;
}

body {
	background: var(--default-background);
	font-family: 'Barlow','Arial',sans-serif;
	font-weight: 400;
	font-size: 1.25rem;
	line-height: 1.5;
}

*[class*="fs-"] {
	line-height: 1.3
}
@media (min-width: 1400px) {
	.container {
		max-width: 1320px;
	}
}
.max-width {
	max-width: 1920px
}
h1, .h1 {
	color: var(--h1-text);
	/* font-size: var(--h1-font-size); */
	line-height: 1.1;
	margin-bottom: 1rem; 
}
h2, h3, h4, h5, h6, 
.h2, .h3, .h4, .h5, .h6,
.visual {
	font-weight: 500;
	line-height: 1.2;
	color: var(--h2-text);
	margin-top: 2rem;
	margin-bottom: .5rem;
}
div[class*="col"] > h2:first-of-type,
div[class*="col"] > h3:first-of-type,
div[class*="col"] > h4:first-of-type,
div[class*="col"] > h5:first-of-type {
	margin-top: 0
}
h2, .h2 {
	/* font-size: var(--h2-font-size); */
}
h3, .h3 {
	/* font-size: var(--h3-font-size); */
	line-height: 1.3;
}
h4, .h4 {
	/* font-size: var(--h4-font-size); */
	line-height: 1.3;
}
p.lead {
	font-size:1.5rem;
	color:#000;
}
p.title-top {
	color: #3B3B3B;
	text-transform: uppercase; 
	letter-spacing: 0.05rem; 
	margin-bottom: 0.5rem; 
}
p[class*="fs-"] {
	margin-bottom: 0;
}
th {
	font-weight: 500
}
.table>:not(caption)>*>* {
	padding: 1rem .75rem
}
a {
	text-decoration: none;
	color: var(--link-text);
	transition: all .3s, border .3s;
}
a:hover, a:focus {
	color: var(--hover-text);
	fill: var(--hover-text)!important;
}
a:focus {
	outline: none
		/*
		outline-style: dotted;
		outline-width: 1px
		*/
}
a:active, a.active {
	color: var(--hover-text);
	fill: var(--hover-text)!important;
	font-weight: 500;
}
main a::after, footer a::after {
	display: inline;
	font-family: bootstrap-icons!important;
	font-style: normal;
	font-weight: 400!important;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	vertical-align: -0.15em;
	-webkit-font-smoothing: antialiased;
}
main a:not(.cat):not(.no-icon):not([data-rel])::after,
footer a:not(.no-icon):not([data-rel])::after {
	content: "\f135";
	padding-left: 0;
}
main a[href^="http"]:not(.no-icon):not([data-rel])::after,
footer a[href^="http"]:not(.no-icon):not([data-rel])::after {
	content: "\f1c5";
	padding-left: .25em;
}
main a[href^="tel"]:not(.no-icon):not([data-rel])::after,
footer a[href^="tel"]:not(.no-icon):not([data-rel])::after {
	content: "\f5c1";
	padding-left: .25em;
}
main a[href^="mailto"]:not(.no-icon):not([data-rel])::after,
footer a[href^="mailto"]:not(.no-icon):not([data-rel])::after {
	content: "\f84c";
	padding-left: .25em;
}
main a:not(.no-icon):not([data-rel]),
footer a:not(.no-icon):not([data-rel]) {
	color: var(--highlight-color)!important
}
main a:not(.no-icon):not([data-rel]):hover,
footer a:not(.no-icon):not([data-rel]):hover {
	color: var(--bs-body-color)!important
}
main a:not(.no-icon):not([data-rel]),
footer a:not(.no-icon):not([data-rel]) {
	color: var(--highlight-color)!important
}
main a:not(.no-icon):not([data-rel]):hover,
footer a:not(.no-icon):not([data-rel]):hover {
	color: var(--bs-body-color)!important
}
section#copyright a {
	color: white;
	color: all .3s, border .3s;
}
section#copyright a:hover, section#copyright a:focus {
	color: var(--highlight-color)
}
section#copyright a svg {
	fill: white;
	transition: all .3s, border .3s;
}
section#copyright a:hover svg, a:focus svg {
	fill: var(--highlight-color)
}
strong {
	color: #555;
	font-weight: 500
}
.small {
	font-size: 1rem
}
#noscript{
	right: 0;
	top: 0;
	padding: 10px 15px;
	background: #ff4e00;
	color: #fff;
	z-index: 99999;
}
#loader {
	width:100vw;
	height:100vh;
	position:fixed;
	z-index:999999;
	left:0;
	top:0;
	background-color: var(--highlight-background);
	display:flex;
	align-items:center;
	justify-content:center;
}
#loader img {
	border-radius:50%;
	width:150px;
	height:auto;
}
#filterLoader {
	width: 100%;
	height: 100%;
	min-height: 150px;
	z-index: 99999;
	position: absolute;
	left: 0;
	top: 0;
	background-color: var(--highlight-background);
	display:flex;
	align-items:center;
	justify-content:center;
}
#filterLoader img {
	border-radius:50%;
	width:150px;
	height:auto;
}
.no-js #loader {
	display:none;
}
/*######--------------------Header---------------------######*/
#title h1 {
	padding: 3rem 0 .5rem 0;
	hyphens: auto;
}
header#header,
#homeForm .modal-header {
	background-color: var(--lowlight-color);
	background-image: url(/shared/img/2023/headerbg.webp);
	background-position: 50% 0;
	background-repeat: no-repeat;
}
header nav {

}
section#filter {
	background: rgb(240,238,237);
}
/*#####--------Main und Meta Nav---------#####*/
.navbar-toggler {
	color: #eee;
	font-size: 3rem;
}
.navbar-toggler:focus {
	box-shadow: none;
}

#mobile-menue {
	width: 50px;
	height: 40px;
	position: relative;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg) scale(0.8);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
}
#mobile-menue span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background: #d3531a;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
#mobile-menue span:nth-child(1) {
  top: 0px;
}
#mobile-menue span:nth-child(2),#mobile-menue span:nth-child(3) {
  top: 18px;
}
#mobile-menue span:nth-child(4) {
  top: 36px;
}
#mobile-menue.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}
#mobile-menue.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
#mobile-menue.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#mobile-menue.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}

.navbar-toggler .hidden {
	display: none;
}
svg#Logo {
	margin: .5rem 0;
	max-width: 190px
}
#navbar a {
	border: none;
	padding-top: 0;
	padding-right: .75rem;
	transition: color .3s;
}
#mainNav a {
	color: var(--main-nav-text);
	font-size: var(--mainnav-font-size);
	text-transform: uppercase;
}
#metaNav a {
	color: var(--meta-nav-text);
	font-size: var(--metanav-font-size);
	text-transform: uppercase;
}
#navbar a:hover,
#navbar a:focus,
#navbar .active {
	color: var(--negative-highlight-color);
}
header#header .dropdown-toggle-split::after {
	margin-left: -0.3rem;
	margin-right: -0.3rem;
}
header#header .dropdown-toggle::after {
	border-top: 0.8em solid;
	border-right: 0.5em solid transparent;
	border-bottom: 0;
	border-left: 0.5em solid transparent;
}
header#header .btn-primary {
	color: var(--negative-highlight-color);
	background-color: var(--highlight-color);
	margin-left: -.7rem;
	height: 1.5rem;
	vertical-align: sub;
	transition: all .3s
}
header#header .btn-primary:hover {
	color: var(--highlight-color);
	background-color: var(--highlight-background);
}
@media screen and (min-width: 992px) {
	/*
	#mainNav a {
	padding: .5rem; 
	margin-top: .6rem;
}
	#metaNav {
	margin-top: 2rem; 
	margin-bottom: -0.8rem; 
}
	#mainNav li.nav-item:last-of-type a.nav-link,
	#metaNav li.nav-item:last-of-type a.nav-link {
	padding-right: 0; 
}
	*/
}
.navbar-light .navbar-toggler {
	border: none; 
	padding-top: 1.1rem; 
}
.navbar-light .navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(255, 78, 0)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
	width: 2.6em; 
	height: 2.6em; 
}
/*######--------------------Hero Home---------------------######*/
#home.container {
	width: 100%!important; /* nach switch: in template container-fluid, hier kein !important */
	max-width: unset!important; /* nach switch: hier entfernen */
}
#home.profil #panel {
	height: calc(80vh - 150px) !important;
}
#home #panel {
	/*
	overflow: hidden;
	height: calc(80vh - 150px);
	*/
	background-color: var(--lowlight-color);
	margin-top: -1px; /* evtl als ausgleich einer ungünstigen rundung zum header - weiße linie */
}
/*
#home #startImg.blurry, #home #endImg.blurry {
	-webkit-filter: blur(5px) brightness(.15) grayscale(100%);
	filter: blur(5px) brightness(.15) grayscale(100%);
}
*/
#home #startImg {
	display: inline;
}
#home #endImg {
	display: none;
}
#home #wildner-clip-panel,
#home #wildner-clip-button-panel,
#home #wildner-clip-end-panel {
	position: absolute;
	display: block;
	top: 0;
	width: 100%;
	height: 100%;
	border: none
}
#home #wildner-clip-panel .plyr--video,
#home #wildner-clip-panel .plyr__video-wrapper {
	height: 100%;
	background-color: transparent
}
#home #wildner-clip-panel .plyr__video-wrapper video {
	height: 100%;
	object-fit: contain
}
/* #home #wildner-clip-button-panel, */
#home #wildner-clip-end-panel {
	display: none;
	overflow: hidden;
	box-shadow: inset 0 0 7px rgba(0,0,0,.3);
}
#home #wildner-clip-startbutton {
	cursor: pointer;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	z-index: 600
}
#home .home-title {
	position: absolute;
	z-index: 490;
	color: white
}
/* auskommentiert von ss (siehe unten) */
/* Profil */
#home.profil .home-title p {
	font-size: clamp(24px,calc(2rem + 2vh + 3vw),132px);
	line-height: .9;
	font-weight: 900;
	text-transform: uppercase;
	margin-top: -2.25em !important; 
	background-image: url(/media/video-poster-orange-jungle.jpg);
	background-size: contain;
	color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	opacity: .8;
}
#home.start .home-title,
#home.start .home-title p,
#home.start .home-title h1,
#home.start .home-title h2,
#home.start .home-title h3 {
	font-size: clamp(24px,calc(2rem + 1vh + .5vw),132px);
	line-height: 1;
	font-weight: 900;
	text-transform: uppercase;
	hyphens: auto;
	/* margin-top: -2.25em;
	margin-top: -.5em;
	background-image: url(/media/video-poster-orange-jungle.jpg);
	background-size: contain;
	color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	*/
	-webkit-text-stroke-width: 2px;
	-webkit-text-stroke-color: white;
	color: transparent;
}
#home.start .home-title.smaller,
#home.start .home-title.smaller p,
#home.start .home-title.smaller h1,
#home.start .home-title.smaller h2,
#home.start .home-title.smaller h3 {
	font-size: clamp(24px,calc(2rem + .5vh + .5vw),132px);
}
#home.start .home-title.big,
#home.start .home-title.big p,
#home.start .home-title.big h1,
#home.start .home-title.big h2,
#home.start .home-title.big h3 {
	font-size: clamp(24px,calc(2rem + 2vh + .5vw),132px);
}
#home.start .home-title.bigger,
#home.start .home-title.bigger p,
#home.start .home-title.bigger h1,
#home.start .home-title.bigger h2,
#home.start .home-title.bigger h3 {
	font-size: clamp(24px,calc(2rem + 2.5vh + .5vw),132px);
}
@media (min-width: 1500px) {
	#home.start .home-title,
	#home.start .home-title p,
	#home.start .home-title h1,
	#home.start .home-title h2,
	#home.start .home-title h3 {
		font-size: clamp(24px,calc(2rem + 2vh + 2vw),132px)
	}
	#home.start .home-title.smaller,
	#home.start .home-title.smaller p,
	#home.start .home-title.smaller h1,
	#home.start .home-title.smaller h2,
	#home.start .home-title.smaller h3 {
		font-size: clamp(24px,calc(2rem + 1vh + 2vw),132px)
	}
	#home.start .home-title.big,
	#home.start .home-title.big p,
	#home.start .home-title.big h1,
	#home.start .home-title.big h2,
	#home.start .home-title.big h3 {
		font-size: clamp(24px,calc(2rem + 3vh + 2vw),132px)
	}
	#home.start .home-title.bigger,
	#home.start .home-title.bigger p,
	#home.start .home-title.bigger h1,
	#home.start .home-title.bigger h2,
	#home.start .home-title.bigger h3 {
		font-size: clamp(24px,calc(2rem + 4vh + 2vw),132px)
	}
}
/*
#home .home-title p span {
	display: block;
}
*/
#home .button-box {
	position: absolute;
	z-index: 500
}
/*
#home .button-box button {
	position: relative;
	z-index: 510;
	cursor: pointer;
	overflow: visible;
	transition: all .2s;
	background: transparent;
	box-shadow: none;
	border: none;
	max-width: 200px;
	max-height: 200px;
}
*/
#home .button-box button {
	position: relative;
	z-index: 510;
	cursor: pointer;
	overflow: visible;
	transition: all .2s;
	background: transparent;
	box-shadow: none;
	border: none;
	max-width: 200px;
	max-height: 200px;
}
#home .button-box button:focus {
	outline: none;
}
#home .button-box button svg {
	width: 100%;
	height: 100%;
	position: relative;
	display: block;
	pointer-events: none;
	opacity: .8;
	transition: all .2s;
}
#home .button-box button svg path {
	fill: var(--highlight-color);
}
#home .button-box button:hover svg {
	fill: rgba(255,255,255,1);
}
@media (min-width: 576px) { /* sm */
	#home .home-title {
		hyphens: manual;
	}
	/*
	#home .home-title p {
	font-size: 4rem !important;
}
	#home .home-title p span {
	margin-left: 6rem !important;
}
	*/
}
@media (min-width: 768px) { /* md */
	/*
	#home .home-title p {
	font-size: 5rem !important;
}
	#home .home-title p span {
	margin-left: 10rem !important;
}
	*/
}
@media (min-width: 992px) { /* lg */
	/*
	#home .home-title p {
	font-size: 6.5rem !important;
}
	#home .home-title p span {
	margin-left: 12rem !important;
}
	*/
}
@media (min-width: 1200px) { /* xl */
	/*
	#home .home-title p {
	font-size: 8rem !important;
}
	#home .home-title p span {
	margin-left: 16rem !important;
}
	*/
}
@media (min-width: 1900px) { /* xxxl */
	/*
	#home.start .home-title p{
	font-size: 9rem !important;
}
	*/
}
/* ##### Main Title ##### */
section#main-title {
	padding: 4rem 0 4rem 0
}
/* ##### Home CTA ##### */
#homeForm .modal-title {
	/* bg modal-header bei site header */
	color: var(--main-nav-text)
}
#homeForm .modal-title p {
	margin-bottom: 0;
}
#homeForm .modal-header button {
	filter: invert(1)
}
#homeForm .modal-body {
	color: var(--bs-body-color);
	background-color: var(--default-background);
}
section#splitted-text{
	padding: 4rem 0;
	background-color: white
}
.py-6{
  padding-top:6rem !important;
	padding-bottom:6rem !important;
}
.bordertop-orange{
 border-top: 5px solid var(--highlight-color) !important;
}
.accordion-button-markting{

	background-color: #fff !important;
  border: 1px solid #fff !important;
  color: #000 !important;
  border-radius: 0 !important;
	font-size:1.7rem;

}
#lpmarkting .accordion-item {
  border-top: 1px solid #fff !important;
  box-shadow: none !important;
  border-bottom: 2px solid rgb(152,152,152) !important;
}
/* Remove border from the last accordion item */
#lpmarkting > div:last-child > .accordion-item {
  border-bottom: none !important;
  border-top: none !important; /* if you want */
}

#lpmarkting .accordion-item.show,
#lpmarkting .accordion-item.active,
#lpmarkting .accordion-item[aria-expanded="true"] {
  border-bottom: 2px solid rgb(152, 152, 152) !important;
}
#lpmarkting .accordion-item * {
; /*  border-bottom: none !important; /* remove border from inner elements if any */
  box-shadow: none !important;

}
/* ##### Kompetenzen ##### */
.home section#kompetenzen {
	padding: 4rem 0;
	background-color: white
}
.home section#kompetenzen .container-fluid {
	max-width: 1900px	
}
.home section#kompetenzen figure {
	width: 100%;
}
.home section#kompetenzen figure a img {
	height: 76px;
	transition: all .3s
}
.home section#kompetenzen figure a p {
	color: var(--link-text);
	transition: all .5s
}
.home section#kompetenzen figure a:hover p {
	color: var(--hover-text);
}
.home section#kompetenzen figure a:hover img {
	transform: scale(1.2);
	filter: drop-shadow(1px 1px 1px rgba(0,0,0,.3));
}
.landing-page-teaser {
	background-color: var(--highlight-background);
}
.landing-page-teaser img {
	border: 1px solid var(--bs-body-color);
}
#kompetenzen .card .komp-head img {
	padding-right: 15px;
	min-height: 55px;
	margin-bottom: 3rem!important;
}
.kompetenzen-start {
	display: block;
	height: 100%;
	background-color: var(--highlight-color);
	background-image: url("/shared/img/2023/farn-team-home.webp");
	background-size: contain;
	background-position: center bottom;
	background-repeat: no-repeat;
	position: relative
}
.kompetenzen-start p {
	color: var(--negative-highlight-color);
}
/* ##### Kompetenzen Detail */
/*
.kompetenz-teaser p {
font-size: var(--h4-font-size);
}
*/
.kompetenz-wrapper {
	padding-top: 1.5rem;
	margin-bottom: 1rem;
	background-color: var(--highlight-background);
}
.kompetenz.referenzen > .row > div[class*="col-"],
.landing-page .referenzen > .row > div[class*="col-"] {
	margin-bottom: 1rem
}
.kompetenz.referenzen > .row > div[class*="col-"] figure {
	margin-bottom: 0
}
img.mobile-teaser-icon {
	float: left;
	margin: .5rem 1rem .4rem 0;
}
/* ##### Kompetenzen Queries */
@media (min-width: 576px) { /* sm */
	.home section#kompetenzen figure {
		width: 50%;
	}
}
@media (min-width: 768px) { /* md */
	.home section#kompetenzen figure {
		width: 33%;
	}
	.kompetenz-teaser img.teaser-icon {
		width: 100%;
	}
}
@media (min-width: 992px) { /* xl */
	.home section#kompetenzen figure {
		width: 25%;
	}
	.kompetenz-teaser img.teaser-icon {
		padding-right: 50%;
	}
}
@media (min-width: 1400px) { /* xxl */
	.home section#kompetenzen figure {
		width: 14.2856%;
	}
	/* ##### Kompetenzen Filterlinks ##### */
	#filterLinks a.card {
		overflow: hidden
	}
	#filterLinks a.card .komp-head img {
		transform: scale(1) translateX(0px);
		transform-origin: left top;
		transition: all .3s
	}
	#filterLinks a.card div:nth-of-type(2) {
		margin-left: 0px;
		transition: all .2s
	}
	#filterLinks a.card:hover .komp-head img {
		transform: scale(2) translateX(55%);
	}
	#filterLinks a.card:hover div:nth-of-type(2) {
		margin-left: -500px
	}
}
/* ##### Landing Pages ##### */
.landing-page header {
	max-width: 1800px;
	margin: 0 auto;
	padding: 0 3rem;
}
/* ##### Team ##### */
section#team1 {
	padding: 4rem 0
}
section#team1 .cards {
	max-width: 1900px;
	margin: 0 auto
}
.cards a.doubletap {
	text-decoration: none
}
.cards .h4 {
	color: var(--link-text);
	border-bottom: 1px solid transparent;
	display: inline-block;
	text-decoration: underline transparent; 
	word-break: break-word;
	transition: all .5s
}
.cards a:hover .h4,
.cards a:focus .h4 {
	color: var(--hover-text);
	border-bottom: 1px solid #FF4E00;
}
.cards p i {
	font-style: normal;
}
.cards a.doubletap:hover figcaption {
	background-position: 98% 68%;
}
.cards:not(.team-site) .row div.col-6:last-of-type img {
	display: none;
}
.cards:not(.team-site) .row div.col-6:last-of-type a {
	font-size: 2rem;
	line-height: 1.2;
	color: var(--negative-highlight-color);
	display: block;
	height: 100%;
	padding: 2rem 3rem 0 1rem;
	background-color: var(--highlight-color);
	background-image: url("/shared/img/2023/farn-team-home.webp");
	background-size: contain;
	background-position: center bottom;
	background-repeat: no-repeat;
	position: relative
}
.cards:not(.team-site) .row div.col-6:last-of-type a i {
	font-size: 3rem;
	line-height: 1.5;
	margin-left: -.5rem;
	transition: margin .3s
}
.cards:not(.team-site) .row div.col-6:last-of-type a:hover i {
	margin-left: 1rem;
}
.hover-slip > div {
	margin-bottom: 1rem; 
}
.hover-slip > div,
.hover-slip > div figure{
	overflow: hidden;
}
.hover-slip figure {
	margin-bottom: 0;
}
.hover-slip > div a {
	overflow: hidden;
	border: none;
}
.hover-slip figure figcaption,
a.card.ref-teaser figcaption {
	background-color: var(--highlight-background);
	position: relative;
	z-index: 999;
	padding: 0.75rem 1.5rem 0.75rem 1rem;
}
a.card.ref-teaser {
	background-color: var(--highlight-background)
}
a.card.ref-teaser figure {
	margin-bottom: 0
}
.hover-slip figure figcaption p.h4,
a.card.ref-teaser figcaption p.h4,
a.card.ref-teaser figcaption p.client {
	margin: .5rem 0;
}
.hover-slip figure figcaption p {
	margin-bottom: .25rem;
}
.hover-slip figure figcaption p:nth-of-type(1) {
	margin-right: -.5rem;
}
.da-thumbs > div {
	position: relative;
}
.da-thumbs > div a,
.da-thumbs > div a img {
	display: block;
	position: relative;
}
.da-thumbs  a {
	overflow: hidden;
}
.da-thumbs > div a div {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: var(--highlight-background);
}
/* ##### Home Blog ##### */
.home section#blog {
	padding: 4rem 0
}
section#blog {
	background-color: var(--highlight-background)
}
section#blog .blog {
	margin: 0 auto;
	max-width: 1900px
}
section#blog .blog-teaser a, .newsletter-blog-teaser a {
	hyphens: auto;
	text-wrap: balance;
	text-decoration: none;
}
section#blog .blog-teaser a p, .newsletter-blog-teaser a p {
	color: var(--link-text);
	transition: color .3s
}
section#blog .blog-teaser a:hover p, .newsletter-blog-teaser a:hover p {
	color: var(--hover-text);
}
/* ##### Blog ##### */
.sub a.cat:not(:last-of-type):after {
	content:"/";
}
.block-slider + .bg-white {
	padding-top: 1.5rem
}
section.blog-article figure {
	margin-top: 1rem
}
section.blog-article figure.img-full-width figcaption,
section.blog-article figure.img-content figcaption {
	margin-bottom: 2rem;
}
.block-1 figure:not(.figure-in-slide) {
	margin-top: -1.5rem
}
.block-1 div.with-floating-image figure:not(.figure-in-slide) {
	margin-top: 0
}
a[aria-expanded] i {
	display: inline-block;
	transition: all .2s
}
a[aria-expanded!="true"] i {
	transform: rotate(0deg);
}
a[aria-expanded="true"] i {
	color: var(--highlight-color);
	transform: rotate(45deg);
}
.banner20 {
	background-color: var(--highlight-background)
}
.banner20 img {
	transition: all .3s ease
}
.banner20 span img:nth-of-type(2) {
	transform: scale(.8)
}
.banner20:hover span img:nth-of-type(1) {
	opacity: .8
}
.banner20:hover span img:nth-of-type(2) {
	transform: scale(.9)
}
.float-clear {
	clear: both
}
.slick-dots li {
	width: 20px;
	height: 20px;
	vertical-align: middle
}
.slick-prev::before, .slick-next::before {
	color: #555;
	font-size: 25px
}
.slick-dots li button::before,
.slick-dots li.slick-active button::before {
	font-size: 12px
}
.slick-dotted.slick-slider {
	margin-bottom: 4rem
}
.slick-next {
	transform: translateX(-70%)
}
.slick-prev {
	transform: translateX(40%);
	z-index: 1
}
div[id^="photos"] a,
.cSlider .slick-slide a,
a.magnify-single,
figure a.magnify {
	display: block;
	position: relative;
	border: none
}
div[id^="photos"] a:hover,
.cSlider .slick-slide a:hover,
a.magnify-single:hover,
figure a.magnify:hover {
	border: none
}
div[id^="photos"] a i,
.cSlider .slick-slide a i,
a.magnify-single i,
figure a.magnify i {
	display: block;
	position: absolute;
	top: 10px;
	left: 10px;
	text-decoration: none;
	color: var(--bs-body-color);
	font-size: 24px;
	transition: all .3s
}
div[id^="photos"] a:hover i,
.cSlider .slick-slide a:hover i,
a.magnify-single:hover i,
figure a.magnify:hover i {
	font-size: 3em;
	color: white;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%)
}
div[id^="photos"] a img,
.cSlider .slick-slide a img,
a.magnify-single img,
figure a.magnify img {
	border: 1px solid #dee2e6;
	transition: all .3s
}
figure a.magnify img {
	border: none;
}
.link-active > .slick-slider > .slick-list {
	padding-bottom: 10px;
	border: none;
	transition: all .3s
}
.link-active > .slick-slider > .slick-list:hover {
	transform: scale(1.025)
}
div[id^="photos"] a:hover img,
.cSlider .slick-slide a:hover img,
a.magnify-single:hover img,
figure a.magnify:hover img {
	-webkit-filter: grayscale(75%) contrast(.5) brightness(75%);
	filter: grayscale(75%) contrast(.5) brightness(75%);
}
.slick-dots {
	bottom: -2.5rem
}
.articleBody hr {
	margin: 2rem 0;
}
.visualLeft {
	width: 50%;
	float: left;
	padding-right: 1rem;
}
.visualRight {
	width: 50%;
	float: right;
	padding-left: 1rem;
}
section.blog-article div[lang="en"] {
	padding-left: 1rem;
	margin-left: 1.8rem;
	border-left: 1px solid rgba(0, 0, 0, 0.6);
	color: rgba(0, 0, 0, 0.6);
}
section.blog-article .slick-slide figcaption img {
    display: inline-block;
}
/* ##### Home Referenzen #### */
section#referenzen .referenzen {
	margin: 0 auto;
	max-width: 1900px
}
section#referenzen .referenzen a,
section#referenzen .referenzen a figure {
	text-decoration: none;
	height: 100%;
}
section#referenzen .referenzen a figure {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background-color: var(--highlight-background);
}
section#referenzen .referenzen a figure fig-head {
	display: block;
	position: relative
}
section#referenzen .referenzen a figure fig-head div img {
	height: 100%;
	object-fit: contain;
	padding: 15px;
	margin: 0 auto;
}
section#referenzen .referenzen a figure figcaption {
	height: 100%;
	background-position: 95% 90%;
}
/* ##### Main Elemente ##### */
/* animierte inline pfeile mit reservierten platz (padding/margin), damit der umbruch gleich bleibt */
i.bi {
	display: inline;
}
.bi::before, [class*=" bi-"]::before, [class^=bi-]::before {
	display: inline;
}
.bi-arrow-right-short {
	font-size: 1.3em;
	line-height: 1;
	vertical-align: -0.15em;
	margin-left: 0;
	padding-right: .25em;
	transition: all .3s
}
/*
.icon-arrow-light .bi-arrow-right-short:before,
.kompetenz a p.h4 .bi-arrow-right-short:before,
.da-thumbs a figcaption p:nth-of-type(2) .bi-arrow-right-short:before,
.blog-teaser a p.h3 .bi-arrow-right-short:before {
margin-left: 0;
transition: all .3s
}
.icon-arrow-light:hover .bi-arrow-right-short:before,
.kompetenz a:hover p.fs-4 .bi-arrow-right-short:before,
.da-thumbs a:hover figcaption p:nth-of-type(2) .bi-arrow-right-short:before,
.blog-teaser a:hover p.h3 .bi-arrow-right-short:before {
margin-left: .25em;
}
.icon-arrow-light:hover .bi-arrow-right-short,
.kompetenz a:hover p.fs-4 .bi-arrow-right-short,
.da-thumbs a:hover figcaption p:nth-of-type(2) .bi-arrow-right-short,
.blog-teaser a:hover p.h3 .bi-arrow-right-short {
padding-right: 0em;
}
*/
.bi-arrow-right-short:before {
	margin-left: 0;
	transition: all .3s
}
.icon-arrow-light:hover .bi-arrow-right-short:before,
a:hover .bi-arrow-right-short:before {
	margin-left: .25em;
	color: var(--hover-text);
}
a:hover .back .bi-arrow-right-short:before {
	color: white;
	margin-left: 0
}
.icon-arrow-light:hover .bi-arrow-right-short,
a:hover .bi-arrow-right-short {
	padding-right: 0em;
}
main .btn {
	margin: 0 .25rem;
	line-height: 1.3;
}
@media (min-width: 768px) { /* md */
	main .btn, #home .btn {
		padding: .75rem 1.5rem;
		margin: 0;
		font-size: var(--body-text-size);
	}
}
#filter .btn {
	padding: .75rem 1.5rem;
	font-size: var(--body-text-size);
	line-height: 1.3;
}
main .btn:not(.search-submit),
#filter .btn:not(.search-submit),
#home .btn[data-target="#homeForm"],
#homeForm .btn {
	border-radius: calc(2 * var(--body-text-size));
}
main .btn-dark,
main .btn-primary,
#filter .btn-dark,
#filter .btn-primary,
#home .btn-dark,
#home .btn-primary,
#homeForm .btn-primary
{
	--bs-btn-color: #fff;
	--bs-btn-bg: var(--bs-body-color);
	--bs-btn-border-color: var(--bs-body-color);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: var(--lowlight-color);
	--bs-btn-hover-border-color: var(--lowlight-color);
	--bs-btn-focus-shadow-rgb: 49,132,253;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--lowlight-color);
	--bs-btn-active-border-color: var(--lowlight-color);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: var(--bs-body-color);
	--bs-btn-disabled-border-color: var(--bs-body-color);
}
main .btn-outline-dark,
main .btn-outline-primary,
#filter .btn-outline-dark,
#filter .btn-outline-primary,
#home .btn-outline-dark,
#home .btn-outline-primary {
	--bs-btn-color: var(--bs-body-color);
	--bs-btn-border-color:var(--bs-body-color);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: var(--bs-body-color);
	--bs-btn-hover-border-color: var(--bs-body-color);
	--bs-btn-focus-shadow-rgb: 13,110,253;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--bs-body-color);
	--bs-btn-active-border-color: var(--bs-body-color);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--bs-body-color);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--bs-body-color);
	--bs-gradient: none;
}
main .btn-secondary,
#filter .btn-secondary,
#home .btn-secondary,
#homeForm .btn-secondary {
	--bs-btn-color: var(--negative-highlight-color);
	--bs-btn-bg: var(--highlight-color);
	--bs-btn-border-color: var(--highlight-color);
	--bs-btn-hover-color: var(--negative-highlight-color);
	--bs-btn-hover-bg: var(--highlight-color-hover);
	--bs-btn-hover-border-color: var(--highlight-color-hover);
	--bs-btn-focus-shadow-rgb: 130,138,145;
	--bs-btn-active-color: var(--negative-highlight-color);
	--bs-btn-active-bg: var(--highlight-color-hover);
	--bs-btn-active-border-color: var(--highlight-color-hover);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--negative-highlight-color);
	--bs-btn-disabled-bg: var(--highlight-color);
	--bs-btn-disabled-border-color: var(--highlight-color);
}
main .btn-outline-secondary,
#filter .btn-outline-secondary,
#home .btn-outline-secondary {
	--bs-btn-color: var(--highlight-color);
	--bs-btn-bg: var(--default-background);
	--bs-btn-border-color: var(--highlight-color);
	--bs-btn-hover-color: var(--negative-highlight-color);
	--bs-btn-hover-bg: var(--highlight-color); /* var(--highlight-color-hover) */
	--bs-btn-hover-border-color: var(--highlight-color);
	--bs-btn-focus-shadow-rgb: 108,117,125;
	--bs-btn-active-color: var(--negative-highlight-color);
	--bs-btn-active-bg: var(--highlight-color);
	--bs-btn-active-border-color: var(--highlight-color);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: var(--highlight-color);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--highlight-color);
	--bs-gradient: none;
}
#home a[class*="btn-"] {
	font-size: clamp(24px,calc(2rem + 1vh + .5vw),132px);
  line-height: 1;
  font-weight: 600;
  text-transform: none;
  hyphens: auto;
  color: transparent;
  -webkit-text-stroke-width: 0px;
  color: white;
	transform: scale(.7);
}
#home a.shadowy[class*="btn-"] {
	border: 4px solid rgba(0,0,0,.8);
	box-shadow: -3px 6px 2px 4px rgba(0,0,0,.8);
}
#home a.btn-outline-primary {
	border-width: 2px;
	border-color: var(--bs-body-color);
	color: var(--bs-body-color);
	transition: all 0.2s 
}
#home a.btn-outline-primary:hover {
	color: white;
}
#home a.btn-outline-secondary {
	border-width: 2px;
	border-color: white;
	background-color: rgba(230,76,5,0);
	transition: all 0.2s 
}
#home a.btn-outline-secondary:hover {
	background-color: rgba(230,76,5,1);
	color: white;
}
.da-thumbs figcaption p {
	position: relative;
}

/* ##### Home CallToAction Queries */
@media (min-width: 576px) { /* sm */
}
@media (min-width: 768px) { /* md */
}
@media (min-width: 992px) { /* lg */
}
@media (min-width: 1200px) { /* xl */
}
@media (min-width: 1400px) { /* xxl */
	#home a[class*="btn-"] {
		transform: scale(1);
	}
}

/* ##### Team ###### */
#filterLinks.team-filter a {
	background-repeat: no-repeat;
	background-size: 100%
}
#filterLinks.team-filter a img {
	opacity: 1;
	transition: all .3s
}
#filterLinks.team-filter a:hover img {
	opacity: 0;
}
.team-detail .card,
.newsletter-teaser,
.jobs-initiativ .card {
	color: var(--negative-highlight-color);
	background-color: var(--highlight-color);
	word-wrap: break-word;
	background-image: url("/shared/img/2023/farn-team-home.webp");
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: left bottom;
}
.newsletter-teaser h2,
.jobs-initiativ .card h2 {
	color: var(--negative-highlight-color);
}
.team-detail .card a,
.newsletter-teaser a,
.jobs-initiativ .card a {
	color: var(--negative-highlight-color);
}
.team-detail .card a:hover,
.newsletter-teaser a:hover,
.jobs-initiativ .card a:hover {
	color: var(--link-text)!important;
}
.jobs-initiativ .card a.btn:hover {
	color: var(--highlight-color)!important;
}
.team-detail .card > div,
.newsletter-teaser > div,
.jobs-initiativ .card > div {
	background: rgba(230,76,6,.6);
}
.team-info .card {
	word-wrap: break-word
}
.team-detail p[class*="fs-"] {}
	
/*
.team-info a {
	border-bottom: 1px solid #555;
}
*/
.team-info .h3 a {
	letter-spacing:0;
}
#content .team-info p {
	margin-bottom: 0.6rem;
}
.team-head,
.jobs-head {
	color: #fff;
	position: relative; 
	overflow: hidden;
}
.team-head-text,
.jobs-head-text {
	position: absolute; 
	right: 2rem; 
	bottom: 1rem; 
	text-align: right;
}
#content div.jobs-head.team-head-text {
	width: auto;
}
#content div.jobs-head.jobs-head-text {
	width: 500px;
}
/*
.team-head p:first-of-type {
font-size: 5rem;
font-family: 'Barlow';
}
.team-head h2.h3 {
line-height: unset;
}
.team-head h5 {
font-size: 1.8rem; 
color: #fff; 
margin-left: 0%; 
}
*/
.team h5 {
	font-weight: 600;
}
#content.team div.jobs-head p.h3 {
	font-size: 1.5rem;
}
.team dt {
	font-weight: 500
}
#team-tier-bild[src*=".svg"] {
	max-width: 300px;
}
/*
.team dt,.team dd {
font-size: 1rem
}
*/
/* ##### Team Queries */
@media (min-width: 576px) { /* sm */
	.css-cols-1, .css-cols-2, .css-cols-3, .css-cols-4 {
		column-gap: 1rem;
		margin-bottom: 1.5rem
	}
	.css-cols-1 {
		column-count: 1;
	}
	.css-cols-2 {
		column-count: 2
	}
	.css-cols-3 {
		column-count: 2
	}
	.css-cols-4 {
		column-count: 2
	}
}
@media (min-width: 768px) { /* md */
	.team-head img, .jobs-head img, .team-head, .jobs-head {
		height: 100%;
	}
		.responsive-header .header-text {
		color:white !important;
}
.responsive-header .header-text h1{
		color:white !important;
}
}
@media (min-width: 992px) { /* lg */
	.css-cols-1 {
		column-count: 1;
	}
	.css-cols-2 {
		column-count: 2
	}
	.css-cols-3 {
		column-count: 3
	}
	.css-cols-4 {
		column-count: 3
	}

}
@media (min-width: 1200px) { /* xl */
	.css-cols-1 {
		column-count: 1;
	}
	.css-cols-2 {
		column-count: 2
	}
	.css-cols-3 {
		column-count: 3
	}
	.css-cols-4 {
		column-count: 4
	}
}
@media (min-width: 1400px) { /* xxl */
}

/* ##### Profil ##### */
#profil .slide-card {
	background-color: var(--highlight-background);
	min-height: 300px;
}
#profil .slide-card .front {
	position: relative;
	background-color: var(--highlight-background);
}
#profil .slide-card .back {
	color: var(--negative-highlight-color);
	position: absolute;
	top: 0;
	left: 0;
	background-color: var(--lowlight-color);
	background-image: url('/shared/img/2023/grey-farn.png');
	background-repeat: no-repeat;
	background-position: 0% 105%;
	background-size: 100%;
	transform: translateX(100%);
	transition: all .3s ease
}
#profil .slide-card:hover .back {
	transform: translateX(0%)
}
#cSlider01 .slick-dots {
	bottom: auto
}
.profile-answer {
	color: var(--negative-highlight-color);
	background-color: var(--highlight-color);
}
/* ##### Netzwerk ##### */
.nw-logo img {
	mix-blend-mode: multiply;
	max-height: 100px
}
/* ##### referenzen / kunden ##### */
#kunden img {
	background-color: white;
	padding: 1rem;
}
.kundenlogo {
	mix-blend-mode: luminosity;
	filter: grayscale(1);

}
.customer-filter {
	column-count: 2;
	column-gap: 1.5rem
}
/* ##### Allg. ##### */
#filterLinks {
	position: relative
}
#collapseFilter {
	background-color: var(--collapse-filter-background);
	border-bottom: 1px solid var(--lowlight-color);
}
.object-fit-top {
	object-position: 0 0
}
.object-fit-bottom {
	object-position: 0 100%
}
option {
	border: 1px solid var(--bs-body-color);
	border-radius: 0;
}
.form-control:focus,
.form-control-lg:focus-visible,
select:focus-visible {
	outline: none;
	box-shadow: 0 0 0 .25rem rgba(var(--highlight-rgb),.25);
}
.scroll-to-top {
	display: none;
}
/* ##### footer ##### */
footer { 
}
footer section,
#homeForm .modal-footer {
	color: var(--meta-nav-text);
	font-size: inherit;
	background-color: rgb(45,45,47);
	background-image: url(/shared/img/2023/footerbg.webp);
	background-repeat: no-repeat;
	background-position: 50%
}
footer section div a {
	color: var(--main-nav-text);
	text-transform: uppercase;
}
footer section div:not(.social) > a:nth-of-type(2) {
	margin-left: 2rem;
}
footer small {
	color: var(--main-nav-text);
	font-size: .75em
}
/* ##### shariff overwrite #### */
@media only screen and (min-width: 1px) {
	.shariff .orientation-horizontal.button-style-standard li {
		min-width: unset!important;
		width: auto;
	}
	.shariff li .share_text {
		display: none!important;
	}
}
/* ##### Cocoen Bildvergleich im Blog ovewrite #### */
.cocoen-drag::before {
    border: 3px solid var(--highlight-color);
}
.cocoen-drag {
    background: var(--highlight-color);
}


.card-flip {
     perspective: 1000px;
}
.card-flip-inner {
   position: relative;
   width: 100%;
   min-height: 250px; 
   transform-style: preserve-3d;
   transition: transform 0.6s;
}
.card-flip:hover .card-flip-inner {
  	transform: rotateY(180deg);
}
.card-front, .card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    display: flex;
   
		margin:auto;
}
.card-front{
  color: rgb(60,60,62);
 /* background: rgb(60,60,62);*/
	background: var(--default-background);
	justify-content: center;
  align-items: center;
	text-align:center;
	
}
.card-back {
	color:#000000;
	background:#fff;
}
.card-back {
   transform: rotateY(180deg);
}
.video-container {
      width: 100%;
      height: 100%;
}
.video-container video {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Video skalieren, um den gesamten Container zu füllen */
}
.accordion{
	--bs-accordion-btn-focus-border-color:var(--negative-highlight-color);
	--bs-accordion-btn-focus-box-shadow:0 0 0 0.25rem var(--negative-highlight-color);
	--bs-accordion-border-radius:0 !important;
}
.accordion-item{
 border:1px solid var(--highlight-color);
}
.accordion-button{
 background-color:var(--highlight-color);
 border:1px solid var(--highlight-color);
 color:#fff;
	border-radius:0 !important;
}
.accordion-button::after{
 color:#fff;
}
.accordion-button:not(.collapsed){
	 background-color:var(--highlight-color);
 box-shadow:none;
	border-radius:0 !important;
}
.full-width-video{
    width: 100%;
    height: auto;
}

ul.cmsList {
  list-style:none; /* Replace with your image path */
}
.cmsList {
  list-style: none; /* Remove default bullet points */
  padding: 0;
  margin: 0;
}

.cmsList li {
  display: flex; /* Align icon and text side by side */
  align-items: center; /* Vertically align icon with text */
  margin-bottom: 20px; /* Add spacing between list items */
}

.cmsList .icon {
  font-size: 48px;
  color: rgb(230, 76, 5);
  margin-right: 27px;
  margin-top: -11px;
}

.cmsList .content h4 {
  margin: 0;
 
}

.cmsList .content p {
  margin: 5px 0 0; /* Add some spacing below the heading */
}
.splide__pagination__page {
	height:12px !important;
	width:12px !important;
	border:1px solid rgb(230, 76, 5) !important;
	background-color:#fff !important ;
}
.splide__pagination__page.is-active {
  background:rgb(230, 76, 5) !important;
	transform: none !important;
}
.splide__arrow svg{
 	width: auto !important; /* Resets width to the default (based on content or parent constraints) */
  height: auto !important; /* Resets height to the default */
	fill:rgb(230, 76, 5) !important;
}

.splide__arrow{
	background:none !important;
}
/* Style for the overlay */
.image-overlay {
  position: absolute; /* Position it over the image */
  top: 0;
  left: 0;
  width: 100%; /* Cover the entire image */
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Black with 50% transparency */
  z-index: 1; /* Ensure the overlay is above the image but below the text */
}

.header-text {
  position: absolute;
  top: 45%; /* Position 30% from the top of the container */
  left: 50%; /* Position 10% from the left of the container */
  /* transform: translate(-20%, -50%);  Adjust text centering */
  color: white;
 /* text-align: center; Optional: Centers text horizontally */
	transform: translateX(-50%); /* Center horizontally using transform */
  width: calc(100% - 30px); 
	max-width: 1320px;
	padding:15px;
	z-index:2;
}
.header-text h1 {
    font-size: 3rem; /* Smaller font size for mobile */
  }
  .header-text p {
    font-size:1.8rem; /* Adjust paragraph size for smaller screens */
	}

	#lpmarkting .card-body{
 font-size: 1rem;
}



@media (max-width: 1330px) {
	.header-text {
	  top: 30%; /* Position 30% from the top of the container */
	}
	
	.header-text p {
    margin-bottom: 0.2rem; /* Adjust paragraph size for smaller screens */
  }
  .header-text h1 {
     font-size: calc(1.375rem + 1.5vw); /* Smaller font size for mobile */
  }

  .header-text p {
    font-size: 1.7rem; /* Adjust paragraph size for smaller screens */
}

}
@media (max-width: 900px) {
 /* .header-text h1 {
    font-size: 1.5rem; /* Smaller font size for mobile 
	
  } 

  .header-text p {
    font-size: 1rem; /* Adjust paragraph size for smaller screens 
} */

}
@media (max-width: 768px) {
/*	.header-text h1 {
    font-size:1.4rem;  Smaller font size for mobile 
  } */
	.header-text p {
    margin-bottom: 2rem; /* Adjust paragraph size for smaller screens */
  }
	.responsive-header {
    display: flex;
    flex-direction: column;

  }
	.responsive-header .header-text {
    position: static !important;
    transform: none !important;;
    padding: 3rem !important;;
    text-align: left !important;;
    color: #333 !important;;
    z-index: auto !important;;
  }
	.main-top{
	  position:relative;
		top:148px;
	}
	
}


/* Accordion button custom plus/minus icons using Bootstrap Icons font */
.icon-toggle {
  font-size: 1.7rem;
  color: var(--highlight-color, #d63384); /* fallback to pink if custom var missing */
  transition: transform 0.2s ease, color 0.2s ease;
}
.accordion-button-markting::after{
  background-image:none;
	 display: none !important;
}

.accordion-button-markting:not(.collapsed)::after{
  background-image:none;
	display: none !important;

}
.accordion-markting-button:not(.collapsed) .icon-toggle {
  color: var(--highlight-color, #d63384); /* active state color */
}

.markting-references a.card{
 background:var(--default-background)!important;

}
.markting-references a.card.ref-teaser figcaption{
 background:var(--default-background)!important;

}
.responsive-header {
  min-height: 88vh; /* or 70vh for more visibility */
  position: relative !important;
  overflow: hidden;
}

.responsive-header img {
  object-fit: cover;
  width: 100% !important;;
  height: 100% !important;;
  display: block !important;;
}



