
body {
	background: #fecc00 url(../img/body-bg.jpg) no-repeat center -150px;
	color: #000;
}

#wrapper {
	background: url(XX../img/content-bg.png);
}

#page {
	width: 980px;
	margin: 0 auto;
	position: relative;
}

#nav-column {
	float: left;
	width: 224px;
	margin-right: 28px;
}

/* TODO grid styles entfernen */
#grid {
	position: absolute;
	z-index: 100;
	background: url(../img/grid-56x28.jpg) repeat-y left top;
	opacity: 0.3;
	width: 100%;
	height: 2270px;
	left: 0;
	display: none;
}

#page { position: relative; }

#content,
#navigation,
#logo,
#unterstuetzung-swt
#nav-column {
	position: relative;
	z-index: 110;
}
/* ende grid styles */


#header {
	float: left;
	width: 100%;
}

#logo {
	float: left;
	width: 224px;
}

#logo a {
	padding: 0;
	background: none;
}

#sysnav {
	position: absolute;
	top: 0;
	right: 0;
	/* TODO  display: none; */
}

#sysnav ul li {
	list-style-type: none;
	float: left;
	padding: 3px 14px 0 14px;
	border-right: 1px solid #222;
	font-size: 1.167em;
	text-transform: uppercase;
}

#sysnav ul li:last-child /* TODO */ {
	border-right-width: 0;
}

#sysnav a {
	background: none;
	text-decoration: none;
}

#sysnav a:hover,
#sysnav a:focus {
	text-decoration: underline;
}


/* NAVIGATION */


#navigation {
	margin: 28px 0 72px;
	float: left;
	width: 224px;
}

#navigation ul {
	margin-bottom: 0;
}

#navigation ul li {
	list-style-type: none;
	padding-left: 7px;
	padding-right: 7px;
	margin-bottom: 10px;
}

#navigation ul li a,
#navigation ul li.active-path span.a {
	text-transform: uppercase;
	font-size: 1.333em;
	text-decoration: none;
	font-weight: normal;
	padding: 0;
	line-height: 1.2;
}

#navigation ul li a:hover,
#navigation ul li a:focus {
	font-weight: bold;
	background: none;
}

#navigation ul li.active-path span.a {
	font-weight: bold;
}

#navigation ul ul {
	margin: 7px 0 21px;
}

#navigation ul li li {
	margin-bottom: 7px;
	padding-left: 0;
}

#navigation ul li li a,
#navigation ul li.active-path li span.a {
	text-transform: none;
	padding-left: 10px;
	display: block;
}



#navigation ul li li a:hover,
#navigation ul li li a:focus {
	font-weight: normal;
}

#navigation ul li li a:hover,
#navigation ul li li a:focus,
#navigation ul li.active-path li span.a {
	background: url(../img/nav-li-li-active-bg.png) no-repeat left 0.45em;	
}


/* NAVCOLUMN img */

#nav-column img {
	margin-bottom: 14px;
}

/* UNTERSTUETZUNG-SWT */

#unterstuetzung-swt {
	padding-left: 7px;
	font-size: 0.8em;
	clear: left;
}

#unterstuetzung-swt img {
	margin-bottom: 0;
}


/* INHALTE */

#stage {
	float: left;
	width: 476px;
	line-height: 1;
	margin-right: 28px;
	margin-bottom: -2px;
	text-align: center;
	padding-top: 28px;
}

#claim {
	text-transform: uppercase;
	color: #fff;
	width: 196px;
	float: left;
	margin-top: 14px;
	font-size: 1.167em;
	line-height: 1.2;
	
	display: none;
}

#content {
	width: 364px;
	margin-right: 28px;
	margin-bottom: 56px;
	padding: 0 28px 14px 84px;
	float: left;
	background: #f9f9f9;
}


/* TODO Bilder */
.image {
	margin-bottom: 1.5em;
}

.image.wide {
	margin-left: -252px;
}

.image img {
	border: 7px solid #d5edfa;
}

.image .caption {
	float: left;
	width: 112px;
	padding: 5px 14px;
	font-size: 0.857em;
	font-style: italic;
	color: #222;
	background: #d5edfa;
	margin-top: -7px;
}


/* Teaserliste von Unterdokumenten */

ul.documents-list {
	float: left;
	margin: 0 0 1.5em 0;
	padding: 0;
	width: 100%;
	border-top: 3px solid #ffe07c;
}

ul.documents-list li {
	list-style-type: none;
	float: left;
	width: 100%;
	padding: 0;
	padding-bottom: 5px;
	border-bottom: 3px solid #ffe07c;
}

ul.documents-list li h2 {
	margin: 0.25em 0 0.5em 0;
	padding: 0 10px;
}

ul.documents-list li p {
	margin-bottom: 0.8em;
	padding: 0 10px;
}

ul.documents-list li img {
	float: left;
	margin: 0 20px 20px 0;
}

ul.documents-list li.clickable h2 a {
	text-decoration: none;
	padding: 0;
}

ul.documents-list li.clickable h2 a:hover,
ul.documents-list li.clickable h2 a:focus {
	background: none;
}

ul.documents-list li.clickable {
	cursor: pointer;
}

ul.documents-list li.clickable:hover {
	background-color: #fff3cb;
}

.further-contents ul li {
	list-style-type: none;
}

/* Downloads */

ul.downloads,
ul.downloads p.meta {
	width: 100%;
}

ul.downloads p.meta {
	font-size: 1em;
}

ul.downloads li {
	list-style-type: none;
}


/* flashes */

div.flash {
	width: 292px;
	background-color: #fff3cb;
}

div.flash.failure li {
	list-style-type: none;
}


/* FEATURES */

#features {
	float: left;
	margin: 0;
	width: 224px;
}

#features .feature {
	background: #d5edfa;
	padding: 7px 14px 14px;
}

#features .feature h4 {
	margin-top: 0;
}


/* FOOTER */

#footer {
	clear: both;
	float: left;
	width: 924px;
	/*background: #f1dc49;*/
	background: #ffe07c;
	padding: 28px;
}

#footer #contact-card {
	float: right;
	margin-top: -56px;
}

#footer h4 {
	font-size: 1.333em;
}

#footer form {
	width: 644px;
}

/* TODO entfernen 
#footer form label { font-size: 1em; color: #222; }
#footer input { float: left; width: 252px; padding: 5px; font-size: 1em; }
#footer h4 { margin-bottom: 14px; } */
