/*-----------------------------------------
  Stylesheet for Pixel Theory Site v.1.0
      URL: http://pixeltheoryinc.com
  Version: 0.1
   Author: Dean Stevens
     Date: 2008-03-11
  -----------------------------------------*/

/* START Yahoo UI CSS Reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0; padding:0;}
table {border-collapse:collapse; border-spacing:0;}
fieldset,img {border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym { border:0;}
/* END Yahoo UI CSS Reset */

/* Clear browser defaults and set up body standards */
* {
	margin: 0;
	padding: 0;
	border: 0;
}

html {
	-webkit-text-size-adjust:none;
}

body {
	font-size: 62.5%; /* 1em = 10 px */
	font-family: Georgia, Times, Times New Roman, serif;
	color: #555;
	line-height: 20px;
}

/************* Layout Divs *************/

#main {
	width: 960px;
}

#left_layout {
	position: absolute;
	width: 300px;
	top: 0;
	left: 0;
}

#deco_panel {
	width: 100%;
	height: 300px;
	background-color: #FFFFFF;
	background-image: url(images/deco-molecule.jpg);
	background-repeat: no-repeat;
	background-position: top l;
}

#deco_panel span {
	display: none;
}

#nav_panel {
	margin-left: 90px;
	line-height: 1px;
	background-color: #FFFFFF;
	background-image: url(images/nav-background.png);
	background-repeat: repeat-y;
}

#nav_panel span{
	display: none;
}


#sub_nav {
	margin: 0 30px 30px 120px;
	line-height: 1px;
}

/* May delete this if no text present */
#sub_nav p {
	line-height: 15px;
	font-size: 10px;
	color: #999999;
	margin-left: 10px;
	margin-top: 20px;
	letter-spacing: .1em;
}

#content {
	margin-left: 270px;
	width: 660px;
}

#gutter {
	position: absolute;
	width: 60px;
	top: 0;
	left: 300px;
	line-height: 1px;
}

#header {
	width: 540px;
	height: 128px;
	padding: 45px 0 3px 120px;
}

#footer {
	margin: 53px 0px 0px 120px;
	width: 450px;

	padding: 7px 0px 50px 0px;
	background-image: url(images/rule-horiz-black.gif);
	background-repeat: no-repeat;
}

#footer.ft_after_block {
	margin-top: 59px;
}

#footer.ft_after_img_frame {
	margin-top: 49px;
}

/************* END Layout Divs *************/


/************* Titling *************/
DIV.project_title {
	margin: 83px 0px 30px 120px;
	padding-bottom: 3px;
	border-bottom: solid 1px #000;
}

DIV.about_entry {
	margin: 17px 0px 0px 120px;
}

DIV.about_entry.after_quote {
	margin-top: 28px;
}

DIV.folio_head {
	margin: 17px 0px 3px 120px;
}

DIV.folio_head.after_projects {
	margin-top: 13px;
}

h3, h4 {
	font-family: "Gill Sans", "Gill Sans MT", "Trebuchet MS", "Lucida Sans", Georgia, serif;
	display: inline;
}

h3 {
	color: #DE3012;
	font-size: 21px;
	line-height: 30px;
}

h4 {
	color: #BBB;
	font-size: 13px;
	font-style: italic;
	margin-left: 15px;
	line-height: 30px;
}

/************* END Titling *************/


/************* Standard Tags *************/

p {
	font-size: 13px;
	margin-bottom: 10px;
}

h1 {
	display: block;
	text-transform: uppercase;
	margin: 20px 0 20px 119px;
	font-size: 16px;
	font-weight: normal;
	letter-spacing: 0.1em;
	border-style: solid;
}

DIV#content h3:first-child {
	margin-top: 90px;
}

ul {
	margin: 10px 0 10px 120px;
	list-style-type: square;
	list-style-position: outside;
	padding-left: 30px;
}

em {
	font-style: italic;
}

strong {
	font-weight: bold;
}

blockquote {
	margin: -2px 30px 10px 140px;
	width: 360px;
	font-size: 13px;
	text-align: left;
	text-indent: -0.4em;
	display: block;
	background-color: #EEE;
	padding: 11px 15px 8px 15px;
	border-color: #CCC;
	border-style: dashed;
	border-width: 1px 0px 1px 0px;
}

/************* END Standard Tags *************/


/************* Nav DIVS *************/
.nav_home, .nav_portfolio, .nav_services, .nav_services_shadow, .nav_clients, .nav_about, .nav_contact, .nav_index, .nav_writing, .nav_design, .nav_usability {
	display: block;
	width: 150px;
	height: 30px;
	margin-left: 30px;
	background-repeat: no-repeat;
	background-position: 0 0;
}

.nav_gray {
	background-position: 0 -60px;
}

.nav_home {background-image: url(images/nav-home.png);}
.nav_portfolio {background-image: url(images/nav-portfolio.png);}
.nav_services, .nav_services_shadow {background-image: url(images/nav-services.png);}
.nav_clients {background-image: url(images/nav-clients.png);}
.nav_about {background-image: url(images/nav-about.png);}
.nav_contact {background-image: url(images/nav-contact.png);}
.nav_index {background-image: url(images/nav-index.png);}
.nav_writing {background-image: url(images/nav-writing.png);}
.nav_design {background-image: url(images/nav-design.png);}
.nav_usability {background-image: url(images/nav-usability.png);}

.nav_home:hover, .nav_portfolio:hover, .nav_services:hover, .nav_clients:hover, .nav_about:hover, .nav_contact:hover, .nav_index:hover, .nav_writing:hover, .nav_design:hover, .nav_usability:hover {
	background-position: 0 -30px;
}

.nav_services_shadow:hover {
	background-position: 0 -90px;
}

.nav_noindent {
	margin-left: 0;
	width: 180px;
	background-position: 30px 0;
}

.nav_noindent:hover {
	background-position: 30px -30px;
}
/************* END Nav DIVS *************/


/*********** Nav and gutter mods ***********/

/** Use for nav bar images **/


#nav_panel a, #nav_panel img{
	display: block;
}

DIV#gutter a {
	display: block;
	margin-right: 0px;
	margin-bottom: 10px;
	padding: 0;
	display: block;
/*	background-color: #EEE; */
}

DIV#gutter a:hover {
	background-color: #DE3012;
}

/*********** END Nav and gutter mods ***********/


/*********** Image Display ***********/

.largeframe {
	margin: -10px 0 16px 110px;
	height: 320px;
	background-image: url(images/image-frame.gif);
	background-repeat: no-repeat;
	line-height: 1px;
}

.largeframe img {
	width: 430px;
	height: 280px;
	padding: 20px 0 20px 20px;
	margin: 0;
	float: left;
}

.imagebar {
	display: block;
	margin: 10px 0 0 6px;
	width: 84px;
	float: right;
}

.imagebar img {
	width: 84px;
	height: 56px;
	margin-bottom: 5px;
	padding: 0;
}

.project_frame_main {
	margin: 14px 80px 0px 90px;
	padding: 10px 10px 0px 30px;
	background-image: url(images/project-frame.gif);
	background-repeat: no-repeat;
}

.project_frame_footer {
	margin: -10px 80px 0px 90px;
	background-image: url(images/project-frame.gif);
	background-repeat: no-repeat;
	background-position: 0px -600px;
}

.imagestrip {
	width: 450px;
	table-layout: fixed;
	border-spacing: 10px;
	border-collapse: separate;
	/* Next line is IE hack to accommodate border-spacing */
	/* http://vacskamati.blogspot.com/2007/03/eliminating-cellspacing-and-cellpadding.html */
	*border-collapse: expression('separate', cellSpacing = '10px');
}

.imagestrip td {
	vertical-align: top;
	height: 120px;
	line-height: 15px;
	background-color: #EEE;
}

.imagestrip td.td_no_project {
	background-color: inherit;
}

.imagestrip img {
	display: block;
	width: 100px;
	height: 65px;
}

.imagestrip p {
	font-size: 10px;
	font-family: Verdana;
	text-align: left;
	line-height: 15px;
	margin: 4px 1px 1px 3px;
	height: 48px;
}
.imagestrip a {
	float: left;
	width: 100px;
	color: #444;
	border-bottom: 2px solid #CCC;
}

.imagestrip a:hover {
	border-color: #DE3012;
	background-color: #FFF;
}

/*********** END Image Display ***********/


/*********** Table Formatting ***********/
.services_table {
	margin: 24px 0 26px 120px;
	table-layout: fixed;
	width: 450px; /* 3 x 148 + 4 x 2 */
	border-collapse: collapse;
}

.services_table th {
	background-color: #DE3012;
	padding: 5px 10px 5px 10px;
	font-family: "Gill Sans", "Gill Sans MT", "Trebuchet MS", "Lucida Sans", Georgia, serif;
	font-size: 14px;
	letter-spacing: 1px;
	text-align: left;
	color: #FFFFFF;
	border-style: solid;
	border-color: #FFF;
	border-width: 0px 1px 0px 1px;
}

.services_table td {
	font-size: 13px;
	padding:6px 8px 3px 10px;
	line-height: 20px;
	vertical-align: top;
	border-style: solid;
	border-color: #AAA;
	border-width: 0px 1px 1px 1px;
}

.services_table p {
	margin: 0;
	padding: 10px 0 10px 0
}

.table_client_list, .table_client_list p {
	table-layout: fixed;
	font-size: 13px;
	margin: 23px 0 0 120px;
}

.td_client_name {
	width: 300px;
	border-style: solid;
	border-width: 1px 0px 1px 0px;
	border-color: #AAA;
}

.td_client_desc{
	width: 150px;
	background-color: #EEE;
	border-style: solid;
	border-width: 1px 0px 1px 0px;
	border-color: #AAA;
}

.td_client_name p, .td_client_desc p {
	margin: 6px 10px 3px 10px;
}

.td_client_name a:link, .td_client_name a:visited,
.td_client_name a:active, .td_client_name a {
	color: #555;
	border: none;
	font-weight: normal;
	display: block;
	padding: 6px 10px 3px 10px;
}

.td_client_name a:hover {
	background-color: #FEE;
	border-right: 1px solid #FFF;
}

a.td_client_name_a_2line,
a.td_client_name_a_2line:link,
a.td_client_name_a_2line:visited,
a.td_client_name_a_2line:active,
a.td_client_name_a_2line:hover {
	padding: 16px 10px 13px 10px;
}

a.td_client_name_a_3line:link,
a.td_client_name_a_3line:visited,
a.td_client_name_a_3line:active,
a.td_client_name_a_3line:hover {
	padding: 26px 10px 23px 10px;
}

.project_download a, .project_download a:link, .project_download a:visited {
	border-width: 0px;
	font-weight: normal;
}

.project_download a:active, .project_download a:hover {
	font-weight: normal;
	border-bottom: solid 1px;
}


/*********** END Table Formatting ***********/



/*********** Text Formatting ***********/

.project_text {
	margin: 0px 0 0px 120px;
	width: 450px;
	padding: 0;
}

.text300wide {
	margin-right: 151px;
}

.text300wide p {
	line-height: 1.6;
	margin-right: 29px;
}

.text500wide {
	margin-right: 0px;
}

.text500wide p {
	line-height: 1.6;
	margin-right: 29px;
}

.lead_text, .content_text {
	margin: 0 0 10px 120px;
	width: 450px;
	padding: 0;
}

/* My Comment */

.caption {
	display: inline;
	float: right;
	width: 150px;
	height: 154px;
	background-image: url(images/rule-vert-black.gif);
	background-repeat: no-repeat;
	background-position: 0px 4px;
}

.caption p {
	line-height: 1.6;	
	height: 100px;
	margin: 0 0 0 30px;
	color: #808080;
}

.prev_next {
	margin: -30px 0px 0px 330px;
	font-size: 13px;
}

.prev_next a, .prev_next a:link, .prev_next a:visited,
DIV#footer a, DIV#footer a:link, DIV#footer a:visited {
	color: #DE3012;
}

.prev_next a:hover, DIV#footer a:hover {
	border-bottom: #DE3012 1px dotted;
	padding: 2px 0px 1px 0px;
}

.ft_left, .ft_right {
	font-size: 13px;
}

.ft_right {
	text-align: right;
	float: right;
}


/*********** END Text Formatting ***********/


/*********** List Formatting ***********/
li {
	font-size: 13px;
	list-style-type: square;
}
/*********** END List Formatting ***********/


/******* Hyperlink and anchor tag styles *******/
a {
	text-decoration: none;
}

p a:link, p a:visited {
	color: #DE3012;
	font-weight: bold;
	border-color: #DE3012;
	border-width: 0 0 1px 0;
	border-style: none none dotted none;
	padding: 2px 0px 1px 0px;
	background-color: inherit;
}

p a:hover {
	color: #457;
	border-style: none none solid none;
	border-color: #457;
}

p a em {
	padding-bottom: 2px; /* Hack for WebKit; otherwise the underscore padding is 0 */
}

/******* END Hyperlink and anchor tag styles *******/


/******* Layout Tools *******/

/*
body {
	background: #fff url('images/gridbg.gif');
}
*/


