/*////////////////////////////////////////////////////////////////////////////////////////////////*/
/* Norman Geiersbach                                                                              */
/* Eitido (c) 2007                                                                                */
/*////////////////////////////////////////////////////////////////////////////////////////////////*/

/* -- HTML elements ----------------------------------------------------------------------------- */

a, body, div, h1, h2, h3, html, img, li, ol, p, table, ul
{
	border: 0;
	margin: 0;
	padding: 0;	
}


a
{
	color: black; 
	outline: none; /* solves common bug in some browsers */	
	text-decoration: none;
}

a:hover
{
}


body 
{
	background: #7a7a80 url('images/page_back.gif');
	color: #5f5f68;
	font: 9px tahoma, verdana, arial, helvetica, sans-serif;
}


h1
{
	color: #2b2b37;	
	font-size: 11px;
	font-weight: bold;
	margin-bottom: 24px;
	text-transform: uppercase;
}

h1 .spanSmall
{
	color: #6F6F77;
	font-size: 9px;
	font-weight: normal;
	text-transform: lowercase;
}


h2
{
	color: #2b2b37;	
	font-size: 9px;
	font-weight: bold;
	line-height: 18px;
	margin-bottom: 24px;	
}

h2 .spanRight
{
	display: block;	
	text-align: right;
	width: 90%;
}


h3
{
	color: #2b2b37;	
	font-size: 9px;
	font-weight: bold;
	margin-bottom: 8px;
	text-transform: uppercase;
}


p
{
	line-height: 18px;	
	margin-bottom: 24px;
}

p.smallMargin
{
	margin-bottom: 8px;
}


table tr
{
	vertical-align: top;
}


/* -- Page elements ----------------------------------------------------------------------------- */

#pageContainer
{
	margin: 0 auto;
	width: 700px;
}


  /* top elements */

#topContainer
{
	background: #ffffff;	
	position: relative;
}

#topLogo
{
	background: url('images/top_logo.jpg') no-repeat;
	height: 110px;
	width: 700px;
}

#topLogo h1 { display: none; }


#topImage
{
	background: #2b2b37 url('images/top_image_default.jpg') no-repeat;
	height: 194px;	
	width: 700px;
}

#pageWeb #topImage { background: #2b2b37 url('images/top_image_web.jpg') no-repeat; }
#pagePrint #topImage { background: #2b2b37 url('images/top_image_print.jpg') no-repeat; }
#pagePhoto #topImage { background: #2b2b37 url('images/top_image_photo.jpg') no-repeat; }
#pageCreative #topImage { background: #2b2b37 url('images/top_image_creative.jpg') no-repeat; }
#pageContact #topImage { background: #2b2b37 url('images/top_image_contact.jpg') no-repeat; }
#pageTerm #topImage { background: #2b2b37 url('images/top_image_contact.jpg') no-repeat; }
#pageImpressum #topImage { background: #2b2b37 url('images/top_image_contact.jpg') no-repeat; }


  /* main elements */

#mainContainer
{
	width: 100%;
}

#mainContainer .mainContainerLeft
{
	background: #ffffff;	
	padding-bottom: 60px;
	padding-left: 74px;
	padding-right: 36px;
	padding-top: 60px;
	width: 315px;
}

#mainContainer .mainContainerLeft h3
{
	text-transform: none;
}

#mainContainer .mainContainerRight
{
	background: #696972;
	color: #b8b8b8;
	padding-bottom: 60px;	
	padding-left: 75px;
	padding-right: 25px;	
	padding-top: 98px;
}


  /* bottom elements */

#bottomContainer
{
	background: #2b2b37;
	height: 36px;
	position: relative;
}
  
#bottomContainer #pageCopyright
{
	float: left;
	padding-top: 11px;
}

#bottomContainer #linkTop
{
	background: url('images/btn_arrow_top.gif') no-repeat;
	display: block;
	height: 36px;
	position: absolute;
	right: 0;
	top: 0;	
	width: 36px;
}

#bottomContainer #linkTop:hover
{
	background: url('images/btn_arrow_top_active.gif') no-repeat;
}


/* -- Navigation elements ----------------------------------------------------------------------- */

#topNavigationBlend
{	
	/* Background must set - see a:hover */
	background: url('images/pixel_trains.gif') no-repeat;
	left: 50px;
	position: absolute;
	top: 108px;
	visibility: hidden;
}

#topNavigationBlend ul
{
	list-style-type: none;
}

#topNavigationBlend ul li
{
	background: url('images/nav_back.gif') no-repeat;
	display: block;
	float: left;
	height: 196px;
	width: 75px;	
}


#topNavigation
{	
	/* Background must set - see a:hover */
	background: url('images/pixel_trains.gif') no-repeat;
	left: 50px;
	position: absolute;
	top: 108px;
}

#topNavigation ul
{
	list-style-type: none;
}

#topNavigation ul li
{
	float: left;
}

#topNavigation ul li a
{	
	color: #b8b7b7;
	display: block;
	height: 186px;
	padding-top: 10px;
	text-align: center;
	width: 75px;
}

#topNavigation ul li a:hover
{
	/* IE catches mouse over event only if parent background is set - see parent element */	
	color: #2b2b37;	
}

#pageHome #navHome,
#pageWeb #navWeb,
#pagePrint #navPrint,
#pagePhoto #navPhoto,
#pageCreative #navCreative,
#pageContact #navContact
{
	color: #2b2b37; 
}


#bottomNavigation
{
	float: left;	
	list-style-type: none;
	padding-left: 63px;
	width: 361px;
}

#bottomNavigation li
{
	float: left;
	padding: 11px;
}

#bottomNavigation li a
{
	color: #6b6b73;
}

#bottomNavigation li a:hover
{
	color: #c8c8cc;
}

#pageTerm #navTerm,
#pageImpressum #navImpressum
{
	color: #c8c8cc;
}


/* -- Common elements --------------------------------------------------------------------------- */

.button
{
	background: #ffffff url('images/btn_arrow.gif') center center no-repeat;
	border: solid 1px #ededee;
	height: 20px;
	width: 20px;
}

.button:hover
{
	background: #f6f6f7 url('images/btn_arrow.gif') center center no-repeat;
	border: solid 1px #e5e5e7;
}


.editField, .textField
{
	background: #ffffff;
	border: solid 1px #ededee;
	width: 230px;
}

.editField:hover, .editField:focus, 
.textField:hover, .textField:focus
{
	background: #f6f6f7;
	border: solid 1px #e5e5e7;
}


.errorText
{
	color: #ff0000;
}


.successText
{
	color: #00ff00;
}


/* -- Specific elements ------------------------------------------------------------------------- */

  /* contact page elements */

#pageContact #contactContainer {}

#pageContact #contactContainer tr
{
	vertical-align: top;
}

#pageContact #contactContainer td
{
	padding-bottom: 4px;
}

#pageContact #contactContainer .contactContainerLeft
{
	padding-right: 14px;	
	padding-top: 4px;
	width: 46px;
}

#pageContact #contactContainer .contactContainerRight
{	
}


/* -- Special elements -------------------------------------------------------------------------- */