/* ***************************************************************************************
** These rules apply to portfolio.html
------------------------------------------------------------------------------------------ */

/* Layout: Showcases div
------------------------------------------------------------------------------------------ */
	div#showcases:after {
		content:".";
		height:0;
		visibility:hidden;
		display:block;
		clear:both;
	}

	div#showcases h2.first {
		clear:both;
		width:699px;
		height:19px;
		margin:0 0 21px 38px;
		padding:0;
		font:normal 1.3em tahoma;
		position:relative;
		overflow:hidden;
	}

	div#showcases h2.first span {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background: url(images/portfolio/kundcase-spunk-h2-bg.gif) no-repeat top left;
	}

/* Layout: Main-column div
------------------------------------------------------------------------------------------ */
	div#showcases div#main-column {
		float:right;
		width:519px;
		margin:0 40px 0 0;
		padding:0 0 0 15px;
		display:inline;
	}

	div#main-column p {
		margin:0;
		padding:0 0 7px 0;
		font:normal 1.2em tahoma;
		color:#484848;
		line-height:140%;
	}

	div#main-column a:link, div#main-column a:visited  {
		color:#484848;
	}

	div#main-column a:hover {
		color:#be0417;
		text-decoration:none;
	}

/* Layout: Secondary-column div
------------------------------------------------------------------------------------------ */
	div#showcases div#secondary-column {
		float:left;
		padding:4px 0 0 0;
		margin:0 0 0 40px;
		display:inline;
		width:165px;
	}

	div#secondary-column h3#cases {
		margin:0 0 13px 0;
		padding:0;
		width:43px;
		height:15px;
		position:relative;
		overflow:hidden;
		font:normal 1.2em tahoma;
	}

	div#secondary-column h3#cases span {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background:url(images/portfolio/cases-h3-bg.gif) no-repeat top left;
	}

	div#secondary-column ul {
		margin:0;
		padding:0 0 9px 0;
		list-style:none;
		width:157px;
		border-bottom:1px solid #e1e2e3;
	}

	div#secondary-column ul li {
		background:url(images/portfolio/secondary-column-li-bg.jpg) repeat-y top left;
		margin:0 0 6px 0;
		padding:2px 0 2px 8px;
	}

	div#secondary-column ul li a:link, div#secondary-column ul li a:visited {
		color:#484848;
		display:block;
		text-decoration:none;
		font:normal 1.2em tahoma;
	}

	div#secondary-column ul li a:hover {
		color:#be0417;
	}

	div#secondary-column ul li#current-case {
		background:#484848;
	}

	div#secondary-column ul li#current-case a {
		color:#fff;
	}

/* Slideshow
------------------------------------------------------------------------------------------ */
	div#slideshow {
		margin:0 0 15px 0;
		width:519px;
		height:366px;
		position:relative;
	}

	div#slideshow div#controls {
		position:relative;
		z-index:100;
	}

	div#slideshow div#slidesContainer {
		margin:0 auto;
		width:519px;
		height:366px;
		overflow:auto;
		position:relative;
		z-index:1;
	}
	
	div#slideshow div#slidesContainer div.slide {
		margin:0 auto;
		width:499px;
		height:366px;
		z-index:1;
	}

	span.control {
		display:block;
		width:32px;
		height:56px;
		text-indent:-10000px;
		position:absolute;
		cursor:pointer;
	}

	span#leftControl {
		top:155px;
		left:0;
		background:url(images/portfolio/slideshow-previous.png) no-repeat 0 0;
	}

	span#rightControl {
		top:155px;
		right:0;
		background:url(images/portfolio/slideshow-next.png) no-repeat 0 0;
		position:absolute;
		z-index:100;
	}