/*
=======================================================================================================================
 Styles
=======================================================================================================================
*/

* {
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	}

body {
	font-family: "Open sans", sans-serif;
	background: #f6f6f6 url("../images/bg_title1.jpg") center top no-repeat;
	background-attachment: fixed;
	background-size:cover;
	font-size: 16px;
	line-height: 27px;
	font-weight: 300;
	color: #666;
	padding: 0;
	margin: 0;
	}

h1, h2, h3, h4 {
	font-weight: 300;
	padding: 10px 0 15px 0;
	margin: 0;
	}
	
h2 {font-size: 25px; line-height: 25px; color: #8f9259;}
h3 {font-size: 18px; line-height: 25px; color: #666;}
h4 {font-size: 18px; line-height: 25px; color: #8f9259;}

p {
	font-weight: 300;
	padding: 10px 0;
	margin: 0;
	}

a:link, a:visited { text-decoration: none; color: #8f9259;}
a:hover, a:active { text-decoration: none; color: #ff0000;}

ul, ol { margin: 0; padding: 0; }
li { margin: 0; padding: 0; }

ul.circlelist { margin: 10px 0 15px 0; padding: 0;}
ul.circlelist li {list-style: none; background: url(../images/list_circle.png) no-repeat left 7px; padding: 0 0 0 18px; margin: 5px 0;}

.color {color: #62aaa6;}
.bold {font-weight: bold;}
.rel {position: relative;}

#insta {
	position:absolute;
	display:inline-block;
	right: 20px;
	top: 20px;
	z-index: 100;
	overflow:hidden;
	}	

#insta img {max-width: 50px; height: auto;}

.padding-textbox {padding: 50px 60px 70px 60px; background-color: #f9f9f9;}
.padding-footertextbox {padding: 40px 60px 60px 60px; }
.padding-ftextbox {padding: 50px 60px 70px 60px; background-color: #f0f2e4;}

.bildtext_right {position: absolute; bottom: 10px; right: 10px; background-color: #8f9259; font-size: 21px; color: #fff; padding: 12px 15px; z-index: 100}
.bildtext_left {position: absolute; bottom: 10px; left: 10px; background-color: #8f9259; font-size: 21px; color: #fff; padding: 12px 15px; z-index: 100}

.bg_white {background-color: #fff;}

.bg_darkgreen {background-color: #808350;}
.bg_green {background-color: #8f9259;}
.bg_darkergreen {background-color: #63653e;}

hr { border: 0; border-bottom: 1px solid #eee; height: 1px; margin: 20px 0 20px 0; padding: 0; clear: both;}

a[href^="tel"]:link,
a[href^="tel"]:visited,
a[href^="tel"]:hover {text-decoration: none; cursor:default;}

/* Lightbox Over */

.entry-thumb {float: left; margin: 0 0 0 0; padding: 0;}
.entry-thumb a, .entry-thumb img {display: block;}
.entry-thumb a {position: relative; /* sets the initial position for the thumbnail overlay */ }
.entry-thumb img {padding: 0; background: #fff; margin: 0 ; border: 0;}
.entry-thumb span.overlay {display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; filter: Alpha(opacity=0); /* IE */ background: #FFF no-repeat center center;}
.entry-thumb span.overlay.image {background-image: url(../images/zoom-image.png);}

/* Box buttons */

.box_link_btn {display: inline-block; margin: 10px 0 10px 0; }
	.link_btn {display:inline-block; font-size: 15px; color: #666; text-decoration: none; border: 1px solid #8f9259; padding: 10px 17px 10px 17px;}
		.link_btn:link, .link_btn:visited {color: #666; border: 1px solid #8f9259; text-decoration: none;}
		.link_btn:active, .link_btn:hover {color: #fff; border: 1px solid #8f9259; text-decoration: none; background: #8f9259;}

/* Icons H2 	

h2.icon_gartenbau, h2.icon_renaturierung, h2.icon_team { position: relative; padding-left: 42px; }
h2.icon_gartenbau:before, h2.icon_renaturierung:before, h2.icon_team:before { content: ''; width: 35px; height: 35px; background-size: 100% auto; background-position: left top; background-repeat: no-repeat; position: absolute; left: 0;  top: 6px; }

h2.icon_gartenbau:before { background-image: url("../images/icon_gartenbau.png"); }
h2.icon_renaturierung:before { background-image: url("../images/icon_renaturierung.png"); }
h2.icon_team:before { background-image: url("../images/icon_team.png"); }

*/

/* ===== Bildbox und Mouseover ====== */

.col.pf { position:relative; }

.home_overlay {
	position: absolute;
	left:0;	right:0; bottom:0; top:0; 
	background:rgba(173,181,103,0.7);
	text-align:center;
	opacity:0;
	-webkit-transition: opacity .5s ease;
	-moz-transition: opacity .5s ease;
	}

.pf:hover .home_overlay {
	opacity:1;
	}

.overlay_plus {
	position:absolute;
	display:block;
	top:50%;
	left:0;
	right:0;
	text-align:center;
	font-size:150px;
	line-height: 150px;
	color:rgba(255,255,255,.85);
	transform: translate(0,-50%);
	-webkit-transform: translate(0,-50%);
	-moz-transform: translate(0,-50%);
	padding: 0;
	overflow: hidden;
	}
		
/*
=======================================================================================================================
  PAGE STYLES
=======================================================================================================================
*/

/* ===== Banner ====== */

.banner {background-color: #fff; margin: 25px auto 0 auto;}

.banner_logo {
	position: relative;
	text-align: left;
	padding: 25px 0 25px;
	margin: 0;
	}
	
	.banner_logo img {
		max-width: 350px;
		margin: 0;
		}	

.banner_menu {
	height: 55px;
	background-color: #f4f4f4;
	padding: 0;
	margin: 0 auto;
	text-align: left;
	}

.padding-logo {padding: 0 0 0 60px;}
.padding-menu {padding: 0 60px 0 0;}

/* ===== Slider ====== */
						 
#wrapper_slider {
	background: #fff;
	max-width: 1250px;
	padding: 0;
	margin: 0 auto 0 auto;
	}	

/* ===== Content ====== */

.content {background-color: #fff; margin: 0 auto 0 auto;}

/* ===== Footer ====== */

.footer {background-color: #fff; margin: 0 auto 25px auto;}

.footer h3 {font-size: 20px; line-height: 25px; color: #fff; padding: 10px 0 15px 0;}
.footer h3::after {border-bottom: 1px solid #fff; content: ""; display: block; margin-top: 9px; width: 50px; opacity: 0.3;}

.footer p { font-size: 15px; color: #fff; line-height: 24px; }

.footer .box_link_btn {display: inline-block; margin: 10px 10px 0 0;}
.footer .link_btn {display:inline-block; font-size: 15px; color: #fff; text-decoration: none; border: 1px solid #8f9259; padding: 10px 20px 10px 20px;}
.footer .link_btn:link, .footer .link_btn:visited {color: #fff; border: 1px solid #8f9259; text-decoration: none;}
.footer .link_btn:active, .footer .link_btn:hover {color: #fff; border: 1px solid #8f9259; text-decoration: none; background: #8f9259;}

.logo_galabau {max-width: 80px; height: auto; float: left; border: 1px solid #8f9259; padding: 10px; margin: 5px 15px 5px 0;}

.bottom { background-color: #2e2e2e; margin: 0 auto 0 auto; padding: 25px 60px;}


/*
=======================================================================================================================
  Media Queries
=======================================================================================================================
*/
	
/* Tablet Portrait (devices and browsers)
====================================================================== */
@media only screen and (min-width: 801px) and (max-width: 1024px) {

.padding-textbox {padding: 20px 30px 30px 30px;}
.padding-footertextbox {padding: 30px 30px 40px 30px; }
.padding-ftextbox {padding: 20px 30px 50px 30px; background-color: #f0f2e4;}
.bottom { background-color: #333; margin: 0 auto 0 auto; padding: 25px 30px;}
	
}

/* All Mobile Sizes (devices and browser)
====================================================================== */
@media only screen and (min-width: 481px) and (max-width: 800px) {

.col.mb10 { margin-bottom: 10px;}

.padding-textbox {padding: 20px 30px 30px 30px;}
.padding-footertextbox {padding: 30px 30px 30px 30px; }
.padding-ftextbox {padding: 20px 30px 40px 30px; background-color: #f0f2e4;}
.bottom { background-color: #333; margin: 0 auto 0 auto; padding: 25px 30px;}

.bildtext_right {position: absolute; bottom: 10px; right: 10px; background-color: #8f9259; font-size: 17px; color: #fff; padding: 12px 15px; z-index: 100}
.bildtext_left {position: absolute; bottom: 10px; left: 10px; background-color: #8f9259; font-size: 17px; color: #fff; padding: 12px 15px; z-index: 100}


/* ===== Banner ====== */

.banner {background-color: #fff; margin: 15px auto 0 auto;}
.banner_logo {
	position: relative;
	text-align: center;
	padding: 10px 0 15px 0;
	margin: 0 auto;
	}
	
	.banner_logo img {
		max-width: 300px;
		margin: 0 auto;
		}	

.banner_menu {
	height: 55px;
	background-color: #f4f4f4;
	padding: 0;
	margin: 0 auto;
	text-align: left;
	}

.padding-logo {padding: 0;}
.padding-menu {padding: 0;}

}

/* Handy only (devices and browser)
====================================================================== */
@media only screen and (min-width: 321px) and (max-width: 480px) {
	
.col.mb10 { margin-bottom: 10px;}

.padding-textbox {padding: 15px 15px 25px 15px;}
.padding-footertextbox {padding: 25px 15px 30px 15px; }
.padding-ftextbox {padding: 20px 15px 25px 15px; background-color: #f0f2e4;}
.bottom { background-color: #333; margin: 0 auto 0 auto; padding: 15px 15px;}

.bildtext_right {position: absolute; bottom: 10px; right: 10px; background-color: #8f9259; font-size: 17px; color: #fff; padding: 12px 15px; z-index: 100}
.bildtext_left {position: absolute; bottom: 10px; left: 10px; background-color: #8f9259; font-size: 17px; color: #fff; padding: 12px 15px; z-index: 100}

/* ===== Banner ====== */

.banner {background-color: #fff; margin: 15px auto 0 auto;}

.banner_logo {
	position: relative;
	text-align: center;
	padding: 10px 20px 15px 20px;
	margin: 0 auto;
	}
	
	.banner_logo img {
		max-width: 220px;
		margin: 0 auto;
		}	

.banner_menu {
	height: 55px;
	background-color: #f4f4f4;
	padding: 0;
	margin: 0 auto;
	text-align: left;
	}

.padding-logo {padding: 0;}
.padding-menu {padding: 0;}

}

/* Handy only (devices and browser)
====================================================================== */
@media only screen and (max-width: 320px) {

.col.mb10 { margin-bottom: 10px;}

.padding-textbox {padding: 15px 15px 25px 15px;}
.padding-footertextbox {padding: 15px 15px 25px 15px; }
.padding-ftextbox {padding: 15px 15px 25px 15px; background-color: #f0f2e4;}
.bottom { background-color: #333; margin: 0 auto 0 auto; padding: 15px 15px;}

.bildtext_right {position: absolute; bottom: 10px; right: 10px; background-color: #8f9259; font-size: 17px; color: #fff; padding: 12px 15px; z-index: 100}
.bildtext_left {position: absolute; bottom: 10px; left: 10px; background-color: #8f9259; font-size: 17px; color: #fff; padding: 12px 15px; z-index: 100}

/* ===== Banner ====== */

.banner {background-color: #fff; margin: 15px auto 0 auto;}

.banner_logo {
	position: relative;
	text-align: center;
	padding: 15px 20px 15px 20px;
	margin: 0 auto;
	}
	
	.banner_logo img {
		max-width: 180px;
		margin: 0 auto;
		}	

.banner_menu {
	height: 55px;
	background-color: #f4f4f4;
	padding: 0;
	margin: 0 auto;
	text-align: left;
	}

.padding-logo {padding: 0;}
.padding-menu {padding: 0;}

}