/*  Typo
----------------------------------------------- */
body {  
    font-family: 'Roboto', sans-serif; 
    font-size: 100%;
    font-weight: 400;
    color: #444444;
	line-height: 140%;
}


a:link, a:visited {
    text-decoration: underline;
    color:#468C00;
}

a:active { 
	color:#468C00; 
	text-decoration: underline; 
}
a:hover { 
	color:#00661A; 
	text-decoration:none; 
}

#container .n {padding: 0!important;}

h1 { font-size: 1.5em; margin-top: 0.5em;}
#content_area h1 {margin-top: 0em;}
h2 { font-size: 1.5em; margin: 0.1em 0 0.4em 0; }
h3 { font-size: 1.3em; margin-top: 0.3em; }
.j-textWithImage h3 { line-height: 1.6em; }
p { font-size: 1em; margin-top: 0.2em; }

.clear {clear:both; line-height: 0; font-size: 0;}

.hidden {
    position: absolute;
    left: -1000px;
    top: -1000px;
    width: 0;
    height: 0;
    overflow: hidden;
    display: inline;
}
/*  Layout
----------------------------------------------- */

body {
	background-image: url("https://u.jimcdn.com/cms/o/s1f8bcc134b535199/userlayout/img/maulwurf.gif?t=1454850843");
	background-repeat: no-repeat;
    background-position: top center;
    padding:0;
    margin:0;
}

#container {

    margin:0 auto;
    width:940px;
}

#cc-inner {
    position: relative;
}

#header {
	height: 140px;
	position: relative;
}

#header h1 a {
    padding: 0;
    font-size: 4em;
    font-weight: 700;
    text-decoration: none;
    color: #204000;
    letter-spacing: 0.13em;
    position: absolute;
    left: 0px;
    bottom: 5px;
    line-height: 1em;
}

#header a:hover { text-decoration:none;  }


#navigation {
	position: relative;
	z-index: 1000;
}

#mobNav {
	display: none;
}

#sidebar {
	position: absolute;
	bottom: initial;
	top: 0;
	width: 220px;
	height: 300px;
	background-color: #D4EABF;
	color:#204000;
}

body.subnav #sidebar {
	bottom: 0;
	top:  initial;
}

#sidebar h2 {
	padding: 0.3em;
	margin: 0.3em 0.3em 0.6em 0.3em;
	background-color:#204000;
	font-weight: normal;
	color: #fff;
	letter-spacing: 0.1em;
}

#sidebar p {
	margin: 0.4em 0.6em;
}

body.cc-page-index #sidebar p.noStart {display:none;}


#content {
	position: relative;
    width: 940px;
	min-height: 550px;
}

#content_area  {
	margin-left: 229px;
	padding: 0.5em;
	/*border: 3px solid #D4EABF;*/
	border: 3px solid #fff;
	min-height: 600px;
	width: 680px;
	margin-top: 1em;
	background-color: #fff;
}

div.cc-m-all div.cc-m-all-wrapper  { 
	padding: 0!important;
	}

#content_area .cc-m-hgrid-column.last  {
	margin-top: -1.6em;
}

#content_area .cc-m-hgrid-column.last div.j-header h3 {
	padding: 0.5em 0.5em 0.5em 1em;
	background-color: #D4EABF;
	color: #222222;
}

#content_area .cc-m-hgrid-column.last div.j-text {
    padding: 0.5em 0.5em 0.5em 1em !important;
   /* border: 2px solid #D4EABF;*/
    border: 2px solid #fff;
    margin-top: 0.5em;
}

#footer
{
    clear:both;
    margin-top:10px;
    height:65px;
}

#footer .gutter, #footer .gutter  a{
	color: #c7c7c7;
	line-height: 100%;
}

/*  Navigation
----------------------------------------------- */

#navigation  .dtNav {
	display: block;
} 

#navigation  .mNav {
	display: none;
} 

ul.mainNav1,
ul.mainNav2 { 
	margin: 1em 0 0.5em 0;
    padding: 0;
}

ul.mainNav2 { 
	position: absolute;
	left: 0;
	top: 0.8em;
	margin: 1em 0 0.5em 0;
    padding: 0;
}

ul.mainNav1 li {
    display: inline;
    margin: 0;	
    padding: 0;
}

ul.mainNav2 li {
	width: 220px;
    display: block;
    margin: 0;	
    padding: 0;
}

ul.mainNav1 li a{
    text-decoration: none;
    display: inline;
	background-color: #204000; 
    color:#fff;
	font-size: 1.1em;
	font-weight: 300;
	letter-spacing: 0.15em;
}

ul.mainNav2 li a {
    text-decoration: none;
    display: block;
	background:#D4EABF;
    color:#204000;
	font-size: 1.1em;
	font-weight: 300;
	letter-spacing: 0.15em;
}

ul.mainNav1 li a { padding:0.4em 1em; margin: 0.5em 0.5em 0 0 ; }
ul.mainNav2 li a { padding:0.4em 1em; margin: 0.5em 0 0 0 ; }
ul.mainNav3 li a { padding:0.4em 1em; }


ul.mainNav1 a:hover {
	background-color: #fff; 
	color:#00661A; 
}

ul.mainNav1 a.current, ul.mainNav1 a.parent { 
	font-weight:bold; 
	background:#D4EABF;
    color:#1F3F00;
}


ul.mainNav2 a.current, ul.mainNav2 a.parent { 
	font-weight:bold; 
	background:#fff;
    color:#1F3F00;
	border: 3px solid #D4EABF;
	padding: 0.3em 0.9em;
}

#navigation .mNav a.current:before {
    content: '>>';
    color: black;
    font-weight: bold;
    font-size: 1.5em;
    line-height: 0em;
    margin-left: -0.15em;
    margin-right: 0.15em;
    } 

/* Startseite */
.startseite #sidebar {
	position: absolute;
	bottom: 0;
	width: 283px;
	height: 239px;
	background-color: #D4EABF;
	color: #204000;
	left: 658px;
}

.startseite #sidebar h2 {
	padding: 0.3em;
	margin: 0.3em 0.3em 0.6em 0.3em;
	background-color:#204000;
	font-weight: normal;
	color: #fff;
	letter-spacing: 0.1em;
}

.startseite #sidebar p {
	margin: 0.4em 0.6em;
}


.startseite #content {
	position: relative;
    width:710px;
	margin-top: 324px;
	min-height: inherit;
	
}

.startseite #content_area {
	margin-left: 0px;
	padding: 0.5em 0.5em 0.5em 0.5em;
	border: 3px solid #D4EABF;
	min-height: 217px;
	width: 625px;
	margin-top: 1em;
	background-color: #fff;
}
/* nur wenn nicht cms*/
.cc-pagemode-default.startseite #content_area {
	height: 217px;
	overflow-y: auto;
}

.startseite #banner {
	width: 940px;
	position: absolute;
	top: 194px;
	height: 297px;
	overflow: hidden;
}

.startseite #bannerlink {
	position: relative;
	bottom: 45px;
	width: 265px;
	margin-left: 663px;
	padding: 0.5em 0em;
	z-index: 1001;
	text-align: center;
	background-color: #D4EABF;
	opacity: 0.75;
	overflow: hidden;
	height: 22px;
    filter: alpha(opacity=75); /* For IE8 and earlier */
}

.startseite #bannerlink a {
	/**/
}

/* galerie */
#content_area .j-gallery {
    margin-top: 0.5em;
}

#content_area .ccgalerie div.thumb_sq1 img {
    display: block;
    padding: 0 0.5em 0.5em 0;
    background: #fff;
	border: none!important
}

/*formulare*/
#content_area form .input50 {width: 50%;}
#content_area form .input75 {width: 75%;}

#content_area form input[type=text], #content_area form input[type=email] {
	height: 1.75em;
    font-size: 1.15em;
    padding: 0 0.25em;
}

#content_area form input[type=submit] {
	height: 1.75em;
    font-size: 1.15em;
    padding: 0 0.25em;
}

/* ----------------------------------------- */
/* mobile > responsive */
@media screen and (max-width: 1020px) {

	body {  
		font-size: 105%;
		background-position: top right;
		background-size: 80%;
	}	
	
	h2 { margin-top: 1em; line-height: 1.3em;}
	h3 { margin-top: 0.8em; }
	p { margin-top: 0.5em; }
	.last p:first-child { margin-top: 0em; }
	
	#content_area h1 {
		border-bottom : 3px solid #D4EABF;
		padding: 0.25em;
		margin: 0.5em 0;
		background-color: #D4EABF;
	} 

	#container {
		width: 100%;
	}
	
	#navigation {
		font-size: 0.9em;
		width: 40%;
		display:none;
		margin-left: 0.5em;
	}

	#mobNav {
		display: block;
		position: absolute;
		top: 0px;
		left: 0.25em;
		background-image: url("mobNav.png");
		background-repeat: no-repeat;
		background-position: 0.25em 0.25em;
		background-size: 85%;
		width: 2.5em;
		height: 2.5em;	
	}
	
	#navigation  .dtNav {
		display: none;
	} 
	
	#navigation  .mNav {
		display: block;
	} 	
	
	ul.mainNav1 li {
		display: block;
	}
	
	#navigation 	ul.mainNav1 li a {
	    display: block;
		padding: 0.4em 0.7em;
		margin: 0.4em 0.4em 0 0;
	}

	#navigation ul.mainNav2 li a {
		padding: 0.4em 0.5em;
		margin: 0.2em 0.4em 0 0;
		line-height: 1.3em;
	}
	
	#navigation 	ul.mainNav2 {
		position: inherit;	
		margin: 0.2em 0;
		padding: 0;
	}
	
	#navigation 	ul.mainNav2 li {
		width: auto;
		display: block;
		margin-left: 0.75em;
	}
	
	#header {
		height: auto;
		position: relative;
	}
	
	#header h1 a {
		position: relative;
		font-size: 2em;
		letter-spacing: 0.13em;
		margin-left: 1.3em;
	}
	
	.startseite #banner {
		display:none;
	}
	
	.startseite #banner {
		display:none;
	}

	.startseite #content , #content {
		position: absolute;
		width: 100%;
		margin-top: 0em;
		min-height: inherit;
	}
	
	.cc-pagemode-default.startseite #content_area {
		height: auto;
		overflow-y: inherit;
	}
	#content_area, .startseite #content_area {
		padding: 0;
		border: none;
		min-height: inherit;
		width: auto;
		max-width: 940px ;
		margin: 0.5em 0.5em 0 0.5em;
		background-color: #fff;
	}	
	
	.cc-imagewrapper img {     
		margin: 0 0em 0 -0.5em;
		max-width: 110%;
	}
	
	#content_area .cc-m-hgrid-column.last  {
		margin-top: 0;
	}	
	
	#sidebar, .startseite #sidebar {
		position: initial;
		bottom: 0;
		width: 100%;
		max-width: 940px ;
		height: auto;
		left: 0;
		margin-top: 1.5em;	
		padding: 0.3em 0;		
	}	
	
	#footer { display:none;}
}
@media screen and (max-width: 799px) {
	#navigation {
		font-size: 0.75em;
		width: 60%			
	}
	
	#navigation 	ul.mainNav1 li a {
		padding: 0.3em 0.5em;
		margin: 0.3em 0.3em 0 0;
	}
	
	#navigation ul.mainNav2 li a {
		padding: 0.2em 0.3em;
		margin: 0.3em 0.3em 0 0;
		line-height: 1.2em;
	}
	
	#content_area .cc-m-hgrid-column {
		float:none!important;
		width: auto!important;
	}
	
	
	#content_area .cc-m-hgrid-column.last  {
		margin-top: 1em;
	}		
	
	#content_area .cc-m-hgrid-column.last div.j-text {
		padding: 0.5em !important;
	}	
	
	#content_area .cc-m-hgrid-column.last div.j-header h3 {
		padding: 0.5em;
	}
}

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

	body {  
		font-size: 110%;
		color: #222222;
		background-size: 120%;		
	}
	
	h1, h2, h3, h4, strong {color: #444444;}

	#navigation {
		font-size: 0.9em;
		width: auto;		
	}
	
	
	#header h1 a {
		text-align: left;
		font-size: 1.5em;
		margin-left: 1.3em;
	}

	#mobNav {
		width: 2.2em;
		height: 2.2em;
		border: none;
		background-position: 0.15em 0.15em;
		background-size: 75%;		
	}	
	
	/*formulare*/
		#content_area form .input50 {width: 100%;}
		#content_area form .input75 {width: 100%;}	

	/*content*/
	#content_area .j-textWithImage  {
		margin-bottom: 2em!important;
	}
	#content_area .j-textWithImage .cc-m-image-align-1 {
		float: none!important;
	}
	
	#content_area .j-textWithImage .cc-m-image-align-1 img {     
		margin: 0;
		max-width: 110%;
	}
}	
	
@media screen and (max-width: 450px) {

	#header h1 a {
		text-align: left;
		font-size: 1.3em;
		margin-left: 1.4em;
	}

	#mobNav {
		width: 1.8em;
		height: 1.8em;
		background-size: 80%;
	}	
}