/** File: layout.css Validates: CSS Level 2.1 Project: Clearview Author: Kristina Floyd Date Created: 2008 11 03 About: Contains styles for the main layout and framework of the site Elements index: html body ID index: #header #footer #mainMenu #subMenu Class index: .access Notes: Place second in the cascade. Seperate styling blocks with 6 carriage returns. Indent child blocks by one extra tabs each time to give a visual representation of the cascade and specificity. Wrap styling block with a comment in the following format: START/END plus the selector, id, class or combination of. Cascade index: 01 undo.css - Resets browser default styles 02 layout.css - Styles for the main layout and framework of the site 03 content.css - Styles for general content 04 elements.css - Styles for specific page elements 05 ie6.css - IE6 specific styles. 06 ie7.css - IE7 specific styles. 07 clearing.css - Enables the use of .clearfix across the site. 08 main.css - Continuity generated stylesheet 09 print.css - Print specific styles */ /* START html */ /* this ensures FF always has a scrollbar */ html { margin-bottom: 0.1em; height: 100%; } /* END html */ /* START body */ body { background: #D6EDF8 url(/template-images/clearview/layout/sideGradients.gif) repeat-y top center; color: #4F4C4D; font-family: Arial, Helvetica, sans-serif; font-size: 1em; } /* END body */ /* START ACCESSIBILITY */ .access { position: absolute; left: -1000px; width: 100px; top: 0; } /* END ACCESSIBILITY */ /* START #wrapper */ #wrapper { background: #FFFFFF; font-size: 0.6875em; margin: 0 auto; text-align: left; padding: 1px; width: 730px; } /* END #wrapper */ /* START #header */ #header { background: #E5EBF2 url(/template-images/clearview/layout/header/bg.gif) repeat-x top left; min-height: 110px; } #header img { display: inline; padding-bottom: 0; vertical-align: top; } #header div { display: inline; } #astucia { float: left; } #memberOf { } #clearview { } /* END #header */ /* START #primaryNav */ #primaryNav { background: #01387B url(/template-images/clearview/layout/primaryNav/bg.jpg) repeat-x top left; border-bottom: 1px solid #FFFFFF; padding: 0 12px; position: relative; } #primaryNav ol { background: transparent url(/template-images/clearview/layout/primaryNav/divider.jpg) no-repeat top right; margin: 0; padding: 0 5px 0 0; } #primaryNav li { background: transparent url(/template-images/clearview/layout/primaryNav/divider.jpg) no-repeat top left; display: block; float: left; margin: 0; padding: 0 0 0 2px; text-align: center; } #primaryNav a { color: #FFFFFF; display: block; padding: 10px 5px 8px 5px; text-align: center; text-decoration: none; } #primaryNav a:hover, #primaryNav .selected a { background: #062B57 url(/template-images/clearview/layout/primaryNav/selectedRepeater.jpg) repeat-x top left; } #pNtopLeftCorner { background: transparent url(/template-images/clearview/layout/primaryNav/corner/topLeft.jpg) no-repeat top left; height: 11px; left: 0; position: absolute; top: 0; width: 9px; } #pNtopRightCorner { background: transparent url(/template-images/clearview/layout/primaryNav/corner/topRight.jpg) no-repeat top left; height: 10px; position: absolute; right: 0; top: 0; width: 9px; } /* END #primaryNav */ /* START #secondaryNav */ #secondaryNav { background: transparent url(/template-images/clearview/layout/secondaryNav/border.jpg) no-repeat bottom right; padding: 0; position: relative; } #secondaryNav ol { margin: 0; padding: 0 5px 0 0; } #secondaryNav li { background: #D8D8D8 url(/template-images/clearview/layout/secondaryNav/bg.jpg) no-repeat top left; display: block; float: left; margin: 0 2px 0 0; padding: 0; text-align: center; } #secondaryNav a { background: transparent url(/template-images/clearview/layout/secondaryNav/corner.gif) no-repeat top right; border-bottom: 1px solid #0093D0; color: #013A81; display: block; font-size: 1em; margin: 0; padding: 7px 10px 5px 10px; text-align: center; text-decoration: none; } #secondaryNav .selected { background: #F2F1F1 url(/template-images/clearview/layout/secondaryNav/bgSelected.gif) no-repeat top left; } #secondaryNav .selected a { border-bottom: 1px solid #F2F1F1; } /* END #secondaryNav */ /* START #siteSearch */ #siteSearch { background: #E5EBF2 url(/template-images/clearview/layout/supportingNav/bg.gif) repeat-x top left; } #siteSearch form { float: right; margin: 1px 9px 5px 20px; padding-top: 4px; } #siteSearch label { display: none; } #siteSearch input { margin-right: 6px; } #siteSearch .submit { float: none; } /* END #siteSearch */ /* START #wrapper.defaultTemplate - two column layout */ #wrapper.defaultTemplate #contentArea { background: transparent url(/template-images/clearview/layout/contentArea/bg.jpg) repeat-x top left; min-height: 554px; padding: 19px 11px 12px 11px; } #wrapper.defaultTemplate #twoColumnLayout { background: #FFFFFF url(/template-images/clearview/layout/contentArea/noTabs/bg/repeater.gif) repeat-y top left; min-height: 464px; padding: 19px 10px 15px 10px; position: relative; } #wrapper.defaultTemplate #topCorners { background: transparent url(/template-images/clearview/layout/contentArea/noTabs/bg/top.jpg) no-repeat top left; top: 0; height: 52px; left: 0; position: absolute; width: 708px; } #wrapper.defaultTemplate #bottomCorners { background: transparent url(/template-images/clearview/layout/contentArea/noTabs/bg/bottom.gif) no-repeat bottom left; bottom: 0; height: 9px; left: 0; position: absolute; width: 708px; } #wrapper.defaultTemplate #container { float: left; margin-right: -190px; position: relative; width: 100%; } #wrapper.defaultTemplate #mainWrapper { margin-right: 190px; } #wrapper.defaultTemplate #mainContent { padding-right: 14px; } #wrapper.defaultTemplate #mainContentBody { padding-top: 13px; position: relative; } #wrapper.defaultTemplate #subContent { float: right; position: relative; width: 190px; } /* END #wrapper.defaultTemplate */ /* START #wrapper.defaultTabsTemplate - two column layout */ #wrapper.defaultTabsTemplate #contentArea { background: transparent url(/template-images/clearview/layout/contentArea/bg.jpg) repeat-x top left; min-height: 554px; padding: 19px 11px 12px 11px; } #wrapper.defaultTabsTemplate #twoColumnLayout { background: #FFFFFF url(/template-images/clearview/layout/contentArea/tabs/bg/repeater.gif) repeat-y top left; min-height: 464px; padding: 19px 10px 15px 10px; position: relative; } #wrapper.defaultTabsTemplate #topCorners { background: transparent url(/template-images/clearview/layout/contentArea/tabs/bg/top.jpg) no-repeat top left; top: 0; height: 52px; left: 0; position: absolute; width: 708px; } #wrapper.defaultTabsTemplate #bottomCorners { background: transparent url(/template-images/clearview/layout/contentArea/tabs/bg/bottom.gif) no-repeat bottom left; bottom: 0; height: 9px; left: 0; position: absolute; width: 708px; } #wrapper.defaultTabsTemplate #container { float: left; margin-right: -190px; position: relative; width: 100%; } #wrapper.defaultTabsTemplate #mainWrapper { margin-right: 190px; } #wrapper.defaultTabsTemplate #mainContent { padding-right: 14px; } #wrapper.defaultTabsTemplate #mainContentBody { padding-top: 13px; } #wrapper.defaultTabsTemplate #subContent { float: right; position: relative; width: 190px; } /* END #wrapper.defaultTabsTemplate */ /* START #wrapper.fullWidthTabsTemplate */ #wrapper.fullWidthTabsTemplate #contentArea { background: transparent url(/template-images/clearview/layout/contentArea/bg.jpg) repeat-x top left; min-height: 554px; padding: 19px 11px 12px 11px; } #wrapper.fullWidthTabsTemplate #fullWidthLayout { background: #FFFFFF url(/template-images/clearview/layout/contentArea/tabs/bg/repeater.gif) repeat-y top left; min-height: 464px; padding: 19px 10px 15px 10px; position: relative; } #wrapper.fullWidthTabsTemplate #topCorners { background: transparent url(/template-images/clearview/layout/contentArea/tabs/bg/top.jpg) no-repeat top left; top: 0; height: 52px; left: 0; position: absolute; width: 708px; } #wrapper.fullWidthTabsTemplate #bottomCorners { background: transparent url(/template-images/clearview/layout/contentArea/tabs/bg/bottom.gif) no-repeat bottom left; bottom: 0; height: 9px; left: 0; position: absolute; width: 708px; } #wrapper.fullWidthTabsTemplate #mainContentBody { position: relative; } /* END #wrapper.fullWidthTabsTemplate */ /* START #wrapper.fullwidthTemplate */ #wrapper.fullwidthTemplate #contentArea { background: transparent url(/template-images/clearview/layout/contentArea/bg.jpg) repeat-x top left; min-height: 554px; padding: 19px 11px 12px 11px; } #wrapper.fullwidthTemplate #fullWidthLayout { background: #FFFFFF url(/template-images/clearview/layout/contentArea/noTabs/bg/repeater.gif) repeat-y top left; min-height: 464px; padding: 19px 10px 15px 10px; position: relative; } #wrapper.fullwidthTemplate #topCorners { background: transparent url(/template-images/clearview/layout/contentArea/noTabs/bg/top.jpg) no-repeat top left; top: 0; height: 52px; left: 0; position: absolute; width: 708px; } #wrapper.fullwidthTemplate #bottomCorners { background: transparent url(/template-images/clearview/layout/contentArea/noTabs/bg/bottom.gif) no-repeat bottom left; bottom: 0; height: 9px; left: 0; position: absolute; width: 708px; } #wrapper.fullwidthTemplate #container { position: relative; } /* END #wrapper.fullwidthTemplate */ /* START #wrapper.landingTemplate */ #wrapper.landingTemplate #contentArea { background: transparent url(/template-images/clearview/layout/contentArea/bg.jpg) repeat-x top left; min-height: 554px; padding: 19px 11px 12px 11px; } #wrapper.landingTemplate #landingLayout { background: #FFFFFF url(/template-images/clearview/layout/contentArea/noTabs/bg/repeater.gif) repeat-y top left; min-height: 464px; padding: 19px 10px 15px 10px; position: relative; } #wrapper.landingTemplate #topCorners { background: transparent url(/template-images/clearview/layout/contentArea/noTabs/bg/top.jpg) no-repeat top left; top: 0; height: 52px; left: 0; position: absolute; width: 708px; } #wrapper.landingTemplate #bottomCorners { background: transparent url(/template-images/clearview/layout/contentArea/noTabs/bg/bottom.gif) no-repeat bottom left; bottom: 0; height: 9px; left: 0; position: absolute; width: 708px; } #wrapper.landingTemplate #container { float: left; position: relative; width: 100%; } /* END #wrapper.landingTemplate */ /* START #wrapper.landingTabsTemplate */ #wrapper.landingTabsTemplate #contentArea { background: transparent url(/template-images/clearview/layout/contentArea/bg.jpg) repeat-x top left; min-height: 554px; padding: 19px 11px 12px 11px; } #wrapper.landingTabsTemplate #landingLayout { background: #FFFFFF url(/template-images/clearview/layout/contentArea/tabs/bg/repeater.gif) repeat-y top left; min-height: 464px; padding: 19px 10px 15px 10px; position: relative; } #wrapper.landingTabsTemplate #topCorners { background: transparent url(/template-images/clearview/layout/contentArea/tabs/bg/top.jpg) no-repeat top left; top: 0; height: 52px; left: 0; position: absolute; width: 708px; } #wrapper.landingTabsTemplate #bottomCorners { background: transparent url(/template-images/clearview/layout/contentArea/tabs/bg/bottom.gif) no-repeat bottom left; bottom: 0; height: 9px; left: 0; position: absolute; width: 708px; } #wrapper.landingTabsTemplate #container { float: left; margin-right: -319px; position: relative; width: 100%; } #wrapper.landingTabsTemplate #mainWrapper { margin-right: 319px; } #wrapper.landingTabsTemplate #mainContent { padding-right: 14px; } #wrapper.landingTabsTemplate #subContent { float: right; position: relative; width: 319px; } /* END #wrapper.landingTabsTemplate */ /* START #wrapper.homeTemplate */ #wrapper.homeTemplate #contentArea { min-height: 400px; padding: 5px 11px 12px 11px; } #wrapper.homeTemplate #twoColumnLayout { min-height: 400px; position: relative; } #wrapper.homeTemplate #container { float: left; margin-right: -190px; position: relative; width: 100%; } #wrapper.homeTemplate #mainWrapper { margin-right: 190px; } #wrapper.homeTemplate #mainContent { padding-right: 14px; } #wrapper.homeTemplate #subContent { float: right; position: relative; width: 190px; } /* END #wrapper.homeTemplate * /* START #footer */ #footer { background: #094085 url(/template-images/clearview/layout/footer/bg.gif) repeat-x top left; border: 1px solid #094085; } #footer ol { float: right; margin: 0; padding: 0; } #footer li { display: block; float: left; margin: 0; padding: 4px 0; } #footer a { background: transparent url(/template-images/clearview/layout/supportingNav/divider.gif) no-repeat top right; color: #FFFFFF; padding: 4px 6px; text-decoration: none; } #footer .last a { background: transparent; } #footer a:hover { text-decoration: underline; } /* END #footer */