@import url(//fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700);

HTML, BODY {height:100%; margin:0px; padding:0px;}
BODY {overflow:-moz-scrollbars-vertical; background-color:#ffffff;}

BODY, DIV, P, H1, H2, TD, TH, INPUT, TEXTAREA, SELECT, TABLE {font-family: 'Roboto Condensed', sans-serif; font-weight:300;; font-size:16px; line-height:24px; color:#7f7f7f;}

H1 {font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:30px; line-height:40px; color:#018dca; padding:0px; margin:0px 0px 25px 0px; text-transform:uppercase;}
H1 SPAN {font-weight:300;}
H2 {font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:18px; line-height:24px; color:#018dca; padding:0px; margin:40px 0px 0px 0px;}
H2 SPAN {font-weight:300;}
H2.leistungen {margin:20px 0px 15px 0px;}
H3 {font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:16px; line-height:22px; color:#7f7f7f; padding:0px; margin:20px 0px 10px 0px;}

P {font-family: 'Roboto Condensed', sans-serif; font-weight:300; font-size:16px; line-height:24px; color:#7f7f7f; padding:0px; margin:0px 0px 20px 0px;}
P.bold {font-weight:700;}

IMG {border:0px; margin:0px; padding:0px; line-height:0px; display:block;}

A {color:#018dca;text-decoration:none;outline:none;}
A:hover {color:#018dca;text-decoration:underline;}

A.clean {text-decoration:none;outline:none;}
A.clean:hover {text-decoration:none;}
A.clean_underline {text-decoration:none;outline:none;}
A.clean_underline:hover {text-decoration:underline;}

FORM {margin:0px;padding:0px;}

INPUT, SELECT, TEXTAREA {padding:2px 4px 2px 4px; border:1px solid #cbcbcb; font-family: 'Raleway', sans-serif; font-weight:400; font-size:14px; line-height:18px; color:#000000;}

UL {margin:10px 0px 20px -24px;}
LI {margin:0px; padding-bottom:2px; list-style-image:url(images/layout/li.png);}

.body-bg{background-attachment: fixed;}
/* ======================================================================================================================================= */

/* Klassen f�r das Layout */

	#wrapper_content_area{max-width:920px; margin:auto auto; position:relative; padding: 0 4%;}

.invisible {display:none;}

/* Klassen f�r Head Bereich */
	#head_area { display: flex; justify-content: space-between;	align-items: flex-end; margin: 35px 0 80px 0;}


/* ======================================================================================================================================= */

/* Klassen f�r die Navi - Main Navi */
		#main_navi UL {display:flex; flex-wrap: wrap;	gap: 20px;margin:0px; padding:0px; list-style:none;}
		#main_navi UL LI {list-style:none; text-align: center; height:50px;}
		#main_navi UL LI A {white-space:nowrap; padding:0px 0px 8px 0px; margin:0px; border-bottom:5px solid #E6E6E6; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:16px; line-height:16px; color:#7f7f7f; text-transform:uppercase; transition: all .3s ease;}
		#main_navi UL LI A SPAN {font-weight:300;}
		#main_navi UL LI A:hover {text-decoration:none; color:#018dca; border-bottom:5px solid #018DCA;}
		#main_navi UL LI A.aktiv {color:#018dca; border-bottom:5px solid #018DCA;}

		.toggle_btn{
			width: 30px;
			height: 22px;

			position: absolute;
			top: 25px;
			right: 25px;

			display: none;
			flex-direction: column;
			justify-content: space-between;
		}
		.bar{
			height: 4px;
			width: 100%;
			background: #018DCA;
		}
.toggle_btn .bar:nth-child(1), .toggle_btn .bar:nth-child(3) {
	transition: all .3s ease-out;
}
input#toggle_btn {display: none}

/* ======================================================================================================================================= */
/* Klassen f�r Startseite */
#top_teaser_startseite {height:350px; border:7px solid #E6E6E6; border-radius:10px; margin-bottom: 30px;position: relative;}
#top_teaser_startseite_text {position:absolute; max-width: 85%; bottom: 30px;}
#top_teaser_startseite_text H1 {display:inline-block; margin:0px; width:auto; padding:1px 16px 1px 12px; background-color:#ffffff; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:30px; line-height:44px; color:#018dca; text-transform:uppercase;}
#top_teaser_startseite_text H1 SPAN {font-weight:300;}

#top_teaser_startseite_text_mobile { margin:0px 0px 50px 0px; display: none;}
#top_teaser_startseite_text_mobile H1{line-height:44px;  padding:1px 16px 1px 12px; margin:0px; font-size: 26px;	line-height: 34px;}


#top_teaser_startseite_bild {height:100%;}
#top_teaser_startseite_bild img{    height: 100%;	object-fit: cover;	width: 100%; min-height: 190px;}

#home-kontakt-teaser{
background: #fff;
display: flex;
  border: 7px solid #E6E6E6;
  border-radius: 10px;
  margin-bottom: 30px;
}

#home-kontakt-teaser div{
width: 50%;
}

#home-kontakt-teaser h3{
color: #018dca;
text-align: center;
}

#home-kontakt-teaser h1{
text-align: center;
}
#home-kontakt-teaser h1 span{
font-weight: 300;

}




/* ======================================================================================================================================= */
/* Klassen f�r Kontaktformular */
#top_teaser_kontakt {border:7px solid #E6E6E6; border-radius:10px; margin-bottom:50px;     background-color: #fff;}
#top_teaser_kontakt_text {position:absolute; 0px }
#top_teaser_kontakt_text H2 {display:inline-block; margin:12px 0px 0px 12px; width:auto; padding:1px 14px 1px 9px; background-color:#ffffff; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:24px; line-height:34px; color:#018dca; text-transform:uppercase;}
#top_teaser_kontakt_text H2 SPAN {font-weight:300;}
#top_teaser_kontakt form {margin-top:50px}
#top_teaser_kontakt form table {width: 100%; padding: 0 12px;}
#top_teaser_kontakt form table td { border-bottom: 1px solid #CCCCCC; display: inline-flex; width: 50%;}
#top_teaser_kontakt form table tr { display: flex; gap: 20px; margin-top: 20px;}
#top_teaser_kontakt form input[type="text"], #top_teaser_kontakt form input[type="email"], #top_teaser_kontakt form textarea { border: none; width: 100%}
#top_teaser_kontakt form textarea { height: 165px; overflow-y: auto; outline: none; resize: none;}
#top_teaser_kontakt form input:focus, #top_teaser_kontakt form textarea:focus { border: none; outline: none;}
#top_teaser_kontakt H3 {display:inline-block; margin:0px; width:auto; padding:1px 6px 0px 9px; background-color:#ffffff; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:14px; line-height:22px; color:#018dca;}
.button_send{display:inline-block; width:auto; text-decoration:none; background-color:#7f7f7f; border:0; border-radius:0; font-family: 'Roboto Condensed', sans-serif; font-weight:300; font-size:14px; line-height:24px; color:#ffffff; padding:2px 20px 2px 20px; margin:22px 12px 12px 12px;}
.button_send:hover{text-decoration:none; background-color:#018dca; color:#ffffff;}
.w-100 {width: 100% !IMPORTANT;}
.w-100mod{ display: flex;	flex-direction: column;	width: 100% !IMPORTANT;}
#top_teaser_kontakt .error {position: absolute;top: -14px;left: 9px;color: red;font-size: 10px;}
#top_teaser_message {width:940px; height:128px; border:10px solid #E6E6E6; border-radius:10px;margin-top:40px;}
#top_teaser_message p { margin-top: 40px; width: 100%; text-align: center; background-color:#ffffff; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:24px; line-height:34px; color:#018dca; }


/* ======================================================================================================================================= */

		#mini_teaser_start_area {margin-bottom:50px; display: flex; gap: 40px; flex-direction: row;}
#mini_teaser_start_area a {width: 50%}
				#mini_teaser_start_area H2 {display:inline-block; margin:90px 0px -1px 0px; width:auto; padding:1px 14px 1px 9px; background-color:#ffffff; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:24px; line-height:34px; color:#018dca; text-transform:uppercase;}
				#mini_teaser_start_area H2 SPAN {font-weight:300;}
				#mini_teaser_start_area H3 {display:inline-block; margin:0px; width:auto; padding:1px 6px 0px 9px; background-color:#ffffff; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:14px; line-height:22px; color:#018dca;}
				
			#mini_teaser_start_1, #mini_teaser_start_2{position: relative; height:200px; border:7px solid #E6E6E6; border-radius:10px; overflow: hidden;}
  			#mini_teaser_start_1 img, #mini_teaser_start_2 img{width: 100%; height: 100%; position: absolute;	top: 0;	z-index: -1; object-fit: cover; transition: all .3s ease-out;}
			#mini_teaser_start_1:hover img, #mini_teaser_start_2:hover img{transform: scale(1.05);}



		#info_box_start_area { display: flex; gap: 40px; display: none;}
				#info_box_start_area H4 {margin:0px; padding:0px; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:14px; line-height:14px; color:#018dca; text-transform:uppercase;}
				#info_box_start_area H5 {margin:14px 0px 0px 0px; padding:0px; font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:14px; line-height:22px; color:#018dca;}
				#info_box_start_area H5 SPAN {font-weight:300;}
				#info_box_start_area P {margin:0px; padding:0px; font-family: 'Roboto Condensed', sans-serif; font-weight:300; font-size:14px; line-height:20px; color:#808080;}
			#erfahrungsberichte, #neuigkeiten  {overflow: hidden; padding:14px 0px 6px 0px; width:50%;border-top: 7px solid #E6E6E6; border-bottom: 7px solid #E6E6E6;}
			.container{position: relative; display: flex; transition: transform 0.5s ease;}
			.container>.slide{flex: 0 0 100%;}
			.container>.slide p{font-size:16px!important;line-height:24px!important;}

			DIV.info_box_link_bereich {float:right; padding:0px; margin:-3px 8px 0px 0px; font-family: 'Roboto Condensed', sans-serif; font-weight:400; font-size:12px; line-height:15px; color:#018dca;}
			A.info_box_link_for {display:inline-block; margin:0px 0px 0px 5px; padding:0px; height:16px; width:12px; background-image:url(images/layout/link_pfeil_for.png); background-repeat:no-repeat;}
				A.info_box_link_for:hover {text-decoration:none;outline:none;}
			A.info_box_link_back {display:inline-block; margin:0px 5px 0px 0px; padding:0px; height:16px; width:12px; background-image:url(images/layout/link_pfeil_back.png); background-repeat:no-repeat;}
				A.info_box_link_back:hover {text-decoration:none;outline:none;}

/* ======================================================================================================================================= */

/* Klassen f�r Content*/

	#content_unterseiten { display: flex;gap:  40px; margin-bottom: 50px;}
	#content_unterseite_left {width: 50%;}
		#content_unterseite_bild {border:7px solid #E6E6E6; border-radius:10px;}
		#content_unterseite_bild img{width: 100%; object-fit: cover;}
	#content_unterseite_right {width: 50%;}

	#content_unterseiten_leistung{display: flex;gap: 40px;}

	.map_img_pos{object-position: right bottom;}
	
	#content_unterseiten_praxis{margin-bottom: 50px;}
	#galerie { display: flex; flex-wrap: wrap; gap: 20px; margin-right: -20px;}
	#galerie a{transition: all .3s ease-out; width: calc(20% - 20px); overflow: hidden;}
	#galerie img{height: 100%; width: 100%; aspect-ratio: 16/9; object-fit: cover; transition: all .3s ease-out; filter: brightness(0.7);}
	#galerie a:hover img{scale: 1.02; filter: brightness(1); }

#content_unterseiten.unserseite_sec{gap:  0 40px !important;}
/*
.lb-outerContainer {
	width: 100% !important;
	height: auto !important;
	max-width: unset;
	max-height: calc(100vh - 100px);
	overflow: hidden;
}*/

	.lb-outerContainer{width: 90% !important; height: auto !important;     max-width: 920px;		    max-height: calc(100vh - 100px);;     transition: all 0.3s ease-out !important; overflow: hidden;}
	.lb-dataContainer {	width: 90% !important;  max-width: 920px;}
	#lightbox img {	width: 100% !important;	height: auto;    transition: all 0.3s ease-out !important;     height: auto;}
	#lightbox{     left: unset !important;   position: fixed !Important;    transition: all 0.3s ease-out !important;		right: 50%;		top: 50% !important;		transform: translate(50%, -50%);		/*width: unset !important;*/}
	/* Ausklapp Punkte bei Leistungen */
	A.ausklappen {display:inline-block; float:right; height:16px; text-decoration:none; margin:0px 10px 0px 0px; padding:4px 30px 0px 6px; background-color:#E6E6E6;  background-image:url(images/layout/pfeil_leistungen_down.png); background-repeat:no-repeat; background-position:right; font-family: 'Roboto Condensed', sans-serif; font-weight:400; font-size:12px; line-height:12px; color:#7f7f7f;}
	A.ausklappen_aktiv {background-color:#7f7f7f; color:#ffffff; background-image:url(images/layout/pfeil_leistungen_up_over.png);}
	A.ausklappen:hover {background-color:#7f7f7f; color:#ffffff; background-image:url(images/layout/pfeil_leistungen_down_over.png);}
	A.ausklappen_aktiv:hover {background-color:#7f7f7f; color:#ffffff; background-image:url(images/layout/pfeil_leistungen_up_over.png);}
		/*
		A.ausklappen:after {content:" +";}
		A.ausklappen_aktiv:after {content:" -";}
		*/

		/* Subkategorien */
		.subkategorie {display:none; margin-bottom:40px; margin-top:15px;}

/* ======================================================================================================================================= */

/* Klassen f�r Footer Bereich */
	#footer_area {margin-top:40px; border-top:5px solid #E6E6E6; height:100px; display: flex;		justify-content: space-between;		flex-wrap: wrap;		gap: 20px;}
		#footer_area div {margin:10px 0px 0px 0px; padding:0px; font-family: 'Roboto Condensed', sans-serif; font-weight:300; font-size:12px; line-height:12px; color:#7f7f7f;}
		#footer_area div .foo_bold {font-weight:700;}
		#footer_area div.links_right {font-family: 'Roboto Condensed', sans-serif; font-weight:700; font-size:12px; line-height:12px; color:#7f7f7f; text-transform:uppercase; display: flex;	gap: 20px;}
		#footer_area div.links_right A {color:#7f7f7f; transition: all 0.3s ease-out;}
		#footer_area div.links_right A:hover {color:#7f7f7f; text-decoration:underline;}

#footer_area .content_left{    display: flex;	gap: 7px;     flex-wrap: wrap;}
/* ======================================================================================================================================= */

/* Klassen f�r Google Maps */
	#map-canvas{height:332px;}
		.button_map{-webkit-appearance:none; width:auto; background-color:#7f7f7f; border:0; border-radius:0; font-family: 'Roboto Condensed', sans-serif; font-weight:300; font-size:14px; line-height:24px; color:#ffffff; padding:1px 20px 1px 20px; margin:0px 0px 0px 0px; cursor:pointer;}
		.button_map:hover{text-decoration:none; background-color:#018dca;}
		.button_map:active{text-decoration:none; background-color:#018dca;}
		.button_map:focus{outline:0; border:0px solid #018dca;}

		.input_map {-webkit-appearance:none; width:300px; margin-right:40px;}
		.input_map:focus{outline:0; border:1px solid #018dca;}

		.button_route{    transition: all .3s ease-out;display:inline-block; width:auto; text-decoration:none; background-color:#7f7f7f; border:0; border-radius:0; font-family: 'Roboto Condensed', sans-serif; font-weight:300; font-size:14px; line-height:24px; color:#ffffff; padding:2px 20px 2px 20px; margin:0px 0px 0px 0px;}
		.button_route:hover{text-decoration:none; background-color:#018dca; color:#ffffff;}

/* ======================================================================================================================================= */

/* Klassen f�r das Kontaktformular */
	TABLE.table_form {width:345px; float:left; margin-top:30px; font-family: 'Raleway', sans-serif; font-weight:400; font-size:14px; line-height:18px; color:#343434;}
	TABLE.table_form.zwei {margin-left:20px;}
	TABLE.table_form TD {padding:0px 10px 20px 0px; color:#808080; vertical-align:top; line-height:25px;}
	TABLE.table_form TD.pflicht {color:#000000;}
	TABLE.table_form TD.code {font-size:12px; line-height:14px;}
	TABLE.table_form INPUT {width:230px; height:20px;}
	TABLE.table_form TEXTAREA {width:230px; height:106px;}
	TABLE.table_form TD INPUT, SELECT, TEXTAREA {color:#808080;}
	TABLE.table_form TD.pflicht INPUT, SELECT, TEXTAREA {color:#000000;}

	TABLE.table_form INPUT.submit {width:auto; background-color:#FE5619; border:0; border-radius:2px; font-family: 'Raleway', sans-serif; font-weight:700; font-size:11px; line-height:11px; color:#ffffff; padding:5px 26px 5px 8px; margin:0px 0px 0px 0px; text-transform:uppercase; background-image:url(images/layout/pfeil_weiter.png); background-repeat:no-repeat; background-position:right; cursor:pointer;}
	TABLE.table_form INPUT.submit:hover {text-decoration:none; background-color:#0086CB;}

	INPUT.submit {width:auto; background-color:#FE5619; border:0; border-radius:2px; font-family: 'Raleway', sans-serif; font-weight:700; font-size:11px; line-height:11px; color:#ffffff; padding:5px 26px 5px 8px; margin:0px 0px 0px 0px; text-transform:uppercase; background-image:url(images/layout/pfeil_weiter.png); background-repeat:no-repeat; background-position:right; cursor:pointer;}
	INPUT.submit:hover {text-decoration:none; background-color:#0086CB;}

	.grau {color:#808080;}
	.klein {font-size:10px; line-height:14px;}
	.fehler {color:#ff0000;}


/* ======================================================================================================================================= */
/*----------Responsiv media querys----------*/

@media only screen and (max-width: 920px) {
	.toggle_btn{		display: flex;	}

	#main_navi UL {
		transition: all .3s ease;
		flex-direction: column;
		width: 100%;
		background: #fff;
		height: 0;
		position: absolute;
		top: 200px;
		left: 0;
		z-index: 1000;
		overflow: hidden;
	}

	#main_navi li{
		height: min-content;
		width: 100%;
		padding: 10px 0 10px 0;
	}

	#toggle_btn:checked ~ #main_navi UL {		height: 460px;	}
	#toggle_btn:checked ~ .toggle_btn .bar:nth-child(1) {		transform: rotate(-45deg) translate(-6px, 6px);	}
	#toggle_btn:checked ~ .toggle_btn .bar:nth-child(2) {		opacity: 0;	}
	#toggle_btn:checked ~ .toggle_btn .bar:nth-child(3) {		transform: rotate(45deg) translate(-6px, -6px);	}

	#content_unterseiten, #content_unterseiten_leistung {		flex-wrap: wrap;	}
	#content_unterseite_left {		width: 100%;	}
	#content_unterseite_right {		width: 100%;	}

	#galerie a{ width: calc(25% - 20px);}

	#top_teaser_startseite {height:unset;}
}



@media only screen and (max-width: 750px) {
#top_teaser_startseite_text {display: none;}
#top_teaser_startseite_text_mobile{display: block}
#home-kontakt-teaser{    flex-direction: column;}
#home-kontakt-teaser div{width: 100%;}
#home-kontakt-teaser h1{font-size: 24px; }

}

@media only screen and (max-width: 600px) {
	#mini_teaser_start_area {
		flex-direction: column !Important;
	}
	#mini_teaser_start_area a {
		width: 100%;
	}
	#top_teaser_kontakt form table tr {
		flex-direction: column;
	}
	#top_teaser_kontakt form table td {
		width: 100%;
	}
	#info_box_start_area {
		flex-direction: column;
	}
	#erfahrungsberichte, #neuigkeiten {
		width: 100%;
	}

	#galerie a{ width: calc(50% - 20px);}
}

@media only screen and (max-width: 460px) {
	#head_logo img {
		height: 80px;
		width: auto;
	}

	#main_navi UL {
		top: 130px;
	}
}