@charset "UTF-8";

/* Author: Mark Bult */
/* Site: http://www.enews.org/ */
/* Date: Winter 2008 */



body  {
	background: #6c2407 url(../_im/bknd.gif) repeat;
	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;
}
acronym, abbr {
	border-bottom: #666 1px dashed;
	cursor: help;
}
acronym:hover, abbr:hover {
	color: #bc4a04;
	border-bottom-color: #bc4a04;
}



/* SITE HEADER aka hdr4.css */

#site-hdr {
	width: auto;  /* this will create a container 100% of the browser width */
	height: 142px;
	background: #252525 url(../_im/hdr-bknd.jpg) repeat-x;
	margin: 0px auto; /* 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: 10px 0px 0 0px;   /* Add 20 or 30 left and right padding here if there's a site-wide margin. */
	text-align: center; /* this centers the container in IE 5* browsers. */
}
#site-hdr h1 {    /* Image-replacement header technique. */
	margin: 0 auto 0 auto;
	padding: 0;
	text-indent: -5000px;
	width: 304px;
	height: 65px;
	display: block;
	background: url(../_im/hdr-MBD-logo.gif) no-repeat;
	font-size: 0;
	vertical-align: bottom;
}
#tagline {
	margin: 10px auto 0 auto;
	padding: 0;
	text-indent: -5000px;
	display: block;
	font-size: 0;
	margin-bottom: 25px;
}
.tagline1 {
	width: 439px;
	height: 13px;
	background: url(../_im/hdr-tagline1.gif) no-repeat;
}



/* GRAY NAV BAR */

#site-nav {
	width: 962px;
	height: 29px;
	background-color: #3f3f3f;
	margin: 0 auto 0 auto;
	padding: 0 9px 0 9px;
}
#menu-left { 
    width: 600px;
	margin: 0;
	padding: 0;
	float: left;
}
#menu-left li {
	float: left; /*float the individual items*/
	list-style: none;	
	margin: 0;
	padding: 0;
} 
#menu-left li {
	list-style: none;	
	margin: 0;
	padding: 0;
} 
#menu-left li a { 
    display: block; /*to make it act as a block*/ 
    text-indent: -5000px; /*to make the text go off-screen*/ 
    height: 29px;
} 
#menu-left #menu1 { 
    background: url(../_im/navTab-Home.gif) no-repeat 0 0;
    width: 63px;  
    height: 29px;
} 
#menu-left #menu1 a:hover { 
    background: url(../_im/navTab-Home.gif) no-repeat -63px 0;
} 
#menu-left #menu1 .menu1on { 
    background: url(../_im/navTab-Home.gif) no-repeat -126px 0;
} 
#menu-left #menu2 {  
	background: url(../_im/navTab-Journal.gif) no-repeat 0 0;
    width: 75px;  
    height: 29px;
} 
#menu-left #menu2 a:hover { 
    background: url(../_im/navTab-Journal.gif) no-repeat -75px 0;
} 
#menu-left #menu2 .menu2on { 
    background: url(../_im/navTab-Journal.gif) no-repeat -150px 0;
} 
#menu-left #menu3 { 
    background: url(../_im/navTab-Portfolio.gif) no-repeat 0 0;
    width: 83px;  
    height: 29px;
} 
#menu-left #menu3 a:hover { 
    background: url(../_im/navTab-Portfolio.gif) no-repeat -83px 0;
} 
#menu-left #menu3 .menu3on { 
    background: url(../_im/navTab-Portfolio.gif) no-repeat -166px 0;
} 
#menu-left #menu4 {  
	background: url(../_im/navTab-Photos.gif) no-repeat 0 0;
    width: 71px;  
    height: 29px; 
} 
#menu-left #menu4 a:hover { 
    background: url(../_im/navTab-Photos.gif) no-repeat -71px 0;
} 
#menu-left #menu4 .menu4on { 
    background: url(../_im/navTab-Photos.gif) no-repeat -142px 0;
} 
#menu-left #menu5 { 
    background: url(../_im/navTab-Clients.gif) no-repeat 0 0;
    width: 70px;  
    height: 29px; 
} 
#menu-left #menu5 a:hover { 
    background: url(../_im/navTab-Clients.gif) no-repeat -70px 0;
} 
#menu-left #menu5 .menu5on { 
    background: url(../_im/navTab-Clients.gif) no-repeat -140px 0;
} 
#menu-left #menu6 {  
	background: url(../_im/navTab-About.gif) no-repeat 0 0;
    width: 66px;  
    height: 29px;
} 
#menu-left #menu6 a:hover { 
    background: url(../_im/navTab-About.gif) no-repeat -66px 0;
} 
#menu-left #menu6 .menu6on { 
    background: url(../_im/navTab-About.gif) no-repeat -132px 0;
} 
#menu-left #menu7 {  
	background: url(../_im/navTab-Contact2.gif) no-repeat 0 0;
    width: 80px;  
    height: 29px;
} 
#menu-left #menu7 a:hover { 
    background: url(../_im/navTab-Contact2.gif) no-repeat -80px 0;
} 
#menu-left #menu7 .menu7on { 
    background: url(../_im/navTab-Contact2.gif) no-repeat -160px 0;
} 


/* SEARCH AND CONTACT MENU */
/* Tabs */
.menu-right-container { 
	float: right;
    width: 190px;
	margin: 0;
	padding: 0;
}
/**+html ul#drw_tabs li.last {
	position: absolute;
	float: right;
	margin: 0;
	padding: 0;
}
* html ul#drw_tabs li.last {
	position: absolute;
	float: right;
	margin: 0;
	padding: 0;
}*/
ul#drw_tabs li {
	float: right; /*float the individual items*/
	list-style: none;
	margin: 0;
	padding: 0;
}
ul#drw_tabs li.first a {
    text-indent: -9000px; /*to make the text go off-screen*/ 
	background: url(../_im/navTab-Search.gif) no-repeat 0 0;
    width: 82px;  
    height: 29px;
	display: block; /*to make it act as a block*/ 
	float: right;
	list-style: none;
	margin: 0;
	padding: 0;
}
ul#drw_tabs li.first a:hover {
	background: url(../_im/navTab-Search.gif) no-repeat -82px 0;
}
ul#drw_tabs li.last a {
    text-indent: -9000px; /*to make the text go off-screen*/ 
	background: url(../_im/navTab-Contact.gif) no-repeat 0 0;
    width: 91px;  
    height: 29px;
	display: block; /*to make it act as a block*/ 
	float: right;
	list-style: none;
	margin: 0;
	padding: 0;
}
ul#drw_tabs li.last a:hover {
    background: url(../_im/navTab-Contact.gif) no-repeat -91px 0;
}
/*ul#drw_tabs a#drw_tabs_focus {
	background-position: center -35px;
}*/
ul#drw_tabs li.first a#drw_tabs_focus {
	background: url(../_im/navTab-Search.gif) no-repeat -164px 0;
}
ul#drw_tabs li.first a#drw_tabs_focus:hover {
	background: url(../_im/navTab-Search.gif) no-repeat -246px 0;
}
ul#drw_tabs li.last a#drw_tabs_focus {
    background: url(../_im/navTab-Contact.gif) no-repeat -182px 0;
}
ul#drw_tabs li.last a#drw_tabs_focus:hover {
    background: url(../_im/navTab-Contact.gif) no-repeat -273px 0;
} 



/* DRAWERS */

div#drw {
	background: #adafa0;
	width: 980px;
	min-width: 980px;
	margin: 0 auto;
	padding: 0;
	overflow: hidden;
	text-align: left;
}
div#drw #search {
	background: #d9d3be;
	padding: 20px;
}
div#drw #contact {
	background: #adafa0;
	padding: 20px;
}
div#drw #contact #form-box {
	background: #c4c7b5;
	width: 670px;
/*	height: 260px;*/
	padding: 18px 20px 12px 20px;
	font-family: "Lucida Grande", "Lucida Sans","Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 69%;
	font-weight: bold;
	color: #484941;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	float: left;
}
div#drw #contact #contact-form-left {
	margin: 9px 20px 0 0;
	float: left;
}
div#drw #contact #contact-form-left .field {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color: #5f5f5f;
	width: 200px;
	margin: 3px 0 12.5px 0;
	padding: 3px 4px 5px 4px;
	background: #fff url(../_im/form-field-bknd.gif) repeat-x;
	border: 1px solid #949488;
}
div#drw #contact #contact-form-left .field:hover {
	border: 2px solid #585a49;
	padding: 2px 3px 4px 3px;
}
div#drw #contact #contact-form-right {
	margin: 9px 0 0 0;
	float: left;
}
div#drw #contact #contact-form-right .field {
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 140%;
	font-size: 12px;
	color: #5f5f5f;
	width: 430px;
	height: 174px;
	margin: 3px 0 12.5px 0;
	padding: 3px 4px 5px 4px;
	background: #FFF url(../_im/form-field-bknd.gif) repeat-x;
	border: 1px solid #949488;
}
div#drw #contact .error {
	display: block;
	color: #c12e11;
}
div#drw #contact #contact-form-right .field:hover {
	border: 2px solid #585a49;
	padding: 2px 3px 4px 3px;
}
div#drw #contact #contact-form-right #send {
	background: url(../_im/ContactFormBtn.gif) no-repeat 0px;
	height: 25px;
	width: 55px;
	margin: 0px;
	padding: 0px;
}
div#drw #contact #contact-form-right #send a:hover {
	background: url(../_im/ContactFormBtn.gif) no-repeat -55px;
}



/* CONTACT social stuff */
div#drw #contact #social-stuff {
	float: right;
	width: 210px;
	margin: 5px 0 0px 0px;
	padding: 0;
}
div#drw #contact #social-stuff dl {
	float: right;
	width: 210px; /* Fixes IE/Mac bug. */
	margin: 8px 0 9px 0;
	padding: 0;
	display: inline; /* Fixes IE/Win double-margin bug. */
}
div#drw #contact #social-stuff dt {
	float: right;
	width: 174px;
	margin: 0;
	padding: 0 0 1px 0;
	font-family: "Lucida Grande", "Lucida Sans","Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 93%;
	font-weight: bold;
	line-height: 130%;
	color: #484941;
}
div#drw #contact #social-stuff dt a {
	text-decoration: none;
	color: #484941;
}
div#drw #contact #social-stuff dt a:hover {
	text-decoration: none;
	color: #c12e11;
}
div#drw #contact #social-stuff dd {
	margin: 8px 0 9px 36px;
	padding: 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 93%;
	font-style: italic;
	line-height: 130%;
	color: #696a5e;
}
div#drw #contact #social-stuff dl dd.img {
	margin: 0;
}
div#drw #contact #social-stuff dd.img img {
	float: left;
	margin: 2px 10px 0 0;
	padding: 0px;
	border: 3px solid #d5d7ca;
}
div#drw #contact #social-stuff dd.img img:hover {
	border: 3px solid #585a49;
	text-decoration: none;
}

* html #social-stuff dl { height: 1%; }   /* IE5 & 6 fix via Bulletproof Web Design. */
*:first-child+html #social-stuff dl { min-height: 1px; }   /* IE7 fix via Bulletproof Web Design. */
#social-stuff dl:after {   /* For browsers that support :after */
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}





/* CONTENT CONTAINERS */

#wrapper {
	width: 980px;   /* Add 20 or 30 to the width if there's a site-wide margin. */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}
#container, #container-clients, #container-about { 
	width: 980px;
	background: white;
	margin: 0 auto;      /* Add 20 or 30 left and right margin here if there's a site-wide margin. */
}






/* LEFT-HAND SIDEBAR & SUBNAV */

#sidebar-subnav {
	float: left; /* since this element is floated, a width must be given */
	width: 217px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	padding: 19px 16px 20px 16px;
}
#sidebar-subnav h3 {    /* Image-replacement header technique. */
	margin: 0 0 17px 4px;
	padding: 0;
	text-indent: -5000px;
	width: 109px;
	height: 13px;
	display: block;
	background:url(../portfolio/_im/hdr-subnav-Portfolio.gif);
	font-size: 0;
	vertical-align: bottom;
}
#container-clients #sidebar-subnav h3 {    /* Image-replacement header technique. */
	width: 79px;
	background:url(../clients/_im/hdr-Clients.gif);
}
#container-about #sidebar-subnav h3 {    /* Image-replacement header technique. */
	width: 66px;
	background:url(../about/_im/hdr-About.gif);
}
/*#sidebar-subnav ul, li {
	margin: 0;
	padding: 0;
}
#sidebar-subnav li {
	list-style: none;
	list-style-type: none;
}
#sidebar-subnav .discipline {
	font-family: "Lucida Grande", "Lucida Sans","Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 96.5%;
	font-weight: bold;
	background-color: #f8f8f8;
}
#sidebar-subnav .project {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 93%;
	text-indent: 10px;
}
#sidebar-subnav .open {
	border-top: #b5b5b5 2px solid;
	margin: 16px 0 0 0;
}
#sidebar-subnav .closed {
	border-top: #b5b5b5 2px solid;
	margin: 24px 0 24px 0;
}
#sidebar-subnav li a {
	color: #8a3103;
	width: 208px;
	display: block;
	text-decoration: none;
	padding: 3.5px 4px 3.8px 5px;
	border-bottom: #b5b5b5 1px dotted;
}
#sidebar-subnav a:hover {
	background: #8a3103;
  	color: white;
}
#sidebar-subnav .project a {
	color: #a45134;
	width: 208px;
	display: block;
	text-decoration: none;
	padding: 3.1px 4px 3.5px 5px;
	border-bottom: #b5b5b5 1px dotted;
}
#sidebar-subnav .project a:hover {
	background: #8a3103;
  	color: white;
}*/
/*#sidebar-subnav #thisPage {
	color: #8a3103;
	position: relative;
	border: 1px dotted #09F;
	right: -190px;
}
This isn't working correctly yet. */
/*#sidebar-subnav .project a #thisPage {
	color: #909090;
}
#sidebar-subnav .project a:hover #thisPage {
	background: #8a3103;
  	color: white;
}*/



/* SUBNAV MENU, PORTFOLIO */

ul.menu, ul.menu ul {
	list-style-type: none;
 	margin: 1px 0 0 0;
	padding: 0;
	width: auto;
	text-align: left;
}
ul.menu {
	border-top: #888888 2px solid;
}
ul.menu a {
	display: block;
	text-decoration: none;
}
#sidebar-subnav div.open {
	margin: 0 0 16px 0;
}

/*ul.menu li {
  margin-top: 1px;
}    This fixes the bug where the hand-pointer turns into an arrow-pointer, but I hate the way it looks like a mistake, so I'm turning it off for now. */

ul.menu li a {      /* CATEGORIES */
	font: bold 96.5% "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	line-height: 135%;
	color: white;
	padding: 4.8px 6px 5.8px 8px;
	background: #525252 url(../_im/bknd-ptrn-gray-1.gif) repeat;	   /* Dark gray + pattern. */
	border-top: white 1px solid;
	cursor: pointer;
}
ul.menu li a:hover {      /* CATEGORIES HOVER */
	background: #8a3103;
  	color: white;
	cursor: pointer;
}
ul.menu li ul li a {      /* PROJECTS */
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 90%;
	font-weight: normal;
	line-height: 132%;
	color: #a45134;	   /* Red-orange. */
	padding: 4.2px 6px 5.8px 8px;
	background: white;
	border-top: none;
	border-bottom: #b5b5b5 1px dotted;
	cursor: pointer;
}
ul.menu li ul li a:visited {
	color: #b69285;	   /* Grayish red-orange. */
}
ul.menu li ul li a:hover {
	background: #fff8d0;	   /* Light yellow // 8a3103 = Dark red. */
  	color: #8a3103;
	cursor: pointer;
}
ul.menu li ul li a#thisPage {
	background: #8a3103 url(../_im/subnav-arw-on.gif) no-repeat 202px 8px;
	color: white;
	width: auto;
	margin: -1px 0 -1px 0;
	padding: 5.2px 6px 6.8px 8px;
	border-bottom: none;
}




/* PLAIN SUBNAV MENU (no accordion) */

ul.menu-simple li a {
	font-family: "Lucida Grande", "Lucida Sans","Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 96.5%;
	font-weight: bold;
	background: white;
	color: #8a3103;	   /* Dark red. */
	padding: 3.8px 6px 5.4px 8px;
	border-bottom: #b5b5b5 1px dotted;
	cursor: pointer;
}

ul.menu-simple, ul.menu-simple ul {
	list-style-type: none;
 	margin: 0;
	padding: 0;
	width: auto;
	text-align: left;
}

ul.menu-simple a {
	display: block;
	text-decoration: none;
}

ul.menu-simple li a {
	font-family: "Lucida Grande", "Lucida Sans","Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 96.5%;
	font-weight: bold;
	background: white;
	color: #8a3103;	   /* Dark red. */
	padding: 3.8px 6px 5.4px 8px;
	border-bottom: #b5b5b5 1px dotted;
	cursor: pointer;
}

ul.menu-simple li a:hover {
	background: #fff8d0;	   /* Light yellow // 8a3103 = Dark red. */
  	color: #8a3103;
	cursor: pointer;
}
ul.menu-simple li a#thisPage {
	background: #8a3103 url(../_im/subnav-arw-on.gif) no-repeat 202px 8px;
	color: white;
	width: auto;
}





/* PORTFOLIO INDEX */

#portfolio-index {
	margin: 0;
	padding: 21px 0 22px 20px;
}
#portfolio-index h1 {    /* Image-replacement header technique. */
	margin: 0;
	padding: 0px;
	text-indent: -5000px;
	height: 17px;
	width: 173px;
	display: block;
	background: url(../portfolio/_im/hdr-index-Port-flourish.gif) no-repeat;
	font-size: 0;
	vertical-align: bottom;
}




/* PORTFOLIO MAIN CONTENT */

#portfolio-main {
	width: 690px;
	float: right;
	margin: 0; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	margin: 21px 0 16px 0;
	padding: 1px 20px 0px 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	border-left: #b5b5b5 1px dotted;
}
#portfolio-main #hdr-container {
	font-size: 167%;
	width: auto;
	vertical-align: baseline;
}
#portfolio-main h1 {
	font-size: 100%;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #272727;
	float: left;
}
#hdr-container #hdr-flourish {
	margin: 0 9px 0 10px;
}
.project-scope {
	font-size: 63%;
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	color: #8a3103;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
#portfolio-main #hdr-container #date {
	font-size: 47%;
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: gray;
	float: right;
	margin-top: 12px;
}
#portfolio-main #hdr-container #date #date-label {
	font-weight: bold;
	color: #8a3103;
	vertical-align: baseline;
}
#portfolio-main h2 {
	color: #8a3103;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font: bold 105% "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	line-height: 11px;
	background: url(../_im/flourish1.gif) no-repeat;
	display: block;
	vertical-align: baseline;
	width: auto;
	padding-left: 30px;
	margin: 19px 0 2px 0;
}
#portfolio-main h3.credit {
	color: #8a3103;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font: bold 72% "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	line-height: 11px;
	vertical-align: baseline;
	margin: 19px 0 0px 0;
}
#portfolio-main p {
	font-size: 112%;
	font-family: Georgia, "Times New Roman", Times, serif;
	margin: .75em 0;
	padding: 0;
}
#portfolio-main p a {
	width: auto;
	color: #a45134;
	text-decoration: none;
	padding: 2.5px 4px 3px 4px;
	margin: 0 -4px 0 -4px;
}
#portfolio-main p a:hover {
	background: #fff8d0;     /* was fff1d8 */
  	color: #bc4a18;
}
#portfolio-main p.credit {
	font-size: 85%;
	font-family: Georgia, "Times New Roman", Times, serif;
	letter-spacing: 0.03em;
	margin: .4em 0;
	padding: 0;
}


#project-descr {
	width: 690px;
	border-top: #787878 5px solid;
	border-bottom: #b5b5b5 2px solid;
	background: url(../_im/dotted-bg-690w.gif) repeat-y;
	margin-top: 3px;
}

/*#content_box {
	background: #312B29 url(_im/bknd_rule.gif) repeat;
	width: 752px;
	border-top: 1px dotted #72706F;
	float: left;
	display: inline;
	margin: 25px 0px 0px 24px;
}
*/


#project-descr #left-col {
	width: 440px;
	margin: 3px 0 40px 0;
	padding: 0;
	float: left;
}


#project-descr #right-col {
	width: 210px;
	margin: 19px 0 36px 0;
	padding: 0;
	float: right;
}
#project-descr #right-col h3 {
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 78%;
	font-weight: bold;
	color: #772416;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}	
#project-descr #right-col li {
	font-family: "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 85%;
	line-height: 116%;
	color: #939190;
	margin: 5px 0 5px 0;
	display: block;
}
#project-descr #right-col li a {
	color: #a45134;	/*red-orange*/
}
#project-descr #right-col li a:visited {
	color: #b69285;	/*grayish red-orange*/
}
#project-descr #right-col li a:hover {
	color: #a45134;	/*red-orange*/
	border-bottom: #a45134 1px dotted;	/*red-orange*/
}
#project-descr .right-col-list {
	padding-bottom: 13px;
}





/*#gallery a, #gallery a:visited {
  color:#fff; 
  text-decoration:none; 
  display:block; 
  padding:0.4em;
  background: #47a;
  }
#gallery a:hover {
  background: #258; 
  color:#9cf;
  }
dd {
  margin:0; 
  padding:0; 
  text-align:center; 
  border-top:1px solid #fff; 
  }
dt {
  margin:0; 
  padding:0.4em; 
  text-align:center; 
  font-size: 1.4em; 
  font-weight:bold; 
  background: #69c;
  }
dl {
  margin: 0; 
  padding: 0; 
  border-left:1px solid #fff; 
  border-right:1px solid #fff;
  }
#container {
  width:12em;
  border-top:1px solid #fff;
  border-bottom:1px solid #fff;
  }
#container {
  width:12em;
  }*/



/* CLIENTS MAIN CONTENT */

#clients-main {
	width: 690px;    /* Change this from 690 to 688 and add a border for debugging. */
	float: right;
	margin: 0; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	margin: 21px 0 16px 0;
	padding: 1px 20px 0px 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	border-left: #b5b5b5 1px dotted;
	/*border: orange dotted 1px;*/
}
#clients-main #hdr-container {
	font-size: 100%;
	width: auto;
	margin: 0 0 0 0;
	padding: 0;
	/*border: red dotted 1px;*/
}
#clients-main #hdr-container h1 {
	font-size: 167%;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #272727;
	margin: 0 0 0 0;
	/*border: orange dotted 1px;*/
}
#clients-main #hdr-container #hdr-flourish {
	margin: 7px 9px 0 0;
	float: left;
	/*border: green dotted 1px;*/
}
#clients-main #hdr-container p {
	font-size: 130%;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #3a3939;
	width: auto;
	margin: 10px 0 6px 0;
	/*border: green dotted 1px;*/
}
#clients-main #gray-logos {
	width: 690px;
	margin: 0;
	padding: 0;
	/*border: orange dotted 1px;*/
}
#clients-main #gray-logos .row {
	width: 690px;
	height: 110px;
	margin: 0 0 5px 0;
	padding: 0;
}
#clients-main #gray-logos img {
	margin: 0 5px 0 0;
	padding: 0;
}
#clients-main #gray-logos img.last {
	margin: 0 0 0 0;
}

#clients-main a:hover { 
	background: #8a3103;	   /* fff8d0 = Light yellow. */
	color: white;	   /* 8a3103 = Dark red. */
	text-decoration: none;
}
#clients-main a { 
	width: auto;
	color: #8a3103;	   /* Dark red. */
	text-decoration: none;
	padding: 0.1em 0.25em 0.15em 0.25em;
	margin: 0 -0.25em 0 -0.25em;
}

/* SKIP-TO */

#clients-main #skip-to, .industry {
	font-family: "Lucida Grande", "Lucida Sans","Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 87%;
}
#clients-main #skip-to ul, .industry ul {
	list-style: none;
	margin: 0;
	padding: 0;
	width: auto;
	text-align: left;
}
#clients-main #skip-to ul, .industry ul {
	display: block;
	text-decoration: none;
}
#clients-main #skip-to a, .industry a {
	display: block;
	text-decoration: none;
}
#clients-main #skip-to li a {
	color: #bc4a04;	   /* Orange-red. */
	padding: 1.75px 5px 4.75px 22px;
	margin: -1.75px 0 -4.75px;
	background: url(../_im/skip-to-arw.gif) no-repeat 8px 6px;
}
#clients-main .industry li {
	margin-left: 11px;
	line-height: 162%;
	color: #696969;
}
#clients-main .industry li a {
	color: #bc4a04;	   /* Orange-red. */
	padding: 1.75px 5px 4.75px 10px;
	margin: -1.75px 0 -4.75px -10px;
	background: none;
}
#clients-main #skip-to li a:hover {
	color: #bc4a04;	   /* Orange-red. */
	background: #fff8d0 url(../_im/skip-to-arw.gif) no-repeat 8px 6px;     /* Light yellow.  */
}
#clients-main .industry li a:hover {
	color: #bc4a04;	   /* Orange-red. */
	background: #fff8d0;     /* Light yellow.  */
}
#clients-main #skip-to .col {
	width: 220px;
	margin: 0 10px 0 0px;
	float: left;
	/*border: green dotted 1px;*/
}

/* INDUSTRIES */

#clients-main .industry {
	width: 690px;
	border-top: #787878 solid 5px;
	margin: 35px 0 0 0;
	padding: 15px 0 0 0;
}
#clients-main .industry.last {
	border-bottom: #787878 solid 5px;
	margin: 38px 0 9px 0;
	padding: 15px 0 35px 0;
}
#clients-main .industry h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 120%;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: #3a3939;
	margin: 0 0 13px 0;
}
#clients-main .col {
	width: 220px;
	margin: 0 10px 0 0px;
	float: left;
	/*border: green dotted 1px;*/
}
#clients-main .named-anchor {
	text-decoration: none;
	margin: 0;
	padding: 0;
	height: 1px;
	width: 1px;
}



/* TESTIMONIALS */

#testimonials-main {
	width: 690px;    /* Change this from 690 to 688 and add a border for debugging. */
	float: right;
	margin: 21px 0 16px 0;
	padding: 1px 20px 0px 20px;
	border-left: #b5b5b5 1px dotted;
	/*border: orange dotted 1px;*/
}
#testimonials-main h1 {    /* Image-replacement header technique. */
	margin: 12px 0 22px 0;
	padding: 0px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 0;
	color: #272727;
	text-indent: -5000px;
	height: 16px;
	width: 460px;
	display: block;
	background: url(../about/_im/hdr-Testimonials.gif) no-repeat;
	vertical-align: bottom;
}
#testimonials-main .pullquote {
	background: #ebebeb url(../about/_im/quotes.gif) no-repeat 24px 26px;
	padding: 63px 20px 24px 25px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 22px;
	line-height: 29px;
}
#testimonials-main .pullquote p {
	margin-bottom: 11px;
}
#testimonials-main .pullquote p.second {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 15.5px;
	line-height: 22.5px;
}
#testimonials-main .pullquote p.attribution, #testimonials-main .two-col-equal-container p.attribution {
	font-family: "Lucida Grande", "Lucida Sans","Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 11px;
	line-height: 16px;
	color: #909090;
	margin: 0;
	padding: 0;
}
#testimonials-main .pullquote .attribution a, #testimonials-main .two-col-equal-container .attribution a {
	font-size: 13px;
	line-height: 24px;
	color: #8a3103;
	text-decoration: none;
}
#testimonials-main .pullquote .attribution a:hover, #testimonials-main .two-col-equal-container .attribution a:hover {
	color: #8a3103;
	text-decoration: underline;
}
#testimonials-main .pullquote img {
	float: left;
}
#testimonials-main .pullquote img#chow {
	margin: 7px 20px 0 0;
}
#testimonials-main .pullquote img#download {
	margin: 7px 20px 0 0;
}
#testimonials-main .pullquote img#webshots {
	margin: 9px 20px 0 0;
}
#testimonials-main .pullquote img#fitbit {
	margin: 7px 20px 0 0;
}
#testimonials-main .pullquote img#srl {
	margin: -4px 20px 0 0;
}
#testimonials-main .pullquote img#cnet-networks {
	margin: 8px 20px 0 0;
}
#testimonials-main .pullquote img#cgf {
	margin: 3px 20px 0 0;
}
#testimonials-main .two-col-equal-container {
	margin: 24px 10px 10px 10px;
	border-top: 0;
}
#testimonials-main .two-col-equal-container p {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 15px;
	line-height: 21px;
	color: #666565;
}
#testimonials-main h2 {
	font-family: "Lucida Grande", "Lucida Sans","Lucida Sans Unicode", "Lucida Grande CY", Helvetica, Arial, sans-serif;
	font-size: 18px;
	font-weight: bold;
	line-height: 23px;
	color: #3f3f3f;
}
#testimonials-main .right p.attribution, #testimonials-main .left p.attribution {
	margin-top: -4px;
	margin-bottom: 22px;
}
#testimonials-main .lastname {
	display: none;
}


/* AWARDS — YELLOW PANEL */

#awards-rec {
	margin: 19px 0 0 0;
	padding: 0;
	width: 690px;
	height: 360px;
	background-color: #fff5ae;
	/*border-top: #fff5ae solid 1px;*/
	float: left;
	text-align: left;
}
#awards-rec #awd1 {
	position: relative;
	left: 0px;
	top: 0px;
/*	width:29px;
	height:22px;*/	
	z-index: 1;
	visibility: visible;
}
#awards-rec #awd2 {
	position: relative;
	left: 0px;
	top: -339px;
	z-index: 2;
	visibility: hidden;
}
#awards-rec #awd3 {
	position: relative;
	left: 0px;
	top: -678px;
	z-index: 3;
	visibility: hidden;
}
#awards-rec #awd4 {
	position: relative;
	left: 0px;
	top: -1017px;
	z-index: 4;
	visibility: hidden;
}
#awards-rec #awd5 {
	position: relative;
	left: 0px;
	top: -1356px;
	z-index: 5;
	visibility: hidden;
}
#awards-rec #awd6 {
	position: relative;
	left: 0px;
	top: -1695px;
	z-index: 6;
	visibility: hidden;
}
#awards-rec #awd7 {
	position: relative;
	left: 0px;
	top: -2034px;
	z-index: 7;
	visibility: hidden;
}
#awards-rec #awd8 {
	position: relative;
	left: 0px;
	top: -2373px;
	z-index: 8;
	visibility: hidden;
}
#awards-rec #awd9 {
	position: relative;
	left: 0px;
	top: -2712px;
	z-index: 9;
	visibility: hidden;
}

#awards-rec #left {
	float: left;
	width: 330px;
}
#awards-rec #right {
	float: right;
	margin: 20px 36px 20px 0;
	padding: 0;
	width: 322px;
}
#awards-rec .awd-stage {
	width: 310px;
	height: 212px;
	background-color: white;
	margin: 20px 0 0 20px;
}
#awards-rec #awd2, #awd3, #awd4, #awd5, #awd6, #awd7, #awd8, #awd9 {
	visibility: hidden;
}
#awards-rec #awd1 .awd-stage img, #awd3 .awd-stage img, #awd5 .awd-stage img, #awd6 .awd-stage img {
	margin: 61px 0 0 79px;
}
#awards-rec #awd2 .awd-stage img {
	margin: 32px 0 0 103px;
}
#awards-rec #awd4 .awd-stage img {
	margin: 86px 0 0 49px;
}
#awards-rec #awd7 .awd-stage img {
	margin: 68px 0 0 44px;
}
/*#awards-rec #awd8 .awd-stage img {
	margin: 27px 0 0 72px;
}
#awards-rec #awd9 .awd-stage img {
	margin: 14px 0 0 82px;
}*/
#awards-rec #awd8 .awd-stage img {
	margin: 0;
}
#awards-rec #awd9 .awd-stage img {
	margin: 0;
}
#awards-rec .awd-details {
	width: 278px;
	height: 72px;
	background-color: #fffbdf;
	margin: 5px 0 20px 20px;
	padding: 14px 15px 16px 17px;
}
#awards-rec .awd-name {
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 14px;
	line-height: 130%;
	font-weight: bold;
	color: #3f3f3f;
	margin: 0;
	padding: 0;
}
#awards-rec .awd-descr {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	line-height: 137%;
	color: #6d6c6c;
	margin: 4px 0 0 0;
	padding: 0;
}


#awards-rec ul, li {
	list-style: none;
	margin: 0;
	padding: 0 0 0 0px;
}
#awards-rec li {
	list-style: none;
	width: 334px;
	margin: 0;
	padding: 0 0 0 0px;
}
#awards-rec li a {
	display: block;
	float: left;
	width: 318px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 125%;
	color: #3f3f3f;
	text-decoration: none;
	margin: 0 0 0 16px;
	padding: 5px 4px 8px 4px;
	border-top: 1px dotted #c8c089;
}
#awards-rec li a:hover {
	width: 318px;
	margin: 0;
	padding: 6px 4px 8px 20px;
	color: white;
	border: none;
	background: #8a3103 url(../_im/awds-red-ylw-arw.gif) no-repeat 0px 0px;
	text-decoration: none;
}
#awards-rec li a#last {
	border-bottom: 1px dotted #c8c089;
}
#awards-rec li a:hover#last  {
	border-bottom: none;
	text-decoration: none;
}




/* AWARDS — FEATURED ON */

#featured-on {
	margin: 20px 0 0px 0;
	padding: 0px;
	width: 690px;
	height: 444px;
	border-top: 5px solid #787878;
}
#featured-on h2 {    /* Image-replacement header technique. */
	margin: 29px 0 20px 0;
	padding: 0px;
	text-indent: -5000px;
	height: 15px;
	width: 183px;
	display: block;
	background: url(../_im/hdr-Featured-On.gif) no-repeat;
	font-size: 0;
	vertical-align: bottom;
}
#featured-on ul, #featured-on li {
	list-style: none;
	margin: 0;
	padding: 0;
}
#featured-on li, #featured-on li a, #featured-on li a:visited, #featured-on a img {
	display: block;
	float: left;
	width: 134px;
	height: 89px;
	font-size: 2px;
	color: #f4f4f4;
	text-decoration: none;
	border: none;
	margin: 0 5px 5px 0;
}
#featured-on li a:hover {
	margin: 0;
	background: url(../_im/awds-view-arw.gif) no-repeat 95px 78px;
}
#featured-on li a {
	margin: 0;
	background: url(../_im/awds-view-arw2.gif) no-repeat 123px 78px;
}
#featured-on #ftd-NYTimes {
	background: url(../_im/ftd-NYTimes.gif);
}
#featured-on #ftd-Netscape {
	background: url(../_im/ftd-Netscape.gif);
}
#featured-on #ftd-AOL {
	background: url(../_im/ftd-AOL.gif);
}
#featured-on #ftd-CNN {
	background: url(../_im/ftd-CNN.gif);
}
#featured-on #ftd-Weekly-Standards {
	background: url(../_im/ftd-Weekly-Standards.gif);
	margin: 0 0 5px 0;
}
#featured-on #ftd-BusWeek {
	background: url(../_im/ftd-BusWeek.gif);
}
#featured-on #ftd-Veer {
	background: url(../_im/ftd-Veer.gif);
}
#featured-on #ftd-Lycos {
	background: url(../_im/ftd-Lycos.gif);
}
#featured-on #ftd-CssBloom {
	background: url(../_im/ftd-CssBloom.gif);
}
#featured-on #ftd-CssCool {
	background: url(../_im/ftd-CssCool.gif);
	margin: 0 0 5px 0;
}
#featured-on #ftd-CssGalaxy {
	background: url(../_im/ftd-CssGalaxy.gif);
}
#featured-on #ftd-CssGalleries {
	background: url(../_im/ftd-CssGalleries.gif);
}
#featured-on #ftd-CssMania {
	background: url(../_im/ftd-CssMania.gif);
}
#featured-on #ftd-CssWebsite {
	background: url(../_im/ftd-CssWebsite.gif);
}
#featured-on #ftd-DesignMeltdown {
	background: url(../_im/ftd-DesignMeltdown.gif);
	margin: 0 0 5px 0;
}
#featured-on #ftd-DesignSnack {
	background: url(../_im/ftd-DesignSnack.gif);
}
#featured-on #ftd-Screenalicious {
	background: url(../_im/ftd-Screenalicious.gif);
}
#featured-on #ftd-Screenfluent {
	background: url(../_im/ftd-Screenfluent.gif);
}
#featured-on #ftd-WebCreme {
	background: url(../_im/ftd-WebCreme.gif);
}
#featured-on #ftd-W3CSites {
	background: url(../_im/ftd-W3CSites.gif);
	margin: 0 0 5px 0;
}




/* MAIN CONTENT: TWO-COL, EQUAL WIDTH*/

.two-col-equal-container {
	width: 100%;    /* Must declare for floats to work right. */
	margin: 10px 0 30px 0;
	padding: 0px;
	border-top: 5px solid #787878;
}
.two-col-equal-container.last {
	margin: 10px 0 0 0;
	padding: 0 0 30px 0;
	border-bottom: 5px solid #787878;
}
.two-col-equal-container .prevnext {
	margin: 4px 0 4px 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 93%;
}
.two-col-equal-container .prevnext a {
	color: #a45134;
	width: auto;
	text-decoration: none;
	padding: 2.5px 7px 3px 7px;
}
.two-col-equal-container .prevnext a:hover {
	background: #8a3103;
  	color: white;
}
.two-col-equal-container .left {
	width: 310px;
	margin: 0;
	padding: 0 20px 0 0;
	float: left;
}
.two-col-equal-container .right {
	width: 310px;
	margin: 0;
	padding: 0 20px 0 0;
	float: right;
}



/* AWARDS & RECOG. — MISC. */

#container-about .two-col-equal-container h3 {    /* Image-replacement header technique. */
	margin: 30px 0 17px 0;
	padding: 0;
	text-indent: -5000px;
	height: 15px;
	display: block;
	font-size: 0;
	vertical-align: bottom;
}
#container-about .two-col-equal-container #editorial h3 {
	width: 146px;
	background: url(../about/_im/hdr-Editorial.gif);
}
#container-about .two-col-equal-container #misc-awards h3 {
	width: 191px;
	background: url(../about/_im/hdr-Misc-Awards.gif);
}
#container-about .two-col-equal-container #photo-contrib h3 {
	width: 295px;
	background: url(../about/_im/hdr-Photo-Contrib.gif);
}
#container-about .two-col-equal-container #speaking h3 {
	width: 317px;
	background: url(../about/_im/hdr-Speaking.gif);
}
#container-about p, #misc-awards dl {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 104%;
	line-height: 140%;
	color: #686767;
	margin: 0 0 6px 0;
	padding: 0;
	list-style: none;
}
#container-about #misc-awards dl {
	margin: 0 0 12px 0;
}
#container-about #misc-awards dd.strong {
	color: #3f3f3f;
	font: bold 95%/135% "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	list-style: none;
}
#container-about .left ul, #container-about .right ul {
	margin: 0 0 14px 12px;
}
#container-about .left ul li, #container-about .right ul li {
	color: #3f3f3f;
	font: bold 95%/135% "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	list-style: none;
	margin: 0px;
	padding: 1px 0 3px 0;
	text-indent: -1.1em;
	margin-left: 1.1em;
}






/* PREV—NEXT */

#prevnext-container {
	overflow: auto;
	width: 100%;    /* Must declare for floats to work right. */
}
#prevnext-container .prevnext {
	margin: 4px 0 4px 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 93%;
}
#prevnext-container .prevnext a {
	color: #a45134;
	width: auto;
	text-decoration: none;
	padding: 2.5px 7px 3px 7px;
}
#prevnext-container .prevnext a:hover {
	background: #8a3103;
  	color: white;
}
#prevnext-container #prevnext-l {
	margin: 0;
	float: left;
}
#prevnext-container #prevnext-r {
	margin: 0;
	float: right;
}




/* DEBUG */

#debug {
	text-align: right;
}
#debug a {
	color: #6c2407;
	padding: 3px 5px 4px 5px;
}
#debug a:hover {
	color: white;
	background-color: #333;
}





.fltrt { /* 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;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.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;
}