@charset "UTF-8";
/* my global styles */
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #59120e;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}
body, p, ul, li, td { 
	font-size: 12px; 
	line-height: 18px;
}
p, ul, ol {
	margin: .5em 0em 1em 0em;
}
/* 
Link states must be defined in the correct order. Here is the order, starting with the one you must define first:
1. a:link
2. a:visited
3. a:hover
4. a:active
*/
a:link, a:visited, a:hover, a:active { 
	color: #990000;
	font-weight: bold;
	text-decoration: underline;
}
a:hover { 
	color: #FF0000;
}
h1, h2, h3, h4, h5, h6 { 
	font-family: "Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
	line-height: 1.3em;
	font-weight: bold;
	margin: 1.1em 0 .25em 0;
	padding: 0;
	color: #666666;
}
h1 { font-size: 28px; font-weight: normal; margin-top: 0.5em;}
h2 { font-size: 18px; }
h3 { font-size: 14px; }
h4 { font-size: 12px; }
h5 { font-size: 10px; }
h6 { font-size: 8px; }

ul, ol {
	margin-left: 1.5em;
	padding-left: 1.5em;
	list-style-position: outside;
}
li {
	margin: 0em 0em .25em 0em;
	padding: 0;
}

ul.moreIndent, ul.landingPageBulletLinks {
	text-indent: 15px;
	list-style-position: inside; 
}
ul.moreIndent li, ul.landingPageBulletLinks li {
}

ul.landingPageBulletLinks a:link, ul.landingPageBulletLinks a:hover, ul.landingPageBulletLinks a:visited, ul.landingPageBulletLinks a:active {
	font-weight: normal;
}

/* DW template styles */
.twoColLiqLtHdr #container { 
	width: 100%; 
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	border: 0px solid #000000;
	text-align: left; /* this overrides the text-align: center on the body element. */
	background: #ffffff url(images/template/page_bkgrd_left_edge.gif) left repeat-y;
} 
.twoColLiqLtHdr #header {
	background: #a2150f url(images/template/top_bar_graphics.gif) top left no-repeat;
	padding: 0 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	color: #ffffff;
	width: 100%;
} 
.twoColLiqLtHdr #header h5 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 75px 50px 0px 0px; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
	float: right;
	font-weight: normal;
	font-size: 14px;
	line-height: 18px;
	text-align: right;
	letter-spacing: 0px;
	font-family: Tahoma, Arial, Helvetica, Verdana, sans-serif;
	color: #ffffff;
}
img#logoHeader {
	margin: 0;
	padding: 0; 
	float: left;
}
/* Tips for sidebar1:
1. since we are working in percentages, it's best not to use padding on the sidebar. It will be added to the width for standards compliant browsers creating an unknown actual width. 
2. Space between the side of the div and the elements within it can be created by placing a left and right margin on those elements as seen in the ".twoColLiqLtHdr #sidebar1 p" rule.
3. Since Explorer calculates widths after the parent element is rendered, you may occasionally run into unexplained bugs with percentage-based columns. If you need more predictable results, you may choose to change to pixel sized columns.
*/
.twoColLiqLtHdr #sidebar1 {
	float: left;
	width: 250px; /* since this element is floated, a width must be given */
	background: #7b0000 url(images/template/side_bar_bkgrd.gif) top right repeat-y; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 15px 0; /* top and bottom padding create visual space within this div  */
	color: #ffffff;
}
.twoColLiqLtHdr #sidebar1 h3, .twoColLiqLtHdr #sidebar1 p {
	margin-left: 10px; /* the left and right margin should be given to every element that will be placed in the side columns */
	margin-right: 10px;
}
/* Tips for mainContent:
1. the space between the mainContent and sidebar1 is created with the left margin on the mainContent div.  No matter how much content the sidebar1 div contains, the column space will remain. You can remove this left margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends.
2. to avoid float drop at a supported minimum 800 x 600 resolution, elements within the mainContent div should be 430px or smaller (this includes images).
3. in the Internet Explorer Conditional Comment below, the zoom property is used to give the mainContent "hasLayout." This avoids several IE-specific bugs.
*/
.twoColLiqLtHdr #mainContent {
	margin: 0 0 0 250px; /* the left margin needs to be equal to the left sidebar width */
	padding: 0px 10px 0px 12px;
/*	padding: 0 20px 0 0; */
	background: #ffffff url(images/template/content_gradient_bkgrd.gif) top repeat-x;
	border-top: 1px solid #CC0000; /* adding a border here fixes margin collapse, a CSS quirk that causes an undesired gap between the top of this DIV and the bottom of the navigation DIV */
} 
.twoColLiqLtHdr #footer { 
	padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background: #751812 url(images/template/footer_bkgrd.gif) top repeat-x;
	text-align: center;
} 
.twoColLiqLtHdr #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-size: 10px;
	text-align: center;
	color: #cccccc;
	line-height: 1.3em;
}
.twoColLiqLtHdr #footer a:link, .twoColLiqLtHdr #footer a:visited, .twoColLiqLtHdr #footer a:hover, .twoColLiqLtHdr #footer a:active {
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
}
.twoColLiqLtHdr #footer a:hover {
	text-decoration: underline;
}
/* Miscellaneous classes for reuse */
.floatRight { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.floatLeft { /* this class can be used to float an element left in your page */
	float: left;
	margin: 0px 8px 8px 0px;
}
.clearFloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
/* left sidebar navigation with icons */
ul#leftNav {
font-family: Arial, Helvetica, sans-serif;
	list-style-type: none;
	margin: 0;
	padding: 0;
	float: right;
	width: 235px;
}
ul#leftNav li a:link, ul#leftNav li a:visited, ul#leftNav li a:hover, ul#leftNav li a:active {
	position: relative;
	display: block;
	margin: 0;
	padding: 0;
	height: 56px;
	width: 235px;
	text-decoration: none;
	line-height: 15px;
	font-weight: bold;
	font-size: 14px;
	color: #FFFFFF;
	border: 0px solid #666666;
}
ul#leftNav li a:hover {
	color: #ffdf05;
}
ul#leftNav li a img {
	margin: 0;
}
ul#leftNav li a .iconName {
	position: absolute;
	left: 64px;
	top: 18px;
}
/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
/* #topNavContainer li {border-bottom: 1px solid #EEE;} */
/* fix for browsers that don't need the hack */
/* html>body #topNavContainer li {border-bottom: none;} */
/* top nav level one (main) */
div#topNavContainer {
	background: #000000 url(images/template/nav_bar_bkgrd.gif) top repeat-x;
	margin: 0;
	padding: 0;
	width: 100%;
	white-space: nowrap;
}
ul#topNav, ul#topNav li {
	margin: 0;
	padding: 0;
	list-style-type: none;
	float: left;
}
ul#topNav a:link, ul#topNav a:visited, ul#topNav a:hover, ul#topNav a:active {
	font-family: Tahoma, Arial, Helvetica, Verdana, sans-serif;
	font-weight: bold;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	text-decoration: none;
	margin: 0px;
	padding: 6px 12px;
	display: inline-block;
	font-style: normal;
	border-top: 1px solid #848484;
	border-right: 1px solid #313131;
	border-bottom: 1px solid #131313;
	border-left: 1px solid #7c7c7c;
	background: #000000 url(images/template/nav_bkgrd_normal.gif) top repeat-x;
	color: #ffcc00;
	float: left;
}
ul#topNav a.selected:link, ul#topNav a.selected:visited, ul#topNav a.selected:hover, ul#topNav a.selected:active {
	background: #e99b2a url(images/template/nav_bkgrd_selected.gif) top repeat-x;
	border-bottom: 1px solid #e99b2a;
	color: #7b0000;
}
ul#topNav a.selected:hover {
	color: #ff0000;
}
ul#topNav a:hover {
	background: #2d2d2d url(images/template/nav_bkgrd_hover.gif) top repeat-x;
	color: #FFFFFF;
}
/* top nav level two (sub nav) */
div.topSubNavContainer {
	background: #e99b2a;
	margin: 0;
	padding: 0;
	width: 100%;
/*	white-space: nowrap; */
}
div.topSubNavContainer ul.topSubNav {
	margin-left: 5px;
}
ul.topSubNav, ul.topSubNav li {
	margin: 0;
	padding: 0;
	list-style-type: none;
	float: left;
}
ul.topSubNav a:link, ul.topSubNav a:visited, ul.topSubNav a:hover, ul.topSubNav a:active {
	font-family: Tahoma, Arial, Helvetica, Verdana, sans-serif;
	font-weight: bold;
	font-size: 12px;
	line-height: 16px;
	text-decoration: none;
	border: 1px solid #e99b2a;
	margin: 0px;
	padding: 9px 5px;
	display: inline-block;
	color: #7b0000;
	float: left;
}
ul.topSubNav a:hover {
	background: #f4b931;
	color: #ff0000;
	text-decoration: none;
}
div.thumbsContainer img {
	margin: 4px;
	padding: 0;
	border: 1px solid #ff0000;
	float: left;
}
div.portfolioThumbsContainer {
	width: 210px;
	margin: 18px 10px 0px 0px;
	padding: 4px;
	border: 1px solid #cccccc;
	float: right;
}
div.portfolioThumbsContainer img {
	margin: 1px;
}
div.portfolioThumbsContainer p {
	text-align: center;
	font-size: 10px;
	margin: 0;
	color: #888888;
}
div.portfolioThumbsContainer a:link, div.portfolioThumbsContainer a:visited, div.portfolioThumbsContainer a:active, div.portfolioThumbsContainer a:hover {
	margin: 0;
	border: none;
}
/* other misc styles */
div.rightContentSideBar, div.leftContentSideBar, div.calloutBoxMiddle, div.caseStudySideBar {
	width: 25%;
	border: 1px solid #dddddd;
	background: #f7f7f7;
	margin: 10px 0 0 0;
	padding: 0 5px 0 8px;
}
div.calloutBoxMiddle {
	width: 50%;
}
div.rightContentSideBar {
	float: right;
}
div.sideBarAdditional {
	background: #ffffff;
}
div.leftContentSideBar {
	float: left;
}
div.caseStudySideBar {
	float: right;
	width: 330px; 
	padding-top: 8px; 
	margin-right: 0;
	margin-left: 10px; 
	margin-top: 0;
}
div.leftContentSideBar ul {
	list-style-type: none;
	margin: 0px 0px;
	padding: 0px 0px;
}
div.leftContentSideBar ul li {
	font-size: 12px;
	line-height: 14px;
	margin-bottom: 6px;
}
div.leftContentSideBar h3, div.leftContentSideBar h2, div.rightContentSideBar h3, div.rightContentSideBar h2 {
	margin: 6px 0 0 0;
}
div.leftContentSideBar ul li a:link, div.leftContentSideBar ul li a:visited, div.leftContentSideBar ul li a:hover, div.leftContentSideBar ul li a:active {
	font-weight: normal;
	text-decoration: none;
}
div.leftContentSideBar ul li a:hover {
	text-decoration: underline;
}
div.calloutBoxMiddle {
	padding: 0 10px;
}
div.calloutBoxMiddle h2 {
	margin: .5em 0 0 0;
}


/* #quickRef menu */
/* level 1 */
ul#quickRef {
	
}
ul#quickRef li a:link, ul#quickRef li a:visited, ul#quickRef li a:hover, ul#quickRef li a:active {
	font-weight: bold;
}
/* level 2 */
ul#quickRef ul li {
	margin: .5em 0 .5em 12px;
}
ul#quickRef ul li a:link, ul#quickRef ul li a:visited, ul#quickRef ul li a:hover, ul#quickRef ul li a:active {
	font-weight: normal;
}


/* all page content should be structured like this:  #mainContent > .mainColumnXXXX (where XXXX is either Left or FullWidth) */
div.mainColumnLeft, div.caseStudyContainer {
	width: 60%;
	float: left;
	margin-left: 10px; /* white space between left navigation column and actual page content within the white space region */
	padding: 0 5px 0 0;
}
div.caseStudyContainer {
	width: 90%;
	border-bottom: 1px solid #dddddd;
	padding: 5px 0 5px 0;
}


table#contactFormTable, table#fileUploadTable {
}
table#fileUploadTable {
	border: 1px solid #cccccc;
}
table#contactFormTable td.label, table#fileUploadTable td.label {
	color: #555555;
	font-size: 10px;
	line-height: 12px;
	text-align: right;
	padding: 3px 4px 3px 10px;
}
table#contactFormTable td.formField {
	width: 470px;
}
table#fileUploadTable td.formField {
	width: auto;
}
table#fileUploadTable td.formField {
	padding: 3px 6px;
}
table#fileUploadTable td.formField input#File {
	width: auto; border: 1px solid #dddddd;
	padding: 3px;
}
table#contactFormTable td.formField input, table#fileUploadTable td.formField input {
	width: 300px;
}
table#fileUploadTable td.formField textarea {
	width: 300px;
}
table#contactFormTable td.formField textarea {
	width: 350px;
}
table#contactFormTable td.formField input#Zip, table#contactFormTable td.formField input#Phone, table#fileUploadTable td.formField input#Zip, table#fileUploadTable td.formField input#Phone {
	width: 150px;
}
table#contactFormTable td.sectionDivider {
	font-size: 12px;
	font-weight: bold;
	padding: 10px 0 4px 0;
}
table#contactFormTable td.submit, table#fileUploadTable td.submit {
	padding: 15px 0;
}
span.textareaRequiredMsg, span.selectRequiredMsg, span.textfieldRequiredMsg, span.textfieldInvalidFormatMsg {
	font-size: 9px;
	padding: 1px;
}
span.reqd {
	display: inline-block;
	color: #cc0000;
	margin-left: 5px;
}
table.formSubCol {
	margin-bottom: 20px;
	width: 240px;
}
table.formSubCol td.subHead {
	font-weight: bold;
	text-align: left;
}
table.formSubCol td.leftCheckBox {
	width: 20px;
	text-align: center;
}
table.formSubCol td.rightText {
	text-align: left;
}
div.photoContainer {
	float: left;
	margin: 10px 10px 10px 0px;
}
p.smallType, .printerFriendly, p.clickToEnlarge {
	font-size: 10px;
	line-height: 13px;
}
p.printerFriendly img {
	margin: 0 0;
	padding: 0 0;
}
p.printerFriendly {
/*	border: 1px solid #cccccc;
	width: 260px;
	margin: 0 auto; */
}
p.clickToEnlarge {
	clear: both;
}
ul.compactList {
	margin: 0 1em 1em 1em;
}
ul.compactList li {
	margin: 0;
	line-height: 1.5em;
}
.imgThumb {
	float: left;
	margin: 0px 8px 8px 0px;
	border: 1px solid #cccccc;
}
/*
a:link img.imgThumb, a:visited img.imgThumb, a:hover img.imgThumb, a:active img.imgThumb {
	border: 1px solid #cccccc;
}
*/
a:hover img.imgThumb {
	border: 1px solid #ff0000;
}
.thumbsContainerWide {
	padding: 0;
	margin: 0;
	width: 290px;
	float: left;
}
.thumbsContainerWide img {
	float: left;
	margin: 1px 1px;
	border: 1px solid #cccccc;
}
.headingSerifItals, .headingSerifItalsTop, .headingSerifItalsBottom {
	font-family: "Times New Roman", Times, serif;
	font-style: italic;
	font-size: 48px;
	line-height: .95em;
	color: #993300;
	letter-spacing: -1px;
	border-bottom: 1px solid #cccccc;
}
.headingSerifItalsTop {
	font-size: 24px; 
	line-height: 23px; 
	margin: 20px 0 0 0; 
	border-bottom: none;
}
.headingSerifItalsBottom {
	margin-top: 0; 
	font-size: 36px; 
	line-height: 36px;
}
.caseStudyClientName {
	font-family: "Times New Roman", Times, serif;
	font-style: italic;
	font-size: 24px;
	line-height: .95em;
	color: #993300;
	letter-spacing: -1px;
	margin: 0 0 5px 0;
}
/* portfolio landing page */
div.portfolioThumb {
	width: 150px;
	text-align: center;
	border: 1px solid #eeeeee;
	float: left;
	margin: 3px 3px;
	padding: 10px 0px;
	font-size: 10px;
}
div.portfolioThumb img {
	margin: 0 0;
}
div.portfolioThumb a:link, div.portfolioThumb a:visited, div.portfolioThumb a:hover, div.portfolioThumb a:active {
	font-weight: normal;
}
div.missionStatementBox {
	width: 65%;
	margin: 4px 8px;
	padding: 4px 16px;
	border: double;
	border-color: #cccccc;
}
div.missionStatementBox p {
	font-size: 150%;
	line-height: 2em;
	font-family:"Hoefler Text",Constantia,Cambria,Georgia,serif;
	text-align: justify;
}
div.missionStatementBox h1 {
	font-family:"Hoefler Text",Constantia,Cambria,Georgia,serif;
	color: #993300;
}
.decor {
	color: #cccccc;
	margin: 0 6px;
}
/* file upload form */
div#uploadStep1, div#uploadStep2 {
	/* border: 1px solid #0000cc; */
	margin: 0;
	padding: 0;
}
div#uploadStep2 p.importantNote {
	font-weight: bold;
}
table#xferTable {
	width: 300px;
	border: 1px solid #999999;
	margin-top: 0;
}
table#xferTable td {
	border-top: 1px solid #dddddd;
}
p.validateError {
	color: #cc0000;
	font-weight: bold;
	margin-bottom: 0;
}
.style1 {
	font-size: 50%;
	line-height: 1em;
}
.style2 {
	font-size: 75%;
	line-height: 1em;
}
.confirmUploadSuccess {
	color: #006600;
	font-weight: bold;
	margin-bottom: 48px;
}

/* contact form(s) */
#rwForm {
	margin: 0;
	padding: 10px 15px;
	text-align: left;
	line-height: 1.1em;
	width: 500px;
}
#rwForm h1, #rwForm h2, #rwForm h3, #rwForm h4, #rwForm h5 {
	font-size: 1.1em;
	line-height: 1.1em;
	margin: 2px 0;
	color: #000000;
}
#rwForm .reqd {
	color: #aa0000;
	font-weight: bold;
}
#rwForm .successMsg {
	color: #006600;
}
#rwForm .formSubHead {
	margin: .2em 0;
	color: #000000;
}


.multiColWrap, .multiColWrap .col1, .multiColWrap .col2 {
	margin: 0 0 1em 0;
	padding: 0;
	width: 230px;
	/*border: 1px dashed #F0F;*/
}
.multiColWrap {
	margin: 0;
	padding: 0;
}
.multiColWrap .col1 {
	float: left;
}
.multiColWrap .col2 {
	float: right;
}







/* ftp login screens */

body.ftpLoginWindow {
	font: 90% "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	background: #eeeeee;
	margin: 0;
	padding: 5px 10px;
	color: #000000;
	text-align: left;
}
body.ftpLoginWindow a:link, body.ftpLoginWindow a:visited, body.ftpLoginWindow a:hover, body.ftpLoginWindow a:active {
	color: #990000;
	text-decoration: underline;
}
body.ftpLoginWindow a:hover {
	text-decoration: none;
}
body.ftpLoginWindow p.larger {
	font-size: 125%;
	line-height: 1.5em;
}