body
{
	margin: 0;
	background-color: #2E3135;
	text-align: center;
}

body, table, tr, th, td, h1, h2, h3, h4, h5, h6
{
	font-family: Verdana, Helvetica, Arial, Sans-serif;
	font-size: 9pt;
	line-height: 1.4em;
	font-style: normal;
	color: #666666;
}

h1, h2, h3, h4, h5, h6
{
	margin: 1.5em 0 0.5em 0;
	font-size: 100%;
	font-weight: bold;
	color: #393939;
	text-shadow: white 0 1px 0;
}

h1 /* Page/Article header */
{
	margin-top: 1em;
	margin-bottom: 1em;
	font-size: 130%;
}

h2 /* Sub-header(s) */
{
	font-size: 130%;
	font-weight: normal;
}

h3 /* Sub-sub-header(s) */ {
	color: #666;

	font-weight: bold;
}

h4 /* Article overview */
{
	margin: 1em 0 1.5em 0;
	font-weight: normal;
	color: black;
}

a
{
	text-decoration: underline;
	/* Remove the ugly focus borders dotted line around (activated) links in FireFox */
	outline: 0 none;
}

a:link
{
	color: #930038;
	text-decoration: none;
}
a:visited { color: #930038; }

a:hover
{
	color: #930038;
	color: red;
	text-decoration: underline;
}

a:active
{
	color: #CE1126;
	text-decoration: underline;
}

/*
Should remove the focus borders around activated images and links in IE, not sure for which version, > IE6?
*/
a:focus, img:focus
{
outline: 0 none;
}

h1 a:link, h2 a:link,
h1 a:visited, h2 a:visited
{
	color: #393939;
}

h1 a:hover, h2 a:hover
{
	color: #930038;
}

h1 a:active, h2 a:active
{
	color: #CE1126;
}

p
{
	margin: 0 0 0.5em 0;
}

img
{
/*
	display: block;
*/
	margin: 0;
	border: 0 none;
}

ul, ol
{
	margin: 0 0 0.5em 3em;
	padding: 0;
	list-style-position: outside;
}

ul
{
	list-style-type: disc;
}

li
{
	margin: 0.3em 0 0 0; /* margin between single item blocks */
	padding: 0; /* padding of single item blocks */
}

pre {
	margin: 0.5em 0;
	padding: 0.3em 1em;
	background-color: white;
	border: 1px #E4E4E4 solid;
}

pre span {
    color: #CE1126;
}

code {
	margin-right: 2px;
	font-size: 100%;
	white-space: nowrap;
}

pre, code { color: #404040; }

div.body_gradient
{
    position: fixed; /*no ie6, create conditional style with absolute*/
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    z-index:-1;
    /* Recent browsers */
	background: -moz-linear-gradient(
		top,
		#514F4B,
		#2E3135
	);
	background: -webkit-gradient(
		linear,
		left top, left bottom,
		from(#514F4B),
		to(#2E3135)
	);
}

div.container
{
	width: 760px;
	margin: 0 auto 20px auto;
	padding: 0;
	text-align: left;
}

div.banner
{
	height: 75px;
	background-color: #FFB600;
	background-image: url(images/stupsundeck.de.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

div.main
{
	padding: 10px 15px 30px 15px;
	background-color: #F1F1F1;
	text-align: left;
}


.navcontainer
{
	background-color: #333333;
	background-image: url(images/top_nav_bg.png);
	background-repeat: repeat-x;
	background-position: left center;
	text-align: left;
}

div.banner, div.main, .navcontainer, #gallery_image
{
	border-width: 0 1px 1px 1px;
	border-style: solid;
	border-color: #51545A;
}

#gallery_image
{
	border-width: 1px;
	background-image: url(images/gallery_loading_animation.gif);
	background-position: center center;
	background-repeat: no-repeat;
}

div.footer
{
	padding: 3px 0;
	text-align: right;
	font-size: 80%;
}

div.footer span
{
	color: #AE7C06;
}

div.footer a:link,
div.footer a:visited
{
	color: #666666;
}

.article_date
{
	margin-top: -1em;
	font-size: 8pt;
	color: #666666;
}

.navcontainer a, .navcontainer i
{
	position: relative;
	display: block;
	float: left;
	padding: 3pt 15pt;
	color: white;
	overflow: hidden;
	text-decoration: none;
	font-family: arial, helvetica, sans-serif;
	background-image: url(images/top_nav.png);
	background-repeat: no-repeat;
	background-position: left center;
}

.navcontainer a span
{
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 20px;
	background-image: url(images/top_nav_delimiter.png);
	background-repeat: no-repeat;
	background-position: right center;
}

.navcontainer a:hover
{
	background-image: url(images/top_nav_hover.png);
	color: #BFBFBF;
}

.navcontainer a:hover span
{
	background-color: #1e1e1e;
	background-image: url(images/top_nav_hover.png);
}

.message
{
	text-align: left;
	background-color: #EDEDED;
	padding: 40px 20px;
}

.alert
{
	color: #CE1126;
}

/* general class for table itself */
table.list
{
	padding: 0;
	border-collapse: collapse;
	border-color: #969696;
	border-style: none;
	border-width: 0;
}

/* column headers */
table.list th, table.list td.h1
{
	padding: 5px;
	border: 1px #CCCCCC solid;
	vertical-align: bottom;
	text-align: left;
	font-weight: bold;
	color: black;
	background-color: #E2E0E1;

}

/* standard table content */
table.list td
{
	padding: 2px 5px;
	border: 1px #CCCCCC solid;
	vertical-align: top;
	background-color: white;
}

table.list td.h2
{
	background-color: #CDCDCD;
}


/* ################################## sepcific styles for inputform tables ############################ */

/* general class for table itself */
.inputform
{
	margin-bottom: 5px;
	padding: 0;
}

.inputform td
{
	background-color: transparent;
	border: 0 none;
}

/* data headers */
.inputform td.title
{
	padding: 3px 10px 2px 10px;
	border-bottom: 2px #a9c2d6 solid;
	vertical-align: middle;
	font-weight: bold;
	text-transform: uppercase;
}

/* use class "label_left" for labels to the left of input forms */
.inputform td.input
{
	padding: 7px 20px 2px 0px;
	text-align: left;
	vertical-align: top;
}

/* use class "input" for inputs to the right of lables */
.inputform td.label
{
	padding: 7px 10px 0px 10px;
	font-weight: bold;
	text-align: right;
	vertical-align: top;
}

.inputform td.input input,
.inputform td.input select,
.inputform td.input textarea
{
	margin-top: -3px;
	position: relative; /* Fix for IE: Otherwise the objects were cropped on top if an additional layout table was used to align the object */
}

.inputform td textarea
{
	margin-bottom: 10px;
}

.inputform td.input input[type=checkbox]
{
	margin-top: 1px;
}

.inputform td.input div.fieldalign
{
	float: left;
	margin-top: 1px;
}

/* class for <iframe> object if it sticks inside a inputform table */
.inputform .input iframe
{
	background-color: #F3F4F4;
	border: #a9c2d6 1px solid;
	padding: 0;
	width: 500px;
	height: 400px;
	margin-bottom: 10px;
}

.inputform td.submit
{
	padding: 10px 20px;
	text-align: right;
}


/* #### Styles for image gallery #### */
.overlay
{
	display: none;
	position: fixed; /*no ie6, create conditional style with absolute*/
	top: 0%;
	left: 0%;
	height: 100%;
	width: 100%;
	z-index:1001;
}
.gallery
{
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	border-collapse: collapse;
	border-style: none;
	border-spacing: 0;
	border-width: 0;
}
#gallery_stage
{
	height: 653px;
	width: 930px; /* TODO: check for correct value in GC */
	margin: 0 auto;
}
#gallery_navigation
{
	width: 300px;
	height: 21px;
	margin: 0 auto;
	background-image: url(images/gallery_control.png);
	background-repeat: no-repeat;
	background-position: center top;
	text-align: center;
	font-size: 8pt;
	font-weight: bold;
}
.curtain
{
	height: 100%;
	/*width: 760px;*/
	width: 100%;
	z-index:1002;
	margin: 0 auto;
	background-color: #141517;
	-moz-opacity: 0.9;
	opacity: 0.90;
	filter: alpha(opacity=90);
}
#dialog
{
	z-index:1002;
}
a.icon
{
	display: inline-block;
	height: 21px;
	width: 16px;
	background-repeat: no-repeat;
	background-position: center 4px;
}
a#close
{
	float: left;
	margin-left: 4px;
	background-image: url(images/icon_close.png);
}
a#previous
{
	float: right;
	width: 20px;
	background-image: url(images/icon_previous.png);
}
a#next
{
	float: right;
	width: 20px;
	margin-right: 4px;
	background-image: url(images/icon_next.png);
}
a#reload
{
	display: none;
	float: right;
	width: 18px;
	background-image: url(images/icon_reload.png);
}
a.icon:hover
{
	background-position: center -46px;
}

.warning
{
	margin: 1em -15px 0 -15px;
	padding: 0 15px;
	background-color: #f8f0db;
	border-color: #e3dbdb;
	border-style: solid;
	border-width: 1px 0;
}

.warning h3
{
	margin: 1em 0 0.5em 0;
}

/* #### Styles for floated images in articles #### */
.leftpic, .rightpic {
	margin-bottom: 0.3em;
}
.leftpic {
	float: left;
	margin-right: 10px;
	margin-left: -15px;
}
.rightpic {
	float: right;
	margin-left: 10px;
	margin-right: -15px;
}
.leftpic img, .rightpic img
{
	position: relative; /* IE6: Do not crop block with negative margin below */
	display: block;
	margin-bottom: 5px;
	border: 1px #e3dbdb solid;
	background-repeat: no-repeat;
	background-position: center center;
}
.leftpic img
{
	border-left: 0 none;
}
.rightpic img
{
	border-right: 0 none;
}

.leftpic .warning, .rightpic .warning
{
	width: 200px;
	margin: 0;
}
.leftpic .warning
{
	border-right-width: 1px;
}
.rightpic .warning
{
	border-left-width: 1px;
}

/* Class for text that displays like a computer key */
b, .key {
	display: inline-block;
	margin: 0 1px 0 0;
	padding: 0 0.3em;
	border-radius: 3px;
	-moz-border-radius: 3px;
	border: 1px #BFBFBF solid;
	background-color: white;
	white-space: nowrap;
	color: #808080;
	font-weight: normal;
}

a.download {
	display: inline-block;
	margin-bottom: 1em;
	padding: 0.5em 1em 0.4em 48px;
	border: 1px solid #46A21B;
	border-top-color: #55A82F;
	border-left-color: #55A82F;
	background-image: url("../images/download.png");
	background-repeat: no-repeat;
	background-position: 0 center;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-moz-box-shadow: gray 1px 2px 5px;
	box-shadow: gray 1px 2px 5px;
	background-color: #75B839;
	text-align: left;
	font-size: 12pt;
	color: white;
	text-shadow: gray 0px 1px 1px;
}

a.download:hover
{
	text-decoration: none;
}

h1.product
{
	font-size: 180%;
	text-align: center;
}

h1.product span
{
	font-size: 11pt;
	color: #888;
}

h1.product i
{
	font-style: normal;
	font-weight: normal;
	color: #888;
}
