/* ==================================================================
bsl-consulting.de - Standardstylesheet
Datei: main.css
Media: undefiniert

Neubearbeitete Bereiche durch

Datum: 6.09.2006
Autor: Agentur Grintsch (rf)
Mail:	renate.forssmann@grintsch.com
Internet: www.grintsch.com

Inhalt:
CSS-Anweisungen für das Frontend der Website www.clickandmore.epson.de

Aufbau:
1. Allgemeine Selektoren
- Block-Elemente
- Inline-Elemente
- Klassen

2. Layoutbereiche
- Top Navigation
- Logo
- Header
- Main
- Navigation
- Main Content
-
- Footer

3. Spezielle Bereich
- Sidemap
- Kundenforum
===================================================================== */
/* ======================================================

	=1. Allgemeine Selektoren
	
========================================================= */
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #424242;
	text-align: center;
	
	background-color: #FFFFFF;
	padding: 0px;
	margin: 0px;
}


/* ============================================
	=Inline-Elemente
=============================================== */
a { text-decoration: none; }

img { border: none; }

em {
	font-style: normal;
	font-weight: bold;
}

p.download em {
	font-style: italic;
	font-weight: normal;
}


/* ============================================
	=Block-Elemente
=============================================== */
h1 {
	font-size: 130%;
	color: #005192;
}

h2 {
	font-size: 110%;
	color: #888888;
	
	margin-bottom: 0px;
}

h3 {
	font-size: 100%;
	color: #888888;
}

	h3.download {
		color: #094080;
		
		margin-bottom: 5px;
	}
	
h4 {
	font-size: 100%;
	font-weight: normal;
}


ul {
	list-style: none;
	
	padding-left: 0;
	margin-left: 0;
}

	ul.download { margin: 0 0 0 0px; }
	
	ul ul { margin-top: 10px; }

		li {
			background: url(../images/subnavi/li_dot.gif) no-repeat 0 5px;
			padding-left: 11px;
			margin: 0 0 15px 0;
		}
		
		ul.download li { margin-bottom: 5px; }
		
		
			li li {
				background: url(../images/subnavi/li_li_dot.gif) no-repeat 0 5px;
				margin-bottom: 5px;
			}
		
/* ============================================
	=Klassen
=============================================== */
/* class definitions */
.center {
	position: relative;
	top: 0px;
	
	text-align: left;
	
	width: 770px;
	margin: 0px auto;
}
.right {
	position: relative;
	top: 0px;
	
	text-align: right;
	
	width: 770px;
	margin: 0px auto;
}

.clearer {
	clear: both;
	
	font-size: 0px;
	line-height: 0px;
	
	width: 0px;
	height: 0px;
}


/* ======================================================

	=2. Layoutbereiche
	
========================================================= */
/* ============================================
	=Top Navigation
=============================================== */
#topNavi {
	font-size: 10px;
	font-weight: bold;
	
	padding: 10px 0px 5px 155px;
}

	.topNaviEntry {
		color: #A9A9A9;
		
		margin-right: 15px;
	}

/* ============================================
	=Footer Navigation
=============================================== */
#footerNavi {
	font-size: 10px;
	font-weight: bold;
	
	padding: 3px 0px 0px 150px;
}

	.footerNaviEntry {
		float: left;
		color: #A9A9A9;
		
		margin-right: 15px;
	}


/* ============================================
	=Logo
=============================================== */
#logo {
	width: 770px;
	height: 49px;
	xxxpadding-left: 36px;
	padding-top: 5px;
	padding-bottom: 9px;
}


/* ============================================
	=Header
=============================================== */
#headerBackground {
	position: absolute;
	top: 94px;
	left: 0px;
	display: block;
	
	width: 100%;
	height: 134px;
}

#greenbar {
	float: left;
	
	width: 49%;
	height: 100%;
	background-color: #d7e0bd;
}

#greenbarTop {
	width: 100%;
	height: 8px;
	background-color: #e5e8db;
}

#greybar {
	float: right;
	
	width: 49%;
	height: 100%;
	background-color: #c2cbcf;
}

#greybarTop {
	width: 100%;
	height: 8px;
	background-color: #dde0e2;
}

#header {
	width: 633px;
	height: 134px;
	background-color: #FFFFFF;
	background-position: 1px;
	background-repeat: no-repeat;
	padding: 0px 1px;
	margin-left: 134px;
}

	#unternehmen #header, #sitemap #header {
		background-image: url(../images/head/head_unternehmen.jpg);
	}
	#management #header {
		background-image: url(../images/head/head_management.jpg);
	}
	#kompetenzen #header {
		background-image: url(../images/head/head_kompetenzen.jpg);
	}
	#referenzen #header {
		background-image: url(../images/head/head_referenzen.jpg);
	}
	#karriere #header {
		background-image: url(../images/head/head_karriere.jpg);
	}
	#kontakt #header {
		background-image: url(../images/head/head_kontakt.jpg);
	}
	#impressum #header {
		background-image: url(../images/head/head_kontakt.jpg);
	}
	#datenschutz #header {
		background-image: url(../images/head/head_kontakt.jpg);
	}
	#presse #header {
		background-image: url(../images/head/head_presse.jpg);
	}
	#intern #header {
		background-image: url(../images/head/head_intern.jpg);
	}
	
	
/* ============================================
	=Main
=============================================== */
#main {
	position: absolute;
	top: 229px;
	left: 0px;
	
	width: 100%;
	background-image: url(../images/subnavi/greysidebar.gif);
	background-position: center;
	background-repeat: repeat-y;
}

/* ============================================
	=Navigation
=============================================== */
#navigation {
	position: absolute;
	
	width: 134px;
	background-image: url(../images/subnavi/nav_bg.gif);
	background-repeat: no-repeat;
	padding-top: 13px;
	padding-left: 12px;
}

#navigation a {
	position: relative;
	display: block;
	
	width: 122px;
	height: 24px;
}

#navigation span {
	position: absolute;
	left: -1000px;
	top: -1000px;
	
	width: 0px;
	height: 0px;
	
	overflow: hidden;
}

/* ============================================
	=Main Content
=============================================== */
#outerContentContainer {
	width: 768px;
}

#content {
	min-height: 200px;
	height: auto !important;
	height: 200px;
	background-color: #FFFFFF;
	padding: 0px 0px;
	border-left: 134px solid #91a0a6;
	border-right: 134px solid #eee7c9;
}

#innterContentContainer { padding: 5px 41px; }

	#innterContentContainer a {
		color: #015192;
		text-decoration: underline;
	}
	
	.headerPic {
		width: 418px;
		padding-top: 25px;
		padding-bottom: 14px;
		border-bottom: 1px solid #d2d2d2;
		margin-bottom: 14px;
	}
	
	.headerPic img {}
	
	.headerPic h1 {
		position: absolute;
		left: -1000px;
		top: -1000px;
		
		width: 0px;
		height: 0px;
		
		overflow: hidden;
	}
	
/* === =Bereich für Subheader mit Bild === */
.sub_header_pic {
	width: 418px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin: 14px 0px;
}

.sub_header_pic h2 span {
	position: absolute;
	left: -1000px;
	top: -1000px;
	
	width: 0px;
	height: 0px;
	
	overflow: hidden;
}

/* === =Bereich für Text mit Bild === */
.box_foto_txt {
	margin: 0px 0px 22px 0px;

}

	.box_foto_txt .box_foto {
		float: left;
		
		width: 144px;
		height: auto;
	}
	
	.box_foto_txt .box_txt {
		float: left;
		
		width: 274px;
		height: auto;
	}
	
	.box_foto_txt .box_txt h2 {
		display: inline;
		
		font-size: 11px;
		font-weight: normal;
		color: #00267a;
		text-transform: uppercase;
	}

	.box_foto_txt .box_txt_full {
		clear: both;
		
		padding-top: 12px;
		padding-bottom: 12px;
	}

		.box_foto_txt .box_txt_full p {
			padding: 0px;
			margin: 0px 0px 6px 0px;
		}
			

#bsl_veranstaltungen .box_foto_txt {
	margin-top: 12px;

}

/* ===================================== */

.contentColumnsContainer {
	overflow: hidden;
}

#contentColLeft {
	float: left;
	width: 45%;
	margin-right: 5%;
}

#contentColRight {
	float: right;
	width: 45%;
}

#contentColLeftTwo	{
	float: left;
	
	width: 45%;
	margin-top: 15px;
	padding-top: 5px;
	margin-bottom: 10px;
	border-top: 1px solid #D2D2D2;
}

#contentColRightTwo	{
	float: right;
	
	width: 45%;
	margin-top: 15px;
	padding-top: 5px;
	margin-bottom: 10px;
	border-top: 1px solid #D2D2D2;
}

#contentColLast	{
	float: left;
	
	width: 100%;
	margin-top: 15px;
	padding-top: 5px;
	margin-bottom: 10px;
	border-top: 1px solid #D2D2D2;
}

#centerHeads h2 {
	font-size: 10px;
	color: #00267a;
	text-transform: uppercase;
}

#backToTop,
#backToTopRu {
	display: block;
	
	width: 30px;
	height: 10px;
	background-image: url(../images/subnavi/backtotop.gif);
	background-repeat: no-repeat;
	margin-left: 429px;
}

#backToTopRu { 
	width: 48px;
	background-image: url(../images/subnavi/backtotop_ru.gif);
}

#backToTop span,
#backToTopRu span {	visibility: hidden; }

/* ============================================
	=Seitlicher Bereich
=============================================== */
#sideContent {
	position:absolute;
	left: 634px;
	width: 134px;
	padding-top: 13px;
	padding-left: 7px;
	padding-right: 10px;
	padding-bottom: 20px;
	color: #797979;
	background-color: #d8dde0;
	background-image: url(../images/subnavi/sidecontent_bg.gif);
	background-position: bottom right;
	background-repeat: no-repeat;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 117px;
	z-index: 1000;
}

	#sideContentHead {
		margin: 0px 0px 10px 0px;
		color: #92a0a6;
		font-size: 10px;
		font-weight: normal;
		text-transform: uppercase;
	}
	
	#sideContent ul { list-style-image: none; }
	
		#sideContent ul li {
			list-style-type: none;
			
			min-height: 16px;
			background: url(img/icn_filetype_pdf.gif) no-repeat;
			padding-left: 20px;
			margin-left: 0;
		}
		
		* html #sideContent ul li { height: 16px; }
		
		#sideContent ul li.filetype_ppt { background-image: url(img/icn_filetype_ppt.gif) }
	
			#sideContent a {
				display: block;
				
				color: #797979;
			}
			
			#sideContent a:hover {
				color: #f8910b;
				text-decoration: underline;
			}
			
				#sideContent ul li span.source {
					display: block;
					
					font-size: 9px;
					color: #8d8c8c;
					line-height: 11px;
					
					margin-top: 2px;
				}
			
	#sideButton {
		position:absolute;
		left: 634px;
		width: 134px;
		margin-top:100px;
	}


/* ============================================
	=Footer
=============================================== */
#footerBar {
	position: relative;
	bottom: 0px;
	
	width: 100%;
	height: 20px;
	background-color: #FFFFFF;
}

	#footer {
		font-size: 9px;
		color: #797979;
		
		padding-top: 3px;
		padding-right: 140px;
	}


/* ======================================================

	=3. Spezielle Bereich
	
========================================================= */
/* ============================================
	=Sitemap
=============================================== */
#sitemap ul {
	xxxlist-style-image: url(../images/subnavi/sitemap_list_arrow.gif);
}

	#sitemap ul ul {
		margin-top: 11px;
	}
	
	#sitemap ul ul .level_three {
		margin-top: 0px;
		margin-left: 20px;
	}

		#sitemap li {
			font-size: 130%;
			text-transform: uppercase;
			
			background: url(../images/subnavi/sitemap_list_arrow.gif) no-repeat 0 5px;
			margin: 0 0 20px 0;
		}
		
		#sitemap li li {
			font-size: 11px;
			text-transform: none;
			
			margin: 3px 0px 0px 10px;
		}
		
		#sitemap li a {
			color: #797979;
			text-decoration: none;
		}
		
		#sitemap a:hover {
			text-decoration: underline;
			color: #015192;
		}


/* ============================================
	=Kundenforum
=============================================== */
#bsl_veranstaltungen form {
	padding: 0px;
	margin: 12px 0px;
}

#bsl_veranstaltungen br {
	clear: both;
}

#bsl_veranstaltungen fieldset {
	border: 1px solid #91a0a6;
	margin: 12px 0px;
}

* html #bsl_veranstaltungen fieldset {
	padding: 12px 0px;
}

#bsl_veranstaltungen legend {
	color: #91a0a6;
	text-transform: uppercase;
}

#bsl_veranstaltungen label {
	float: left;
	
	font-weight: bold;
	
	width: 144px;
	
	cursor: pointer;
}

#bsl_veranstaltungen fieldset label {
	font-weight: normal;
	
	width: 134px;
	margin-top: 6px;
}

* html #bsl_veranstaltungen fieldset label {
	margin-left: 10px;
}

#bsl_veranstaltungen input,
#bsl_veranstaltungen textarea {
	float: left;
	
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color : #000000;
	
	background-color: #FFFFFF;
	border : 1px solid #000000;
	xxxmargin-top: 6px;
}

#bsl_veranstaltungen input.inpt_txt,
#bsl_veranstaltungen textarea.area_txt {
	width: 250px;
}

#bsl_veranstaltungen fieldset input.inpt_txt {
	width: 200px;
}

#KundenForum input.inpt_sbmt {
	margin-left: 144px;
	margin-bottom: 12px;	
}

#bsl_veranstaltungen input[type="checkbox"] {
	margin: 0;
}

#bsl_veranstaltungen input[type="radio"] {
	margin: 0;
}

#bsl_veranstaltungen label.right {
	width: 165px;
	margin-left: 120px;
	margin-right: 10px;
}

/* ============================================
	=extra Fenster
=============================================== */

#newwincontent {
	min-height: 200px;
	height: auto !important;
	height: 200px;
	background-color: #FFFFFF;
	padding: 0px 0px;
	border-left: 134px solid #91a0a6;
	text-align: left;
	font-size: 12px;
}