/* ========================================================================== STYLE.CSS | CSS FRAMEWORK -------------------------- Main Project specific styles - INTERSECT - author: Richard Morris [richard@fueldesign.co.nz] version: - 17 October 2006 - Contents: -------------------------- 1 - Default Typography Sizing, Colours and Margins 2 - Global Stlyes for types 3 - Main Structural Divs 4 - Header styles 5 - Main body Styles 6 - Footer Styles 7 - Page Specific sty;es ========================================================================== */ @import url("base.css"); @import url("sifr.css"); /*@import url("forms.css");*/ /* ========================================================================== 1 - Default Typography Sizing, Colours and Margins ========================================================================== */ html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address, abbr, input, select, textarea, table, td, th, a:link, a:visited { /* For Nescape 4.0 and other inheritance intolerant browsers */ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #666; line-height: 1.6em; } body { font-size: 62.5%; } div#container { font-size: 1.1em;} p, ul, dl, ol, form, blockquote { margin-bottom: 0.5em; } h1 { font-size: 2em; margin-bottom: 0; color: #900; } h2 { font-size: 1.5em; margin-bottom: 3px; } h3 { font-size: 1.4em; margin-bottom: 0.2em; } h4 { font-size: 1.0em; margin-bottom: 0.2em; } h5 { font-size: 1.0em; margin-bottom: 0.2em; } h1, h2, h2.boxHeader { font-family: "myriad pro", "myriad", trebuchet MS, sans-serif; font-weight: normal; } /* ========================================================================== 2 - Global Styles for types ========================================================================== */ /* links */ a:link, a:visited { border-bottom: 1px dotted #999; } #primaryContent a:hover, #primaryContent a:active { border-bottom: 1px solid #900; color: #900; } a:link.external, a:visited.external { background: transparent url(../images/bg/external.gif) top right no-repeat; padding-right: 12px;} a:link.mail, a:visited.mail { background: transparent url(../images/bg/email.gif) top right no-repeat; padding-right: 14px;} a:hover.mail, a:hover.external { background-position: right -30px; } /* list types */ ul.bulleted li { list-style-type: disc; margin-bottom: 5px; color: #900; margin-left: 20px; } dl dt { font-weight: bold; } ol li { list-style-type: lower-alpha; list-style-position: inside; } /* blockquotes */ blockquote { background-color: #F8F8F8; margin-bottom: 1em; border-left: 7px solid #CCC; } blockquote p { padding: 5px; margin-left: 5px; } blockquote cite { font-style: normal; } /* strong */ strong.error { color: #F00; } /* em */ em.required { color: #F00; font-weight: bold; font-style: normal; } p.leadin { font-weight: bold; } img.icon { margin: 5px; } /* ========================================================================== 3 - Main Structural Divs ========================================================================== */ html, body { height: 100%; } body { text-align: center; background: #E6E6E6 url(../images/bg/bg.gif) top center repeat-y; } div#container { width: 801px; margin-left: auto; margin-right: auto; text-align: left; margin-top: 2px; } div#header { text-align: left; margin-top: 2px; margin-bottom: 5px; height: 136px; width: 812px; position: relative; margin-left: auto; margin-right: auto; background: transparent url(../images/bg/d_shadow_top.gif) top left repeat-x; } div#primaryContent { float: right; width: 580px; } div#sidebar { margin-right: 590px; width: 205px; } div#footer { clear: both; background: transparent url(../images/bg/footer_bg.gif) top left no-repeat; position: relative; width: 100%; height: 31px; } /* ========================================================================== 4 - Header styles ========================================================================== */ a#logo img { background: none; position: absolute; left: 5px; top: 12px;} div#nav { background: transparent url(../images/bg/nav_bg.gif) top left no-repeat; width: 801px; margin: 0 auto; position: absolute; bottom: 4px; left: 3px; height: 109px; top: 84px; } div#nav ul { line-height: 31px; height: 31px; width: 100%; padding-left: 10px;} div#nav ul ul { padding: 0; } div#nav ul.wideDD { width: 210px; } div#nav ul.thinDD { width: 130px; } #nav li { float: left; background: transparent url(../images/bg/nav_li_bg.gif) top right no-repeat; line-height: 31px; height: 31px; padding-right: 2px; } #nav ul ul li { float: none; background: transparent url(../images/bg/dropdown_bg.png) top left repeat; line-height: auto; height: auto; padding: 0; border-left: 2px solid #DDD; border-right: 2px solid #DDD; } #nav ul a { display: block; float: left; color: #FFF; font-weight: bold; border: none; padding: 0 10px; font-size: 11px; height: 31px; line-height: 31px; } #nav ul ul a { float: none; color: #666; font-weight: normal; margin-bottom: 1px; border-bottom: 1px solid #DDD; border-top: 1px solid #FFF; } #nav ul ul li.bottom a { border-bottom: 2px solid #DDD; } #nav ul ul a:hover, #nav ul ul li.bottom a:hover, #nav ul li.current ul a:hover { background-color: #E1E0E0; } #nav ul li.current a { background-color: #C00; } #nav ul li.current ul a { background-color: transparent; } #nav ul ul li.current a { background-color: #E1E0E0; } /* ========================================================================== 5 - Main content styles ========================================================================== */ /* primary content */ #primaryContent img { margin-bottom: 1em; } #primaryContent div.section { background-color: #F8F8F8; border: 2px solid #ECECEC; margin-bottom: 10px; } #primaryContent div.section .wrap { margin: 5px; } #primaryContent div.section h2.boxHeader { background: transparent url(../images/bg/underline.gif) bottom left repeat-x; } div.section p { margin-left: 75px; } div.section p a:link, div.section p a:visited { border: none; } div.section a:link.learnMore, div.section a:visited.learnMore { display:block; float: right; background: #F8F8F8 url(../images/bg/learn_more.gif) top right no-repeat; width: 83px; height: 15px; margin-bottom:5px; } div.section a:link.contactUs, div.section a:visited.contactUs { display:block; float: right; background: #F8F8F8 url(../images/bg/contact.gif) top right no-repeat; width: 85px; height: 15px; margin-bottom:5px; } #primaryContent div.section p a:hover { border: none; } h2.boxHeader { background: transparent url(../images/bg/underline.gif) bottom left repeat-x; } h2.boxHeader a:link, h2.boxHeader a:visited, h2.boxHeader a:hover { border: none; display: block; } div#breadCrumb { margin-bottom: 10px; } /* sidebar */ #sidebar div.box { background: #F5F5F5 url(../images/bg/box_bg.gif) bottom left repeat-x; padding-bottom: 10px; margin-bottom: 10px; } #sidebar .box div.wrap { margin: 0 5px; padding-top: 5px;} #sidebar h3 { background: #CCC url(../images/bg/box_h3_bg.gif) top left repeat-x; line-height: 26px; height: 26px; color: #FFF; margin-bottom: 0; font-size: 1em; padding-left: 5px; } #sidebar ul li { background: transparent url(../images/bg/underline.gif) bottom left repeat-x; } #sidebar ul a:link, #sidebar ul a:visited { display: block; border: none; background: transparent url(../images/bg/article.gif) top left no-repeat; padding-left: 15px; line-height: 2.2em;} #sidebar ul li a:hover { background-color: #E1E0E0; } #sidebar ul li.current a:link, #sidebar ul li.current a:visited { background-position: 0 -30px; color: #900; cursor: default; background-color: transparent; } img.icon { float: left; margin-right: 10px; margin-bottom: 10px; display: inline;} ul#services li { clear: left; background: transparent url(../images/bg/underline.gif) bottom left repeat-x; padding-bottom: 10px; } ul#services p { font-size: 10px; } ul#services h4 { background: none; } ul#services a:link.learnMore, ul#services a:visited.learnMore { display: block; height: 5px; width: 43px; background: transparent url(../images/bg/learn_more2.gif) top left no-repeat; margin-top: 10px; margin-left: 130px;} ul#services a:hover.learnMore { background-position: -58px 0; } /* ========================================================================== 6 - Footer styles ========================================================================== */ div#footer {text-align:center;font-size:0.8em;padding:5px 0; } div#footer a,div#footer a:visited,div#footer a:link { text-decoration:none; color:#666 } div#footer a:active, div#footer a:hover {color:#666;} /* ========================================================================== 7 - Page specific styles ========================================================================== */ /* sitemap */ ul#sitemap { }