/*
Theme Name:   Cancom Partner Theme (GREYD.SUITE Child)
Description:  Custom Version of the GREYD.SUITE main theme.
Author:       Cancom x GREYD
Author URI:   https://www.cancom.com
Template:     greyd_suite
Version:      2.1.04
Tags:         
*/

/**
 * CSS für WPML kreis um Sprachauswahl
 */

.menu-item-object-wpml_ls_menu_item,
.wpml-ls-item-legacy-list-horizontal {
	margin-left: 5px !important;
	border: 1px solid #cdcdcd;
	border-radius: 20px;
	padding: 6px 7px;
	outline: none;
	font-size: 11px;
	max-width: 38px !important;
	max-height: 36px !important;
}

.wpml-ls-item-legacy-list-horizontal {
	padding: 6px 0px !important;
}

li.menu-item-type-post_type:last-child {
	margin-right: 30px !important;
}

.wpml-ls-item a[title^="DE"],
.wpml-ls-item a[title^="AT"],
.wpml-ls-item a[title^="EN"] {
	margin-bottom: 0px !important;
}

.wpml-ls-item {
	margin: 6px;
}

/**
  * Rankmath Breadcrumps
  */

nav.rank-math-breadcrumb {
	color: var(--color32);
}

nav.rank-math-breadcrumb a {
	color: var(--color32);
}

nav.rank-math-breadcrumb a:hover {
	color: var(--color41);
}


/**
  * Footer neu mit Buttons und Conditional Content
  */

div.ccfooternav .search_result {
	padding-top: 0px;
	padding-bottom: 0px;
}

div.ccfooternav a.link {
	margin-bottom: 0px;
}
@media only screen and (max-width: 607px) {
	.ccfooternav .search_result {
    	width: 100% !important;
	}
}
@media only screen and (min-width: 608px) {
	.ccfooternav.small .search_result {
		width: auto !important;
	}
}


/* Social Icons im Footer */

.cc-social-loop article:not(:last-of-type) img {
	aspect-ratio: 1/1;
	margin-right: 20px;
}
.cc-social-loop article:last-of-type img {
	aspect-ratio: 1/1;
	margin-right: -45px;
	padding-right: 0px;
}
.cc-social-loop article:last-of-type {
	padding-right: calc(var(--gutter) * -1);
}

/**
  * Footer Social Icons Format
  */

div.cc-social img {
	min-width: 3vw !important;
	min-height: 3vh !important;
}

@media (max-width: 767.98px) {
	.cc-social-loop article.search_result {
		width: calc(16.666666666667%) !important;
	}
}
/**
  * Quicklinks
  */

.wp-block-greyd-buttons .quicklink {
	text-align: left;
	color: var(--color31) !important;
	border-color: var(--color31) !important;
	font-weight: 400;
}

.wp-block-greyd-buttons .quicklink .arrow_right,
.wp-block-greyd-buttons .quicklink .arrow_down,
.wp-block-greyd-buttons .quicklink .arrow_right-up {
	float: right;
	margin-top: 3px;
}

@media only screen and (max-width: 768px) and (orientation: portrait) {

	.wp-block-greyd-buttons .quicklink .arrow_right,
	.wp-block-greyd-buttons .quicklink .arrow_down,
	.wp-block-greyd-buttons .quicklink .arrow_right-up {
		display: none;
	}
}

a.quicklink {
	margin-left: 5%;
	margin-bottom: 0px !important;
}

a.quicklink:hover {
	background: var(--color31) !important;
	color: var(--color62) !important;
	border-color: var(--color31) !important;
}

/**
  * BURGER MENU MOBILE RED BOX
  */

@media only screen and (max-width: 1199px) {

	/* header burger title */
	span#dropmenu_all::after {
		position: absolute;
		top: 36px;
		content: 'MENU';
		color: #fff;
		font-size: 0.6em;
		right: 10px;
	}

	/* header burger wrapper */
	.navigation.v2 .burger_wrapper.mobile, .navigation.v2 .burger_wrapper {
		position: fixed;
		top: 0px;
		right: 0px;
		left: auto;
		min-width: 3.5em;
		max-width: 3.5em;
		margin-left: 0px;
		min-height: 60px;
	}
	.navigation.v2 .hamburger {
		min-height: 60px;
	}

	/* header burger button */
	.navigation.v2 .hamburger-box {
		top: -6px;
		left: 0px;
	}

	/* offmenu close button */
	.navigation.v2 .offmenu#mainmenuoff .hamburger .hamburger-box {
		scale: 1.5;
		top: 20px;
		right: 20px;
	}

	.holder.horizontal.holder_right .menu_wrapper.on {
		margin-right: 4em !important;
	}
	.navigation.v2 .desktop {
		display: none;
	}

	/* #mainmenu.scrolled .burger_wrapper.mobile {
		 margin-top: 20px !important;
	 } */
}
@media only screen and (min-width: 769px) and (max-width: 1199px) {
	.navigation.v2 .hamburger-box {
		top: -6px;
		left: -3px;
	}
}
@media only screen and (min-width: 1200px) {
	.navigation.v2 .burger_wrapper {
		display: none;
	}
}


/**
  * Zeile oben unter dem Menu Sticky andocken
  */

/*main:has(.stickytop) {
	overflow: unset;
} */
#greyd_main {
	overflow: unset;
}

.stickytop.mobile {
	top: calc(var(--HEDMOBheightScr) + var(--HEDMOBtopbottom) + var(--HEDMOBtopbottom) - 1px);
	position: -webkit-sticky !important; /* Safari */
  	position: sticky !important;
    z-index: 100;
    background: #fff;
    padding: 10px 0;
}
@media only screen and (min-width: 769px) {
	.stickytop.mobile-xl {
		top: calc(var(--HEDheightScr) + var(--HEDtopbottom) + var(--HEDtopbottom) - 1px);
		position: -webkit-sticky !important; /* Safari */
		position: sticky !important;
		z-index: 100;
		background: #fff;
		padding: 10px 0;
	}
}
@media only screen and (min-width: 992px) {
	.stickytop {
		top: calc(var(--HEDheightScr) + var(--HEDtopbottom) + var(--HEDtopbottom));
		position: -webkit-sticky !important; /* Safari */
		position: sticky !important;
		z-index: 100;
		background: #fff;
		padding: 10px 0;
	}
}

.tuo_blbo img {
	height: 35rem !important;	
}
.tuo_ratio_16-9 img {
	aspect-ratio: 16 / 9;
}
.tuo_ratio_16-10 img {
	aspect-ratio: 16 / 10;
}
.tuo_ratio_4-3 img {
	aspect-ratio: 4 / 3;
}
.tuo_ratio_4-4 img {
	aspect-ratio: 4 / 4;
}
.tuo_ratio_4-5 img {
	aspect-ratio: 4 / 5;
}
.tuo_ratio_4-6 img {
	aspect-ratio: 4 / 6;
}
.tuo_ratio_1-1 img {
	aspect-ratio: 1 / 1;
}
.tuo_ratio_2-1 img {
	aspect-ratio: 2 / 1;
}
.tuo_ratio_1-2 img {
	aspect-ratio: 1 / 2;
}
.tuo_min-width {
	min-width: 150px;
}


/**
  * Borlabs
  */

._brlbs th {
	border-bottom: 1px solid var(--color61);
	width: 30%;
	font-weight: var(--TBLfontWeight);
	font-size: var(--TBLfontSize);
}

table._brlbs {
	margin-bottom: 50px;
}


/* Basic */
#BorlabsCookieBox * {
	font-family: "Gotham", "Arial", sans-serif !important;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
}

#BorlabsCookieBox ._brlbs-bar {
	background-color: #000 !important;
	color: #fff !important;
	font-family: "Gotham", "Arial", sans-serif !important;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
}

/* Layout */
#BorlabsCookieBox ._brlbs-bar .container {
	max-width: 100vw !important;
	padding-left: calc(1712px * 0.045) !important;
	padding-right: calc(1712px * 0.045) !important;
}

@media (max-width: 1024px) {
	#BorlabsCookieBox ._brlbs-bar .container {
		padding-left: calc(100% * 0.05) !important;
		padding-right: calc(100% * 0.05) !important;
	}
}

/* Logo */
#BorlabsCookieBox ._brlbs-bar .cookie-logo {
	max-width: 100px !important;
}

/* Button */
#BorlabsCookieBox ._brlbs-btn {
	background-color: #da002d !important;
	color: #fff !important;
	text-align: center !important;
	border-radius: 2em !important;
}

#BorlabsCookieBox ._brlbs-btn:hover,
#BorlabsCookieBox ._brlbs-btn:active,
#BorlabsCookieBox ._brlbs-btn:focus {
	background-color: #bf0026 !important;
	color: #fff !important;
	outline: none;
}

/* Link */
#BorlabsCookieBox ._brlbs-manage a {
	color: #ff0035;
}

#BorlabsCookieBox ._brlbs-manage a:hover {
	color: #ff0035;
}

#BorlabsCookieBox ._brlbs-refuse a,
#BorlabsCookieBox a {
	color: #ff0035 !important;
}

#BorlabsCookieBox a:hover,
#BorlabsCookieBox ._brlbs-refuse a:hover {
	color: #ff0035 !important;
}

/* Hide Testmessage */
#BorlabsCookieBox p > .text-center {
	opacity: 0 !important;
	visibility: hidden !important;
	height: 0 !important;
	width: 0 !important;
}

/* Boxen */
#BorlabsCookieBox .cookie-preference table,
#BorlabsCookieBox .bcac-item {
	background-color: #131313 !important;
	border-radius: 4px !important;
	color: #fff !important;
	padding: 1em !important;
}

#BorlabsCookieBox .cookie-preference table tr td,
#BorlabsCookieBox .cookie-preference table tr th {
	background: transparent !important;
	border-color: #383838 !important;
	color: #fff !important;
}

/* Switch */
.BorlabsCookie ._brlbs-btn-switch input:checked + ._brlbs-slider {
	background-color: #da002d
}

/* Desktop only */
@media(min-width:768px) {

	/* space after logo */
	.BorlabsCookie .col-10 p {
		padding-left: 1em !important;
		padding-right: 1em !important;
	}

	/* button right aligned */
	#BorlabsCookieBox ._brlbs-bar ._brlbs-accept {
		text-align: right !important;
	}
}

/* Mobile */
@media(max-width:767px) {

	/* layout */
	#BorlabsCookieBox ._brlbs-bar .container {
		padding: 0 10px !important;
		max-width: 90vw !important;
	}

	/* button section full width */
	.BorlabsCookie .col-12 {
		-webkit-box-flex: 0 !important;
		-ms-flex: 0 0 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}

	/* logo wider */
	.BorlabsCookie .col-2 {
		-webkit-box-flex: 0 !important;
		-ms-flex: 0 0 33.3333333333% !important;
		flex: 0 0 33.3333333333% !important;
		max-width: 33.3333333333% !important;
	}

	/* text full width */
	.BorlabsCookie .col-10 {
		-webkit-box-flex: 0 !important;
		-ms-flex: 0 0 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}

	/* logo */
	#BorlabsCookieBox ._brlbs-bar .cookie-logo {
		padding-bottom: 1em !important;
	}
}

@media(max-width: 575px) {

	/* button full width */
	#BorlabsCookieBox ._brlbs-btn {
		width: 100% !important;
	}
}

#BorlabsCookieBox ._brlbs-box,
#BorlabsCookieBox ._brlbs-bar {
	padding-top: 50px;
	padding-bottom: 50px;
}

/* Shariff Button Anpassung */

.shariff-button {
	width: 80px !important;
  min-height: 80px !important;
	background-color: #fff !important;
}
.shariff-link {
	min-height: 80px !important;
  background-color: var(--color23) !important;
	border: none !important;
	border-radius: 50%;
}
.shariff-link:hover {
	background-color: var(--color23) !important;
}
span.shariff-icon {
	position: relative;
    left: calc(50% - 27px);
    top: calc(50% - 21px);
}
.whatsapp span.shariff-icon {
	left: calc(50% - 22px);
}
.linkedin span.shariff-icon {
	left: calc(50% - 25px);
}
.xing span.shariff-icon {
	left: calc(50% - 25px);
}
span.shariff-text {
	display: none !important;
}
.shariff .buttonsize-large .shariff-icon svg {
    width: 50px !important;
    height: 40px !important;
    padding: 0px !important;
}
.shariff .facebook .shariff-icon svg path {
    fill: #3b5998 !important;
}
.shariff .linkedin .shariff-icon svg path {
    fill: #0077b5 !important;
}
.shariff .xing .shariff-icon svg path {
    fill: #126567 !important;
}
.shariff .whatsapp .shariff-icon svg path {
    fill: #34af23 !important;
}

/* 
	1) .cc-clamp-content-4 muss im Loop gesetzt werden, um die Lineclamp für einen Absatz mit mindesthöhe 4 Zeilen zu setzen. 
		Der P tag muss die klasse .tuo-content haben.
	2).cc-clamp-h6-5 muss im Loop gesetzt werden, um die Lineclamp für eine H6 mit mindesthöhe 5 Zeilen zu setzen.
 */
:root {
	--clampmultiplier: 0.98em;
}


@media only screen and (min-width: 768px) {
	.cc-clamp-content-5 p.tuo-content {
		min-height: calc(var(--lineHeight) * 5 * var(--clampmultiplier));
		-webkit-line-clamp: 5 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}

	.cc-clamp-content-4 p.tuo-content {
		min-height: calc(var(--lineHeight) * 4 * var(--clampmultiplier));
		-webkit-line-clamp: 4 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	
	.cc-clamp-content-3 p.tuo-content {
		min-height: calc(var(--lineHeight) * 3 * var(--clampmultiplier));
		-webkit-line-clamp: 3 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-content-2 p.tuo-content {
		min-height: calc(var(--lineHeight) * 2 * var(--clampmultiplier));
		-webkit-line-clamp: 2 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
/************** H6 ********/
	.cc-clamp-h6-5 h6 {
		min-height: calc(var(--H6lineHeight) * 5 * var(--clampmultiplier));
		-webkit-line-clamp: 5 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h6-4 h6 {
		min-height: calc(var(--H6lineHeight) * 4 * var(--clampmultiplier));
		-webkit-line-clamp: 4 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h6-3 h6 {
		min-height: calc(var(--H6lineHeight) * 3 * var(--clampmultiplier));
		-webkit-line-clamp: 3 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h6-2 h6 {
		min-height: calc(var(--H6lineHeight) * 2 * var(--clampmultiplier));
		-webkit-line-clamp: 2 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
/************** H5 ********/
	.cc-clamp-h5-5 h5 {
		min-height: calc(var(--H5lineHeight) * 5 * var(--clampmultiplier));
		-webkit-line-clamp: 5 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h5-4 h5 {
		min-height: calc(var(--H5lineHeight) * 4 * var(--clampmultiplier));
		-webkit-line-clamp: 4 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h5-3 h5 {
		min-height: calc(var(--H5lineHeight) * 3 * var(--clampmultiplier));
		-webkit-line-clamp: 3 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h5-2 h5 {
		min-height: calc(var(--H5lineHeight) * 2 * var(--clampmultiplier));
		-webkit-line-clamp: 2 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
/************** H4 ********/
	.cc-clamp-h4-5 h4 {
		min-height: calc(var(--H4lineHeight) * 5 * var(--clampmultiplier));
		-webkit-line-clamp: 5 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h4-4 h4 {
		min-height: calc(var(--H4lineHeight) * 4 * var(--clampmultiplier));
		-webkit-line-clamp: 4 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h4-3 h4 {
		min-height: calc(var(--H4lineHeight) * 3 * var(--clampmultiplier));
		-webkit-line-clamp: 3 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h4-2 h4 {
		min-height: calc(var(--H4lineHeight) * 2 * var(--clampmultiplier));
		-webkit-line-clamp: 2 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
/************** H3 ********/
	.cc-clamp-h3-5 h3 {
		min-height: calc(var(--H3lineHeight) * 5 * var(--clampmultiplier));
		-webkit-line-clamp: 5 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h3-4 h3 {
		min-height: calc(var(--H3lineHeight) * 4 * var(--clampmultiplier));
		-webkit-line-clamp: 4 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h3-3 h3 {
		min-height: calc(var(--H3lineHeight) * 3 * var(--clampmultiplier));
		-webkit-line-clamp: 3 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h3-2 h3 {
		min-height: calc(var(--H3lineHeight) * 2 * var(--clampmultiplier));
		-webkit-line-clamp: 2 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
/************** H2 ********/
	.cc-clamp-h2-5 h2 {
		min-height: calc(var(--H2lineHeight) * 5 * var(--clampmultiplier));
		-webkit-line-clamp: 5 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h2-4 h2 {
		min-height: calc(var(--H2lineHeight) * 4 * var(--clampmultiplier));
		-webkit-line-clamp: 4 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h2-3 h2 {
		min-height: calc(var(--H2lineHeight) * 3 * var(--clampmultiplier));
		-webkit-line-clamp: 3 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h2-2 h2 {
		min-height: calc(var(--H2lineHeight) * 2 * var(--clampmultiplier));
		-webkit-line-clamp: 2 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
/************** H1 ********/
	.cc-clamp-h1-5 h1 {
		min-height: calc(var(--H1lineHeight) * 5 * var(--clampmultiplier));
		-webkit-line-clamp: 5 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h1-4 h1 {
		min-height: calc(var(--H1lineHeight) * 4 * var(--clampmultiplier));
		-webkit-line-clamp: 4 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h1-3 h1 {
		min-height: calc(var(--H1lineHeight) * 3 * var(--clampmultiplier));
		-webkit-line-clamp: 3 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
	.cc-clamp-h1-2 h1 {
		min-height: calc(var(--H1lineHeight) * 2 * var(--clampmultiplier));
		-webkit-line-clamp: 2 !important;
		display: -webkit-box !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}
}