* { margin: 0; padding: 0; }
body { font: 75%/1.5 Arial, Helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-size: 1em; }
ul { list-style: none; }
table { border: 0; border-collapse: collapse; }
th, td { text-align: left; }
fieldset { border: 0; }
input, textarea, button { font: 1em/1.5 Arial, Helvetica, sans-serif; }
img, object, embed { display: block; border: 0; outline: none; }
a { text-decoration: none; }

.nowrap { white-space: nowrap; }
.full { float: left; width: 100%; }
.preloader { padding-left: 24px; background: url(../img/preloader.gif) no-repeat left top; }

body { background: #ffffff; }
body, a { color: #000000; }

#page {
	width: 920px;
	margin: 4px auto;
	padding: 14px;
}
.js #page {
	background: url(../img/bg_schatten.png) no-repeat;
}
	.js #main {
		position: relative;
		width: 920px;
		height: 570px;
		overflow: hidden;
	}
		.js #stage,
		.js #content {
			position: absolute;
			left: 0;
			top: 0;
		}
			.js #layers,
			.js #popups {
				position: absolute;
				left: 0;
				top: 0;
			}
				.js .layer,
				.popup,
				#menu {
					float: left;
					display: none;
					position: absolute;
				}
				#recommend,
				#impressum {
					display: none;
				}
				.layer {
					float: left;
					width: 572px;
					margin-bottom: 25px;
				}
				.js .layer {
					left: 281px;
					top: 95px;
					width: 611px;
					height: 432px;
					margin-bottom: 0;
					background: url(../img/layer.png) no-repeat;
				}
				.js .popup {
					width: 241px;
					padding: 0 0 18px 11px;
					background: url(../img/layer_over_bottom.png) no-repeat center bottom;
				}
				.js #menu {
					left: 11px;
					top: 95px;
					width: 240px;
					height: 452px;
					background: url(../img/layer-menu.png) no-repeat;
				}
				.js #content .show { display: block; }
					.js .layer .title,
					.js .popup .title,
					.js #menu .title {
						float: left;
						position: relative;
					}
					.js .layer .title,
					.js #menu .title {
						width: 100%;
						height: 42px;
						margin-bottom: 20px;
					}
					.js .popup .title {
						width: 241px;
						height: 40px;
						background: url(../img/layer_over_top.png) no-repeat;
					}
						.layer .title h2 {
							font-size: 14px;
							margin-bottom: 10px;
						}
						.js .layer .title h2,
						.js .popup .title h2,
						.js #menu .title h2 {
							position: absolute;
							left: 10px;
							height: 15px;
							margin-bottom: 0;
							background-repeat: no-repeat;
							color: #ffffff;
							line-height: 1em;
							cursor: default;
						}
						.js .layer .title h2,
						.js #menu .title h2 {
							top: 20px;
							width: 500px;
						}
						.js .popup .title h2 {
							top: 5px;
							width: 230px;
						}
						.js #menu .title h2 {
							width: 220px;
						}
						.layer .title h3 {
							font-size: 11px;
						}
						.js .layer .title h3 {
							position: absolute;
							left: 10px;
							top: 7px;
							width: 500px;
							height: 12px;
							background-repeat: no-repeat;
							color: #ffffff;
							line-height: 1em;
							cursor: default;
						}
						.js .layer .close,
						.js .layer .print,
						.js #menu .close,
						.js #menu .print {
							position: absolute;
							background-repeat: no-repeat;
							cursor: pointer;
						}
						.js .layer .close,
						.js #menu .close {
							top: 8px;
							right: 10px;
							height: 10px;
							background-image: url(../img/schliessen.gif);
						}
						.js .layer .close {
							width: 64px;
						}
						.js #menu .close {
							width: 62px;
							background-image: url(../img/schliessen-menu.gif);
						}
						.js .layer .close:hover {
							background-image: url(../img/schliessen-over.gif);
						}
						.js #menu .close:hover {
							background-image: url(../img/schliessen-menu-over.gif);
						}
						.js .layer .print {
							top: 7px;
							right: 80px;
							width: 65px;
							height: 11px;
							background-image: url(../img/drucken.gif);
						}
						.js #menu .print {
							display: none;
						}
						.js .layer .print:hover {
							background-image: url(../img/drucken-over.gif);
						}
					.js .layer .body,
					.js .popup .body,
					.js #menu .body {
						float: left;
						padding: 0 10px;
					}
					.js .layer .body {
						font-size: 11px;
					}
					.js .layer .body {
						width: 591px;
						height: 360px;
						overflow: auto;
					}
					.js .popup .body {
						width: 221px;
						padding-bottom: 10px;
						background: url(../img/layer_over_center.png) repeat-y;
						color: #656565;
					}
						.layer .content {
							width: 572px;
						}
							.js .popup .body li {
								padding-left: 10px;
								background: url(../img/pfeil.gif) no-repeat 0 0.4em;
								cursor: pointer;
							}
							.js .popup .body .over {
								color: #3aab39;
							}
					.js #menu .body {
						width: 220px;
						height: 380px;
						margin: 0 10px;
						overflow: hidden;
						color: #656565;
						font-size: 11px;
					}
						.js #menu ul {
							margin-bottom: 5px;
						}
							.js #menu .body li {
								margin-bottom: 5px;
								padding-left: 10px;
								background: url(../img/pfeil.gif) no-repeat 0 0.4em;
								cursor: pointer;
							}
							.js #menu .body .over {
								color: #3aab39;
							}
							.js #menu .body .active {
								color: #3aab39;
								font-weight: bold;
							}
								.js #menu ul ul {
									display: none;
									margin-top: 5px;
								}
								.js #menu ul .open {
									display: block;
								}
									.js #menu .body li li {
										margin-bottom: 0;
									}
									.js #menu .body li li a:focus {
										outline: 0;
									}
									.js #menu .body .over li a {
										color: #656565;
									}
									.js #menu .body .active li a {
										color: #656565;
										font-weight: normal;
									}
									.js #menu .body .over .over a,
									.js #menu .body .active .active a {
										color: #3aab39;
									}
									
					.layer .insert {
						float: left;
						width: 100%;
					}
					#rasenmaeher .insert {
						display: none;
					}
					.js #rasenmaeher .insert {
						display: block;
					}
						.insert .image,
						.insert .steps {
							float: left;
							width: 276px;
							margin-right: -291px;
						}
						#rasen-atmet-auf .insert .image {
							width: 364px;
							margin-right: -379px;
						}
						#motor-kreislauf .insert .image {
							padding-bottom: 12px;
						}
						#rasen-atmet-auf .insert .image {
							padding-bottom: 20px;
						}
						#richtige-mischung .insert .image img,
						#das-mulchen .insert .image img,
						#mulchen-perfektion .insert .image img,
						#aussaat-mischung .insert .image img,
						#nachhaltigkeit .insert .image img {
							margin-bottom: 12px;
						}
					#maehen-mit-grasfangkorb,
					#mulch-maehen {
						float: left;
					}
					#maehen-mit-grasfangkorb {
						margin-right: 15px;
					}
							.insert .stepper {
								width: 100%;
								height: 24px;
								margin: 170px 0 -194px;
								line-height: 24px;
								background: #f2f2f2;
								text-align: center;
							}
								.insert .stepper .prev,
								.insert .stepper .next {
									width: 24px;
									height: 24px;
									background: no-repeat center;
									cursor: pointer;
								}
								.insert .stepper .prev {
									float: left;
									background-image: url(../img/pfeil-l.gif);
								}
								.insert .stepper .next {
									float: right;
									background-image: url(../img/pfeil.gif);
								}
								.insert .stepper ul {
									display: inline;
								}
									.insert .stepper li {
										display: inline;
										padding: 0 0.5em;
										cursor: pointer;
									}
									.insert .stepper .over,
									.insert .stepper .active {
										color: #3aab39;
									}
									.insert .stepper .active {
										font-weight: bold;
									}
							.js .insert .step {
								display: none;
							}
							.js .insert .steps .show {
								display: block;
							}
								.js .content .insert .step img {
									margin-bottom: 30px;
								}
						.insert .text {
							float: left;
							margin-left: 291px;
						}
						#rasen-atmet-auf .insert .text {
							margin-left: 379px;
						}
					.layer .content h6 {
						margin-bottom: 12px;
						font-weight: normal;
					}
					#welcome h4,
					#rasenschnitt-naehrstoff h4 {
						margin-bottom: 12px;
					}
					#mulchen-perfektion h5 {
						color: #3aab39;
					}
					#die-richtige-wahl h4.replaced {
						float: left;
						width: 100%;
						height: 14px;
						padding-bottom: 5px;
						background: url(../img/auswahlhilfe-haecksler.gif) no-repeat left top;
						text-indent: -9000px;
					}
					.layer .panels h4,
					.layer .content ul,
					.layer .content p,
					.layer .content img,
					.layer .content object {
						padding-bottom: 12px;
					}
					#welcome .content img {
						padding-bottom: 0;
					}
						#natuerlicher-kreislauf .content a {
							padding-left: 10px;
							background: url(../img/pfeil.gif) no-repeat 0 0.4em;
							color: #656565;
							font-weight: bold;
						}
						#natuerlicher-kreislauf .content a:hover {
							color: #3aab39;
						}
					.js .layer .content img,
					.js .layer .content object {
						margin-bottom: 0;
					}
						#welcome .enter {
							display: none;
						}
						.js #welcome .enter {
							float: left;
							display: inline;
							cursor: pointer;
						}
						.layer .ticks li,
						#maehen-mit-grasfangkorb p {
							padding-left: 35px;
							background: url(../img/icon-haken.gif) no-repeat 15px 0.3em;
						}
						#mulch-maehen .ticks li,
						#maehen-mit-grasfangkorb p {
							background-image: url(../img/icon-haken-grau.gif);
						}
							#mulchen-duengung .content li img {
								float: right;
							}
						.layer .tipp .ticks li {
							padding-left: 45px;
							background-position: 25px 0.3em;
						}
					.layer .content dl {
						float: left;
						width: 100%;
					}
						.layer .content dt {
							float: left;
							width: 112px;
							font-weight: bold;
						}
						.layer .content dd {
							float: left;
							width: 460px;
							margin-bottom: 6px;
						}
						#rasenschnitt-naehrstoff .content dt,
						#rasenschnitt-naehrstoff .content dd {
							height: 45px;
							line-height: 45px;
						}
						#rasenschnitt-naehrstoff .content dt {
							padding-left: 60px;
							background: no-repeat 1px center;
						}
						#rasenschnitt-naehrstoff .content .stickstoff { background-image: url(../img/icon-stickstoff.gif); }
						#rasenschnitt-naehrstoff .content .phosphor { background-image: url(../img/icon-phosphor.gif); background-position: 0 center; }
						#rasenschnitt-naehrstoff .content .kalium { background-image: url(../img/icon-kalium.gif); }
						#rasenschnitt-naehrstoff .content dd {
							width: 400px;
						}
					.layer .panels {
						width: 572px;
					}
						.panels .panel {
							width: 100%;
						}
						.js .panels .panel {
							display: none;
						}
							.panel .image {
								float: left;
								width: 100%;
								margin-bottom: 12px;
							}
								.panel .image img {
									float: left;
								}
								.js .panels .prev,
								.js .panels .next {
									float: left;
									width: 30px;
									height: 170px;
									background: no-repeat;
									outline: none;
								}
								.js .panels .prev {
									margin-left: -572px;
									background-image: url(../img/bildwechsel-links.png);
								}
								.js .panels .prev:hover { background-image: url(../img/bildwechsel-links-over.png); }
								.js .panels .next {
									margin-left: -30px;
									background: url(../img/bildwechsel-rechts.png);
								}
								.js .panels .next:hover { background-image: url(../img/bildwechsel-rechts-over.png); }
					.layer .tipp {
						float: left;
						width: 100%;
						margin-bottom: 12px;
						border-bottom: 1px solid #3aab39;
					}
					#help .tipp {
						border-bottom: 0;
					}
						.layer .tipp h4,
						.layer .tipp h5,
						.layer .tipp p {
							padding-left: 45px;
						}
						.layer .tipp h4 {
							height: 20px;
							margin-bottom: 10px;
							padding-top: 15px;
							background: url(../img/icon-tipp.gif) no-repeat;
							border-bottom: 1px solid #3aab39;
							line-height: 20px;
						}
						#natuerlicher-kreislauf .tipp ul {
							float: left;
							width: 49%;
						}
						#natuerlicher-kreislauf .tipp p {
							float: left;
							width: 100%;
							padding-left: 0;
						}
					.layer .content table {
						float: left;
						width: 100%;
					}
						.layer .content thead tr,
						.layer .content tbody .alt {
							background: #f2f2f2;
						}
							.layer .content thead th {
								border-bottom: 1px solid #656565;
							}
							#richtige-mischung thead th {
								padding-left: 20px;
								background: left center no-repeat;
							}
							#richtige-mischung .schaufel { background-image: url(../img/icon-schaufel.gif); }
							#richtige-mischung .wiesenrispe { padding-left: 40px; background-image: url(../img/icon-wiesenrispe.gif); }
							#richtige-mischung .rotschwingel { background-image: url(../img/icon-rotschwingel.gif); }
							#richtige-mischung .weidelgras { background-image: url(../img/icon-weidelgras.gif); }
							.layer .content th,
							.layer .content td {
								padding: 2px;
							}
							.layer .content thead th {
								font-weight: normal;
							}
						.layer .content tbody tr {
							background: #ffffff;
						}
					.layer .consultant {
						float: left;
						width: 100%;
					}
					.js .layer .dynamic,
					.layer .result {
						display: none;
					}
					.js .layer .success,
					.js .layer .result {
						display: block;
					}
						.layer .result .success,
						.layer .result .error {
							display: none;
						}
						.js .layer .success .success,
						.js .layer .error .error {
							display: block;
						}
						.layer .dynamic .switch,
						.layer .consultant .switch {
							display: none;
						}
						.js .layer .dynamic .switch,
						.js .layer .consultant .switch {
							display: block;
						}
							.js .dynamic .switch a,
							.js .consultant .switch a {
								padding-left: 10px;
								background: url(../img/pfeil.gif) no-repeat 0 0.4em;
								color: #656565;
								font-weight: bold;
							}
							.js .consultant .switch .off {
								background-image: url(../img/pfeil-l.gif);
							}
							.js .dynamic .switch a:hover,
							.js .consultant .switch a:hover {
								color: #3aab39;
							}
							.js .consultant .switch .off,
							.js .on .switch .on {
								display: none;
							}
							.js .on .switch .off {
								display: inline;
							}
						.consultant .icons {
							float: left;
							width: 556px;
							height: 20px;
							margin: 0 -4px 15px;
							padding: 12px;
							background: url(../img/berater-legende.png) no-repeat center;
						}
							.consultant .icons ul {
								width: auto;
								margin: 0;
							}
								#rasenmaeher .consultant .icons li,
								#rasentraktoren .consultant .icons li {
									width: auto;
									height: 20px;
									margin: 0;
									padding: 0 20px 0 25px;
									background-repeat: no-repeat;
									background-position: left top;
									border: 0;
									line-height: 20px;
									font-weight: bold;
								}
						.js .consultant .icons {
							display: none;
						}
						.js .on .icons {
							display: block;
						}
						#rasentraktoren .consultant .icons {
							display: block;
						}
							#rasenmaeher .consultant .icons li {
								display: block;
							}
						.consultant .no-result {
							display: none;
						}
						#rasenmaeher .no-e .no-e,
						#rasenmaeher .no-b .no-b {
							display: block;
						}
							.consultant .no-result a {
								padding-left: 10px;
								background: url(../img/pfeil.gif) no-repeat 0 0.4em;
								color: #656565;
								font-weight: bold;
							}
							.consultant .no-result a:hover {
								color: #3aab39;
							}
						.consultant ul {
							float: left;
							width: 592px;
							margin: 0 -10px;
						}
						.js .consultant ul {
							display: none;
						}
						.js .on ul,
						#rasentraktoren .consultant ul {
							display: block;
						}
							.consultant li {
								float: left;
								margin: 0 10px 15px;
								border: 1px solid #e2e2e2;
							}
							#rasenmaeher .consultant li { width: 126px; }
							#rasentraktoren .consultant li { width: 274px; }
							
							#rasenmaeher .consultant li {
								display: none;
							}
							#rasenmaeher .area-300 .area-800 {
								display: none;
							}
							#rasenmaeher .area-0 .area-3000,
							#rasenmaeher .area-3000 .area-3000,
							#rasenmaeher .area-0 .area-2500,
							#rasenmaeher .area-2500 .area-2500,
							#rasenmaeher .area-0 .area-1200,
							#rasenmaeher .area-1200 .area-1200,
							#rasenmaeher .area-0 .area-800,
							#rasenmaeher .area-800 .area-800,
							#rasenmaeher .area-0 .area-300,
							#rasenmaeher .area-300 .area-300 {
								display: block;
							}
							#rasenmaeher .motor-e .motor-b,
							#rasenmaeher .motor-b .motor-e {
								display: none;
							}
								.layer .consultant ul ul {
									float: none;
									width: auto;
									margin: 0;
								}
									.consultant li li {
										float: none;
										margin: 0 0 1px;
										padding: 2px 0;
										background-color: #f2f2f2;
										background-repeat: no-repeat;
										border: 0;
										line-height: 16px;
									}
									#rasenmaeher .consultant li li {
										display: block;
										width: auto;
										padding-left: 27px;
									}
									#rasentraktoren .consultant li li {
										width: auto;
										padding-left: 35px;
										background-position: 7px 0;
									}
									.consultant li .elektro,
									.consultant .icons .elektro { background-image: url(../img/berater-icon-elektro.png); }
									.consultant li .benzin,
									.consultant .icons .benzin { background-image: url(../img/berater-icon-benzin.png); }
									.consultant li .flaeche,
									.consultant .icons .flaeche { background-image: url(../img/berater-icon-flaeche.png); }
									.consultant li .schnittbreite,
									.consultant .icons .schnittbreite { background-image: url(../img/berater-icon-schnittbreite.png); }
								.consultant li a {
									display: block;
									padding: 3px 0 3px 17px;
									background: #ffffff url(../img/pfeil.gif) no-repeat 7px center;
									color: #656565;
									font-weight: bold;
								}
								.consultant li a:hover {
									color: #3aab39;
								}
					.layer .legend {
						float: left;
						width: 100%;
						padding-top: 10px;
					}
							.js .on .switch .on {
								display: none;
							}
							.js .on .switch .off {
								display: inline;
							}
						.legend ul {
							float: left;
							width: 592px;
							margin: 0 -10px;
						}
							.legend li {
								float: left;
								margin: 0 10px;
								padding-bottom: 15px;
							}
					.layer .content form {
						float: left;
					}
					#rasenmaeher form {
						width: 234px;
						height: 93px;
						margin: 0 -5px;
						padding: 39px 26px 0;
						background: url(../img/berater-start.png) no-repeat;
					}
					#recommend form {
						width: 276px;
					}
						.content fieldset {
							float: left;
							width: 100%;
						}
						#rasenmaeher fieldset {
							margin-bottom: 8px;
						}
						.content .sender,
						.content .receiver {
							width: 132px;
						}
						.content .receiver {
							float: right;
						}
							#rasenmaeher fieldset span,
							#rasenmaeher fieldset label {
								float: left;
							}
							#rasenmaeher fieldset span {
								width: 80px;
							}
							#rasenmaeher fieldset label {
							/*	width: 60px; */
							}
							#rasenmaeher .area label {
								width: 120px;
							}
							#recommend input,
							#recommend textarea {
								display: block;
								border: 1px solid #656565;
							}
							#rasenmaeher input {
								margin-right: 5px;
							}
							#recommend input {
								width: 130px;
								height: 17px;
								margin-bottom: 10px;
							}
							#recommend .alert {
								background: #ffeeee;
								border-color: #ff0000;
							}
							.content #area {
								margin: 0 5px 0 0;
								width: 50px;
								height: 15px;
								border: 1px solid #656565;
							}
							#recommend textarea {
								margin-bottom: 2px;
								width: 274px;
								height: 9em;
							}
							.content #receiverMail {
								margin-bottom: 2px;
							}
							.content .notice {
								display: block;
								color: #656565;
								font-size: 10px;
								line-height: 12px;
								margin-bottom: 10px;
							}
						.content form p {
							float: left;
							width: 100%;
						}
						#rasenmaeher form p {
							text-align: right;
						}
						#rasenmaeher #lbl_groesse {
							margin-top:16px;
							white-space:nowrap;
						}	

							.content .send {
								padding-left: 10px;
								width: 100%;
								font-weight: bold;
								color: #656565;
								text-align: left;
								background: transparent url(../img/pfeil.gif) no-repeat left center;
								border: 0;
								cursor: pointer;

							}
							.content .result a {
								padding-left: 10px;
								background: url(../img/pfeil.gif) no-repeat 0 0.4em;
								color: #656565;
								font-weight: bold;
							}
							.content .result a:hover {
								color: #3aab39;
							}
	.impressum {
		float: left;
		width: 572px;
		padding: 6px 0 11px;
		font-size: 11px;
		text-align: right;
	}
	.js .impressum {
		float: none;
		width: auto;
	}


/*Alex Flashfallback*/
#stage{
	display: none;
}
.no-flash .layer{
	display: none;
}
.no-flash #content #popups{
	display: none;
}
#welcome .flashhinweis{
	display: none;
}
.no-flash #layers #welcome{
	float: right;
	display: inline;
}
#layers.no-flash .layer{
	display: inline;
}
.no-flash #welcome .title, .no-flash #menu .title, #layers.no-flash .layer .title{
	background-color: #3aab39;
	height: 25px;
	color: #ffffff;
	padding-left: 10px;
	padding-top: 20px;
	margin-bottom: 20px;
}
	#layers.no-flash .layer .title{
		padding-top: 7px;
		height:40px;
		margin-bottom: 15px;		
	}
.no-flash #menu{
	float: left;
	display: inline;
	position: relative;
	width: 320px;
}
.no-flash #menu .body ul li{
	padding-left: 10px;
	color: #656565;
	margin-left: 0px;
	font-size: 10px;
}
.no-flash #menu .body ul li ul li a{
	color: #656565;
	background: url(../img/pfeil.gif) no-repeat 0 0.4em;
	padding-left: 10px;
	font-size: 10px;
}
#layers.no-flash .layer .body .panel{
	margin-bottom: 15px;
}
.no-flash #welcome .flashhinweis, #layers.no-flash .flashhinweis{
	display: block;
	float:left;
	margin-bottom: 25px;
	position: relative;
	left: 150px;
	padding-bottom:10px;
}
.no-flash #welcome .flashhinweis{
	top: 25px;
}
	#layers.no-flash .layer .flashhinweis a, #layers #welcome.layer .flashhinweis a{
		color: #3aab39;
	}