/*  =========================================================
DOMAIN
Datei: default.css
Media: screen, projection

Datum: 22. Oktober 2008
Autor: Stefan Schulz-Lauterbach
Mail:  stefansl@gmx.de
Web:   http://beautiful-day.de


1. Allgemeine Selektoren
   - Block-Elemente
   - Inline-Elemente
   - Allgemeine Klassen
   - Non-Layout IDs

2. Layoutbereiche
   - Wrapper
   - Kopfbereich
   - Navibereich
   - Textbereich
   - Fussbereich

3. Spezielle Seiten
   - Kontaktformular

========================================================== */

/* ===============================

   =1. Allgemeine Selektoren

=============================== */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

html { /* In Firefox Rollbalken erzwingen, Little Boxes S. 77 */

}

div {
    /*border: 1px solid green !important;*/
}



body {
    line-height: 1;
    color: white;
    text-align: center; /* Zentrierung für den <IE 5.x */
    font-family: Arial, Helvetica, sans-serif;
    background: #fff url(../tl_files/gfx/background.jpg) no-repeat fixed top;
}

:focus {
	outline: 0;
}

/* ===============================
   =Block-Elemente
=============================== */

h1 {
    font-size: 150%;
    font-family: Georgia, serif;
}

h2 {
    font-size: 130%;
    margin-bottom: 1em;
}

h3 {
    font-weight: bold;
    color: #18a2d9;
    margin-bottom: 15px;
}



p, ul, ol {
    margin: 0 0 1em 0;
}

ol, ul {
    list-style: none;
}


/* Tabellen brauchen immernoch 'cellspacing="0"' im HTML! */
table {
	border-collapse: separate;
	border-spacing: 0;
}

caption, th, td {
	text-align: left;
	font-weight: normal;
}

blockquote, q {
	quotes: "" "";
}

    blockquote:before,
    blockquote:after,
    q:before,
    q:after {
    	content: "";
    }


/* ===============================
   =Inline-Elemente
=============================== */
strong {
    font-weight: bold;
}



a {
    color: #18a2d9;
    text-decoration: none;
}

    a:hover {
        color: #171E4A;
    }

em {
    font-style: italic;
}



/* ===============================
   =Classes allgemeiner Art
=============================== */
.center {
    text-align: center;
}
.left {
    text-align: left;
}
.right {
    text-align: right;
}

.kleinschrift {
    font-size: 10px;
}

.accessibility,
.invisible {
    display: none;
}

.floatl {
    float:left;
    padding: 3px;
    /*border: 5px solid #ccc;*/
    margin-right: 10px;
    margin-bottom: 10px;
}

.floatr {
    float:right;
    padding: 3px;
    /*border: 5px solid #ccc;*/
    margin-bottom: 10px;
    margin-left: 10px;
}
.fl { float:left; }
.fr { float:right; }

.of { overflow: visible !important; }

.clearer {
    clear: both;
}


/* ========================================

  =2. LAYOUTBEREICHE

========================================= */

#pagewrapper {
    width: 960px;
    margin: 0 auto;  /* Zentrierung */
    text-align: left;
	/* border: 1px solid #ff0000; */
	overflow: visible;
    font-size: 72%;
    line-height: 1.4em;
    color: #233035;
}


/* ===============================
   =KOPFBEREICH
=============================== */
#logo {
    background: url('../tl_files/gfx/logo_wasserski_langenfeld.gif') no-repeat;
    width:382px;
    height: 111px;
    position: absolute;
    margin-left: 9px;
    z-index: 0;
}

    #logo_map,
    #email_map {
        display: block;
        position: relative;
    }

    #logo_map {
        width: 78px;
        height: 80px;
        top: 25px;
        left: 28px;
    }

    #email_map {
        width: 200px;
        height: 17px;
        top: 90px;
        left: 170px;
    }



    #logo span {
        display: none;
    }



/* ===============================
   =NAVIBEREICH
=============================== */

 /* siehe
    dropdown_style.css,
    dropdown_ie6.css,
    dropdown_ie7.css
 */



.nav_wrapper #mod_navigation {

    font-family: Georgia, serif;

}
.nav_left {
    background: url(../tl_files/gfx/naviback-right.gif) no-repeat top left;
    width: 66px;
    height: 57px;
    float: right;

}
#navigation {
    background: url(../tl_files/gfx/naviback-textur.gif) repeat-x;
    height: 58px;

    overflow: hidden;
    float: right;
    font-size: 11px;
    font-family: Georgia, serif;
}

#nav_language {
    width:120px;
    height: 16px;
	padding: 11px 0 0 0;
    position: absolute;
    margin-left: 260px;
    z-index: 2000;	
}
	#nav_language li{
		float: left;
		height: 12px;
		line-height: 1em;
	}
		#nav_language li.first { padding-right: 5px; border-right: 1px solid grey; }
		#nav_language li.last { margin-left: 5px; }
		
		#nav_language li a,
		#nav_language li p,
		#nav_language li span {	font: 11px Georgia, serif; font-weight: bold;}

		#nav_language li a { color: #808080;}
		#nav_language li a:hover { color: #000; }
		#nav_language li p { color: #000;}


.nav_right {
    background: url(../tl_files/gfx/naviback-left.gif) no-repeat;
    width: 79px;
    height: 77px;
    float: right;
    /*border: 1px dashed #A52A2A; */
}



/* ===============================
   =TEXTBEREICH
=============================== */
#content {
    float: left;
    margin: 76px 35px 0 10px;
    width: 697px;
    text-align: left;
    display: inline;
    overflow: hidden;
    font-size: 12px;
}

#content_titel {
    float: left;
    overflow: visible;
    margin: 60px 30px 0 0;
    width: 717px;
}


    #content h1 {
        display: block;
        line-height: 1;
        border-bottom: 1px dashed #6d6b68;
        padding: 0 0 13px 0;
        margin: 0 0 25px 0;
        color: #233035;
        font-size: 180%;
        font-weight: bold;
        clear: both;
    }

    #content h2 {
        color: #233035;
        font-size: 15px;
        font-weight: bold;
    }
    #content hr {
        height: 1px;
        border: none;
        border-bottom: 1px dashed #6d6b68;
		margin-bottom: 23px;
    }


    #content .mod_article .ce_text,
    #content .mod_article .ce_table,
    #content .mod_subscribe,
    #content .mod_unsubscribe {
        margin-bottom: 20px;
    }





    .BoxStyle {
        border: 1px solid #e2e2e1;
        padding: 15px;
        background-color: #fff;
        clear: both;
    }

    .BoxStyle table,
    #content .Card_Col1 table,
    #content .Card_Col2 table,
    #content .Card_Col_full table {
        width: 100%;
        margin: 0 0 0 0;
    }
        .BoxStyle table thead th,
        #content .Card_Col1 table thead th,
        #content .Card_Col2 table thead th {
            background-color: #272727;
            border-bottom: 2px solid #fff;
            padding: 0 7px 0 7px;
            color: #fff;
            font-weight: bold;
            border-collapse: separate;
        }
        #content .Card_Col1 table td,
        #content .Card_Col2 table td,
        #content .Card_Col_full table td,
        .BoxStyle table td {
            background-color: #eae9e4;
            padding: 0 6px;
            border-bottom: 2px solid #fff;
            border-collapse: separate;
        }


    #content .image_container {
        padding: 7px;
        border: 1px solid #ebebeb;
        width: auto;
        background-color: #fff;
        margin: 0 22px 22px 0;
        float: left;
        line-height: 1 !important;
    }



/* PREISE - BOXES */
    #content .Card_Col1,
    #content .Card_Col2,
    #content .Card_Col_full,
    .ce_table {
        background-color: #fff;
        font-size: 12px;
        padding: 19px;
        line-height: 1.4em;
        border: 1px solid #ebeae8;
        text-align: left;
        overflow: hidden;
    }
        #content .Card_Col1 h2,
        #content .Card_Col2 h2,
        #content .Card_Col_full h2 {
            font-size: 14px !important;
            margin-bottom: 10px;
        }
        #content .Card_Col1 h3,
        #content .Card_Col2 h3,
        #content .Card_Col_full h3 {
            font-size: 12px !important;
        }
        #content .Card_Col1 .ce_text,
        #content .Card_Col2 .ce_text,
        #content .Card_Col_full .ce_text {
            clear: none !important;
        }
        #content .Card_Col1 .image_container,
        #content .Card_Col2 .image_container,
        content .Card_Col_full .image_container {
            margin: 0 16px 10px 0;
        }

        #content .Card_Col1{
            width: 297px;
            clear: left;
            float: left;
        }

        #content .Card_Col2 {
            width: 297px;
            clear: right;
            float: right;
        }

        #content .Card_Col_full{
            clear: both;

        }



/* KALENDER */
    #content .mod_calendar table.calendar {
        width: 100%;
        border: 1px solid #e2e2e1;
        padding: 7px;
        border-spacing: 2px;
        background: #fff;
    }
        #content .mod_calendar table.calendar th.head {
            background-color: #272727;
            padding: 0 0 0 7px;
            color: #fff;
            font-weight: bold;
        }
            #content .mod_calendar table.calendar th.head a {
                color: #fff;
            }

        #content .mod_calendar table.calendar td {
            background-color: #eae9e4;
            width: 90px;
        }
             #content .mod_calendar table.calendar td.days {

            }


/* FOTOGALERIE */

    a.teaser{
        display: block;
        width: 196px;
        display: block;
        padding: 7px;
        font-size: 0.9em;
        line-height: 1.3em;
        border: 1px solid #ebeae8;
        background-color: #fff;
        overflow: hidden;
        float: left;
        margin: 0 30px 30px 0;
        color: #000;
    }
        a.teaser h2 {
            background: url(../tl_files/gfx/pfeil_blau.gif) no-repeat 4px 8px;
            font-size: 12px !important;
            font-weight: bold;
            padding: 4px 0 0 22px;
            margin: 0 0 5px 0;
        }

        a.first	{ clear: left; }
		a.last	{ margin-right: 0; }



    .ce_gallery table {
        width: 100%;
        margin-bottom: 20px;
    }

    .ce_gallery table td {
        padding: 8px 0;
    }


    .ce_gallery td .image_container {
        margin: 0 !important;
    }



        #content .ce_gallery td.col_last .image_container {
            margin-right: 0;
        }



/* Content Element Table */

.ce_table{
    width: 46%;
    padding: 10px;
    padding-bottom: 15px
}

.gruppentermine { float: left; }
.schultermine   { float: right; }



    .ce_table table{
        width: 100%;
    }
        .ce_table table th,
        .ce_table table td {
            padding: 4px 6px;
        }

        .ce_table table td {
            border-bottom: 1px solid #ccc;
            text-align: right;
        }
            .ce_table table .col_first {
                text-align: left;
            }
/*        .ce_table table tr.even td { background-color: #fafafa;  }
        .ce_table table tr.odd  td { background-color: #efefef;  }*/

        .ce_table table th{
            background-color: #fff !important;
            /*border-bottom: 1px solid #18A2D9;*/
            border-bottom: 1px solid #18A2D9;
            font-weight: bold;
            text-align: right;
        }
		
			#content .ce_table table tr.row_last td {
				border-bottom:1px solid #18A2D9;
			}


/* HUNDEVERBOT */

	#hundeverbot { clear: both; overflow: hidden; border-top: 1px dashed #6d6b68;padding: 15px 0 10px 0; vertical-align:middle;}
	#hundeverbot h2 { color: #233035;  font: 180% Georgia, serif;   font-weight: bold; float: left;display: block; padding:15px 30px 0 0;}
	#hundeverbot img { float: left;}
	#hundeverbot p { float: left; padding: 20px 0 0 20px}

/* WEBCAM */
#webcam_frame 		{

}
#webcam_frame a 	{
	display: block;
	background-color: #fff;
	border:1px solid #ccc;
	padding: 8px;
	margin-bottom: 23px;
	overflow: hidden;
	height:272px;
	color: #000;
}
#webcam_frame a,
#webcam_frame img 	{ width: 318px; }


/* VIDEO ce_ce_jw_media */

.ce_jw_media_container,
#videos a{
    margin-bottom: 10px;
	display: block;
}

	#videos .ce_ce_jw_media {
            width: 300px;
            height: 290px;
    }

	#videos .ce_hyperlink {
            width: 300px;
            height: 245px;
    }

    .ce_ce_jw_media,
	#videos .ce_hyperlink {
            padding: 7px 7px 15px 7px;
            border: 1px solid #ebebeb;
            background-color: #fff;
            margin: 0 22px 22px 0;
            float: left;
            overflow: hidden;

    }

    .ce_ce_jw_media h3,
	#videos .ce_hyperlink h3{
        margin-bottom: 5px;
    }

	#videos .ce_hyperlink .image_container {
		border: none;
		padding: 0;
		margin: 0;
	}




/* ROUTENPLANER */

.mod_routenplaner {
        padding: 7px;
        background: transparent;
        width: auto;
}



.mod_routenplaner table{
    border: none;
    border-spacing: 2px;
}

    .mod_routenplaner td {
        padding: 2px 7px;
    }

    .mod_routenplaner .inputbutton {
        width: auto;

        color: transparent;
        border: none;

    }



/* RECHTE SPALTE */

#sidebar {
    float: left;
    margin: 0px 0 0 0;
    display: inline;
}

    #sidebar h2,
    #sidebar .heading {
        border-bottom: 1px dashed #6d6b68;
        margin:0;
    }

    #sidebar #weather {
        width: 208px;
        height:93px;
        background: url(../tl_files/gfx/heading_titelseite.gif) no-repeat;
        text-align: right;
    }
        #weather div.weatherdata {
            font-family: arial, sans-serif;
            font-size: 10px;
            line-height: 1;
            color: #55585c;
            text-align: right;
            padding: 45px 80px 0 0;
        }

        #opening {
            text-align: left;
            background: #f0eeed url(../tl_files/gfx/bg_home_news.gif) no-repeat;
            width: 181px;
            padding: 13px 9px;
            font-size: 11px;
            line-height: 15px;
            border-bottom: 1px dashed #6d6b68;
        }
            #opening span {
				display: inline;
                background-color: #fff;
            }
            #opening strong {
                color: #18a2d9;
            }



    #opening,
    #sidebar .mod_navigationSub ul {
        overflow: hidden;
        margin-bottom: 30px;
    }

        #sidebar .mod_navigationSub ul li {
            width: 165px;
            white-space: normal;
            background: url(../tl_files/gfx/bullet_sidebarnavi.gif) no-repeat 9px 7px;
            padding: 7px 0px 7px 35px;
            border-bottom: 1px dashed #6d6b68;
        }


        #sidebar .mod_navigationSub ul li.active,
        #sidebar .mod_navigationSub ul li.trail {
            background: url(../tl_files/gfx/bullet_sidebarnavi_active.gif);
        }

            #sidebar .mod_navigationSub ul li a {
                color: #393837;
            }
            #sidebar .mod_navigationSub ul li a:hover {
                text-decoration: underline;
            }

            #sidebar .mod_navigationSub ul li.active a{
                font-weight: bold;
                color: #000;
            }


	#sidebar .image_container { text-align: center; }
	#opening .image_container { text-align: left; }
	




/* ===============================
   =FUSSBEREICH
=============================== */

#footer {
    padding: 10px 0 0 0;
    margin: 0 0 30px 0;
    border-top: 1px dashed #6d6b68;
    clear: both;
    font-size: 11px;
    overflow: hidden;
}

	#footer a#facebook {
		display: block;
		float: right;
		width: 74px;
		height: 20px;
		background: url('../tl_files/gfx/button_facebook.png') no-repeat;
		margin-top: -2px;
	}
		#footer a#facebook span { display: none; }



/* ===============================
   =sIFR-Formatierungen
=============================== */

.sIFR-flash {
	visibility: visible;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
	font-size: 20px;
}

/* ===============================

   =3. Spezielle Seiten

=============================== */


#sitemap {

}

    #sitemap ul li {
        float: left;
        width: 110px;
        margin: 0 30px 15px 0;
    }
    #sitemap ul li.first {
        display: none;
    }
    #sitemap ul li.last {
        margin-right: 0px;
    }

    #sitemap .level_2 {
        margin-top: 15px;
    }



    #sitemap ul {

    }

    #sitemap ul a {
        font-weight: bold;
        color: #233035;
    }
        #sitemap ul ul {


        }
            #sitemap ul ul li {
                float: none;
                margin-bottom: 10px;
            }
            #sitemap ul ul li.first {
                display: block;
            }
            #sitemap ul ul a {
                font-weight: normal;
                color: #18A2D9;
            }
            #sitemap ul ul a:hover {
                color: #000;;
            }



/* ===============================
   Kontaktformular
=============================== */

form {
    margin: 0;
}



    .formbody {
        overflow: hidden;
        margin-bottom: 20px;
    }

        .formbody table td {
            vertical-align: top;
            padding: 0 0 10px 0;

        }

            .formbody span.mandatory {
                color: #18a2d9;
            }



        .formbody td.col_0 {
            width: 100px;
            font-weight: bold;
        }

            .formbody .error {
                color: #18a2d9;

            }


    label {
        display: block;
        float: left;
    }


    input.text,
    select,
    textarea { /* Alle Labels UND Formularelemente auswählen */
        width: 250px; /* Breite.*/
        border:  	 1px solid #d5d3cd;
        background-color: #f2f0f0;
    }

    textarea {
        height: 150px;
    }


        input.submit { /* den Submit-Button */
            width: auto;
            border: none;
			background: #0579a7 url('../tl_files/gfx/background_button.gif') repeat-x;
			color: #fff;
			border: 1px solid #18a2d9;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
        }

    form br { /* Alle Zeilenumbrüche in Formularen auswählen */
      clear: left; /* das floating der labels und inputs aufheben */
    }






/* EoF */