@charset "utf-8";
/*

	This document is created by Jasper 'amygdela' van der Meer for Open Source WebDesign @ http://oswd.org.
	You are free to alter, build upon or delete parts of the code used in this free opensource template.
	You are free to remove the copyrights from this template, but it would be cool if you left it there.
	If you use this template and you like it, drop by my site sometimes @ http://www.amygdela.com ... 

	This is my second template for OSWD. I've created this template again with no images.
	The charset used is utf-8, for easily translating or implementing this template in a file in any language.
	The HTML is XHTML 1.0 Strict valid, and the CSS valids as CSS2. Please be aware that some hacks were made 
	to display this template correct on the infamous Internet Explorer. How I hate the darn thing... Enjoy!!!
	
	All HTML and CSS is well commented, so you won't get stuck when editing the template. All divs have logical
	names and semantics were kept in mind when designing this template. | August 15th, 2005 Jasper van der Meer.
	Because I talk so much this CSS is 10k. Sorry about that dear 56k users :-)

*/

html {
	height: 96%; /* Stay a bit off top and bottom and stop a scrollbar in IE. */
	overflow-y: scroll;
}
body {
	margin-top: 1%; /* get of that top! */
	margin-bottom: 1%; /* And stay of the bottom as well! */
	background-color: #4D4D4D; /* zZ grey30; von grey0=schwarz bis grey100=white fuer den Kontrast */
	font-family: Georgia, Geneva, "Trebuchet MS", Monaco, Calibri, sans-serif; /* Monaco = iMac, Calibri = Windows Vista */
	font-size: small/100%; /* This makes sure IE users can increase fontsize with their browser.  */
}

/* ************************* END GENERAL STYLING ************************* */


/* *************************  START DIV STYLING  ************************* */

#container { /* <DIV #1> */
	width: 800px; /* Edit this to change the width of your site. */
	margin-left: auto;  /* This keeps the template centered. */
	margin-right: auto; /* This keeps the template centered. */
	padding: 12px; /* space inside this div before anything happens. */
	_padding: 6px; /* IE HACK. 6px space for IE, because of the boxmodel error. Remove this and check the page in IE... :( */
	background-color: #BCD2EE; /* LightSteelBlue2 als Hintergrund gewählt */
}
	
#core_container { /* <DIV #2> wg will hold all textual contents in the core of your page */
	width: 100%; /* Just as wide as the #container, since it's still in there. */
}

#core_left { /* <DIV #3> wg Bilderleiste */
	width: 250px; /* A fixed width to display the images correctly below eachother. */
	float: left; /* Always stay on the left side of the #core_container. */
	height: auto; /* Height is automaticlly calculated. No need to set it. */
}
        #core_left img { 
		border: 0; /* The images on the left may not have a border. */
	}
	/* zZ überflüssig wg nur Bilderleiste, ggf wg Bildunterschriften */
	#core_left p {
		font-size: 65%; /* in % of the fontsize of the body tag. */
		margin: 0;
	}
	
#core_right { /* <DIV #4> insb Text */
	width: 526px; /* contains all contents on the right of the page. */
	float: left; /* Always show up on the rightside of the screen, even when width is changed of the #container. */
        padding-left: 20px; /* wg Abstand zu Bilderleiste fuer alle folgenden Elemente */
	margin: 0;
}
        #core_right img { 
		border: 0; /* The images on the left may not have a border. */
		vertical-align: middle;
	}

	/* headers in #core_right; h1 und h2 verwendet in header */
	#core_right h5 {
		font-family: "Trebuchet MS", Verdana, sans-serif;
		font-size: 125%; /* in % of the size of the font-size from the body. */
		font-weight: 600; /* von 100 über 500=medium bis 900, 700=bold. */
		color: #FFFFFF; /* Farbe dieser Überschrift ist weiß */
		letter-spacing: 2px; /* spread those letters over your screen a bit more */
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#core_right h6 { /* als Unter-Überschrift */
		font-family: "Trebuchet MS", Verdana, sans-serif;
		font-size: 95%; /* in % of the size of the font-size from the body. */
		font-weight: 500; /* von 100 über 500=medium bis 900, 700=bold. */
		color: #FFFFFF; /* Farbe dieser Überschrift ist weiß */
		letter-spacing: 1px; /* spread those letters over your screen a bit more */
		margin-top: 0px;
		margin-bottom: 0px;
	}
	/* paragraphs in #core_right */
	#core_right p, ul { 
		font-family: "Trebuchet MS", Verdana, sans-serif;
		font-size: 80%; /* in % of the size of the font-size from the body. */
		line-height: 20px; /* The whitespace between the lines. */
	}
	#core_right p, #core_right h5, #core_right h6  {
		padding-left: 0px;
	}
	
	#core_right .klein {
		font-size: 65%; /* in % of the size of the font-size from the body. */
		line-height: 15px; /* The whitespace between the lines. */
	}

#header { /* <DIV #5> wg Logo ggf nicht nur img */
	width: auto; /* Just as wide as the container, ofcourse. */
	height: auto; /* No need to set height, just some padding around the headers is enough to get height. */
	text-align: center;
}
	/* zZ überflüssig wg nur Logo, ggf wg nicht nur img */
	#header h1 {
		font-family: "Trebuchet MS", Verdana, sans-serif;
		font-size: 150%; /* in % of the size of the font-size from the body */
		color: #A0DCF8; /* Farbe dieser Überschrift */
		letter-spacing: 4px; /* spread those letters over your screen a bit more */
		display: inline; /* This trick will display both lines of text next to eachother instead of under eachother. Add a <br /> between them in the HTML code. */
	}
	#header h2 { /* als Unter-Überschrift */
		font-family: "Trebuchet MS", Verdana, sans-serif;
		font-size: 70%; /* in % of the size of the font-size from the body */
		font-weight: 100; /* von 100 über 500=medium bis 900, 700=bold. */
		color: #A0DCF8; /* Farbe dieser Überschrift */
		letter-spacing: 1px; /* spread those letters over your screen a bit more */		
		text-transform: uppercase; /* ALL CAPS ON THIS LINE OF TEXT */
		vertical-align: center; /* Appear in the center of the #header. */
	}

/* NAVIGATIONBAR mit Hilfe von SELFTML > CSS-basierte Navigationsleisten + http://www.cssnewbie.com/easy-css-dropdown-menus entwickelt */

#navcontainer {
	width: auto; /* Just as wide as the container */
	text-align: left;
	margin-top: 36px;
	margin-bottom: 90px;
}

ul#navlist { 
	margin-left: 0; padding-left: 0;
	white-space: nowrap;
}
ul#navlist li {
	list-style-type: none;
	float: left;
	margin-right: 4px; padding: 0;	
}
ul#navlist li ul { 
	display: none; /* Unternavigation grundsätzlich ausgeblendet */
	margin-left: 0; padding-left: 0;
}
ul#navlist li:hover ul { 
	display: block; /* Unternavigation wird bei modernen Browsern eingeblendet */
	position: absolute;
	margin: 0; padding: 0;
}
ul#navlist li:hover li {
	float: none;
	margin-top: 8px; padding: 0;
}
/* ul#navlist li:hover li a {
	mit den folgenden Befehlen könnte Design Unternavigation verändert werden 
} */ 

#navlist a { 
	font: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
  	font-weight: 600; /* von 100 über 500=medium bis 900, 700=bold. */
        padding: 3px 9px; 
}
#navlist a:hover { /* dieser Befehl funktioniert zur Zeit nicht?! */
	color: #fff;
	background-color: #3D669B; /* eine Art blau */
	text-decoration: none;
}
a#gewaehlt {
	border-top: 2px solid #8A8EA1; /* eine Art grau */
}
#navlist a:link, #navlist a:visited { /* dieser Befehl funktioniert zur Zeit nicht?! */
	color: #8A8EA1; /* eine Art grau */
	background-color: white;
	text-decoration: none;
}
#navlist a:active { /* dieser Befehl funktioniert noch */
	color: #fff;
	background-color: #8A8EA1; /* eine Art grau */
	text-decoration: none;
}

/* Ende NAVIGATIONBAR */

#footer {
	clear: both; /* Appear UNDER core_right, not next to it. Not even with changed width on #container. */
	width: auto; /* Just as wide as the container */
	text-align: center;
	padding-top: 24px;
}
	#footer p { /* The <p> within the footer is styled here. */
		font-family: "Trebuchet MS", Verdana, sans-serif;
		font-size: 65%; /* in % of the size of the font-size from the body. */
		color: #8A8EA1; /* eine Art grau */
		margin: 0;
	}
	#footer a { /* The <a href="... tags in the footer are styled here. */
		text-decoration: none; /* No lines under the text. */
		color: #000000;
	}
	
/* Can't seem to fix something? Do not hesitate to email me on my Gmail account at amy2k5@gmail.com */