/*  TREVOR FILTER Portfolio CSS
    Copyright 2010
*/

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, pre,
blockquote, a, abbr, acronym, address, cite, code, del, em, img,
ins, small, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset,
form, input, button, label, legend, table, caption, tr, th, td, 
header, nav, section, article, aside, details, figure, footer {
	margin: 0; padding: 0; border: 0; outline: 0;
	font-weight: inherit; font-style: inherit;
	font-size: 100%; font-family: inherit;
	vertical-align: baseline;
}

header, nav, section, article, aside, details, figure, footer { 
	display: block;
}

body {
	background: #fff;
	font: 10px/1 Helvetica, Arial, clean, sans-serif;
	color: #333;
}

footer, #clients, #about {
	display: none;
}


/* Dev tools

#baseline {
	display: none;
	background: url(/tpl/baseline.png);
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	z-index: 10;
}

#grid {
	display: none;
	background: url(/tpl/grid.png) repeat-y top center;
	position: fixed;
	top: 0; left: 0;
	width: 100%; height: 100%;
	z-index: 10;
}

*/

/* Text
----------------------------------- */

p { margin: 0 0 1em; }

b, strong { font-weight: bold; }

i, em { font-style: italic; }

i i, em em { font-style: normal; margin-left: .25em; }

pre, code { font-family: monospace; }

code { color: #666; }

:focus { outline: 0; }


/* Headings */

h2 {
	display: block;
	margin: .37em 0 1.46em;
	font: bold 110% Helvetica, Arial, sans-serif;
}

h3 {
	display: block;
	font: bold 100% Helvetica, Arial, sans-serif;
}


/* Links */

a:link, a:visited {
	display: inline-block;
	text-decoration: none;
	color: #367099;
}

a:hover, a:active {
	text-decoration: underline;
	-moz-outline: none;
	color: #205880;
}


/* Lists */

article li {
	margin: 0 0 1.09em;
	list-style: square;
}

article ol li {
	list-style: decimal;
}

article li li {
	margin-left: 10px;
}


/* Misc */

.hide { display: none !important; }

hr { visibility: hidden; clear: both; }

abbr { border-bottom: 1px dotted #ccc; cursor: help; }

blockquote:before, blockquote:after { content: ""; }
blockquote { margin: 0 0 1em; quotes: "" ""; }

sup { vertical-align: 75%; }

span.strike, p.strike, del { text-decoration: line-through; }



/* Structure
----------------------------------- */

/* Header */

header {
	border-top: 4px solid #7a7a7a;
	padding: 4.1em 48px 0;
}

h1 {
	display: block;
	width: 121px;
	height: 18px;
	margin: 0 0 .8em;
}

h1 a {
	background: url(/img/logotype.gif) no-repeat top left;
	display: block;
	width: 121px;
	height: 18px;
}

h1 a:hover {
	background-position: 0 -18px;
}

h1 span {
	position: absolute;
	left: -9999px;
}

nav {
	position: relative;
}

nav ul {
	margin: 0 0 0 -10px;
	list-style: none;
}

nav li {
	display: inline-block;
}

nav li a:link, nav li a:visited {
	padding: .73em 10px;
	font-weight: bold;
	font-size: 110%;
	color: #999;
}

nav li a:hover, nav li a:active {
	text-decoration: none;
	color: #666;
}

nav li a.active {
	color: #333;
}


/* Articles */

article {
	clear: both;
/*	border-top: 1px solid #f2f2f2;*/
}

article div {
	width: 670px;
	padding: 2.4em 48px 1.4em;
}

article p {
	font-size: 110%;
	margin: 0 0 1.28em;
	line-height: 1.91;
	width: 42em;
}


/* Footer */

footer {
	padding: 2.4em 48px;
	line-height: 2.4;
}

footer small {
	color: #aaa;
}

footer a:link, footer a:visited {
	color: #888;
}

footer a:hover, footer a:active {
	color: #555;
}



/* Clients
------------------------------------ */

#clients ul {
	width: 200px;
	float: left;
	margin: 0 0 1.6em;
}

#clients ul li {
	list-style: none;
	margin: 0 0 1.8em;
	line-height: 1;
}