body { 
	font-family: 'Raleway', sans-serif;	
	font-size: 14px;
	margin: 0 auto; 
	line-height:150%;
	background: #fff;
	color:#666666;	
	padding: 0 0 4% 0;
}
li {
background: #fff;
}

img {
  max-width:100%; height:auto;
}

h1, h2, h3, h4, h5, h6, strong, b {color: #66cc33; margin: 5px 0;}



h1 { font-size: 1.8em; }
h2 { font-size: 1.6em; }
h3 { font-size: 1.3em; }
h4 { font-size: 1.0em; }
h5 { font-size: 0.9em; }
h6 { font-size: 0.85em; }

.logobox h2 {color: #cc0000;}
.logobox h3 {}


a {color: #cc0000; text-decoration: none;}
a:hover { color: #66cc33; text-decoration: none;}

hr{
	border:solid #333 0.1px;
	opacity: 0.2;
	clear:both;
}

/*Felder*/
button[type=button],
input[type=submit] {
font-family: 'Raleway', sans-serif;
	font-size: 14px;
	letter-spacing: 0px;
    word-spacing: 0px; 
	padding:5px 10px; 
    background:#ddd;
	color: #666;
	width: auto;
	border: 2px solid white;
    cursor:pointer;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
	transition: 0.1s all;
}
button[type=button],
input[type=submit]:active {
transform: scale(0.95);
}

input[type=email],
input[type=text] {
font-family: 'Raleway', sans-serif;
	font-size: 14px;
	letter-spacing: 0px;
    word-spacing: 0px;
	padding:5px 15px; 
    background:#ddd; 
	color: #666;
	width: 250px; 
	border: 2px solid white;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
}
input[type=date], 
input[type=time] {
font-family: 'Raleway', sans-serif;
	font-size: 14px;
	letter-spacing: 0px;
    word-spacing: 0px;
	padding:5px 15px; 
    background:#ddd; 
	width: 150px; 
	color: #666;
	border: 2px solid white;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
}
.input_mail_field,
.input_website_field,
.input_name_field,
.input_message_field{
font-family: 'Raleway', sans-serif;
	font-size: 14px;
	letter-spacing: 0px;
    word-spacing: 0px;
	padding:5px 15px; 
    background:#ddd; 
	color: #666;
	width: 250px; 
	border: 2px solid white;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
}
input[type=number] {
font-family: 'Raleway', sans-serif;
	font-size: 14px;
	letter-spacing: 2px;
	word-spacing: 0px;
	padding:5px 0px; 	
    background:#ddd; 
	color: #666;
	width: auto;
	border: 2px solid white;
    -webkit-border-radius: 5px;
    border-radius: 5px; 	
}
textarea{
font-family: 'Raleway', sans-serif;
	font-size: 14px;
	letter-spacing: 0px;
    word-spacing: 0px;
	padding:5px 15px; 
    background:#ddd; 
	color: #666;
	border: 2px solid white;
	width: 250px;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
}
input[type='radio']:after {
        width: 18px;
        height: 18px;
	font-size: 14px;
	margin: -2px 0px 0px -4px;
	    color: #444;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: static;
        background-color: #ddd;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px solid white;
	    cursor:pointer;	
}
    input[type='radio']:checked:after {
        width: 18px;
        height: 18px;
		color: #444;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: static;
        background-color: #666;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px solid white;
		cursor:pointer;
}
input[type="checkbox"] {
	appearance: none;
	 cursor: pointer;
	width: 20px;
	height: 20px;
/*	border: 1px solid #aaa; */
	background-color: #ddd;
	background-clip: content-box;
	padding: 1px;
	margin: 8px 10px -5px 0px;
}

input[type="checkbox"]:checked {
	background-color: #666;
	 cursor: pointer;
}
select {
font-family: 'Raleway', sans-serif;
	font-size: 14px;
	min-width: 250px;
	letter-spacing: 0px;
    word-spacing: 0px;
	padding:5px 15px; 
    background:#ddd;
	color: #666;
	border: 2px solid white;
	-webkit-border-radius: 5px;
    border-radius: 5px; 
}
input[type=file]::file-selector-button {
 font-family: 'Raleway', sans-serif;
	font-size: 12px;
	letter-spacing: 0px;
    word-spacing: 0px; 
	padding:2px 5px; 
    background:#ddd;
	color: #666;
	border: 1px solid white;
    cursor:pointer;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
	transition: 0.1s all;
}
input[type=file]::file-selector-button:active {
  transform: scale(0.95);
}

.captcha_iframe{
font-family: 'Raleway', sans-serif;
	font-size: 14px;
	letter-spacing: 0px;
    word-spacing: 0px;
	padding:0px 0px; 
    background:#ddd; 
	border: 2px solid white;
	width: 173px;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
}

/*Scrollbar*/
::-webkit-scrollbar {
  width: 15px;
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 10px #ddd;
	background: #ddd;
  border-radius: 1px; 
}
::-webkit-scrollbar-thumb {
  background: #bbb;
  border-radius: 1px;
}

/*Class for Search*/
.radio {
    width:20px; 
	margin: 0 5px 0 0;
}

.thrsuche {
	padding:5px 0px 0px 0px;
	width: auto;
	background-color:#fff;
	border-top: #eee 1px solid;
	text-align: right;
}

.thrsuche input[type=text] {
	background-color:#ddd;
	width: 45%;
	float: left;
	margin: 0 0 0 8px;
	color:#666;
}

.thrsuche input[type=submit] {
	float: left;
	width: 35px; 
	background-color:#fff;
}

.highlight {background-color:#86dba0;}

table {
	border-collapse:collapse;
	border: none;
}

table.table {
	clear:both;	
	border-collapse:collapse;
	border: none;	
	border-top: 1px solid #666;
	margin: 20px 0 5px 0;
	width:100%;
	font: 0.85em;	
}
table.table caption {font-size:1.1em; text-align:left; }
table.table th {font-size:0.9em; padding: 4px; text-align:left; vertical-align: top;   border: none; border-bottom: 1px solid #999;}
table.table tbody td {font-size:0.9em; padding: 4px; vertical-align: top;  border: none; border-bottom: 1px solid #999;}
table.table tbody tr:hover td {background-color:#eee;}
table.table tbody td p, table.table tbody td h1, table.table tbody td h2, table.table tbody td h3, table.table tbody td h4 {margin: 0; line-height:110%;}


.responsiveVideo, .flex-video {
   position: relative; padding-bottom: 56.25%; padding-top: 30px;  height: 0; overflow: hidden;
}

.responsiveVideo iframe, .flex-video iframe, .responsiveVideo object, .flex-video object, .responsiveVideo embed, .flex-video embed  {
   position: absolute; top: 0; left: 0; width: 100%; height: 100%;
}

.bildrechts {float:right; margin-left:10px;}
.bildlinks {float:left; margin-right:10px;}

.picfull {width:100%; height:auto;}
.pic2left {float:left; max-width:49%; margin: 3px 1% 2px 0; height:auto;}
.pic2right {float:right; max-width:49%; margin: 3px 0 2px 0.5%; height:auto;}

.pic3left {float:left; max-width:32%; margin: 3px 1.5% 2px 0; height:auto;}
.pic3right {float:right; max-width:32%; margin: 3px 0 2px 0.3%; height:auto;}

.pic4left {float:left; max-width:24%; margin: 3px 1% 2px 0; height:auto;}
.pic4right {float:right; max-width:24%; margin: 3px 0 2px 0.5%; height:auto;}


/*Show and Hide Responsive*/
.hideOnDesktops {display: none;}	


/***********************************
container
************************************/
.mainContainer {
	width: 1600px;
  max-width: calc(100% - 8%); 
	padding: 0 0 20px 0;
	margin: 0 auto; 
	box-shadow: 0px 20px 60px -10px rgba(0, 0, 0, 0.2);
	border-radius: 10px;
}

.innercontainer {
	width:98%; 
	padding:0 0 30px 0; 
		margin:0;
	background-color: #fff;
}

/***********************************
masthead
************************************/
.masthead {
	height: 245px; 
	text-align:center;	
	padding: 0px 0 0 0 ;
	width:100%;
	position:relative;	
}
.masthead .headerpic {float:right; max-width:100%;}	
.masthead .logo {position:absolute; max-width:50%; top:15%; left:10%;}

	
.logobox {position:absolute; max-width:50%; top:15%; left:10%;}
.logobox h2 {font-size:3em; font-weight:normal; line-height:110%; text-shadow: 0px 24px 7px rgba(0,0,0,0.2);}
.logobox h3 {font-size:2.2em; font-weight:normal;  line-height:110%;  text-shadow: 0px 40px 5px rgba(0,0,0,0.2);}

/***********************************
sidebar
************************************/
.menubox {
	float: left;
	width: 20%;
	vertical-align: top;
	padding: 20px 0 0 0 ;
	position: sticky;
    top: 0px;
}

.menu {
	border: 0px;
	border-bottom: 0px;
	border-style: solid;
	padding-top: 20px;	
}

.menu ul{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
.menu ul ul {
	padding-left: 10px;
	border-bottom: 0px;
}

.menu li {	line-height:120%; font-size:1em; border-top: #eee 1px solid ;}


.menu a:link, .menu a:visited, .menu a:active {
	padding: 4px 10px 4px 10px;
	display: block;
	font-weight: normal;
}
.menu a { color: #666; }
.menu a:hover { color: #66cc33; }
.menu_current, .menu li.menu-current>a { color: #000; font-weight:bold;}



/***********************************
main content
************************************/
.mainContent {
	float:right;
	width: 75%; 
	position: relative;
	vertical-align: top;
/*	XXword-spacing: 2px; */
	padding: 28px 0 0 0 ;
}

.innerContent {
	float:left; width: 100%;
}
.innerContentnarrow { float:left; width: 66%;}
.rightContent {
	float:right; 
	width: 25%; 
	padding: 26px 30px 0 0; 
	font-size:0.94em; 
	line-height: 120%
-moz-hyphens: auto;
-o-hyphens: auto;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto; 
}


.grid {
  display: grid;
  gap: 10px;
	grid-template-columns: 70% 30%;
}
.main {
	padding: 0 15px 0 0;
}
.side {
	padding: 0 10px 0 25px;
	border-left: 2px solid #ddd;
}
.main,
.side {
  /*nix*/
}

@media(max-width: 800px){
  .grid {
	  grid-template-columns: 100%; 
  }
	.side {
	border-left: none;
		border-top: 2px solid #ddd;
		padding: 10px 0 0 0;
  }
	.main {
	padding: 0 0 25px 0;
  }
}
/***********************************
separator
************************************/

.clear
	{
	clear: both;
	height:0;
	}


/***********************************
footer
************************************/

.footerhr{
	border-top: 1px solid #5D5950;
	opacity: 0.4;
}

.thrfooter{
	padding: 25px 0px 5px 0px;
    text-align: center;
	color: #666;
	 		font-weight: normal;
	        font-style: normal;
	        font-size: 14px;  

}
.thrfooter a {
	        color: #cc0000;
			text-decoration: none; 
}
.thrfooter a:hover {
				color: #66cc33;
				text-decoration: none; 
}
.footer{
	padding: 0px 0px 0px 0px;
	text-align: center;
	color: #666;
	 		font-weight: normal;
	        font-style: normal;
	        font-size: 12px;  
}
.footer a {
	        color: #cc0000;
			text-decoration: none; 
}
.footer a:hover {
				color: #66cc33;
				text-decoration: none; 
}
.copyright{
	padding: 0px 0px 25px 0px;
	text-align: center;
	color: #666;
	font-weight: normal;
	font-style: normal;
	font-size: 12px;  
}
.copyright a {
	        color: #cc0000;
			text-decoration: none; 
}
.copyright a:hover {
				color: #66cc33;
				text-decoration: none; 
}


#h20 {
	font-family:Verdana, Geneva, sans-serif;
	color:#E7E9E4;
	font-size: 3px;
}

	#menuswitch {display:none;}

/* Back to Top */
#backtotop {
  display: inline-block;
  background-color: #909090;
  width: 30px;
  height: 30px;
  text-align: center;
  border-radius: 4px;
  position: fixed;
  bottom: 5px;
  right: 5px;
  transition: background-color .5s, 
  opacity .5s, visibility .5s;
  opacity: 0.4;
  visibility: hidden;
  z-index: 1000;
}
#backtotop::after {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 25px;
  line-height: 30px;
  color: #ffffff;
}
#backtotop:hover {
  cursor: pointer;
  background-color: #606060;
}
#backtotop:active {
  background-color: #909090;
}
#backtotop.show {
	opacity: 0.4;
  visibility: visible;
}

/* ======================================================================
Smaller Screens */
@media screen and (max-width: 800px) {	
	.mainContainer { 
		width:100%; 
		margin: 0; 
		border:none;
		margin: 0 auto 0 auto;
	}
	.mainContent { margin: -20px 2%;}
	.innercontainer {	width:94%;  padding:0 2% 30px 2%;  margin:0; }
	
	.masthead {
    	XXbackground: url(img/pic1.jpg) no-repeat 100% 0;
    	padding: 0px 0px 0 0px;
	}
	.site_name h1 { margin: 0 20px 20px 20px; font-size: 1.6em; }
	
	.stripe { height: auto; }
	.stripe h1 { font-size: 1.4em; }
	
	.mainContent { float: none; width: 96%;  padding: 0px 2%;}
	
	.menubox {display: none; position:absolute; background: #fff; padding: 0 0 10px 0; margin: 0 -280px 0 0; top: 60px; left: 4%; z-index:5000; width: 280px; box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.1);
		position: sticky;
        top: 10;
		margin-top: -1000px;
	}
	
        #menuswitch.scrolled {
        position: fixed;
        top: 0%; 
		left: 5.8%;
	    z-index: 1000;
        }

        .menu a:link, .menu a:visited, .menu a:active { padding: 4px 10px 4px 10px; font-size:14px;}
	#menuswitch {display:block; position: absolute; top: 4%; left: 2%;
	} 
	
	.logobox {width:70%; top:20%; left:15%;}
	.logobox h2 {font-size:2em; text-shadow: 0px 15px 7px rgba(0,0,0,0.3);}
	.logobox h3 {font-size:1.4em; text-shadow: 0px 30px 5px rgba(0,0,0,0.3);}
}
/*Show and Hide Responsive*/
.hideOnDesktops {display: none;}	

/* Small devices (tablets, up to 768px) */
@media (max-width: 600px) {
	.mainContent { margin: -70px 2%;}
	.pic2left, .pic2right {max-width: 100%;  margin: 3px 0 2px 0;}
	.pic3left, .pic3right, .pic4left, .pic4right  {max-width: 49%;}
	
	.logobox {width:70%; top:25%;}
	.logobox h2 {font-size:2em; text-shadow: 0px 15px 7px rgba(0,0,0,0.3);}
	.logobox h3 {font-size:1.4em; text-shadow: 0px 30px 5px rgba(0,0,0,0.3);}
	
	/*Show and Hide Responsive*/
	body .hideOnTablets {display: none;}
	.hideOnDesktops {display: block;}
}

/* ======================================================================
Smaller Screens */
@media screen and (max-width: 500px) {
	.mainContent { width: 100%; margin: -90px 0 0 0;}
	.innerContent, .innerContentnarrow, .rightContent {float:none; width: 100%;}
	
	.logobox {width:70%; top:25%; }
	.logobox h2 {font-size:1.5em; text-shadow: 0px 5px 7px rgba(0,0,0,0.3);}
	.logobox h3 {font-size:1.2em; text-shadow: 0px 10px 5px rgba(0,0,0,0.3);}
	
}
/* ======================================================================

/* Small devices (Smartphone, up to <480px) */
@media (max-width: 479px) {
	.mainContent { width: 100%; margin: -100px 0 0 0;}
	.pic2left, .pic2right {max-width: 100%;  margin: 3px 0 2px 0;}
	.pic3left, .pic3right, .pic4left, .pic4right  {max-width: 49%;} 
	
	.logobox {width:70%; top:25%; }
	.logobox h2 {font-size:1.5em; text-shadow: 0px 5px 7px rgba(0,0,0,0.3);}
	.logobox h3 {font-size:1.2em; text-shadow: 0px 10px 5px rgba(0,0,0,0.3);}
	
	/*Show and Hide Responsive*/
	.hideOnMobiles {display: none;}
	body .hideOnTablets {display: block;}
	body .hideOnDesktops {display: block;}
}