/* Allgemain */
h1, h2, h3, h4, h5, h6 {
	letter-spacing: -0.05em;
	font-weight: 500;
	color: #3d4459;
	line-height: 1.2;
	margin-bottom: 0.5em;
}
h1 { color: #3d4459; font-size: 2.8em; }
h2 { color: #4632da; font-size: 2.6em; }
h3 { color: #4632da; font-size: 2.4em; }
h4 { font-size: 2.6em; }
@media only screen and (max-width: 1024px) {
	h1 { font-size: 2.6em; }
	h2, h4 { font-size: 2.4em; }
	h3 { font-size: 2.2em; }
}
@media only screen and (max-width: 550px) {
	h1 { font-size: 2.2em; }
	h2, h4 { font-size: 2em; }
	h3 { font-size: 1.8em; }
}
@media only screen and (max-width: 3200px) {
	h1 { font-size: 1.8em; }
	h2, h4 { font-size: 1.6em; }
	h3 { font-size: 1.4em; }
}
.header .container {
	max-width: 1800px;
}
.header .container:last-child .twelve.columns {
	margin-bottom: 0;
}
.header .logo,
.header .logomobil {
	max-height: 70px;
}
.header .head-phone {
	margin: 0 0 0 auto;
}
.header .head-phone span {
	font-size: 1.2em;
	font-weight: 700;
	color: #5aa7c3;
}
.header .head-phone i.fa-solid {
	color: #5aa7c3;
	font-size: 1.5em;
}
@media only screen and (max-width: 1024px) {
	/* keine mobile Navigation */
	.header { padding-top: 0px; }
	/* bug style.css */
	#logolinks .twelve.columns {
		width: 100% !important;
	}
}
@media only screen and (max-width: 550px) {
	.header {
		display: none;
	}
	.header .head-phone span {
		display: none;
	}
}
#navigation > div > ul > li > a {
  font-size: 1;
	text-transform:uppercase;
}
.intro {
	margin-top: 0 !important;
}
/* mit mutistep form */
.home .intro .container {
	max-width: 1600px;
}
.intro {
	background-size: contain;
	background-position: right top;
	background-color: #2b4bb7;
}
.home .intro .bgintro-left {
	margin-top: 80px;
	margin-bottom: 80px !important;
}


@media only screen and (max-width: 2000px) {
	.intro .bgintro-left {
		margin-top: 60px !important;
		margin-bottom: 40px !important;
	}
}
@media only screen and (min-width: 1601px) and (max-width: 2000px) {
	.intro { 
		background-position: 100% top;
		background-size: contain;
	}
}
@media only screen and (max-width: 1600px) {
	.intro {
		background-size: cover;
  		background-position: 30% top;
	}
}
@media only screen and (max-width: 550px) {
	.intro { 
  		background-position: 40% top;
	}
	.intro::before {
  		background-color: #2b4bb7;
        background: linear-gradient(90deg, rgb(43,75,183, 0.9) 86%, rgb(43,75,183, 0.6) 100%) !important;
	}
}
@keyframes headSlide {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-100%); /* Ändern Sie dies je nach gewünschter Bewegungsrichtung und Entfernung */ }
}
.intro .header-slidebox {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	overflow: hidden;
	background: rgba(90, 167, 195, 0.7);
}
.intro .header-slideimage {
  width: 14985px; /* Breite des Bildes anpassen */
  height: 45px; /* Höhe des Bildes anpassen */
  background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/Alle-Logos-45px-lang.png') center center / cover no-repeat; /* Hintergrundbild und Anpassung anpassen */
  animation: headSlide 180s linear infinite; /* Animation anpassen (Dauer, Timing-Funktion, Unendlichkeit) */
  margin: 5px 0;
}
.intro .wpcf7 {
  padding: 2em 0;
  border-radius: 2em;
  background: rgb(21,40,134);
  background: linear-gradient(90deg, rgba(21,40,134,1) 0%, rgba(21,40,134,0.55) 100%);
  text-align: center;
  width: 100%;
  max-width: 600px;
}
.intro .formstart {
	padding: 1em;
	margin-bottom: 0.5em;
	color: #ffffff;
}
.intro .formstart h1{
	margin-bottom: 0.5em;
	font-weight: 400;
	letter-spacing: 0;
}
.intro .formstart p {
	font-weight: 600;
	font-size: 0.9em;
	color: #ccc;
}
/* Regler */
.intro .wpcf7 .formprogress {
	position: relative;
	display: block;
	margin: 1em 0 2em 0;
	padding: 0;
	height: 6px;
	width: 100%;
	background: linear-gradient(to right, #4887b3 15%, #efefef 15%, #efefef 100%); /* Farbverlauf anpassen */
}
.intro .wpcf7 img {
	margin: 1em auto 2em;
	max-width: 90%;
}
.intro .wpcf7 span, .intro .wpcf7 a {
    font-size: 1.1em;
}
.intro .wpcf7 span.frage {
	display: inline-block;
	max-width: 90%;
	margin: 0 auto 1em;
	font-size: 1.3em;
	font-weight: 500;
}
.intro .wpcf7 .CF7_forminfos {
	display: inline-block;
	color: #ffffff;
	margin-bottom: 1em;
}
/* ZUrueck-Butttom */
.intro .wpcf7 button[type="button"] {
  padding: 1em 2em;
  color: #ffffff;
  background-color: #4887b3;
  border: 1px solid #17498a;
  border-radius: 12px;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 600;
  margin: 1em auto 2em;
}
.intro .wpcf7 input[type="submit"] {
	background-color: #1a759b;
	border-color: #1a759b;
}
.intro .wpcf7 input[type="submit"]:hover {
	background-color: #444444;
	border-color: #444444;
}
@media only screen and (max-width: 1024px) {
	.intro .wpcf7 button[type="button"] {
		margin: 0em auto 1.5em;
	}
}
.intro .wpcf7 span.wpcf7-not-valid-tip {
	color: #cd2653;
	font-size: 0.95em;
}
.intro .wpcf7 form.sent .wpcf7-response-output {
	display: none !important;
}
.wpcf7 form.invalid .wpcf7-response-output, 
.wpcf7 form.unaccepted .wpcf7-response-output, 
.wpcf7 form.payment-required .wpcf7-response-output {
	display: none !important;
}
.button, input[type="submit"] {
	border-radius: 10px;
}
.intro .wpcf7-radio label input + span, 
.intro .wpcf7-checkbox label input + span {
   height: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: center;
   padding: 1em 0 0.8em 5em;
   max-width: 220px;
   font-size: 1em;
   text-align: left;
}
div.svgpanel {
	overflow: hidden;
	position: absolute;
	z-index: 10;
	fill: #fff;
	left: 0;
	width: 100%;
	line-height: 0;
	direction: ltr;
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	margin-top: -120px;
}
div.svgpanel svg {
	position: relative;
	display: block;
	left: 50%;
	max-width: 100%;
	hyphens: manual;
	width: calc(100% + 1.3px);
	height: 120px;
	transform: translateX(-50%) rotateY(180deg);
}
@media only screen and (max-width: 1024px) {
	div.svgpanel { margin-top: -40px; }
	div.svgpanel svg {
		height: 40px;
	}
	.intro .wpcf7 img {
		margin: 0em auto 1em;
		max-width: 90%;
	}
}
/* initially hide all groups (even before JS is loaded), so the page will never render them while loading */
[data-class="wpcf7cf_group"], .wpcf7cf_remove, .wpcf7cf_add { display:none; }
.wpcf7cf_repeater_sub { margin-bottom: 20px; }
.wpcf7cf_repeater_controls, .wpcf7cf_step_controls {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 20px;
}
.wpcf7cf_multistep .wpcf7cf_step {
    /* display:none; */
    width: 100%;
}
.wpcf7cf_multistep .wpcf7cf_step .step-title {
    display: none;
}
.wpcf7cf_multistep .wpcf7cf_steps-dots {
    display: flex;
    width: 100%;
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.wpcf7cf_multistep .wpcf7cf_steps-dots .dot .step-index {
    display: inline-block;
    border-radius: 50%;
    background: #dfdfdf;
    color: #000000;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
}
.wpcf7cf_multistep .wpcf7cf_steps-dots .dot {
    border-bottom: 5px solid #dfdfdf;
    text-align: center;
    flex: 1;
    padding: 15px;
    min-width: 120px;
}
.wpcf7cf_multistep .wpcf7cf_steps-dots .dot.completed {
    border-bottom: 5px solid #333;
}
.wpcf7cf_multistep .wpcf7cf_steps-dots .dot.active {
    border-bottom: 5px solid #333;
    font-weight: bold;
}
.wpcf7cf_multistep .wpcf7cf_steps-dots .dot.completed .step-index {
    background-color: #333;
    color: #ffffff;
}
.wpcf7cf_multistep .wpcf7cf_steps-dots .dot.active .step-index {
    background-color: #333;
    color: #ffffff;
}
.wpcf7cf_step_controls .disabled {
    pointer-events: none;
    cursor: default;
    opacity: .5;
}   
/* Start custom CSS for shortcode, class: .elementor-element-6b48feb5 *//* ajax loader*/
.ajax-loader {
    display: none !important;
}
.wpcf7-radio input[type="radio"], .wpcf7-checkbox input[type="checkbox"] {
  opacity: 0;
  position: fixed;
  width: 0;
}
#step1 span.wpcf7-list-item,
#step2 span.wpcf7-list-item,
#step3 span.wpcf7-list-item,
#step4 span.wpcf7-list-item,
#step5 span.wpcf7-list-item,
#step6 span.wpcf7-list-item {
    display: inline-block;
	width: 250px;
	margin: 0 0 0 4%;
}
#step1 span.wpcf7-list-item:nth-child(odd),
#step2 span.wpcf7-list-item:nth-child(odd),
#step3 span.wpcf7-list-item:nth-child(odd),
#step4 span.wpcf7-list-item:nth-child(odd),
#step5 span.wpcf7-list-item:nth-child(odd),
#step6 span.wpcf7-list-item:nth-child(odd) {
	margin: 0;
}
.wpcf7-radio label, .wpcf7-checkbox label {
    max-width:400px;
    width:250px;
    height: 100px;
    background-size: 130px;
    background-position: left center;
    background-repeat: no-repeat;
    background-color: #4887b3;
    border: 1px solid  #17498a;
    border-radius: 30px;
    margin: auto;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    box-shadow: 0px 0px 30px 0px rgb(23 106 138 / 70%);
	float:left;
}
.intro #step1 .wpcf7-list-item:nth-child(1) label {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/man.png');
}
.intro #step1 .wpcf7-list-item:nth-child(2) label{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/gay.png');
}
.intro #step1 .wpcf7-list-item:nth-child(3) label{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/father-and-son.png');
}
.intro #step1 .wpcf7-list-item:nth-child(4) label{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/family.png');
	background-position: 5% center;
}

.intro #step5 .wpcf7-list-item:nth-child(1) label{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/money.png');
	background-size: auto 90%;
	background-position: 5% center;
}
.intro #step5 .wpcf7-list-item:nth-child(2) label{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/spar.png');
	background-position: 5% center;
}
.intro #step5 .wpcf7-list-item:nth-child(3) label{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/wallet.png');
	background-position: 5% center;
}
.intro #step2 .wpcf7-list-item:nth-child(1) label,
.intro #step3 .wpcf7-list-item:nth-child(1) label,
.intro #step4 .wpcf7-list-item:nth-child(1) label,
.intro #step6 .wpcf7-list-item:nth-child(1) label{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/yes.png');
}
.intro #step2 .wpcf7-list-item:nth-child(2) label,
.intro #step3 .wpcf7-list-item:nth-child(2) label,
.intro #step4 .wpcf7-list-item:nth-child(2) label,
.intro #step6 .wpcf7-list-item:nth-child(2) label{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/no.png');
}
#step8 .wpcf7-list-item:nth-child(1){
	width:100%;
	font-size: 0.9em;
	margin-left: 0;
}
.wpcf7-radio label span, .wpcf7-checkbox label span {
	text-align:center;
	font-size: 17px;
	font-weight: 600;
	padding: 10px 20px;
	display: block;
	color: #17498a;
}
.intro .wpcf7-radio input:checked + span, 
.intro .wpcf7-checkbox input:checked + span{
    background-color:#17498a;
     background-size: 150px;
     background-position: left center;
    background-repeat: no-repeat;
    border: 2px solid #4887b3;
    border-radius: 27px;
    color:#F7F7F7;
    height:100%;
	width: 100%;
}
.intro #step1 .wpcf7-checkbox .wpcf7-list-item:nth-child(1) input:checked + span {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/man.png');
}
.intro #step1 .wpcf7-checkbox .wpcf7-list-item:nth-child(2) input:checked + span{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/gay.png');
}
.intro #step1 .wpcf7-checkbox .wpcf7-list-item:nth-child(3) input:checked + span{
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/father-and-son.png');
}
.intro #step1 .wpcf7-checkbox .wpcf7-list-item:nth-child(4) input:checked + span {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/family.png');
	background-position: 5% center;
}
.intro #step5 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/money.png');
	background-position: 5% center;
}
.intro #step5 .wpcf7-radio .wpcf7-list-item:nth-child(2)  input:checked + span {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/spar.png');
	background-position: 5% center;
}
.intro #step5 .wpcf7-radio .wpcf7-list-item:nth-child(3)  input:checked + span {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/wallet.png');
	background-position: 5% center;
}
.intro #step2 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span, 
.intro #step3 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span, 
.intro #step4 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span, 
.intro #step6 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/yes.png');;
}
.intro #step2 .wpcf7-radio .wpcf7-list-item:nth-child(2) input:checked + span, 
.intro #step3 .wpcf7-radio .wpcf7-list-item:nth-child(2) input:checked + span, 
.intro #step4 .wpcf7-radio .wpcf7-list-item:nth-child(2) input:checked + span, 
.intro #step6 .wpcf7-radio .wpcf7-list-item:nth-child(2) input:checked + span {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/no.png');
}
.intro .wpcf7-radio label:hover, 
.intro .wpcf7-checkbox label:hover{
  border: 1px solid #17498a;
}
.intro .wpcf7cf_steps-dots .step-index, 
.intro .wpcf7cf_steps-dots .step-title {
    display: none !important;
}
.intro .wpcf7cf_multistep .wpcf7cf_steps-dots .dot {
    min-width: 10px !important;
    padding: 0px !important;
}
.intro .wpcf7cf_step_controls {
    margin-top: -3em !important;
	clear: both;
}
@media only screen and (min-width: 1025px) {
	.intro .wpcf7 .wpcf7-list-item label,
	.intro .wpcf7-checkbox .wpcf7-list-item input:checked + span,
	.intro .wpcf7-radio .wpcf7-list-item input:checked + span {
		background-size: auto 90% !important;
	}
}
@media only screen and (min-width: 1025px) and (max-width: 1920px) {
	.intro .formstart { 
		margin-bottom: 0;
	}
	.intro .wpcf7 {
		padding: 1em 0;
		max-width: 520px;
		font-size: 0.9em;
	}
	.intro .caption h1 {
		font-size: 2.2em;
		margin: 0 auto 0.5em;
		max-width: 400px;
	}
	.intro .caption h1 strong {
		font-weight: 700;	
	}
	.intro .wpcf7 .formprogress {
		margin: 0.4em 0 1.2em;
	}
	.intro .wpcf7 span.frage { 
		margin-bottom: 0.5em;
	}
	.intro #step1 span.wpcf7-list-item, 
	.intro #step2 span.wpcf7-list-item, 
	.intro #step3 span.wpcf7-list-item, 
	.intro #step4 span.wpcf7-list-item, 
	.intro  #step5 span.wpcf7-list-item, 
	.intro #step6 span.wpcf7-list-item {
		width: 220px;
	}
	.intro .wpcf7-radio label, 
	.intro .wpcf7-checkbox label {
		width: 220px;
    	height: 80px;
	}
	.intro .wpcf7 .wpcf7-list-item label,
	.intro .wpcf7-checkbox .wpcf7-list-item input:checked + span,
	.intro .wpcf7-radio .wpcf7-list-item input:checked + span {
		background-size: auto 80% !important;
	}
	.intro .wpcf7-radio label input + span, 
	.intro .wpcf7-checkbox label input + span {
		padding: 0.4em 0 0.2em 4.8em;
		font-size: 0.95em;
		max-width: 190px;
	}
}
@media only screen and (max-width: 1024px) {
	.intro .container.flex, 
	.caption-wrap .caption {
    	display: flex;
    	flex-wrap: wrap;
    	align-items:flex-start;
	}
	.intro .wpcf7 { 
		max-width: 420px; 
		padding: 0.5em 0;
		margin-bottom: 1em;
	}
	.intro .header-slideimage {
  		width: 9999px;
    	height: 30px;
	}
	/* weisse icons */
	.intro .wpcf7 .wpcf7-list-item label {
  		background-size: auto 80%;
	}
	.intro #step1 .wpcf7-list-item:nth-child(4) label {
		background-size: auto 75%;
	}
	.intro .wpcf7-radio label input + span, 
	.intro .wpcf7-checkbox label input + span {
		padding: 1em 0 0.8em 3.8em;
	}
	.intro #step1 span.wpcf7-list-item,
	.intro #step2 span.wpcf7-list-item,
	.intro #step3 span.wpcf7-list-item,
	.intro #step4 span.wpcf7-list-item,
	.intro #step5 span.wpcf7-list-item,
	.intro #step6 span.wpcf7-list-item {
		width: 44%;
		height: 80px;
		margin-bottom: 0.5em !important;
	}
	.intro .wpcf7-radio label, 
	.intro .wpcf7-checkbox label {
		border-radius: 10px;
		width: 100%;
    	height: 100%;
	}
	.intro .wpcf7-radio input:checked + span, 
	.intro .wpcf7-checkbox input:checked + span {
		border-radius: 10px;
		border: 2px solid #4887b3;
		/* weisse icons */
		background-size: auto 80%;
	}
	.intro #step1 .wpcf7-checkbox .wpcf7-list-item:nth-child(4) input:checked + span {
		background-size: auto 75%;
	}
	.intro #step5 .wpcf7-list-item:nth-child(1) label,
	.intro #step5 .wpcf7-list-item:nth-child(2) label,
	.intro #step5 .wpcf7-radio input:checked + span {
		/* weisse icons */
		background-size: auto 75%;
	}
}
@media only screen and (max-width: 550px) {
	/* weisse icons */
	.intro .wpcf7 .wpcf7-list-item label {	
  		background-size: auto 70%;
	}
	#step1 .wpcf7-list-item:nth-child(4) label {
		background-size: auto 65%;
	}
	.intro .wpcf7-radio label input + span, 
	.intro .wpcf7-checkbox label input + span {
		font-size: 0.9em;
	}
	.intro .wpcf7-radio label input + span, 
	.intro .wpcf7-checkbox label input + span {
		padding: 1em 0 0.8em 3.6em;
	}
	.intro #step1 span.wpcf7-list-item,
	.intro #step2 span.wpcf7-list-item,
	.intro #step3 span.wpcf7-list-item,
	.intro #step4 span.wpcf7-list-item,
	.intro #step5 span.wpcf7-list-item,
	.intro #step6 span.wpcf7-list-item {
		width: 44%;
		height: 70px;
		margin-bottom: 0.5em !important;
	}
	.intro .wpcf7-radio input:checked + span, 
	.intro .wpcf7-checkbox input:checked + span {
		border: 2px solid #4887b3;
		/* weisse icons */
		background-size: auto 70%;
	}
	.intro #step1 .wpcf7-checkbox .wpcf7-list-item:nth-child(4) input:checked + span {
		background-size: auto 65%;
	}
	.intro #step2 .wpcf7-list-item:nth-child(1) label,
	.intro #step3 .wpcf7-list-item:nth-child(1) label,
	.intro #step4 .wpcf7-list-item:nth-child(1) label,
	.intro #step6 .wpcf7-list-item:nth-child(1) label, 
	.intro #step2 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span, 
	.intro #step3 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span, 
	.intro #step4 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span, 
	.intro #step6 .wpcf7-radio .wpcf7-list-item:nth-child(1)  input:checked + span  {
		background-position: 15% center; /* YES-Hacken */
	}
	.intro #step2 .wpcf7-list-item:nth-child(2) label,
	.intro #step3 .wpcf7-list-item:nth-child(2) label,
	.intro #step4 .wpcf7-list-item:nth-child(2) label,
	.intro #step6 .wpcf7-list-item:nth-child(2) label,
	.intro #step2 .wpcf7-radio .wpcf7-list-item:nth-child(2) input:checked + span, 
	.intro #step3 .wpcf7-radio .wpcf7-list-item:nth-child(2) input:checked + span, 
	.intro #step4 .wpcf7-radio .wpcf7-list-item:nth-child(2) input:checked + span, 
	.intro #step6 .wpcf7-radio .wpcf7-list-item:nth-child(2) input:checked + span {
		background-position: 15% center; /* NO-Hacken */
	}
	.intro #step2 .wpcf7-radio label input + span,
	.intro #step3 .wpcf7-radio label input + span,
	.intro #step4 .wpcf7-radio label input + span,
	.intro #step6 .wpcf7-radio label input + span {
		padding: 1em 0 0.8em 4em;
	}
	.intro #step5 .wpcf7-list-item:nth-child(1) label,
	.intro #step5 .wpcf7-list-item:nth-child(2) label,
	.intro #step5 .wpcf7-radio input:checked + span {
		/* weisse icons */
		background-size: auto 60%;
	}
}
@media only screen and (max-width: 400px) {
	.intro .wpcf7-radio label input + span, 
	.intro .wpcf7-checkbox label input + span {
		padding: 1em 0 0.8em 3em;
	}
}
@media only screen and (max-width: 320px) {
	/* weisse icons */
	.intro .wpcf7 .wpcf7-list-item label {	
  		background-size: auto 60%;
	}
	.intro #step1 .wpcf7-list-item:nth-child(4) label {
		background-size: auto 55%;
	}
	.intro .wpcf7-radio label input + span, 
	.intro .wpcf7-checkbox label input + span {
		font-size: 0.8em;
	}
	.intro .wpcf7-radio label input + span, 
	.intro .wpcf7-checkbox label input + span {
		padding: 1em 0 0.8em 3.1em;
	}
	.intro .wpcf7-radio input:checked + span, 
	.intro .wpcf7-checkbox input:checked + span {
		border: 2px solid #4887b3;
		/* weisse icons */
		background-size: auto 60%;
	}
	.intro #step1 .wpcf7-checkbox .wpcf7-list-item:nth-child(4) input:checked + span {
		background-size: auto 55%;
	}
}
div[data-current_step="2"] .wpcf7cf_next-container,
div[data-current_step="3"] .wpcf7cf_next-container,
div[data-current_step="4"] .wpcf7cf_next-container,
div[data-current_step="5"] .wpcf7cf_next-container,
div[data-current_step="6"] .wpcf7cf_next-container {
	display: none;
}
div[data-current_step="1"] .wpcf7cf_step_controls { /* display: none; */ }
div[data-current_step="7"] .wpcf7cf_step_controls { display: none; }
div[data-current_step="8"] .wpcf7cf_prev-container, 
div[data-current_step="11"] .wpcf7cf_next-container .wpcf7-submit { display: none; }
div[data-current_step="8"].wpcf7cf_next-container { display: block !important; }
.wpcf7cf_prev-container, .wpcf7cf_next-container, .wpcf7cf_next-container_own{
    background-color: #fff;
    font-family: sans-serif, Arial;
    border: 1px solid #fff;
    border-radius: 30px;
    margin: auto;
    margin-top: 0em;
    width: fit-content;
}
.wpcf7cf_prev, .wpcf7cf_next, .wpcf7cf_next_own{
    /*width: 100%;*/
    background-color:#3498db;
    border-radius: 30px;
}
.wpcf7-submit{
    background-color:#3498db !important;
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 30px !important;
}
.wpcf7cf_next_own, .wpcf7cf_next-container_own{
    display: block;
}
/* Suchen - Simulation */
/*
img.loading-spinner {
	width: 50vw;
	max-width: 160px;
} */
.intro .wpcf7 .spiners {
	position: relative;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.intro .wpcf7 .spinner {
  width: 120px;
  height: 120px;
  border: 8px solid #4887b3;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-radius: 50%;
  animation: spin 2s linear infinite;
  margin: 1em auto 1em;
}
@keyframes spin2 {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(-360deg); }
}
.intro .wpcf7 .spinner2 {
  width: 80px;
  height: 80px;
  border: 8px solid #4887b3;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-radius: 50%;
  animation: spin2 2s linear infinite;
  position: absolute;
  top: 20px;
  left: 50%;
  margin-left: -40px;
}
@keyframes moveLeft {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-100%); /* Ändern Sie dies je nach gewünschter Bewegungsrichtung und Entfernung */ }
}
.intro .wpcf7 .slide-box {
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
}
.intro .wpcf7 .slide-image {
  width: 4000px; /* Breite des Bildes anpassen */
  height: 85px; /* Höhe des Bildes anpassen */
  background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/anbieter1.png') center center / cover no-repeat; /* Hintergrundbild und Anpassung anpassen */
  animation: moveLeft 40s linear infinite; /* Animation anpassen (Dauer, Timing-Funktion, Unendlichkeit) */
  margin-bottom: 2em;
}
/* Letzte schritt im Multistep-Form */
.intro .wpcf7 .abschluss { /* p, strong */
  display: inline-block;
  color: #ffffff;
  margin-bottom: 2em;
  font-weight: 500;	
  max-width: 80%;
}
.intro .wpcf7 strong.abschluss {
	margin-top: 1em;
}
.intro .wpcf7 input[type="text"], 
.intro .wpcf7 input[type="password"], 
.intro .wpcf7 input[type="email"], 
.intro .wpcf7 input[type="url"], 
.intro .wpcf7 input[type="date"],
.intro .wpcf7 input[type="tel"],
.intro .wpcf7 input[type="number"], textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #fff;
    border-radius: 0;
    border-style: solid;
    border-width: 0.1rem;
    box-shadow: none;
    display: block;
    font-size: 1.6rem;
    letter-spacing: -0.015em;
    margin: 0;
    max-width: 100%;
    padding: 1.5rem 1.8rem;
    width: 100%;
}
@media only screen and (max-width: 1024px) {
	.intro .wpcf7 input[type="text"], 
	.intro .wpcf7 input[type="password"], 
	.intro .wpcf7 input[type="email"], 
	.intro .wpcf7 input[type="url"], 
	.intro .wpcf7 input[type="date"],
	.intro .wpcf7 input[type="tel"],
	.intro .wpcf7 input[type="number"], textarea {
		 padding: 0.3rem 0.8rem;
	}
	.intro .wpcf7 .abschluss,
	.intro .wpcf7 strong.abschluss {
		margin-bottom: 1em;
	}
}
.intro .wpcf7 #step8 input{
	width: 90%;
    max-width: 400px;
    margin: auto;
    border-radius: 20px !important;
}
.intro .wpcf7 #step8 input[type="submit"] {
	padding: 1em 2em;
	color: #ffffff;
	background-color: #4887b3 !important;
	border: 1px solid #17498a;
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 600;
	margin: 0em auto 2em;
	width: auto;
}
.intro .wpcf7-acceptance label {
	text-align: center;
	font-size: 0.8em;
    max-width: 80%;
}
.intro .wpcf7 #step8 input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    top: 2px;
    display: inline-block;
    margin: 0;
    width: 1.5rem;
    min-width: 1.5rem;
    height: 1.5rem;
    background: #fff;
    border-radius: 0;
    border-style: solid;
    border-width: 0.1rem;
    border-color: #dcd7ca;
    box-shadow: none;
    cursor: pointer;
}
.intro .wpcf7 #step8 input[type="checkbox"]:checked::before {
    content: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%23000000%27%2F%3E%3C%2Fsvg%3E);
    position: absolute;
    display: inline-block;
    margin-left: -0.7rem;
	margin-top: -0.5rem;
    height: 1.75rem;
    width: 1.75rem;
}
/**************************************************/
/***** Erter Block Einleitung + Kundenstimmen *****/
/**************************************************/
.box, 
.box-module, 
.module-box { padding: 9em 0; }
.contentboxen .imgbox {
	overflow: visible !important;
}
.box-module.firstblock {
	padding: 9em 0 3em;
}
.firstblock h1 {
	margin-left: 1em;
	margin-bottom: 0;
	line-height: 1.2;
}
.firstblock h2 {
	margin-top: 2em;	
}
.firstblock p {
	line-height: 1.8;
	color: #7a7a7a;
}
.firstblock .six img {
	margin-top: 1em;
}
@media only screen and (max-width: 1024px) {
	.firstblock h1 {
		margin-left: 0;
	}
	.intro .wpcf7 #step8 input[type="submit"] {
		font-size: 15px;
		margin: 0.5em auto 1em;
		padding: 1em 1.5em;
	}
}
@media only screen and (max-width: 320px) {
	.intro .wpcf7 #step8 input[type="submit"] {
		font-size: 14px;
	}
}
/* Kundestimmen Facebook */
.box.kundenstimmen {
  margin: 0;
  padding: 1em 0 5em;
}
.kundenstimmen .bewertung {
  width: auto;
  margin: 0 auto;
  max-width: 100%;
}
.kundenstimmen .slick-slide img {
	max-width: 100%;
	margin: 0 auto;
  	padding: 0;
}
.kundenstimmen .slick-dots {
  width: auto;
  left: 50%;
  margin-left: -150px;
}
.kundenstimmen .slick-dots li button {
  border: 1px solid #ffffff;
  border-radius: 10px;
}
.kundenstimmen .slick-dots li button::before {
	font-size: 16px;
	opacity: 0.25;
	color: #777;
}
.kundenstimmen .slick-dots li.slick-active button::before {
  opacity: 0.75;
  color: rgba(78, 174, 251); 
}
/* isMobile Funktion */
@media only screen and (max-width: 1200px){
	.box.kundenstimmen .container {
		width: 100%;
	}
	.box.kundenstimmen img {
		width: 98%;
		max-width: 500px;
	}
}
/*************************************/
/***** Zweite Block - Praxisbild *****/
/*************************************/
.praxis {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/BG-home-new4.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 1;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}
.praxis img {
	border-radius: 100px 100px 300px 100px;
    box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.12);
}
@media only screen and (max-width: 550px) {
	.praxis {
		padding: 3em 0;
	}
	.praxis img {
		margin-bottom: 2em;
	}
}
/**************************************/
/***** Dritte Block: Logos-Slider *****/
/**************************************/
#logos {
	padding: 0;
	margin: 4em 0;
	background-color: transparent;
	background-image: linear-gradient(140deg, #0700DD 42%, #69D7FF 81%);
}
#logos h6 { margin-top: 80px; }
#logos h2 { margin-bottom: 0; }
#logos .carousel-firmen {
	padding: 7em 0 5em;
}
#logos .container .columns {
  margin-bottom: 0 !important;
}
#logos .carousel-firmen .two img {
	opacity: 1;
}
#logos div.svgpanel {
	overflow: hidden;
	position: absolute;
	z-index: 0;
	fill: #fff;
	left: 0;
	width: 100%;
	line-height: 0;
	direction: ltr;
	-webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
	margin-top: 0;
}
#logos div.svgpanel svg {
	position: relative;
    display: block;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: calc(100% + 1.3px);
    height: 190px;
}
#logos div.svgpanel-bottom {
	overflow: hidden;
	position: relative;
	z-index: 0;
	fill: #fff;
	left: 0;
	width: 100%;
	line-height: 0;
	direction: ltr;
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	margin-top: 0;
}
#logos div.svgpanel-bottom svg {
	position: relative;
    display: block;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: calc(100% + 1.3px);
    height: 20px;
}
@media only screen and (max-width: 1024px) {
	#logos h6 { margin-top: 0px; /* statt 80 */ }
	#logos div.svgpanel svg {
		 height: 90px;
	}
	#logos .carousel-firmen {
		padding: 5em 0 3em;
	}
	
}
@media only screen and (max-width: 550px) {
	#logos .carousel-firmen {
		padding: 3em 0 1em;
	}
	#logos h2 { font-size: 1.4em; }
}
/********************************************/
/***** Vierte Block: Boxen mit Schritte *****/
/********************************************/
.schritte h5 {
	color: #4632da;
    font-size: 20px;
    font-weight: 400;
}
.schritte {
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/Shapes-icons.png');
    background-position: bottom right;
    background-repeat: no-repeat;
}
.schritte .four.columns {
	padding: 3em;
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.05);
	border-radius: 15px 15px 15px 70px;
}
.schritte .four.columns img {
	width: 66px;
	height: 66px;
	margin: 0 3em 3em 0;
	filter: brightness( 100% ) contrast( 100% ) saturate( 200% ) blur( 0px ) hue-rotate( 64deg );
}
@media only screen and (max-width: 550px) {
	.schritte { 
		padding: 5em 0;
	}
}
/********************/
/****** Footer ******/
/********************/
.footer-1::before{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
    background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/CTA-Shapes.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.15;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}
.footer-1  {
	padding: 0;
	border-top: none;
	background-color: transparent;
	background-image: linear-gradient(130deg, #0700DD 0%, #69D7FF 89%);
}
#footer-html {
	padding: 1em;
}
#footer-html h4 {
	color: #ffffff;
	font-size: 2.4em;
	font-weight: 500;
	margin-top: 3em;
}
@media only screen and (max-width: 900px) {
	#footer-html h4 {
		display: inline-block;
		width: 100%;
		margin-top: 1em;
	}
}
.footer-1 img {
    border-radius: 300px 100px 100px 100px;
    box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.12);
}
.footer-1 div.svgpanel {
	overflow: hidden;
	position: absolute;
	z-index: 0;
	fill: #fff;
	left: 0;
	width: 100%;
	line-height: 0;
	direction: ltr;
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	margin-top: 0;
}
.footer-1 div.svgpanel svg {
	position: relative;
	display: block;
	width: calc(100% + 1.3px);
	height: 100px;
	transform: translateX(-50%) rotateX(180deg);
}
.impressum .imgbox {
	display: inline-block;
	width: 100%;
	margin: 1em auto;
}
.impressum .imgbox img {
	max-width: 300px;	
}
@-webkit-keyframes anim {
  0% {
    opacity: 0;
  }
  36.36% {
    opacity: 0;
  }
  63.63% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes anim {
  0% {
    opacity: 0;
  }
  36.36% {
    opacity: 0;
  }
  63.63% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
.image-container {
  position: relative;
  width: 90%;
  height: 234px;
  max-width: 465px;
  margin: 1.5em auto 0.5em;
}
.image-container .image {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 465px;
  max-height: 234px;
  opacity: 0;
  background: linear-gradient(90deg, rgba(21,40,134,0.99) 0%, rgba(21,40,134,0.96) 100%),  url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/Siegel-doppelt-abstand.png');
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  z-index: 2;
}
.image-container .hidden-link {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 465px;
  max-height: 234px;
  z-index: 3;	
}
.image-container .image.image2::before {
	position: absolute;
	display: block;
	content: '';
	width: 100%;
  	height: 100%;
	top: 0;
	left:0;
	background-image: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/Siegel-doppelt-abstand.png');
	background-size: contain;
  	background-position: center center;
  	background-repeat: no-repeat;
	z-index: -1;
}
.image-container .image.image1 {
  opacity: 1;
  background-image: url('https://images.provenexpert.com/a9/5a/64ce26f982dc3837be7f38a49434/widget_recommendation_465_0.png?t=1654771827149');
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}
.image-container .image2 {
  -webkit-animation: anim 6s infinite alternate;
  animation: anim 6s infinite alternate;
}
@media only screen and (max-width: 1920px) {
	.image-container {
		max-width: 440px;
		height: 200px;
	}
}
@media only screen and (max-width: 1024px) {
	.image-container {
		height: 190px;
	}
}
@media only screen and (max-width: 550px) {
	.image-container {
		height: 174px;
	}
}
@media only screen and (max-width: 400px) {
	.image-container {
		height: 150px;
	}
}
/********************************************/
/************** Angebot Unterseite **********/
/********************************************/
.admin-bar .header-angebot { 
	top: 32px !important;
}
.angebot .container {
	overflow-x: hidden;
}
.angebot .header-angebot {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	background: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(10px);
}
.header-angebot a  {
	margin: 0.5em auto;
}
.angebot .header img {
	max-width: 60vw;	
}
.angebot .intro {
  background-size: cover;
  background-position: center 30%;
  background-color: #ffffff;
}
.angebot .intro::before {
content: none !important;
}
@media only screen and (max-width: 550px) {
  .angebot .header {
    display: block;
  }
  .angebot .intro {
	  background-position: center 0%;
  }
}
#form-angebot {
	padding: 0 0 3em;
	background-position: center 80%;
}
#form-angebot::before {
	background: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(10px);
}
#form-angebot .container {
	overflow-x:visible;
}
#form-angebot .wpcf7 {
	max-width: 400px;
	margin: 0 auto;
}
#form-angebot .container.badge-content {
	max-width: 1120px;
	margin-top: 2em;
	margin-bottom: 2em;
}
#form-angebot .multistep {
	text-align: center;
}
#form-angebot .frage {
	display: inline-block;
	margin-top: 1em;
	margin-bottom: 0.8em;
	font-weight: 600;
	font-size: 1.2em;
	color: #585858;
}
#form-angebot .wpcf7-radio label, 
#form-angebot .wpcf7-checkbox label {
	width: 100%;
	max-width: 80vw;
	height: auto;
}
#form-angebot #step1 span.wpcf7-list-item, 
#form-angebot #step2 span.wpcf7-list-item, 
#form-angebot #step3 span.wpcf7-list-item, 
#form-angebot #step4 span.wpcf7-list-item, 
#form-angebot #step5 span.wpcf7-list-item, 
#form-angebot #step6 span.wpcf7-list-item {
	width: 300px;
	margin: 0;
}
#form-angebot .wpcf7-radio input:checked + span, 
#form-angebot .wpcf7-checkbox input:checked + span {
	border-radius: 15px;
}
#form-angebot .wpcf7-radio label, 
#form-angebot .wpcf7-checkbox label {
	border-radius: 15px;
}
#form-angebot .wpcf7-radio label, 
#form-angebot .wpcf7-checkbox label {
	background: linear-gradient(90deg, rgba(21,40,134,0.99) 0%, rgba(74, 186, 211, 0.99) 100%);
	cursor:pointer;
}
#form-angebot .wpcf7-radio label span, 
#form-angebot .wpcf7-checkbox label span {
	padding: 15px 20px;
	color: #ffffff;
	text-align: left;
    margin-left: 60px;
	border: none;
}
#form-angebot .wpcf7-radio input:checked + span, 
#form-angebot .wpcf7-checkbox input:checked + span {
	background: linear-gradient(90deg, rgba(21,40,134,0.99) 0%, rgba(74, 186, 211, 0.99) 100%);
	color: #333;
	margin-left: 0px;
	padding-left:  80px;
	border: none;
}
#form-angebot .wpcf7-list-item label {
	position: relative;
}
#form-angebot #step1 .wpcf7-list-item label span::before,
#form-angebot #step2 .wpcf7-list-item label span::before,
#form-angebot #step3 .wpcf7-list-item label span::before,
#form-angebot #step4 .wpcf7-list-item label span::before,
#form-angebot #step5 .wpcf7-list-item label span::before,
#form-angebot #step6 .wpcf7-list-item label span::before {	
	  content: '';
      position: absolute;
      top: 5%;
      left: 5%;
      width: 50px;
      height: 90%;
}
#form-angebot #step1 .wpcf7-list-item:nth-child(1) label span::before {	
  background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/man.png') center center / cover no-repeat;
}
#form-angebot #step1 .wpcf7-list-item:nth-child(2) label span::before {	
  background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/gay.png') center center / cover no-repeat;
}
#form-angebot #step1 .wpcf7-list-item:nth-child(3) label span::before {	
  background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/father-and-son.png') center center / cover no-repeat;
}
#form-angebot #step1 .wpcf7-list-item:nth-child(4) label span::before {	
  background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/family.png') center center / cover no-repeat;
}
#form-angebot #step2 .wpcf7-list-item:nth-child(1) label span::before,
#form-angebot #step3 .wpcf7-list-item:nth-child(1) label span::before,
#form-angebot #step4 .wpcf7-list-item:nth-child(1) label span::before,
#form-angebot #step6 .wpcf7-list-item:nth-child(1) label span::before {
	background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/yes.png') center center / cover no-repeat;
}
#form-angebot #step2 .wpcf7-list-item:nth-child(2) label span::before,
#form-angebot #step3 .wpcf7-list-item:nth-child(2) label span::before,
#form-angebot #step4 .wpcf7-list-item:nth-child(2) label span::before,
#form-angebot #step6 .wpcf7-list-item:nth-child(2) label span::before {
	background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/no.png') center center / cover no-repeat;
}
#form-angebot #step5 .wpcf7-list-item:nth-child(1) label span::before {
	background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/money.png') center center / cover no-repeat;
}
#form-angebot #step5 .wpcf7-list-item:nth-child(2) label  span::before {
	background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/spar.png') center center / cover no-repeat;
}
#form-angebot #step5 .wpcf7-list-item:nth-child(3) label  span::before {
	background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/wallet.png') center center / cover no-repeat;
}
/* Zurueck-Butttom */
#form-angebot .wpcf7 button[type="button"] {
  padding: 1em 2em;
  color: #ffffff;
  background: linear-gradient(90deg, rgba(21,40,134,0.99) 0%, rgba(74, 186, 211, 0.99) 100%);
  border:none;
  border-radius: 12px;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 400;
  margin: 1em auto 2em;
}
/* Suchen - Simulation mit weissen Slider */
#form-angebot #step7 {
	background-color: rgba(21,40,134,0.99);
	background: linear-gradient(90deg, rgba(21,40,134,0.99) 0%, rgba(74, 186, 211, 0.99) 100%);
	border-radius: 15px;
}
#form-angebot #step7 .frage {
	color: #ffffff;
}
#form-angebot .wpcf7 .spiners {
	position: relative;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
#form-angebot .wpcf7 .spinner {
  width: 120px;
  height: 120px;
  border: 8px solid #ffffff;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-radius: 50%;
  animation: spin 2s linear infinite;
  margin: 1em auto 1em;
}
@keyframes spin2 {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(-360deg); }
}
#form-angebot .wpcf7 .spinner2 {
  width: 80px;
  height: 80px;
  border: 8px solid #ffffff;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-radius: 50%;
  animation: spin2 2s linear infinite;
  position: absolute;
  top: 20px;
  left: 50%;
  margin-left: -40px;
}
@keyframes moveLeft {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-100%); /* Ändern Sie dies je nach gewünschter Bewegungsrichtung und Entfernung */ }
}
#form-angebot .wpcf7 .slide-box {
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
}
#form-angebot .wpcf7 .slide-image {
  width: 4000px; /* Breite des Bildes anpassen */
  height: 85px; /* Höhe des Bildes anpassen */
  background: url('https://www.zahnschutzvergleich.de/wp-content/uploads/2023/11/anbieter1.png') center center / cover no-repeat; /* Hintergrundbild und Anpassung anpassen */
  animation: moveLeft 40s linear infinite; /* Animation anpassen (Dauer, Timing-Funktion, Unendlichkeit) */
  margin-bottom: 2em;
}
/* Letzte schritt im Multistep-Form */
.intro .wpcf7 .abschluss { /* p, strong */
  display: inline-block;
  color: #ffffff;
  margin-bottom: 2em;
  font-weight: 500;	
  max-width: 80%;
}
.intro .wpcf7 strong.abschluss {
	margin-top: 1em;
}
#form-angebot .wpcf7 input[type="text"], 
#form-angebot .wpcf7 input[type="password"], 
#form-angebot .wpcf7 input[type="email"], 
#form-angebot .wpcf7 input[type="url"], 
#form-angebot .wpcf7 input[type="date"],
#form-angebot .wpcf7 input[type="tel"],
#form-angebot .wpcf7 input[type="number"], textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #fff;
    border-radius: 0;
    border-style: solid;
    border-width: 0.1rem;
    box-shadow: none;
    display: block;
    font-size: 1.6rem;
    letter-spacing: -0.015em;
    margin: 0;
    max-width: 100%;
    padding: 1.5rem 1.8rem;
    width: 100%;
}
@media only screen and (max-width: 1024px) {
	#form-angebot .wpcf7 input[type="text"], 
	#form-angebot .wpcf7 input[type="password"], 
	#form-angebot .wpcf7 input[type="email"], 
	#form-angebot .wpcf7 input[type="url"], 
	#form-angebot .wpcf7 input[type="date"],
	#form-angebot .wpcf7 input[type="tel"],
	#form-angebot .wpcf7 input[type="number"], textarea {
		 padding: 0.3rem 0.8rem;
	}
	#form-angebot .wpcf7 .abschluss,
	#form-angebot .wpcf7 strong.abschluss {
		margin-bottom: 1em;
	}
}
#form-angebot .wpcf7 #step8 input{
	width: 90%;
    max-width: 400px;
    margin: auto;
    border-radius: 20px !important;
}
#form-angebot .wpcf7 #step8 input[type="submit"] {
	padding: 1em 2em;
	color: #ffffff;
	background: linear-gradient(90deg, rgba(21,40,134,0.99) 0%, rgba(74, 186, 211, 0.99) 100%);
	border: 1px solid #17498a;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 400;
	margin: 0em auto 2em;
	width: auto;
}
#form-angebot .wpcf7-acceptance label {
	text-align: center;
	font-size: 0.8em;
    max-width: 80%;
}
#form-angebot .wpcf7 #step8 input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    top: 2px;
    display: inline-block;
    margin: 0;
    width: 1.5rem;
    min-width: 1.5rem;
    height: 1.5rem;
    background: #fff;
    border-radius: 0;
    border-style: solid;
    border-width: 0.1rem;
    border-color: #dcd7ca;
    box-shadow: none;
	padding: 6px;
    cursor: pointer;
}
#form-angebot .wpcf7 #step8 input[type="checkbox"]:checked::before {
    content: url(data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%23000000%27%2F%3E%3C%2Fsvg%3E);
    position: absolute;
    display: inline-block;
    margin-left: -0.7rem;
	margin-top: -0.7rem;
    height: 1.75rem;
    width: 1.75rem;
}
/* last step */
#form-angebot .formstart {
	text-align: center;
}
#form-angebot .formstart h1 {
	font-size: 24px !important;
	line-height: 1.5 !important;
}
#form-angebot .wpcf7-response-output {
  display: none !important;
}
.rundeprogress {
  position: relative;
  display: flex;
  display: none;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  background-color: #ffffff;
  transform: rotate(45deg);
  width: 120px;
  height: 120px;
  border: 8px solid #e8e4e4;
  border-top: 8px solid #46559c;
  border-radius: 50%;
  margin: 60px auto;
  overflow: visible;
}
.rundeprogress p {
  display: inline-block;
  transform: rotate(-45deg);
  position: absolute;
  left: 50%;
  margin-left: -19px;
  margin-bottom: 12px;
  color: #46559c;
  font-weight: 600;
  font-size: 1.2em;
}
.indicator {
  width: 125px;
  height: 125px;
  margin: 0 auto;
  text-align: center;
  background-color: transparent;
  position: relative;
  margin-top: -60px;
  z-index: 2;
}
.indicator p {
	margin-bottom: 0;
}
.indicator span {
  position: absolute;
  display: inline-block;
  margin-left: -14px;
  line-height: 125px;
  font-size: 18px;
  font-weight: 600;
  color: #46559c;
  z-index: 4;
}
.indicator .centr {
  background-color: #e8e4e4;
  position: absolute;
  width: 100px;
  height: 100px;
  border-radius: 100%;
  margin: 13px;
  z-index: 2;
}
.indicator .centr .value-bar,
.indicator .centr .left-half {
  position: absolute;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  clip: rect(0 50px 125px 0);
  z-index: 3;
}
.indicator .centr .value-bar {
	background-color: #46559c;
	-webkit-transform: rotate(18deg);
	transform: rotate(18deg);
}
.indicator .centr .left-half {
	background-color: #e8e4e4;	
}
.indicator .centrV {
  position: absolute;
  border-radius: 50%;
  background-color: #fff;
  width: 87px;
  height: 87px;
  margin: 19px;
  z-index: 3;
}
.indicator .fa-check {
	color: #46559c;
	font-size: 60px;
	margin: 20px 0 0 -20px;;
}
.footer-angebot {
	position: fixed;
	left: 0;
	bottom: 43px;
	width: 100%;
	padding: 0;
	background-color: #ffffff;
	border-top: 2px solid #ffffff;
	color: #ababab;
}
.footer-angebot .container .columns {
	margin-bottom: 0.5em;	
}
.footer-angebot #footermenu-1 li a {
	font-weight: 400;
	font-size: 0.9em;
	color: #ababab;
}
.footer-angebot #footermenu-1 li a:hover {
	color: #bababa;
}
@media only screen and (max-width: 550px) {
	.container.badge-content img {
		width: 80vw;
	}
	.container.badge-content .columns:first-child img,
	.container.badge-content .columns:last-child img {
		max-width: 150px;
	}
	.container.badge-content .columns {
		order: 2;
		margin-bottom: 1em !important;
	}
	.container.badge-content .columns:first-child,
	.container.badge-content .columns:last-child {
		order: 1;
	}
	.footer-angebot {
		position:relative;
		margin-top: 3em;
	}
	.badge .three img {
		max-width: 60vw;
	}
	#footermenu-1 ul {
    	margin-top: 1em;
	}
}
#ProvenExpert_widgetbar_container > div {
	z-index: -1 !important;
}