/* Version 17 -2 vom 16. Februar 2022 */

::selection {
    background: #FEC327;
    color: #000;
}
/* und hiermit der Firefox >=1 */
::-moz-selection {
    background: #FEC327;
    color: #000;
}

html {height:100%;
-webkit-text-size-adjust: 100%;
	}



body {
	font-family: 'Roboto';
	font-weight:400;
	margin: 0; padding: 15px 0; 
	height:100%;
	background: #8e8c87;
	color:#231508;
}

.wrapper {
	max-width: 1024px;
    width: 90%;
    margin: 0 auto;
	overflow: hidden;
	-webkit-box-shadow: 0 0 90px #433c2d;; /* WebKit */
	-moz-box-shadow: 0 0 90px #433c2d;; /* Firefox */
	box-shadow: 0 0 90px #433c2d;; /* Standard */
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#ffffff', Direction=135, Strength=9)
	z-index:300;
	position:relative;
	background-color: white;
}



/* HEADER  */

.header { 
	width: 100%; 
	height: 169px;  
	position:relative; 
	background: url(images/header.jpg) center top no-repeat white; 
	background-position: left top;
}
.header .logopic {
	float:right; 
	margin: 53px 49px 0 0;
	width: 330px;
}


div.adminmenu {
	z-index: 99;
	position: absolute;
	top: 15px;
	left: 20px;
	font-size: 11px;
	
}

div.adminmenu a:hover {
	color: red;
}

.javalert {
  background-color: #f2dede;
  color: #a94442;
  text-align: center;
  padding: 10px;
}




/*CONTENTLINKS*/

.inner p a,
.inner p a strong {
	text-decoration: none;
}

.inner p a:hover {
	color: black;
}


/* TOPMENUE */

.topmenubar {	background: #f1d4a1; margin-bottom: 40px;
}

.topmenubar li a {
	font-size: 13px !important;

}

.topmenubar li li a {

}


img.start {
	width: 30%;
	max-width: 180px!important;
}


/* WIDECONTENTBOX OBEN*/

div.contentbox_wide {
	margin-right: -1px;
}


/* CONTENTBOX LINKS*/

.contentbox {
	width: 59%; 
	float:left;
	margin-left: 50px;
	}
.contentbox .inner {
	min-height:250px;
	margin-top: 15px;
	margin-bottom: 50px;
	}
.contentbox .inner p, .contentbox .inner li {
	color: #665d56;
	line-height: 1.5em;
	font-size: 1em;
	}

/*CONTENTBOX-WIDE GROSSE HEADERBILDER*/

#contentwide {width: 100%; }


/*Contentbox solo bei grossem wide-header*/

div#contentwide.contentbox {
		width: 91% ! important;  
}

div.contentbox_wide p img {

	width: 100%!important;
    height: auto!important;
	margin-bottom: 20px;
}

	
/* RIGHTBOX RECHTS */

.rightbox {
	width: 32%; 
	float:right; 
	background-color: #ffffff;
	border-width: 1px;
	border-style: none;
	border-right:none; 
	}
.rightbox .inner {
	border-left: 1px solid silver;
	padding-right: 30px;
	padding-left: 20px;
	}
.rightbox .inner p, .rightbox .inner li {
	font-size: 0.8em;
	}
.rightbox .inner h1 {
	font-size: 1.7em;
	}
.rightbox .inner h2 {
	font-size: 1.5em;
	}
.rightbox .inner img { 
	width:100%; 
	}
.rightbox .inner p img {
	max-width:100%; 
	height: auto ! important;
	}
.rightbox.inner h1, .rightbox .inner h2, .rightbox .inner h3, .rightbox .inner h4, .rightbox .inner strong {
	color: #8e8c87;
	}


/*YOUTUBE EMBEDDING*/

.embed-container {
  position: relative; 
  padding-bottom: 56.25%; /* ratio 16x9 */
  height: 0; 
  overflow: hidden; 
  width: 100%;
  height: auto;
}
.embed-container iframe {

  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
}
/* ratio 4x3 */
.embed-container.ratio4x3 {
  padding-bottom: 75%;
}

/***** footer und footer menu BIG ********/

.footer {
	min-height:130px;
	background: url(images/header.jpg) center 90px repeat-x; 
	clear:both;
	margin-bottom: -10px;
}
.footer .inner{ 
	position: relative;
	font-size:0.8em; 
	text-align:center; 
	line-height: 1.5em;
	color: #231508;
	padding-right: 20px;
	padding-left: 20px;
	}
	
.footer .inner h3 {
	font: 1.05em/1.2em 'Open Sans', Arial, sans-serif;
	margin-top: 10px;
	border-bottom-style: none;
}
	
.footer .inner span { 
	font-size:0.7em;
	}
/* HILFSMENUE BOTTOM FOOTER */

div.bottomenu {
	padding: 15px 20px 10px;
	text-align: center;
	margin-bottom: 10px;
	}
div.bottomenu a {
	color: orange!important;
	font-size: 0.8em;
	}
div.bottomenu a:hover{
	color: #b8214c!important;
}


div.footerbox_wide {
	margin-top: 54px;
}

.clearer { clear:both;}
.clearbottom {height:80px; clear:both;}



/***********************************
	header-menu
************************************/

a#mobilemenu {
    display:  none;   
}
a#mobilemenu span {display:block; padding: 10px 15px ; font-weight: bold;}


.breadcrumbs {padding: 15px 5px 4px 35px; clear:both;
	font-size: 0.8em;
}

a.iframeedit, a.sidebaredit, a.editlink, .mod_topic_edit { padding: 3px 6px 4px 10px; background:  url(../images/edit.gif) no-repeat 5px 5px; left 3px;}
a.editlink {display:block; float:right; }



.search_box {float:right;  width:130px; text-align:right; margin-top:5px;}
.search_box .searchstring {	
	width:80px;
	border: 1px solid #ccc;
	background-color: #666;
	font-size:12px;
	padding:2px;
	color:#ccc;
}
.search_box .submitbutton {
	vertical-align: top; margin:0 0 0 0; 
}

#showlogin {display:block; float:right; position:relative;  width:20px; text-align:right; margin-top:3px; }
#login-box {position:absolute; width:200px; left:-200px; top:25px; z-index:2000; padding:10px; font-size:11px; background:transparent url(../images/bg75.png);}
#login-box table, #login-box td {border:none;}
#login-box .inputfield {width:80px; border: 1px solid #c9e8f9; padding:1px;}

.printbutton  {display:block; float:right; margin: 3px 5px 0 5px;}


.childpages {width: 80%; float:right; min-width:200px; margin-right:3%; background:transparent url(../images/bg30.png);}
.childpages li {width:30%; float:left; }

/* LINK FORMATTING */

ul.nav { 
	list-style-type: none;
	margin: 0 0 0 50px; padding: 0;
	position: relative;
}

ul.nav li {
	float: left; 
	list-style-type: none;
	list-style-image: none;
	position: relative;
	margin: 0; padding: 0;

}


.nav li a {
	display: block; 	
	text-decoration: none; 
	font-weight: normal;
	line-height:120%;
	padding: 10px 20px;
    color: #a67a3c;
	text-transform: lowercase;
	letter-spacing: 1px;
}


/* Hover Formatting Edit here for mobile menue */
.nav  li a:hover, 
.nav li a:focus, 
.nav li a:active, 
.nav li a.active, 
.nav a.menu-current {
	 background-color: #f4ad56;  
	 color: #fff;
}




/* 2 LEVEL */

.nav li ul {
    display: none;
    width: 15em; 
    margin: 0; padding:0;
    position: absolute;
    }
.nav li ul li {
	width: 15em; 
	text-align: left; 
	font-weight: normal; 
	margin: 0; 
	padding: 0;
	border-right: none;
	background-color: #a0907e!important;
	border-top: 1px solid white;
	}
.nav li ul li a {
	color: #fff;
    font-weight: normal;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 20px;

	}

/* 2 LEVEL HOVER */

.nav li ul a:hover,  
.nav li ul a.menu-current { 
	background-color: #f4ad56;  
	color: #fff; 
	}


/* Show and hide */
.nav li:hover ul, .nav li a:focus ul {display: block; }
.nav li ul ul { display: none;}
.nav li:hover ul ul {display: none;}
.nav li:hover>ul, .nav  li li:hover>ul {display: block;  z-index: 1000;}


/* 3 EBENE  */

.nav li ul li ul 	{ 
	margin: -30px 0 0 101%; 
	padding:0;
	z-index: 9999;  
	display: none;
	width: 15em; 
	}
.nav li ul li ul li	{
	width: 11em;
	}


/* Positioning hover */
.nav li {position: relative;}



.nav li:hover {
	z-index: 10000;	
	white-space: normal;
							
}


ul.nav li.ulend {height:10px; background: transparent url(../images/ulend.png) repeat-x;}
ul.nav > li.ulend {display:none ! important;}

ul.nav a.menu-parent { 
	color: #FFF; 
	background-color: #f4ad56;
	}

/*================= bis hierhin schon ported=====================*/

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

body {
	padding-top: 0px;
}

.wrapper { 
	width: 100%; 
	font-size: 14px;
	box-shadow: none;

}

.contentbox {width: 89%;
	border-left: none;  
	border-right: none; 
	margin-right: 20px;
	margin-left: 20px;
}
.rightbox {
	width: 100%; 
	border-left: none;  
	border-right: none; 
	}
.rightbox .inner {
	border-left: none;
	margin-bottom: 20px;
	}
	.contentbox .inner {
	margin-bottom: 30px;
	}
	#contentbox#inner p {
		font-weight: bold !important;
	}

.rightbox .inner {}
	
	.search_box {margin-top:-30px;}
	.printbutton, #showlogin {display:none;}
	
	
	.header .infobox {min-width: 250px}
	.header .infobox h1 {font-size:1.5em; line-height:100%;}
	.header .infobox h2 {font-size:1.2em; line-height:100%;}
	.header .infobox h3 {font-size:1em; line-height:100%;}
	
	.breadcrumbs {padding: 14px 5px 0 13px; clear:both;
		font-size: 0.8em;
		}
	
.topmenubar {	background: #a0907e;
	}
	


a#mobilemenu { 
	display:  block;  
	background: #f1d4a1;
	width:100%;
	}
	
	ul#topmenu, ul#topmenu ul, ul#topmenu ul ul {width:100% ! important; position: static ! important; margin: 0 0 0 0 ! important; display: none}
	ul#topmenu li, ul#topmenu li li, ul#topmenu li li li {
		float: none;
		border-right: none; 
		width:100%  ! important;
		display: block;
		border-bottom: 1px solid #fff;
		box-shadow: none;
	}
	
	
	ul#topmenu li.menu-parent > ul, ul#topmenu li.menu-current > ul {display: block}
	ul#topmenu {display: block}
	ul#topmenu li.menu-current  {color: #FFF; 
	background-color: #f4ad56!important;}
	
	ul#topmenu a.menu-parent { color: #fff; 	background-color: #cdb496!important;}	
	#topmenu a.menu-parent { color: #000;}
	#topmenu a.menu-expand {
		background-image: url("../images/downArrow.png");
		background-repeat: no-repeat;
		background-position: right 50%;
	}
	
	.nav li ul {
	    box-shadow: none;
	    }
	
	ul#topmenu {display:none;}
	
	.childpages {float:none; width:90%; margin-left:15px; }
	.childpages li {width:49%; float:left; }
	/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
	
/***** footer und footer menu 955 ********/

	.footer {
		padding-bottom: 30px;
	}
	
	.footer .inner { 
		font-size:0.9em; 
		text-align:center; 
		line-height:140%;  
		padding-right: 30px;
		padding-left: 30px;
	}
	
	div.footmenu a {
		color: #ff9aa4;
		font-size:0.9em; 
	
	}
	div.footmenu {
		color: white;
		text-align: center!important;
		padding-top: 10px;

	}
	
	.showonmobiles {display:block ! important;}
	
	.mobilesonly {display:block ! important;}
	.desktoponly {display:none;}


}


@media screen and (max-width: 440px) {
	.childpages li {width:90%; float:none; }
	.header .infobox .inner {padding-top: 10%;}
	.header .infobox h1 {font-size:1.4em; line-height:100%;}
	.header .infobox h2 {font-size:1.1em; line-height:100%;}
	.header .infobox h3 {font-size:0.9em; line-height:100%;}
	
	/***** footer und footer menu 440 ********/
	
	.header { 
		height: 100px;
		}
	.header .logopic {
		max-width:65%; 
		margin: 23px 30px 0 0;
		}
	.contentbox .inner {
		margin-bottom: 25px;
		}
	
}


@media print {
	.container, .footer {width:100%;}
	#mobilemenu, .topmenubar, #mobilemenu {display: none ! important; }
		.wrapper {box-shadow: none!important; -moz-box-shadow: none!important; }
	html, body, .container, .header,  .mainbox, .contentbox, .contentbox .inner {background-image: none ! important;}
	body, html {background-color: #fff ! important;}
	.contentbox .inner, .rightbox .inner, .infobox h3 {color: #000! important;}
	.footer {display: none!important;}
	h1, h2 {text-shadow: none ! important; }
}