/**
 * just spray hamburg stylesheet
 *
 * @author    Tom Klingenberg
 * @copyright 2009 by Tom Klingenberg for lastflood
 * @licensor  Fastline Productions Distributions Hamburg Ltd.
 */

/**
 * reset
 *
 * @section reset
 */
body, div {margin:0; padding:0;}

/**
 * globals
 * 
 * @section globals
 */
body {background:#ddd; color:#000; font-family:Helvetica, Arial, sans-serif; font-size:12px;}
a, a:link {color:#000; text-decoration:none;}
	a:hover {font-weight:bold;}
	a:active {text-decoration:underline;}
	a:focus {text-decoration:underline;}

address, body, div, html, ul {margin:0; padding:0;}
address {font-style:normal;}
p {margin:3px; padding-left:20px; background-color:#ccc;}
.clear {clear:both;}
.skip {display:none;}
.offscreen{position:absolute; left:-1000em;}
hr {display:none;}

/**
 * layout
 *
 * % |--------- 1006 --------| %
 * % |----- 478 -----|- 528 -| %
 * % |- 128 -|- 350 -|- 528 -| %
 *
 * @section layout
 */
body .margins {margin:30px auto; padding:0 10px; width:1006px;}

.header {position:absolute; overflow:visible;}
	.header h1 {position:relative; top:20px; left:20px; margin:0; padding:0;}

.footer {position:absolute; margin:-90px 0 0 30px; width:448px; height:60px;}
	.footer address {bottom:0; height:auto; margin-top:auto; position:absolute; top:auto;}		

.page {width:1006px; margin:0 auto;}
	.page .side.left {float:left; width:478px;}
	.page .side.right {float:right; width:528px;}

/**
 * design
 *
 * @section design
 */
.header a {background:#fff url(i/justspray_logo.jpg) 0 0 no-repeat ; display:block; height:128px; line-height:128px; overflow:hidden; text-indent:1128px; width:128px;}

.page {background:#fff; text-align:left;}
	.content {overflow:hidden; height:514px; margin:30px 30px 30px 0; width:498px;}		
	.menu {padding-top:168px;}
		.menu h3 {display:none;}
		.menu h3, .menu ul, .menu li {margin:0; padding:0;}
 			.menu ul {list-style:none;}
				.menu ul a {background:#ccc; border-bottom:2px solid #fff; color:#000; display:block; height:15px; padding:2px 2px 2px 23px; text-align:center; width:110px;}
				.menu ul .active a {font-weight:bold;}
				.menu ul .active a:hover {font-style:italic;} 

.footer {}
	.footer h3 {display:none;}
	.footer address {display:block; font-style:normal;}



/**
 * headlines
 *
 * @subsection headlines
 * @todo       check wether or not those are factually used
 */
h2, h3, h4, h5, h6 {display:inline; }
h2, h3 {font-weight:bold;}
h2 {font-size:16px; line-height: 130%;}
h3 {font-size:15px;}
h4 {font-size:14px;}
h5 {font-size:12px;}
h6 {font-size:10px;}

/**
 * pages
 *
 * @section pages
 */


/**
 * anfahrt
 *
 * anfahrt page has a no-script accessibility link to google en direct.
 *
 * @subsection anfahrt
 */
.anfahrt noscript a {background:#ff9; border:2px solid #000; display:block; margin-top:146px; padding:8px; text-align:center;}

/**
 * laden
 *
 * @subsection laden
 */
.laden .content {font-size:16px; font-weight:bold; text-align:center; line-height:514px;}

/**
 * produkte
 *
 * @subsection produkte 
 */
.produkte .page .side.left {background:#fff url(../files/logos/produktlogos.jpg) right bottom no-repeat; -height:498px; height:468px; -width:402px; width:412px;}
.produkte .content h2 {display:none;}
.produkte .content ul {background:#ccc; border:2px solid #ccc; height:512px; list-style:none; width:492px; margin-left:2px; /* the design department misted to calculate the correct size of the content area, so that these 2 px have to be added to align to the right side. */ }
	.produkte .content ul li {display:block; margin:0; padding:0;}
		.produkte .content ul li {border:2px solid #ccc; float:left; font-size:14px; font-weight:bold; height:18px; line-height:18px; padding-top:106px; text-indent:2px; width:119px;}
			.produkte .content li {background:#ccc url(../files/logos/3m.jpg) 0 0 no-repeat;}
			.produkte li.clash {background-image:url(../files/logos/clash.jpg);}
			.produkte li.beat {background-image:url(../files/logos/beat.jpg);}
			.produkte li.sabotaz {background-image:url(../files/logos/sabotaz.jpg);}
			.produkte li.krink {background-image:url(../files/logos/krink.jpg);}
			.produkte li.molotow {background-image:url(../files/logos/molotow.jpg);}
			.produkte li.mr_black {background-image:url(../files/logos/mr_black.jpg);}
			.produkte li.junobo {background-image:url(../files/logos/junobo.jpg);}
			.produkte li.oink_ink {background-image:url(../files/logos/oink_ink.jpg);}
			.produkte li.joystick {background-image:url(../files/logos/joystick.jpg);}
			.produkte li.on_the_run {background-image:url(../files/logos/otr.jpg);}
			.produkte li.grog {background-image:url(../files/logos/grog.jpg);}
			.produkte li.touch {background-image:url(../files/logos/touch.jpg);}
			.produkte li.colortrip {background-image:url(../files/logos/colortrip.jpg);}
			.produkte li.stylefile {background-image:url(../files/logos/stylefile.jpg);}
			.produkte li.bad_taste {background-image:url(../files/logos/bad_taste.jpg);}

/**
 * signet
 *
 * @section signet
 */
.signet {bottom:auto; position:absolute; left:auto; right:10px; top:0; overflow:visible; width:0;}
	.signet a {background:transparent url(i/lastflood.gif) 0 0 no-repeat; display:block; height:48px; line-height:48px; overflow:hidden; text-indent:10px; width:10px; }
.signet2 {bottom:0; position:absolute; left:auto; right:0; top:auto; overflow:hidden; width:10px;}
	.signet2 a {background:transparent url(i/druckerei.jpg) 0 0 no-repeat; display:block; height:57px; line-height:57px; overflow:hidden; text-indent:10px; width:10px; }

/* 
 * @bugfix     rel-pos-inherits-abs-pos-bug 
 * @bugfix-for ie6 win32
 */
* html .signet {right:0;}
* html .signet2 {right:0;}