/* CSS Document */

/* Copyright Urs Zingg 2016 			*/
/* Thank you for looking at this code 	*/

/*====================== ALLGEMEINE HTML-DEFINITIONEN =================== */

/** {
	box-sizing:border-box; /*padding/border/margin nicht dazurechnen */
/*}*/
* {
	box-sizing: border-box;
}
html {
	height: 95%;
	/*min-height: 100%;*/
	margin: 0px;
	padding: 0px;
}

body {
	/*background-image: url("/bilder/kornblumenfeld.jpg"); /* fixed meint, dass es am body festgenagelt und nicht verzerrt wird!.*/
	font-family: 'Josefin Sans','Titilllium Web', sans-serif;
	font-size: 18px;
	font-weight: 400;
	height: 100%;
	margin: 0px;
	padding: 0px;
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	background-attachment:fixed;
	background-color:#FBFAFA;
}

h1, .h1, h2, .h2 {
  font-size: 30px;
}

.btn-default {
}

.backbutton {
	background-color: transparent;
	/*border: none;*/
	
}

/*================== Link Definitionen (Pseudoklassen) ====================== */
a:link {
	color: #7A9E2F;
	/*font-weight: bold;*/
	/*text-decoration: underline;*/
	font-size:22px;
	font-weight: bold;
}
a:visited {
	color: #683C3F;
	font-weight: 400;
	text-decoration: none;
}
a:hover {
	color: #7A9E2F;
	/*font-weight: bold;*/
	text-decoration: none;
}
a:active {
	color: #7A9E2F;
	font-weight: 700;
	text-decoration: underline;
}

.linkcreator {
	font-size: inherit !important;
	font-style: italic; 
}

/* überschreiben der Bootstrap Navigationshöhe*/
.navbar-nav > li > a {
	padding-top:15px !important;
 	padding-bottom:15px !important;
	line-height:29px;
	}
.navbar {
	min-height:40px !important;
	}
/* Ende Bootstrap Navigationshöhe*/

.navbar-default .navbar-toggle .icon-bar {  /*Farbe Hamburgerbutton wechseln*/
  background-color: #fff;
}


/*================== Ende Link Definitionen (Pseudoklassen) ====================== */


#container {
	/*border: 10px solid #FFF;*/
	background-color: #F8F4F3; /*#FFFEDC*/
	margin: 10px auto;
	max-width: 1000px;
	/*min-height: 100%;*/
	/*overflow:auto;*/
	/*opacity: 0.95;
	padding: 10px;
	/*position: relative;*/
	width: 90%;
}
#logobar {
	background-color: #683C3F;
	/*padding: 0px 0px 0px 0px;*/
}
#logobar.img {
margin: 200px;
padding: 200px;
}
#navigation {
	/*border: 10px solid #683C3F;*/
	width: 100%;
	height: 10%;
	padding: 0px;
}
#kopfbild {
	/*border: 20px solid #683C3F;*/
	clear:both;
}

#hauptinhalt {
	/*border: 1px solid #7E1223;*/
	float:left;
	/*width: 66%;*/
	/*height: 100%;*/
	padding: 10px;
	/*padding-right: 60px;*/
	padding-bottom: 0px;   /* Height of the footer */
}
#hauptinhalt_fb {
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	padding: 0px;
	width: 80%;
}
#intro_fb {
	background-color:#ECEDE0;
	border-radius: 10px;
	width: 100%;
	padding-top: 3px;
	padding-left: 20px;
	padding-right: 25px;
	padding-bottom: 15px;
}
#intro_links {
	background-color:#ECEDE0;
	border-radius: 10px;
	/*margin: 28px 0px 50px 0px;*/
	margin-left: -10px;
	margin-top: 16px;
	margin-bottom: 25px;
	padding-top: 3px;
	padding-left: 28px;
	padding-right: 25px;
	padding-bottom: 15px;
}
#kontaktangaben {
	border: 1px solid #7A9E2F;
	float:right;
	/*width: 34%;*/
	margin-top:28px;
	padding: 10px 30px 10px 40px;
	padding-bottom: 30px;   /* Height of the footer */
	border-radius: 5px;
}
IMG.logo {
	display:block;
	margin-left: auto;
	margin-right: auto;
}
.kontaktangaben_centered {
	border: 1px solid #1A6BE8;
	width: 100%;
	padding: 10px 30px;
	padding-bottom: 20px;   /* Height of the footer */
	text-align:center;
}
#kontaktangaben p{
	margin-top: 0px;
	margin-bottom: 0px;
}
span.kontakt-bold {
	font-weight: bold;
	
}

#kontaktformular {
	/*border: 1px solid #FFCE00;*/
	float: left;
	margin-top:20px;
	width: 100%;
	text-align:center;
}
#danke {
	background-color:#ECEDE0;
	border-radius: 10px;
	display: table;
	height: 200px;
	margin: 20px 0px 20px 0px;
	width: 100%;
	text-align:center;
  }
#map {
	/*border:40px solid #683C3F;*/
	margin-top:30px;
	/*padding:40px 0px 20px 0px;*/
	/*width: 100%;
	clear:both;*/		
}
#anamnese {
	/*border: 1px solid #7E1223;*/
	float:left;
	width: 100%;
	padding: 10px;
	padding-bottom: 20px;
}
#therapie {
	/*border: 1px solid #7E1223;*/
	float:left;
	width: 100%;
	padding: 10px;
	padding-bottom: 20px;
}
#kosten {
	/*border: 1px solid #7E1223;*/
	float:left;
	width: 100%;
	padding: 10px;
	padding-bottom: 20px;
	margin-bottom: 40px;
}


#clear {
	/*border-top: 2px solid #02FF2F;
	margin: 50px;
	width:100%;
	clear:both;*/
	
	/*border: 1px solid #7E1223;*/
	float:left;
	width: 100%;
	/*height: 100%;*/
	padding: 10px;
	padding-bottom: 0px;
}
#fusszeile {
	background:#7A9E2F;
	/*background-image: url("/bilder/footer_city.png");*/
	/*border: 1px solid #FF0004;*/
	/*position:absolute;*/
	clear:both;
	/*bottom: 0;
	left: 0;*/
	width: 100%;
	padding: 13px;
	margin-top:20px;
	/*height: 128px;   /* Height of the footer */
	height: 50px;
	/*background: #E5E5E5;*/
	text-align:center;
	font-size:14px;
	font-weight:700;
	overflow:hidden;
}
#absendebutton {
	margin-top:15px;
	margin-bottom:30px;
	font-size:20px;
	font-weight:700;
	color: #FFFFFF;
	background-color: #683C3F;
	-webkit-box-shadow: 0px 0px 22px -2px rgba(0,0,0,0.92);
	-moz-box-shadow: 0px 0px 22px -2px rgba(0,0,0,0.92);
	box-shadow: 0px 0px 22px -2px rgba(0,0,0,0.92);
    height: 50px;
    width: 300px;
}
/* ======================== EIGENE KLASSEN ============================= */

.blockdiv {
	/*border:1px solid #00FF4C;*/
	position:relative;
	/*min-height:300px;*/
}

.clearfix::before, .clearfix::after {
  display: table;
  content: ' '; }

.clearfix::after {
  clear: both; }

.hr-container {
	display:block;	
	width: 100%;
}
.hr-line {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}
.hr1 {
	clear: both;
    color: #7A9E2F;
  	border-color:#7A9E2F;
	background-color:#7A9E2F;
	height: 0.1px;
}

.logo-nav {
	/*margin: 0px 0px 0px 10px;
	border: 3px solid #fff;
	min-width: 30px;
	max-width: 80px;
	height: auto;
	width: 100%;*/
}
.portrait {
	float:left;
	margin:5px 20px 15px 15px;
	width:250px;
	height:auto;
	background-color: #000000;
}

.shadow {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.standardbild {
	float:left;
	margin:10px 15px 15px 15px;
	width:240px;
	height:auto;
}


a[href^="mailto:"]
{ 
	font-family: 'Josefin Sans','Titilllium Web', sans-serif;
	font-size: 20px;
	font-weight: 400;
}

IMG.centered {
	display: block;
    margin-left: auto;
    margin-right: auto;
  	width:100%	
}
IMG.imgfooter {
	height: 100%;
  	min-width: 100%;
  	left: 50%;
  	position: relative;
  	transform: translateX(-50%);
}
.form_input {
	width: 300px;
	height: 50px;
	padding:10px 20px;
	margin: 10px;
}
.form_textarea {
	width: 90%;
	height: 140px;
	padding:10px 20px 10px 20px;
	margin: 10px;
}
.icon {
height: 48px;
width: 48px;
}

.middle {
	display: table-cell;
	font-size:24px;
  	vertical-align: middle;
}









/* =============== UEBERSCHREIBEN DER BOOTSTRAP NAVBAR COLLAPSING SIZE =================== */
@media (max-width: 930px) {
	
  .navbar-header {
      float: none;
  }
  .navbar-left,.navbar-right {
      float: none !important;
  }
  .navbar-toggle {
      display: block;
  }
  .navbar-collapse {
      border-top: 1px solid transparent;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
  }
  .navbar-fixed-top {
      top: 0;
      border-width: 0 0 1px;
  }
  .navbar-collapse.collapse {
      display: none!important;
  }
  .navbar-nav {
      float: none!important;
      margin-top: 7.5px;
  }
  .navbar-nav>li {
      float: none;
  }
  .navbar-nav>li>a {
      padding-top: 10px;
      padding-bottom: 10px;
  }
  .collapse.in{
      display:block !important;
  }
}
/* ============= ENDE UEBERSCHREIBEN DER BOOTSTRAP NAVBAR COLLAPSING SIZE ============= */

  .navbar-default {
  background-color:#7A9E2F;
  }
  .navbar-default .navbar-nav>.active> a, 
  .navbar-default .navbar-nav>.active> a:focus, 
  .navbar-default .navbar-nav>.active> a:hover {
	background:#7A9E2F;
	font-weight:bold;
	font-size:22px; /*Schriftgroesse Links*/
  }  
  
  /* =========== MEDIA SCREEN BREAKPOINTS ================ */
  @media (max-width: 425px) {
	  
	#absendebutton {
	width: 90%;	
	}
	.form_input {
	width: 90%;
	}
	.standardbild {
	width: 81%;	
  	}
	.portrait {
	width: 86%;
	}
  }
  
  @media (max-width: 580px) {
	body {
	text-align: center;
	}
	  
	#kopfbild {
	display: none;
	}
	.standardbild {
	float: none;
	display: block;
    margin-left: auto;
    margin-right: auto;
	}
	.portrait {
	float: none;
	display: block;
    margin-left: auto;
    margin-right: auto;
	}
  }
  
  @media (max-width: 992px) {
  	#kontaktangaben {
		width:100%;
		text-align:center;
	}
	#hauptinhalt {
		width:100%;
	}
	#map {
		width:100%;
	}
	#intro_links {
	margin-right: -10px;
	}
  }

  /* =========== ENDE MEDIA SCREEN BREAKPOINTS ===========*/