/*	Desc: 01 Screen Style Sheet
	Author: Jim Olson
	Date: July 2009
	+ Colours
	- *colour hex* *colour name* (*purpose*)
	
=== === === === === === === === === === */

/*=STRUCTURE
=== === === === === === === === === === */

@import 'reset.css';

body {font-size:12px;font-family:arial;text-align:center;background: #8f9491 url(../images/bg.gif) repeat-x;}

div#WrapOuter {width:960px;margin-left:auto;margin-right:auto;}

div#WrapInner {text-align:left;width:960px;margin:auto;float:left;}

div#Header {color:#fff;font-size:150%;line-height:40px;width:940px;height: 74px;padding:5px 10px; margin-top: 24px;}

div#Logo {width:95px;margin-right: 105px;float:left;overflow: hidden;}

div#Logo a {width:95px;height:61px;background: url(../images/logo.png);display: block;text-indent: -9999px; float: left;}

/*=COMMON
=== === === === === === === === === === */

* {padding:0;margin: 0}

h1, h2, h3, h4, h5 {color:#103f7e;}

h1 {font-size:150%;}

h2 {font-size:140%;}

h3 {font-size:125%;}

h3 {font-size:110%;}

p, li {line-height:150%;}

h1, h2, h3, h4, h5, ul, ol, p {margin-bottom:12px;}

a:link {color:#217efb;text-decoration:none;}
a:visited {color:#217efb;text-decoration:none;}
a:hover {color:#1a00fa;text-decoration:underline;}
a:active {color:#f71313;text-decoration:none;}

body.Home a:link {color:#f4f0ca;text-decoration:none;}
body.Home a:visited {color:#f4f0ca;text-decoration:none;}
body.Home a:hover {color:#f4f0ca;text-decoration:underline;}
body.Home a:active {color:#f4f0ca;text-decoration:none;}

b, strong {font-weight:bold;}
i, em {font-style:italic;}

table {border-collapse:collapse;}
table thead {font-weight:bold;background:#bababa;}
table td {padding:6px;}

.line {height: 2px;border-top:0px dotted #fff;border-right:0px dotted #fff;border-left:0px dotted #fff;border-bottom:1px dotted #6f6f6f;display:block;}

/*=NAVIGATION
=== === === === === === === === === === */

div#MainNav {width:650px;height:20px;padding:5px 10px;float: left;
	margin-top: 18px;
}
div#MainNav li {margin-right:10px;float: left;}
div#MainNav li a {text-indent: -9999px;display: block;
	margin-right: 12px;
}

div#MainNav li#Services a {
	width: 57px;
	height: 13px;
	background: url(../images/services_03.png) no-repeat;
}

body.Services div#Header {background: url(../images/mainnav-marker.png) no-repeat 232px 67px;}

body.Services div#MainNav li#Services a,
div#MainNav li#Services a:hover {
	background: url(../images/ro/services_03.png) no-repeat;
}

div#MainNav li#Sponsor a {
	width: 123px;
	height: 13px;
	background: url(../images/sponsor_05.png) no-repeat;
}

body.Sponsor div#Header {background: url(../images/mainnav-marker.png) no-repeat 343px 67px;}

body.Sponsor div#MainNav li#Sponsor a,
div#MainNav li#Sponsor a:hover {
	background: url(../images/ro/sponsor_05.png) no-repeat;	
}

div#MainNav li#Portfolio a {
	width: 64px;
	height: 13px;
	background: url(../images/portfolio_07.png) no-repeat;
}

body.Portfolio div#Header {background: url(../images/mainnav-marker.png) no-repeat 456px 67px;}

body.Portfolio div#MainNav li#Portfolio a,
div#MainNav li#Portfolio a:hover {
	background: url(../images/ro/portfolio_07.png) no-repeat;
}

div#MainNav li#About a {
	width: 60px;
	height: 13px;
	background: url(../images/about_09.png) no-repeat;
}

body.About div#Header {background: url(../images/mainnav-marker.png) no-repeat 544px 67px;}

body.About div#MainNav li#About a,
div#MainNav li#About a:hover {
	background: url(../images/ro/about_09.png) no-repeat;
}

div#MainNav li#News a {
	width: 94px;
	height: 13px;
	background: url(../images/news_events_11.png) no-repeat;
}

body.News div#Header {background: url(../images/mainnav-marker.png) no-repeat 637px 67px;}

body.News div#MainNav li#News a,
div#MainNav li#News a:hover { 
	background: url(../images/ro/news_events_11.png) no-repeat;
}

div#MainNav li#Resources a {
	width: 69px;
	height: 13px;
	background: url(../images/resources_13.png) no-repeat;
}

body.Resources div#Header {background: url(../images/mainnav-marker.png) no-repeat 742px 67px;}

body.Resources div#MainNav li#Resources a,
div#MainNav li#Resources a:hover { 
	background: url(../images/ro/resources_13.png) no-repeat;
}

/*=CONTENT
=== === === === === === === === === === */

div#Content {color:#333;background: #fff;width:940px;padding:20px 10px;float:left;}
div#Content ul li {margin-left:20px;list-style:circle;}
div#Content ol li {margin-left:30px;list-style:decimal-leading-zero;}

div#Content.mostlytext {color:#333;background: #fff;width:625px;padding:60px 220px 20px 115px;float:left;}

/*=HOMEPAGE CONTENT
=== === === === === === === === === === */

body.Home div#Content {color:#333;width:960px;padding-top:0;float:left;background: none;}
div#Hero {width: 960px; height: 223px; float: left; background: url(../images/hero-map.jpg) no-repeat;}
div#Hero div#Headline {color: #ffffff;width:300px;margin: 50px 60px 0 600px;}
div#Hero div#Headline h1 {color: #ffffff;width: 274px;height: 65px;text-indent: -9999px;background: url(../images/hero-title.png) no-repeat;display: block;}
div#Hero div#Headline p {text-shadow: 1px 1px black; color: white; line-height: 130%;}
div#Content ul#Features {width: 960px;margin-top: 40px;float: left;clear: both;}
div#Content ul#Features li {font-size:90%;width: 200px; height: 145px; margin: 0 30px 0px 50px; float:left; display: block;}
div#Content ul#Features li#Work {margin-left: 40px;}
div#Content ul#Features li h2 {text-indent: -9999px; height: 15px; margin-bottom: 5px;display: block;float: left;}
div#Content ul#Features li div.title { width:200px;margin-bottom: 11px; padding-left: 2px; border-bottom: 1px #757678 solid;float: left;}
div#Content ul#Features li p {color:#ffffff;line-height: 110%;margin-bottom: 4px;}
div#Content ul#Features li a {line-height: 110%;white-space: nowrap;}
div#Content ul#Features li#Work h2 {width: 87px; background: url(../images/recentwork-bottom_03.png) no-repeat;}
div#Content ul#Features li#Madrona h2 {width: 101px; background: url(../images/latestproject-bottom_07.png) no-repeat;}
div#Content ul#Features li#Madrona div#MadronaLogo {width:66px;float: left;}
div#Content ul#Features li#Madrona div#MadronaTitle {text-indent:-9999px;width:110px;height:17px; float: left; background: url(../images/madronatitle-bottom_18.png); no-repeat: display: block;}
div#Content ul#Features li#Madrona p {margin-top: 8px;width:125px;float:left;}
div#Content ul#Features li#Blog h2 {width: 95px; background: url(../images/blog-bottom_09.png) no-repeat;}
div#Content ul#Features li#Blog h3 {color: #fff; font-size:100%;margin: 0;line-height: 100%;margin-bottom: 3px;}
div#Content ul#Features .rss {width:14px;height:15px;float: right; background: url(../images/rss.png); no-repeat: display: block;}

/*=FOOTER
=== === === === === === === === === === */

div#Footer {color:#ffffff;font-size:70%;line-height:20px;text-transform: uppercase;width:940px;height:20px;padding:5px 10px;background:#555555;float:left;}
body.Home div#Footer {margin-left:10px;}
/* PORTFOLIO */

div#Content.portfolio {color:#333333;background: #ffffff;width: 889px;padding: 60px 50px 20px 20px;float:left;}

div#Column1 {width: 244px;float:left;text-align: right;}

div#Column2 {width: 569px;float:left;margin-left: 23px;}

div#Project, #ProjectTitle h1 {margin: 0;padding: 0;line-height: 30px;font-size: 16px;text-transform: uppercase;}
#ProjectTitle h1 {color: #333333;}
div#Project {color: #808080;}
div#Client {color: #808080;padding-bottom: 40px;text-transform: uppercase;}
div#Column2 div#Client {color: #333333;}
div#Images {width: 569px;float: left;padding-bottom: 40px;}
div#Content #Images ul li {width: 90px;display: block;float: left;margin: 0;padding: 0;}
div#Content #Images ul li.ThumbInstructions {width: 176px;font-size: 10px;}

#ProjectSubNav {width: 244px;}
div#Content #ProjectSubNav ul { padding-bottom:2px;},
div#Content #ProjectSubNav ul li {width: 250px;list-style-type: none;text-align: left;margin: 0;padding: 0;float: left;}

div#Content #ProjectSubNav ul li {border-bottom: 1px #eee solid;}

div#Content #ProjectSubNav ul li a:link,
div#Content #ProjectSubNav ul li a:visited,
div#Content #ProjectSubNav ul li a:hover,
div#Content #ProjectSubNav ul li a:active {color:#217efb;display: block;width: 170px;margin: 2px;}
div#Content #ProjectSubNav ul li a.active {border-right: 5px #eee solid;}
div#Content #ProjectSubNav ul li:last-child {border: 0;}
#ProjectSubNav #title {color: #000000;letter-spacing: 1px;text-align: left;padding-bottom: 8px;text-transform:uppercase;padding-top: 25px;}


/*=SPECIAL CSS FOR FLIR
=== === === === === === === === === === */

h1 {font-size: 33px}

div#Project, #Title {height: 30px;}

div#Project, #Title h1 {font-size: 26px;margin-bottom: 0px;}

div#Client {font-size: 18px;}