/* ------------------------------------------------------------------------------------------------------------------------------------*/

/* ------------------------------------------------------------ CUSTOM CSS ------------------------------------------------------------*/

/* ------------------------------------------------------------------------------------------------------------------------------------*/


*{
	box-sizing:border-box;
}

html,body{
	height:100%;
	font-family: 'Barlow', sans-serif;
	font-weight:400;
	color: RGB(46, 45, 44);
	background-color:#fff;
	font-size:18px;
	line-height:1.25;
}

ul{
	padding:0;
	margin:0;
}

ul{
	list-style:none;
}

ul li{
	border-bottom:1px solid #d1d1d1;
	padding:10px 0px;
}

h2{
	font-size:3em;
	font-weight:600;
	margin-bottom:40px;
}

h3{
	font-size:2em;
	font-weight:600;
	margin-bottom:40px;
	color:RGB(61 ,117, 154);

}

.row{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}

.row .col4{
	width:calc(4 * (100% / 12));
}
.row .col6{
	width:calc(6 * (100% / 12));
}
.row .col8{
	width:calc(8 * (100% / 12));
}

.row .col{
	padding:20px;
}

.row .col:first-child{
	padding-left:0px;
}

.row .col:last-child{
	padding-right:0px;
}

a, a:visited{
	color: RGB(46, 45, 44);
	text-decoration:none;
}

a:hover{
	//color: RGB(107, 102, 97);
}

.red{
	color:RGB(61 ,117, 154);
}

.block{
	width:100%;
	display:flex;
	justify-content:center;
	padding:100px 0px;
}

.block .inner{
	width:1400px;
	max-width:100%;
}

.block h2{
	font-size:2.5em;
	margin-bottom:40px;
}

.block .introtext{
	padding:20px 0px;
}

img.shadow{
	box-shadow:0px 0px 15px rgba(0,0,0,0.25);
}


.header{
	width:100%;
	display:flex;
	justify-content:center;
}

.header .innen{
	width:1400px;
	max-width:100%;
	padding:25px 0px;
	align-items:center;
	justify-content:space-between;
	flex-direction:row;
	display:flex;
	//box-shadow:0px 0px 15px rgba(0,0,0,0.25);
	
}

.header .logo{
	background-image:url(/wp-content/uploads/2021/05/TZ_Demo_Logo.png);
	width:330px;
	height:78px;
	background-repeat:no-repeat;
	background-size:100%;
}

.header .logo:hover{
	letter-spacing:0.03em;
}


.menu-container{
	font-weight:400;
	font-size:1.2em;
	display:flex;
	flex-direction:row;
}

.menu-container .link-block{
	margin:0px 20px;
	padding:10px;
}

.menu-container a{
	cursor:pointer;
}

.header .menu-container a.buchen,
.footer .menu-container a.buchen{
	margin:0px 0px 0px 20px;
	padding:10px 20px;
	background-color:RGB(61 ,117, 154);
	cursor:pointer;
	color:#fff;
	font-weight:400;
	transition:all 200ms ease;
}

.footer .menu-container a.buchen{
	margin:0px 0px 0px 00px;
}

.header .menu-container a.buchen:hover,
.footer .menu-container a.buchen:hover{
	padding:10px 25px;
}

.header .menu-container a.buchen1 i,
.footer .menu-container a.buchen1 i{
	padding:10px 20px;
	height:47px;
	color:#fff;
	background-color:RGB(46, 45, 44);
	display:flex;
	align-items:center;
	border-radius:0px 15px 15px 0px;
}	

/******************************** SLIDER */

.slider-wrap{
	position:relative;
	width:100%;
	min-height:600px;
	text-align:center;
	height:calc(100vh - 300px);
}



.slider-wrap ul{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	list-style:none;
}

.slider-wrap ul > li{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	overflow:hidden;
	opacity:0;
	filter:alpha(opacity=0);
	visibility:hidden;
	-webkit-transition: all 1s ease 0s;
	-o-transition: all 1s ease 0s;
	transition: all 1s ease 0s;			
}	


.slider-wrap ul > li .img_frame{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	max-width:none !important;
	background-size:cover;
	background-position:50% 50%;
	display:flex;
	justify-content:center;
}


.slider-wrap .img_frame .inner{
	width:1400px;
	max-width:100%;
}


.slider-wrap ul > li img{
	position:absolute;
	min-width:100% !important;
	margin:0;
}

.slider-wrap ul > li.active{
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible;
}	

.slider-wrap ul > li > i{
	position:absolute !important;
	top:calc(50% - 30px);
	width:60px;
	height:60px;
	font-size:60px;
	color:#fff;
	cursor:pointer;
	z-index:4000;
}

.slider-wrap .bigicon{
	position:absolute;
	width:50vw;
	height:30vw;
	left:calc(50% - 25vw);
	top:calc(50% - 15vw - 50px);
}

.slider-wrap .bigicon img{
	opacity:0.25;
	filter:alpha(opacity=25);
	height:25vw;
	width:25vw;
	min-width:25vw !important;
	max-width:25vw !important;
	left: calc(50% - 12.5vw) !important;
}



.slider-wrap .slidertext-wrap{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}

.slider-wrap .slidertext{
	display:block;
	position:relative;
	width:auto;
	height:auto;
	display:flex;
	flex-direction:column;
	background-color:rgba(255,255,255,0.7);
	padding:20px 40px;
	width:700px;
	max-width:100%;
	border-radius:20px;
}

.slider-wrap .slidertext.oben-links{
	left:0px;
	top:90px;
	float:left;
}
.slider-wrap .slidertext.oben-rechts{
	right:0px;
	top:90px;
	float:right;
}
.slider-wrap .slidertext.unten-links{
	left:0px;
	bottom:90px;
	float:left;
}
.slider-wrap .slidertext.unten-rechts{
	right:0px;
	bottom:90px;
	float:right;
}

.slidertext .name{
	color:RGB(46, 45, 44);
	font-size:2.4em;
	font-weight:600;
	text-align:left;
	margin-bottom:10px;
}

.slidertext .untertitel{
	color:RGB(46, 45, 44);
	text-align:left;
	font-size:1.2em;
	text-align:left;
	margin-bottom:30px;
}


.slidertext .link{
	font-size:1.0em;
	font-weight:400;
	text-align:left;
	background-color:RGB(61 ,117, 154);
	position:absolute;
	bottom:-20px;
	padding:10px 20px;
	transition:all 300ms ease;
}

.slidertext .link:hover{
	padding:10px 30px;
}

.slidertext .link a{
	color:#fff;
}



.slider-nav{
	position:relative;
	display:block;
	width:100%;
	max-width:100vw;
	height:10px;
	margin:0 auto;
	bottom:45px;
	z-index:1;
}

.slider-nav ul{
	list-style:none;
	width:100%;
	text-align:center;
}

.slider-nav ul li{
	float:none;
	display:inline-block;
	width:35px;
	height:9px;
	margin:0px 5px;
	background-color:#fff;
	border:1px solid #E17119;
}

.slider-nav ul li.active{
	background-color:#E17119;
	border:1px solid #fff;
}


.facts{
	width:100%;
	display:flex;
	justify-content:center;
}

.facts .inner{
	background-color:RGB(61 ,117, 154);
	min-height:400px;
	color:#fff;
	margin-top:-300px;
	z-index:10;
	padding:50px;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	text-align:center;
	border-radius:30px;
}

.facts .inner h2{
	text-align:left;
	border-bottom:1px solid rgb(95,158,193);
	padding-bottom:20px;
}


.facts .inner > div{
	width:100%;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	transition:all 200ms ease;
}

.facts .inner > div > div{
	width:20%;
	padding:20px;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	transition:all 200ms ease;
}

.facts .inner > div > div:hover{
	margin-top:-5px;
}	


.facts .inner i{
	font-size:4em;
	margin-bottom:20px;
}	


.facts .inner p.title{
	font-size:1.5em;
	font-weight:500;
	margin-bottom:10px;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:center;
	height:100px;
}

.tests{
	width:100%;
	display:flex;
	justify-content:center;
	padding:100px;
}


.tests h2{
	font-size:3em;
	font-weight:600;
	margin-bottom:40px;
}

.tests .introtext{
	width:60%;
}

.testarten{
	display:flex;
	justify-content:center;
	padding:100px;
	background-color:#f1f1f1;
}



.testarten ul{
	width:100%;
	list-style:none;
	margin-bottom:100px;
}

.testarten li{
	width:100%;
	padding:40px 0px;
	border-bottom:1px solid #d1d1d1;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
}

.testarten li:last-child{
	border-bottom:0px;
}

.testarten .testname{
	font-weight:300;
	font-size:2em;
	display:flex;
	flex-direction:column;
	width:50%;
}

.testarten .testname .untertitel{
	font-weight:400;
	font-size:0.5em;
	width:100%;
}

.testarten .preis{
	font-weight:400;
	font-size:1.2em;
	width:25%;
}

.testarten a.buchen{
	padding:10px 20px;
	background-color:RGB(61 ,117, 154);
	cursor:pointer;
	color:#fff;
	font-weight:400;
	transition:all 200ms ease;
	font-size:1.2em;
}

.testarten a.buchen:hover{
	padding:15px 20px;
}

.introtext a{
	background-color:RGB(61 ,117, 154);
	padding:10px 20px;
	color:#fff;
	transition:all 200ms ease;
}

.introtext a:hover{
	padding:10px 25px;
}

.logos{
	display:flex;
	flex-direction:row;
	align-items:flex-start;
	margin-top:40px;
	margin-bottom:100px;
}

.logos img{
	margin-right:40px;
	width:25%;
}

.unseretests{
	background-color:#f1f1f1;
}

.faqs .col{
	display:flex;
	flex-direction:column;
}

/* ------------------------------------------------------------ START FAQ ------------------------------------------------------------*/

.faq-item{
	position:relative;
	margin-bottom:2em;
}

.start-faq-wrap .inner div.faq-item:last-of-type{
	margin-bottom:0;
}

.faq-item .indicator{
	position:relative;
	width:15px;
	height:15px;
	margin-right:4px;
	display:inline-block;
}

.faq-item .bar-1{
	position:absolute;
	height:3px;
	width:15px;
	top:6px;
	background-color:RGB(61 ,117, 154);
}

.faq-item .bar-2{
	position:absolute;
	height:3px;
	width:15px;
	top:6px;
	background-color:RGB(61 ,117, 154);
	transition:all 300ms ease;
}

.faq-item.closed .bar-2{
	transform:rotate(90deg);
}

.faq-item .frage{
	font-size:1.6em;
	font-weight:400;
	color:RGB(61 ,117, 154);
	border-bottom:2px solid RGB(61 ,117, 154);
	margin-bottom:0.25em;
	padding-bottom:0.15em;
	cursor:pointer;
}

.faq-item .antwort{
	height:auto;
	overflow:hidden;
	transition:all 300ms ease;
}

.faq-item.closed .antwort{
	height:0px;
}

.ablauf{
	background-color: RGB(46, 45, 44);
	color:#fff;
}

.ablauf .inner{
	display:flex;
	flex-direction:row;
}

.ablaufitem{
	width:25%;
	padding:10px;
}

.ablaufitem .zahl{
	font-size:8em;
	font-weight:300;
	color:RGBA(255,255,255,0.2);
}

.ablaufitem .titel{
	font-size:1.6em;
	height:80px;
	display:flex;
	align-items:center;
	font-weight:600;
}

.ablaufitem .beschreibung{
	font-size:1em;
	border-top:1px solid RGB(61 ,117, 154);
	padding-top:20px;
	margin-top:20px;
}

.footer{
	background-color:#d1d1d1;
}

.footer .logo{
	font-weight:600;
	font-size:2.5em;
	text-decoration:none;
	transition:all 200ms ease;
	background-image:url(/wp-content/uploads/2021/05/TZ_Logo_Web.png);
	background-repeat:no-repeat;
	background-size:100%;
	width:210px;
	height:78px;
	position:relative;
	display:block;
}

.footer h2{
	margin-bottom:10px !important;
}

.footer h3 a{
	color:RGB(61 ,117, 154);
}

