/*
////////////////////////////////////////////////////////////////
//
// main.css  Stylesheet fuer nk-marsonia.de
//
// erstellt am: Januar 2008
//
// erstellt durch:
//	RITRADE Computersysteme & IT-Dienstleistungen
//	Lucijano Horvat
//	Plattenhardter Str. 9
//	70794 Filderstadt
//	www.ritrade.de
//
////////////////////////////////////////////////////////////////
*/


body{	

	background-color:#a8d9ff;

	behavior: url(csshover.htc);
	
	/* Alle elemente im body werden hiermit zentriert ... auch die div-Elemente !! Damit müssen die div-Elemente nicht exlizit zentriert werden. */
	text-align: center;
	
}
a{	text-decoration: none;
	
	color:#005f4f;	
	
	
}
div a{
	text-decoration: none;
	/*
	color:#11cfff;	
	*/
	color:#FFF;
	/*
	font-family: arial, verdana, arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	*/
}



/*
////////////////////////////////////////////////////////////////
// sonstige Formatierungen
////////////////////////////////////////////////////////////////
*/

#block-oben{
	width:880px;
	height:180px;
	background-image: url(./grafiken/block_oben.jpg);
	border:0px solid red;
	margin:auto;
}
div#nav {
	border: 0px solid white;
	width:880px;
	height:22px;
	position:relative;
  	left:68px;
	top:150px;
	margin:auto;
	z-index:1;
	text-align:center;
}
#content-block-left h1 {
        border-bottom: 1px dashed #11cfff;
	color:#11cfff;
	font: 13px verdana, arial, sans-serif;
	
}
#content-block{
	background-image: url(./grafiken/bg_content.jpg);
	border: 0px solid green;
	width:880px;
	margin:auto;
	
}
#content-block-left{
	background-color: none;
	border: 0px solid red;
	text-align:justify;
  	width:490px;
  	/*
	margin-right:50px;
	*/
  	padding-left:65px;
  	float: left; 
}

#content-block-archiv{
	background-color: none;
	border: 0px solid red;
	text-align:justify;
  	width:680px;
  	/*
	margin-right:0px;
	*/
  	padding-left:65px;
  	float: left; 
}

#content-block-center{
	background-color: none;
	border: 0px solid red;
	text-align:center;
  	width:880px;
  	/*
	margin-right:50px;
	*/
	margin:auto;
  	padding-left:0px;
  	position: relative;
  	top: 0px;
  	left 0px;
}

#content-block-right{
	background-color: none;
	border: 0px solid blue;
	text-align:justify;
	width:270px;
	/*
	margin-right:50px;
	*/
	padding-right:40px;
	float:right;


}
.content-block-right-tabelle{
	background-color: none;
	border: 0px solid green;
	width:220px;
	margin:auto;
}
.content-block-right-tabelle2{
	background-color: none;
	border: 0px solid green;
	width:500px;
	margin:auto;
}
.content-block-vorstand{
	background-color: none;
	border: 0px solid green;
	width:500px;
	margin:auto;
}
.content-block-Turnier{
	background-color: none;
	border: 0px solid green;
	width:650px;
	margin:auto;
}
.content-block-sponsor{
	background-color: none;
	border: 0px solid green;
	width:600px;
	margin:auto;
}
.content-block-links{
	background-color: none;
	border: 0px solid green;
	width:300px;
	margin:auto;
}
#content-bottom{
	background-image: url(./grafiken/block_unten.jpg);
	border:0px solid red;
	width:880px;
	height:54px;
	text-align:left;
	margin:auto;
	position:relative;
	top:0px;
	left:0px;
}

#map {
	border:1px solid #11cfff;
	margin:auto;	
}

#text-lang{
	padding:0;
	text-align:left;
	margin:0;
	position:relative;
	top:6px;
  	left:6px;
	font:bold 11px arial, sans-serif;
	color:#005f4f;
}

#text-content-gross{
	padding:0;
	text-align:left;
	margin:0;
	position:absolute;
	top:10px;
  	left:20px;
}
#text-content-gross1{
	padding:0;
	text-align:left;
	margin:0;
	position:absolute;
	top:50px;
  	left:350px;
}
#text-content-gross2{
	padding:0;
	text-align:left;
	margin:0;
	position:absolute;
	top:84px;
  	left:410px;
}
#text-content-gross3{
	padding:0;
	text-align:left;
	margin:0;
	position:absolute;
	top:118px;
  	left:470px;
}
#text-content-mittel{
	padding:0;
	text-align:right;
	margin:0;
	position:absolute;
	top:61px;
  	left:80px;
}
#text-content-mittel2{
	padding:0;
	text-align:left;
	margin:0;
	position:absolute;
	top:131px;
  	left:80px;
}
#text-content-mittel3{
	padding:0;
	text-align:left;
	margin:0;
	position:absolute;
	top:201px;
  	left:80px;
}
#text-content-klein{
	padding:10px;
	text-align:left;
	margin:0;
	position:absolute;
	top:40px;
  	left:10px;
  	font: 10px verdana, arial, sans-serif;
	color:#ffffff;
}
#text-content-klein-2{
	padding:10px;
	text-align:left;
	margin:0;
	position:absolute;
	top:90px;
  	left:10px;
  	font: 11px verdana, arial, sans-serif;
	color:#005f4f;

}

#text-copyright{
	padding:0;
	text-align:left;
	margin:0;
	position:absolute;
	bottom:17px;
  	left:50px;
}
#text-designby{
	padding:0;
	text-align:left;
	margin:0;
	position:absolute;
	bottom:17px;
  	right:50px;
}


#bild-start{
	padding:0;
	text-align:right;
	margin:0;
	position:absolute;
	top:35px;
  	right:15px;
  	z-index:1;
}

#bild-start-center{
	padding:0;
	text-align:center;
	margin:0;


}




.font-gross{
	font:bold italic 22px verdana, arial, sans-serif;
	color:#005f4f;
}
.font-gross2{
	font:bold italic 30px verdana, arial, sans-serif;
	color:#005f4f;
}
.font-mittel{
	font: bold 18px verdana, arial, sans-serif;
	color:#11cfff;
	font-weight: bold;
}
.font-klein{
	font:11px arial, verdana, arial, sans-serif;
	color:#FFFBF0;
	font-size: 12px;
	font-family: arial, verdana, arial, sans-serif;
}
.font-klein2{
	font:11px arial, verdana, arial, sans-serif;
	color:#11cfff;
	font-size: 13px;
	text-align: center;
	font-weight: bold;
	font-family: "Times New Roman", Times, serif;
	font-family: arial, verdana, arial, sans-serif;
}
.font-google-map{
	font:11px arial, verdana, arial, sans-serif;
	color:#000;
}
.font-google-map a{
	font:bold 11px arial, verdana, arial, sans-serif;
	color:#11cfff;
}
.font-mittel-fett{
	font:bold italic 12px verdana, arial, sans-serif;
	color:#11cfff;
	font-style: normal;
	font-size: 16px;
	text-align: center;
}


/*
////////////////////////////////////////////////////////////////
// Menü Formatierungen
////////////////////////////////////////////////////////////////
*/

  
/* Seitliche Linie und Hintergrundfarbe in allen U N T E R MENÜPUNKTEN */
div#nav ul {margin: 0px; padding:0px; background:#2e7db4;
	border: 0px solid #9ae3d9;}


/* Breite der Menüboxen im H A U P T MENÜ */
div#nav ul li{position: relative; left: 2px; list-style: none; margin: 0 4px;
  float: left;  width: 5em; line-height: 1em;
}
/* Breite der Menüboxen im U N T E R MENÜ */
div#nav ul ul li{position: relative; left: 0px; list-style: none; margin: 0;
  float: left;  width: 7.5em; line-height: 1em;
}
/* Breite der Menüboxen im 2. U N T E R MENÜ */
div#nav ul ul ul li{position: relative; left: 0px; top:0px;list-style: none; margin: 0;
  float: left;  width: 10.5em; line-height: 1em;
}



/* Alle Links im H A U P T MENÜ nehmen diesen Grafikhintergrund an bei mouseover */
div#nav li:hover {background-image: url(/grafiken/block_oben_1_bg.png); 
	position:relative;
	left: 2px;}

/* Alle Links in U N T E R MENÜ nehmen diesen Grafikhintergrund an bei mouseover */
div#nav li li:hover {background:black; background-image: url(./grafiken/block_oben_1_bg.png); 
	position:relative;
	left: 0px;}



/* Hintergrundfarbe der H A U P T MENÜPUNKTE */
div#nav li {background-color: none;}

/* Hintergrundfarbe der H A U P T MENÜPUNKTE, die selbst U N T E R MENÜPUNKT haben */
div#nav li.submenu {background-color: none;}

/* Hintergrundfarbe der H A U P T MENÜPUNKTE, die selbst U N T E R MENÜPUNKT haben bei hover*/
div#nav li.submenu:hover {background-color: none;}



/* padding fuer die H A U P T- und U N T E R MENÜPUNKTE */
div#nav li a {display: block; padding: 0.35em 0.5em 0.35em 0.5em;
  text-decoration: none; color:#ffffff; font: 11px  verdana, arial, sans-serif;}

/* Hack */
div#nav>ul a {width: auto;}

/* Breite der Untermenüblöcke */
/* 	display: none; bewirkt, dass die Untermüblöcke zunächst unsichtbar sind. 
		Erst bei hover über die Menüblöcke werden diese sichtbar mit display:block; siehe unten !!
*/
div#nav ul ul {position: absolute; left: 0px;
  display: none;}
  
/* Linie "unten" der Untermenüblöcke */
div#nav ul ul li {border-bottom: 0px solid #9ae3d9;}

/* Linie "unten" der 2.Untermenüblöcke */
div#nav ul ul ul li {border-bottom: 0px solid #999;}



/* Farbe des Untermenüs welches selbst weitere Untermenüs hat */
div#nav li.submenu li.submenu {background: none;}

/* Farbe bzw. Hintergrund des Untermenüs bei mouseover welches selbst weitere Untermenüs hat */
div#nav li.submenu li.submenu:hover {background-color: red; background-image: url(/grafiken/block_oben_1_bg.png);}

/* Elemente, die normalerweise neben einander stehen, dazu bringen, jeweils einen Zeilenumbruch zu erzeugen -> mit display:block; */
/*
	HTML unterscheidet zwischen Block- und inline Elementen. Erstere, zu denen <p>, <h> und <div> gehören, erzeugen einen eigenen Absatz, 
	während die anderen auch innerhalb eines Satzes einsetzbar sind, da sie keinen Zeilenumbruch bewirken, wie <a>, <img> und <span>.
  Dieses Verhalten kann man jedoch mit Hilfe der CSS-Eigenschaft display umdefinieren.
  Beispiel:
  	- mit display:inline wird ein block-Element dazu gebracht keinen zeilenukbruch zu erzeugen und
  	- mit display:block wird ein inline-element dazu gebracht einen zeilenumbruch zu erzeugen
  Beispiele siehe: http://www.stichpunkt.de/css/display.html
*/
div#nav ul.level1 li.submenu:hover ul.level2, 
div#nav ul.level2 li.submenu:hover ul.level3 {display:block;}




/* Rahmen und Abstände um Hauptmenüpunkte */
div#nav ul li {border: 0px solid #9ae3d9; margin-left: -3px; margin-top: -0px;}

/* Rahmen und Abstände um 1. Untermenüpunkte*/
div#nav ul ul li {border: 1px solid #999; margin-left: 0px; margin-top: -1px;}

/* Rahmen und Abstände um 2. Untermenüpunkte*/
div#nav ul ul ul li {border: 1px solid #999; margin-left: 0px; margin-top: -1px;}



/* Abstände des ersten Untermenüs vom Hauptmenüpunkt */
div#nav ul.level2 {top: 22px; left: -1px; }

/* Abstände des zweiten Untermenüs vom ersten Untermenüpunkt */
div#nav ul.level3 {top: 0px; left: 7.5em; }


/*
////////////////////////////////////////////////////////////////
// Formatierung der Formulare
////////////////////////////////////////////////////////////////
*/

input:hover, input:active {
   border: 1px dashed #999;

}
form  {
	width: 54em; /* Breite des Formulars */
	font-size: 1em;
	line-height: 120%; /* Zeilenabstand der Formularfelder */
	margin: 1em;
}
fieldset {
	border: solid 1px  #005f4f; /* Formularrahmen */
	background-color: #B5E3E0; /* Hintergrundfarbe Formular */
	
	padding: 10px; /* Abstand Felder vom Formularrahmen */
}
input, feld2 {
	display: block;
	float: left;
	width: 13em; /*Standardbreite der Formularfelder */
	border: 1px solid #4C8E81;; /* Rahmen um die Formularfelder */
	border-right: 1px solid #d8ffff; /* Rahmen um die Formularfelder */
	border-bottom: 1px solid #d8ffff; /* Rahmen um die Formularfelder */
	background: #d8ffff; /* Hintergrundfarbe der Formularfelder. Kommt nur zur Geltung, wenn kein Hintergrundbild definiert ist */
	background: url(./grafiken/formularschatten2.png) no-repeat left top; /* Hintergrundbild der Formularfelder (Schatteneffekt) */
	margin: 4px; /* Abstände der Formularfelder zueinander */
	padding: 4px 2px 2px 4px; /* Abstände der Formularfelder zueinander */
	font:11px verdana, arial, sans-serif; /* Font in den Formularfeldern */
}
#nummer {
	width: 4em;
}
#plz {
	width: 4em;
}
#strasse {
	width: 18em;
}
#ort {
	width: 18em;
}
#email {
	width: 20em;
}
br {
	clear: left;
	text-align: center;
}
label { 
	width: 9em; /* Breite der Feldbezeichnungen (Labels) */
	margin: 6px;
	padding: 1px;
	float:left; 
	text-align: right; /* Label direkt am Feld platzieren */
	font-weight: bold; /* Labelfont "fett" darstellen */
	color: #005f4f; /* Labelfarbe */
}
.submit, .reset, .file {
	background: none;
	background-color: #005f4f; /* Hintergundfarbe der Buttons */
	color: #061D2D; /* Schriftfarbe der Buttons */
	border: 1px solid #9ae3d9; /* Rahmen der Buttons */
	padding: 2px 2px 2px 2px; /* Randabstände Buttontext */
	width: 14em; /* Breite der Buttons */
}