/************************************************** 
* BUNDESOBERSTUFEN-REALGYMNASIUM SALZBURG Nonntal *
* 5020 Salzburg Josef Preis Allee 7               *
* Tel. +43662 / 842434                            *
* Fax +43 662 /842434-9                           *
* E-mail: sekretariat@borgnonntal.at              *
*                                                 *
* Design & Realisierung:                          *
* Thomas Schütz                                   *
* Markus Lauterbacher                             *
***************************************************/
/*
ANMERKUNGEN:

*Allgemeines bei Style-Eigenschaften
	Es sollten nur die Eigenschaften vergeben werden, die unbedingt benötigt werden, alles andere sollte von den darüberliegenden Klassen geerbt werden,
	damit ist eine Neuausrichtung des gesamten Styles wesentlich einfacher.
*Überschriften
	Die Tags <h1> und <h2> sind den Klassen "ueberschrift12px" bzw. "ueberschrift10px" grundsätzlich vorzuziehen (Wird von Suchmaschinen besser bewertet).
*/
/* @group Tags */

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #272727;
	text-decoration: none;
	vertical-align: top;
	background-color: #FFFFFF;
}

hr {
	border-width: 1px;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-color: #CCCCCC;
}

h1, .ueberschrift12px {
	font-size: 1.2em;
	font-weight: bold;
}

h2,h3, .ueberschrift10px {
	font-size: 1em;
	font-weight: bold;
}

img {
	border: none;
}

/* @end */
/* @group IDs */

#lTopLeft,#lTopRight {
	/*Beide Klassen sind für die Links ganz links/rechts oben*/
	padding: 2px;
	position: fixed;
	top: 0px;
	bottom: auto;
	z-index: 101;
}

#lTopLeft {
	left: 0px;
	right: auto;
	text-align: left;
}

#lTopRight {
	left: auto;
	right: 0px;
	text-align: right;
}

#siteContent {
	padding: 10px 20px;
	text-align: left;
}

#site {
	width: 100%;
}

#container {
	/*Layer in der sich der gesamte Inhalt befindet, inkl Rahmen usw..*/
	width: 840px;
	margin: auto;
	background-image: url(../images/Spacer.jpg);
	background-repeat: repeat-y;
	z-index: 1;
}

#banner {
	/*Layer in der sich der Banner befindet; Wäre das Background-Image nicht, würde im IE ein 1 Pixel weißer Streifen unter dem Banner angezeigt werden*/
	background-image: url(../images/bannerSpacer.jpg);
	background-position: center;
	background-repeat: repeat-y;
	width: 840px;
	height: 170px;
}

#menue,#greyFooter,.mainMenu{
	background-color: #666666;
}

#menue,#greyFooter {
	/*Layer in der sich das Menü befindet, Layer die den grauen Streifen am Ende der Seite beinhaltet*/
	position: relative;
	width: 800px;
	left: 20px;
	z-index: 2;
}

#greyFooter {
	text-align: right;
}

#content {
	/*Layer in die die anderen Seiten includet werden, z. B. "home", "informatik" usw..*/
	position: relative;
	width: 760px;
	left: 20px;
	padding: 10px 20px;
	min-height: 300px;
	z-index: 1;
}

#bottomSpacer {
	/*Layer, die den Abschlussrahmen der Website beinhaltet (den Schattenwurf am Boden)*/
	height: 20px;
	background-image: url(../images/bottom_background.gif);
	background-position: center;
	background-repeat: no-repeat;
	background-color: #FFFFFF;
	z-index: 1;
}

#footer {
	/*Layer am Ende der Website, in dem die Anschrift angeführt ist*/
	text-align: center;
	background-color: #FFFFFF;
	z-index: 1;
}
#wpfLinks,#wpfContent {
	/*Bei den Wahlpflichtfächern die Links bzw. der Contetn*/
	padding: 0px 10px;
	margin: auto;
	margin-left: 10px;
	border: 1px solid #CCCCCC;
}
#wpfContent {
	/*Bei den Wahlpflichtfächern der Content*/
	float: right;
	width: 430px;
}
#wpfLinks{
	/*Bei den Wahlpflichtächern die Links*/
	float: left;
	width: 230px;
}

/*@end */
/* @group Menü Classes */

.mainMenu {
	/*Background Color für die "Hauptleiste" und die Layer die herunterklappen*/
	color: #FFFFFF;
}

.menueList {
	/*List Style der Menüpunkte*/
 	list-style-type: none;
	padding: 3px 5px 5px;
	margin: 3px auto 5px 5px;
}

/* @end */
/* @group Classes */

.text {
	/*Normaler Text, die Klasse muss eigentlich nicht verwendet werden, da sowieso der Body-Tag die gleichen Eigenschaften aufweist*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	vertical-align: top;
}

.listStyleTypeNone {
	list-style-type: none;
}

a:link,a:visited,a:active,a:hover {
	/*Klasse für die normale Links*/
	text-decoration: none;
	color: #0099FF;
}

a:hover {
	text-decoration: underline;
}

a.linkImpressum:link,a.linkImpressum:visited,a.linkImpressum:active,a.linkImpressum:hover {	
	/*Klasse für die beiden Links Rechts/Links oben*/
	text-decoration: none;
	color: #999999;
}

a.linkImpressum:hover {
	text-decoration: underline;
}

a.mainLink:link,a.mainLink:visited,a.mainLink:active,a.mainLink:hover {
	/*Klasse für die Links des Hauptmenüs*/
	text-decoration: none;
	color: #FFFFFF;
	font-size: 1.1em;
	display: block;
	text-indent: 5px;
}

a.mainLink:hover {
	color: #0099FF;
}

a.subLink:link,a.subLink:visited,a.subLink:active,a.subLink:hover {
	/*Klasse für Unterkategorie der Menülinks*/
	text-decoration: none;
	color: #FFFFFF;
	font-size: 1em;
	text-indent: 5px;
}

a.subLink:hover {
	color: #0099FF;
}

a.linkAnchor:link,a.linkAnchor:visited,a.linkAnchor:active,a.linkAnchor:hover,a:link[name],a:visited[name],a:active[name],a:hover[name] {
	/*Klasse für Links, die einen Anker bilden, z. B. die Überschriften bei den Formularen. Entweder weißt man ihnen eine Klasse zu, oder
	wenn das name attribut vorhanden ist, übernehmen sie automatisch die folgenden Eigenschaften (Siehe Verwendung von CSS-Selektoren)*/
	text-decoration: none;
	color: #272727;
}

.tableBorder {
	/*Sollte Tabellen zugewiesen werden, damit diese einen einheitlichen Style haben*/
	border: 1px solid #CCCCCC;
	border-collapse: collapse;
}

.popup {
	/*Sollte den bodyTags von PopUp Fenstern zugewiesen werden*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #272727;
	text-decoration: none;
	background-color: #F1F1EF;
}

.formular, input {
	/*Style der Formulare*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333333;
	text-decoration: none;
	background-color: #E5E5E5;
	border: 1px solid #999999;
	height: auto;
	width: auto;
}

table.rowHover tr:hover, table.cellHover td:hover, .tabellenkontrast {
	/*Will man einen Hover Effekt bei Tabellenreihen oder Zellen, muss man den Tabellen die jeweile Klasse zuweisen*/
	background-color: #C9C9C9;
}

/* @end */
/* @group Einzeiler */


.top {
	vertical-align: top;
}

.right {
	text-align: right;
}

.center {
	text-align: center;
}

.fett {
	font-weight: bold;
}

.warning {
	color: #FF0000;
}

.grey {
	color: #999999;
}

.greyBackground {
	background-color:#CCCCCC;
}

/* @end */
