/* Links */
a, a:link,
a:visited { text-decoration: none; color: #00345A; }

a:link:hover,
a:visited:hover { text-decoration: underline; color: #336699; }

.clearboth { clear: both; }


/* Page */
body { margin: 0px; padding: 0px; background: white; font-family:  Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 10px; }

h1, h2, h3, h4, h5, h6 { color: #00345A; }
h1 { font-size: 22px;}
h2 { font-size: 17px;}
h3 { font-size: 13px;}
h4 { font-size: 11px;}
h5, h6 { font-size: 9px;}
h1.headline { text-align:center; }


#container { margin: 0px; padding: 0px; }

/* Header */
#header
{
	background: #00345A;
	position:relative;
	margin: 0px;
	padding: 0px;
	clear: both;
	text-align: center;
	height: 80px;
	color: #999999;
}

#headnav { position: absolute; bottom: 0px; right: 0px; }
#headnav ul { display:inline; margin: 0px; padding:10px 10px 0 1px; list-style: none; }
#headnav li { margin: 0px; padding: 0px 0px 0px 5px; float: left; background:url( /www.familie-in-bewegung.de/styles/img/tab_off_ns1.png) no-repeat left top; }
#headnav a {
	font-size: 12px;
	display:block;
	background:url(/www.familie-in-bewegung.de/styles/img/tab_off_ns2.png) no-repeat right top;
	padding:8px 15px 3px 8px;
	text-decoration:none;
	font-weight: bold;
}


#headnav li { color: white; font: normal 12px Verdana, Helvetica, Arial, sans-serif; }
#headnav li:hover,
#headnav li:hover a { background-position:0% -163px; }
#headnav li:hover a { background-position:100% -163px; }
#headnav #current { background:url( /www.familie-in-bewegung.de/styles/img/tab_on_ns1.png ) no-repeat left top; }
#headnav #current a { padding-bottom:4px; background:url( /www.familie-in-bewegung.de/styles/img/tab_on_ns2.png ) no-repeat right top; }

#headlogo {
	padding: 0px 0px 0px 130px;
	position:relative;
	background: url('/www.familie-in-bewegung.de/img/head_logo.gif') top left no-repeat transparent;
	border: 0px solid white;
	height: 80px;
}

#headlogo h1 { margin: 0px; color: white; font: normal 12px Verdana, Helvetica, Arial, sans-serif; }
#headlogo a { text-decoration: none; color: white; font-family: Trebuchet MS, Helvetica, Arial, sans-serif; font-size: 36px; }
#headlogo a:link,
#headlogo a:visited { color: white; }
#headlogo a.imageLink { top: 0px; left: 0px; padding: 0px 0 80px 116px; text-decoration: none; }
#headlogo div.address { position: absolute; right: 5px; top: 5px; color:#CCC; font: normal 9px Verdana, Geneva, Arial, Helvetica, Sans-Serif; }


#footer {
	margin: 40px 20px 0px 20px;
	padding: 6px;
	clear: both;
	text-align: center;
	height: 16px;
	color: #999999;
	border-top: 1px dotted #B7B7B7; font-size: 12px;
}

#footerfixed {
	position: fixed; left: 0px; bottom: 0px; width: 100%; height: 16px;
	border-top: 1px solid #B7B7B7; background: #E9EEF9; font-size: 12px; vertical-align: text-bottom;
}


/* Tabs */
#navcontainer {
	background: #00345A;
	text-align: right;
	padding: 4px 16px 5px 0px;
	background-position: left;
	overflow: visible;
	z-index: auto;
	left: 116px;
	top: 0px;
}

.navtab, .navtabcurrent, .navtabtraccurrent {
	width: 60px;
	height: 22px;
	padding: 3px 12px 4px 12px;
	margin: 0px -2px 0px -2px;
	border: none;
}

.navtab {
	background: #ffffff url( img/tab_off_bg.gif) repeat-x;
	border: 1px solid #cccccc;
	text-decoration: none;
	text-align: center;
	font-size: 10px;
	color: black;
	white-space: nowrap;
}
.navtab:link, .navtab:visited { color: black; text-decoration: none }
.navtab:hover, .navtab:visited:hover { color:black; text-decoration: none; background: white; }

.navtabcurrent {
	background: #ffffff;
	border: 1px solid #cccccc;
	border-bottom: 1px solid #ffffff;
	text-align: center;
	font-size: 10px;
	color: black;
	white-space: nowrap;
}
.navtabcurrent:link, .navtabcurrent:visited { color: black; text-decoration: none }
.navtabcurrent:hover, .navtabcurrent:visited:hover { color: black; text-decoration:none; background: white }



/* Content */
#content { margin: 0px auto 0px auto; padding: 0px 20px 0px 20px; text-align: left; vertical-align: middle; font-size: 12px;}
#content hr { border-color: #B7B7B7; border-width: 1px 0px 1px 0px; border-style: dotted none dotted none; }
#content p { }

#contentContainer {}

#contentleft { margin: 0px 0px 0px 0px; padding: 0px 5px 0px 5px; width: 8em; top: 0px; float: left; }
#contentright { border-left: 1px dotted #B7B7B7; top: 0px; padding: 0px 5px 0px 15px; margin: 0px 0px 0px 8em;	/* Margin-left muss width in #contentleft entsprechen!!! */ }

#contentleft table,
#contentright table { font-size: 12px; }

#contentleft,
#contentright { font-size: 12px; }

#contentsubmenu { }

/* Welcome page */
#welcome {
margin: 0px 0px 0px 0px;
padding: 0px 0px 10px 0px;
color: inherit;
}
#news {
margin: 0px 0px 0px 10px;
padding: 0px 10px;
display: inline;
width: 360px;
float: right;
clear: both;
background: #f0f0f0;
color: inherit;
overflow:hidden;
}
#news h2 { margin: 5px 0px 10px 7px; }


/* Left Navigation */
#leftnav { list-style: none; padding: 0px 0px 0px 0px; margin: 0px 0px 4px 0px; }
#leftnav a { text-decoration: none; font-weight: bold; }
#leftnav li { margin: 0px 0px 5px 0px; }
#leftnav li.navcurrent a:visited { color: #00345A; }


/* Termine */
table.dates { margin: 0px; padding: 0px; border: 0px; font-size: 12px; }
th.dates         { margin: 2px; padding: 5px; text-align: left; vertical-align: top; font-size: 14px; font-weight: bold; }
td.dates_date    { margin: 2px; padding: 5px; text-align: left; vertical-align: top; font-size: 12px; font-weight: bold; }
td.dates_content { margin: 2px; padding: 5px; text-align: left; vertical-align: top; font-size: 12px; }
th.newsdate      { margin: 2px; padding: 5px; text-align: left; vertical-align: top; font-size: 12px; font-weight: bold; }
td.newscontent   { margin: 2px; padding: 5px; text-align: left; vertical-align: top; font-size: 12px; }


/* Satzing */
#satzung { }
#satzung ul { list-style-type: lower-alpha; }


/* course */
#course div.CourseData { margin: 10px 0px 20px 0px; padding: 0px 0px 0px 0px; }
#course table { margin: 10px 0px 20px 0px; padding: 0px 0px 0px 3px; border-width: 0px; }
#course th    { text-align: right; vertical-align: top; white-space: nowrap; }
#course td    { vertical-align: top; }
#course hr    { border-color: #B7B7B7; border-width: 1px 0px 1px 0px; border-style: dotted none dotted none; }


/* member */
#member div.memberData { margin: 10px 0px 20px 0px; padding: 0px 0px 0px 0px; }
#member table { margin: 10px 0px 20px 0px; padding: 0px 0px 0px 3px; border-width: 0px; }
#member th    { text-align: right; }
#member hr    { border-color: #B7B7B7; border-width: 1px 0px 1px 0px; border-style: dotted none dotted none; }

/* press */
#press     { margin: 10px 10px 20px 0px; padding: 0px 0px 0px 0px; }
#press hr  { margin: 0px 10px 0px 0px; border-color: #B7B7B7; border-width: 1px 0px 0px 0px; border-style: dotted none none none; }


/* messages  */
.MessageSuccess,
.MessageNote,
.MessageError { margin: 10px 0px 0px 0px; padding: 10px 32px; border: 2px solid; text-align: left; font: normal 12px Arial, Helvetica, sans-serif; }

.MessageSuccess { border-color: #009933; background: #DDFFCC url( /www.familie-in-bewegung.de/styles/img/msg_icon_ok.gif) no-repeat 10px 10px; }
.MessageSuccess .title { color: #009933; font-weight: bold; font-size: 16px;}
.MessageSuccess hr { color: #009933; background-color: #009933; height: 1px; padding: 0px; border: 0px none; text-align: center; }

.MessageNote { border-color: #FF9900; background: #ffffcc url( /www.familie-in-bewegung.de/styles/img/msg_icon_att.gif ) no-repeat 10px 10px; }
.MessageNote .title { color: #FF9900; font-weight: bold; font-size: 16px; }
.MessageNote  hr { color: #FF9900; background-color: #FF9900; height: 1px; padding: 0px; border: 0px none; text-align: center; }

.MessageError { border-color: #cc0000; background: #FFEEEE url( /www.familie-in-bewegung.de/styles/img/msg_icon_off.gif) no-repeat 10px 10px; }
.MessageError .title { color: #cc0000; font-weight: bold; font-size: 16px; }
.MessageError hr { color: #cc0000; background-color: #cc0000; height: 1px; padding: 0px; border: 0px none; text-align: center; }



/* Data Content Box */
div.DataBox
{
	background-color: black;
	padding: 0px;
	border-color: black;
	border-width: 1px;
	border-style: solid;
	margin-top: 10px;

	font-family: Arial, Helvetica, sans-serif;
/* 	font-size: 10px; */
	color: black;
	text-align: center;
	vertical-align: middle;
}

/* Inhalt der Content Section Box formatieren */
p.DataBox
{
	background-color: white;
	padding: 3px;
	margin: 0px;
	border-width: 0px;
}

/* Data Content Box */
table.DataBox { background-color: white; margin: 0px; padding: 0px; text-align: center; }

tr.DataBox_Filter { background: #CCDDEE; }

th.DataBox
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: white;
	text-align: center;
	background-color: #00345A;
	margin: 0px;
	padding: 2px;
}

td.DataBox_Info
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: black;
	text-align: center;
	background-color: #FFFF66;
	vertical-align: middle;
	white-space: nowrap;
	margin: 0px;
	padding: 2px;
}

td.DataBox_Alert
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: white;
	text-align: center;
	background-color: red;
	vertical-align: middle;
	white-space: nowrap;
	margin: 0px;
	padding: 2px;
}


/* Resplonive Anpassungen ----------------------------------------------------------------------- */


/* Landscape phone to portrait tablet */
@media (max-width: 800px) {
	img {
		display: block;
		max-width: 100%;
		height: auto;
		margin-left: auto;
		margin-right: auto;
	}

	div#welcome img { min-width: 80px; }
	div#welcome table { width: 100%; }

	#content { clear: both; }


	#headnav { position: relative; bottom: inherit; right: inherit; }
	#headnav ul { display:block; padding: 0px 5px 10px 5px; }
	#headnav li { padding-top: 5px; height: 21px;}
	#headnav a { display: inline; line-height: 22px;}

	#footer { line-height: 22px; }

	/* Formatierung für Formulareingabe Maske */
	#course table td input[type="text"],
	#course table td select,
	#course table td textarea { width: 100%; }

	/* Formatierung für Formulareingabe Maske */
	#member table td input[type="text"],
	#member table td select,
	#member table td textarea { width: 100%; }
	/* Texteingabe nach Radio/Checkbox-Button Eingabe */
	#member table td input[type="radio"] + input[type="text"],
	#member table td input[type="checkbox"] + input[type="text"] { width: 40px;  }

}

@media (max-width: 600px) {
	body { font-size: 9px; }

	#news { float: none; margin: 10px 0px; width: 100%; background: white; }

	#headlogo a { font-size: 30px; }

	#course td { display: block; }
	#course th { text-align: left; display: block; }
	#member td { display: block; }
	#member th { text-align: left; display: block; }
}

/* Landscape phones and down */
@media (max-width: 480px) {
	#headlogo a { font-size: 24px; }
}


/* Landscape phones and down */
@media (max-width: 400px) {
	#headlogo a { font-size: 18px; }
}