/********************************************************************
  Definition einer allgemein gueltigen Erscheinungsweise
  Hier:		 Fuer alle Elemente innerhalb des Body Selektors
  Hintergrundfarbe in dezentem Grau
**********************************************************************/
body 			{
					background-color:	#EFF0F0;
          font-family: arial, sans-serif;
          text-align: left;
          font-size: 100.01%;
          color: #000;
				}

/*********************************************************************
  Definition einer allgemein gueltigen Erscheinungsweise
  Hier:		 Alle Eintraege in einer Tabelle bekommen
  eine Schriftfamilie zugewiesen. Dies muß auch im td-Selektor
  erfolgen, damit alle Browser die Einstellungen uebernehmen
**********************************************************************/

table {
  border-style: none;
  border-width: 0;
  padding: 0;
  margin: 0;
}

td {
	font-size: 81.25%;
  text-align: left;
}

form {
  padding: 0;
  margin: 0;
}

h4 {
  margin: 15px 0;
}

/*********************************************************************
  Definition einer allgemein gueltigen Erscheinungsweise
  Hier:		 Alle select-Felder bekommen Farbzuweisungen
**********************************************************************/
select 			{
					background-color:	#A0A7CC;
					color:				#000;
				}


a:link 			{
					color:				#00F;
					text-decoration:	none;
				}

a:visited 		{
					color:				#55F;
					text-decoration:	none;
				}

a:active 		{
					color:				#33F;
					text-decoration:	none;
				}
        
a:hover 			{
          color:				#FFF;
          background-color:	#00F;
}
        
#wholeHeader {
	margin: 0 auto; 
  width: 796px;
  padding: 0;
}

#headerImage {
  margin: 0px 148px;
	height: 70px;
  padding: 0;
  border-width: 0;
  border-style: none;
  position: relative;
}

#headerImage img {
  position: absolute;
}

#headerImage #edition {
  left: 65px;
}

#headerImage #firstTeam {
  left: 328px;
  top: 36px;
}

#headerImage #secondTeam {
  left: 370px;
  top: 36px;
}

img.logo {
  vertical-align: middle;
  border-style: none;
  border-width: 0;
}
    
img.userIcon {
  width: 20px;
  height: 19px;  
  vertical-align: middle;
  border-style: none;
  border-width: 0;
}
    
div.contentBox {
  text-align: center;
  margin: 20px 0 0 0;
}

div.tabgBlock {
  padding: 10px 0;
}

/*******************************************************************     			****login,anmeldung
  Name:				table.dkl
  Aktion: 		 	Formatierung aller Tabellen innerhalb der Klasse DKL
********************************************************************/
table.dkl {
					/*background-color:		#E0A77C;*/
					background-color:	#BBBBDD;
					width: 775px;
          margin: 0 auto;
				}
        
.dkl td {
          padding: 10px;
			}
      
.shout td {
  padding: 0;
  vertical-align: top;
  font-size: 100.01%;
}

.groupInfos td {
  font-size: 100.01%;
}

.shout .small {
  font-size: 76.92%;
  padding-top: 2px;
}

table.admin 		{
					/*background-color:		#E0A77C;*/
					background-color:	#BBBBDD;
					width:				60%;
				}

table.tabg, table.extra, table.rank {
					width:				775px;
					border-collapse: 	collapse;
          margin: 0 auto;
				}
        
table.ttable {
					border-collapse: 	collapse;
          margin: 0 auto;
				}
        
.rank td, .extra td {
  padding: 0;
}

.extra td td, 
.tabg td td, 
.tvgl td td, 
.ttable td td {
  font-size: 100.01%;
}

.stats td {
  font-size: 100.01%;
  padding: 0;
}

table.rankSingle {
	border-collapse: 	collapse;
  width: 100%;  
}

.rankSingle td{
  padding: 2px 4px;  
  font-size: 100.01%;
}

.rankSingle tr {
  height: 23px;
}

/* Extrawurst für IE6 & 7, BoxModell für die Zeilenhöhe */
*:first-child+html .rankSingle tr {
  height: 19px;
}
* html .rankSingle tr {
  height: 19px;
}
/*******************************************************************
  Name:				td.headline
  Aktion: 		 	Formatierung der Ueberschriften
  Gebraucht in:		login.html
********************************************************************/
td.headline  		{
					font-size:			125%;
					font-weight:		bold;
				}

/*******************************************************************                      ***-left
  Name:				table.one
  Aktion: 		 	Allgemeine Tabellenformatierung
  Gebraucht in:		left.html, login.html
********************************************************************/
table.one			{
				 	border-collapse:	collapse;
					text-align:			left;
					border-width:		0px;
					background-color:	#EFF0F0;
				}

/*******************************************************************
  Name:				td.leftEven
  Aktion: 		 	Abwechselde Formatierung von Tabellenzeilen
  Gebraucht in:		Tabelle in login.html, login_links.html
********************************************************************/
td.leftEven		{
					/*background-color:		#E09060;*/
					background-color:	#CCCCDD;
					text-align:			left;
					text-transform:		uppercase;
				}

/*******************************************************************
  Name:				td.leftOdd
  Aktion: 		 	Abwechselnde Formatierung von Tabellenzeilen
  Gebraucht in:		Tabelle in login.html, login_links.html
********************************************************************/
td.leftOdd		{
					/*background-color:		#E0A77C;*/
					background-color:	#BBBBDD; 
					text-align:			left;
					text-transform:		uppercase;
				}

/*******************************************************************   
  Gebraucht in:		Tabelle in tippabgabe
********************************************************************/
td.termin		{
					width:				130px;
					text-align:			left;
				}

td.match_home	{
					width:				210px;
					padding-left:		15px;
					padding-right:		5px;
					text-align:			left;
				}

td.match_guest	{
					width:				210px;
					padding-left:		5px;
					padding-right:		15px;
					text-align:			left;
				}

td.home			{
					width:				40px;
					text-align:			right;
				}

td.vs			{
					width:				9px;
					text-align:			center;
				}

td.guest			{
					width:				40px;
					text-align:			left;
				}

td.joker		{
					width:				60px;
					text-align:			center;
				}

td.quoten		{
					width:				40px;
					text-align:			center;
				}

				
.extra td.tippgegenstand,
.extra td.abgabetermin,
.extra td.tipp {
  padding: 2px 6px;
}
        
        
/*******************************************************************  
  Gebraucht in:		Tabelle in tippvergleich
********************************************************************/
td.matches, td.tips		{
				  text-align:			center;
          width: 75px;
				}
        
td.tipsWithPoints		{
				   	text-align:			center;
          width: 50px;
				}   	
        
.tvgl .standard td.tipsWithPointsQuot		{
				   	text-align:			center;
          width: 48px;
          padding-right: 0px;
				}  
        
td.jokertips		{
				  text-align:			center;
					font-weight:		bold;
          width: 75px;
				}
        
td.jokertipsWithPoints {
				  text-align:			center;
					font-weight:		bold;
          width: 50px;
				}  

.tvgl .standard td.jokertipsWithPointsQuot {
				  text-align:			center;
					font-weight:		bold;
          width: 48px;
          padding-right: 0px;
				}             

.tvgl td.jokerpoints	{
				  text-align:			center;
					font-weight:		bold;
					color:				#00F;
          width: 23px;
				}
        
.tvgl .standard td.jokerpointsQuot		{
					text-align:			right;
					font-size:			92.31%;
					font-weight:		bold;
					color:				#00F;
          width: 27px;
          padding-left: 0px;
}

td.gesPoints   	{
				  text-align:			right;
          width: 75px;
				}

td.gesHead		{
				  text-align:			center;
					color:				#fff;
          width: 32px;
				}

td.gesFoot		{
				  text-align:			left;
					color:				#000;
          width: 136px;
				}

td.gesScore		{
				  text-align:			right;
					color:				#00F;
          width: 40px;
				}

td.gesGes		{
				  text-align:			right;
          width: 30px;
				}

td.userScore	{
				  text-align:			right;
					color:              #00F;
          width: 40px;
				}

td.matchesHead	{
					text-align:			left;
          width: 180px;
				}

.tvgl td.quotesBef1	{
					text-align:			left;
					font-size:			84.62%;
					color:				#fff;
          width: 23px;
				}

.tvgl td.quotesBef2	{
					text-align:			center;
					font-size:			84.62%;
					color:				#fff;
          width: 23px;
				}

.tvgl td.quotesBef3	{
					text-align:			right;
					font-size:			84.62%;
					color:				#fff;
          width: 23px;
				}

.tvgl td.quote			{
					text-align:			left;
					font-size:			84.62%;
					color:				#fff;
          width: 23px;
				}

td.results		{
					text-align:			center;
					color:				#fff;
          width: 50px;
				}
    
td.resultsWithoutQ		{
					text-align:			center;
					color:				#fff;
          width: 75px;
				}    

td.resultsHead	{
					text-align:			left;
					color:				#fff;
          width: 180px;
				}

.tvgl td.points		{
					text-align:			center;
					color:				#00F;
          width: 23px;
				}
        
.tvgl .standard td.pointsQuot		{
					text-align:			right;
					font-size:			92.31%;
					color:				#00F;
          width: 27px;
          padding-left: 0px;
				}
        
.userGes 		{ 
					text-align: right; 
          width: 32px;
				}

/*******************************************************************  
  Gebraucht in:		Tabelle in ranking, tippvergleich
********************************************************************/
td.user			{
				   	text-align:			left;
          width: 136px; 
				}

.tvgl td.user  {
          white-space: nowrap;   
}       
        
td.rank			{
				   	text-align:			right;
          width: 20px;
				}

.tvgl td.oldrank		{
				   	text-align:			right;
					font-size:			84.62%;
          width: 20px;
				}

td.subhead		{
					background-color:	#505750;
					color:				#fff;
					font-size:		112.5%;
					text-align:		left;
          padding: 3px;
          text-align: center;
}

td.score			{
					text-align:		right;
					color:				#00F;
				}

/*----------------------------------------------------------
		Allgemeine Klassendefinitionen zur
		Seitenformatierung
-----------------------------------------------------------*/
/***********************************************************                         *********   login
  Name:				HEADER
  Aktion: 		 	Formatierung der Überschriften in
  					Tabellenueberschriften
  Gebraucht in:		login.html, login_links.html
***********************************************************/
.header			{
					border-style:			none;
					background-color:		#505750;
					color:					#fff;
					text-transform:			uppercase;
				}

.tabg .header, .extra .header	{
					font-weight:			bold;
					padding:           		2px 6px;
					text-transform:			none;
				}

.tabg .headerRight	{
					border-style:			none;
					background-color:		#505750;
					color:					#fff;
					text-transform:			uppercase;
					font-weight:			bold;
					padding:           		2px 6px;
					text-transform:			none;
					text-align:			right;
				}


/***********************************************************                         *****tippvergleich

  Name:				TVGL und Unterklassen EVENROW, ODDROW
  					EVENCOL
  Aktion: 		 	tvgl: Festlegen von Formaten speziell fuer
  						  die Seite Tippvergleich
					Evenrow, ...: Spalten~, Zeilenformate
					Farbgebung abwechselder Zeilen, Spalten
  Gebraucht in:		Tabelle in tippvergleich
***********************************************************
.tvgl .evenrow			{background-color:	#B0C7D0;}
.tvgl .oddrow			{background-color:	#EFF0F0;}
.tvgl .evenrow .evencol		{background-color: 	#E09060;}
.tvgl .oddrow .evencol		{background-color:	#E0A77C;}*/

table.tvgl {
  border-collapse: collapse;
  margin: 0 auto;  
}

table.legend {
  margin: 0 auto;  
}

table.standard {
  border-collapse: collapse;
  padding: 1px;
  width: 100%;
}

.tvgl td	{ 
  padding: 0; 
}

.tvgl tr 	{ 
  height: 23px; 
}

.tvgl .standard td {
  white-space: nowrap;
  padding: 2px;
}

/* Extrawurst für IE6 & 7, BoxModell für die Zeilenhöhe */
*:first-child+html .tvgl tr {
  height: 19px;
}
* html .tvgl tr {
  height: 19px;
}

.tvgl .evenrow .evencol		{ background-color: #A0A7CC; }
.tvgl .oddrow .evencol		{ background-color:	#BBD; }

.tvgl .evenrow .oddcol		{ background-color:	#BBD; }
.tvgl .oddrow .oddcol		{ background-color:	#CCD; }

.tvgl .evenrow .headcol     	{ background-color:	#BBD; }
.tvgl .oddrow .headcol      	{ background-color:	#CCD; }

.tvgl .evenrow .footcol    	{ background-color:	#A0A7CC; }
.tvgl .oddrow .footcol      	{ background-color:	#BBD; }

.tvgl .userrow .evencol		{ background-color: #88F; }
.tvgl .userrow .oddcol		{ background-color: #99F; }
.tvgl .userrow .headcol		{ background-color: #99F; }
.tvgl .userrow .footcol		{ background-color: #88F; }
				

/***********************************************************
  Name:				HEADROW und Unterklassen HEADCOL, EVENCOL
  					ODDCOL, RESULTSHEAD
  Aktion: 		 	Festlegung von Formaten fuer den Tabellenkopf
  Gebraucht in:		Tabelle in tippvergleich
  Anm.:				--
***********************************************************/
.headrow          	{
					background-color:	#A0A7CC;
				}

.headrow1		{
					border-style:		none;
          background-color:	#505750;
          color:				#fff;
					text-transform:		uppercase;
				}

.headrow1 .top     {	color:				#fff;
                    text-align:			left;
				}

.headrow1 .cont   {
					color:				#fff;
          text-align:			center;
				}

.centern             	{
					text-align:			center;
				}

.evenrow		{
					background-color:	#BBBBDD;
				}

.oddrow			{
					background-color:	#A0A7CC;
				}
        
.userrow			{
					background-color:	#88f;
				}

.tabg .evenrow, 
.tabg .oddrow	{
					height:				36px;
				}

/****************************************************************ranking
  Name:				EVENROW, ODDROW, EVENCOL
  Aktion: 		 	Darstellung und optische Trennung von
  					Tabellenspalten und Zeilen
  Gebraucht in:		        ranking, tippvergleich, tippabgabe
  Anm.:				Farbliche Trennung dunkel/hell Orange
***********************************************************/
/*.evenrow .evencol		 	{background-color: 	#E09060;}*/
/*.oddrow .evencol		  	{background-color: 	#E0A77C;}*/
/*oddrow .oddcol				{background-color:	#CCCCDD;}*/

.oddrow .evencol		  	{ background-color: #A0A7CC; }
.oddrow .oddcol			{ background-color:	#A0A7CC; }

.evenrow .evencol		{ background-color: #BBD; }
.evenrow .oddcol			{ background-color:	#BBD; }

.userrow .evencol		{ background-color: #88F; }
.userrow .oddcol			{ background-color: #99F; }


 /***********************************************************
  Name:				footrow
  Aktion: 		 	Formatierung der Gesamtpunktzahl
  Gebraucht in:		Tabelle in ranking, tippvergleich
  Anm.:				--
***********************************************************/
.footrow		{
					background-color:	#A0A7CC;
				}

/***********************************************************
  Name:				HEADERB
  Aktion: 		 	Formatierung von Ueberschriften
  Gebraucht in:		Tabelle in ranking, tippvergleich
  Anm.:				Die Eigenschaft width wird nicht
  					von allen Browsern unterstuetzt
***********************************************************/
.headerB		{
				   	background-color:	#B0C7D0;
				   	color: 				#fff;
				   	border-style:		none;
				   	text-transform:	 	uppercase;
				}

/***********************************************************
  Name:				RANK und Unterklassen POS, SCORE; EVENROW
  Aktion: 		  	Formate fuer die Tabellendarstellung
  Gebraucht in:		ranking.html
  Anm.:				Die Eigenschaft width wird nicht
  					von allen Browsern unterstuetzt
***********************************************************/
.rank .score 	{
					text-align:			right; 
          width: 45px;
				}

.rank .pos		{
				 	text-align:			right;
          width: 25px;
				}
        
.rank .user {
          width: 157px;
				}

.ttable .pos    		{ text-align: center; }
.ttable .team   		{ text-align: left;	}
.ttable .win    		{ text-align: center; }
.ttable .tie    		{ text-align: center; }
.ttable .loose  		{ text-align: center; }
.ttable .goals  		{ text-align: center; }
.ttable .diff   		{ text-align: center; }
.ttable .tpoints 	{ text-align: center; }

.adm_c 				{ 
  text-align: center; 
}

.popup 				{ 
  text-decoration: none;
}
              
.hasSymbols {
  vertical-align: middle;
}              
              
img.emblem_front	{
					/*border: 0px;*/
					vertical-align: 	middle;
					margin-right: 		5px;
				}
        
span.teamName {
  vertical-align: 	middle;
}

span.joker_top	{
					position:			relative;
					top:				2px;
					font-size:			7pt;
					font-weight:		bold;
				}

input.joker_bot		{
					position:			relative;
					top:				-1px;
				}

span.quotes_top	{
					position:			relative;
					top:				0px;
					font-size:			7pt;
					font-weight:		bold;
				}

span.quotes_bot	{
					position:			relative;
					top:				-1px;
				}
        
td.resultBoxImg {
          text-align: center;
          vertical-align: top;
          width: 64px;
          padding: 13px;
          }
          
td.resultBoxText {
          vertical-align: top;
          padding-right: 10px;
}

.resultBoxText h3 {
  margin-top: 5px;
  font-size: 123.08%;
}

/*********************************************************************
  Tooltips
**********************************************************************/

.tip { 
  cursor:default; 
}

a.tip,
a.tip:link,
a.tip:visited,
a.tip:active { 
  color: #616161; 
  text-decoration: none; 
  position: relative; 
}

a.tip:hover { 
  background: transparent; 
  z-index: 100; 
}

a.tip span { 
  display: none; 
  text-decoration: none; 
}

a.tip:hover span {
  display: block;
  position: absolute;
  top: 32px;
  right: 42px;
  width: 500px;
  z-index: 100;
  color: #2f2f2f;
  padding: 5px 10px;
  background-color: #ebebeb;
  text-align: left;
  border-color: #505750;
  border-style: solid;
  border-width: 4px 4px; 
}

a.tip:hover span.left {
  left: 10px;
  width: 550px;
}

/*********************************************************************
 Navigation
**********************************************************************/

#topNav {
	display: table;
	list-style-type: none;
	list-style: none;
	border-top: 5px solid #eee;
	white-space: nowrap;
	padding: 0;
	margin: 0 0 0 10px;
}

#topNav li {
	display: table-cell;
	float: left;
	text-align: center;
	margin: 0 -20px 0 0;
	padding: 0;
}

#topNav a {
	display: block;
	text-decoration: none;
}

#topNav em {
	font-style: normal;
	display: block;
	padding: 0 7px;
	height: 25px;
	background-color: #bbd;
	float: left;
	cursor: pointer;
	color: #00f;
	font-weight: bold;
	font-size: 1em;
	line-height: 25px;
}

#topNav .inactive em {
  color:#808380;
  cursor:default;
}

#topNav b, 
#topNav span {
  cursor: pointer; 
  display: block; 
  width: 0; 
  overflow: hidden; 
  float: left; 
  background-color: #bbd;
}

#topNav span {
  height: 0; 
  border-top: 25px solid #bbd; 
  border-right: 25px solid #eee;
}

#topNav b.p1,
#topNav b.p2,
#topNav b.p3,
#topNav b.p4,
#topNav b.p5 {
  border-top: 5px solid #eee; 
  border-right: 5px solid #bbd;
}

#topNav b.p1 {
  height: 0; 
  margin-top: 20px;
}
#topNav b.p2 {
  height: 5px; 
  margin-top: 15px;
}
#topNav b.p3 {
  height: 10px; 
  margin-top: 10px;
}
#topNav b.p4 {
  height: 15px; 
  margin-top: 5px;
}
#topNav b.p5 {
  height: 20px;
}
#topNav b.p7 {
  border-bottom:2px solid #eee; 
  border-left:20px solid #bbd; 
  height:15px;
}

#topNav a.selected em {
  color: #fff; 
  background-color: #505750;
}

#topNav a.selected b.p1,
#topNav a.selected b.p2,
#topNav a.selected b.p3,
#topNav a.selected b.p4,
#topNav a.selected b.p5 {
  border-right-color:#505750; 
  background-color: #505750;
}

#topNav a.selected span {
  border-top-color:#505750;
}

#topNav .inactive:hover b, 
#topNav .inactive:hover em, 
#topNav .inactive:hover span {
  cursor:default;
}

#topNav a:hover em {
  color: #fff; 
  background-color: #88f;
}

#topNav a:hover b.p1,
#topNav a:hover b.p2,
#topNav a:hover b.p3,
#topNav a:hover b.p4,
#topNav a:hover b.p5 {
  color: #fff; 
  border-right-color:#88f; 
  background-color: #88f;
}

#topNav a:hover span {
  color: #fff; 
  background-color: #88f;
  border-top-color: #88f;
}

#navLine {
  width: 775px;
  height: 5px;
  background-color: #505750;
  margin: 0 0 0 10px;
}

* html #navLine { /* für IE6: Line ist sonst 6 Pixel zu hoch... */
  line-height: 0;
  margin: 0 0 -6px 10px;
}

#subNav {
	list-style-type: none;
  text-align: center;
  padding: 0;
  margin: 0;
  line-height: 22px;
}

* html #subNav { /* ansonsten wird im IE6 die halbe untere Menuzeile verdeckt, wenn oben gehovert wird */
  height: 25px;
}

#subNav li {
  display: inline;
  background-color: #bbbebb;
  padding: 0;
  margin: 0 2px;
}

#subNav a {
  text-transform: uppercase;
  background-color: #bbbebb;
  padding: 4px 15px;
  margin: 0; 
  text-align: center;
  font-style: normal;
	color: #000;
	font-size: 0.8em; 
  font-weight: bold;
}

#subNav .selected a {
  color: #fff;
  background-color: #808380;
}

#subNav a:hover {
  color: #fff; 
  background-color: #505750;
}

#datenschutz {
  text-align: right;
  margin-top: -6px;
  margin-bottom: -14px;
  margin-right: 11px;
}

#datenschutz a {
	font-size: 0.8em; 
  font-weight: bold;
  text-decoration: underline;
  cursor: pointer;
}

#datenschutz a:link 			{
	color:				#000;
}

#datenschutz a:visited 		{
	color:				#000;
}

#datenschutz a:active 		{
	color:				#000;
}
        
#datenschutz a:hover 			{
  color:				#FFF;
  background-color:	#000;
}