@import url(http://fonts.googleapis.com/css?family=Cardo:400,400italic,700);
@import "reset.css";
/*
font-family: 'Cardo', serif;
*/

body,
html {height: 100%;}

body {font: 62.5%/1.4 'Lucida Sans', 'Lucida Grande', 'Calibri', Verdana, Arial, sans-serif; background: #777; color: #222;}

a {font-style: inherit; line-height: inherit;}
a:link,
a:visited {color: #a33517;}
a:hover,
a:active {}
/*a[href="#"] {text-decoration: line-through !important;}
a[onclick] {text-decoration: underline !important;}
*/
abbr {font-size: 90%; letter-spacing: .2em; text-transform: uppercase;}
em {font-weight: inherit; font-style: italic;}

h1 {display: none;}
h2 {height: 18px; margin: 2em 0 .5em; overflow: hidden; text-indent: -999em; background-position: top left; background-repeat: no-repeat;}
h1 + h2 {margin-top: 0;}
h2.plain {height: auto; margin-bottom: 0; text-indent: 0; font-size: 2em;}
h3 {margin: 1em 0 .5em; font-size: 1.2727em;}
h3.subtitle {margin: 0 0 .5em; font-style: italic; font-size: 1em; color: #464646;}

p,
ul,
ol,
dl {margin-bottom: 0.77em;}

address {font-style: normal; display: block;}

.address {margin: 0 0 3em;}
.address ul {margin: 0 0 0.8em;}
.address ul li {clear: left;}
.address ul li span {width: 1.5em; display: block; float: left; font-weight: bold; color:#a33517;}

#alert {padding: 1em; background: #FFC; font-size: 1.1em;}
#alert p {width: 960px; margin: 0 auto;}

#container {width: 960px; height: 680px; margin: 0 auto; padding: 10px; position: relative; background: url(/images/bg_container.png) no-repeat top left;}

#header {width: 192px; height: 650px; position: absolute; top: 10px; left: 10px; background: #FFF; font-size: 1.2em; z-index: 3;}
#header h6 {width: 144px; height: 62px; margin: 44px 24px 24px; display: block; border-bottom: 1px solid #222;}
#header h6 a {width: 144px; height: 42px; display: block; overflow: hidden; background: url(/images/logo.png) no-repeat top left; text-indent: -999em;}
#header ul {height: 462px; color: #666;}
#header ul li {}
#header ul li.expanded > span {background: url(/images/arrow_expanded.png) no-repeat 100% 50%; color: #a33517;}
#header ul ul {height: 600px; width: 256px; padding: 50px 0 0; position: absolute; top: 0; left: 192px; background: url(/images/bg_panel1.png) repeat-y top left; text-align: left;}
#header ul ul li {width: 218px; margin-bottom: 1em; padding: 0 14px 0 24px; line-height: 1.2;}
#header ul ul ul {width: 0; left: 256px; display: none; background-image: url(/images/bg_panel2.png);}
#header ul ul ul li {margin-bottom: 1em; font-size: .9167em;}
#header ul ul ul ul {background-image: url(/images/bg_panel3.png);}
#header ul ul ul ul li {font-size: 1em;}
#header ul span {padding: 0 10px 0 0; display: block; color: #222; cursor: pointer;}
#header ul span:hover {color: #a33517;}
#header ul li a {height: 30px; display: block; overflow: hidden; text-indent: -999em; background: url(/images/nav.png) no-repeat top left;}
#header ul li a#nav-about {}
#header ul li a#nav-about:hover {background-position: -192px 0;}
#header ul li.current a#nav-about {background-position: -384px 0;}
#header ul li a#nav-clients {background-position: 0 -30px;}
#header ul li a#nav-clients:hover {background-position: -192px -30px;}
#header ul li.current a#nav-clients {background-position: -384px -30px;}
#header ul li a#nav-projects {background-position: 0 -60px;}
#header ul li a#nav-projects:hover {background-position: -192px -60px;}
#header ul li.current a#nav-projects {background-position: -384px -60px;}
#header ul li a#nav-associates {background-position: 0 -90px;}
#header ul li a#nav-associates:hover {background-position: -192px -90px;}
#header ul li.current a#nav-associates {background-position: -384px -90px;}
#header ul ul li a {height: auto; display: inline; overflow: visible; text-indent: 0; background: none; text-decoration: none; color: #222;}
#header ul ul li a:hover {color: #a33517;}
#header p {margin: 0 24px; border-top: 1px solid #222; text-align: center;}
#header p a {height: 30px; display: block; overflow: hidden; text-indent: -999em; background: url(/images/nav.png) no-repeat -24px -120px;}
#header p a:hover,
#header p.current a {background-position: -216px -120px;}

#content {width: 768px; height: 650px; position: absolute; top: 10px; left: 202px; z-index: 2; overflow: hidden; background-color: #FFF; background-repeat: no-repeat; background-position: top left; }
#content .guts {width: 480px; height: 562px; padding: 44px; position: absolute; top: 0; left: 0; z-index: 4; overflow: hidden; background: url(/images/bg_white_90.png); font-size: 1.1em;}
#content .scrolling {height: 562px; overflow: hidden;}

#content dl {padding-bottom: 0;}
#content dl dt {padding-left: 20px; font-size: 1.0909em; font-weight: bold; background: url(/images/bullet.png) no-repeat 5px 45%; color: #a33517;}
#content dl dd {margin-left: 20px; margin-bottom: .77em;}

#content .jScrollPaneContainer {position: relative; overflow: hidden; z-index: 3;}
#content .jScrollPaneTrack {position: absolute; cursor: pointer; right: 0; top: 0; height: 100%; background: url(/images/bg_scrolltrack.png) repeat-y 50% 0;}
#content .jScrollPaneDrag {position: absolute; left: 1px; width: 10px !important; background: #a33516; cursor: pointer; overflow: hidden;}
#content .jScrollPaneDragTop {position: absolute; top: 0; left: 0; overflow: hidden;}
#content .jScrollPaneDragBottom {position: absolute; bottom: 0; left: 0; overflow: hidden;}
#content a.jScrollArrowUp {display: block; position: absolute; z-index: 1; top: 0; right: 0; text-indent: -999em; overflow: hidden; background: url(/images/bg_scrollarrowup.png); height: 13px;}
#content a.jScrollArrowUp:hover {/*background-color: #f60;*/}
#content a.jScrollArrowDown {display: block; position: absolute; z-index: 1; bottom: 0; right: 0; text-indent: -999em; overflow: hidden; background: url(/images/bg_scrollarrowdown.png); height: 13px;}
#content a.jScrollArrowDown:hover {/*background-color: #f60;*/}
#content a.jScrollActiveArrowButton,
#content a.jScrollActiveArrowButton:hover {/*background-color: #f00;*/}

#popup {width: 936px; height: 626px; padding: 12px; display: none; position: absolute; top: 10px; left: 10px; z-index: 4; background: url(/images/bg_popup.png) no-repeat top left;}
#popup .closer {height: 30px; padding: 0 40px; background: #CCC url(/images/bg_closer.png) no-repeat 899px 6px; cursor: pointer; text-align: right; text-transform: uppercase; font-weight: bold; line-height: 30px;}
#popup .loader {height: 596px; background: #FFF url(/images/loader.gif) no-repeat 50% 50%;}
#popup .guts {height: 566px; padding: 15px 20px; background: #FFF; display: none; font-size: 1.2em;}
#popup .guts h1 {margin: 0 0 1em; padding: 0 0 .5em; display: block; float: left; border-bottom: 1px solid #222; font-size: 1.1667em; text-transform: uppercase; color: #a33517;}
#popup .guts h1 span {text-transform: none;}
#popup .guts dl {padding: 0 275px 0 110px; clear: left;}
#popup .guts dl dt {width: 100px; margin: 0 0 0 -110px; float: left; text-align: right; color: #a33517; font-weight: bold;}
#popup .guts dl dd {margin-bottom: 10px;}
#popup .guts #media {width: 262px; margin: 0 0 10px 10px; float: right; }
#popup .guts #media #logo {margin: 0 6px 10px; display: block;}
#popup .guts #media #photos {height: 300px; margin: 0 0 10px; padding: 5px 6px 8px; position: relative; overflow: hidden; background: url(/images/bg_photos.png) no-repeat top left;}
#popup .guts #media #photos img {display: block; position: absolute; top: 5px; left: 6px;}
#popup .guts #media #photo-nav {width: 55%; float: left;}
#popup .guts #media #photo-nav ul {padding: 0 6px;}
#popup .guts #media #photo-nav li {float: left; padding-right: 3px;}
#popup .guts #media #photo-nav li a {width: 10px; height: 10px; display: block; overflow: hidden; text-indent: -999em; border: 1px solid #222; margin-bottom: 3px; }
#popup .guts #media #photo-nav li a:hover,
#popup .guts #media #photo-nav li a.current {background: #a33517; border-color: #a33517;}
#popup .guts #media #pdf {width: 45%; float: right; text-align: right;}

#footer {padding: 660px 0 0; position: relative; z-index: 0; color: #AAA; text-align: right; font-size: 9px;}
#footer a {color: #AAA;}

/* page variations */
#about #content {background-image: url(/images/bg_about.jpg);}
#about #content .guts h2#experience {background-image: url(/images/title_about_experience.png);}
#about #content .guts h2#services {background-image: url(/images/title_about_services.png);}

#clients #content {background-image: url(/images/bg_clients.jpg);}

#projects #content {background-image: url(/images/bg_projects.jpg);}

#associates #content {background-image: url(/images/bg_associates.jpg);}
#associates #content .guts h2#donald {background-image: url(/images/title_assoc_donald.png);}
#associates #content .guts h2#terry {background-image: url(/images/title_assoc_terry.png);}
#associates #content .guts h2#robert {background-image: url(/images/title_assoc_robert.png);}
#associates #content .guts h2#cindy {background-image: url(/images/title_assoc_cindy.png);}
#associates #content address span {color: #a33517; font-weight: bold;}
#associates #content dl dt {padding-left: 0px; font-size: 1em; font-weight: normal; background: none; color: #222;}
#associates #content dl dd {margin-left: 20px; margin-bottom: .77em;}
#associates #content ul.nav {height: 600px; width: 256px; padding: 50px 0 0; position: absolute; top: 0; left: 0; background: url(/images/bg_panel1.png) repeat-y top left; text-align: left;}
#associates #content ul.nav li.leaf .guts {width: 0; left: 256px; z-index: 4; line-height: 1.5;}
#associates #content ul.nav li.leaf .guts .scrolling {width: 424px;}
#associates #content ul.nav li.leaf .guts h2 {margin-top: 0;}
#associates #content ul.nav li.leaf {width: 218px; margin-bottom: 1em; padding: 0 14px 0 24px; line-height: 1.2;}
#associates #content ul.nav li.leaf span.trigger {padding: 0 10px 0 0; display: block; color: #222; font-size: 1.2em; cursor: pointer;}
#associates #content ul.nav li.leaf span.trigger:hover {color: #a33517;}
#associates #content ul.nav li.expanded span.trigger {background: url(/images/arrow_expanded.png) no-repeat 100% 50%; color: #a33517;}

#contact #content {background-image: url(/images/bg_contact.jpg);}
#contact #content .guts {width: 250px; height: 452px; padding: 99px 24px;}
#contact #content .guts h2#drassociates {background-image: url(/images/title_contact_drassociates.png);}

#home #header {width: 260px; left: 360px; background: url(/images/bg_white_90_home.png) repeat;}
#home #header h6 {width: 236px; height: 67px; margin: 125px 12px 5px; display: block; background: url(/images/logo_large.png) no-repeat top center; border-bottom: 1px solid #222; text-indent: -999em;}
#home #header ul {height: 90px; margin: 0 7px; color: #666;}
#home #header ul li {float: left;}
#home #header ul li a {height: 25px; background: url(/images/nav_small.png) no-repeat top left;}
#home #header ul li a#nav-about {width: 48px;}
#home #header ul li a#nav-about:hover {background-position: 0 -25px;}
#home #header ul li a#nav-clients {width: 58px; background-position: -48px 0;}
#home #header ul li a#nav-clients:hover {background-position: -48px -25px;}
#home #header ul li a#nav-projects {width: 64px; background-position: -106px 0;}
#home #header ul li a#nav-projects:hover {background-position: -106px -25px;}
#home #header ul li a#nav-associates {width: 76px; background-position: -170px 0;}
#home #header ul li a#nav-associates:hover {background-position: -170px -25px;}
#home #header p {margin: 0 12px;}
#home #header p a {margin: 0 46px;}
#home #header #quotes {height: 275px; position: relative;}
#home #header blockquote {width: 260px; height: 275px; margin: 0; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-position: top left;}
#home #header blockquote p {font-family: 'Cardo', serif; line-height:24px; border:0; font-size:110%; font-style:italic; color:#666666; }
#home #header #quote1 { background-image: url(/images/quote-no.png); }
#home #header #quote2 { background-image: url(/images/quote-no.png); }
#home #header #quote3 { background-image: url(/images/quote-no.png); }
#home #header #quote4 { background-image: url(/images/quote-no.png); }
#home #header #quote5 { background-image: url(/images/quote-no.png); }
#home #content {background: #FFF; width: 960px; left: 10px;}
#home #content img {position: absolute; top: 0; left: 0;}

#photography #content {background-image: url(/images/bg_about.jpg);}
#photography #content h2#photography {background-image: url(/images/title_photography.png);}
#photography #content h2#websitedesign {background-image: url(/images/title_websitedesign.png);}
#photography dd a {color: #222;}

.project {height: auto; padding: 20px; background: #FFF; font-size: 12px;}
.project h1 {margin: 0 0 1em; padding: 0 0 .5em; display: block; border-bottom: 1px solid #222; font-size: 1.5em; text-transform: uppercase;}
.project dl {padding-left: 110px; clear: left;}
.project dl dt {width: 100px; margin: 0 0 0 -110px; float: left; text-align: right; color: #000; font-weight: bold;}
.project dl dd {margin-bottom: 10px;}
.project #media {margin: 0 0 1em; padding: 0 0 1em; border-bottom: 1px dotted #999;}

.citation { color:#a43719 !important; line-height:16px !important; padding:15px 0 0 0; }

.fixer-shortest-lines-con li { line-height:.43 !important; }
.fixer-shortest-lines li { line-height:.50 !important; }
.fixer-shorter-lines li { line-height:.90 !important; }  
.photo-credits dd a { color:#000000 !important; }
