@charset "utf-8";
/* CSS Document */

body{font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #666; text-align:left; margin-top: 0px; margin-bottom:0px; margin-left:0px; margin-right:0px; background-color:#f4f9fa;}
.h1 {font-size: 23px; color: #336c63; text-align:left; line-height: 1.5; font-weight:bold;}
@media only screen and (max-width:1080px) {	.h1 {font-size: 34px; color: #336c63; text-align:left; line-height: 1.5; font-weight:bold;}}
.h2 {font-size: 18px; color: #336c63; text-align:left; line-height: 1.5;}
@media only screen and (max-width:1080px) {	.h2 {font-size: 24px; color: #336c63; text-align:left; line-height: 1.5;}}
.h3 {font-size: 22px; color: #FFF; text-align:left; line-height: 1.5;}
.p {font-size: 16px; color: #666; text-align:left; line-height: 1.5;}
@media only screen and (max-width:1080px) {	.p {font-size: 24px; color: #666; text-align:left; line-height: 1.5;}}
.p1 {font-size: 16px; color: #336c63; text-align:left; line-height: 1.5;}
.p2 {font-size: 16px; color: #FFF; text-align:left; line-height: 1.5;}
.p3 {font-size: 12px; color: #666; text-align:left; line-height: 1.2;}
.p4 {font-size: 24px; color: #FFF; text-align:center; line-height: 1.5;}

a:link {text-decoration: none; color:#b2dc77;} a:visited {	text-decoration: none;} a:hover {text-decoration: none; color: #b2dc77;} a:active {text-decoration: none; }

.wrapper {min-width:860px; max-width:100%; margin-top:0px; margin-left:auto; margin-right:auto; margin-bottom:0px; background-color:#FFF; -webkit-user-select:none; -moz-user-select:-moz-none; -ms-user-select:none; user-select:none; }

#logo {width:1020px; height:auto; margin-top:0px; margin-left:auto; margin-right:auto; text-align:left; background-color:transparent;}
@media only screen and (max-width:1080px) {	#logo {width:900px; height:auto; margin-top:0px; margin-left:auto; margin-right:auto; text-align:center; background-color:transparent;}}
#header {width:100%; height:auto; margin-top:100px; margin-left:0px; margin-right:0px; text-align:center; position:absolute; z-index:600; background-color:transparent;}
#bild {width:100%; height:auto; top:0px; margin-left:0px; margin-right:0px; text-align:center; position:absolute; z-index:100; background-color:#386e67;}

#landschaftspflege {width:100%; height:auto; top:300px; margin-left:0px; margin-right:0px; text-align:center; position:absolute; z-index:200; background-color: #f4f9fa; box-shadow: 0px 0px 7px grey; border-radius:10px;}
@media only screen and (max-width:1080px) {	#landschaftspflege {width:100%; height:auto; top:490px; margin-left:0px; margin-right:0px; text-align:center; position:absolute; z-index:200; background-color: #f4f9fa; box-shadow: 0px 0px 7px grey; border-radius:10px;}}
#content {width:900px; margin-top:0px; margin-left:auto; margin-right:auto; background-color: #f4f9fa; padding-left:60px; padding-right:60px; padding-top:140px; padding-bottom:30px;}
@media only screen and (max-width:1080px) {	#content {width:90%; margin-top:0px; margin-left:0px; margin-right:0px; background-color: #f4f9fa; padding-left:5%; padding-right:5%; padding-top:30px; padding-bottom:30px;}}

#leistungen {width:48%; min-height:400px; margin-top:0px; background-color: #f4f9fa; box-shadow: 0px 0px 7px silver; padding-top:0px; padding-bottom:0px; float:left; margin-bottom:30px; border-radius:10px; margin-right:3%; }
#leistungsspektrum {width:80%; padding-left:10%; padding-right:10%; padding-top:30px; padding-bottom:30px; }
#gartenbau {width:48%; height:400px; margin-top:0px; background-color:#386e67; box-shadow: 0px 0px 7px silver; padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px; float:left;  margin-bottom:30px; border-radius:10px; text-align:center;}

#footer {width:900px; height:250px; margin-top:0px; margin-left:auto; margin-right:auto; background-color: #386e67; box-shadow: 0px 0px 7px grey; padding-left:60px; padding-right:60px; padding-top:30px; padding-bottom:30px; border-radius:10px;}
@media only screen and (max-width:1080px) {	#footer {width:90%; height:250px; margin-top:0px; margin-left:0px; margin-right:0px; background-color: #386e67; box-shadow: 0px 0px 7px grey; padding-left:5%; padding-right:5%; padding-top:30px; padding-bottom:30px;}}

.footer { color: #FFF; font-size:16px; text-align:left; text-decoration: none; line-height:1.5;}
a.footer { color: #FFF; font-size:16px; text-align:left; text-decoration: none; }
a:hover.footer { color: #b2dc77; }

#info {width:28%; margin-top:0px; float:left; background-color: #386e67; padding-left:2%; padding-right:2%; }

.navigation { margin-left:0px; text-align:left; float:left; margin-left:200px; text-align:center; font-size:10px; color:#FFF; position:absolute; z-index:800;}
nav.topmenu { top:68px; height: auto; max-height:0; width:auto; max-width:0; overflow: hidden; transition: all 0.5s; margin-left:5px; padding-left:20px; padding-top:20px; padding-bottom:10px; position:absolute; z-index:800; background-color: transparent;  }  
nav.topmenu ul li a { color: #444444; text-decoration:none; display:block; font-family: Arial, Helvetica, sans-serif; line-height:1.0; padding-top:16px; padding-bottom:16px; padding-left:20px;  min-width:380px; text-align:left; }
nav.topmenu ul li { list-style-type: none; }
a.link { color: #444444; font-size:24px; text-align:left; }
@media only screen and (max-width:1080px) {	a.link { color: #444444; font-size:36px; text-align:left; margin-top:10px; }}
a:hover.link { color: #00718f; }
a.link2 { color: #444444; font-size:18px; margin-left:40px; text-align:left; }
@media only screen and (max-width:1080px) {	a.link2 { color: #444444; font-size:32px; margin-left:40px; text-align:left; margin-top:10px; }}
a:hover.link2 { color: #00718f; }
#navi, #navi ul { list-style-type:none; margin-top:10px;  float:left;} 
#navi ul ul { list-style-type:none; margin-top:0px;  float:left;}
	label.menu {display: block; background: #b2dc77; box-shadow: 0px 0px 7px #333; width: 74px; height: 68px; position: absolute; margin-left: 4px; border-radius: 1px; }
	input#menu {display:none}
	.line { position: absolute;   left:10px;   height: 5px; width: 54px;   background: #fff; border-radius: 2px;   display: block;   transition: 0.5s;   transform-origin: center; }
	.line:nth-child(1) { top: 16px; }
	.line:nth-child(2) { top: 32px; }
	.line:nth-child(3) { top: 48px; }
	#menu:checked + .menu .line:nth-child(1){   transform: translateY(16px) rotate(-45deg);}
	#menu:checked + .menu .line:nth-child(2){   opacity:0;}
	#menu:checked + .menu .line:nth-child(3){   transform: translateY(-16px) rotate(45deg);}
	#menu:checked + .menu  + nav.topmenu {   max-height: 1500px; max-width:560px; background-color:#FFFFFF; box-shadow: 0px 0px 10px grey; }