/** MODAL WINDOWS**/
.modal {
	position: fixed;
	top: 0;
	width: 100vw;
	height: 100dvh;
	left: 0;
	display: none;
	z-index: 1000000;
	opacity:0;
	transition: opacity 300ms ease 0ms;
    overflow: visible;
	--white: 255,255,255;
	--black: 55,55,55;
	--darkblue: 0,74,118;
	--yellow: 255,199,44;
	--beige: 240,238,233;
}
body {
    position: relative;
}
body::before {
	content:'';
    position: absolute;
    z-index: 10000;
    inset: 0 0 -100vh 0;
    background: rgb(60,60,60,0.25);
    /*backdrop-filter: blur(2px);*/
    pointer-events: none;
	transition: all 150ms ease 0ms;
	opacity:0;
	transform: scale(0);
}
body.modal-open::before {
    opacity:1;
	transform: scale(1);
}
body.modal-open {
	/*overflow: hidden !important;*/
}
.modal.show {
	display:block !important;
	animation: _modal_show 300ms ease-in 0s forwards;
	animation-iteration-count: 1;
}
@keyframes _modal_show {
	0% {opacity:0}
	100% {opacity:1}
}
.modal.fadeout {
	opacity: 0;
	transition: opacity 300ms ease 6000ms;
}
.modal .wrapper {
	display: table;
	width: 100%;
	height: 100%;
}
.modal .wrapper-inner {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	padding: 0 0;
}
.modal .box {
	background: rgb(var(--white), 0.95);
	margin: 0 auto;
	padding:0 !important;
	max-width: 55rem;
	text-align: left;
	box-shadow: 0 0 0.5em rgb(60,60,60,0.25), 0 0 0.5em 0 rgb(var(--black), 0.75);
	border-radius: 0;
	position:relative;
	overflow: hidden;
	width: calc(100vw - 2rem);
	height: auto;
	max-height: 95vh;
	display: flex;
	flex-direction: column;
}
@media(max-width:767px){
	.modal .box {
		max-height: calc(100dvh - 2em);
	}
}
.modal .close {
	position:absolute;
	z-index:100;
	right: 0em;
	top: -0.125em;
	color: rgb(var(--black));
	padding: 0.5em;
	cursor: pointer;
	font-size: 1.125em;
}
.modal .heading + .close {
	color: rgb(var(--black));
}
.modal .mcontent {
	min-height: 10em;
	max-height: calc(100% - 2em);
	overflow-y: auto;
	padding: 0 1em 0.5em 1em;
	margin-top:2.75em;
	scrollbar-color: rgb(var(--yellow)) rgb(var(--white));
	scrollbar-width: thin;
	background: rgb(252,252,252);
}

.modal .heading {
	position:absolute;
	z-index: 0;
	width:100%;
	margin: 0;
	text-align: center;
	padding: 0.5em 1.5em 0.5em 0;
	background: rgb(var(--yellow));
	color: rgb(var(--black));
	font-weight: 700;
	font-size:1em;
}
.modal .heading > span {
	font-size: 1.25em;
	line-height: 0.9;
	font-family: "Roboto", arial, sans-serif;
	margin-top: 0.25em;
	margin-bottom: -0.5em;
	display: inline-block;
}
.modal .heading::before {
	content:'';
	display: inline-block;
	width: 1.325em;
	height: 1em;
	/*background: url(images/favicon_white.svg) center 20% / 100% no-repeat; */
	margin-right: 1em;
}
.modal .title {
	margin: 0 0 0.5em 0;
}
.modal .title .name {
	padding-right: 1em;
}


/** Form Anfrage **/
#anfrage .mcontent {
	padding: 0
}
#anfrage .mailform-wrapper {
	padding: 1em;
	max-height: none;
	font-size: inherit;
	position: relative;
	z-index: 1;
	overflow: hidden
}
#anfrage .mailform-wrapper .form-inner {
	margin: 0.125em 0 0em !important;
}
#anfrage form {
	margin: 0;
	font-size: 1em;
}
#anfrage form > * {
	float: none;
}
#anfrage .cf7mls_bar_style_navigation_horizontal_squaren.cf7mls_bar_style_text_vertical, 
#anfrage .cf7mls_bar_style_navigation_horizontal_round.cf7mls_bar_style_text_vertical {
	margin: 0 0 1.5em !important;
	padding: 1em 0 0.5em;
	width: 100% !important;
	justify-content: center;
}
#anfrage .cf7mls_number_step_wrap .cf7mls_number, #anfrage .cf7mls_number_step_wrap .cf7mls_step_current {
	font-size: 15px;
	color: rgba(var(--black), 0.85);
	text-align: center;
	margin: 0 !important;
	font-family: "Text", sans-serif;
}

#anfrage .cf7mls_bar_style_navigation_horizontal_squaren.cf7mls_bar_style_text_vertical li.active::before {
	background: rgba(32,179,131) !important;
}
#anfrage .cf7mls_bar_style_navigation_horizontal_squaren.cf7mls_bar_style_text_vertical li.current::before {
	background: rgba(var(--darkblue), 0.8) !important;
}
#anfrage .cf7mls_bar_style_navigation_horizontal_squaren.cf7mls_bar_style_text_vertical li::before, 
#anfrage .cf7mls_bar_style_navigation_horizontal_round.cf7mls_bar_style_text_vertical li::before {
	background: rgba(var(--darkblue), 0.15);
}
#anfrage .cf7mls_progress_bar li .cf7_mls_count_step {
	display: block;
	color: rgba(var(--darkblue), 0.75);
	font-size: 15px;
}
#anfrage .cf7mls_progress_bar li.current .cf7_mls_count_step {
	font-weight: bold;
	color: rgba(var(--white), 1);
}
#anfrage .cf7mls_progress_bar li .cf7mls_progress_bar_title {
	font-family: "Text", sans-serif;
}
#anfrage .cf7mls_number_step_wrap {
	margin: 0.5em auto 0 !important;
}
#anfrage .cf7mls_number_step_wrap .cf7mls_progress_percent {
	height: 8px;
	margin: 7px 0 14px !important;;
	background: rgba(var(--softblue),0.5);
	border-radius: 4px;
}

#anfrage .cf7mls_progress_bar {
	position: relative;
	overflow: visible;
}
#anfrage .cf7mls_progress_bar >li {
	max-width: 12em
}
#anfrage .cf7mls_progress_bar::before {
	content:'';
	position: absolute;
	inset: -2em -4em 0;
	background-color: rgba(var(--blue), 0.05)
}
#anfrage .mailform-wrapper form fieldset {
	font-size: 1em;
	color: rgb(var(--black));
	padding: 0em calc(1em + 2vw) 0;
	background: none;
	border: none;
}
#anfrage .small {
	font-size:0.8em
}
#anfrage .mailform-wrapper form label span:first-child {
	display: flex; /*! */
}
#anfrage form label > span:first-child {
	font-family: "Roboto", arial, sans-serif;
	font-size: 0.85em;
	font-weight: 500;
	color: rgba(var(--black));
	padding-bottom: 0.125em;
	display: inline-block;
}
#anfrage .wpcf7-radio, #anfrage .wpcf7-checkbox, #anfrage .wpcf7-acceptance, #anfrage .mc4wp-checkbox  {
	display: flex;
	flex-direction: column;
	gap: 0.75em;
	padding-left: 2.25em;
	line-height: 1.2;
	position: relative;
}
#anfrage .wpcf7-form-control-wrap:has(.wpcf7-radio) {
	display: inline-block;
	margin: 0.5em 0 0;
}
#anfrage form input[type="checkbox"],
#anfrage form input[type="radio"] {
	margin-left: -2.25em;
	margin-right: 0.5em;
	vertical-align: -0.425em;
	width: 1.5em;
	height: 1.5em;
	padding: 0;
	display: inline-block;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: rgba(var(--white), 0.95);
	background-image: none;
	border: 1px solid rgba(var(--darkblue), 0.5);
	border-radius: 3px;
	color: rgb(var(--black));
	font-size:1em;
}

#anfrage form input[type="checkbox"]:checked, 
#anfrage form input[type="radio"]:checked {
	background-color: rgb(171, 223, 67);
	border-color: rgba(var(--darkblue),0.25);
	border-width: 0.25em;
}
#anfrage form input[type="checkbox"] + span.wpcf7-list-item-label,
#anfrage form input[type="radio"] + span.wpcf7-list-item-label,
#anfrage form .mc4wp-checkbox label input + span {
	font-size: 0.9em;
	font-weight: 400;
	padding-left:0;
}
#anfrage form .datenschutz input[type="checkbox"] + span.wpcf7-list-item-label {
	font-size: 0.9em
}
#anfrage input:not([type="submit"],:focus), #anfrage textarea:not(:focus), #anfrage select:not(:focus){
	font-weight: 400;
	background-color: rgba(var(--white), 1);
	border-color: rgba(var(--blue), 0.5);
	border-radius: 0;
}
#anfrage input::placeholder, #anfrage textarea::placeholder {
    color: rgba(var(--black),0.5);
	
}
#anfrage form .button {
	overflow: visible;
}
#anfrage form .submit-button {
	overflow: visible;
	margin:0 !important;
	justify-content: right;
}
#anfrage form .submit-button p {
	overflow: visible;
	display: flex;
	gap:0.5em;
	align-items: center;
	justify-content: right;
}
#anfrage form div.back-button {
	overflow: visible;
	float: left;
	margin-top:0 !important;
	order:-1;
}
#anfrage form input[type="submit"] {
	cursor: pointer;
	box-shadow: 0 0 0.5em rgba(0,0,0,0.2);
	margin: 0;
	padding: 0.75em 3em !important;
	font-size: 1em;
	font-weight: 600 !important;
	border: none;
	border-radius: 3px;
	width: max-content;
}
#anfrage form input[type="submit"]:is(:hover, :focus, :active), 
#anfrage form .cf7mls_btn:is(:hover, :focus, :active) {
	background: rgb(var(--darkblue));
	color: rgb(255,255,255);
	box-shadow: 0 0 0.5em rgb(255,255,255);
	opacity: 0.8;
}
#anfrage .wpcf7-spinner {
	background-color: rgba(var(--blue));
	opacity: 0.5;
	width: 2em;
	height: 2em;
	margin: 0;
	order: -1;
}
#anfrage .wpcf7-spinner::before {
	background-color: rgba(var(--white));
	top: 0.25em;
	left: 0.25em;
	width: 0.5em;
	height: 0.5em;
	transform-origin: 0.5em 0.5em;
}
#anfrage .cf7mls-btns {
	clear: both;
	float:left;
	display: flex;
	width: 100%;
	justify-content: space-between;
	margin: 2em auto 1em !important;
}
#anfrage .cf7mls-btns p {
	display: none;
}
#anfrage .col {
	margin-top: 0 !important;
	padding: 0 0;
	flex-grow: 1;
}
#anfrage .col >:not(.col) {
	width: 100%
}
#anfrage .col:has(.col) {
	display: flex;
	gap: 1em
}
#anfrage .kontaktdaten .col {
	padding: 0.125em 0;
}
#anfrage .col h3 {
	font-size: 1.75em;
	color: rgba(var(--darkblue));
	margin-bottom: 0.25em;
}
#anfrage .question {
	font-size: 1.25em;
	color: rgba(var(--darkblue))
}
#anfrage .form-footer {
	margin-top: 1em !important;
	margin-bottom: 0.75em;
	padding-top: 0.5em;
	width: 100%;
	display: flex;
	justify-content: space-between;
	border-top: solid 1px rgb(var(--blue),0.5);
}
#anfrage .form-footer .wpcf7-acceptance .wpcf7-list-item-label,
#anfrage form .mc4wp-checkbox label input + span {
	font-size: 0.8em !important;
}
#anfrage .form-footer a {
	text-decoration: underline;
}
#anfrage .form-footer > .col.span1-1:has(.submit-button)  {
	align-self: flex-end;
	flex-shrink: 2;
}
#anfrage form h3 {
	font-size: 1.25em;
	margin: 1em 0 0 !important;
}
#anfrage form h3 + p {
	display:block;
	margin-top: 0 !important
}
#anfrage textarea {
	height: 6em;
	min-height: 2em;
	min-width: 100%;
}
#anfrage p:has([id*="wrapper"]),
#anfrage p:empty {
	display: none;
}
#anfrage .form-head {
	margin: -1.25em -1em 0.5em !important;
	padding: 1em;
	background: rgba(var(--beige), 1);
	text-align: center;
	font-size: 0.9em;
	line-height: 1.2;
}
#anfrage .form-head p + p {
	margin-top:0.5em !important;
}
#anfrage .mailform-wrapper .codedropz-upload-wrapper {
	background: rgba(255,255,255,0.9999);
	padding: 1em 0 0;
}
#anfrage .mailform-wrapper .codedropz-upload-handler {
	border: 2px dashed rgba(var(--blue));
	background: rgba(var(--lightblue), 0.1);
	color: rgb(60,60,60);
	margin: -1em 0 0.5em;
	border-radius:0.25em;
}
#anfrage .mailform-wrapper .codedropz-upload-container {
	padding: 2.5em 0.5em;
	font-size: 0.8em;
}
#anfrage .mailform-wrapper .codedropz-upload-inner {
	max-width: 15em;
	margin: 0 auto;
	line-height: 1.5;
}
#anfrage .mailform-wrapper .codedropz-upload-inner h3,
#anfrage .mailform-wrapper .codedropz-upload-inner h3 + span{
	display:none;
}
#anfrage .mailform-wrapper .codedropz-upload-inner .codedropz-btn-wrap {
	font-size: 1em;
	white-space: normal;
}
#anfrage .mailform-wrapper .codedropz-upload-handler .dnd-upload-counter {
	font-size: 0.9em;
}
#anfrage .mailform-wrapper .codedropz-dragover {
	border-color: currentColor;
	background-color: rgba(255,255,0,0.5) !important;
}
#anfrage .mailform-wrapper .dnd-upload-status .name {
	font-size: 0.8em
}
#anfrage .mailform-wrapper .dnd-upload-status .name em {
	font-weight: 500;
}
#anfrage .mailform-wrapper .dnd-upload-status:last-child {
	padding-bottom: 1em;
}
@media(max-width: 1299px){
	#anfrage form input {
		font-size: 17px
	}
}
@media(max-width: 767px){
	#anfrage .form-inner {
		font-size: 16px
	}
	#anfrage form input, #anfrage form select, #anfrage form textarea {
		font-size: 16px
	}
	#anfrage form .kontaktdaten input:not([type="checkbox"],[type="radio"]),
	#anfrage form .kontaktdaten textarea {
		font-size: 18px
	}
	#anfrage .span1-3 {
		width: 33.333% !important;
	}
	#anfrage .span2-3 {
		width: 66.666% !important;
	}
	#anfrage .question {
		font-size: 1.125em;
	}
	#anfrage form label > span:first-child {
		font-size: 1em;
	}
	#anfrage .form-footer,
	#anfrage .cf7mls-btns.cf7mls-btns-last-step {
		flex-direction: column;
		flex-wrap: wrap;
		gap: 1em;
		justify-content: left;
	}
	#anfrage #form_2 .form-footer {
		margin-top: 1.5em !important;
	}
	#anfrage .form-footer .back-button,
	#anfrage .cf7mls-btns.cf7mls-btns-last-step .cf7mls_back {
		order: 3;
	}
	#anfrage form input[type="submit"] {
		padding-left: calc(1em + 5vw) !important;
		padding-right: calc(1em + 5vw) !important;
	}
	#anfrage .wpcf7-spinner {
		order: -1;
	}
}
@media(max-width: 619px){
	#anfrage .mailform-wrapper {
		padding: 1em 0.75em 1em !important;
	}
}
@media(max-width: 600px){
	#anfrage .col {
		padding: 0;
		width: 100% !important;
	}
	#anfrage #form_2 .col {
		padding: 0.5em 0;
	}
	#anfrage .col:has(.col){
		gap: 0.125em;
		flex-direction: column;
		flex-wrap: wrap;
	}
	#anfrage .wpcf7-form-control-wrap:has(.wpcf7-radio) {
		display: inline-block;
		margin: 0.5em 0;
	}
	#anfrage .cf7mls-btns {
		margin-top: 1.5em !important;
	}
	#anfrage form .kontaktdaten textarea {
		height: 2.5em;
	}
}

#anfrage .wpcf7-not-valid-tip {
	font-size: 0.75em;
	font-weight: 500;
	margin-bottom: -1em;
	position: absolute;
	width: max-content;
	right: 0;
	top:50%;
	transform: translateY(-50%);
	background-color: rgb(187, 51, 42, 1);
	color: rgb(var(--white));
	padding: 0 0.5em;
}
#anfrage input:is(:focus) + .wpcf7-not-valid-tip {
	display: none;
}
#anfrage .wpcf7-radio + .wpcf7-not-valid-tip {
	left: 0;
	right: auto;
	top:0;
	transform: translateY(-120%);
}
#anfrage input:has(+.wpcf7-not-valid-tip):not(:focus) {
	border-color: rgb(187, 51, 42, 1);
	/*! box-shadow: 0 0 0 0.125em rgb(187, 51, 42, 0.75); */
}
#anfrage .wpcf7-form-control-wrap:has(input[type="checkbox"]) {
	position: relative;
	display: inline-block;
	width: 100%;
}
#anfrage .wpcf7-checkbox + .wpcf7-not-valid-tip {
	position: absolute;
	display: inline;
	padding: inherit;
	white-space: nowrap;
	left: 0;
	top: 0;
	text-indent: -100em;
	border: solid 0.25em rgb(187, 51, 42, 1);
	background: transparent;
	width: 2.75em;
	z-index: 0;
	height: 2.75em;
	transform: translate(-0.325em, -0.325em);
	opacity: 0.75;
	border-radius: 0.5em;
	z-index:-1;
	margin: 0;
}
#anfrage div.wpcf7-response-output {
	position: fixed;
	top: 50%;
	left: 50%;
	padding: 1em 1em;
	font-size: 1em;
	background: rgb(255,255,255);
	color: rgb(0,0,0);
	margin: 0;
	box-shadow: 0 0 0.25em rgba(var(--darkblue), 0.75), 0 0 0 5em rgba(var(--white), 0.5);
	border-width: 0em;
	border-radius: 0.5em;
	transform: translate(-50%, -50%);
	text-align: center;
	z-index: 1000;
	animation: "response-output";
	animation-duration: 1s;
	animation-name: show-response-output;
	animation-delay: 3s;
	animation-fill-mode: forwards;
	width: 90%;
	max-width: 45rem;
	z-index: 1000 !important;	
}
@keyframes show-response-output {
	0%{
		opacity:1;
		/*transform: translateX(0%);*/
		transform: translate(-50%,-50%) scale(1);
	}
	99%{
		opacity:0;
	}
	100%{
		opacity:0;
		/*transform: translateX(150%);*/
		transform: translate(-50%,-50%) scale(0);
	}
}
#anfrage .wpcf7 form.invalid .wpcf7-response-output, 
#anfrage .wpcf7 form.unaccepted .wpcf7-response-output, 
#anfrage .wpcf7 form[novalidate="novalidate"] .wpcf7-response-output{
	border-color: transparent;
	background-color: rgb(187, 51, 42, 1);
	color: rgb(var(--white))
}
#anfrage .wpcf7-icon-wraning,
#anfrage .wpcf7-not-valid-tip + .wpcf7-not-valid-tip {
	display: none !important;
}

#anfrage .cf7mls-btns .cf7mls_next.action-button, #anfrage .cf7mls-btns .cf7mls_back.action-button {
	margin: 0 !important;
	font-weight: 500 !important;
	min-width:0;
	width: max-content;
}
#anfrage .cf7mls_next.action-button {
	background-color: rgb(var(--darkblue), 1)
}
#anfrage .cf7mls-btns .cf7mls_next.action-button {
	margin-left: auto !important;
}
#anfrage .cf7mls_back.action-button,
#anfrage .back-button button {
	background-color: rgb(var(--grey), 0.75);
	color: rgb(var(--black));
	border-radius: 3px;
}
#anfrage .back-button button:is(:hover) {
	opacity: 0.8;
}
#anfrage .cf7mls_next.action-button img {
	width: 1em;
	position: absolute;
	margin-left: 5px;
	right: 1em;
	vertical-align: middle;
}

#anfrage .success-wrapper {
	position: absolute;
	top:0;
	width:100%;
	opacity:0;
	transform-origin: center center;
	transform: scale(0);
}
#anfrage .success-wrapper.sent {
	position: relative;
	top:0;
	width:100%;
	opacity:1;
	transform: scale(1);
	transition: all 300ms ease-in 0ms;
	padding: calc(1em + 1vw);
}

#anfrage .success-wrapper .info {
	background-color: rgba(var(--beige), 1);
	padding: 2em 1em;
	margin: 1em -1em -1em;
}
#anfrage .success-wrapper h2 {
	margin-bottom: 0.5em !important;
	text-transform: uppercase;
	margin-left:-.5em;
	color: rgb(20, 175, 110);
}
#anfrage.success-wrapper h2::before {
	margin-right:0.75em;
}
#anfrage .success-wrapper .message {
	color: rgb(var(--black));
	font-size: 1.1em;
	font-weight: 500;
}
#anfrage .success-wrapper h3 {
	margin-bottom: -0.5em !important;
}
#anfrage .success-wrapper .info a {
	text-decoration: underline;
}