/*@font-face {
      font-family: 'fontello';
      src: url('fontello-b0275671/font/fontello.eot?64422189');
      src: url('fontello-b0275671/font/fontello.eot?64422189#iefix') format('embedded-opentype'),
           url('fontello-b0275671/font/fontello.woff?64422189') format('woff'),
           url('fontello-b0275671/font/fontello.ttf?64422189') format('truetype'),
           url('fontello-b0275671/font/fontello.svg?64422189#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }
    */
    
    html,body,div,p,h1,h2,h3,ul,ol,span,a,table,td,form,img,li,input,textarea,select {
	line-height:140%;
	margin:0;
	padding:0;
	font-size:16px;
	}
body {
	background:background: rgba(255,255,255,1.0);
  	cursor: auto;
    font-family: 'Muli', sans-serif; 
  	font-style:normal;
  	font-weight:400;
  	line-height: 1.5;
  	margin: 0;
  	padding: 0;

	}

/****** Grundstruktur ****/
.columns {
	margin: 0;
  	padding: 0;
	}
/****** Grundstruktur ****/
.expanded .columns, .untermenu .columns {
	margin: 0;
  	padding: 0;
  	border-left:4px solid #fff;
  	border-right:4px solid #fff;
  	
	}
/*****************/
#logo {
	display:block;
	margin:1.0em 0 0.5em 0;
	border:0;
	padding:0 5px;
	max-width:320px;
	float:left;
	}
.hellgrau {
	background:#e5e4d8;
	}
hellgruen {
	background:#b2b37f;
	}
.gruen {
	background:#4c9d50;
	}
.expanded{
	margin:0;
	}



.header-transparent{
	display:block;
	background: rgba(255,255,255,1.0);
  	border: none;
	padding:0;
	text-align:center;
	z-index:100;
	}

a #hinweis {
	position:absolute;
	margin-top:40px;
	right:5%;
	width:180px;
	height:180px;
	background: #4c9d50;
	border-radius: 90px 90px 90px 90px;
	-moz-border-radius: 90px 90px 90px 90px;
	-webkit-border-radius: 90px 90px 90px 90px;
	-webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
  	-webkit-transition: all 0.4s ease;
 	transition: all 0.4s ease;
	}
a:hover #hinweis {
	background: #009b6b;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
	-webkit-transition: all 0.4s ease;
 	transition: all 0.4s ease;
	}
#hinweis p {
    font-family: 'Muli', sans-serif; 
	font-weight:600;
	font-size:0.80em;
	color:#fff;
	padding:30px 6px 0 6px;
	margin:0;
	line-height:130%;
	}
#hinweis p span {
	font-size:1.2em;
	color:#fff;
	line-height:130%;
    padding:20px 6px 0 6px;
	}



#newsletteranmeldung {
    display:block;
	position:fixed;
	width:200px;
	margin:20% 0 0 auto;
	right:-200px;
	-webkit-transition: all 0.4s ease;
 	transition: all 0.4s ease;
    z-index:10000;
}

#newsletteranmeldung.active {
  right: -20px;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
    }

a.downloadbutton {
    display: inline-block;
	background: #4c9d50;
    margin:10px 40px 0 40px;
    padding:8px 20px;
    color:#fff;
    }
a.downloadbutton:hover {
    display: inline-block;
    background:#009b6b;
    margin:10px 40px 0 40px;
    padding:8px 20px;
    color:#fff;
    }


.expanded.gruen .ausfuell{
    height: 510px;
    object-fit: cover;
    object-position: center top; 
    }
/*********** Swiper Slider ***************/
.swiper {
    width: 100%;
    height: 100%;
    }

.slidergrau {
   margin-top:80px;
    }
.swiper-slide {
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:50px 0;
    }

.swiper-bild {
    width:50%;
    float:left;
    text-align:center;
    }
.swiper-bild img{
    max-width: 400px;
    padding-top: 20px;
    }
.swiper-bild img.schmal{
    max-width: 200px;
    padding-top: 20px;
    }
.swiper-text {
    width:50%;
    padding-right: 58px;
    }
.swiper-text h2{
    font-weight:700;
    font-size: 2em;
    }
.swiper-text p {
    font-weight: 700;
    font-size: 1.1em;
    }
.swiper-text p a, .swiper-text p a:visited{
    color: #009b6b;
    font-size: 100%;
    }
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background:#4c9d50;
    }
.swiper-button-next, .swiper-button-prev {
    color:#4c9d50;
    }

/**************************/

.googlemap iframe{
 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(.80); /* Google Chrome, Safari 6+ & Opera 15+ */
  -moz-filter: grayscale(50%);
  -ms-filter: grayscale(50%);
  -o-filter: grayscale(50%);
  filter: grayscale(50%);
}
/*************  2-Klick-Banner auf Google Map *************/
.googlemap {
	background-image:url(images/kluge_anfahrt.png);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center top;
    padding:0;
	}
div.privacy-msg  {
	display: grid;
	justify-content: center;
	align-items: center;
	text-align:center;
	overflow:hidden;
	}
div.privacy-msg p {
	background:#e5e4d8;
    margin-top:20%;
    padding: 15px;
	color:#56504d;
    font-family: 'Mulish', sans-serif; 
	font-weight:400;
	font-size:1.0em;
	}
.privacy-msg p a{ 
	background:#fff;
	color:#56504d;
    font-family: 'Mulish', sans-serif; 
	font-weight:600;
	font-size:1.0em;
	padding:8px;  
    text-transform:none !important;
	}
.privacy-msg p a:hover{ 
	color:#595d61 !important;
	}
/**************************/
/**********************************/

h1, .headline {
	color:#008c58;
	font-family: 'Parisienne', cursive;
	line-height:120%;
	font-size:2.8em;
	}

h2 {
	color:#4c9d50;
    font-family: 'Mulish', sans-serif; 
	font-weight:400;
	font-size:1.6em;
	}

h3 {
	color:#4c9d50;
    font-family: 'Mulish', sans-serif; 
	font-weight:400;
	font-size:1.1em;
	}


p, ul.textaufzaehl li, table{
	color:#56504d;
    font-family: 'Mulish', sans-serif; 
	font-weight:400;
	font-size:1.0em;
	font-style:normal;
	line-height:170%;
	}
.gruen h2 {
	color:#fff;
	}
.kleiner {
	font-size:0.85em;
	margin:8px;
	padding:0;
	}
table.sorttab {
	margin:45px 0;
	width:100%;
	background:#eeede6;
	}	
table.sorttab td{
	padding:3px 0 0 12px;
	margin:0;
	border-bottom:2px solid #fff;
	}	
table td.namebot{
	padding:0 12px;
	width:300px;
	vertical-align:top;
	}
table td.namedeu{
	padding:0 20p;
	vertical-align:top;
	}
table.termine{
	vertical-align:top;
	margin:20px 0 50px 40px;
	}
table.termine td{
	padding:10px 0;
	margin:0;
	border-bottom:1px solid #ccc;
	}
table.termine td.datum{
	padding:10px 10px 10px 0;
	width:110px;
	vertical-align:top;
	}
table.termine td.zeit{
	padding:10px 10px 10px 0;
	width:100px;
	vertical-align:top;
	}	
table.zeiten {
	margin:0 5px 10px 37px;	
    padding:0;
	font-weight:normal;
	}
table.zeiten th {
	padding:2px 0 2px 6px;
	text-align:left;
	}
table.zeiten td {
	width:200px;
	padding:2px 0 2px 6px;
	color:#56504d;
	vertical-align:top;
	}
table.zeiten td.first {
	width:auto;
	color: #555658;
	font-weight:bold;
	padding-right:15px;
	}
.betont {
	background:#008c58;
	color:#fff !important;
	}
.sortiment span {
	display:block;
	height:60px;
	background:#eeede6;
	padding:4px;
	color:#56504d;
	font-size:0.85em;
	font-style:normal;
	line-height:120% !important;
	}
.sortiment2 span {
	display:block;
	height:105px;
	background:#e5e4d8;
	padding:8px 6px;
	color:#56504d;
	font-size:0.85em;
	font-style:normal;
	line-height:120% !important;
	}
.sortiment img, .sortiment2 img {
	width:100%;
	}
.teamvorstellung {
    background:#e5e4d8;
    display: flex;
    justify-content: center;
    padding:6px 6px 0 6px;
    }
.teamvorstellung .person{
    display: block;
    width:200px;
    margin:6px 6px 0 6px;
    }
.teamvorstellung span {
	display:block;
	height:105px;
	background:#fff;
	padding:8px 6px;
	color:#56504d;
	font-size:0.85em;
	font-style:normal;
	line-height:120% !important;
	}
h1 {
	margin:20px 40px 2px 40px;
	}
h2 {
	margin:32px 40px 2px 40px;
	}
h3 {
	margin:20px 40px 2px 40px;
	}
p {
	margin:17px 40px 30px 40px;
	}

ul.textaufzaehl {
	margin:10px 55px 20px 55px;
	}
.footer p {
	margin:30px 35px 0 35px;
	line-height:160%;
	}

p a, h2 a, p a:visited, h2 a:visited{
	 color: #009b6b;
	text-decoration:none;
	font-size:100%;
	}
p a:hover, h2 a:hover{
	color:#000;
	}
ul.aufzaehl{
	color: #56504d;
	line-height:1.7;
	margin:4px 20px 4px 38px;
	list-style-type:square;
	}

ul.aufzaehl li {
	color: #6a6868;
	line-height:1.7;
	margin:0;
	list-style-type:square;
	padding-left:4px;
	}
#gartentipp {
	margin:20px 40px;
	}
a#facebook {
	width:160px;
	text-align:left;
	right:0 !important;
    margin:auto;
	padding:2px 0 25px 0;
	background-image: url(images/kluge_facebook.png);
    background-repeat:no-repeat;
    background-position:left 4px;
    background-size:40px 40px;
    padding-left:48px;
	color: #56504d;
	}
a#facebook:hover { 
    color:#000;
    }
table.oeffn {
	text-align:right
	right:0;
	width:100%;
	margin:10px 0;
	}
.rahmen {
	margin:40px auto;
	border-top:6px solid #e6e5e4;
	border-bottom:6px solid #e6e5e4;
	}
.newskasten {
	padding:25px 0;
	}
.newskasten h2, .newskasten h3, .newskasten ul li{
	color:#fff;
	margin:0 30px !important;
	padding:0 !important;
	}
.newskasten p {
    color:#fff;
    line-height: 130%;
	margin:8px 30px !important;
	padding:0 !important;
    }
.newskasten hr {
	border-top:5px solid #fff;
	border-bottom:none;
	background-color:none;
	height:4px
	}
.newskasten a, .newskasten a:visited {
	color:#b4ddce;
	}
.aktuell  {
	margin-bottom: 8px;
	}
.aktuell .columns {
	margin: 0;
  	padding: 0;
  	border-left:0px solid #fff !important;
  	border-right:0px solid #fff !important;
	}
.bewerbung a {
    color: #4c9d50;
    font-size:100%;
    border-bottom: 1px dotted #4c9d50; 
    }	
#mc_embed_signup {
	margin-left:25px;
	}
.aktuell img.ausfuell {
    height:410px;
    object-fit: cover;
    object-position: left top;
    }
/**************************/
.sort_head {
	width:600px;
	margin-right:0
	}
	
.sortimentdarstellung {
	display:block;
	width:50%;
	float:left;
	border:0;
	margin:0;
	}
ul.sort {
	padding:30px 10px 20px 40px;
	list-style-type:none;
	text-align:left;
	border-bottom:0;
	}
ul.sort li {
	padding-bottom:6px;
	}
ul.sort li span{
	color:#b4ddce;
    font-family: 'Mulish', sans-serif; 
	font-weight:400;
	font-size:1.1em !important;
	font-style:normal;
	}
ul.sort li a{
	font-size:1.1em !important;
	color:#fff;
	}
ul.sort li a:hover, ul.sort li#current a{
	color:#000;
	}
	
.sort_head{
	min-height:503px;
	border:1pxsolid transparent;
	}
/**************************/	
ul.sort2 {
	width:25%;
	float:left;
	padding:30px 10px 50px 40px;
	list-style-type:none;
	text-align:left;
	border-bottom:0;
	}
ul.sort2 li {
	padding-bottom:6px;
	}
ul.sort2 li span{
	color:#b4ddce;
    font-family: 'Mulish', sans-serif; 
	font-weight:400;
	font-style:normal;
	font-size:1.1em !important;
	}
ul.sort2 li a{
	font-size:1.1em !important;
	color:#fff;
	}
ul.sort2 li a:hover{
	color:#000;
	}

/**************************/
ul#shortcuts {
	display:inline-block;
	list-style-type:none;
	margin:20px 0 10px 40px;
	padding:0 10px;
	}
ul#shortcuts li{
	padding:0;
	float:left;
	}
ul#shortcuts li a{
	display:block;
	width:250px;
	padding:8px 0 0 55px;
	background-repeat:no-repeat;
	background-position:left 4px;
	background-size:18%;
	text-align:left;
	color:#4c9d50;
	font-size: 0.9em;
	}
ul#shortcuts li.standort a{
	background-image:url(images/icon_standort.png);
	}
ul#shortcuts li.telefon a{
	background-image:url(images/icon_telefon.png);
	}
ul#shortcuts li.mail a{
	background-image:url(images/icon_mail.png);
	}
ul#shortcuts li a:hover {
	color:#000;
	}
/**************************/

ul#menu {
	display:inline-block;
	list-style-type:none;
	margin:15px 0 0 0;
	padding:0 10px;

	}
ul#menu li{
	padding:0;
	float:left;
	}
ul#menu li a{
	color:#4c9d50;
    font-family: 'Mulish', sans-serif; 
	font-size: 1.2em;
	font-weight:600;
	margin:0 24px;
	padding:0 0 0 0;
	text-decoration:none;
	text-transform:uppercase;
	}
ul#menu li a:hover, ul#menu li a.current{
	color:#000;
	}
	
.submenu {
	margin:0;
	text-align:center;
	padding:0 auto;
	}
.submenu a {
	display:block;
	background:#e5e4d8;
	color:#4c9d50;
	margin:0 auto;
	padding:10px 0;
	font-size: 1.6em;
	}
.submenu a:hover, .submenu a.current {
	color:#000;
	background:#f8f8f0;
	}
.untermenu {
    margin: 8px auto 40px auto;
    }
/**********************************************/

@media only screen and (max-width: 1200px)  {

ul#menu li a{
	font-size: 1.0em;
	margin:0 12px;
	padding:0 0 15px 0;
	}
ul#shortcuts {
	list-style-type:none;
	margin:20px 0 10px 10px;
	padding:0 10px;
	}
ul#shortcuts li a{
	width:220px;
	padding:8px 0 0 45px;
	font-size: 0.8em;
	}

}

/**********************************************/
@media only screen and (max-width: 1024px)  {
	
#logo {
	padding:5px 20px;
	border:0;
	}
h1.text-right, h2.text-right, h3.text-right, p.text-right{
	text-align:left;
	}

.submenu a {
	margin:2px auto;
	padding:7px 0;
	font-size: 1.3em;
	}
.sort_head {
	width:100%;
	margin-right:0
	}
	
.sortimentdarstellung {
	display:block;
	width:50%;
	}
.aktuell {
    padding-bottom: 20px;
    }
.aktuell img.ausfuell {
    height:auto;
    width:100%;
    object-fit: cover;
    object-position: left top;
    }	
.expanded.gruen .ausfuell{
    height: auto;
    object-fit: cover;
    object-position: center top; 
    }
}
/**********************************************/
@media only screen and (max-width: 768px)  {
	
ul#shortcuts {
	margin:20px 0 10px 20px;
	width:300px;
	}
ul#shortcuts li{
	margin-bottom:10px;
	}
ul#shortcuts li a{
	width:250px;
	padding:8px 0 0 55px;
	font-size: 0.9em;
	}
a #hinweis {
	position:relative;
	margin-top:4px;
	right:0;
	margin-bottom:5px;
	width:100%;
	height:auto;
	background: #4c9d50;
	border-radius: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	-webkit-box-shadow: 0;
	-moz-box-shadow:0;
	box-shadow:0;
  	-webkit-transition: 0;
 	transition: 0;
	}
a:hover #hinweis {
	background: #009b6b;
	-webkit-box-shadow: 0;
	-moz-box-shadow:0;
	box-shadow:0;
	-webkit-transition: 0;
 	transition: 0;
	}
#hinweis p {
	font-family: 'Muli', sans-serif;
	font-weight:600;
	font-size:0.85em;
	color:#fff;
	padding:10px 6px;
	margin:0;
	line-height:130%;
	}
#hinweis p span {
	font-size:1.2em;
	color:#fff;
	line-height:130%;
	}
 .footer p a br {
	display: none;
    }
    
ul.sort2 li span{
    hyphens: auto !important;
    }
.swiper {
    width: 100%;
    height: 100%;
    }
.swiper-slide {
    background: transparent;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 10% 90%;
    padding:30px 0;
    text-align: center;
    width:100%;
    }

.swiper-bild {
    width:100%;
    float:none;
    height: 80px;
    text-align:center;
    }
.swiper-bild img{
    display:none;
    }
.swiper-text {
    width:100%;
    padding: 0;
    }
.swiper-text h2{
    font-weight:700;
    font-size: 1.7em;
    padding:0 20px;
    }
.swiper-text p {
    font-weight: 700;
    font-size: 1.0em;
    padding:0 20px;
    }
.slidergrau {
   margin-top:20px;
    }

}
/**********************************************/
@media only screen and (max-width: 40em) {

.header-transparent{
	border-bottom:10px solid #e5e4d8;
	}

#logo {
	margin:0;
	border:0;
	padding:20px 25px 0 25px;
	}
ul#menu {
	display:block;
	margin:0;
	padding:0;
	float:none;
	width:100% !important;
	}
ul#menu li{
	width:100%;
	margin:0;
	text-align:left;
	}

ul#menu li a{
	display:block;
	width:100%;
	padding:10px 38px;
	color:#fff;
	background:#4c9d50;
	margin:0 0 2px 0;
	}
ul#menu li a:hover, ul#menu li a#current {
	background:#fff;
	width:100%;
	color:#4c9d50;
	padding:10px 38px;
	margin:0 0 2px 0;
	}
.submenu a {
	margin:2px auto;
	padding:7px 0;
	font-size: 1.2em;
	}	
.sortimentdarstellung {
	width:100%;
	}
ul.sort {
	margin-left:12px;
	}
ul.sort li span, ul.sort li a, ul.sort2 li a, ul.sort2 li span{
	font-size:1.0em !important;
	}
ul.sort2 {
	width:100%;
	float:left;
	padding:30px 10px 0px 30px;
	list-style-type:none;
	text-align:left;
	border-bottom:0;
	}
ul.sort2 li {
	padding-bottom:6px;
	}



h1 {
	font-size:1.9em;
	margin:20px 20px 10px 25px;
	}
h2 {
	font-size:1.2em;
	margin:15px 20px 3px 25px;
	}
h3 {
	font-size:1.0em;
	margin:10px 20px 0 25px;
	}	
p {
	margin:15px 15px 30px 25px;
	}
ul.textaufzaehl {
	margin:10px 25px 20px 45px;
	}
table {
	margin:2px 0 20px 0;
	}

ul.sort {
	border-right:none;
	padding:10px 10px 10px 25px;
	}
.footer p {
	margin:30px 25px 30px 25px;
	}

table.zeiten {
	margin:5px 5px 10px 10px;	
	font-weight:normal;
	}
a#facebook {
	display:block;
	width:100%;
	text-align:left;
	right:0;
	padding:2px 0 25px 48px;
	}
.expanded img {
	margin:2px 0 2px 0;
	}
#mc_embed_signup {
	margin-left:5px;
	}
#newsletteranmeldung {
    display:block;
	position:fixed;
	width:150px;
	margin:0 0 0 auto;
	right:-150px;
	-webkit-transition: all 0.4s ease;
 	transition: all 0.4s ease;
}

#newsletteranmeldung.active {
  right: -25px;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
    }
.teamvorstellung {
    display: grid;
    width:100%;
   text-align:center;
        text-align: center;
    }
}