/*  Ein Kommentar in CSS */

/*  
	Der * definiert eine globale Variable.
	Den sogenannten "global reset".
	Hier werden alle Elemente angesprochen, die später nicht anders definiert werden. 
	Früher verwendet um die verschiedenen Browser Versionen auf den gleich Standard zu bringen. 
	Oft wird auch heute noch, besonders bei Word Press Templates oder bei Bootstrap eine normalize.css eingesetzt, die dies für ALLE html Elemente durchführt.

	In diesem Fall werden zwei Sachen erreicht:
	margin und padding  werden auf 0 zurück gesetzt, um dann diese Eigenschaften mit eigenen Werten zu versehen.
	Die Schrifttype wird mit font-family auf eine Standard Schrift eingestellt. So wird erreicht, dass IMMER ALLE Schriften denselben font haben. Sollten später z.B, Überschriften davon abweichen, müssen sie gesondert definiert werden.
	Und einige Eigenschaften werden global definiert, um sie später nicht immer wieder einsetzen zu müssen.
	Dies ist selbstverständlich komplett optional und kann jederzeit gelöscht oder verändert werden.
*/
*
{
/* margin definiert den Aussenabstand einer Box */	
	margin:0px;	
/* padding definiert den Innenabstand einer Box */
	padding:0px;
/* font-family definiert die Schriftart */	
	font-family:sans-serif;
/* position:relative definiert die Startposition einer Box */	
	position:relative;
/*  box-sizing:border-box definiert das padding und border NICHT zu Breite und Höhe dazu addiert werden  */	
	box-sizing:border-box;
}


html,body
{
	height: 100%;
}

body 
{
	background:white;
	color:black;
	margin:0px;

}


#wrapper
{
	width: 100%;
	_height: 125px;
	
}

/*Fonts & Buttons beginn*/

h2
{
	font-family: "Montserrat", sans-serif;
	font-size: 375%;
	font-weight: 700;
	margin-bottom: 15px;
	line-height: 1;
}

h3
{
	font-family: "Montserrat", sans-serif;
	font-size: 	187.5%;
	font-weight: 600;
	line-height: 1;
	margin-bottom: 25px;
}

p
{
	font-family: "Montserrat", sans-serif;
	font-size: 	125%;
	font-weight: 400; /*weight von 500 auf 400 geändert da es sich optisch besser abhebt*/
}

p .fat
{
	font-weight: 600;
}

.button
{
	margin-top: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: black;
	background: #F1B982;
	width: 50%;
	height: auto;
	padding: 10px 0px 10px 0px;
	border-radius: 25px;
	font-family: "Montserrat", sans-serif;
	font-size: 	125%;
	font-weight: 600;
	line-height: 1;
}

.button:hover
{
	background: #eb9947;
}

/*Fonts & Buttons Ende*/

/*Beginn - Erste Zeile: Logo und Icons*/

#logozeile
{
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin: 0px auto;
	padding: 16px 5%;
	background: #F1B982;
}

.logo-content
{
	display: flex;
	align-items: self-end;
	justify-content: center;
	gap: 15px;
}

.logo-content img
{
	height: 92px;
}

.logo-content h1
{
	font-family: "Montserrat", sans-serif;
	font-size: 225%;
	font-weight: 800;
	line-height: 1;
}

#peticons
{
	display: flex;
	justify-content: space-around;
	gap: 40px;
	margin: auto;
	margin-right: 0px;
}

/*Ende - Erste Zeile: Logo und Icons*/

/*Anfang - Keyimages*/

#emergency {
  position: absolute;
  top: 20px;
  right: -200px;    
  z-index: 10;    
  background: #B70505;
  color: white;
  padding: 20px;
  border-radius: 15px 0px 0px 15px;
  display: flex;
  align-items: center;
  gap: 15px;

  transition: 0.3s;
}

#emergency:hover
{
	right: 0px;
}

#emergencytext
{
	padding-left: 10px;
}

#emergencytext h3
{
	margin-bottom: 5px;
}

#notfalltel
{
	display: flex;
	align-items: center;
	gap: 10px;
}

.desktop {
  width: 100%;          
  height: auto;        
  object-fit: cover;     
  display: block;
}

/*Ende - Keyimages*/

/*Anfang Inhaltszeile: Text und Bilder*/

.imageleft, .imageright
{
	width: 50%;          
  	height: auto;        
  	object-fit: cover;     
  	display: block;
}


.text-below-keyimage
{
	width: 100%;
	height: auto;
	background: linear-gradient(90deg, rgba(29, 73, 55, 1) 50%, rgba(135, 129, 93, 1) 75%, rgba(241, 185, 130, 1) 100%);
	color: white;
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.text-below-keyimage-no-gradient
{
	width: 100%;
	height: auto;
	background: #1D4937;
	color: white;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.textleft
{
	width:50%;
	padding-top: 40px ;
	padding-left: 5%;
	padding-bottom: 40px ;
	padding-right: 5%;
}

.textfull
{
	width:98%;
	padding-top: 40px ;
	padding-left: 5%;
	padding-right: 5%;
	padding-bottom: 40px ;
}

.smartphone
{
	display: none;
}

/*Ende Inhaltszeile: Text und Bilder*/

/*Anfang Termin & Sprechstunde*/

#termin-index
{
	background: #112C21;
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 40px;
	padding-bottom: 40px;
}

#oeffnungszeiten
{
	width: 45%;
	background: #F1B982;
	border-radius: 0px 20px 20px 0px;
	padding-left: 10%;
	padding-top: 40px;
	padding-bottom: 50px;
	box-shadow: inset -5px 5px 12px #482502;
}

#terminvereinbarung, #anfahrt
{
	width: 55%;
	padding-left: 100px;
	padding-right: 7%;
	padding-top: 30px;
	color: white;
}


#terminvereinbarung-ohne-öffnungszeiten
{
	width: 90%;
	padding-left: 100px;
	padding-right: 7%;
	padding-top: 30px;
	color: white;
}

#terminbutton
{
	margin-top: 30px;
}

#kontaktformular
{
	color: white;
}

iframe
{
	margin: 0px auto;
}

/*Ende Termin & Sprechstunde*/

/*weiterer content index hier anfang*/

.trenner
{
	background: #F1B982;
	min-height: 10px;
	width: 100%;
}

/*weiterer content index hier ende*/


/*Footer beginn*/

footer
{
	background: #112C21;
	padding-top: 50px;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: auto;
	color: white;
}

footer a
{
	color: white;
}

#socialmediaicons
{
	display: flex;
	justify-content: space-around;
	width: 40%;
	padding-top: 10px;
}

.iconwithtext a
{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 5%;
}

.iconwithtext img
{
	height: 40px;
}

.iconwithtext p
{
	padding-top: 10px;

	width: 105px;
}

#rechtliches
{

	width: 60%;
	display: flex;
	justify-content: center;
	gap: 30px;
	margin-top: 40px;
	padding-bottom: 15px;
}

#rechtliches a
{
	text-decoration: underline;
}

#impressumcontainer
{
	display: flex;
	justify-content: center;
	padding-top: 40px;
	padding-bottom: 40px;
	background: #112C21;
	color: white;
}

#impressumcontainer a
{
	color: white;
}

#impressumcontainer h1
{
	font-size: 200%;
}

#impressumcontainer h2
{
	font-size: 140%;
}

#impressumcontainer h3
{
	font-size: 120%;
}

#impressumcontainer li
{
	margin-left: 3%;
}

/*Footer ende*/
img
{
	display: block;
}

a
{
	color:black;
	text-decoration:none;
}


/*CSS TERMINFORMULAR START*/
.dis-icon {
 padding: 10px;
 color: #000000;
 min-width: 40px;
 text-align: center;
 font-size: 1em;
}

.dis-icon-left {
 color: #000000;
 min-width: 40px;
 text-align: center;
 font-size: 1em;
}

.dis-input-container {
	position: relative !important;
}

.dis-input-container label i {
	position: absolute !important;
	left: auto !important;
	top: calc(50% - 0.5em) !important;
}

.dis-input-container input {
	position: initial !important;
	padding: 7px 4px 7px 40px !important;
}

@media print {

#page_top div[id^='page_'] {
	display: inline !important;
 } 
}

.fds-1, .table *, .table2 * {
	box-sizing: border-box;
}


.tis_width {
 	width:100% !important;
}

.font-big {
 	font-family:"Montserrat", sans-serif;
 	font-size:24px; 
	font-weight:bold;
 	color:transparent;
}

.font-small {
 	font-family:"Montserrat", sans-serif;
 	font-size:12px; 
	font-weight:normal;
 	color:#FFFFFF;
}

.lb-1 {
	display: block;
 	margin:0.4rem 0;
}

.table * .align {
 	display: table-cell;
}

.col2 {
	width:30%;
}
.col8 {
	width:4.998%;
}
.col8_r {
	width:11.662%;
}
.col10 {
	width:6%;
}
.col10_r {
	width:14%;
}
.col12 {
	width:7.5%;
}
.col12_r {
	width:17.5%;
}
.col16 {
	width:9.996%;
}
.col16_r {
	width:23.334%;
}
.col25 {
	width:15%;
}
.col25_r {
	width:35%;
}
.col16fx {
	width:16.66%;
}
.col20 {
	width:20%;
}
.col25fx {
	width:25%;
}
.col33 {
	width:33.33%;
}
.col50 {
	width:50%;
}
.table {
 	margin-left: auto;
 	width: 100%;
	padding:40px 5%;
 	margin-right: auto;
 	border-spacing:1px;
 	background-color:#112C21;
 	letter-spacing:normal;
}

.table2 {
 	background-color:#112C21;
 	width:100%;
 	border-collapse:collapse;
}

.head {
 	padding:3px;
 	background-color:transparent;
}

.main {
 	padding:3px;
 	background-color:transparent;
 	font-family: "Montserrat", sans-serif;
 	font-size:18px; font-weight:normal;
 	color:#FFFFFF;
}

.foot {
	margin-top: 20px;
 	padding:3px;
 	background-color:transparent;
}

.align {
 	text-align:right;
}

.textarea {
 	background-color:#F1B982;
 	color:#000000;
 	font-family: "Montserrat", sans-serif;
 	font-size:18px;
 	font-weight: normal;
 	border : 1px solid #000000;
 	border-radius:4px; -webkit-border-radius:4px;
	 padding: 7px;
 	position:relative;
 	letter-spacing:normal;
}

.input {
 	background-color:#F1B982;
 	color:#000000;
 	font-family: "Montserrat", sans-serif;
 	border : 1px solid #000000;
 	font-size:18px;
 	border-radius:4px; -webkit-border-radius:4px;
 	padding: 7px;
 	position:relative;
 	vertical-align:middle;
 	letter-spacing:normal;
}

.select {
 	background-color:#F1B982;
 	color:#000000;
 	font-family: "Montserrat", sans-serif;
	 border : 1px solid #000000;
 	font-size:18px;
 	border-radius:4px; -webkit-border-radius:4px;
 	padding: 7px;
 	position:relative;
 	vertical-align:middle;
 	letter-spacing:normal;
}

.textarea:hover, .textarea:focus, .input:hover, .input:focus, .select:hover, .select:focus {
 	border-color: #F1B982;
 	box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 10px rgba(241,185,130,0.75);
	-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 10px rgba(241,185,130,0.75);
}

.button {
 	cursor: pointer;
 	padding:5px 12px;
 	margin:3px 0;
 	display:inline;
 	text-decoration:none;
 	border-radius:6px;
 	-webkit-border-radius:6px;
 	position:relative;
 	background-color:#1D4937;
 	color:#FFFFFF;
 	font-family: "Montserrat", sans-serif;
 	font-size:16px;
 	font-weight: bold;
 	border : 1px solid transparent;
 	min-width: 200px;
 	letter-spacing:normal;
}

.button_send {
 	cursor: pointer;
	padding:5px 12px;
 	margin:3px 0;
 	display:inline;
 	text-decoration:none;
	border-radius:6px;
 	-webkit-border-radius:6px;
 	position:relative;
 	background-color:#1D4937;
 	color:#FFFFFF;
 	font-family: "Montserrat", sans-serif;
 	font-size:16px;
 	font-weight: bold;
 	border : 1px solid transparent;
 	min-width: 200px;
 	letter-spacing:normal;
}

.button:hover, .button:focus {
 	border : 1px solid transparent;
 	color:#FFFFFF;
 	text-decoration:none;
 	background: #B70505;
}

.button_send:hover, .button_send:focus {
 	border : 1px solid transparent;
 	color:#FFFFFF;
 	text-decoration:none;
 	background: #B70505;
}

.radio_v {
 	display: block;
 	position: relative;
}
.radio_h {
 	display: inline;
 	position: relative;
 	margin-right:8px;
}
/*ENDE CSS TERMINFORMULAR*/

/*ANFANG CSS KONTAKT FORMULAR*/
.dis-icon {
 padding: 10px;
 color: #FFFFFF;
 min-width: 40px;
 text-align: center;
 font-size: 1em;
}
.dis-icon-left {
 color: #FFFFFF;
 min-width: 40px;
 text-align: center;
 font-size: 1em;
}
.dis-input-container {position: relative !important;}
.dis-input-container label i {position: absolute !important;left: auto !important;top: calc(50% - 0.5em) !important;}
.dis-input-container input {position: initial !important;padding: 7px 4px 7px 40px !important;}
@media print {
#page_top div[id^='page_'] {
  display: inline !important;
 } 
}
.fds-1, .table *, .table2 * {box-sizing: border-box;}
a.dwflink:link {text-decoration: underline; color: #0000FF}
a.dwflink:visited {text-decoration: underline; color: #0000FF}
a.dwflink:hover {text-decoration: underline; color: #0000FF}
body {
 background-color: #112C21;
}
.tis_width {
 width:100% !important;
}
.font-big {
 font-family:'Montserrat', sans-serif;
 font-size:20px; font-weight:bold;
 color:#000000;
}
.font-small {
 font-family:'Montserrat', sans-serif;
 font-size:10px; font-weight:normal;
 color:#FFFFFF;
}
.lb-1 {
 display: block;
 margin:0.4rem 0;
}
.table * .align {
 display: table-cell;
}
.col2 {width:30%;
}
.col8 {width:4.998%;}
.col8_r {width:11.662%;}
.col10 {width:6%;}
.col10_r {width:14%;}
.col12 {width:7.5%;}
.col12_r {width:17.5%;}
.col16 {width:9.996%;}
.col16_r {width:23.334%;}
.col25 {width:15%;}
.col25_r {width:35%;}
.col16fx {width:16.66%;}
.col20 {width:20%;}
.col25fx {width:25%;}
.col33 {width:33.33%;}
.col50 {width:50%;}
.table {
 margin-left: auto;
 width:90%;
 margin-right: auto;
 border-spacing:1px;
 background-color:transparent;
 letter-spacing:normal;
}
.table2 {
 background-color:transparent;
 width:100%;
 border-collapse:collapse;
}
.head {
 padding:3px;
 background-color:transparent;
}
.main {
 padding:3px;
 background-color:transparent;
 font-family:'Montserrat', sans-serif;
 font-size:16px; font-weight:normal;
 color:#FFFFFF;
}
.foot {
 padding:3px;
 background-color:transparent;
}
.align {
 text-align:right;
}
.textarea {
 background-color:#1D4937;
 color:#000000;
 font-family:'Montserrat', sans-serif;
 font-size:18px;
 font-weight: normal;
 border : 1px solid transparent;
 border-radius:4px; -webkit-border-radius:4px;
 padding: 7px;
 position:relative;
 letter-spacing:normal;
}
.input {
 background-color:#1D4937;
 color:#000000;
 font-family:'Montserrat', sans-serif;
 border : 1px solid transparent;
 font-size:18px;
 border-radius:4px; -webkit-border-radius:4px;
 padding: 7px;
 position:relative;
 vertical-align:middle;
 letter-spacing:normal;
}
.select {
 background-color:#1D4937;
 color:#000000;
 font-family:'Montserrat', sans-serif;
 border : 1px solid transparent;
 font-size:18px;
 border-radius:4px; -webkit-border-radius:4px;
 padding: 7px;
 position:relative;
 vertical-align:middle;
 letter-spacing:normal;
}
.textarea:hover, .textarea:focus, .input:hover, .input:focus, .select:hover, .select:focus {
 border-color: #1D4937;
 box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 10px rgba(29,73,55,0.75);
-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 10px rgba(29,73,55,0.75);
}
.button {
 cursor: pointer;
 padding:5px 12px;
 margin:3px 0;
 display:inline;
 text-decoration:none;
 border-radius:6px;
 -webkit-border-radius:6px;
 position:relative;
 background-color:#1D4937;
 color:#FFFFFF;
 font-family:'Montserrat', sans-serif;
 font-size:16px;
 font-weight: bold;
 border : 1px solid transparent;
 min-width: 200px;
 letter-spacing:normal;
}
.button_send {
 cursor: pointer;
 padding:5px 12px;
 margin:3px 0;
 display:inline;
 text-decoration:none;
 border-radius:6px;
 -webkit-border-radius:6px;
 position:relative;
 background-color:#1D4937;
 color:#FFFFFF;
 font-family:'Montserrat', sans-serif;
 font-size:16px;
 font-weight: bold;
 border : 1px solid transparent;
 min-width: 200px;
 letter-spacing:normal;
}
.button:hover, .button:focus {
 border : 1px solid transparent;
 color:#FFFFFF;
 text-decoration:none;
 background: #B70505;
}
.button_send:hover, .button_send:focus {
 border : 1px solid transparent;
 color:#F7F7F7;
 text-decoration:none;
 background: #B70505;
}
.radio_v {
 display: block;
 position: relative;
}
.radio_h {
 display: inline;
 position: relative;
 margin-right:8px;
}
/*ENDE KONTAKTFORMULAR STYLESHEET*/


/* MEDIA QUERY */
@media screen and (max-width:1024px) {

h2
{
	font-size: 175%;
}

h3
{
	font-size: 	150%;
}

p
{
	font-size: 	112.5%;
}

#logozeile
{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0px;
	padding-top: 10px;
	padding-bottom: 10px;
}

.logo-content
{
	display: flex;
	align-items: self-end;
	gap: 0px;
}

.logo-content img
{
	height: 60px;
	margin-bottom: 5px;
}

.logo-content h1
{
	font-size: 125%;
	margin-bottom: 5px;
	padding-left: 5px;
}

#peticons
{
	display: none;
}

.desktop
{
	display: none;
}

.smartphone
{
	display: block;
	width: 100%;
	height: auto;
}

#keyimage
{
	display: flex;
	flex-direction: column;
	position: relative;
	z-index: 1;
	width: 100%;
}

#emergency {
  	position: relative;
 	top: 0px;
  	right: 0px;
  	padding: 5px;
  	border-radius: 0px;
  	display: flex;
  	justify-content: center;
  	align-items: self-end;
	z-index: 10;
}

#emergencytext
{
	display: flex;
	align-items: center;
	gap: 5%
}

#emergency img
{
	height: 30px;
}

#notfalltel img{
	display: none;
}

.text-below-keyimage
{
	width: 100%;
	height: auto;
	background: linear-gradient( rgba(29, 73, 55, 1) 55%, rgba(135, 129, 93, 1) 75%, rgba(241, 185, 130, 1) 100%);
	display: block;
	z-index: 2;
}

.text-below-keyimage-reverse-gradient
{
	width: 100%;
	height: auto;
	background: linear-gradient(90deg,rgba(241, 185, 130, 1) 0% , rgba(135, 129, 93, 1) 25%, rgba(29, 73, 55, 1) 50%);
	color: white;
	display: block;

}

.text-below-keyimage-no-gradient
{
	display: block;
}

.iconleft img
{
	height: 100px;
	margin: auto;
}

.imageright
{
	width: 100%;
}

.iconright img
{
	height: 100px;
	margin: auto;
}

.textleft
{
	width:94%;
	padding-top: 30px ;
	padding-left: 0px;
	padding-bottom: 0;
	margin: auto;
	margin-bottom: 20px;
}

#termin-index
{
	display: block;
	padding-top: 20px;
	padding-bottom: 30px;

}

#oeffnungszeiten
{
	width: 94%;
	padding-top: 20px;
	padding-bottom: 25px;
}

iframe
{
	margin: 0px auto;
	width: 100%;
	height: 250px;
	padding: 0px 5%;
	margin-top: 20px;
}

#terminvereinbarung, #anfahrt, #terminvereinbarung-ohne-öffnungszeiten
{
	width: 90%;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 20px;
	margin: 0px auto;

}

footer
{
	padding-top: 30px;
	display: block;
}

#socialmediaicons
{
	width: 94%;
	padding-top: 10px;
	margin: 0px auto;
}

.iconwithtext a
{
	display: inline-block;
}

.iconwithtext a img
{
	padding-left: 15px;
}

footer header{
	width: 94%;
	margin: 0px auto;
	display: flex;
	justify-content: center;
}

footer header h3
{
	font-size: 100%;

}

footer p
{
	font-size: 80%;
}

#rechtliches
{

	width: 100%;
	justify-content: center;
	gap: 20px;
	margin-top: 40px;
	padding-bottom: 15px;
}

img
{
	max-width: 100%;
	height: auto;
}
}