@charset "utf-8";
/* montserrat-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/montserrat-v25-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/montserrat-v25-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/montserrat-v25-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/montserrat-v25-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/montserrat-v25-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

* {
 box-sizing: border-box;
}

/*Popup*/

#popup {
  background: #fff;	 opacity: 0.95;	
  background-size: cover;				
  position:fixed;
right: 20px;  
  width:400px;						
  bottom: 90px;						
  padding:20px 10px;					
  font-size: 16px;					
  border-width:5px;					
  border-style:solid;					
  border-color:#c0814e;				
  z-index:20000; 					
}

#popup h2 {
  font-size:22px;						
  font-weight:normal;					
}

.hintergrund {
  background: #fff; opacity: 1;	
  padding:12px;						
  border-width:1px;					
  border-style:solid;					
  border-color:#c0814e;				
  font-weight:bold;					
  margin:20px;						
}

#close{
  position:absolute;					
  background:#c0814e;				
  color:#fff;						
  right:-15px;						
  top:-15px;						
  width:30px;						
  height:30px;						
  line-height:30px;					
  text-align:center;					
  font-size:15px;						
  font-weight:;					
  font-family:'Arial Black', Arial, sans-serif;	
  cursor:pointer;						
}

.button-popup {
  width:50px;						
  color: #ffffff;						
  font-size: 16px;					
  background: #c0814e;				
  padding: 3px 6px 3px 6px;			
  text-decoration: none;				
  text-align:center;					
}

.button-popup:hover {
  background: #89a02c;				
  color: #ffffff;						
  text-decoration: none;				
}

.einblenden {
animation-name: einblenden;
animation-duration: 2s;				
animation-iteration-count: 1;			
animation-timing-function: ease-in-out;
}
@keyframes einblenden {
from {transform:translate(0, 300px);}		
50% {transform:translate(0, 0px);}		
85% {transform:translate(0, 0px);}		
to {transform: translate(0, -0px);} 		
}

@media (max-width: 979px) {
#popup {
display:none;
}}

#popup-mobile {
  background:#fff;
  position:absolute;
  width:300px;
  right: 30px;
  top: 66px;
  padding:20px 10px;
  font-size: 14px;
  border-width:2px;
  border-style:solid;
  border-color:#c0814e;
  z-index:20000; 
}
#popup-mobile h2 {
 font-size:20px;
}

#popup-mobile p {
color: #5e5b52;
}

#close-mobile{
  position:absolute;
  background: #c0814e;
  color:#fff;
  right:-15px;
  top:-15px;
  width:30px;
  height:30px;
  line-height:30px;
  text-align:center;
  font-size:15px;
  font-weight:bold;
  font-family:'Arial Black', Arial, sans-serif;
  cursor:pointer;
}
.button-popup-mobile {
  width:50px;
  color: #006600;
  font-size: 14px;
  background: #fff;
  padding: 2px 4px 2px 4px;
  text-decoration: none;
  text-align:center;
}
.button-popup-mobile:hover {
  text-decoration: none;
}

@media (min-width: 978px) {
#popup-mobile {
display:none;
}

#popup-mobile p {
color: #5e5b52;
}
}

/*-- Markieren --*/
/* Hiermit können Safari >=1.1, Opera >=9.5, IE9 was anfangen*/
::selection {
    background: #c28350;
    color: #fff;
}
/* und hiermit der Firefox >=1 */
::-moz-selection {
    background: #c28350;
    color: #fff;
}

/*Animation*/
       .slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes slideInUp {
  0% {
  -webkit-transform: translateY(30%);
  transform: translateY(30%);
  visibility: visible;
  }
  100% {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  }
  }
  @keyframes slideInUp {
  0% {
  -webkit-transform: translateY(30%);
  transform: translateY(30%);
  visibility: visible;
  }
  100% {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  }
  }
  
body	{
margin: 0 auto;
background: #fff;
font-family: "Montserrat", sans-serif;
width: 100%;
min-height: 101%;
color: #5e5b52;
text-align: left;
}

img	{
outline: none;
max-width: 100%;
height: auto;
border: none;
margin: 0 auto;
}

img.blank	{
border: none;
}

#picture img{
border-bottom: 2px solid #e4e2db;
}

div.col.span_1_of_4 h4	{

word-wrap: break-word;  
}

a	{
color: #5e5b52;
text-decoration: none;
outline: none;
}

a:hover	{
cursor: pointer;
}

a:active, a:focus{
outline: none;
text-decoration: none;
}

p	{
font-weight: 400;
font-size: 100%;
color: #5e5b52/*#005544*/;
line-height: 1.6em;
text-align: left;
letter-spacing: 1px;
/*
    -ms-hyphens: auto;
        -moz-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
*/
}

p.dist	{
padding-top: 4.5%;
}

p.center	{
	margin: 2.5em;
	padding: 5px;
	border: 1px solid #dfd1a1;
	background: #f6f6f4;
text-align: center;
font-size: 18px;
border-radius: 50px;
}

p.centered	{
	margin: 4em;
text-align: center;

}

h1 a	{
line-height: 1.6em;
text-align: left;
margin: 0;
padding: 0px 10% 0;
font-size: 40px;
font-weight: 600;
color: #fff;
}

.slideInUp	{
padding: 0px 0% 0 1%;	
}

h1{
text-align: left;
font-size: 40px;
color: #5e5b52;
 font-weight: 300;
 letter-spacing: 3px;

}
#header h1	{
text-align: left;
line-height: 1em;
margin: 0;
padding: 0px 0 0px 0;
font-size: 30px;
color: #005544;
font-weight: 400;
}

h2	{
color: #c28350;		
margin: 0 0 0px 0;
font-size: 2.5em;
line-height: 1.5;
font-weight: 400;
text-align: center;
letter-spacing: 0.5px;
}
h2.smaller	{
font-size: 2.0em;	
padding-bottom:10px;
}

h2.left{
color: #5e5b52;
text-align: left;
font-size: 1.5em;
}

h2.centered	{
  position: absolute;
  top: 40%;
  left: 15%;
color: #e4e2db;
font-size: 4em;
font-weight: 600;
}

h4.centered	{
  position: absolute;
  top: 65%;
  left: 40%;
color: #e4e2db;
font-size: 2.5em;
}

h3	{
color: #c28350;	
text-align: center;
padding: 10px 100px 15px; 
margin: 0;
font-weight: 300;
font-size: 28px;
}

h3.left{
color: #5e5b52;
text-align: left;
font-size: 1.3em;
font-weight: 400;
}
h3.bold{
font-weight: 600;
font-size: 25px;
}

h4{
color: #c28350;
font-size: 1.2em;
text-align: left;
font-weight: 600;	
padding-top: 15px;
margin: 0;
}

ul li{
	text-align: left;
  list-style-type: circle;	
  margin-left: 20px;
  line-height: 30px;
 font-size: 17px;
letter-spacing: 1px; 
}

#info img	{
margin: 0 auto;
outline: none;
max-width: 100%;
height: auto;	
border: 10px solid #fff;
}

#info img.blank	{
border: none;
}

.col.span_1_of_2 img	{
margin: 0 auto;	
outline: none;
max-width: 100%;
height: auto;	
border: 10px solid #fff;
}

.col.span_1_of_4 img	{
border: 10px solid #e5e5e5;	
}

h3 strong	{
color: #8f9c00;
}

h5	{
margin: 0;
padding-top: 20px;
font-size: 130%;
font-weight: 400;
}
h6{
margin: 25px 0;
font-weight: normal;
font-size: 100%;
text-align: center;
}

hr	{
border: 0;
width: 50%;
background: #fff; 
height: 2px;
margin: 20px auto;
}

#header	{
position: fixed;
top: 0;
z-index: 200;
text-align: center;
width: 100%;
background: #fff;
border-bottom: 3px solid #e4e2db;
}

#intro	{
padding: 2em 0 1em;
}

#quote	{
padding: 0em  1em 0;
}

#about	{
padding: 1% 0;
background: #F6F6F4;
}

#box {	
width: 70%;
    display: -webkit-flex; /* Safari */
    display: flex;
	 margin: 0.5em auto 0.5em;
}	 

#box div{
    -webkit-flex: 1;  /* Safari 6.1+ */
    -ms-flex: 1;  /* IE 10 */    
    flex: 1;
	margin: 0 0.8%;
}

#box div{
text-align: center;
padding: 0 1%;
}

#footer	{
background: #e4e2db;
padding: 3em 0 3em 0;
margin: 0em auto 0;
border-top: 10px solid #fff;
}

#footer p, #footer ul li, #footer h3	{
font-weight: 400;
text-align: center;
padding: 0;
margin: 0;
color: #5e5b52;
padding: 5px 0;
}

#footer ul li {
list-style-type: none;	
}

#footer p a	{
font-size: 18px;
color: #5e5b52;
-webkit-transition: padding-left 0.5s; /* Safari */
transition: padding-left 0.5s;
padding-bottom: 15px;	
}

#footer ul li a	{
color:#5e5b52; 
-webkit-transition: padding-left 0.5s; /* Safari */
transition: padding-left 0.5s;	
font-weight: 400;
}

#footer ul li a:hover, #footer p a:hover,#footer .col h6 a:hover 	{
padding-left: 10px;
}

/*Back to top button*/
#back-top {
	position: fixed;
	bottom: 0%;
	right: 4%;
}

#back-top a {opacity: 0.8;
	width: 2.0em;
	display: block;
	text-align: center;
	text-decoration: none;
	color: #bbb;
	/* background color transition */
}

#back-top a:hover {
opacity: 1.0;
}

/* arrow icon (span tag) */
#back-top span {border: 0.1em solid #fff;
	width: 3.5em;
	height: 3.5em;
	display: block;
	background:  #b36525 url(../img/up-arrow2.png) no-repeat center center;
}

/*Media queries*/
@media only screen and (max-width: 1600px) {
h2.centered	{
  position: absolute;
  top: 25%;
  left: 10%;
color: #e4e2db;
font-size: 3.5em;
font-weight: 600;
}

h4.centered	{
  position: absolute;
  top: 40%;
  left: 45%;
color: #e4e2db;
font-size: 2.5em;
}
p.dist	{
padding-top: 11%;
}
}

@media only screen and (max-width: 1440px) {
#box {	
width: 80%;
    -webkit-flex: 1;  /* Safari 6.1+ */
    -ms-flex: 1;  /* IE 10 */    
    flex: 1;
	 margin: 0.5em auto 0em;
}
p.dist	{
padding-top: 11%;
}
}

@media only screen and (max-width: 1280px) {
h4.centered	{
  position: absolute;
  top: 43%;
  left: 45%;
color: #e4e2db;
font-size: 2em;
}	
#box {	
width: 80%;
    -webkit-flex: 1;  /* Safari 6.1+ */
    -ms-flex: 1;  /* IE 10 */    
    flex: 1;
	 margin: 0 auto;
}
p.dist	{
padding-top: 12.5%;
}
}

@media only screen and (max-width: 1194px) {
p.center	{
font-size: 18px;
}
h2.centered {
  position: absolute;
  top: 20%;
  left: 10%;
  color: #e4e2db;
  font-size: 3.0em;
  font-weight: 600;
}
h4.centered {
  position: absolute;
  top: 35%;
  left: 45%;
  color: #e4e2db;
  font-size: 2em;
}
h3{
font-size: 23px;	
}
p.dist	{
padding-top: 20%;
}
}

@media only screen and (max-width: 1180px) {
p.dist	{
padding-top: 20%;
}
}

@media only screen and (max-width: 1080px) {
p.dist	{
padding-top: 14.5%;
}
}

@media only screen and (max-width: 1024px) {
#box {	
width: 90%;
    -webkit-flex: 1;  /* Safari 6.1+ */
    -ms-flex: 1;  /* IE 10 */    
    flex: 1;
	 margin: 0 auto;
}
p.center	{
font-size: 17px;
}
.fa {
 font-size: 1.8em; 
}
#header h1{
text-align: left;
}
h2.centered	{
	padding-top: 20px;
	color: #ddc988;
	text-align: center;
  position: static;
font-size: 1.5em;
}

h4.centered	{
	color: #ddc988;	
	text-align: center;	
 position: static;
font-size: 1.4em;
padding-top: 10px;
}
h1 a {
  line-height: 1.6em;
  text-align: left;
  margin: 0;
  padding: 0px 2% 0;
  font-size: 35px;
  font-weight: 600;
}
p.dist	{
padding-top: 20.5%;
}
}

@media only screen and (max-width: 846px) {
p.center {
  margin: 3em 1em;
  padding: 5px;
}
}

@media only screen and (max-width: 768px) {
#popup-mobile {
  background:#fff;
  position:absolute;
  width:300px;
  right: 30px;
  top: 222px;
  padding:20px 10px;
  font-size: 14px;
  border-width:2px;
  border-style:solid;
  border-color:#c0814e;
  z-index:20000; 
}	
#header h1	{
text-align: center;
}	
i.fa.fa-phone, i.fa.fa-envelope-o	{
margin-right: 0px;	
}

i.fa.fa-envelope-o	{
margin-bottom: 25px;
}

h1.slideInUp, p.slideInUp	{
padding: 0px 1% 0;	
}
#box {
width: 90%;
    display: block;/* Safari */
    display: block;

}
#box div{
    -webkit-flex: none;  /* Safari 6.1+ */
    -ms-flex:none;  /* IE 10 */    
    flex: none;
		margin: 1%;
}
#box div{
border: none;
padding: 0%;
}
#contact	{
padding:  0 0em;
}
#header	{
position: static;
height: auto;
text-align: center;
}
#header p {
text-align: center;
color: #005544;	
padding-top: 0px;
margin: 0;
}
#header ul	{
padding: 0 0px;
}
h5{
padding-top: 0px	
}
p	{
font-size: 110%;
}
#back-top span {
	width: 3.0em;
	height: 3.0em;
}
p.center {
  margin: 1em 1em;
  padding: 5px;
}
p.dist	{
padding-top: 0%;
}
h3 {
  color: #c28350;
  text-align: center;
  padding: 10px 15px 15px;
  margin: 0;
  font-weight: 300;
  font-size: 25px;
}
}

@media only screen and (max-width: 450px) {
#header h1	{
padding: 0px 2%;
font-size: 30px;
text-align: center;
}
#back-top span {
	width: 2.8em;
	height: 2.8em;
}

}


@media only screen and (max-width: 360px) {
#header h1 a	{
font-size: 30px;
}
}