/* Reset
--------------------------------------------*/
html, body, h1, h2, h3, h4, h5, h6, section, header, footer, aside, p, ul, ol, li, dl, dt, dd, form { display: block; list-style: none; margin: 0; padding: 0; } 



/* Structure
--------------------------------------------*/
body										{ background: #000 url('/template/bodyContainer-bg.png') repeat-x left top; color: #bbb; font: 20px/30px arial, helvetica, sans-serif; }
div#bodyContainer							{ background: transparent url('/template/body-bg.jpg') no-repeat center top; }
div#container								{ width: 770px; margin: 0 auto; }

div#header									{ width: 770px; height: 165px; background: url('/template/header-bg.jpg'); }
div#logoBox 								{ position: absolute; left: 0; top: 25px; width: 30%; height: 115px; background: url('/template/logo-bg.png'); }

div#content									{ clear: both; padding-top: 30px; }
div#banner									{ position: absolute; left: 0; right: 0; top: 225px; width: 100%; height: 450px; }
div#bannerClear								{ height: 430px; }


/* Layout
--------------------------------------------*/
div#header h1								{ position: absolute; margin: 0; padding-top: 20px; -webkit-box-reflect: none; }
div#header h1 span#logo						{ display: block; z-index: 9999; width: 465px; height: 125px; background: url('/template/logo.png'); text-indent: -9999px; }
div#header h2								{ display: none; }

div#workList								{ float: left; width: 300px; padding-top: 20px; }
div#workDetails								{ float: left; width: 450px; margin-left: 20px; padding: 20px 0 40px; }

div#workList ul li							{ border: solid 1px #000; padding: 1px; margin: 3px; float: left; font-size: 0; line-height: 0; }
div#workList ul li.current					{ border: solid 1px #8cc63f; }



/* Typography
--------------------------------------------*/
p											{ margin: 0 0 30px; }

em		 									{ color: #fff; font-style: normal; }

h1											{ margin: 0 0 15px; color: #8cc63f; font-size: 40px; font-weight: normal; line-height: 60px; }
h2											{  }
h3											{ color: #fff; font-size: 20px; font-weight: normal; }

div#banner h1								{ position: absolute; width: 100%; top: 170px; margin: 0 auto; color: #fff; font-size: 30px; padding: 20px 0; text-align: center; }
div#banner p								{ margin: 0; }

body.rgba div#banner h1						{ background-color: rgba(0, 0, 0, 0.8); }
body.no-rgba div#banner h1					{ background: #000; opacity: 0.8; }

div#workDetails p							{ margin-bottom: 15px; font-size: 15px; line-height: 30px; }


/* Linkage
--------------------------------------------*/
a											{ outline: none; }
a img										{ border: none; }

div#content a:link,
div#content a:visited						{ padding: 1px 0; border-bottom: solid 1px #555; color: #bbb; text-decoration: none; }
div#content a:hover							{ border-bottom: solid 1px #8cc63f; background-color: #8cc63f; color: #000; }

div#content em a:link,
div#content em a:visited					{ color: #fff; }
div#content em a:hover						{ color: #000; }

div#content div#workList a:link,
div#content div#workList a:visited,
div#content div#workList a:hover			{ padding: 0; border: none; background: none; }



/* Navigation
--------------------------------------------*/
div#nav										{ width: 770px; float: left; margin-top: 10px; }
div#nav ul									{ float: right; }
div#nav ul li								{ float: left; }
div#nav ul li a								{ display: block; height: 40px; background: url('/template/nav.png'); text-indent: -9999px;  }

div#nav ul li#nav-home a					{ width: 101px; background-position: 0 0; }
div#nav ul li#nav-home a:hover				{ background-position: 0 -40px; }
div#nav ul li#nav-home a.current,
div#nav ul li#nav-home a.current:hover		{ background-position: 0 -80px; }

div#nav ul li#nav-work a					{ width: 104px; background-position: -101px 0; }
div#nav ul li#nav-work a:hover				{ background-position: -101px -40px; }
div#nav ul li#nav-work a.current,
div#nav ul li#nav-work a.current:hover		{ background-position: -101px -80px; }

div#nav ul li#nav-about a					{ width: 110px; background-position: -205px 0; }
div#nav ul li#nav-about a:hover				{ background-position: -205px -40px; }
div#nav ul li#nav-about a.current,
div#nav ul li#nav-about a.current:hover		{ background-position: -205px -80px; }

div#nav ul li#nav-contact a					{ width: 107px; background-position: -315px 0; }
div#nav ul li#nav-contact a:hover			{ background-position: -315px -40px; }
div#nav ul li#nav-contact a.current,
div#nav ul li#nav-contact a.current:hover	{ background-position: -315px -80px; }

div#navCats									{ width: 770px; float: left; margin-top: 10px; border-bottom: solid 1px #555; }
div#navCats ul								{ float: left; }
div#navCats ul li							{ float: left; margin-bottom: -1px; }
div#navCats ul li a							{ display: block; height: 40px; background-image: url('/template/cats.png'); text-indent: -9999px; }
div#navCats ul li a.current					{ border-bottom: solid 1px #8cc63f; }

div#navCats ul li#nav-all a					{ width: 52px; background-position: 0 0; }
div#navCats ul li#nav-all a:hover			{ background-color: transparent; background-position: 0 -40px; }
div#navCats ul li#nav-all a.current,
div#navCats ul li#nav-all a.current:hover	{ background-position: 0 -80px; }

div#navCats ul li#nav-print a				{ width: 70px; background-position: -52px 0; }
div#navCats ul li#nav-print a:hover			{ background-position: -52px -40px; }
div#navCats ul li#nav-print a.current,
div#navCats ul li#nav-print a.current:hover	{ background-position: -52px -80px; }

div#navCats ul li#nav-web a					{ width: 59px; background-position: -122px 0; }
div#navCats ul li#nav-web a:hover			{ background-position: -122px -40px; }
div#navCats ul li#nav-web a.current,
div#navCats ul li#nav-web a.current:hover	{ background-position: -122px -80px; }

div#navCats ul li#nav-brand a				{ width: 79px; background-position: -181px 0; }
div#navCats ul li#nav-brand a:hover			{ background-position: -181px -40px; }
div#navCats ul li#nav-brand a.current,
div#navCats ul li#nav-brand a.current:hover	{ background-position: -181px -80px; }





/* Miscellany
--------------------------------------------*/
div.clear 									{ clear: both; }
.hidden										{ display: none; }
