/* ========================================================================== STYLE.CSS | CSS FRAMEWORK -------------------------- Main Project specific styles - Wings over whales - author: Jason Carr [jason@fueldesign.co.nz] version: - March 07 - 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"); @import url("thickbox.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: Arial, Helvetica, Verdana, Geneva, sans-serif; color: #000; line-height: 1.5em; } body { font-size: 62.5%; } div#container { font-size: 1.1em;} p, ul, dl, ol, form, blockquote, table { margin-bottom: 10px; } h1 { font-size: 1.3em; margin-bottom: 8px; color: #000000; } h2 { font-size: 1.2em; margin-bottom: 8px; color: #cc0000; font-style: italic; font-weight: normal; text-transform: uppercase; border-bottom: 1px solid #DDD; } h3, .faq dt { font-size: 1.1em; margin-bottom: 8px; color: #f60; font-weight: normal; } h4 { font-size: 1.1em; margin-bottom: 5px; } h5 { font-size: 1.1em; margin-bottom: 5px; } /* ========================================================================== 2 - Global Styles for types ========================================================================== */ /* links */ a:link, a:visited { border-bottom: 1px dotted #999; color: #999999; } a:hover { color: #cc0000; border-bottom: 1px solid #cc0000; } a:link.external, a:visited.external { background: transparent url(../images/bg/external.gif) top right no-repeat; padding-right: 12px;} /* list types */ dl dt { font-weight: bold; } ol li { list-style-type: lower-alpha; list-style-position: inside; } /* blockquotes */ blockquote { background-color: #f2faff; margin-bottom: 1em; padding: 5px; text-align: center; } blockquote p { color: #09F; margin: 5px 5px 5px 15px; font-weight: bold; } blockquote cite { font-style: normal; color: #CCC; font-weight: bold; } /* strong */ strong.error, h3.note { color: #F00; text-transform: uppercase; } /* em */ em.required { color: #F00; font-weight: bold; font-style: normal; } .current a { cursor: deafault; } table { width: 100%; background: #666666; } th { background: #666; color: #FFF; padding: 3px 5px; border: 1px solid #CCC;} tr.orange th { color: #cc0000; } td { padding: 3px 5px; border: 1px solid #CCC; } td.col2 { background: #c6e1ff; width: 200px; } td.col3 { background: #ffc6e6; width: 200px; } #centerCol img { margin-bottom: 10px; } p em { color: #cc0000; } #centerCol img.inline { display: inline; margin-right: 10px; margin-bottom: 10px; float: left; } /* ========================================================================== 3 - Main Structural Divs ========================================================================== */ html, body { height: 100%; } body { background: #FFF url(../i/bg/bg.gif) top left repeat-x; text-align: center; } div#container { width: 800px; margin-left: auto; margin-right: auto; text-align: left; padding-top: 8px; } #wrapper { background: #FFF url(../images/bg/wrapper_bg.gif) 152px 0 repeat-y; } #header { background: #FFF url(../images/bg/header_bg.gif) 0 0 repeat-y; margin-bottom: 8px; width: 800px; height: 115px; position: relative; } #banner { background: #FFF url(../images/bg/banner_bg.jpg) 0 0 no-repeat; width: 800px; height: 183px; position: relative; margin-bottom: 3px; } #leftCol { width: 143px; float: left; } #centerCol { background: transparent url(../images/bg/mainColTopBackground.jpg) top center no-repeat; width: 495px; float: left; margin-left: 9px; } #rightCol { width: 143px; float: right; margin-left: 9px; } .lining { padding: 10px; } #centerCol .lining { background: url(../images/bg/bottomMainColumn.jpg) bottom center no-repeat; min-height: 600px; } /* ========================================================================== 4 - Header styles ========================================================================== */ #flash { position: absolute; left: 9px; top: 9px; } #bannerTitle { position: absolute; left: 520px; top: 70px; } #logo { position: absolute; left: 10px; top: 5px; } /* ========================================================================== 5 - left column styles ========================================================================== */ div#nav { background: #999999 url(../images/bg/columnTop.gif) no-repeat top; padding-top: 16px; } #nav ul { background: url(../images/bg/nav-bg.gif) no-repeat bottom; padding-bottom: 21px; } #nav li { text-align: right; font-weight: bold; background: #999999; border-bottom: 1px solid #FFFFFF; } #nav a { color: #FFFFFF; display: block; padding-right: 10px; line-height: 160%; height: 160%; border-bottom: none; } #nav a:hover, #nav li.current a { color: #ffffff; background: #cc0000; } .badge { padding-top: 0px; padding-right: 0px; padding-bottom: 8px; padding-left: 0px; margin-bottom: 5px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #999999; } /* ========================================================================== 6 - center column styles ========================================================================== */ ul#gallery li { display: block; margin: 5px; width: 120px height: 120px; float: left; } #gallery img { margin: 0; } #gallery a { border: 3px solid #DDD; display: block; width: 120px height: 120px; } ul#gallery a:hover { border: 3px solid #F60; } div#success { background: #e3fce5; border: 3px solid #9ae49e; padding: 10px; } #success h2, #success p { color: #28a82e; } #success h2 { border-bottom: 1px dotted #28a82e; } div#error { background: #fed3d6; border: 3px solid #fc9ca3; padding: 10px; } #error h2, #error p { color: #e3535d; } #error h2 { border-bottom: 1px dotted #e3535d; } .faq dd { margin-bottom: 10px; } a.clickThru { display: block; text-align: right; margin-bottom: 10px; } .clickThru img { display: inline; } a.clickThru { border: none; } div.promo { width: 222px; float: left; margin-right: 20px; margin-bottom: 10px; } a.more { font-weight: bold; display: block; width: 219px; height: 19px; line-height: 19px; border: none; color: #FFF; text-transform: uppercase; padding-right: 10px; text-align: right; background: transparent url(../images/bg/more.gif) top left no-repeat; } .promo h3 { color: #000; text-transform: uppercase; } /* ========================================================================== 7 - right column styles ========================================================================== */ div.sidebarBox { background: #999999 url(../images/bg/colBackTopRight.gif) no-repeat center top; margin-bottom: 10px; } .sidebarBox .lining { background: transparent url(../images/bg/columnBottomRight.jpg) bottom center no-repeat; } .sidebarBox p, .sidebarBox li, .sidebarBox a, .sidebarBox h4, .sidebarBox h3 { color: #FFF; } .sidebarBox img { display: block; margin: 0 auto; margin-bottom: 10px; } .sidebarBox h4 { font-size: 100%; } .sidebarBox em, .sidebarBox em a { font-style: normal; color: #f37221; } a#webmasters { display: block; text-align: right; color: #CCC; font-size: 10px; border: none; } #webmasters img { display: inline; } #rightCol li { color: #FFFFFF; } /* ========================================================================== 8 - Page specific styles ========================================================================== */ ul#sitemap { }