/****************************************************************/
/*   Design:   Multiflex-4.2 / Layout-3                         */
/*   File:     Global layout structure                          */
/*--------------------------------------------------------------*/
/*   Design:   www.1234.info                                    */
/*   Date:     January 20, 2008                                 */
/*--------------------------------------------------------------*/
/*   License:  Fully open source without restrictions.          */
/*             Please keep footer credits with the words        */
/*             "Design by 1234.info". Thank you!                */
/****************************************************************/

/*-------------------------------------------------------------------------------*/
/* If you are interested in adopting the new header in Multiflex-4 for your      */
/* existing website using Multiflex-3, here are the instructions how to do it:   */
/*                                                                               */
/* A. CSS Code                                                                   */
/*    1. Replace your current Multiflex-3 CSS setup file with this file.         */
/*                                                                               */
/* B. HTML Code                                                                  */
/*    1. Open the Multiflex-4 HTML file corresponding to your Multiflex-3 file.  */
/*    2. Copy the indicated HTML lines as instructed in the code.                */
/*    3. Paste the copied HTML lines into your Multiflex-3 file.                 */
/*                                                                               */
/* C. IMAGE files                                                                */
/*    1. Copy the the following five files from the Multiflex-4 image directory  */
/*       to your current image directory for Multiflex-3:                        */
/*       - "bg_head_corner_topleft_25px.gif"                                     */ 
/*       - "bg_head_corner_topright_25px.gif"                                    */
/*       - "flag_greatbritain.png"                                               */
/*       - "flag_germany.png"                                                    */
/*       - "flag_sweden.png"                                                     */
/*                                                                               */
/* D. Your new header is now ready for operation!                                */
/*-------------------------------------------------------------------------------*/

/************/
/*  GLOBAL  */
/************/

/* NON-HEADER */
*, body{padding:0; margin:0;}
 body {font-size:62.5%; background-color:#FFFFFF; font-family:verdana,arial,sans-serif;} /*Font-size: 1.0em = 10px when browser default size is 16px*/
 #shadow_wrapper { margin:5px auto; width: 1000px; background-image:  url('../img/bg_shadow.png'); background-repeat: repeat; z-index: 1; }
.page-container { margin:0px 13px; margin-top:10px; margin-bottom:10px; font-size:1.0em;}
.main {clear:both; width:974px; padding-bottom:30px; background:transparent url(../img/bg_main_reverse.gif) top left repeat-y;}
.main-navigation {display:inline /*Fix IE floating margin bug*/; float:left; width:200px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/; background:rgb(245,245,245);}
.main-content {display:inline; /*Fix IE floating margin bug*/; float:right; width:690px; margin:0 55px 0 0; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}
#border_top {margin: 0; width:1000px;  overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}
#footer {clear:both; margin: 0; width:1000px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}
.footer { width:974px; margin:0px auto; padding:0.5em 0 2.0em 0; font-size:1.0em; border-top:solid 1px rgb(175,175,175); overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}

/* HEADER */
.header {clear:both; width:974px; z-index: 1; margin-bottom: 40px;}
.header-banner {clear: both; height:90px;  margin: -1px 0 0 0; border-bottom:solid 1px rgb(175,175,175); overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/; background-image: url(../img/wetternetz.jpg); background-repeat: no-repeat; background-position: right;}
.header-nav {clear: both; background-color:#E0E9FE;}

/*************/
/*  2. HEAD  */
/*************/
.sitelogo {float: left; width:125px; height:80px; padding-right: 20px; z-index:9999; margin:10px 0 0 10px;  overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/; background:url(../img/logo_wetternetz.png); background-repeat: no-repeat;}
.sitename {z-index:1; padding-top: 10px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}
.sitename h1 {font-weight:normal; font-size:240%;}
.sitename h2 {font-weight:normal; font-size:120%;}
.sitename a{text-decoration:none; color:rgb(125,125,125);}
.sitename a:hover {text-decoration:none; color:rgb(125,125,125);}
.breadcrumbs {margin: 15px 0 0 -20px;}

.nav0 {width:100px; position:absolute; z-index:2; margin:5px 0 0 0; margin-left:870px !important /*Non-IE6*/; margin-left:873px /*IE6*/; background-color:#E0E9FE;}
.nav0 ul {float:right; padding:0 20px 0 0;}
.nav0 li {display:inline; list-style:none;}
.nav0 li a {padding:0 0 0 3px; color:rgb(100,100,100);}
.nav0 a:hover {text-decoration:none;}


/*Haupt menu*/
.nav1 {white-space:nowrap /*IE hack*/; width:100%; height:25px; border-bottom:1px solid #AFAFAF; color:rgb(100,100,100); font-size:12px; background-color:#E0E9FE;} /*Color navigation bar normal mode*/
.nav1 ul {list-style-type:none; background-color:#E0E9FE;}
.nav1 ul li {float:left; z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; border-right:solid 1px rgb(175,175,175); width: 135px;}
.nav1 ul li a {float:none !important /*Non-IE6*/; float:left /*IE-6*/; display:block; height:2.1em; line-height:2.1em; padding:0 16px 0 16px; text-decoration:none; font-weight:normal; color: rgb(100,100,100);}
.nav1 ul li.activ {background-color: #96CAFA; color: rgb(100,100,100); }

.nav1 ul li, .nav1 ul li:hover a {background-repeat: no-repeat; background-position:  90px -11px;}
.nav1 ul li.pool_01, .nav1 ul li.pool_01:hover a {background-image:url(../img/pool_01_tn.png); }
.nav1 ul li.pool_02, .nav1 ul li.pool_02:hover a {background-image:url(../img/pool_02_tn.png); }
.nav1 ul li.pool_03, .nav1 ul li.pool_03:hover a {background-image:url(../img/pool_03_tn.png); }
.nav1 ul li.pool_04, .nav1 ul li.pool_04:hover a {background-image:url(../img/pool_04_tn.png); }
.nav1 ul li.pool_05, .nav1 ul li.pool_05:hover a {background-image:url(../img/pool_05_tn.png); }
.nav1 ul li.pool_06, .nav1 ul li.pool_06:hover a {background-image:url(../img/pool_06_tn.png); }
.nav1 ul li.activ2 {background-color: #FFFFFF; }

/*Non-IE6 hovering*/
.nav1 ul li:hover {position:relative;} /*Sylvain IE hack*/
.nav1 ul li:hover a {background-color:#96CAFA ; text-decoration:none;} /*Color main cells hovering mode*/
/*IE6 hovering*/
.nav1 ul li a:hover {position:relative /*Sylvain IE hack*/; z-index:1000 /*Sylvain IE hack*/; background-color:#96CAFA ; text-decoration:none;} /*Color main cells hovering mode*/

.breadcrumbs ul {float:left; width:560px; list-style:none; padding:0; font-family:verdana,arial,sans-serif;}
.breadcrumbs ul li {display:inline; padding:0 0 0 9px; margin:0 7px 0 0px; background:transparent url(../img/bg_bullet_arrow.gif) no-repeat 0 50%; font-weight:bold; color:rgb(125,125,125); font-size:100%;}
.breadcrumbs ul a {color:rgb(70,122,167); text-decoration:none;}
.breadcrumbs ul a:hover {color:rgb(42,90,138); text-decoration:underline;}

.header-nav .searchform {position: absolute; margin-left: 774px; width:195px; padding:0.2em 17px 0px 0px !important /*Non-IE6*/; padding:0.1em 12px 0px 0px /*IE6*/;}
.header-nav .searchform form fieldset {border:none;width:180px;}
.header-nav .searchform input.field {width:100px; padding: 4px 5px 3px 5px; border:1px solid rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size: 100%; }
.header-nav .searchform input.button {width:35px; padding:1px !important /*Non-IE6*/; padding:0 /*IE6*/; background:rgb(230,230,230); border:solid 1px rgb(150,150,150); text-align:center; font-family:verdana,arial,sans-serif; color:rgb(150,150,150); font-size:100%;}
.header-nav .searchform input.button:hover {cursor:pointer; border:solid 1px rgb(80,80,80); background:rgb(220,220,220); color:rgb(80,80,80);}

/******************/
/*  MAIN SECTION  */
/******************/
.pagelogo {width:128px; height:128px; position:absolute; z-index:9999; margin:-60px 0 0 600px; background:url(../img/pool_01.png);background-repeat: no-repeat;}


/* MAIN CONTENT */
.column1-unit {width:690px;  margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column2-unit-left {float:left; width:325px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column2-unit-right {float:right; width:325px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column3-unit-left {float:left; width:202px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column3-unit-middle {float:left; width:202px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/; margin-left:40px;}
.column3-unit-right {float:right; width:202px;  margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}

.left { clear: none; float: left; }
.right { clear: none; float: right; }

/********************/
/*  FOOTER SECTION  */
/********************/
#border_top {background:  url('../img/bg_top.png') no-repeat center; margin-bottom: -14px;}
#footer {background:  transparent url('../img/bg_footer.png') no-repeat bottom;}
.footer p {line-height:1.3em; text-align:center; color:rgb(125,125,125); font-weight:bold; font-size:110%;}
.footer p.credits {font-weight:normal;}
.footer a {text-decoration:underline; color:rgb(125,125,125);}
.footer a:hover {text-decoration:none; color:rgb(0,0,0);}
.footer a:visited {color:rgb(0,0,0);}



/******************/
/*  CLEAR FLOATS  */
/******************/
.page-container:after, .header:after, .header-nav:after, .breadcrumbs:after, .main:after, .main-navigation:after, .main-content:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.column1-unit:after, .column2-unit-left:after, .column2-unit-right:after, .column3-unit-left:after, .column3-unit-middle:after, .column3-unit-right:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
 p:after {content:"."; display:block; height:0; /*clear:both*/; visibility:hidden;}
.footer:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clear-contentunit {clear:both; width:690px; height:0.2em; border:none; background:rgb(210,210,210); color:rgb(210,210,210);}
.clear { clear:both; }

/********************************/
/*  PRINTING and MISCELLANEOUS  */
/********************************/
@media print {
	body { font-size: 1.0em;}
	#shadow_wrapper { background: transparent; }
	#border_top { background: transparent; }
	.page-container { width: 1000px; }
	.header {display:none;}
	.pagelogo { display: none; }
	.main-navigation { display: none; }
	.main {clear:both; width:900px; margin: 0 30px; padding-bottom:30px; background:transparent;}
	.main-content {display:inline; /*Fix IE floating margin bug*/; float:left; width:900px; margin:0 0 0 30px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}
	.column1-unit {width:900px;  margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
	#footer { width:900px; margin: 10px 50px; background: transparent; }
    #footer .footer { clear:both; width:900px; background:transparent; font-size:1.0em; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}
    
	.floatright { float: right; width: 50%; }
	.floatright p { width: 100%; }
	.left50 { width: 50%; }
	.left50 p { width: 100%; }
	.typo3-adminPanel { display: none; }
    #tagebuch input.field { min-width: 20px; }
    #tagebuch textarea { visibility: hidden; height: 100px; }
	
	/* Override styles from layout_text.css */
	.main-content table th { font-size: 1em; height: 0em; padding: 2px 20px 2px 7px; text-align: left; }
	.main-content h1 { clear:both; margin:1.0em 0 0.5em 0; padding:0 0 2px 0; border-bottom:solid 7px rgb(225,225,225); font-family:"trebuchet ms",arial,sans-serif; color:rgb(100,100,100); font-weight:normal; font-size:220%; }
    .break_before { page-break-before: always; }
	.nobreak { page-break-inside: avoid; }
	.noprint { display: none; }
	select { height: 36px; width: 150px; vertical-align: text-bottom;; }
	input { height: 36px; vertical-align: text-bottom; }
}

/********************************/
/*  FORMS  */
/********************************/
input { border:solid 1px rgb(200,200,200); margin:0px; padding:2px; width:auto; font-family:verdana,arial,sans-serif; }
input.field { width:auto; padding:2px; border:solid 1px rgb(200,200,200); }
input.button { border:solid 1px rgb(80,80,80); width:auto; padding:2px 10px; }
input.button:hover {cursor:pointer; border:solid 1px rgb(80,80,80); background:rgb(220,220,220); color:rgb(80,80,80);}
input.error_field { width: 50%; background-color:rgb(255,128,128); }
.radio { width:auto; margin:2px 5px 0px 10px; }
legend { font-family:verdana,arial,sans-serif; color:rgb(80,80,80); padding:0px 2px; }
textarea { border:solid 1px rgb(200,200,200); margin:5px; }
.dropdown { border:solid 1px rgb(200,200,200); margin:0px; }


/********************/
/*  TAGEBUCH  */
/********************/
#tagebuch label { float:left; width:45%; text-align:right; margin:0 10px; padding:2px; font-size:110%; }
#tagebuch label.label_radio { margin:0; float: none; }
#tagebuch input { border:solid 1px rgb(200,200,200); margin:0px; padding:2px; width:auto; font-family:verdana,arial,sans-serif; font-size:110%; }
#tagebuch input.field { width: 50%; }
#tagebuch fieldset { width: 100%; margin: 10px 0; border: solid 1px rgb(200,200,200); }
#tagebuch fieldset.left { width: 48%; float: left; }
#tagebuch fieldset.right { width: 48%; float: right; }


/********************/
/*  ANMELDUNG  */
/********************/
#anmeldung label { float:left; width:45%; text-align:right; margin:0 10px; padding:2px; font-size:110%; }
#anmeldung label.label_radio { margin:0; float: none; }
#anmeldung input { border:solid 1px rgb(200,200,200); margin:0px; padding:2px; width:auto; font-family:verdana,arial,sans-serif; font-size:110%; }
#anmeldung input.field { width: 45%; }
#anmeldung textarea { margin: 1px 0; width: 46% }
#anmeldung fieldset { width: 100%; margin: 10px 0; border: solid 1px rgb(200,200,200); }
#anmeldung fieldset.left { width: 48%; float: left; }
#anmeldung fieldset.right { width: 48%; float: right; }


/********************/
/*  Google Map  */
/********************/
div.markerTooltip, div.markerDetail {
    color: black;
    font-weight: bold;
    background-color: yellow;
    white-space: nowrap;
    margin: 0;
    padding: 2px 4px;
    border: 1px solid black; 
}

div.info {
	overflow: visible;
	background: white;
	margin-bottom: 75px;
}

/* Set Content in Googlemap Popup
----------------------------*/
.info img{
    border: 1px solid #6699CC;
    padding: 5px;
    margin: 5px;
    background-color: white;
}

.info p {
	min-width: 250px;
	overflow: visible;
}