@charset "utf-8";
/* CSS Document */
<!--
html {
overflow-y: scroll;
}

body {
background-color: #ffffff;
border: none;
border-color:#FFFFFF;
}

#banner {
width: 100%;
margin: auto;
display: block;
}

#container {
width: 898px;
margin: 20px auto;
display: block;
/*margin-top: 20px;*/
}
a {
	text-decoration:none;
	color:#7D6806;
	}
a:hover {
	color:#000099;
	}
h1 {
	font-family:Arial, Helvetica, sans-serif;
	color: #0F5B60;
	font-size:20px;
	}
h2 {
	font-family: Arial, Helvetica, sans-serif;
	color: #365F91;
	font-size:20px;
	}
h5 {
	font-family:Tekton Pro Ext;
	color:#0066FF;
	font-size:20px;
}

#site {
	color: #365F91;
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	margin-left:50px;
	margin-right:50px;
}

#site a {
	text-decoration:none;
	color: #365F91;
	font-weight:bold;
	border: none;
}

#site a:hover {
	color: #365F91;
	font-weight:bold;
	border: none;
}

.site_list{
	color: #365F91;
	padding-left: 15px;
	list-style-position:inside;
	font-size:18px;
}
.site_list_2{
	color: #365F91;
	list-style-position:inside;
	font-size:18px;
}
ul.site_list_2 li:first-line {
	font-size:18px;
	}
ul.site_list_2 li {
	margin-top: 0px;
	}
ul.site_list_2 a {
	color:#4DB846;
	text-decoration:none;
	font-family:Arial;
}	

#navbar { /* Hintergrund des Haupt- Navigationsbereiches */
background-color: #199CA3;  /*Hintergrundfarbe des Navigationsbereiches*/
/*background-image:url(main_page_pics/main_nav_backgr.gif);*/
/*border-top: 1px solid #666666;  Oberer Rahmen (Farbe) 
border-left: 1px solid #666666;
border-right: 1px solid #666666;*/
/*border: 1px solid #0D1C26;*/
height: 100px;
border:none;
padding-left: 0px;
margin-left: 0px;;
border:none;
float: none;  /* Mit float: können Sie bestimmen, dass nachfolgende Elemente das aktuelle Element bzw. den aktuellen Bereich umfließen. Folgende Angaben sind möglich:

				left = Element steht links und wird rechts davon von nachfolgenden Elementen umflossen.
				right = Element steht rechts und wird links davon von nachfolgenden Elementen umflossen.
				none = Kein Umfluss (Normaleinstellung). */
width: 100%;
}

#navbar li {
float: left;
width: auto;    /* wird im Buch auf Seite 315 nicht verwendet*/ 
display: block;
height:100px;
border:none;
}

/* 
ist im Moment nicht in Verwendung (Buch Seite 315) 
#mainNavigation {
background-color: #3377aa;
border-top: ipx solid #555555;
padding: 6px 0;
} 
*/


#navbar a {
display: block; /* abstand vom rahmen kann mittels block unten oben li re definiert werden dazu müssen die padding werte geändert werden. */
 /* erster padding wert gibt die höhe an zweiter die weite der menüpunkte zueinander */
height: 100px;
padding-top: 0px;
padding-left: 40px;
font: bold 1.2em Arial, Helvetica, sans-serif; /*Schriftart*/
font-size: 12px;
color: #ffffff; /* Schriftfarbe der Buttons */
text-decoration: none;
/*text-transform: lowercase; Kleinschreibung (lowercase) */
/*background-color: #ffffff; Farbe der Buttons */
background-image: url(main_page_pics/main.gif);
background-repeat:no-repeat;
border:none;
}

#navbar ul li a:hover {
/*margin-top: -4px;*/
/*background-image: url(main_page_pics/main_over.gif);
/*border-right: 1px solid #5b5a08;
border-bottom: 1px solid #5b5a08;
border-left: 1px solid #5b5a08;*/;
}

/*#navbar a:hover, #navbar a:focus {
background-color: #3be;
color: #fff;
}*/


#navbar li.current a {
/*margin-top: 2px;*/
background-image: url(main_page_pics/current.gif);
color: #8EE382;
text-decoration:none;
/*border-bottom: 2px solid #aadd00;*/
}

/*#navbar li:last-child a {
border-right: 1px solid #999999;
}*/

#cancel a {
font-size:25px;
width:160px;
background-image:url(comment/cancel.gif);
background-repeat:no-repeat;
}
#cancel a:hover {
background-image:url(comment/cancel_hover.gif);
background-repeat:no-repeat;
}


* {
margin:  0; /*margin 0 bewirkt dass die Seite am oberen Browserrand angezeigt wird bzw. dass alle Bereich eng aneinader angezeigt werden */
padding: 0; /* padding 0 bewirkt dass die Liste der Menüpunkte linksbündig angezeigt werden */
}
/* wie die beiden komponenten padding und margin zusammenhängen kann hier ausprobiert werden, mir ist das nicht logisch */


#navbar ul{
list-style: none;
text-align: center;
}
/*
dient dem entfernen von Standard Auflistungszeichen*/



/*Dieser Bereich hat im Moment keine Bedeutung evtl. nochmals im Buch danach suchen
.sectionBlogs #navbar #indexTab a, {
color #fff;
background-color: #55aadd;
border-top: 3px solid #2277BB;
border-left: 2px solid #88bbee;
border-right: 2px solid #88bbee;
}

.sectionWikis #navbar #freundeTab a, {
color #fff;
background-color: #55aadd;
border-top: 3px solid #2277BB;
border-left: 2px solid #88bbee;
border-right: 2px solid #88bbee;
}

.sectionSocial software #navbar #sozialsoftwareTab a, {
color #fff;
background-color: #55aadd;
border-top: 3px solid #2277BB;
border-left: 2px solid #88bbee;
border-right: 2px solid #88bbee;
}

.sectionDesign #navbar #bilderTab a, {
color #fff;
background-color: #55aadd;
border-top: 3px solid #2277BB;
border-left: 2px solid #88bbee;
border-right: 2px solid #88bbee;
}

.sectionAjax #navbar #babyTab a, {
color #fff;
background-color: #55aadd;
border-top: 3px solid #2277BB;
border-left: 2px solid #88bbee;
border-right: 2px solid #88bbee;
}

.sectionPodcasting #navbar #verwandteTab a, {
color #fff;
background-color: #55aadd;
border-top: 3px solid #2277BB;
border-left: 2px solid #88bbee;
border-right: 2px solid #88bbee;
}

.sectionRSS #navbar #hobbysTab a {
color #fff;
background-color: #808000;
border-top: 3px solid #2277BB;
border-left: 2px solid #88bbee;
border-right: 2px solid #88bbee;
background-image: url(main.gif);
}
Dieser Bereich hat im Moment keine Bedeutung evtl. nochmals im Buch danach suchen*/


#subNavigation {
/*margin-left: 0px;*/
margin-top: -10px;
/*margin-right:  10px;*/
margin-left: 0px;
margin-right: 0px;
background-color: #ffffff;
background-repeat:no-repeat;
/*background-image:url(main_page_pics/sub_nav.gif);
/*border-bottom: 1px solid #666666;
border-top: 10px solid #808000;
border: 1px solid #666666;*/
padding: 6px 0px;
text-decoration: none;
font:  1.2em Arial, Helvetica, sans-serif;
font-size: 18px;
color: #FFFFFF;
}

#subNavigation a {
display: inline-table;
margin-top: 0px;
margin-left: 20px;
padding: 3px 0px;
height: 30px;
width: 150px;
background-image:url(main_page_pics/sub_nav.gif);
background-color:#ffffff;
background-repeat:no-repeat;
border-top: solid 0px #ffffff;
border-left: solid 0px #ffffff;
border-right: solid 0px #ffffff;
border-bottom: solid 0px #ffffff;
/*padding: 10px 10px;*/
text-decoration: none;
font:  1.2em Arial, Helvetica, sans-serif;
font-size: 18px;
color: #FFFFFF;
}

#subNavigation ul {
background-repeat:no-repeat;
list-style: none;
text-decoration: none;
color: #FFFFFF;
/*text-decoration: none;*/
}

#subNavigation ul li a:hover {
background-image: url(main_page_pics/sub_nav_over.gif);
background-repeat:no-repeat;
color: #D1E6EB;
}

#subNavigation li {
display: inline-table;
padding: 0px;
margin-left: 0px;
}

#subNavigation li.current a {
color: #7ECD78;
font-family: Arial, Helvetica, sans-serif;
background-image:url(main_page_pics/sub_nav_current.gif);
background-repeat:no-repeat;

}

.table {
	margin-top: 0px;
	border-left-width: 0px;
	border-left-color:#169CA2;
	border-right:solid;
	border-right-width: 0px;
	border-top:solid;
	border-top-width: 0px;
	border-top-color:#FF0000;
	border-right-color:#169CA2;
	border-bottom:solid;
	border-bottom-width:0px;
	border-bottom-color:#169CA2;
	width: 100%;
}
.table td {
	padding: 0px;
	background-color: #ffffff;
	border-top: 0px solid #cccccc;
	border-left: 0px solid #cccccc;
	border-right: 0px solid #cccccc;
	border-bottom: 0px solid #ffffff;
	color:#3F9939;
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
}

.table td:hover{
	padding: 0px;
	background-color: #ffffff;
	border-top: 0px solid #999999;
	border-left: 0px solid #999999;
	border-right: 0px solid #999999;
	border-bottom: 0px solid #cccccc;
	color:#3F9939;
	font-size:14px;
	font-weight:bold;	
}


.chef_table {
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	border-left-width: 0px;
	border-left-color:#169CA2;
	border-right:solid;
	border-right-width: 0px;
	border-top:solid;
	border-top-width: 0px;
	border-top-color:#FF0000;
	border-right-color:#169CA2;
	border-bottom:solid;
	border-bottom-width:0px;
	border-bottom-color:#169CA2;
	width: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}
.chef_table td {
	padding: 8px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	vertical-align: middle;
	background-color: #ffffff;
	border-top: 0px solid #cccccc;
	border-left: 10px solid #ffffff;
	border-right: 0px solid #cccccc;
	border-bottom: 8px solid #ffffff;
	color:#3F9939;
	background-image:url(bilder/bkg.gif);
	background-position:bottom;
}

.chef_table td:hover{
	padding: 8px;
	background-color: #ffffff;
	border-top: 0px solid #999999;
	border-left: 10px solid #ffffff;
	border-right: 0px solid #999999;
	border-bottom: 8px solid #ffffff;
	color:#3F9939;
	font-size:14px;
	font-weight:bold;
	background-image:url(bilder/bkg_hover.gif);
	background-position:bottom;	
}

#chef_comment {
	color:#A98904;
	font-size:12px;
	font-family:Arial;
}

#footer {
height: 196px;
margin-top: -20px;
background-image:url(main_page_pics/footer.gif);
background-repeat:no-repeat;
}
