/********************************************************/
/*	Dieses CSS-Stile-Sheet generiert ein 3-spaltiges 	*/
/*	floating Design with absolut positioning. 			*/
/********************************************************/	

body {
	margin: 0; /*Banner ist ganz oben und ganz links */
	padding:0; /*Banner ist ganz oben und ganz links */
	font-size: 80%;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background-color: #EBEDFE;
} 

/*Creating the "You are here"-Links*/
body#Home a#HomeLink,
body#Logbook a#LogbookLink,
body#Logmap a#LogmapLink,
body#Project a#ProjectLink,
body#Crew a#CrewLink,
body#Yacht a#YachtLink,
body#Guestbook a#GuestbookLink,
body#Contact a#ContactLink,
body#Register a#RegisterLink,
body#PR a#PRLink,
body#Reise a#ReiseLink,
body#News a#NewsLink,
body#Media a#MediaLink,
body#Links a#LinksLink,
body#Help a#HelpLink,
body#TermsOfUse a#ToULink,				
body#Login a#LoginLink{			
	/*Login for Position Report*/
	background-image: url(/tw/img/conrol_panel/Swich_on_red_72x34.gif);
	background-repeat: no-repeat;
}

/*Voreinstellung fuer alle Schriften*/
h1, h2, h3, h4, h5, h6 p, ul {
	margin:0;
	padding-top: 0.1em;
	padding-bottom: 0.1em;
}
/*Farbe der Ueberschriften*/
h1, h2, h3, h4, h5, h6 {
	color: #506BB1; /*hellblau*/
}
/*Bilde haben keine Rahmen*/
img {
	border: none;
}
	
#all_wrapper{
	margin: 0; /*Banner ist ganz oben und ganz links */
	padding:0; /*Banner ist ganz oben und ganz links */
	width:100%;
	min-width:1000px;
	max-width:1300px;
}

* html #all_wrapper{
	width:1000px;	/*IE bekommt feste Breite*/
	margin:0 auto;
}

#content_wrapper{
	float:left;
	clear:both;
	position:relative; /*Vorbereitung fuer absolute Positionierung */
	width:100%;
	margin-top: 5px;
}

/*************************************************************************/
/************** Definition des Aussehens des Banners *********************/
/*************************************************************************/

#banner{
	position:relative; /*zur absoluten Positionierung der Pics im Banner */
	width:100%;
	height:100px;
	border:none;
	background-image: url(../img/banner/Main_Banner.jpg);
	background-repeat: no-repeat;
	background-position: right;
	background-color: #FFFFFF;
}
/*Das Aussehen verschiedener Schriften im Div: Banner*/
#bannerh1, 
#bannerh2, 
#bannerh3, 
#bannerh4 {
	padding-left: 215px;
	padding-bottom: 10px;
	line-height: 1.0em;
}


#banner #logo{
	position:absolute;
	background-image: url(../img/tw_logos/Logo_white_75x88.gif);
	background-repeat: no-repeat;
	width:100px;
	height:90px;
	left: 10px;
	top: 5px;
}
#banner #olb_text{
	position:absolute;
	background-image: url(../img/tw_logos/TW_text_300x53_w.gif);
	background-repeat: no-repeat;
	width:300px;
	height:53px;
	left: 210px;
	top: 5px;
}
/*************************************************************************/
/*** Definition des Aussehens der Auswahl der Sprache                  ***/
/*************************************************************************/
#language {
	position: absolute;
	top: 5px;
	right: 350px;
	width:100px;
	margin-top: 0px; /*Der Abstan wird durch margin-bottom in nav_tab eingestellt */
	margin-left: 5px;
}

#language ul {
	list-style-type: none; /*Keine Bullets */
	padding: 0px;
	margin: 0px;
}
#language li {
	display: inline;/* Hacks for IE-Bugs */
}
/* Control Panel Text Style */
#language a {
	font-size: 0.8em;
	/*text-transform: uppercase;*/
	text-decoration: none;
	display: block;			/*Alle Tasten gleich breit und alles wird clickable */
	color: #999999;
	margin-top: 3px;
	padding-right: 10px;
	padding-left: 50px;
}

#language #DE  {
	height:19px;
	background-image: url(/tw/img/symbole/general/german_flag_all3_30x20.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
	
#language #EN {
	height:19px;
	background-image: url(/tw/img/symbole/general/british_flag_all3_30x20.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}

#language #traget a {
	background-position: 0px -19px;
	color: #CCCCCC;
}

#language #traget a:hover{
	background-position: 0px -38px;
	color: #FFFFFF;	
}

* html #language a {
	height: 1px;
}
/*************************************************************************/
/*** Definition des Aussehens von nav_tab ( unter dem Banner)          ***/
/*************************************************************************/
#nav_tab {
	width:100%;
	font-size:93%;
	line-height:normal;
	position: absolute;
	left: 0px;
	bottom: 0px;
}
#nav_tab ul {
	margin:0;
	list-style:none;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 210px;
}
#nav_tab li {
      display:inline;
      margin:0;
      padding:0;
}
#nav_tab a {
      float:left;
      background:url("/tw/img/topNav/topNav_all3_left.gif") 	  no-repeat left top;
      margin:0;
      padding:0 0 0 9px;
      border-bottom:1px solid #765;
      text-decoration:none;
}
#nav_tab a span {
      float:left;
      display:block;
      background:url("/tw/img/topNav/topNav_all3_right.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      font-weight:bold;
      color:#765;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav_tab a span {float:none;}
    /* End IE5-Mac hack */
#nav_tab a:hover span {
      color: #333000;
}
#nav_tab #current a {
      background-position:0 -100px;
      border-width:0;
}
#nav_tab #current a span {
      background-position:100% -100px;
      padding-bottom:5px;
      color:#506BB1;
}
#nav_tab a:hover {
      background-position:0% -200px;
}
#nav_tab a:hover span {
      background-position:100% -200px;
}
/*************************************************************************/
/*** Definition des Aussehens von logbuchname ( unter dem Banner)          ***/
/*************************************************************************/
#logbuchname {
	line-height:normal;
	position: absolute;
	left: 211px;
	bottom: 9px;
	color:#CCCCCC;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 20px;
}
#logbuchname span {
	font-size: 20px;
	color: #FFFFFF;
	font-weight:bolder;
}

/************************************************************************/
/*** 			Definition des Aussehens von Main			          ***/
/************************************************************************/  
#main{
	margin-left:210px;
	margin-right:210px;
}	
#main #end_marker{
	height:80px;
	background-image:url(/tw/img/tw_logos/Logos_blue_small.gif);
	background-repeat:no-repeat;
	background-position: center;
	margin-top:30px;
}
/*Links rechts oben */
#main #mainlinks {
	float: right;
}
/************************************************************************/
/*** 			Definition des Aussehens der linken Spalte	          ***/
/************************************************************************/  
#col_wrapper_left{
	position:absolute;
	top:0px;
	left:0;
	width:200px;
	margin-left:3px;
}
/*************************************************************************/
/***			  Contorl Panel (nav_panel) 						   ***/
/*************************************************************************/
#nav_panel {
	clear:both;
	float:left;
	width:200px;
	padding:0px;
	margin:0px;
	border-bottom-color: #999;
}
/* Oberes Bild des Navigations-Controls */
#nav_panel #panel_top{
	height:50px;
	background-image:url(/tw/img/conrol_panel/Panel_Top_200x50.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
/* Unteres Bild des Navigations-Controls */
#nav_panel #panel_bot{
	height:50px;
	background-image:url(/tw/img/conrol_panel/Panel_Bot_200x50.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

/* Standard TW-Menu mit vertikaler Ausrichtung*/
#nav_panel ul {
	list-style-type: none; /*Keine Bullets */
	padding: 0px;	
	margin:0px;
	background-image: url(/tw/img/conrol_panel/Panel_Mid_200x50.gif);
	background-repeat: repeat-y;
}
#nav_panel li {
	display: inline;/* Hacks for IE-Bugs */
}
/* Control Panel Text Style */
#nav_panel a {
	font-size: 1em;
	/*text-transform: uppercase;*/
	text-decoration: none;
	display: block;			/*Alle Tasten gleich breit und alles wird clickable */
	color: #FFFFFF;
	background-image: url(/tw/img/conrol_panel/Swich_off_72x34.gif);
	background-repeat: no-repeat;
	background-position: 10px;
	padding-top: 15px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 90px;
	font-weight: bolder;	
}

#nav_panel a:hover {
	background-image: url(/tw/img/conrol_panel/Switch_on_orange_72x34.gif);
	background-repeat: no-repeat;
}

* html #nav_panel a {
	height: 1px;
}

/************************************************************************/
/*** 			Definition des Aussehens der rechten Spalte	          ***/
/************************************************************************/  
#col_wrapper_right{
	position:absolute;
	top:0px;
	right:0;
	width:200px;
	margin-right:3px;
}

/*************************************************************************/
/***			Linker und Rchter Side Bar 						   	   ***/
/*************************************************************************/

/* Hier wird das verhalten des SideBars auf der rechten Seite definiert */
.side_bar{
	float:left;
	width: 200px;
}
/*Ueberschriften fuer side_bar definieren*/
.side_bar .top h1, 
.side_bar .top h2, 
.side_bar .top h3, 
.side_bar .top h4,
.side_bar .bot h1, 
.side_bar .bot h2, 
.side_bar .bot h3, 
.side_bar .bot h4
{
	color:#FFFFFF;
	margin: 0px;
	text-align:center;
}

/*Text fuer side_bar definieren*/
.side_bar p{
	margin: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
	font-size: 0.8em;	
}

.side_bar .top {
	height:30px;
	background-image:url(/tw/img/side_bars/side_bar_blue_top.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 0px;
	margin: 0px;
	padding-top: 10px;
	padding-left: 0px;
	color: #FFFFFF;
}
.side_bar .mid {
	margin: 0px;
	background-image: url(../img/side_bars/side_bar_mid.gif);
	background-repeat:repeat-y;
	background-position: left 0px;
	padding-top: 10px;
	padding-right: 3px;
	padding-bottom: 10px;
	padding-left: 3px;
}

.side_bar .bot {
	height:30px;
	background-image:url(/tw/img/side_bars/side_bar_blue_bot.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0px;	
	margin: 0px;
}
/************************************************************************/
/*** 			Definition des Aussehens von Tasten  		          ***/
/************************************************************************/  
 
 .key100x20 a{
	background-image: url(/tw/img/keys/key100x20.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	display: block;
	width:100px;
	height:20px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: capitalize;
	color: #FFFFFF;
	font-size: 1.2em;
	font-weight: bold;
	text-align:center;
	
}

.key100x20 a:hover {
	background-image: url(/tw/img/keys/key100x20.gif);
	background-repeat: no-repeat;
	background-position: 0px -20px;
}

.key80x20 a{
	background-image: url(/tw/img/keys/key80x20.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	display: block;
	width:80px;
	height:20px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: capitalize;
	color: #FFFFFF;
	font-size: 1.2em;
	font-weight: bold;
	text-align:center;
	
}

.key80x20 a:hover {
	background-image: url(/tw/img/keys/key80x20.gif);
	background-repeat: no-repeat;
	background-position: 0px -20px;
}
.key60x20 a{
	background-image: url(/tw/img/keys/key60x20.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	display: block;
	width:60px;
	height:20px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: capitalize;
	color: #FFFFFF;
	font-size: 1.2em;
	font-weight: bold;
	text-align:center;
	
}

.key60x20 a:hover {
	background-image: url(/tw/img/keys/key60x20.gif);
	background-repeat: no-repeat;
	background-position: 0px -20px;
}
.key40x20 a{
	background-image: url(/tw/img/keys/key40x20.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	display: block;
	width:40px;
	height:20px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: capitalize;
	color: #FFFFFF;
	font-size: 1.2em;
	font-weight: bold;
	text-align:center;
	
}

.key40x20 a:hover {
	background-image: url(/tw/img/keys/key40x20.gif);
	background-repeat: no-repeat;
	background-position: 0px -20px;
}

.key20x20 a{
	background-image: url(/tw/img/keys/key20x20.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	display: block;
	width:20px;
	height:20px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: capitalize;
	color: #FFFFFF;
	font-size: 1.2em;
	font-weight: bold;
	text-align:center;
	
}

.key20x20 a:hover {
	background-image: url(/tw/img/keys/key10x20.gif);
	background-repeat: no-repeat;
	background-position: 0px -20px;
}


/************************************************************************/
/*** 			Definition des Aussehens des Footers		          ***/
/************************************************************************/  
#footer {
	height:20px;
	margin-left:210px;
	margin-right:210px;
	color: #FFFFFF;
	background-repeat: repeat-x;
	background-image: url(/tw/img/bars/Bar_blue.gif);
	text-align:center;
}
