/* zff_style.css
www.zukunftsforum-familie.de
Sebastian Garden, ArtScreen.de
Letzte Aenderung: 14.09.2009

D6081D rot
E0E0E0 grau hell
797979 grau dunkel

##################
#   Generelles   #
################*/

/* zum testen Anzeige der Boxen padding: .5em; 
  div {border: 1px dotted #00f; margin: 1em; }	 */

html		{ font-size: 75% }

html, body { /*height:100%;*/	margin: 0; }

html>body	{ font-size: 12px }

body {
	position:relative;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.3em;
	word-spacing:0.2em;
}

body, table {  /*Why do tables use larger font otherwise? */
	font-size: 12px;}

/* default alignment of table cells */
td {vertical-align: top; text-align: left;}

/* Links- bzw. Rechtsausrichtung für Elemente
--------------------------------------------------------------------------------------- */
.links  { float:  left; margin: 0 1.0em 1.0em 0;}
.rechts { float: right; margin: 0 0 1.0em 1.0em;}

/* Layoutelemente
Verwenden Sie overflow: hidden; um ungütige Floats aufzulösen. oder clear:both;
--------------------------------------------------------------------------------------- */

p  {margin: 0 0 8px 0;}
em { font-style:italic;}
h1 {font-size: 1.2em; font-weight: bold; color: #000; padding: 0 0 0 8px; margin: 0; width:432px; clear:both;}
h2 {font-size: 1.0em; font-weight: bold; color: #000; padding: 16px 0 8px 0; margin: 0; width:432px; clear:both;}

strong {font-weight: bold;}
a.weiss {color: #fff;} /*für Anker*/

div.h1_unterstrich_1 { height: 4px; margin: 0 0 16px 0; background: url(../_images/h1_line_1.gif) no-repeat; clear:both;}
div.h1_unterstrich_2 { height: 4px; margin: 0 0 16px 0; background: url(../_images/h1_line_2.gif) no-repeat; clear:both;}
div.h1_unterstrich_3 { height: 4px; margin: 0 0 16px 0; background: url(../_images/h1_line_3.gif) no-repeat; clear:both;}

div.h1_unterstrich_1 hr,
div.h1_unterstrich_2 hr, 
div.h1_unterstrich_3 hr {display: none;}

div.trennlinie {
	height: 26px;
	margin: 0 0 16px 0;
	background: url(../_images/icons/hr_bank.gif) no-repeat;
	clear:both;
	}
div.trennlinie hr,
div.print_hr {
	display: none;
	}

/* LINKS *************/

a:focus { outline: none } /* macht die gepunktete Linie um geklickte Links unsichtbar */

a, li a, li b a			{color: #000; text-decoration:underline }
a:hover, .more a:hover, li a:hover, li b a:hover, li b li a:hover, li li a:hover, #main_content a:hover {
						 color: #000; text-decoration:none }
a:visited, li a:visited	{color: #333; text-decoration:underline }

#footer a, 
#footer a:visited		{color: #fff; text-decoration:underline }
#footer a:hover			{color: #fff; text-decoration:none }


.icon_mail	{ padding: 5px 20px 7px 0; background: transparent url(../_images/icons/icon_mailto.gif) no-repeat center right}
.icon_doc, 
.icon_rtf	{ padding: 5px 20px 5px 0; background: transparent url(../_images/icons/icon_doc.gif) no-repeat center right}

.icon_pdf	{ padding: 5px 20px 5px 0; background: transparent url(../_images/icons/icon_pdf.gif) no-repeat center right}
.icon_ppt	{ padding: 5px 20px 5px 0; background: transparent url(../_images/icons/icon_ppt.gif) no-repeat center right}
.icon_txt	{ padding: 5px 20px 5px 0; background: transparent url(../_images/icons/icon_txt.gif) no-repeat center right}
.icon_xls	{ padding: 5px 20px 5px 0; background: transparent url(../_images/icons/icon_xls.gif) no-repeat center right}
.icon_extern	{ padding: 5px 14px 5px 0; background: transparent url(../_images/icons/icon_extern.gif) no-repeat center right}

.pager	{ float:left; padding: 5px 3px 5px 14px; background: transparent url(../_images/icons/pfeil_links.gif) no-repeat center left}
.more	{ float:left; padding: 5px 14px 5px 3px; background: transparent url(../_images/icons/pfeil_rechts.gif) no-repeat center right}

#main_footer .pager { /* zurück */
	float:left;
	padding: 6px 50px 0 10px;
	margin: 32px 0 0 48px;
	background: transparent url(../_images/icons/pager_2kids.gif) no-repeat bottom left;
	}

#main_footer .top { /* nach oben */
	float:left;
	margin: 10px 0 0 214px;
	padding: 28px 43px 0 11px;
	background: transparent url(../_images/icons/top_4familie.gif) no-repeat bottom left;
	}
a.pager,
a.top {
	color: #666; text-decoration: underline }
a.pager:hover,
a.top:hover {
	color: #000; text-decoration: none }


/* hidden links for screenreader */
.offscreen {
	position: absolute;
	left: -1000em;
	width: 100em;
	height: 1em;
	overflow: hidden;
	}


/* LISTEN *************/

ul, ol {margin: 8px 0 0 40px}
ul {list-style-image: url(../_images/icons/list_punkt_6.gif);}
li {margin-bottom: 0.5em;}


/*################
# Box Aufteilung #
################*/

#wrapper { /*hellblau 99CCFF*/
	text-align:left;
	margin: 0;
	width: 960px;
	}


/* KOPF ##########################*/

#header {
	width: 960px;
	height:192px;
	background:url(../_images/header_bg.gif) repeat-x;
	overflow:hidden;
	}

#header_bild {
	float:left;
	width: 560px;
	height:160px;
	}

#header_logo {
	float:right;
	width: 400px;
	height:160px;
	}


/* MAIN ##########################*/

#main {
	width: 960px;
	background: url(../_images/main_bg.gif) repeat-y;
	overflow:hidden;
	clear:both;
	}

#main_left {
	float:left;
	width: 272px;
	min-width: 272px;
	text-align:left;
	}

#main_content {
	float:left;
	width: 432px;
	min-width: 432px;
	margin: 32px 48px 0 48px;
	text-align:left;
	}

#main_row_pics {
	float: right;
	}

#main_footer {
	width: 960px;
	background: url(../_images/main_bg.gif) repeat-y;
	overflow:hidden;
	}

#main_footer_left {
	float:left;
	height:18px;
	width: 272px;
	}

#main_footer_navi {
	float:left;
	width: 528px;
	height: 80px;
	}
#main_footer_pic { /* das jeweilige bild ist in mod_pages definiert inkl der unterschiedlichen hoehe */
	float:right;
	width: 160px;
	height: 80px;
	}


/* FUSS ##########################*/

#footer {
	width: 960px;
	height: 128px;
	color:#fff;
	background: #D6081D url(../_images/footer_z.gif) no-repeat;
	overflow:hidden;
	}

#footer_adress {
	float:left;
	margin: 32px 0 0 320px;
	width: 240px;
	height: 48px;
	}

#footer_contact {
	float:left;
	margin: 32px 0 0 0;
	width: 256px;
	height: 48px;
	}

#footer_meta {
	float:left;
	margin: 32px 0 0 0;
	width: 128px;
	height: 48px;
	}


/* ####################
FORMULARE ##############*/

input, 
textarea {
	border: none;
	padding:4px;
	background-color:#E2DCD6;
	}
input:focus, 
textarea:focus {
	border: none;
	background-color:#E8E2DB;
	}

input, 
input:focus, 
textarea, 
textarea:focus {
	font-family: Verdana;
	font-size: 11px;
	width: 288px;
	}
input, 
input:focus {
	height: 20px;
	}
textarea, 
textarea:focus {
	height: 60px;
	}

/* Kontakt #############*/

input[type="submit"] {
	color:#fff;
	background-color:#797979;
	font-weight:bold;
	}

.mod_form_submitbutton,
.cmdSendForm {
	color:#fff;
	background-color:#797979;
	font-weight:bold;
	}


#ContactSubmit {
	margin: 0 8px 0 0;
	}

.LV_validation_message{
	font-weight:bold;
	margin:0 0 0 5px;
	}

.LV_valid {
	color:#CCC;
	}

.LV_invalid {
	color:#D6081D;
	}

/* such_feld meta#############*/
#such_feld {
	float:left;
	margin: 8px 0 0 32px;
	height:20px;
	width: 240px;
	}

#such_feld input {
	width:144px;
	padding: 0;
	color:#000;
	background-color:#fff;
	}
#such_feld .such_feld_submit {
	color:#000;
	background-color:#E0E0E0;
	width:64px;
	font-weight:bold;
	}

/* Suche-Seite #############*/
#mod_search_submit {
	color:#fff;
	background-color:#797979;
	font-family: Verdana;
	width: 80px;
	height:20px;
	margin: 8px 0 0 0;
}

/* broschueren ########*/
input.bestell_2stellig:focus,
input.bestell_2stellig {
	float:left;
	margin:0 5px 10px 0;
	text-align:center;
	width: 22px;
	}

/* mitglied_werden #############*/
input#Verband,
input#Selbsthilfegruppe,
input#Fördermitglied {
	width:  12px;
	height: 12px;
	}

/* Presseverteiler #############*/
input#Pressemitteilungen,
input#vielfalt_familie,
input#ZFF-Info {
	width:  14px;
	height: 14px;
	}

/* #################################*/