/*css layout formatting done by mtness.net*\
		on behalf of primel.net
		for http://co2-story.de
\*              2007-09-28                */

* { margin:0; border: 0; padding:0; }

html
{
	width:100%;
	height:100%;
	overflow: hidden;
}
body
{
	width:100%;
	height:100%;
	font-family: arial, sans-serif;
	min-width: 800px; 
	min-height: 468px;
}
#background
{
	position:absolute; 
	top: 0;
	left:0;
	width:100%;
	height:100%;
	z-index: -1;
	min-width: 320px; 
	min-height: 240px;
}

/* basic layout settings */
/* ************************************************************************** */

#scroller
{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	overflow: auto;
	overflow-x:hidden;
 	overflow-y:scroll;
	z-index: 1;
} 

#content_wrap { padding: 0 0; }

#content_center
{
	position: relative;
	margin: 0 auto;
	top: 23px;
	width: 814px;
	background: #fff;
}


#header 		{ position: absolute; width: 813px; height: 23px; top: 0; left: 0; background: #fff; }
#column_left	{ position: absolute; width: 168px; height: 422px; top: 23px; left: 0; background: #fff; }
#column_right	{ position: absolute; width: 148px; top: 23px; left: 665px; padding: 36px 0 0 0 ; background: #fff; }
#content		{ position: absolute; width: 448px; top: 23px; left: 168px; padding: 22px 175px 22px 22px; background: #fff; }


#fixed
{
	position:relative;
	margin: 23px auto 0 auto;
	padding: 0 30px;
	width:814px;
	height: 100%;
	top:0;
	left:0;
	color:#567;
}
#content_bg_wrap 
{
	position: relative;
	left: 160px;
	width: 645px;
	height: 100%;
	background: #fff;
}
#content_bg {}
#footer_nav
{
	position: absolute;
	bottom: 23px;
	right: 0;
	width: 150px;
	z-index: 23;

}


/* layout element settings */
/* ************************************************************************** */

#rootline 
{
	padding: 0px 0 0 4px; 
	font-size: 12px;
	color: #646464;
	z-index: 8;
}
#rootline a { color: #646464; text-decoration: none; }
#rootline a:link   { }
#rootline a:visited{ }
#rootline a:hover  { color: #5585AE; }
#rootline a:active { }

#rootline div { float: right; padding: 4px 12px; height: 16px; border-left: 1px solid #000; }

#chapterpic { position: absolute;top: 0; left: 22px; }
#menu_left { position: absolute; top: 144px; right: 0px; }

#menu_left img { position: relative; right: 0px; }

.nav { list-style: none; text-align: right;  }

.nav a { color: #fff; text-decoration: none; display: block; width: 138px; padding: 0 8px 4px 0; }
.nav a:link   { }
.nav a:visited{ }
.nav a:hover  { text-decoration: underline; }
.nav a:active { }

#prev {  }

#prev a, #next a { color: #646464; text-decoration: none; padding: 0 12px 0 0; font-size: 12px; }

#prev a { background: bottom right no-repeat url(../images/link_prev.gif); }
#next a { background: bottom right no-repeat url(../images/link_default.gif); }

#prev a:link   { }
#prev a:visited{ }
#prev a:hover  { color: #5585AE; text-decoration: underline; }
#prev a:active { }

#next a:link   { }
#next a:visited{ }
#next a:hover  { color: #5585AE; text-decoration: underline; }
#next a:active { }


#footer_nav { font-size: 12px;  }

#footer_nav ul { margin: 0 0 16px 0; list-style: none; }
#footer_nav li { margin: 0 0 4px 0; padding: 0 0 0 10px; background: center left no-repeat url(../images/listdot.gif); }

#footer_nav a { color: #646464; text-decoration: none; }
#footer_nav a:link   { }
#footer_nav a:visited{ }
#footer_nav a:hover  { color: #5585AE; text-decoration: underline; }
#footer_nav a:active { }

.tx-gsipagenav-pi1	{ padding: 32px 0 0 0; }
#more_info		{ padding: 32px 0 0 0; font-size: 12px; }
#more_info h2	{ font-size: 1em; } 

#more_info ul { margin: 8px 0 16px 0; list-style: none; }
#more_info li { margin: 0 0 4px 0; padding: 0 0 0 10px; background: center left no-repeat url(../images/listdot.gif); }

#more_info a { color: #646464; text-decoration: none; }
#more_info a:link   { }
#more_info a:visited{ }
#more_info a:hover  { color: #5585AE; text-decoration: underline; }
#more_info a:active { }

/* content formatting */
/* ************************************************************************** */


#content,
#content p
{
	font: 13px arial ;
	line-height: 20px;
}

#content p	{ padding: 0 0 24px 0; }

#column_right p a,
#content ul a,
#content p a { color: #646464; text-decoration: none; padding: 0 11px 0 0; background: bottom right no-repeat url(../images/link_default.gif); }

#column_right p a { font-size: 13px; }

#content ul { margin: 0 0 16px 0; list-style: none; }
#content li { margin: 0 0 4px 0; padding: 0 0 0 10px; background: center left no-repeat url(../images/listdot.gif); }


#content .csc-textpic-image a { background: none; }

#content p a:link   { }
#content p a:visited{ }
#content p a:hover  { color: #5585AE; text-decoration: underline; }
#content p a:active { }

#content a.toplink { padding: 0 0 0 17px; background: bottom left no-repeat url(../images/link_totop.gif); }
#content a.external{ padding: 0 17px 0 0; background: bottom right no-repeat url(../images/link_external.gif); }

#content h1 { font-size: 18px; margin: 0px; padding: 0 0 4px 0; }
#content h2 { font-size: 13px; margin: 0px; padding: 0 0 4px 0; }

#column_right .csc-header h2 { font-size: 13px;  padding: 0 0 8px 0; }

/* mailform */
.csc-mailform 					{  }
.csc-mailform label 			{ display: block; float: left; width: 8em; }
.csc-mailform-field 	 		{ padding: 2px; }
.csc-mailform-field input 		{ border: 1px solid #c3c3c3; padding: 2px; z-index: 4;overflow:hidden; }
.csc-mailform-field input:hover { border: 1px solid #666666; background: #c3c3c3; overflow:hidden; }
.csc-mailform-field input:focus { border: 1px solid #999999; background: #eeeeee; overflow:hidden; }
.csc-mailform-submit 			{ padding: 2px; }
#mailformformtype_mail 			{ padding: 2px; width: 6em; }


/* safari specific settings */
/* ************************************************************************** */

/*body:first-of-type #scroller { overflow-y: hidden; }*/
/*body:first-of-type #content_center { padding-right: 16px; }*/
/* first statement is to disable firefox hack, if this selector might become popular in the future... */
/* but then this layout might be adapted to not support ie6 anymore, who has caused this mindbending layout struggle!!! */




/* opera specific settings */
/* ************************************************************************** */
@media all and (min-width:0px) {
	head~body #fixed { margin: 0 auto;  }
	head~body #content_center { padding-right: 16px; }
	head~body #content_bg_wrap { background: top left repeat-x url(../images/opera_content_bg.gif);  }
	head~body #scroller { overflow: auto; }
	head~body #footer_nav { bottom: 16px; }
}
