/* * Narrative.css * Created: October 2009 * Last Modified: May 2010 * Author: Mighty Digital */ /***************************************** **** some default/sitewite styles ******** ******************************************/ body {color:#663700;background:#fff url(../img2/bg-content.png) 0px 115px repeat-x;font-family:"Helvetica Neue", Arial, Helvetica, sans-serif;font-size:13px;} p {line-height:22px;} a, a:active, a:visited {color:#663700;text-decoration:none;} a:hover {color:#976C3F;} .section, .clear {clear:both;} .wrap {width:790px;margin:0 auto;} /***************************************** ************ #header styles ************* ******************************************/ #header {height:115px;width:100%;background:#f3ebe2 url(../img2/bg.png) top center repeat-x;margin-top:1px;} #header .wrap {position:relative;height:115px;width:1000px;} #header h1 {position:absolute;left:40px;top:52px;width:187px;height:50px;background:url(../img2/logo.png) top left no-repeat;text-indent:-9999px;display:block;} #header h1 a {display:block;width:187px;height:50px;} #header #nav {position:absolute;right:0px;bottom:0px;display:block;} #header #nav ul#tabs {} /* Tab Defaults */ #header #nav ul#tabs li {float:left;display:block;padding:0 0 0 22px;margin-left:-10px;height:31px;background:url(../img2/navtabs-left.png) no-repeat left top;z-index:0;position:relative;} #header #nav ul#tabs li a {float:left;display:block;height:22px;padding:9px 24px 0 0;color:white;text-decoration:none;font-weight:bold; background:url(../img2/navtabs.png) no-repeat right top;z-index:0;position:relative; text-transform:uppercase;font-size:15px;font-family:"Trebuchet MS", "Helvetica Neue", Arial, Verdana, sans-serif;} /* Tab Current */ #header #nav ul#tabs li.current {background:url(../img2/navtabs-left.png) no-repeat 0% -62px;padding:0 0 0 22px;height:31px;z-index:99;} #header #nav ul#tabs li.current a {background:url(../img2/navtabs.png) no-repeat 100% -62px;height:22px;color:#663700;padding:9px 24px 0 0;z-index:99;} /* Tab Hover -- Hover class set via JS for cross-browser-ness */ #header #nav ul#tabs li.hover {background-position:0% -31px;} #header #nav ul#tabs li.hover a {background-position:100% -31px;} /*********** !end #header **************/ /***************************************** ************ #main styles ************* ******************************************/ /**** GENERAL/ALL PAGES *****/ #main {position:relative;overflow:auto;} #main #content {width:576px;margin-right:20px;float:left;padding-top:40px;} #main #sidebar {width:194px;float:right;padding-top:40px;} #main #content h2, #main #sidebar h2 {font-size:30px;font-weight:bold;margin-bottom:20px;color:#663700;} #main #content h3 {font-size:25px;margin:10px 0;color:#74CBC8;} #main #content h4, #main #sidebar h4 {font-size:18px;margin:10px 0;color:#663700;} #main #sidebar ul {margin-bottom:35px;} #main #sidebar ul li {line-height:18px;margin-bottom:10px;} #main #topquote {font-size:31px;color:#663700;font-weight:bold;padding-top:70px;} /**** HOME PAGE *****/ #home #main #content a, #home #main #content a:active, #home #main #content a:visited {color:#74cbc8;text-decoration:none;} #home #main #content a:hover {text-decoration:underline;} #home #main #content #ourwork {margin-bottom:65px;} #home #main #content #ourwork #work-featured {margin-bottom:40px;overflow:hidden;} #home #main #content #ourwork #work-cases {clear:both;overflow:hidden;} #home #main #content #ourwork #work-cases .case {float:left;margin-right:18px;width:279px;} #home #main #content #ourwork #work-cases .last {margin-right:0;} /* No margin for last case in row. */ #home #main #content #ourwork #work-cases .case img.caseimg {margin-bottom:10px;} /**** CONTENT PAGEs *****/ /* our clients */ #client-list {margin:0 0 80px;width:780px;} #client-list caption {margin:0 0 25px;font-size:30px;} #client-list td {width:33%;height:155px;vertical-align:middle;text-align:center;border-bottom:1px dashed #dfcebd;border-right:1px dashed #dfcebd;} #client-list td.last {border-right:none;} #client-list tr.last td {border-bottom:none;} /* our work */ #ourwork #main #content {float:right;margin-right:0;padding-top:50px;padding-bottom:100px;} #ourwork #main #sidebar {float:left;margin-right:14px;padding-top:0;width:200px;} #ourwork #main #sidebar ul#our-work-list {padding-top:50px;} #ourwork #main #sidebar ul#our-work-list li {margin-bottom:2px;} #ourwork #main #sidebar ul#our-work-list li a {display:block;width:190px;height:26px;line-height:26px;padding-left:10px;color:#663700;} #ourwork #main #sidebar ul#our-work-list li a:hover {background:url(../img2/arrow_over.png) center left no-repeat;} #ourwork #main #sidebar ul#our-work-list li.active a, #ourwork #main #sidebar ul#our-work-list li.active a:hover {background:url(../img2/arrow_on.png) center left no-repeat;} #ourwork #main #content #workdetail img {display:block;padding-bottom:20px;} #ourwork #main #content p {margin-bottom:20px;} /* narrative who */ #narrativewho #main #content {float:right;margin-right:0;padding-top:70px;padding-bottom:100px;} #narrativewho #main #sidebar {float:left;margin-right:14px;padding-top:0;width:200px;} #narrativewho #main #content h4 {margin:15px 0;} #narrativewho #main #content h3#westand {padding-top:40px;} #narrativewho #main #content p {margin-bottom:20px;} #narrativewho #main #sidebar h2 {margin-bottom:0;} #narrativewho #main #sidebar #narrative-provides {background-color:#f3ebe2;padding:17px;margin-top:15px;-moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px;} #narrativewho #main #sidebar #narrative-provides h4 {font-size:15px;} #narrativewho #main #sidebar #narrative-provides ul {margin:0;} #narrativewho #main #sidebar #narrative-provides ul li {font-size:11px;line-height:14px;} /* our team */ #ourteam #topquote {overflow:hidden;} #ourteam #topquote h2 {width:155px;float:left;padding:60px 0;} #ourteam #topquote p {width:575px;float:right;font-size:25px;color:#74cbc8;} #ourteam #content {width:790px;margin-right:0;;} #ourteam #content .team-member {overflow:hidden;margin-bottom:40px;} #ourteam #content .team-member img {float:left;} #ourteam #content .team-member .team-member-bio {float:right;width:575px;} #ourteam #content .team-member-bio h3 {color:#663700;margin:0;} #ourteam #content .team-member-bio h4 {font-size:15px;} #ourteam #content .team-member-bio p {} #ourteam #content .team-member-bio div.more p {margin-top:20px;} #ourteam .team-member-bio a.read, #ourteam .team-member-bio a.read:active, #ourteam .team-member-bio a.read:visited {display:block;color:#74cbc8;text-decoration:none;} #ourteam .team-member-bio a.read:hover {text-decoration:underline;} /*********** !end #main **************/ /***************************************** ************ #footer styles ************* ******************************************/ #footer {background:#421e00 url(../img2/bg-footer.png) top center repeat-x;overflow:hidden;padding:40px 0 100px;} #footer #footerlinks {width:480px;float:left;margin-right:20px;padding-top:10px;} #footer #footerfeeds {font-size:15px;line-height:1.5em;width:230px;float:left;margin-right:20px;} #footer #footerweb {font-size:15px;line-height:1.5em;width:250px;float:left;} #footer #footerlinks a {font-weight:bold;font-size:15px;} #footer #footerfeeds h2, #footer #footerweb h2 {font-size:23px;font-weight:bold;line-height:1.5em;margin-bottom:10px;} #footer #footerfeeds a, #footer #footerweb a {display:block;} #hcard-Amanda-Alvaro {color:#fff;position:relative;letter-spacing:1px;} #contact-main, #contact-main span {color:#74cbc8;font-size:22px;margin:10px 0 30px;} #contact-main span.title {color:#fff;} #hcard-Amanda-Alvaro a {color:#fff;text-decoration:none;} #hcard-Amanda-Alvaro a:hover {text-decoration:underline;color:#fff;} #mighty {text-indent:-1000em;width:66px;height:23px;position:absolute;right:100px;bottom:0;background:url(../img2/mighty-logo.png) left top no-repeat;} #bb {text-indent:-1000em;width:71px;height:47px;position:absolute;right:10px;bottom:-12px;background:url(../img2/bb-logo.png) left top no-repeat;} /*********** !end #footer **************/ /***************************************** ************ #quotes styles ************* ******************************************/ /*#quotes {width:984px;height:60px;position:absolute;left:-105px;top:83px;background:url(../img/quotes.png) left top no-repeat;}*/ #quotes {background:url(../img2/quotes.png) bottom center no-repeat;height:131px;width:100%;position:absolute;top:0px;z-index:-99;} #page #quotes {background:url(../img/page-bg-quote.png) bottom center no-repeat;height:147px;width:100%;position:absolute;top:143px;z-index:-99;} /*********** !end #quotes **************/