/* CSY REDESIGN STYLES Created: November 2008 Author: Amy Osborne ----------------------------------------------------*/ /* RESET TYPOGRAPHY LINKS & NAV LAYOUT */ /* => RESET ----------------------------------------------------*/ /* reset styles based on Eric Meyer's */ html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, p, blockquote, a, abbr, acronym, address, cite, em, img, ins, strong, sub, sup, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; } body { line-height:1; } blockquote, q { quotes:none; } blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; } :focus { outline:0; } /* remember to define focus styles! */ table { border-collapse:collapse; border-spacing:0; } /* tables still need 'cellspacing="0"' in the markup */ html { overflow-y: scroll; } /* forced vertical scrollbar to be always visible -- thereby avoiding the horizontal "jump" when the page has to re-center */ h1 span { display:none; } /* => TYPOGRAPHY ----------------------------------------------------*/ body { text-align:center; } #header, #nav, #navshadow, #content, #footer { text-align:left; } td.main .maincontent h3 { font-size:16px; color:#069; } td.main .maincontent dt { font-weight:bold; } div#tell { font:normal 10px Verdana, Arial, Helvetica, sans-serif; color:#069; } #nav ul { font:normal 15px Arial, Helvetica, sans-serif; color:#d7e43a; list-style:none; text-transform:uppercase; } #nav ul a { text-align:center; } #nav ul a.first { text-align:left; } #nav ul a.on { font-weight:bold; } #navshadow { font-size:1px; line-height:1px; clear:left; } /* to further control the height of the container */ td.sidebar .morelink { text-align:right; font-weight:bold; } #footer { font:normal 10px Verdana, Arial, Helvetica, sans-serif; color:#999; } .attribution { font-weight:bold; font-size:12px; } /* Home page */ #home #content .intro { font:normal 14.5px Georgia, "Times New Roman", Times, serif; color:#666; line-height:1.7em; letter-spacing:0.01em; } #home #content .morelink { font:bold 12px Arial, Helvetica, sans-serif; text-transform:uppercase; list-style:none; letter-spacing:0.02em; } #home td.highlight p { font:normal 18px Georgia, "Times New Roman", Times, serif; color:#069; line-height:1.6em; } #home td.highlight p.attribution { font-size:13px; } #home td.highlight .morelink { font:normal 12px Arial, Helvetica, sans-serif; text-transform:uppercase; margin:15px 0; } #home td.sidebar { font:bold 13px Arial, Helvetica, sans-serif; color:#069; letter-spacing:0.1em; } /* Secondary pages */ td.main { font:normal 14.5px Georgia, "Times New Roman", Times, serif; color:#666; line-height:1.7em; letter-spacing:0.01em; } .subnav ul { list-style:none; font:normal 12px Arial, Helvetica, sans-serif; text-transform:uppercase; } td.sidebar { font:normal 13px Arial, Helvetica, sans-serif; color:#069; } td.sidebar p.testimonial { font:normal 18px Georgia, "Times New Roman", Times, serif; line-height:1.55em; letter-spacing:0.01em; } td.sidebar p.attribution { font:normal 13px Georgia, "Times New Roman", Times, serif; line-height:1.55em; letter-spacing:0.01em; } /* => LINKS & NAV ----------------------------------------------------*/ #content .morelink a { background:url(/images/bg-morearrow.gif) no-repeat right center; padding-right:10px; color:#069; } td.main .maincontent a { color:#069; } td.main .maincontent a:hover { color:#969f00; } td.sidebar a { color:#069; text-decoration:none; } td.sidebar .morelink a { color:#069; text-decoration:underline; } #footer a { color:#999; } div#tell a { color:#069; } /* Main nav */ #nav a { background:url(/images/bg-navlink.png) no-repeat right top; color:#d7e43a; padding:9px 0 12px; display:block; float:left; text-decoration:none; } #nav a.last { background-position:163px top; } #nav a:hover { color:#fff; font-weight:bold; } #nav a.on { color:#fff; font-weight:bold; } /*#nav a.last { background:none; }*/ #nav a.first { padding-left:0; } #nav #link1 { width:140px; } #nav #link2 { width:195px; } #nav #link3 { width:127px; } #nav #link4 { width:134px; } #nav #link5 { width:99px; } #nav #link6 { width:194px; } /* Sub nav */ .subnav ul { margin:0; padding:0; } .subnav ul li { display:inline; margin:0; padding:0; } .subnav a { padding-right:15px; color:#999; text-decoration:none; } .subnav a:hover { color:#069; font-weight:bold; } .subnav .on { color:#069; font-weight:bold; } .subnav .last { padding-right:0; } .bottom { margin-top:20px; } /* Home page */ #home #content .morelink a { background:url(/images/bg-morearrow.gif) no-repeat right center; padding-right:10px; color:#069; } #home td.highlight .morelink a { background:url(/images/bg-morearrow.gif) no-repeat right center; padding-right:10px; color:#069; } /* => LAYOUT ----------------------------------------------------*/ body { margin:0 auto; background-color:#fff; } #header, #nav, #navshadow, #content, #footer { width:1024px; margin:0 auto; clear:left; } #wrapper { background:url(/images/bg-body.png) repeat-y center bottom; } #header { height:140px; background:url(/images/bg-masthead.jpg) no-repeat left bottom; } #header img { margin-top:18px; } div#tell { width:155px; float:right; text-align:right; background:url(/images/bg-tellafriend.gif) no-repeat right top; margin:20px 0 0 0; padding:8px 0 10px 0; } div#tell a { margin-right:12px; } #nav { background:url(/images/bg-navbar.png) repeat-x left top; height:39px; } #nav ul { margin-left:135px; } #nav ul li { display:inline; } #navshadow { background:url(/images/bg-navshadow.png) no-repeat left top; height:15px; } #content { padding-bottom:48px; } #content .morelink li { margin:2px 0 4px 0; } #content .morelink a { background:url(/images/bg-morearrow.gif) no-repeat right center; padding-right:10px; } #content td { vertical-align:top; } td.main { width:830px; } td.main p.contentimage { float:right; margin:0 10px 10px 3px; } td.main p.contentimage img.nosubnav { padding-top:15px; } td.main div { /*margin-left:134px;*/ margin-left:67px; margin-right:15px; } /* 134px left margin was the orginal design; adjusted to half */ td.main div.maincontent h1, td.main div.maincontent h2 { margin:20px 0 25px; } td.main .maincontent h3 { margin-top:15px; } td.main div.maincontent p { margin:3px 0 7px; } td.main div.maincontent p.attribution { margin:-5px 0 14px 0; } td.main div.maincontent ul { margin:0 0 14px 30px; } td.main div.maincontent ul li { margin:3px 0 12px; line-height:1.4em; } td.main div.maincontent ul.toc { list-style:none; margin:0; padding:0; } td.main div.maincontent ul.toc li { background:url(/images/bg-morearrow.gif) no-repeat left 6px; margin:0 0 5px 0; padding:0 0 0 15px; } td.main div.maincontent ul.toc li a { margin:0; padding:0; } td.main .maincontent dt { margin-top:15px; } td.main .maincontent dd { margin-left:35px; } td.sidebar { width:195px; } td.sidebar div { background:url(/images/bg-sidebar.png) repeat-y right top; padding-bottom:28px; } td.sidebar h3 { padding-left:23px; padding-top:10px; } td.sidebar ul { margin:6px 5px 0 20px; padding-left:20px; } td.sidebar ul li { margin:1px 0 3px; } td.sidebar p.testimonial { padding:0 5px 0 13px; width:175px; } td.sidebar p.attribution { padding:10px 5px 0 13px; margin-left:22px; } td.sidebar .morelink { margin:10px 0 0 0; background:url(/images/bg-sidebar-morelink.gif) no-repeat right center; text-transform:uppercase; padding:7px 10px 9px 0; } #footer { padding-bottom:15px; } #footer p { margin-left:134px; } /* Tell a Friend form */ form#email { margin-top:20px; } form#email label { width:130px; text-align:right; padding-right:15px; display:block; float:left; clear:left; } form#email input { vertical-align: middle; width:250px; clear:right; display:block; margin-bottom:18px; } form#email textarea { vertical-align:top; margin-bottom:20px; } form#email input.button { margin-left:145px; clear:both; width:auto; padding:4px 13px 6px; margin-bottom:0; } /* Home page */ #home #navshadow { background:url(/images/home/bg-navshadow.png) no-repeat left top; height:10px; } #home #content .intro { width:830px; padding-top:7px; } #home #content .intro p { margin-left:134px; margin-right:30px; } #home #content .more { margin-left:154px; margin-top:10px; } #home #content .more p { margin-left:0;margin-top:10px; } #home #content .more ul.morelink { } #home #content .more ul.morelink li { margin-bottom:8px; } #home #content .moreright { margin-right:35px; margin-top:5px; float:right; } #home #content td { height:311px; vertical-align:top; } #home td.highlight { width:829px; background:url(/images/home/bg-homemain.jpg) no-repeat left top; } #home td.highlight h1, #home td.highlight h2 { margin-top:25px; } #home td.highlight p { width:235px; margin-top:15px; } #home td.highlight .attribution { margin-top:4px; } #home td.highlight .morelink { margin:12px 0 23px; } #home td.highlight h1, #home td.highlight h2, #home td.highlight p, #home td.highlight .morelink { margin-left:15px; } #home td.sidebar { width:195px; background:url(/images/bg-sidebar2.png) repeat-y left top; } #home td.sidebar div { height:296px; background:url(/images/home/bg-sidebar.png) repeat-y left top; padding-bottom:0; } #home td.sidebar h3 { padding-left:23px; padding-top:8px; } #home td.sidebar ul { margin:5px 5px 0 20px; padding-left:20px; font-size:.9em; } #home td.sidebar ul li { margin:2px 0 4px; } #home td.sidebar .sub { padding-top:18px; margin-top:15px; background:url(/images/home/bg-sidebar-sub.png) no-repeat left top; } #home td.sidebar ul.nonlist { list-style:none; margin-top:2px; margin-left:10px; padding-left:15px; font-size:.9em; }