/*************************************************
* CONSENT Banner
*************************************************/

/* Border Radius */

.consent-wrap .consent-banner,
.consent-wrap .consent-settings	
	{border-radius: 0 !important;}

.consent-wrap .cb-button,
.consent-wrap .cs-button,
.consent-settings-link-wrap .consent-button, /* Datenschutz-Seite */
.consent-placeholder-container .consent-placeholder button  /* Placeholer */
	{border-radius: 12px !important;}

.consent-settings .cs-list-item 
	{border-radius: 12px !important;}


/* Font styles etc. */

.consent-wrap {
	font-family: inherit !important;
	font-size: 15px !important;
	line-height: 1.4 !important;	
}

.consent-wrap .text-sm {
	font-size: 14px !important;
}

.consent-wrap p {
	margin-bottom: 12px !important;
	line-height: 1.4;
}

.consent-wrap .cb-button,
.consent-wrap .cs-button,
.consent-settings-link-wrap .consent-button /* Datenschutz-Seite */ {
	padding: .675em !important;	
	font-size: 17px !important;
	font-weight: 600 !important; 
	line-height: 1.4 !important;
	text-decoration: none;
}

.consent-banner .cb-wrap-text .cb-title,
.consent-settings .cs-wrap-text .cs-title {	
	font-weight: 600;
	font-size: 135%;
	padding-right: 30px;
}

.consent-banner .consent-links-legal a,
.consent-settings .consent-links-legal a {
	font-size: 14px;
	font-weight: 400;
}

.consent-settings .cs-list-item-name {
	font-size: 16px;
}



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

	.consent-wrap {
		font-size: 15px !important;
		line-height: 1.333 !important;	
	}

	.consent-wrap .text-sm {
		font-size: 13px !important;
	}

	.consent-wrap .cb-button,
	.consent-wrap .cs-button,
	.consent-settings-link-wrap .consent-button /* Datenschutz-Seite */ {
		font-size: 15px !important;
	}
	
	.consent-banner .consent-links-legal a,
	.consent-settings .consent-links-legal a {
		font-size: 13px;
	}
	
}




/* Colors + Background Colors */

.consent-wrap .consent-banner,
.consent-wrap .consent-settings {
	background-color: #fff;
}

.consent-wrap .cb-button-primary,
.consent-wrap .cs-button-primary {
	color: #fff !important;
	background-color: #262626 !important;
}

.consent-wrap .cb-button-secondary,
.consent-wrap .cs-button-secondary,
.consent-settings-link-wrap .consent-button  /* Datenschutz-Seite */ {
	color: #374c40;
	background-color: #e1e1e1;
}

.consent-banner .consent-links-legal a,
.consent-settings .consent-links-legal a {
	color: #990600;
}

.consent-banner .consent-links-legal a:hover,
.consent-settings .consent-links-legal a:hover {
	opacity: .6;
}

.consent-settings .cs-list-item .cs-link-more {
	color: #990600;
}

.consent-settings input:checked + .cs-slider {
	background-color: #262626;
}

.consent-settings input:focus + .cs-slider {
	box-shadow: 0 0 1px #262626;
}

.consent-settings .cs-list-item .cs-tag {
	background-color: #262626;
	color: #fff;
	white-space: nowrap;
}

.consent-settings .cs-list-inner .cs-list-item-name {
	color: #990600;
}

.consent-settings .cs-list-item .cs-link-more {
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path style="fill:rgb(191,191,191);fill-opacity:1;" d="M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z"/></svg>') left no-repeat; background-size: 1em 1em !important;
}

.consent-settings .cs-list-item .cs-link-more.Active {
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path style="fill:rgb(191,191,191);fill-opacity:1;" d="M432 256c0 17.7-14.3 32-32 32L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l352 0c17.7 0 32 14.3 32 32z"/></svg>') left no-repeat; background-size: 1em 1em !important;
}

/*************************************************
* Standards
*************************************************/

/* Buttons*/
.consent-wrap .cb-button,
.consent-wrap .cs-button {	
	height: auto !important;
	border: 0 !important;
	box-shadow: none !important;
	margin-left: .5em; 
	margin-right: .5em;
	flex: 0 0 calc(50% - 1em);
	cursor: pointer;
}
	
.consent-wrap .cb-button:hover,
.consent-wrap .cs-button:hover,
.consent-settings-link-wrap .consent-button:hover /* Datenschutz-Seite */ {
	opacity: .6 !important;
}

/* Transition */
.consent-wrap a,
.consent-wrap .cb-button,
.consent-wrap .cs-button,
.consent-placeholder-container .consent-placeholder button, /* Placeholder */
.consent-settings-link-wrap .consent-button /* Datenschutz-Seite */ {
	transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
}

/* Cosent-Wrap */
.consent-wrap {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(150,150,150,.65);
	z-index: 10000000000;
	overflow-y: auto;
	animation-name: ConsentFadeIn;
	animation-duration: 1.5s;
	animation-iteration-count: 1;
	animation-delay: .5s;
	animation-fill-mode: both;
}

		@keyframes ConsentFadeIn { 
			0%	 {opacity: 0;}
			100% {opacity: 1;}
		}


/******************
* Banner 
******************/
.consent-banner {
	z-index: 1;
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 2em);
	max-width: 1400px;
	margin: auto;

	-webkit-box-shadow: 0px -1px 16px 0px rgba(0,0,0,0.125);
	-moz-box-shadow: 0px -1px 16px 0px rgba(0,0,0,0.125);
	box-shadow: 0px -1px 16px 0px rgba(0,0,0,0.125);
	
	animation-name: ConsentBannerFadeIn;
	animation-duration: 1.5s;
	animation-iteration-count: 1;
	animation-delay: 1.3s;
	animation-fill-mode: both;
}

		@keyframes ConsentBannerFadeIn { 
			0%	 {opacity: 0; transform: translate(-50%, -30%);}
			100% {opacity: 1; transform: translate(-50%, -50%);}
		}
	


.consent-banner .cb-wrap {	
	position: relative;
    margin: auto;
	text-align: left;
}

.consent-banner .cb-wrap-inner {	
	display: flex;
}

.consent-banner .cb-wrap-text {
	padding: 2em 1.5em 1.75em 2em; 
}

.consent-banner .cb-wrap-text .consent-links-legal {
	position: absolute;
	right: 2em; 
	bottom: 1.25em;
}

.consent-banner .cb-wrap-text .consent-links-legal a {
	display: inline-block; 
	margin-left: .5em;
}

.consent-banner .cb-wrap-buttons {
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 0 0 50%;
	padding: 2em 1.5em 2em 0;	
}

.consent-banner .cb-wrap-buttons .cb-wrap-buttons-inner {
	width: 100%;
	display: flex;
	justify-content: left;
	align-items: center;
	align-content: flex-start;
	white-space: nowrap;
	flex-wrap: wrap;
	padding-top: 2.5em;
	padding-bottom: 1.7em;
	padding-left: 1.5em;
	border-left: 1px solid #e2e2e2;
}

.consent-banner .cb-wrap-buttons .cb-button {
	margin-bottom: 1em;
}


/* -------------
* Banner Responsive
------------- */

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

	.consent-banner .cb-wrap-buttons {
		flex: 0 0 50%;
	}
	
}

@media screen and (max-width: 1200px) {
	
	.consent-banner .cb-wrap-buttons {
		flex: 0 0 24em;
	}
	
	.consent-banner .cb-wrap-buttons .cb-wrap-buttons-inner {
		flex-direction: column;
		align-content: center;
	}
	
	.consent-banner .cb-wrap-buttons .cb-button {
		width: 100%;
	}
	
	.consent-banner .cb-wrap-buttons .cb-button-01 {
		order: 1;
	}
	
	.consent-banner .cb-wrap-buttons .cb-button-02 {
		order: 2;
	}
	
	.consent-banner .cb-wrap-buttons .cb-button-03 {
		order: 3;
	}
	
}


@media screen and (max-width: 1024px) {
	
	.consent-banner {
		max-width: 540px;
	}
	
	.consent-banner .cb-wrap-inner {
		flex-direction: column;
	}
	
	.consent-banner .cb-wrap-buttons {
		flex: 0 0 auto;
		padding: 0;
	}
	
	.consent-banner .cb-wrap-buttons .cb-wrap-buttons-inner {
		flex-direction: column;
		align-content: center;
		padding: 0 1.9em 3.5em 1.9em;
	}
	
	.consent-banner .cb-wrap-buttons .cb-button {
		width: 100%;
	}

	.consent-banner .cb-wrap-text .consent-links-legal {
		bottom: .875em;
	}

}


@media screen and (max-width: 767px) {
	
	.consent-banner .cb-wrap-text {
		padding: 1.5em 1.25em 1.25em 1.25em;
	}
	
	 .consent-banner .cb-wrap-buttons .cb-wrap-buttons-inner {
		 padding-left: 1.25em;
		 padding-right: 1.25em;
	}
	 
	.consent-banner .cb-wrap-text .consent-links-legal {
		right: auto;
		left: 50%;
		transform: translateX(-50%);
		text-align: center;
	}
	
	.consent-banner .cb-wrap-text .consent-links-legal a {
		margin-left: .25em;
		margin-right: .25em;
	}

}


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

	.consent-banner {
		position: relative;
		left: 0;
		top: 0;
		margin: 15px auto;
		animation-name: ConsentBannerFadeInMobile;
	}
	
		@keyframes ConsentBannerFadeInMobile { 
			0%	 {opacity: 0; transform: translate(0%, 20%);}
			100% {opacity: 1; transform: translate(0%, 0%);}
		}
		
}


/******************
* Layer Settings
******************/

.consent-settings {
	z-index: 2;
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	
	width: calc(100% - 2em);
	max-width: 640px;	
	max-height: calc(100vh - 3em);
	margin: auto;
	overflow: hidden;

	-webkit-box-shadow: 0px -1px 16px 0px rgba(0,0,0,0.125);
	-moz-box-shadow: 0px -1px 16px 0px rgba(0,0,0,0.125);
	box-shadow: 0px -1px 16px 0px rgba(0,0,0,0.125);
	
	animation-name: ConsentSettingsFadeIn;
	animation-duration: 1s;
	animation-iteration-count: 1;
	animation-delay: 0;
	animation-fill-mode: both;
}

		@keyframes ConsentSettingsFadeIn { 
			0%	 {opacity: 0; transform: translate(-50%, -70%);}
			100% {opacity: 1; transform: translate(-50%, -50%);}
		}
	

.consent-settings .cs-wrap {	
	position: relative;
    width: 100%;
	max-height: 100%;
	max-height: calc(100vh - 3em);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.consent-settings a.cs-close {
  display: block;
  width: 25px;
  height: 25px;
  position: absolute;
  right: .75em;
  top: .75em;
  background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path style="fill:rgb(191,191,191);fill-opacity:1;" d="M15.898,4.045c-0.271-0.272-0.713-0.272-0.986,0l-4.71,4.711L5.493,4.045c-0.272-0.272-0.714-0.272-0.986,0s-0.272,0.714,0,0.986l4.709,4.711l-4.71,4.711c-0.272,0.271-0.272,0.713,0,0.986c0.136,0.136,0.314,0.203,0.492,0.203c0.179,0,0.357-0.067,0.493-0.203l4.711-4.711l4.71,4.711c0.137,0.136,0.314,0.203,0.494,0.203c0.178,0,0.355-0.067,0.492-0.203c0.273-0.273,0.273-0.715,0-0.986l-4.711-4.711l4.711-4.711C16.172,4.759,16.172,4.317,15.898,4.045z"></path></svg>') right no-repeat;
}

.consent-settings a.cs-close:hover {
	opacity: .6;
}

.consent-settings .cs-wrap-text {	
	position: relative;
	flex: 1 1 auto;
	padding: 2em 2em 1.5em 2em;
	overflow-y: auto;
	text-align: left;
}

.consent-settings .consent-links-legal a {
	display: inline-block;
	padding-right: 0.5em;
	margin-bottom: 1em;
}

.consent-settings .cs-wrap-buttons {
	display: flex;
	flex-wrap: wrap;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	align-items: center;
	white-space: nowrap;
	padding: .75em 1.25em;
	border-top: 1px solid #e2e2e2;
}

.consent-settings .cs-wrap-buttons button {
	margin-top: .375em;
	margin-bottom: .375em;
	width: calc(50% - 1em);
}

.consent-settings .cs-list {
	margin-top: 1em;
}

.consent-settings .cs-list-item {
	background-color: #eee;
	margin-top: .5em;
	overflow: hidden;
}

.consent-settings .cs-list-item .cs-list-item-wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .5em .75em .5em .625em;
	min-height: 50px;
}

.consent-settings .cs-list-item .cs-link-more {
	flex: 0 0 calc(100% - 60px);
	display: flex;
	align-items: center;
	padding-left: 1.5em;
	font-weight: 600;
	text-decoration: none;
}

.consent-settings .cs-list-item .cs-link-more:hover {
	opacity: .6;
}

.consent-settings .cs-list-item .cs-list-item-name {
	padding-right: .75rem;
}

.consent-settings .cs-list-item .cs-tag {
	display: inline-block;
	margin-top: .2125em;
	padding-left: .75em; 
	padding-right: .75em;
	padding-bottom: .15em;
	line-height: 1.666;
	font-size: 12px;
	font-weight: 400;
	border-radius: 1em;
}

.consent-settings .cs-list-item .cs-list-info-text {
	padding: .5em .75em .5em .75em;
	margin-left: 1.75em;
	margin-bottom: 1.75em;
	border: 1px solid #e2e2e2;
	border-radius: 4px;
	width: calc(100% - 100px);
	background-color: #fff;}

.consent-settings .cs-list-item.cs-list-item-required .cs-list-info-text {
	border-top: 2px solid #e2e2e2;
}

.consent-settings .cs-list-inner .cs-list-item {
	margin-top: 0;
	padding-top: .125em;
	padding-left: 1.5em;
	padding-bottom: 1.75em;
	background-color: #f7f7f7;
	border-radius: 0 !important;
	border-top: 1px solid #e2e2e2;
}

.consent-settings .cs-list-inner .cs-list-item-name {
	font-weight: 600;
}

.consent-settings .cs-list-inner .cs-list-info-text {
	margin-left: 0;
	margin-bottom: 0;
	width: calc(100% - 70px);
}

/* Toggle Switch */

.consent-settings .cs-switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
	margin: 0;
	transform: scale(.85);
	transform-origin: center right;
	 flex: 0 0 60px;
}

.consent-settings .cs-switch.cs-disabled {
	opacity: .5;
	pointer-events: none;
	cursor: default;
}

.consent-settings .cs-switch input {
  opacity: 0;
  width: 0;
  height: 0;
  box-shadow: none !important;
}

.consent-settings .cs-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 34px;
  box-shadow: none !important;
}

.consent-settings .cs-list-item .cs-switch .cs-slider:before {
  position: absolute;
  content: ' ';
  height: 28px;
  width: 28px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 50%;
}

.consent-settings input:checked + .cs-slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}


/* -------------
* Layer Setting Responsive
------------- */

@media screen and (max-width: 1400px) {
}

@media screen and (max-width: 1200px) {
}


@media screen and (max-width: 1024px) {
	
	.consent-settings {
		max-width: 600px;
	}

}


@media screen and (max-width: 767px) {
	
	.consent-settings .cs-wrap-text {
		padding: 1.5em 1.25em 1.25em 1.25em;
	}
	
	.consent-settings .cs-wrap-buttons {
		 padding-left: .75em;
		 padding-right: .75em;
	}

}

@media screen and (max-width: 576px) {
	
	.consent-settings .cs-wrap-buttons {
		flex-direction: column;
	}
	
	.consent-settings .cs-wrap-buttons .cs-button {
		width: 15em;
	}
	
	.consent-settings .cs-wrap-buttons .cs-button-01 {
		 order: 1;
	}
	
	.consent-settings .cs-wrap-buttons .cs-button-02 {
		 order: 2;
	}
	
	.consent-settings .cs-list-item-name {
		font-size: 100%;
	}
	
	.consent-settings .cs-list-item .cs-tag {
		margin-top: 0;
		margin-left: auto;
		font-size: 12px;
	}
	
	.consent-settings .cs-list-item .cs-list-info-text {
		width: calc(100% -  3.75em);
	}
	
	.consent-settings .cs-list-item-required .cs-link-more {
		flex: 0 0 100%;
	}
	
	.consent-settings .cs-switch.cs-disabled {
		display: none;
	}
	
	.consent-settings .cs-list-inner .cs-list-info-text {
		margin-top: .5em;
		width: calc(100% -  2em);
	}
	
	.consent-settings .cs-list-inner .cs-list-info-text p {
		font-size: 14px;
	}
	
}


/******************
* Content-Element Datenschutz-Seite
******************/

.consent-settings-link-wrap {
	margin-top: .5em;
	border: 1px solid #eee;
	padding: 1em;
	overflow: hidden;
	display: inline-block;
}

.consent-settings-link-wrap p {
	margin-top: 0;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.consent-settings-link-wrap .consent-button  {
	display: inline-block;
	cursor: pointer;
}


/******************
* Placeholder: Youtube + Googlemaps
******************/

.consent-placeholder-container {
	position: relative;
	width: 100%;
}

.consent-placeholder-container .consent-placeholder {
	position: absolute;
	top: 0; 
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
}

.consent-placeholder-container .consent-placeholder .consent-placeholder-wrap {
	margin: auto;
	padding: 30px;
	max-width: 600px;
	height: auto;
	text-align: center;
	background-color: transparent !important;
}

.consent-placeholder-container .consent-placeholder p {
	font-weight: 400;
	font-size: 15px;
}

.consent-placeholder-container .consent-placeholder p a {
	color: #777;
}

.consent-placeholder-container .consent-placeholder button {
	margin-top: .5em;
	padding: .5em .75em;	
	color: #fff;
	/* font-weight: 600; */
	box-shadow: none !important;
	border: none !important;
	background: #ff0000;
	cursor: pointer;
}

.consent-placeholder-container .consent-placeholder p a:hover,
.consent-placeholder-container .consent-placeholder button:hover {
	opacity: .6;
}

/* Placeholder: Youtube */
.consent-placeholder-container .consent-placeholder-youtube {
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(40,40,40,1) 80%);
}

.consent-placeholder-container .consent-placeholder-youtube p {
	color: #fff;
}

.consent-placeholder-container .consent-placeholder-youtube button {
	color: #fff;
	background: #ff0000;
}

/* Placeholder: Googlemaps */
.consent-placeholder-container .consent-placeholder-gmaps {
	background: rgb(231,244,231);
	background: linear-gradient(0deg, rgba(231,244,231,1) 0%, rgba(228,237,224,1) 80%);
}

.consent-placeholder-container .consent-placeholder-gmaps p {
	color: #000;
}

.consent-placeholder-container .consent-placeholder-gmaps button {
	color: #fff;
	background: #4285f4;
}
