/*

	Theme Name: Icans
	Description: Webdesign für die ICANS GmbH
	Version: 1.0
	Author: Peter Kröner
	Author URI: http://www.peterkroener.de

	**********
	* FARBEN *
	**********

	BG:						#FFF
	Text:					#504F55
	Navi:					#CCC / #CCC / #FC0 / #FFF
	Subnavi:				#666 / 666# / #000 / #000

*/


/* Scrollbar erzwingen */
html, body { height: 101%; margin-bottom:1px; }


/* Basics */
body { font-family:Arial, sans-serif; font-size:12px; line-height:17px; background:#FFF; color:#504F55; }
strong { font-weight:bold; }
em { font-style:italic; }
	strong em, em strong { font-weight:bold; font-style:italic; }
q { font-style:italic; }
	q:before, blockquote p:before { content:"\201E"; }
	q:after, blockquote p:after { content:"\201C"; }
		q q:before, blockquote p q:before { content:"\201A"; }
		q q:after, blockquote p q:before { content:"\2018"; }
q em, blockquote p em { font-style:normal; }
hr { border:none; border-top:1px solid #999; margin:12px 0; }


/* Top & Meta */
#top { position:relative; }
h1 a { /*background:url(img/logo.jpg) top left no-repeat;*/ display:block; float:left; width:240px; height:56px; margin:48px 0 0 4px; }
	h1 a span { display:block; height:0; width:0; overflow:hidden; }
#meta { font-size:11px; text-align:right; position:absolute; top:8px; right:8px; }
	#meta fieldset { margin-top:8px; }
#bosssearch_s, #bosssearch_q { font-size:12px; }
#bosssearch_s { width:128px; }


/* Header */
#header { background:#474749; clear:both; }
	#header .pagewidth { height:174px; }


/* Navi */
#navi { font-size:13px; background:url(img/navi-bg.png); position:relative; left:2px; height:174px; width:172px; margin:0; padding:0; }
	#navi li { background:none; margin:8px 10px; line-height:1; padding:0; }
		#navi a { position:relative; top:52px; font-weight:bold; text-decoration:none; }
		#navi a:link, #navi a:visited { color:#CCC; }
		#navi a:hover, #navi a:active { color:#FFF; }
	#navi li.active { }
		#navi li.active a:link, #navi li.active a:visited { color:#FABB00; }
		#navi li.active a:hover, #navi li.active a:active { color:#FABB00; }


/* Subnavi */
#subnavi { background:#FFF; padding:12px; }
	.nochildren #subnavi { display:none; }
.subnavi { font-size:11px; display:none; margin:0; padding:0; }
li.active .subnavi { display:block; width:776px; position:absolute; bottom:-20px; }
	.nochildren li.active .subnavi { display:none; }
#navi .subnavi li { display:inline-block; margin:0 10px 0 0; padding:0; }
	#navi .subnavi li a { position:static; font-weight:bold; text-decoration:none; }
		#navi .subnavi li a:link, #navi .subnavi li a:visited { color:#666; }
		#navi .subnavi li a:hover, #navi .subnavi li a:active { color:#000; }
	#navi .subnavi li.active a { }
		#navi .subnavi li.active a:link, #navi .subnavi li.active a:visited { color:#000; }
		#navi .subnavi li.active a:hover, #navi .subnavi li.active a:active { color:#000; }
#navi .subnavi ul { display:none; }


/* Content */
#mainheadline { padding:0 10px; }
#sideheadline { color:#FC0; font-size:14px; font-weight:bold; background:url(img/sidebar-headline.png) center left no-repeat; margin:12px 0; padding-left:32px; }
#content { padding-top:16px; }
#main { width:480px; float:left; margin:0 10px 16px 10px; }
#side { width:240px; float:right; margin:-40px 10px 16px 10px; }


/* Textgestaltung */
h2 { font-size:24px; line-height:1.25; margin:12px 0; }
h3 { font-size:17px; line-height:1.25; font-weight:bold; margin:12px 0; }
h4 { font-size:14px; line-height:1.25; font-weight:bold; margin:12px 0; }
h5 { font-size:12px; font-weight:bold; margin:12px 0; }
h6 { font-size:12px; margin:12px 0; }
p, ul, ol, dl { margin:2px 0 10px 0; }
	ul li { padding-left:24px; background:url(img/bullet.png) 10px 6px no-repeat; margin:4px 0; }
		ul ul li { background-image:url(img/bullet2.png); }
ol { list-style-type:decimal; padding-left:16px; }


/* Formulare */
fieldset { margin:2px 0 10px 0; }


/* Kontaktformular */
#kontaktform label { display:block; font-size:11px; }
#kontaktform textarea, #kontaktform input { width:98%; }
div.errors { margin:2px 0 10px 0; }
	div.errors strong { color:#CC0000; }


/* Links */
a {  }
	a:link, a:visited { color:#000; text-decoration:underline; }
	a:hover, a:active { color:#000; text-decoration:none; }


/* Unterseiten (Bilder-Template) */
#unterseiten-bilder .bereich .img { width:156px; height:105px; position:relative; padding-bottom:16px; }
	#unterseiten-bilder .bereich div.img span { font-weight:bold; background:#111; color:#CCC; display:block; width:150px; position:absolute; bottom:0; left:0; padding:3px; }
.bereichcontainer-bilder { background:#FFF5BF; text-align:center; padding:4px 0 0 0; }
	.bereichcontainer-bilder .bereich { cursor:pointer; float:left; margin:4px 2px 2px 2px; }
	.bereichcontainer-bilder .bereich div.active span { color:#FC0 !important; }


/* Unterseiten (Netz-Template) */
#unterseten-netz {  }
.bereichcontainer-netz { background:url(img/netz.png) center center no-repeat; position:relative; text-align:center; clear:both; margin-bottom:16px; }
	.bereichcontainer-netz .wrappertitle { text-align:center; font-size:2em; color:#474749; background:#FFF5BF; border:1px solid #FFCC11; display:inline-block; padding:12px 24px; margin:64px 0; }
	.bereichcontainer-netz .netztitle { font-weight:bold; background:#333; color:#CCC; cursor:pointer; display:block; padding:4px; width:120px; position:absolute; }
	.bereichcontainer-netz .active { color:#FC0 !important; }
	.bereichcontainer-netz .no0 { top:0; left:0; }
	.bereichcontainer-netz .no1 { top:0; left:180px; }
	.bereichcontainer-netz .no2 { top:0; right:0; }
	.bereichcontainer-netz .no3 { bottom:0; left:0; }
	.bereichcontainer-netz .no4 { bottom:0; left:180px; }
	.bereichcontainer-netz .no5 { bottom:0; right:0; }


/* Handliche Klassen */
.pagewidth { width:788px; margin:0 auto; }
.clearfix:after { content:"."; display:block; width:100%; clear:both; height:0; visibility:hidden; }
.clear { display:block; float:none; width:100%; clear:both; }


/* Tooltips */
.tooltip { font-size:11px; /*background:#FFF;*/ background:#FFE49A; color:#000; border:1px solid #999; width:200px; padding:4px; }
	.tooltip .tip-title { margin:4px; }
	.tooltip .tip-text { display:none; }