#header {
	height: 168px;
	background:  url(train_top_right.jpg) no-repeat  right bottom;
}/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* header */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#logo {
	height: 168px;
}
#metanavi {
	height: 168px;
}

#metanavi ul {
	background-image: none;
}

#metanavi li {
	background: #FFFFFF;
}

#metanavi li a,
#metanavi li strong {
	color: #646F7A;
}

.pipewrap {
color: #0D9439;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* main with 3 columns */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#leftColumn {
	padding-top: 47px;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* right column with search*/
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#rightColumn .newsWrap h2, #rightColumn h1, #rightColumn h2, #rightColumn h3, #rightColumn h4 {
	background: #0073b2;
	color: #FFFFFF;
}


#rightColumn .bodytext {
	margin-left: 10px;
}

#rightColumn .csc-firstHeader {
padding: 0 0.5em;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* footer */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#footer-microsite #footer {
	background: #FFFFFF;
	border-top: #FFFFFF;
}
#footer-microsite #footer li {
	color: #0D9439;
}

#footer-microsite #footer a {
	color: #00589C;
	border-bottom: 1px dotted #00589C;
}

#footer-microsite #footer strong {
	color: #00589C;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* grafiktool */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.graphiktool #contentWrapper {
	margin-left:260px;
	margin-right:25px;
}

.graphiktool #rightColumn {
	display: none;
}

#grafiktool {
	position: relative;
	width: 63em;
}
/********* bg *************/
#grafiktool .bg .col {
	float: left;
	width: 19.5em;
	height: 30em;
	background:url("images/bg-train-grafiktool.jpg") repeat-y top left;
}

#grafiktool .bg .col1 {
	background: #7a9dc7;
	width: 5.625em;
}

#grafiktool .bg .col4 {
	width: 18em;
}

/********* contents *************/
.contents {
	position: absolute;
	top: 0;
	left: 0;
}

.contents .header {
	margin-left: 5.625em;
}

.contents .header .item {
	float: left;
	width: 19.5em;
	margin: 0;
	padding: 0 !important;
	background: none !important;
}

.contents .header4 {
	width: 18em !important;
}

.contents .header h2 {
	font-size: 0.82em;
	color: #215CA1;
	text-transform:uppercase;
	font-weight: bold;
	margin: 0;
	padding: 10px 0;
}

.contents .row {
	margin: 0 0 10px 0;
}

.contents .row .item {
	float: left;
	height: 2.2em;
	text-align:center;
	background: #fff;
	position: relative;
}

.arrow,
.arrowlast {
	float: left;
	width: 12px;
	height: 2.2em;
	background:url(images/train-grafiktool-arrow.png) no-repeat left center;
}
.arrowlast {
	background:url(images/train-grafiktool-last-arrow.png) no-repeat left center;
}

.contents .row .first {
	width: 5em;
	height: 2em;

	font-size: 0.8em;
	font-weight: bold;
	color: #215CA1;
	background: #fff;

	margin: 0 0.9em 0 0.4em;
	padding: 10px 5px 0 5px !important;

	-moz-border-radius: 3px;
	border-radius: 3px;
}

.contents .row .toggleIt {
	position: absolute;
	bottom:4px;
	left: 0;
	width: 8px;
	height:15px;
	background: #fff url("images/train-grafiktool-toggle.jpg") no-repeat 2px center;

	cursor: pointer;
}

.contents .row .tog-down {
	background-image: url("images/train-grafiktool-toggle-down.jpg");
}

.contents .row p {
	font-size: 0.75em;
	color: #000013;
	padding: 11px 15px 0 20px;
	line-height: 110%;
}

.contents .row p.double {
	padding: 4px 15px 0 20px;
}

.explanation {
	background: #ccc;
	-moz-border-radius: 3px;
	border-radius: 3px;
	display: inline-block;
	margin: 10px 0 0 1em;
	position: relative;
	display: none;
}
.tx-indexedsearch p {
    font-size: 0.8em;
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* hoehere max-width, damit grafik-tool passt          */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

html, body {
max-width:1280px;
}