@charset "utf-8";

/* 
 * Stylesheet Homepage SPD Ortsverein Goeppingen - www.spd-ov-gp.de
 *
 * Erstellt durch www.r-und-r.info <info@r-und-r.info>
 *
 */

/* Footer immer am unteren Ende des Viewports, Content 100% Höhe */
html,
body { height: 100%; }

body {
	margin: 0;
	padding: 0;
}

#wrapper {
	margin: auto auto;
	min-height: 100%;
	position: relative;
}

* html #wrapper { height: 100%; } /* IE Hack fr 100 % Hhe */

#footer,
#newsFooter {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
}

/* * html #footer {bottom: -1px;} */ /* Nächster IE Hack, da bottom: 0; als bottom: 1px interpretiert wird */
#content {
	margin-bottom: 3em;
	float: left;
}

/* ----- */

/* Allgemeine Styles */
body {
	background: #F0F3FA url(../img/body_bg.jpg) repeat-x top;
	font-family: Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
	font-size: 0.9em;
	text-align: center; /* IE fix */
}

a:active,
a:focus { }

a,
a:visited {
	padding: 0 2px 1px 2px;
	color: #3e4a69;
	text-decoration: underline;
}

a:hover,
a:visited:hover {
	background: #d6e1f5;
	text-decoration: none;
}

.bold { font-weight: bold; }

.underline { text-decoration: underline; }

.important {
	font-size: 1.3em;
	color: #000;
	font-weight: bold;
}

table {
	width: 100%;
	border-collapse:collapse;
	border-spacing:0;
}

/* ----- */

/* Seitenaufbau */
#wrapper {
	text-align: left; /* IE fix reset */
	width: 920px;
	background: #DAE4F6 url(../img/topleiste.gif) top left repeat-y;
}

#wrapper-table { }

#teaser {
	position: absolute;
	top: 0;
	right: 0;
}

#teaser a,
#teaser a:link,
#teaser a:hover {
	text-decoration: none;
	border: 0;
	margin: 0;
	padding: 0;
}

#teaser img {
	border: 0;
	padding: 0;
	margin: 0;
}

#header {
	background: #A5A9CC url(../img/topleiste.gif) top left no-repeat;
	padding-top: 15px;
}

#logo {
	height: 77px;
	width: 179px;
}

#logo_overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 179px;
	height: 132px;
	background: url(/img/logo-spd.jpg) no-repeat top left;
}

#logo a,
#logo a:hover {
	margin: 0;
	padding: 0;
	border: 0;
	text-decoration: none;
}

#title {
	height: 77px;
	background: url(/img/type-spd_gp.gif) no-repeat top left;
}

#title h1 {
	text-indent: -9999em;
	outline: none;
}

#leftCol {
	width: 164px; /* 180px - padding */
	padding: 0 8px;
}

#content { }

#content td { }

#mainCol { padding: 0 10px 0 10px; }

#rightCol {
	width: 177px;
	padding: 0;
	background: #B3C6EE;
}

#footer,
#newsFooter {
	padding-top: 3px;
	height: 20px;
	border-top: 3px solid #e2e2e2;
	background: #A5A9CC;
	text-align: center;
	font-size: 85%; /* em zu ungenau */
	color: #333;
}

/* ----- */

/* Column Styles
-------------------------- */

/* --- Left Col Styles --- */
#leftCol h1.heading {
	color: #3e4a69;
	font-size: 1.2em;
	margin: 0;
}

#leftCol p {
	color: #3e4a69;
	font-size: 0.9em;
}

/* Ueber uns */
.sideportrait {
	font-size: 0.9em;
	margin: 15px 0 0 0;
	padding: 0;
}

.sideportrait a { }

.sideportrait a img { clear: both; }

.sideportrait .name {
	margin-top: 10px;
	font-size: 1.3em;
	display: block;
	color: #3e4a69;
	font-weight: bold;
}

/* Main Col Styles */
#mainCol h1.heading,
#newsContent h1.heading {
	color: #3e4a69;
	font-size: 1.3em;
	font-weight: bold;
	margin-top: -3px;
	margin-bottom: 12px;
}

#mainCol h1.headingRed {
	color: #af0000;
	font-size: 1.4em;
	font-weight: bold;
	margin-top: -3px;
	margin-bottom: 12px;
}

* html #mainCol h1.heading,
* html #mainCol h1.headingRed { /* IE Fix */ margin-top: 0; }

#mainCol h1 {
	color: #3e4a69;
	font-size: 1.2em;
	font-weight: bold;
	margin-top: 0;
}

#mainCol h2 {
	color: #3e4a69;
	font-size: 0.9em;
}

#mainCol h3 {
	color: #3e4a69;
	font-size: 0.9em;
}

#mainCol p {
	color: #000;
	font-size: 0.9em;
}

#mainCol div.center {
	clear: both;
	text-align: center;
}

/* Startseite */
.frontpageBox {
	border: 1px solid lightblue;
	padding: 6px 3px;
	margin: 0 0 10px 0;
	clear: both;
}

.fpNews {
	background: #fff url(/img/news.jpg) no-repeat 99% 2%; /* 483px 7px; */
	padding-bottom: 10px;
}

#fpMitgliedWerden {
	background: #fff url(/img/mitglied-klinke-weiss.jpg) no-repeat 0px 14px;
	padding-left: 155px;
	font-size: 12px;
}

.frontpageBox h2 {
	margin: 0 0 0 5px;
	padding: 4px 0 10px 20px;
	background: url(/img/kloetzchen_rot.gif) 0.1% 20% no-repeat;
}

.frontpageBox h3 {
	margin: 5px 0;
	padding: 0 4px;
}

.frontpageBox a { text-decoration: none; }

#fpMitgliedWerden h2 {
	margin: 0;
	text-transform: uppercase;
	font-size: 14px;
}

.frontpageMitglied {
	margin-top: 4px;
	margin-bottom: 10px;
}

.frontpageMitglied a {
	display: block;
	background: #fff;
	border-top: 1px solid darkblue;
	border-bottom: 1px solid darkblue;
	padding: 5px 2px;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	font-size: 13px;
}

.frontpageMitglied a:hover { background: #d6e1f5; }

.frontpageMitglied a img {
	background: none;
	border: none;
	clear: both;
	margin-top: 6px;
	text-decoration: none;
	margin-bottom: 3px;
}

/* Ortsverein */
#ortsverein { width: 100%; }

#ortsverein .photo {
	padding: 0;
	width: 130px;
}

#ortsverein .photo img {
	padding: 0;
	margin: 0;
}

#ortsverein .text {
	padding-left: 20px;
	vertical-align: bottom;
}

#ortsverein .text h2 {
	font-size: 1.3em;
	margin-bottom: 1.2em;
}

#ortsverein .name {
	font-weight: bold;
	color: #3e4a69;
}

#ortsverein .detail { }

#ortsverein .econtact {
	margin-top: 1.1em;
	padding-bottom: 8px;
}

#ortsverein .vita {
	font-size: 95%;
	line-height: 1.3em;
	border-left: 2px solid #ccc;
	padding: 0.5em 0 0.5em 5px;
	margin-bottom: 0.2em;
}

#popup {
	font-size: 0.9em;
	background: #DAE4F6 url(../img/body_bg2.gif) repeat-x top;
	border-left: 10px solid #B8CAEE;
	border-right: 5px solid #F0F3FA;
}

#popup #head {
	border-top: 2px solid #A5A9CC;
	height: 100%;
}

#popup #logo {
	background: url(../img/spd_logo.gif) no-repeat;
	height: 77px;
	width: 80px;
}

#popup #title {
	text-align: left;
	background: #A5A9CC none;
	font-size: 2em;
	font-weight: bold;
	padding-left: 1em;
	color: #fff;
}

#popup #content {
	height: 100%;
	background: #DAE4F6;
	text-align: left;
	margin: 0;
	padding: 0;
}

#popup #content td { padding: 0 10px; }

#popup ul,
ol {
	list-style-type: none;
	padding-left: 0;
	margin-left: 0;
}

#popup li {
	padding-left: 0.5em;
	margin-left: 0.5em;
	line-height: 1.5em;
}

#popup #close { text-align: center; }

#popup input {
	background: #fff;
	border: 1px solid #A5A9CC;
	margin-top: 1.5em;
	margin-bottom: 2em;
}

#foot {
	border-top: 3px solid #e2e2e2;
	color: #333;
	font-size: 0.9em;
	background: #A5A9CC;
	text-align: center;
}

/* ----- */
ol#aufgaben {
	margin-left: 0.5em;
	padding-left: 0.5em;
	font-weight: bold;
	font-size: 1.3em;
	line-height: 2.5em;
}

ol#aufgaben ul {
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
	font-weight: normal;
	font-size: 0.8em;
	line-height: 1.2em;
	margin-bottom: 10px;
}

ol#aufgaben ul span { text-decoration: underline; }

ol#aufgaben ul ul {
	font-size: 1em;
	list-style-type: disc;
	margin-left: 1.8em;
}

/* Seite Roter Faden */
ol#roterFaden {
	margin-left: 0.8em;
	padding-left: 0.8em;
}

ol#roterFaden li { font-weight: bold; }

ol#roterFaden p { font-weight: normal; }

ol#roterFaden ul {
	list-style-type: disc;
	margin-left: 0.7em;
	padding-left: 0.7em;
	margin-bottom: 1.2em;
}

ol#roterFaden ul li {
	font-weight: normal;
	line-height: 1.2em;
}

/* ----- */
.red { color: #af0000; }

.blue { color: #373f89; }

.green { color: #006400; }

ol#ziele {
	list-style-type: none;
	padding-left: 0;
	margin-left: 0;
	margin-top: 0;
	font-size: 1.1em;
}

ol#ziele li.h1 {
	font-weight: bold;
	color: #000;
	font-size: 1.3em;
	margin: 0;
}

ol#ziele ol {
	font-weight: normal;
	margin-top: 1em;
	margin-bottom: 1.1em;
}

* html ol#ziele ol { /* IE fix */ font-size: 0.8em; }

ol#ziele ol li {
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}

table#ziel {
	font-weight: normal;
	width: 12em;
	font-size: 1.1em;
	color: #af0000;
	margin: 1em 0 0 5em;
}

table.ziel .equal {
	text-align: center;
	width: 3em;
}

ul#kommt_an {
	padding-left: 0.6em;
	margin-left: 0.6em;
	line-height: 1.2em;
}

ul#kommt_an li { padding-bottom: 0.5em; }

ol#statut {
	padding-left: 0.9em;
	margin-left: 0.9em;
	list-style-type: upper-roman;
}

ol#statut li.h1 {
	font-size: 1.3em;
	font-weight: bold;
	color: #000;
}

ol#statut ol {
	list-style-type: none;
	font-weight: normal;
	margin-left: 0;
	padding-left: 0;
}

ol#statut ol li {
	color: #3e4a69;
	font-weight: bold;
	padding-top: 0.4em;
	padding-bottom: 0.4em;
}

* html ol#statut ol li { font-size: 0.9em; }

ol#statut ol ol { list-style-type: none; }

ol#statut ol ol li {
	font-weight: normal;
	color: #000;
}

ol#statut ol ol ol {
	list-style-type: decimal;
	padding-left: 2.5em;
	font-size: 1em;
}

ol#statut ol ol ol li {
	padding-top: 0;
	padding-bottom: 0;
}

/* Gemeinderat */
#gemeinderat .photo {
	padding: 0;
	width: 130px;
	vertical-align: top;
}

#gemeinderat .photo img {
	padding: 0;
	margin: 0;
}

#gemeinderat .text {
	padding-left: 20px;
	width: 320px;
	vertical-align: top;
}

#gemeinderat .name {
	color: #3e4a69;
	font-weight: bold;
	font-size: 1.3em;
}

#gemeinderat .detail { padding-bottom: 1em; }

#gemeinderat .address { padding-bottom: 1em; }

#gemeinderat .econtact { }

#gemeinderat .vita {
	font-size: 95%;
	line-height: 1.3em;
	border-left: 2px solid #ccc;
	padding-left: 5px;
	vertical-align: top;
}

/* ----- */

/* Right Col & Terminkalender Styles */
#rightCol h1.heading {
	color: #3e4a69;
	font-size: 1.2em;
	margin: 0;
	text-align: center;
	line-height: 1.7em;
	background: #A5A9CC;
}

#termine img {
	padding: 0;
	float: none;
}

#terminBox { font-size: 0.9em; }

#terminBox a {
	color: #3e4a69;
	text-decoration: underline;
}

#terminBox a:active { }

#terminBox a:hover {
	background-color: #d6e1f5;
	text-decoration: none;
}

#terminBox a:link { }

#terminBox a:visited { }

/* ----- */


/*  Navigation
-------------------------------------*/

/* --- Main Navigation --- */
.mainNav { background: #BBC0C9; }

ul#mainNav {
	padding: 1px 4px;
	list-style: none;
	margin: 0;
}

ul#mainNav li {
	display: inline;
	font-size: 1em;
	font-weight: bold;
}

ul#mainNav a:active,
ul#mainNav a:focus {
	color: #48536D;
	background: #EBECEF;
}

ul#mainNav #active { /* Um auf aktueller Seite Linkstatus zu setzen */
	color: #48536D;
	background: #EBECEF;
}

ul#mainNav a,
ul#mainNav a:visited {
	color: #414245;
	text-decoration: none;
	padding: 3px 5px;
}

ul#mainNav a:hover,
ul#mainNav a:visited:hover {
	color: #494F5D;
	background: #D6D9DF;
}

#navShadow { /* Navi Menu Fusszeile */
	height: 15px;
	background: url(../img/untere_leiste.gif) top no-repeat;
}

/* --- Sub Navigation --- */
ul#subNav {
	list-style: none;
	margin: 6px 0 0 0;
	padding: 0;
	text-align: left;
}

* html ul#subNav { /* IE fix */ margin-top: 15px; }

ul#subNav li {
	display: inline; /* IE happiness */
	font-size: 0.9em;
	font-weight: bold;
}

ul#subNav li a { text-decoration: none; }

ul#subNav li a:active,
ul#subNav li a:focus {
	background: #d6e1f5 url(../img/kloetzchen_rot.gif) -1% 30% no-repeat;
	text-decoration: underline;
}

ul#subNav li #subActive { /* Aktuelle Rubrik anzeigen */
	background: #d6e1f5 url(../img/kloetzchen_rot.gif) -1% 30% no-repeat;
	text-decoration: none;
}

ul#subNav li a,
ul#subNav li a:visited {
	margin: 0 0 2px 0;
	display: block;
	padding: 4px 0 4px 18px;
	background: url(../img/kloetzchen_blau.gif) -1% 30% no-repeat;
}

ul#subNav li a:hover,
ul#subNav li a:visited:hover { background: #d6e1f5 url(../img/kloetzchen_blau.gif) -1% 30% no-repeat; }

ul#subNav li ul {
	margin: 2px 0 0 15px;
	padding: 0;
}
/* ---- */
