/* ---------------------------------------- */
/* PORTFOLIO ITEMS 							*/
/* ---------------------------------------- */

body#web-design div#content {
	background-image: none;
	min-height: 1060px;
}
body#graphic-design div#content, body#logos-branding div#content {
	background-image: none;
	min-height: 780px;
}
div#main-content {
	float: right;
	width: 310px;
}
div#tech-specs {
	background: url(../images/timber-tiles-light.jpg);
	margin: 10px 0 30px 0;
	padding: 15px 0 0 0;
}
div#main-content div#project-description {
	min-height: 350px;
}
div#main-content table {
	border-bottom: 1px dotted #3A2518;
	border-right: 1px solid #FFF; /* fixes a 1px offset of the horizontal border */
	color: #3A2518;
	font-size: 85%;
	margin: 5px 0 0 0;
	width: 100%;
}
div#main-content table caption {
	display: none;
}
div#main-content table tr {
	border-top: 1px dotted #3A2518;
	height: 50px;
	overflow: visible;
}
	div#main-content table tr.par {
		background: url(../images/table-tr-par.png);
	}

div#main-content table th {
	font-weight: bolder;
}
div#main-content table td, div#main-content table th {
	padding: 10px;
	vertical-align: text-top;
}
div#main-content div#flashobject {
	left: -620px;
	position: absolute; /* 'frees' it from its parent column. this way we can maintain structural coherence and still be able to achieve a visually-appealing layout */
}
div#secondary-content {
	border-top: 1px dotted #3A2518;
	clear: both;
	position: absolute;
	margin: 10px 0 0 0;
	top: 360px;
	width: 600px;
}
body#graphic-design div#secondary-content h3 {
	background-position: 0 -1540px;
}
body#logos-branding div#secondary-content h3 {
	background-position: 0 -1610px;
}
body#web-design div#secondary-content h3 {
	background-position: 0 -1680px;
}
div#secondary-content div.item {
	height: 180px;
}
div#secondary-content div.other-projects p a {
	border: none;
}
div#secondary-content div.other-projects p a img {
	border: 2px solid #B2A395;
}
div#secondary-content div.other-projects p a:hover img {
	border-color: #826955;
}

/* horizontal scroll styles */

div#secondary-content #hscroll {
	position:relative;
	width:600px;
}
	#hscroll .next, #hscroll .prev {
		background: url(../images/ballons2.png) top left no-repeat;
		cursor: pointer;
		height: 27px;
		position:absolute;
		text-indent: -9999px;
		top:-45px;
		width: 30px;
	}
	#hscroll .instruction {
		background: url(../images/ballons2.png) -53px 0 no-repeat;
		height: 27px;
		position: absolute;
		right: 65px;
		text-indent: -9999px;
		top: -45px;
		width: 74px;
	}
	#hscroll .prev {
		right: 140px;
	}
	#hscroll .prev:hover {
		background-position: 0 -28px;
	}
	#hscroll .next {
		background-position: -151px 0;
		right: 33px;
	}
	#hscroll .next:hover {
		background-position: -151px -28px;
	}
	
div#secondary-content #sections {
	overflow:hidden;
	width:600px;
	clear:left;
	height: 396px;
}
	
div#secondary-content #sections #nester {
	width:9999px;
}
	
div#secondary-content #sections .h-scroller{
	float:left;
	width: 600px;
}


/* favicon gallery */

body#web-design div#secondary-content div#favicons {
	border-top: 1px dotted #3A2518;
	clear: both;
	padding: 0;
	width: 600px;
}

body#web-design div#secondary-content div#favicons ul {
	background: #F9F5E1;
	margin: 0 0 0 20px;
	padding: 5px;
	width: 320px;
	height: 140px;
}
body#web-design div#secondary-content div#favicons ul li {
	display: block;
	float: left;
	height: 16px;
	margin: 7px 12px 5px 12px;
}
body#web-design div#secondary-content div#favicons ul li a {
	border: none;
}
body#web-design div#secondary-content div#favicons p.see-more {
	background: url(../images/actions2.png) 0 -252px no-repeat;
	left: 380px;
	top: 102px;
}