@charset "utf-8";
/* CSS Document */

/*------------------ Reset --------------------*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

/* ----------------- Allgemeines -------------- */

html, body {
	font-family: "Trebuchet MS", Trebuchet, Arial, Verdana, Helvetica, sans-serif;
	font-size: 13px; /* das wird irgendwo wieder wiederrufen -- z.B. bei P - klaren */
	color: #555555; /* grau (?) */
	background: #ececec;
	height:101%; /*damit bei kurzen Seiten auch Scrollbar angezeigt wird und keine Sprünge der Seite */
}


/* Zentrierer */

#centerer {
	padding-left:0px;padding-right:0px;
	border:0px solid #f2f2f2;
	box-shadow:0px 2px 33px #5e5e5e; /*CSS3 Standard*/
	-webkit-box-shadow:0px 2px 33px #5e5e5e; /*WebKit-basierte Browser (z.B. Safari/Chrome)*/
	-moz-box-shadow:0px 2px 33px #5e5e5e;  /*Mozilla-basierte Browser (z.B. Firefox)*/
	/*-moz-border-radius: 10px 5px 9px 7px;*/
	}
	
	
/* -------------- Boxen-Elemente ------------------- */

#content {padding-left:10px;}
#header {padding-left:10px;padding-right:10px;}
#marginal {padding-left:20px;padding-right:10px;}
/* Abstand zu Rand nicht im Grid-Element definieren wg. Gesamtbreite */

#logo2 {
	height:87px;
	width:200px;
	/* old 80 x 300 */
	float:left;
	/*margin-left:10px;*/ /*new*/
	margin-top:20px;
	}
#logo2 a, #logo2 a:hover, #logo2 a:active {background-color:#FFF;}

#footer {
    /*margin: 0px 0;*/
	padding-bottom:15px;
	margin-left:10px;margin-right:10px;
}

.sideBar, .hometeaser{
	background: url(../images/vertical_line.gif) repeat-y;
	width:1px;height:100%;
}

.hometaser{
	min-height:115px;
	}


/* ----------- allgemeine Linkstyles -------------- */

a:focus {
	outline: 1px dotted;
}

a {
	color: #22489B;
	text-decoration: none;
}

a:hover {
	text-decoration:none;background-color:#e9e9e9;
}



/* -------------- Hauptnavigation ----------------- */

#mainnavigation ul{bottom:4px;left:5px;font-size:1.3em;margin-left:0px;padding-top:30px;}
/*padding-top statt margin-top wg. Ignoranz in IE*/

#secondnavigation ul{
	font-size:1em;
	margin-left:0px;
	margin-top:10px;
	}
	
#mainnavigation li, #secondnavigation li{	
	float:left;
	display:inline;
	list-style-type:none;
	padding:0 1px;
	line-height:25px;
	/*border-right:1px solid #999999; automatische Boder vertikale Linien */
}

#mainnavigation a,
#mainnavigation span,
#secondnavigation a,
#quer a {
	color:#555555;
	text-decoration:none;
	text-transform:uppercase;
	padding:5px; /*damit nicht so zambatzt */
}


#mainnavigation a:hover,
#secondnavigation a:hover,
#quer a:hover
{
	color:#afafaf;
	/*padding:5px;*/
	background:none;
	}


/* ++++++++++++++++++ Schriften und Abstände ---------------------- */

/* Achtung im Body-element ist 13px definiert */

#mainnavigation ul, #secondnavigation ul {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}
h1, h2, h3, h4 {color:#22489B;font-weight:bold;font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}

h1 {margin-bottom:20px;font-size:150%;padding-left:10px;}
h2 {margin-bottom:8px;font-size:115%;}
h2.first {margin:2px 0 8px 0;font-size:115%;}
h3 {margin-bottom:8px;}
#marginal {font-size:13px;}

#marginal h3{
	/*margin-bottom:8px;*/
	font-size:120%;/*font-weight:bold;*/
	}

#marginal h4 {
	font-weight:bold; /*Überschrift Liste*/
	color:#555555;
	padding-top:15px;
}
#teaser h3 {margin-bottom:5px;font-size:115%;}
#footer ul {font-size:90%;} /*statt 12px wg mobile */


#content {
	font-size:14px;	
}

p {line-height:1.4em;} /*nur wegen p im Marginal auch 1.4 */

#content p {margin-bottom:20px;}


#tagcloud {border:2px solid #f2f2f2;}
/* warum muss hier div vor # stehen? */
#tagcloud h2 a {color:#555555;padding-right:0px;font-weight:normal;}
#tagcloud h2.font1 {font-size:15px;display:inline;}
#tagcloud h2.font2 {font-size:17px;display:inline;}
#tagcloud h2.font3 {font-size:22px;display:inline;}
#tagcloud h2.font4 {font-size:13px;display:inline;}


.tagcloud a {
line-height:140%;
margin:1px 8px;
text-decoration:none;
white-space:nowrap;
}



/* +++++++++++++++++++++++++++ Boxen und Teaser ---------------------- */

.mainContentDivider, .sideBarDivider{
	height:1px;
	width:100%;
	/*float:left;*/
	margin:30px 0 30px 0;
	background:url(../images/horizontal_line.gif) repeat-x;
}

.marginalbox {
	margin-bottom:10px;
}

.contentbox2 {margin-top:00px;margin-left:10px;margin-bottom:20px;width:220px;float:right;padding:10px;}
.contentbox3 {margin-top:00px;margin-left:15px;width:300px;float:right;padding:10px;}
/* normalerweise entfernen, da Gridlayout */



/* ---- Footer --- */

#quer {float:right;margin-top:15px;}

#quer ul, #footer ul {
padding: 3px 7px 3px 2px;margin:0;overflow:hidden;white-space:nowrap;
}

#quer ul li, #footer ul li {
display:inline;
}

	
img.contentbild {/*background-color: #99CCFF;*/float:right;margin:0 0 5px 5px; } /* nur der Platzhalter - ggf. Grösse noch fest per CSS dazu??? */
img.teaser {float:left;margin-right:10px;}
img.keyvisual {
	margin-bottom:20px;
	padding-left:10px;
	width:690px;
	height:212px;
}


/* ------------ Teaser --------------- */

div.teaser {
	padding-left:20px;
	/* in Frage stellen */
	}
	
	
    

/* ---------------- Listen ------------------------- */

/* Link List */

/*ul {margin:5px 0 0 15px;}
ul li{list-style-type:disc;margin:2px 0 0 0;padding-left:0;float:none;}
*/
/* Bullet List */

ul.bullet {margin:5px 0 0 15px;}
ul.bullet li {list-style-type:disc;margin:2px 0 0 0;padding-left:0;float:none;line-height:1.5em;}
/*ul li a, ul.bullet li a:hover {background-image:url(../images/pdf.gif);
line-height:150%;
list-style-type:none;}*/


ul.download li a,
/*.inhalt .multibox ul.download li a,*/

#marginal ul.linkliste li a {
	background-repeat:no-repeat;
	background-position:0 6px;
	padding:2px 0 0 24px;
	display:inline-block;
	/*display:block;*/
	background-image:url(../images/linkicon.gif);
	line-height:130%;
	
}
	

/* Rechte Seite Downloadliste */

ul.download
{
list-style-type: none;
list-style-position:outside;
list-style-image:none;
margin:0 0 -5px 0;
padding-left:0;
}


ul.download li.pdf a,
ul.download li.pdf a,
ul.download li.pdf a:hover,
ul.download li.pdf a:hover  {
background-image:url(../images/pdf.gif);
line-height:150%;
list-style-type:none;
}

/* ZIP-download auskommentiert da Icon fehlt 
ul.download li.zip a,
ul.download li.zip a,
ul.download li.zip a:hover,
ul.download li.zip a:hover  {
background-image:url(../images/zip.gif);
line-height:150%;
list-style-type:none;
}
*/

/* ################### TEST ################################ */

.button{
/*	float:left;*/
	font-weight:bold;
	color:#FFF;
	background-color:#69c;
	/*background-color:#8fcb3d;*/
	padding:2px 5px 0 2px;
	text-decoration:none;
	/*margin-top:10px;*/
	/* text-shadow:none; auskomm. wegen validierung */
}
	.button:hover{
		background-color:#69c;
	}
	
/* Form ################ */

label,

select,

input[type=checkbox],

input[type=radio],

input[type=button],

input[type=submit] {

cursor: pointer;

}


label {    
float: left;    
width: 140px;    
margin-right: 1em;  
}

.formblock {margin-bottom:20px;}
input.text {width:190px;}
input.textarea 

input.checkbox {
	float: left;
	margin-left: 140px;
	margin-right: 10px;
}

textarea {
	color: #1A171B;
	font-size: 12px;
	height: 120px;
	width: 340px;
}

label.checkbox {
	display: block;
	float: none;
	font-weight: normal;
	margin-left: 20px;
	width: auto;
}

input.button {
	
	background-color:#2887d4;
	border: 1px solid black;
	color: #fff;
	/*float: right;*/
	/*font-size: 14px;*/
	padding-right: 20px;
}


/* Error Messages */

label.error {
	/* remove the next line when you have trouble in IE6 with labels in list */
	color: red;
	font-style: italic
}


/* ##################################### MOBILE ############################################ */

/* Anzeige Burger-Menu: nicht */

.slicknav_menu {
	display:none;
}


@media only screen and (max-width: 600px) {
	/* geändert von 767 px auf 600 px, da sonst ipad mit dabei */

/*	img.keyvisual {display:none;}*/
	img.keyvisual {
		max-width:300px;
		height:131px;
	}
	
	#quer ul, #footer ul {
padding: 3px 7px 3px 2px;margin:0;overflow:hidden;white-space:nowrap;
}

#quer ul li, #footer ul li {
display:inline;
}

#marginal {padding-left:0px;padding-right:0px;}

/* Burger-Menu anzeigen */
	/* #menu is the original menu */
	#menu {
		display:none;
	}
	
	.slicknav_menu {
		display:block;
	}
	
	#quer {
		display:none;
	}
	
	
	.sideBar, .hometeaser{
	background:none;
	width:1px;height:100%;
}
div.teaser {
	padding-left:0px;
	}
	
	.hometeaser{
	margin-bottom:15px;
	}
	img.contentbild {float:none;margin:0 0 5px 5px; }  
	
	h1 {margin-bottom:20px;font-size:115%;padding-left:10px;display:block;overflow:auto;}
	#footer {font-size:90%;}
}


/* SLICKNAV Mobile Navigation */

/*
    Mobile Menu Core Style
*/

.slicknav_btn { position: relative; display: block; vertical-align: middle; float: right; padding: 0.438em 0.625em 0.438em 0.625em; line-height: 1.125em; cursor: pointer; }
.slicknav_menu  .slicknav_menutxt { display: block; line-height: 1.188em; float: left; }
.slicknav_menu .slicknav_icon { float: left; margin: 0.188em 0 0 0.438em; }
.slicknav_menu .slicknav_no-text { margin: 0 }
.slicknav_menu .slicknav_icon-bar { display: block; width: 1.125em; height: 0.125em; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); }
.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar { margin-top: 0.188em }
.slicknav_nav { clear: both }
.slicknav_nav ul,
.slicknav_nav li { display: block }
.slicknav_nav .slicknav_arrow { font-size: 0.8em; margin: 0 0 0 0.4em; }
.slicknav_nav .slicknav_item { cursor: pointer; }
.slicknav_nav .slicknav_row { display: block; }
.slicknav_nav a { display: block }
.slicknav_nav .slicknav_item a,
.slicknav_nav .slicknav_parent-link a { display: inline }
.slicknav_brand { float:left }
.slicknav_menu:before,
.slicknav_menu:after { content: " "; display: table; }
.slicknav_menu:after { clear: both }
/* IE6/7 support */
.slicknav_menu { *zoom: 1 }

/* 
    User Default Style
    Change the following styles to modify the appearance of the menu.
*/

.slicknav_menu {
    font-size:16px;
    box-sizing:border-box;
}
.slicknav_menu * {
  box-sizing:border-box;
}
/* Button */
.slicknav_btn {
    margin: 5px 5px 6px;
    text-decoration:none;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;  
    background-color: #222222;
}
/* Button Text */
.slicknav_menu  .slicknav_menutxt {
    color: #FFF;
    font-weight: bold;
    text-shadow: 0 1px 3px #000;
}
/* Button Lines */
.slicknav_menu .slicknav_icon-bar {
  background-color: #f5f5f5;
}
.slicknav_menu {
    background:#4c4c4c;
    padding:5px;
}
.slicknav_nav {
    color:#fff;
    margin:0;
    padding:0;
    font-size:0.875em;
}
.slicknav_nav, .slicknav_nav ul {
    list-style: none;
    overflow:hidden;
}
.slicknav_nav ul {
    padding:0;
    margin:0 0 0 20px;
}
.slicknav_nav .slicknav_row {
    padding:5px 10px;
    margin:2px 5px;
}
.slicknav_nav a{
    padding:5px 10px;
    margin:2px 5px;
    text-decoration:none;
    color:#fff;
}
.slicknav_nav .slicknav_item a,
.slicknav_nav .slicknav_parent-link a {
    padding:0;
    margin:0;
}
.slicknav_nav .slicknav_row:hover {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    background:#ccc;
    color:#fff;
}
.slicknav_nav a:hover{
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    background:#ccc;
    color:#222;
}
.slicknav_nav .slicknav_txtnode {
    margin-left:15px;   
}
.slicknav_brand {
	color:#fff;
	font-size: 18px;
	line-height:30px;
	padding:7px 12px;
	height:44px;
}