/* 			fuerus.de: koellner.css								*/
/*			author: use-art.de								*/
/*			eMail: info@use-art.de								*/
/*			date: 2007/12/18								*/

/* 		content:										*/
/* =g 		global styles and helpers								*/
/* =l 		layout											*/
/* =s 		specials										*/
/* =t 		test only										*/



/* =g 		globals											*/

* { padding: 0; margin: 0; }

.hide, #logo, #accessibility, hr, dt { position: absolute; left: -2000px; }

.left { float: left; }

.right { float: right; }

.clear { clear: both; }

.inline { display: inline; }

.uppercase { text-transform: uppercase; }

.block { display: block; }

.abs1 { margin: 0 0 1em 0; }

.abs2 { margin: 0 0 2em 0; }

.abs3 { margin: 2em 0 1em 0; }

.abs_l { padding: 0 2em 1em 24px; }

.abs_less1 { margin: 0 0 0 0; }

img { border: none; }

html { background: #fff; }

.lll { margin: 0 0 0 -10px }

.ll { margin: 0 0 0 1px }

.attention { color: #a00; }

.bold { font-weight: 700; }

.intro {
	color: #999;
	font-weight: 700;
	}


/* =l 		layout													*/

h1 {
	width: 750px;
	height: 121px;
	position: relative;
	line-height: 1.2em;
	color: #ddd;
	}
	
h1#msc span {
	background: transparent url(../../img/msc_new.png) no-repeat top left;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
h1#msc_old span {
	background: transparent url(../../img/msc_new.png) no-repeat top left;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
h1#msc_new span {
	background: transparent url(../../img/msc_new.png) no-repeat top left;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
h1#msc_bl span {
	background: transparent url(../../img/msc_bl.png) no-repeat top left;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
h1#index_en span {
	background: transparent url(../img/koellner_head.jpg) no-repeat top left;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
h1#company span {
	background: transparent url(../img/koellner_unternehmen.gif) no-repeat top left;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
h1#contact span {
	background: transparent url(../img/koellner_kontakt.jpg) no-repeat top left;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
h1#products span {
	background: transparent url(../img/koellner_leistungen.jpg) no-repeat top left;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
h2 { position: absolute; left: -2000px; }

h3 { 
	color: #0000cd;
	font-weight: 100;
	margin: 0 0 .8em 0;
	font-size: 1.375em;
	}

h4 {
	color: #0000cd;
	font-weight: 100;
	font-size: 1em;
	}
	
.h4_alt h4 {
	color: #333;
	font-weight: 100;
	font-size: 1em;
	padding: 0 0 11px 11px;
	background: url(../img/arrow.gif) no-repeat 0 0;
	}

p { padding: 0 0 1em 0; }

a:link { text-decoration:none; color:#0000cd; background-color:transparent; }
a:visited { text-decoration:none; color:#0000cd; background-color:transparent; }
a:focus { text-decoration:none; color:#0000cd; background-color:transparent; }
a:hover { text-decoration:none; color:#0000cd; background: transparent url(../img/dots_0000cd.gif) left bottom repeat-x; }
a:active { text-decoration:none; color:#0000cd; background-color:transparent; }


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

.arrow li {
	padding-left: 11px;
	background-image: url(../img/arrow.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	}
	
.arrow_1 {
	margin-left: 0;
	padding-left: 0;
	list-style: none;
	}
	
.arrow_1 li {
	padding: 0 0 0 1em;
	background-image: url(../img/arrow.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	}



body {
	font-family: verdana, arial, helvetica, sans-serif;
	color: #333;
	font-size: 100%; /* http://www.alistapart.com/articles/howtosizetextincss 		*/
	text-align: center;
	line-height: 1.125em;
	}

	
a#skip:link, a#skip:visited {
	position: absolute;
	left:-2000px;
	}
	
a#skip:hover, a#skip:focus, a#skip:active {
	display: block;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	text-align: center;
	color: #0000cd;
	font-size: .689em;
	background: none;
	}



/*				CSS Centering 101																		*/
/*				http://www.simplebits.com/notebook/2004/09/08/centering.html			*/

#wrapper {
	width: 750px;
	text-align: left;
	margin: 0 auto;
	}
	
#container {
	width: 750px;
	float: left;
	}

	
/* http://www.quirksmode.org/css/clearing.html */

.floatcontainer_topnav {
	overflow: hidden;
	width: 750px;
	}

.topnav_floatleft {
	width: 460px;
	float: left;
	}

.topnav_floatright {
	width: 280px;
	float: right;
	}
	
	
#topnav {
	width: 750px;
	float: left;
	clear: both;
	font-size: .689em;
	padding: 0 0 3px 0;
	}
	
#topnav a:link { text-decoration:none; color:#00008b; background-color:transparent; }
#topnav a:visited { text-decoration:none; color:#00008b; background-color:transparent; }
#topnav a:focus { text-decoration:none; color:#00008b; background-color:transparent; }
#topnav a:hover { text-decoration:underline; color:#0000cd; background: none; }
#topnav a:active { text-decoration:none; color:#00008b; background-color:transparent; }


/* http://blog.calm-n-easy.de/archiv/breadcrumb-navigation-nach-apple-vorbild.html modified */

.breadcrumbs {
	overflow: hidden;
	padding: 0 0 0 4px;
	}

.breadcrumbs a {
	float: left;
	overflow: hidden;
	padding: 0 7px 0 7px;
	font-style: normal;
	}

.breadcrumbs a:hover {
	background: none;
	}

.breadcrumbs em {
	overflow: hidden;
	padding: 0 7px 0 7px;
	font-style: normal;
	}

.breadcrumbs span {
	float: left;
	overflow: hidden;
	padding: 0 7px 0 7px;
	font-style: normal;
	}

.breadcrumbs span {
	background: url(../img/arrow.gif) no-repeat left center;
	overflow: hidden;
	padding: 0 0 0 7px;
	width: 0;
	}
	

#topnav_right {
	margin: 0 10px 0 0;
	text-align: right;
	padding: 0;
	}
	
#brand {
	width: 750px;
	float: left;
	clear: both;
	background: transparent url(../../img/brand.gif) no-repeat top left;
	}
	
#mainnav {
	width: 750px;
	float: left;
	clear: both;
	background: url(../img/mainNav_n.png) left bottom no-repeat;
	text-transform: uppercase;
	font-weight: 100;
	font-family: arial, times, serif;
	padding:0 0 8px 0;
	font-size: .814em;
	letter-spacing: 1px;
	}

#mainnav dl {
	list-style: none;
	margin: 0;
	padding: 0 0 0 20px;
	}

#mainnav dd {
	padding: 0;
	margin: 0;
	float: left;
}

#mainnav a {
	display: block;
	color: #00008b;
	padding:11px 10px 11px 10px;
	margin: 0;
}

#mainnav a:hover, #mainnav a:focus{
	background: url(../img/currentPage.gif) center bottom no-repeat; color: #0000cd;
	}
	
#mainnav .current, #mainnav a:hover.current, #mainnav a:focus.current {
	background: url(../img/currentPage.gif) center bottom no-repeat; color: #333;
	}
	

#mainnav a:link, #mainnav a:visited, #mainnav a:focus, #mainnav a:hover, #mainnav a:active {
	text-decoration: none;
}

	
#content {
	width: 750px;
	background: url(../img/bg_container_2.gif) repeat-y;
	float: left;
	clear: both;
	font-size: .689em;
	}
	
#content ul, #content_2 ul {
	padding: 0 0 .8em 0;
	}
	
.floatcontainer_content {
	overflow: hidden;
	width: 730px;
	margin: 0 10px;
	}
	
#content_wide {
	width: 750px;
	background: url(../img/bg_container_3.gif) repeat-y;
	float: left;
	clear: both;
	font-size: .689em;
	}
	
.floatcontainer_content_wide {
	overflow: hidden;
	border-top: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
	padding: 20px;
	margin: 0 10px;
	background: #f6f9f8 url(../img/floatwidebg.gif) repeat-y;
	}

.content_floatleft {
	width: 450px;
	float: left;
	border-top: 1px solid #aaa;
	background: url(../img/border_r.gif) repeat-y top right;
	}
	
.content_floatleft_sans {
	width: 450px;
	float: left;
	border-top: none;
	background: none;
	}

.content_floatleft_alt {
	width: 450px;
	float: left;
	border-top: 1px solid #aaa;
	background: url(../img/bg_content_left.gif) repeat-y top right;
	}


.content_floatleft_space {
	padding: 16px 20px 24px 20px;
	margin: 0;
	}

	
.content_floatright {
	width: 270px;
	float: right;
	border-top: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
	background: url(../img/bg_content_r.gif) repeat-y top left;
	}
	
.content_floatright_sans {
	width: 270px;
	float: right;
	}
	
#content .content_floatright_sans #gfnav {
	padding: 0 0 0 24px;
	margin: 0;
	list-style: none;
	}
	
#gfnav a:link { text-decoration:none; color:#00008b; background-color:transparent; }
#gfnav a:visited { text-decoration:none; color:#00008b; background-color:transparent; }
#gfnav a:focus { text-decoration:none; color:#00008b; background-color:transparent; }
#gfnav a:hover { text-decoration:underline; color:#0000cd; background: none; }
#gfnav a:active { text-decoration:none; color:#00008b; background-color:transparent; }

#content .content_floatright_sans #pdf {
	padding: 0 0 0 24px;
	margin: 0;
	list-style: none;
	}

.content_floatright_space {
	padding: 16px 20px 16px 20px;
	margin: 0;
	}
	
.content_floatright_space p { padding: 0; }

.content_floatright_space p.line	{
	background: url(../img/pixline.gif) repeat-x bottom;
	margin: 0 0 1em 0;
	padding: 0 0 1.5em 0;
  	}
  	

/* Kontextmenue subnav */

dl#subnav {
	margin: 0 0 10px 0;
	padding: 0;
	border-right: 1px solid #aaa;
	border-top: 1px solid #aaa;
	}

#subnav dd {
	list-style: none;
	background: transparent url(../img/subnav.jpg) top left;
	padding: 0;
	margin: 0;
}

#subnav a, #subnav span {
	text-decoration: none;
	display: block;
	color: #00008b;
	padding: 0.5em 0 0.5em 24px;
	background: transparent url(../img/subnav.jpg) bottom left;
	border-top: 1px solid #ccc;
}

#subnav .last {
	border-bottom: 1px solid #aaa;
}

#subnav .first, #subnav .first span, #subnav .first a, #subnav .first a:hover, #subnav .first a:active, #subnav .first a:focus {
	border-top: none;
}

#subnav a:hover, #subnav a:active, #subnav a:focus {
	padding-left: 24px;
	color: #0000cd;
	background: transparent url(../img/subnav_current.jpg) bottom left;
}

#subnav a.current_sub {
	padding-left: 24px;
	color: #333;
	background: transparent url(../img/subnav_current.jpg) bottom left;
}

	
#footer {
	text-align: center;
	background: url(../img/bg_footer.gif) no-repeat;
	width: 750px;
	clear: both;
	padding: 17px 0 30px 0;
	font-size: .689em;
	}
	
#footer_sans {
	text-align: center;
	background: url(../img/bg_footer_sans.gif) no-repeat;
	width: 750px;
	clear: both;
	padding: 17px 0 30px 0;
	font-size: .689em;
	}
	
#footer p, #footer_sans p { padding: 0; }
	
#footer a:link { text-decoration:none; color:#00008b; background-color:transparent; }
#footer a:visited { text-decoration:none; color:#00008b; background-color:transparent; }
#footer a:focus { text-decoration:none; color:#00008b; background-color:transparent; }
#footer a:hover { text-decoration:underline; color:#0000cd; background: none; }
#footer a:active { text-decoration:none; color:#00008b; background-color:transparent; }

#footer_sans a:link { text-decoration:none; color:#00008b; background-color:transparent; }
#footer_sans a:visited { text-decoration:none; color:#00008b; background-color:transparent; }
#footer_sans a:focus { text-decoration:none; color:#00008b; background-color:transparent; }
#footer_sans a:hover { text-decoration:underline; color:#0000cd; background: none; }
#footer_sans a:active { text-decoration:none; color:#00008b; background-color:transparent; }


/* =s 		specials													*/

.line1	{
	background: url(../img/pixline.gif) repeat-x bottom;
	margin: 0 0 1.5em 0;
	padding: 0;
  	}


a:link.pdf { text-decoration:none; color:#0000cd; margin: 0; padding: 0 0 0 20px; background: transparent url(../img/pdf_icon.gif) no-repeat center left }
a:visited.pdf { text-decoration:none; color:#0000cd; margin: 0; padding: 0 0 0 20px; background: transparent url(../img/pdf_icon.gif) no-repeat center left}
a:focus.pdf { text-decoration:underline; color:#0000cd; margin: 0; padding: 0 0 0 20px; background: transparent url(../img/pdf_icon.gif) no-repeat center left}
a:hover.pdf { text-decoration:underline; color:#0000cd; margin: 0; padding: 0 0 0 20px; background: transparent url(../img/pdf_icon.gif) no-repeat center left }
a:active.pdf { text-decoration:underline; color:#0000cd; margin: 0; padding: 0 0 0 20px; background: transparent url(../img/pdf_icon.gif) no-repeat center left }


label {
	color: #00008b;
	font-size: 1em;
	}
	
input, textarea {
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 1em;
	border: 1px solid #bbb;
	border-top: 1px solid #999;
	border-bottom: 1px solid #ddd;
	background: #fff url(../img/textbg.gif) no-repeat top left;
	padding: 10px;
	width: 380px;
	margin: 0 0 11px 0;
	color: #333;
	}
	
select {
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 1em;
	border: 1px solid #bbb;
	border-top: 1px solid #999;
	border-bottom: 1px solid #ddd;
	background: #fff url(../img/textbg.gif) no-repeat top left;
	padding: 0;
	width: 300px;
	margin: 0 0 11px 0;
	color: #333;
	}
	
form input:focus, form input:hover, form input:active, form textarea:focus, form textarea:hover, form textarea:active {
	background: #fffff0 url(../img/textbg_alt.gif) no-repeat top left;
	}

form p { padding: 1em 0 1em 0; }

#request p { padding: 2em 0 1em 0; }

#support p, #contactform p { padding: 0 0 1em 0; }

#request {
	margin: 2em 0 0 0;
	}

#request input, #request textarea {
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 1em;
	border: 1px solid #bbb;
	border-top: 1px solid #999;
	border-bottom: 1px solid #ddd;
	background: #fff url(../img/textbg.gif) no-repeat top left;
	padding: 10px;
	width: 330px;
	margin: 0 0 11px 0;
	color: #333;
	}
	
	
#request .checkbox {
	padding: 0;
	margin: 1em 1em 0 0;
	width: auto;
	display: inline;
	border: none;
	background: none;
	}
	
	
fieldset {
	border: 1px solid #aaa;
	padding: 0 22px 0 22px;
	background: #f2f5f5;
	margin: 0 0 3em 0;
	}
	
legend {
	font-size: 1em;
	text-transform: uppercase;
	color: #0000cd;
	background: fefefe;
	line-height: 1em;
	}
	
	
form input:focus, form input:hover, form input:active, form textarea:focus, form textarea:hover, form textarea:active {
	background: #fffff0 url(../img/textbg_alt.gif) no-repeat top left;
	}
	
#request input:focus, #request input:hover, #request input:active, #request textarea:focus, #request textarea:hover, #request textarea:active {
	background: #fffff0 url(../img/textbg_alt.gif) no-repeat top left;
	}



.date, .name { 
	color: #0000cd;
	font-weight: 100;
	}
	
#international_legend {
	padding: 0 2em 0 24px;
	}
	
button {
	color: #0000cd;
	background: url(../img/bg_submit.gif) no-repeat;
	padding: 3px 0;
	cursor: pointer;
	width: 100px;
	margin: 11px 0 0 280px;
	font-size: 1em;
	}

/* =t 		test only										*/

/* http://www.thevisualprocess.com/dev/rollover/index.php	*/

ul#testnav {
	list-style: none;
	height: 25px;
	width: 208px;
	}
	
ul#testnav li {
	float: left;
	clear: none;
	margin: 0 4px 0 0;
	overflow: hidden;
	display: inline; /* fix IE double width margin bug*/
	}

ul#testnav li a {
	display: block;
	position: relative;
	width: 100px;
	height: 25px;
	color: #55637e;
	background: #eee;
	font-size: 1.2em;
	text-align: center;
	}
	
ul#testnav li a span {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: url(../img/rollover.gif);
	}
	
ul#testnav li a#roll:hover span { background-position: 0 -25px; }
	
ul#testnav li a#over span { background-position: 0 -50px; }

ul#testnav li a#over:hover span { background-position: 0 -75px; }
	
ul#testnav li a:hover {
	cursor: pointer;
	background-color: #55637e;
	color: #fff;
	text-decoration: none;
	}