/* =======================================
Stylesheet der Site
"Crazy Brain - art, illustration and more" 

Datei:     site.css
Erstellt:  März 2010
Autor:     J. Gocht

Aufbau:    1. Kalibrierung
		     2. Allgemeine Styles
		     3. Styles für Layoutbereich
		     4. Sonstige Styles
=======================================*/


/* =======================================
				1. Kalibrierung
=======================================*/
* { margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6 { margin-bottom: 0.5em; color: #F6A928; }

ul, ol, li { margin: 0; padding: 0; border: 0; }

p { margin-bottom: 1em; }

hr { color: #F6A928; padding-bottom: 1em; }

h1 { font-size: 125% }
h2 { font-size: 120% }
h3 { font-size: 115% }
h4 { font-size: 110% }
h5 { font-size: 105% }
h6 { font-size: 100% }

/* =======================================
				2. Allgemeine Styles
=======================================*/
body {
	font-family: Corbel, Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;
	background: url(../bilder/verlauf.jpg) #F6A928 repeat-x;
}

#submenu {
	width: 130px;
	height: auto;
	overflow: hidden;
	float: left;
	margin-top: 9%;
}

.nebenmenu {margin: 0; padding-bottom: 1em;}
.nebenmaus {margin: 0; margin-bottom: 1em;}

#text {	
	width: 450px;
	height: auto;
	overflow: hidden;
	float: right;
}

/* =============================
	classen und id's           */
#inhalt ul,
#inhalt ol {
	margin-bottom: 1em;
}

#inhalt ul li { list-style-type: disc; margin-left: 1.5em; margin-bottom: 0.7em; color: #f6a928;}
.liste { color: #000000;}

#inhalt a {
	color: #F6A928;
	text-decoration: none;
	border-bottom: 1px solid #F6A928;
}

#inhalt a:hover,
#inhalt a:focus {
	color: #000000;
	text-decoration: none;
	border-bottom: 1px dotted #000000;
}

/*------------------------------
	Menü Gestaltung				*/
	
#menutop {
	width: 600px;
	height: auto;
	background-color: #F6A928;
	border-top: 5px solid #FFFFFF;
}

#menutop li { list-style-type: none; display: inline; margin: 0; padding: 0; }
#menubottom li { list-style-type: none; display: inline; margin: 0; padding: 0; }

.button {
	color: #FFFFFF;
	font-size: 16px;
	border-right: 2px solid #FFFFFF;
}

.button a {
	color: #FFFFFF;	
	padding: 0 0.3em 0 0.3em;
	text-decoration: none;
}

.button a:hover,
.button a:focus {
	color: #F6A928;
	background-color: #FFF7EA;
}

#menubottom {
	width: 600px;
	height: auto;
	background-color: #f6a928;
	border-bottom: 5px solid #FFFFFF;
}

.auswahl {
	font-size: 16px;
	color: #F6A928;
	background-color: #FFF7EA;
	-padding: 0 0.3em 0 0.3em;
	padding-left: 0.3em;
	padding-right: 0.3em;
	border-right: 2px solid #FFFFFF;
}
		
/* =======================================
				3. Styles für Layoutbereich
=======================================*/
#wrapper {
	width: 600px;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5px;
}

#head {
	width: 600px;
	height: 120px;
	margin-left: auto;
	margin-right: auto;
	font-size: 14px;
	color: #FFFFFF;
}

#logo {
	width: auto;
	height: auto;
	float: right;
	margin-top: 20px;
}

#inhalt {
	width: 590px;
	height: auto;
	background-color: #ffffff;
	padding: 10px 5px 10px 5px;
	overflow: hidden;
}

#bottom { 
color: #FFFFFF;
font-size: 12px;
text-align: left;
}

/* =======================================
				4. Sonstige Styles
=======================================*/
.float-left {
	float: left;
	padding-right: 0.5em;
	padding-bottom: 0.5em;
}

.float-right {
	float: right;
	padding-left: 0.5em;
	padding-bottom: 0.5em;
}
