/* CSS-Formatierungen fuer www.haefftcard.de
* Einsatz: Browser, die sich weitestgehend an Vorgaben des W3C orientieren
* ------------------------------------------------------------------------------ */

/* Reset - Browser Default Styles deaktivieren
-------------------------------------------------------------------------------- */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
}

ol, ul {
	list-style: none;
}

address, cite, code, dfn, em, var {
	font-style: normal;
	font-weight: normal;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td, th {
	vertical-align: top;
}

fieldset,img {
	border: 0;
}

caption, th {
	text-align: left;
}

.clearfix:after { /* automatisches Clearing von Floats */
	clear: both;
	content: ".";
	display: block;
	height: 0px;
	visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


/* Layout - Formatierungen des Basislayout
-------------------------------------------------------------------------------- */
body {
	background: #302F2F url(/media/images/css/bg-body.png) repeat-x top left;
	font: 62.5% Arial, Helvetica, sans-serif; /* Schriftgroesse auf 10px setzen - besser zum Rechnen */
	color: #000;
}

input, select, textarea {
	font-size: .9em;
	font-family: Arial, Helvetica, sans-serif;
}

#pageWrapper {
	font-size: 1.2em; /* angezeigt als 12px */
	line-height: 140%;
	margin: 0 auto;
	width: 1100px;
	background: #fff url(/media/images/css/bg-shadow-content.png) 232px top repeat-y;
}

.blue {
	color: #005EA8;
}

.mehrNews {
	margin-left: 10px;
}


/* HEADER */ 
#header {
	width: 1100px;
	height: 167px;
	background: transparent url(/media/images/css/aktion.jpg) no-repeat top left;
	position: relative;
}

#header h1 {
	color: #fff;
	width: 250px;
	text-indent: -9999px;
}

#header img.trans {
	position: absolute;
	top: 0;
	left: 0;
}

#header ul {
	color: #FFFFFF;
	position: absolute;
	left: 852px;
	top: 0;
	background-color: #000;
	width: 155px;
	padding: 6px 15px 8px 15px;
}

#header ul li {
	float: left;
}

#header ul li a {
	color: #FFFFFF;
	text-decoration: none;
}

#header ul li a:hover {
	color: #FFFFFF;
	text-decoration: underline;
}


#contentWrapper {
	width: 1100px; 
	background: transparent url(/media/images/css/bg-content3.jpg) no-repeat top left;
}


/* NAVIGATION LINKE SPALTE */ 
#naviLeft {
	background: transparent url(/media/images/css/bg-navi-spitze.png) 58px bottom no-repeat;
	width: 168px; 
	float: left;
	color: #FFFFFF;
	padding: 0 5px 143px 65px;
}

#naviLeft ul#menu {
	background: transparent url(/media/images/css/bg-navi-red.png) -6px top repeat-y;
	font-size: 120%;
	line-height: normal;
	width: 155px;
	padding-right: 13px;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	text-transform: uppercase;
}

#naviLeft ul#menu li {
	position: relative;
}

#naviLeft ul#menu li a {
	color: #FFFFFF;
	text-decoration: none;
	display: block;
	padding: 10px 20px 12px 15px;
	background: transparent url(/media/images/css/bg-navi-li.gif) left bottom no-repeat;
}

#naviLeft ul#menu li a.active {
	background-color: #000;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	position: relative;
	top: -1px;
	background-image: none;
}

*html #naviLeft ul#menu li a {
	margin-bottom: -10px;
}


/* Subnavi hover */
#naviLeft ul#menu li ul.submenu {
	font-size: 90%;
	background-color: #000;
	background-image: none;
	width: 175px;
	padding-right: 0;
	padding: 7px 0;
	text-transform: none;
	top: -1px;
	border: 1px solid #666666;
	position: absolute;
	left: 128px;
	z-index: 99;
	display: none;
}

#naviLeft ul#menu li ul.submenu li {
	padding: 0px 11px;
	position: relative;
}

#naviLeft ul#menu li ul.submenu li .arrow {
	position: absolute;
	left: -16px;
	top: 2px;
	background: transparent url(/media/images/css/subnavi.png) left top no-repeat;
	width: 16px;
	height: 15px;
}

#naviLeft ul#menu li ul.submenu li a {
	background-image: none;
	color: #999999;
	padding: 7px;
}

#naviLeft ul#menu li ul.submenu li a:hover {
	background-color: #333;
	color: #eaeaea;
}

#naviLeft ul#menu li ul.submenu li a.active {
	border: none;
	background-color: #000;
}


/* Subnavi ausgeklappt */
#naviLeft ul#menu li.active a.active {
	background: transparent url(/media/images/css/bg-subnavi-li.gif) left top no-repeat;
}

#naviLeft ul#menu li ul.submenu {
	border: none;
}

#naviLeft ul#menu li.active ul.submenu {
	font-size: 90%;
	background-color: #000;
	background-image: none;
	width: 155px;
	padding: 0;
	text-transform: none;
	top: -1px;
	border: none;
	border-bottom: 1px solid #fff;
	border-top: 1px solid #fff;
}

#naviLeft ul#menu li.active ul.submenu li {
	padding: 0;
}

#naviLeft ul#menu li.active ul.submenu li a {
	color: #FFFFFF;
	text-decoration: none;
	background-image: none;
	padding: 10px 20px 12px 15px;
}

#naviLeft ul#menu li.active ul.submenu li a:hover {
	text-decoration: underline;
	background-color: #2b2b2b;
}

#naviLeft ul#menu li.active ul.submenu li a.active {
	background: none;
	background-color: #2b2b2b;
}

#naviLeft ul#menu li.active ul.submenu li .arrow {
	display: none;
}

/* Subnavi ausgeklappt - 3. Ebene */
#naviLeft ul#menu li.active ul.submenu li ul {
	width: 140px;
	position: relative;
	top: -1px;
}

#naviLeft ul#menu li.active ul.submenu li ul li a {
	padding: 10px 20px 12px 30px;
	color: #999999;
	width: 105px;
}

#naviLeft ul#menu li.active ul.submenu li ul li a:hover {
	color: #ffffff;
}

#naviLeft ul#menu li.active ul.submenu li ul li a.active {
	background-color: #000;
	color: #fff;
}

#naviLeft ul#menu li.active ul.submenu li ul li a.active:hover {
	background-color: #2b2b2b;
}


/* Subnavi Daniel */
#naviLeft ul#menu li.active ul.submenu {
	position: relative;
	display: block;
	top: -1px;
	left: 0;
	padding: 0;	
}



/* CONTENT */ 
#contentInnerWrapper {
	float: right;
	width: 862px;
}

#content {
	width: 593px; 
	float: left;
	border-top: 4px solid #000;
}

#content h1 {
	font-size: 150%;
	line-height: normal;
	color: #005ea8;
	margin-bottom: 1em;
}

#content h2 {
	font-size: 130%;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	line-height: normal;
	padding: 5px 12px;
	border-bottom: 2px solid #000;
}

#content h3 {
	margin: 0 0 0.5em 0;
	font-size: 120%; 
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	color: #000;
	font-weight: bold;
	line-height: normal;
	padding: 5px 12px;
}

#content h4 {
	margin: 0 0 0.5em 0;
	font-size: 120%; 
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	color: #000;
	font-weight: bold;
	line-height: normal;
	padding: 5px 12px;
}

p {
	margin-bottom: 1em;
	padding: 5px 12px;
}

#content ul {
	margin-bottom: 1em;
	list-style-type: square;
	margin-left: 26px;
	padding-right: 12px;
}

a {
	color: #000;
	text-decoration: underline;
}

a:hover {
	color: #000;
	text-decoration: none;
}

a.more {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	background-color: #ff0000;
	padding: 5px 10px;
}

.editBox {
	background: transparent url(/media/images/css/divider.png) left bottom no-repeat;
	padding-bottom: 15px;
	margin-bottom: 15px;
}

#content .portletRow {
	width: 593px;
}

#content .portletRow .portletLeft,
#content .portletRow .portletRight {
	background: transparent url(/media/images/css/divider.png) left bottom no-repeat;
	margin-bottom: 44px;
}

.abst {
	margin-bottom: 44px;
}

#content .contentBox,
#content #infobox,
#content .contentBoxOhneBild {
	background: transparent url(/media/images/css/divider.png) left bottom no-repeat;
	margin-bottom: 44px;
	padding-bottom: 15px;
}

#content .formWrapper {
	background: transparent url(/media/images/css/divider.png) left bottom no-repeat;
	margin-bottom: 15px;
	padding-bottom: 15px;
}

#content #frmWrapper {
	background: transparent url(/media/images/css/divider.png) left bottom no-repeat;
	margin-bottom: 15px;
	padding-bottom: 15px;
}

#content .portletRow h3,
#content .contentBox h3 {
	font-size: 130%;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	line-height: normal;
	padding: 5px 12px;
	border-top: 4px solid #000;
	border-bottom: 2px solid #000;
	width: 260px;
	float: left;
}

#content .portletRow p,
#content .contentBox p {
	width: 260px;
	float: left;
}

#content .portletRow h3 a,
#content .contentBox h3 a {
	color: #000000;
}

#content .portletRow a {
	font-weight: bold;
	text-decoration: none;
}

#content .portletRow a:hover {
	text-decoration: underline;
}

#content .portletRow a.more,
#content .contentBox a.more,
#content .contentBoxOhneBild a.more {
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	font-weight: bold;
	text-decoration: none;
	-moz-box-shadow: 2px 4px 5px #888888;
	-webkit-box-shadow: 2px 4px 5px #888888;
	box-shadow: 2px 4px 5px #888888;
	background: #FF0000 url(/media/images/css/bg-button.gif) left bottom repeat-x;
}


#content .portletRow .portletImg,
#content .contentBox .newsImg {
	float: right;
	background: transparent url(/media/images/css/bg-portlet-img.png) left bottom no-repeat;
	width: 269px;
	height: 190px;
	padding: 15px 16px 14px 22px;
	position: relative;
	left: 5px;
	top: -10px;
}

#content .portletRow .portletDate,
#content .contentBox .newsDate {
	background: transparent url(/media/images/css/bg-date.png) left top no-repeat;
	width: 84px;
	height: 43px;
	padding-left: 15px;
	padding-top: 24px;
	position: absolute;
	right: 5px;
	bottom: 20px;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	font-weight: bold;
	color: #fff;
	font-size: 1.3em;
}


table.mitRahmen tr td {
	padding: 5px;
	border: 1px solid #000;
}

table tr td.textRechts {
	text-align: right;
}

table tr td h3 {
	margin-bottom: 0 !important;
}

#content #foerderer {
	font-weight: bold;
	font-size: 10px;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	text-align: center;
}

.abstDate {
	margin-bottom: 0.5em;
}

.abstNews {
	margin-bottom: 3em;
}


.imageleft {
	float: left;
	margin: 0 10px 5px 0;
}

/* MARGINALSPALTE */ 
#marginalRight {
	width: 269px; 
	float: right;
	color: #FFFFFF;
	position: relative;
	top: -125px;
}

.marginalBox,
.marginalBlock {
	background-color: #000;
	width: 155px;
	padding: 15px;
	margin-left: 20px;
	-moz-box-shadow: 5px 5px 10px #434241;
	-webkit-box-shadow: 5px 5px 10px #434241;
	box-shadow: 5px 5px 10px #434241;
	margin-bottom: 10px;
}

#marginalRight h2,
.marginalBlock h4 {
	font-size: 160%;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	line-height: normal;
	padding: 3px 0;
	margin-bottom: 1em;
	border-top: 4px solid #fff;
	border-bottom: 2px solid #fff;
}

#marginalRight a:hover {
	text-decoration: underline;
}

#marginalRight .newsDate {
	font-weight: bold;
	display: block;
	margin-bottom: 0.5em;
}

#marginalRight .marginalZeile {
	border-bottom: 1px solid #989898;
	margin-bottom: 1em;
}

#marginalRight .marginalZeile p,
#marginalRight .marginalBlock p {
	padding: 0;
}

.marginalBlock h4 {
	margin-bottom: 0.7em;
	color: #FFFFFF;
}

.marginalBlock h4 a {
	color: #FFFFFF !important;
	text-decoration: none;
}

.marginalBlock p.noabst {
	margin-bottom: 0;
}

.marginalBlock .margImg {
	float: left;
	margin: 0 10px 5px 0;
}

/* AKTUELLES */
#content .headlineWrapper {
	padding: 5px 12px;
	border-top: 4px solid #000;
	border-bottom: 2px solid #000;
	width: 260px;
	float: left;
}

#content .headlineWrapper span {
	width: 60px;
	display: block;
	float: left;
	color: #f00000;
	font-size: 90%;
	font-weight: bold;
	padding-top: 3px;
}

#content .headlineWrapper h3 {
	width: 195px;
	float: right;
	border-top: none;
	border-bottom: none;
	padding: 0;
	margin-bottom: 0;
}

#content .contentBoxOhneBild .headlineWrapper {
	padding: 5px 12px;
	border-top: 4px solid #000;
	border-bottom: 2px solid #000;
	width: 569px;
	float: left;
}

#content .contentBoxOhneBild .headlineWrapper h3 {
	width: 504px;
	float: right;
}



/* FORMULARE */

form {  
	padding: 5px 12px; 
}
				
td, input, select, textarea {
	font-size: 12px; 
}

.Bereich, 
.Feld { 
	background-color: #fff; 
	width: 300px; 
	border: 1px solid #ddd; 
	margin-bottom: 2px;
}

.Auswahl { 
	background-color: #fff; 
	width: 300px; 
	border: 1px solid #ddd; 
}

.Check, 
.Radio { 
	background-color: #ddff; 
	border: 1px solid #ddd;
}

.Button { 
 	background-color: #aaa; 
	color: #fff; 
	width: 150px; 
	border: 6px solid #ddd;
}