@charset "utf-8";

/*---------------------------------------------------------------------*\
|                                                                       |
|    Oast One Portfolio CSS                                             |
|    Totally nailed at Oast One by James Marett, November 2008          |
|    oastone.co.uk														|
|                                                                       |
|    NOTES:                                                             |
|    Colours:                                                           |
|    Blue: #06C                                                         |
|    Light Blue: #6CF                                                   |
|    Green: #87BE55                                                     |
|    Dark Green: #62A421                                                |
|                                                                       |
\*---------------------------------------------------------------------*/

/*-- General --*/

body {
	background: #fff url(../portfolio/images/oo_portfolio_header_bg.jpg) repeat-x;	
}

/*-- Layout --*/

#container {
	min-width: 960px;
}

#header {
	background: url(../portfolio/images/oo_portfolio_header_right.jpg) no-repeat top right;
	height: 40px;
	padding: 20px;
}
#header h1 { 
	display: none;
}
#breadcrumbtrail {
	height: 40px;
	line-height: 40px;
	padding: 0 20px;
	color: #6CF;
	/*border-bottom: 1px solid #06C;*/
}
#breadcrumbtrail a {
	color: #06C;
	text-decoration: none;
}
#breadcrumbtrail a:hover {
	color: #62A421;
}

#page {
	padding: 20px;
	text-align: left;
	min-height: 500px;
}
#page .openbutton {
	border-top: #6CF 1px dotted;
	font-size: 14px;
	
}
#page .openbutton a {
	color: #06C;
	display: block;
	padding: 5px 2px;
}
#page .openbutton a:hover {
	background: #6CF;
	color: #FFF;
}
#page a:focus {
	outline: none
} 
#page .more {
	min-height: 320px;
}
#page .more img {
	border: none;
}
#page .seemore {
	font-size: 11px;
	text-align: right;
	padding-top: 30px;
}
#page .project {
	width: 402px;
	text-align: left;
	min-height: 300px;
	margin-top: 30px;
}
#page .project img {
	border: 1px solid #06C; /*#6CF;*/
}
#page .imagenumbers {
	margin-top: 4px;
	height: 16px;
}
#page .imagenumbers a {
	padding: 2px;
	border: 1px solid #06C;
	color: #06C;
	margin-right: 5px;
	font-size: 10px;
	line-height: 10px;
	display: block;
	width: 10px;
	height: 10px;
	text-align: center;
	float: left;
}
#page .imagenumbers a:hover {
	color: #fff;
	background: #06C;
}
#page .dropthird {
	width: 33%;
	float: left;
	text-align: center;
	display: block;
	/*min-height: 300px;*/
}
#page .dropthird p a {
	color: #666;
	display: block;
	padding-top: 15px;
}
#page .dropthird:hover a {
	color: #06C;
}

/*-- formatting --*/
.half {
	width: 50%;
	float: left;
	/*min-height: 300px;*/
}
.third {
	width: 33%;
	float: left;
	text-align: center;
	/*min-height: 300px;*/
}
.quarter {
	width: 25%;
	float: left;
	text-align: center;
}