/* ---------------------------------- */
/* copyright Sticky Bunny Productions */
/* ----------- june 2008 ------------ */
/* ------------------- code is art -- */
/* ---------------------------------- */


/* reset */

* {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	outline:none;
	}

/* force scrollbar */

html { 
    min-height:100%; 
    margin-bottom:1px; 
    }

	
/* colors */

.snow {color:#bbb;} 
.nosnow {color:#666;}

.home {color:#000;}
.work {color:#ed278d;}
.experience {color:#00aeef;}
.waste {color:#00ff00;}
.contact {color:#d0d0d0;}

.on {color:#bbb;} 
.off {color:#666;}

.email {color:#DC143C;} 

.sticky {color:#ed278d;}


body#home h1 {color:#000;}
body#work h1 {color:#ed278d;}
body#experience h1 {color:#00aeef;}
body#waste h1{color:#00ff00;}
body#contact h1{color:#d0d0d0;}


body#home .thumb {border-color:#000;}
body#work .thumb {border-color:#ed278d;}
body#experience .thumb {border-color:#00aeef;}
body#waste .thumb {border-color:#00ff00;}

/* hover thumbs colors +30% luminoscity in LAB-method */

body#home .thumb:hover {border-color:#474747;}
body#work .thumb:hover {border-color:#ff8cdf;}
body#experience .thumb:hover {border-color:#89ffff;}
body#waste .thumb:hover {border-color:#5aff43;}


	
/* document */

* html .kolomlinks {                    
	width:350px;w\idth:300px;} /* broken box IE5 */


body {
	margin:0;
	padding:0;
	-x-system-font:none;
	font-size:62.5%;  /* 16px × 62.5% = 10px */
	font-family: Arial, Helvetica, sans-serif;

	background-color:#fff;
	color: #000;
	text-decoration: none;
	word-spacing: normal;
	text-align:left;
	letter-spacing:0;
	line-height:1.2em;
	}


div#flashmenu {
	width:300px;
	height:650px;
	position:absolute;
	top:0px;
	left:0px;
	z-index:10;
	}

div#logo {
	width:300px;
	height:307px;
	position:absolute;
	top:80px;
	right:50px;
	z-index:0;
	}
	
div#sitenav {
	min-width:700px;
	max-width:900px;
	line-height:2em;
	position:absolute;
	top:20px;
	right:50px;
	z-index:20;
	font-size:1.5em;
	}

div#sitenav .space {
	margin-right:2em;
	}
	

div#sitenav ul {
	float:right;
	}

div#sitenav ul li {
	display: inline;
	}

div#sitenav a {
	margin-left:1em;
	font-weight:bold;
	text-decoration:none; 
	}

div#sitenav a:hover {
	text-decoration:underline;
	}

div#sitenav a.ul, div#sitenav a.on {
	text-decoration:underline;
	}

div#sitenav a.nosnow {text-decoration:underline;} /*active*/

div#wrapper {
	min-width:400px;
	max-width:1200px;
	top:250px;
	margin:0 40px 0 300px;
	background:transparent; 
	position:relative;
	z-index:100;
	}	


div#crumb {
	height:1.4em;
	font-size:1.4em;
	line-height:1.3em;
	color:#333;
	margin:0 0 1em 0;
	}
	
div#crumb a{
	text-decoration:none;
	font-variant:small-caps;
	color:#666;
	}

div#crumb .here {
	text-decoration:none;
	font-variant:small-caps;
	color:#333;
	}

div#crumb a:hover {
	text-decoration:underline;
	}


div#content {
	max-width:150em;
	padding:0 0.5em 3em 0;
	margin:5px 0 0 0;
	/* color:#444; */
	}



	
div#content h1 {
	font-size:1.8em;
	line-height:1em;
	clear:left;
	padding-top:1em;
	}

div#content h1:first-child {
	padding-top:0em;
	}

div#content p {
	max-width:45em;
	font-size:1.5em;
	line-height:1.4em;
	margin:0.5em 0 1em 0;
	color:#333;
	}




div#content li.thumb {
	float:left;
	width:125px;
	height:125px;
	margin:10px 25px 15px 0;
	padding:0 0 0 0;
	border-width:5px;
	border-style:solid;
	list-style-type:none;
	}
	

div#content li.thumb img{
	opacity:0.7;
	filter:alpha (opacity=70);
	moz-opacity:0.7;
	khtml-opacity:0.7;
}

div#content li.thumb:hover img{
	opacity:1;
	filter:alpha (opacity=100);
	moz-opacity:1;
	khtml-opacity:1;
}


/* news */

div#news {
	display:none;
	float:right;
	width:200px;
	padding:0 0 20px 10px;
	margin:0 0 0 0;
	border-left:1px dotted #aaa;
	 
	}

div.newsitem {
	padding-top:10px;
	}

#news span.date {
	font-weight:bold;
	clear:both;
	} 

/* footer */


div#footer {
	float:left;
	text-align:left;
	font-size:1.2em;
	line-height:1.4em;
	clear:both;
	margin-top:30px;
	z-index:50;
	color:#666;
	
	
	}

div#footer .copyright {
	font-weight:bold;
	}

div#footer .joke {
	font-size:80%;
	}
	
div#footer a {
	text-decoration:none;
	color:#000000;
	}

div#footer:hover a{
	text-decoration:underline;
	}
	

/* following the css for .full page */


body.full div#wrapper {
	top:100px;
	margin:0 40px 0 150px;
	}

body.full div#content {
	/* min-width:35em; */
	/* max-width:100em; */
	}

body.full div#content p {
	margin-top:5px;
	max-width:55em;
	}


body.full div#content img {
	margin:10px 20px 10px 0;
	float:left;
	border-color:#ccc;
	border-width:2px;
	border-style:solid;
	}
	
body.full div#content img.left {
	clear:left;
	}

body.full div#logo {
	position:relative;
	float:right;
	left:auto;
	right:0px;
	margin-right:-20px;
}

div#datasheet {
	position:fixed;
	width:10em;
	top:16.2em;
	left:-11em;
	font-weight:bold;
	padding:1em 4em 1em 0;
	color:#fff;
	background-color:#ed278d;
	-moz-border-radius-topright:10px;  /*special bonus for Safari and firefox users */
	-moz-border-radius-bottomright:10px;
	-webkit-border-radius-topright:10px;
	-webkit-border-radius-bottomright:10px;
	}

div#datasheet span.arrow{
	font-weight:bold;
	font-size:3em;
	position:absolute;
	bottom:5px;
	right:5px;
	line-height:1em;
	}


div#datasheet h1 {
	font-size:1.4em;
	line-height:2em;
	margin-bottom:0.5em;
	color:#fff;
	}

div#datasheet ul {
	font-size:1.2em;
	margin-left:1em;
	list-style-position:inside;
	line-height:1.2em;
	}

div#datasheet ul li {
	margin-bottom:0.5em;
	}

div#datasheet:hover{
	padding:1em 1em 1em 1em;
	left:0;
	}
	
div#datasheet:hover span.arrow {
	display:none;
	}