/*==============================================================================
	CORE STYLES
	2009-08-02
	Mark Gerrard, Sel-Vin Kuik
	outsideline.co.uk
==============================================================================*/

* {
	margin: 0;
	padding: 0;
}

body {
	font-size: 62.5%;
	font-family: Arial, Verdana, sans-serif;
	color: #333;
	background:#fff;
}

textarea {
	font-size: 1.1em;
	font-family: Arial, Verdana, sans-serif;
}

a {
	color: #333;
	text-decoration: none;
	font-weight: bold;
}

a:hover {
	color: #6ABE00;
}

p {
	line-height: 1.3em;
	margin-bottom: 1.2em;
}

img {
	border: none;
}

p.back img {
	vertical-align: middle;
	padding-right: 5px;
}

h3.link img {
	vertical-align: middle;
	padding-right: 5px;
}

.nodisplay {
	display: none;
}

.clear {
	clear:both;
}

/*=======================================
	GILDER LEVIN TEXT REPLACEMENT
=======================================*/
.gltr {position: relative;}
.gltr span {position: absolute;width: 100%;height: 100%;background-repeat: no-repeat; background-position: 0 0;}


.extra a {display: block;}

.hide {display: none;}

#container {
	width: 972px;
	margin: 45px auto;
	font-size: 1.1em;
	padding: 0 45px;
}

#content {
	width: 100%;
	overflow: hidden;
}

/*=======================================
	HEADER STYLES
=======================================*/
#header {
	width: 100%;
	height: 102px;
	position: relative;
	margin-bottom: 28px;
	overflow: hidden;
}

#header h1 {margin-bottom: 48px;}

#header h1 a {
	text-indent: -1000em;
	width: 39px;
	height: 39px;
	display: block;
	background: url("../img/layout/logo-ol-39x39.gif") no-repeat 0 0;
}

#header h2 {
	position: absolute;
	right: 0;
	bottom: 0;
	text-transform: uppercase;
	font-size: 0.818em;
}

#header h2 em {
	font-style: normal;
	color: #bdbdbd;
}

#header ul {
	overflow: hidden;
	width: 100%;
}

#header ul li {
	list-style: none;
	display: inline;
	text-transform: uppercase;
	font-size: 1.182em;
}

#header ul li a {
	float: left;
	margin-right: 17px;
	outline-style: none;
	overflow: hidden;
}


/*=======================================
	FOOTER STYLES
=======================================*/
#footer {
	padding-top: 25px;
	background: url("../img/layout/dots-horiz.gif") repeat-x 0 0;
}

#footer .logo {
	clear: both;
	margin-bottom: 20px;
	padding-top: 15px;
	background: url("../img/layout/logo-ol-15x14.gif") no-repeat 0 0;
	text-transform: uppercase;
	font-weight: bold;
	color: #6e6e6e;
	font-size: 0.818em;
}

#footer address {
	width: 375px;
	font-style: normal;
	color: #8d8d8d;
}

#footer address span.one {
	float: left;
	clear: left;
	/*width: 196px;*/ 
	width:150px;
}

#footer address span.two {
	float: left;
	margin-right: 40px;
}

#footer address span.one span, #footer address span.two span {
	display: block;
}

#footer .copy {
	clear: both;
	padding-top: 50px;
	color: #bebebe;
}

#footer #awards {
	float: right;
	list-style: none;
}

#footer #awards li {
	float: left;
	/*margin-right: 42px;*/
	margin-right:28px;
}

#footer #awards li.last {
	margin-right: 20px;
}

#footer #awards li img.over {display: none;}

#footer .social {
	float: right;
	clear: right;
}

#footer .social li {list-style: none; float: right;}
#footer .social li a {float: right; width: 30px; height: 30px; text-indent: -1000em; display: inline;}
#footer .social .facebook a {background: url(../img/logos/facebook.gif) no-repeat 0 0;}
#footer .social .twitter a {background: url(../img/logos/twitter.gif) no-repeat 0 0; margin-right: 20px; margin-left: 10px;}
#footer .social a:hover {background-position: 0 -30px;}

/*=======================================
	GRID STYLES
=======================================*/
.row {
	margin-bottom: 23px;
	overflow: hidden;
	width: 100%;
}

.row.sep {padding-bottom: 20px;}

.sep {background: url("../img/layout/dots-horiz.gif") repeat-x left bottom;}

.col1, .col2, .col3, .col4 {float: left;margin-right: 23px;}
.col1.last, .col2.last, .col3.last, .col4.last {margin-right: 0;}

.col1 {width: 176px;}
.col2 {width: 375px;}
.col3 {width: 574px;}
.col4 {width: 773px;}


.workList h2,
.workList h3 {text-transform: uppercase;}

.workList h3 {
	margin-bottom: 0.75em;
	font-size: 1.818em;
	font-weight: normal;
}


blockquote {
	padding: 20px;
	color: #FFF;
	font-style: italic;
	font-size: 1.091em;
	background: #424242 url("../img/layout/bg-quote.gif") no-repeat right bottom;
}

blockquote .cite {
	font-style: normal;
	font-size: 0.917em;
}

blockquote .cite strong {
	font-size: 1.182em;
}


.sepList li {
	padding: 0.6em 0;
	background: url("../img/layout/dots-horiz.gif") repeat-x left bottom;
}

.sepListNoLine li {
	padding: 0.6em 0;
}

.media.comment {
	font-size: 0.833em;
	color: #969696;
}


/*=======================================
	FORM STYLES
=======================================*/
form input,
form select,
form textarea {
	padding: 0.2em;
	border: 1px solid #c9c9c9;
}

form input.btn {
	vertical-align: middle;
	border: none;
}