/** File: content.css Validates: CSS Level 2.1 Project: [Worktown Future Energy] Author: [Tony Feltham - Gabude Limited (www.gabude.com)] Date Created: [2009-05-27] About: Contains styles for general content Notes: File content: #mainContent 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 */ #mainContent p { margin-bottom: 1em; padding-left: 1px;} #mainContent img { display: block; } #mainContent a img { border: solid 0px #ffffff; } #mainContent a:visited img { border: solid 0px #ffffff; } #mainContent a:active img { border: solid 0px #ffffff; } #mainContent em { font-style: italic; } #mainContent strong { font-weight: bold; } #mainContent blockquote { } #mainContent hr { } /* START Hx */ #mainContent h1 { font-size: 1.916em; margin-bottom: 0.67em; } #mainContent h2 { clear: both; display: block; font-size: 2em; font-weight: 600; margin: 0.33em 0; overflow: hidden; padding-bottom: 22px; atext-indent: -9999px; } #mainContent h3 { clear: both; display: block; font-size: 1.333em; font-weight: 600; margin: 0.33em 0; overflow: hidden; padding-bottom: 5px; padding-top: 10px; atext-indent: -9999px; } #mainContent h4 { font-size: 1.166em; margin: 1.33em 0; } #mainContent h5 { font-size: 1.083em; margin: 1.33em 0; } #mainContent h6 { font-size: 1em; margin: 1.66em 0; } /* END Hx */ /* START A */ #mainContent a { color: #4f595d; font-weight: 600; text-decoration: underline; } #mainContent a:hover { color: #01b5cc; font-weight: 600; text-decoration: underline; } /* END A */ /* START list */ #mainContent ul { list-style: disc; list-style-position: outside; margin: 1em; padding: 0 1em; } #mainContent ol { list-style: decimal; list-style-position: outside; margin: 1em; padding: 0 1em; } #mainContent li { } #mainContent dl { } #mainContent dt { font-weight: bold; line-height: 1.5em; } #mainContent dd { line-height: 1.5em; margin-left: 1em; } /* END list */ /* START table */ #mainContent table { display: table; width: 100%; } table { font-size: 100%; } #mainContent caption { font-weight: bold; padding: 1em 0; } #mainContent thead { display: table-header-group; vertical-align: middle; } #mainContent tr { } #mainContent th { font-weight: bold; padding: 3px 5px; vertical-align: top; } #mainContent td { padding: 3px 5px; vertical-align: top; } #mainContent td.blankTD { height: 1.5em; } #mainContent tbody { display: table-row-group; vertical-align: middle; } #mainContent tfoot { display: table-footer-group; vertical-align: middle; } /* END table */ /* START form */ #mainContent form { padding: 10px 0; } #mainContent fieldset { background: #F7F7F7 url(/futureenergy/images/layout/horizontaldots.gif) repeat-x left top; border: none; padding: 10px; } #mainContent fieldset fieldset { background: transparent; border: none; } #mainContent legend { } #mainContent form div { clear: both; margin: 0.5em 25px; position: relative; } #mainContent form div div { display: block; margin: 0; } #mainContent label { display: block; float: left; margin: 0 0.5em; width: 200px; } #mainContent label.hidden { display: none; } #mainContent input, #mainContent select, #mainContent textarea { font-family: Arial, Helvetica, sans-serif; } #mainContent .form_edit { } #mainContent .form_edit input { width: 20em; } #mainContent .form_telephone { margin-bottom: 0.5em; } #mainContent .form_telephone div { clear: none; display: inline; } #mainContent .form_date { margin-bottom: 0.5em; } #mainContent .form_date div { clear: none; display: inline; } #mainContent .form_checkbox { } #mainContent .form_checkbox input { margin-right: 1em; } #mainContent .form_checkbox label { display: inline; float: none; } #mainContent .form_radio { } #mainContent .form_radio input { margin-right: 1em; } #mainContent .form_radio .form_radio_label { clear: none; display: block; float: left; font-weight: bold; margin: 0 0.5em; width: 200px; } #mainContent .form_radio .form_radio_items input { border: none; } #mainContent .form_radio .form_radio_items { clear: none; } #mainContent .form_radio .form_radio_items .form_radio_item { clear: none; float: left; } #mainContent .form_radio .form_radio_items .form_radio_item label { display: inline; float: none; font-weight: bold; margin-right: 1em; vertical-align: top; } /* data protection */ #mainContent .form_dp { font-size: 0.916em; } #mainContent .form_dp input { margin-left: 1em; } #mainContent .form_dp label { width: auto; } #mainContent .form_select { } #mainContent .form_select div { position: relative; } #mainContent .form_select select { min-width: 15em; } #mainContent .form_memo { } #mainContent .form_memo label { float: none; width: auto; } #mainContent .form_memo textarea { height: 140px; width: 100%; } #mainContent .form_multiedit_container { clear: none; margin-left: 290px; width: 15em; } #mainContent .form_multiedit input { margin-right: 20px; width: 30px; } #mainContent #div_sortcode { margin-bottom: 20px; } #mainContent #div_sortcode .form_multiedit_container { float: left; margin-left: 0; width: 160px; } #mainContent .fm-req { } #mainContent .fm-req label { font-weight: bold; } #mainContent .mandatoryindicator { float: left; line-height: 1em; } #mainContent .notman { float: left; height: 1px; line-height: 1em; width: 0.416em; } #mainContent .validationerror { color: #FF0000; font-weight: bold; margin: 5px 0 5px 210px; } #mainContent .form_buttonbar { } #mainContent .form_button { } #mainContent .submit { display: block; float: right; } button, input.submit { cursor: pointer; } #mainContent .submit input, #mainContent input.submit, #mainContent .form_button button { border: none; cursor: pointer; font-weight: bold; min-height: 9px; padding: 10px 22px 13px 12px; } #mainContent .submit input:hover, #mainContent input.submit:hover, #mainContent .form_button button:hover { text-decoration: underline; } #mainContent .form_button button.disabledSubmit { border: none; color: #777777; cursor: default; font-weight: bold; min-height: 9px; padding: 10px 22px 13px 12px; } #mainContent .buttonStart { display: inline; padding: 10px 22px 13px 10px; } #mainContent .page_library { margin: 0; } #mainContent p.productTitle { font-weight: 600; margin-bottom:0px;} #mainContent h2.companyHistory{ background: url(/futureenergy/images/titles/h2-companyhistory.gif) no-repeat; text-indent: -9999px; } #mainContent h2.meetTheTeam{ background: url(/futureenergy/images/titles/h2-meettheteam.gif) no-repeat; text-indent: -9999px; } #mainContent h2.whatWeDo{ background: url(/futureenergy/images/titles/h2-whatwedo.gif) no-repeat; text-indent: -9999px; } #mainContent h2.aboutBatteryGurus{ background: url(/futureenergy/images/titles/h2-aboutbatterygurus.gif) no-repeat; text-indent: -9999px; } #mainContent h2.batteryGurusProducts{ background: url(/futureenergy/images/titles/h2-batterygurusproducts.gif) no-repeat; text-indent: -9999px; } #mainContent h2.batteryGurusDistributionNetwork{ background: url(/futureenergy/images/titles/h2-batterygurusdistribution.gif) no-repeat; text-indent: -9999px; } #mainContent h2.contactBatteryGurus{ background: url(/futureenergy/images/titles/h2-contactbatterygurus.gif) no-repeat; text-indent: -9999px; } #mainContent h2.contactCellstrom{ background: url(/futureenergy/images/titles/h2-contactcellstrom.gif) no-repeat; text-indent: -9999px; } #mainContent h2.aboutCellstrom{ background: url(/futureenergy/images/titles/h2-aboutcellstrom.gif) no-repeat; text-indent: -9999px; } #mainContent h2.cellstromProducts{ background: url(/futureenergy/images/titles/h2-cellstromproducts.gif) no-repeat; text-indent: -9999px; } #mainContent h2.contactElectroflow{ background: url(/futureenergy/images/titles/h2-contactelectroflow.gif) no-repeat; text-indent: -9999px; } #mainContent h2.aboutElectroflow{ background: url(/futureenergy/images/titles/h2-aboutelectroflow.gif) no-repeat; text-indent: -9999px; } #mainContent h2.electroflowProducts{ background: url(/futureenergy/images/titles/h2-electroflowproducts.gif) no-repeat; text-indent: -9999px; } #mainContent h2.contactUs{ background: url(/futureenergy/images/titles/h2-contactus.gif) no-repeat; text-indent: -9999px; } #mainContent h2.workplace{ background: url(/images/worktown-logo.png.gif) no-repeat; text-indent: -9999px; } #mainContent span.highlight{ font-weight: 600; } #mainContent img.powerBattImage { margin-bottom: 5px; margin-top:80px;} #mainContent img.powerBattImageFirst { margin-bottom: 5px; margin-top:10px;} #mainContent img.contentImage { margin-bottom: 20px; margin-right: 30px; } #mainContent img.contentImageFloatLeft { float:left; margin-bottom: 20px; margin-right: 30px; } #mainContent img.contentImageFloatRight { float:right; margin-bottom: 20px; margin-left: 30px; } #mainContent #threeColumns .columnTop { height: 5px; width: 278px; } #mainContent #threeColumns .columnMiddle { margin: 5px; height: 430px; } #mainContent #threeColumns .columnMiddle img { margin-bottom: 10px; margin-top: 10px;} #mainContent #threeColumns .columnMiddle a { display: block;} #mainContent #threeColumns .columnMiddle ul { list-style-type: circle; } #mainContent #threeColumns .columnBottom { height: 5px; width: 278px; } #mainContent #threeColumns #columnOne, #mainContent #threeColumns #columnTwo, #mainContent #threeColumns #columnThree { background-color: #ffffff; color: #4F595D; float: left; text-decoration: none; width: 282px; } #mainContent #threeColumns #columnOne:hover, #mainContent #threeColumns #columnTwo:hover, #mainContent #threeColumns #columnThree:hover { background-color: #e8e8e8;} #mainContent #threeColumns #columnOne { margin-right: 24px; } #mainContent #threeColumns #columnTwo { margin-right: 30px; } #mainContent #threeColumns #columnOne h2{ background: url(/futureenergy/images/titles/h2-products.gif) no-repeat; margin-top:5px; padding-bottom: 0px; text-indent: -9999px;} #mainContent #threeColumns #columnTwo h2 { background: url(/futureenergy/images/titles/h2-aboutus.gif) no-repeat; margin-top:5px; height: 16px; padding-bottom: 0px; text-indent: -9999px;} #mainContent #twoColumns .columnTop { height: 5px; width: 278px; } #mainContent #twoColumns .columnMiddle { margin: 5px; height: 1%; } #mainContent #twoColumns .wfeLogo { margin-left: 107px; margin-right: 20px; } #mainContent #twoColumns .wwLogo { margin-left: 104px; margin-right: 20px; } #mainContent #twoColumns .bsiLogo { height: 60px; margin-left: 150px; float:right;} #mainContent #twoColumns .columnMiddle img { margin-bottom: 10px; margin-top: 10px;} #mainContent #twoColumns .columnMiddle a { display: block;} #mainContent #twoColumns .columnMiddle ul { list-style-type: circle; } #mainContent #twoColumns .columnBottom { height: 5px; width: 278px; } #mainContent #twoColumns #columnOne, #mainContent #twoColumns #columnTwo { background-color: #ffffff; color: #4F595D; float: left; text-decoration: none; width: 425px; } #mainContent #twoColumns #columnOne:hover, #mainContent #twoColumns #columnTwo:hover { abackground-color: #DBDCD7;} #mainContent #twoColumns #columnOne { margin-right: 50px; } #mainContent #twoColumns #columnTwo { amargin-right: 30px; } #mainContent #twoColumns #columnOne h2{ background: url(/futureenergy/images/titles/h2-products.gif) no-repeat; margin-top:5px; padding-bottom: 0px; text-indent: -9999px;} #mainContent #twoColumns #columnTwo h2 { background: url(/futureenergy/images/titles/h2-aboutus.gif) no-repeat; margin-top:5px; height: 16px; padding-bottom: 0px; text-indent: -9999px;} #mainContent #productInfo .row { height: 125px; margin-bottom: 20px; padding:10px;} #mainContent #productInfo .row:hover { background-color: #e8e8e8; } #mainContent #productInfo .row .rowLeft { float:left; width:300px;} #mainContent #productInfo .row .rowRight { float:left; width:580px;} #mainContent #productInfo .row .rowRight h2 { margin-top: 0px; padding-bottom:5px; } #mainContent #productInfo .row .rowRight h2.batteryGurus{ background: url(/futureenergy/images/titles/h2-batterygurus.gif) no-repeat; text-indent: -9999px;} #mainContent #productInfo .row .rowRight h2.cellstrom { background: url(/futureenergy/images/titles/h2-cellstrom.gif) no-repeat; text-indent: -9999px; } #mainContent #productInfo .row .rowRight h2.electroflow{ background: url(/futureenergy/images/titles/h2-electroflow.gif) no-repeat; text-indent: -9999px; } #mainContent #teamInfo .leftColumn { background-color: #ffffff; float:left; height: 225px; margin-bottom: 20px; margin-right: 10px; padding:10px; width: 420px;} #mainContent #teamInfo .rightColumn { background-color: #ffffff; float:right; height: 225px; margin-bottom: 20px; margin-right: 10px; padding:10px; width: 420px;} #mainContent #teamInfo .leftColumnTall { background-color: #ffffff; float:left; height: 590px; margin-bottom: 20px; margin-right: 10px; padding:10px; width: 420px;} #mainContent #teamInfo .rightColumnTall { background-color: #ffffff; float:right; height: 590px; margin-bottom: 20px; margin-right: 10px; padding:10px; width: 420px;} #mainContent #teamInfo .leftColumn:hover, #mainContent #teamInfo .leftColumnTall:hover, #mainContent #teamInfo .rightColumn:hover, #mainContent #teamInfo .rightColumnTall:hover { background-color: #e8e8e8; } #mainContent #teamInfo .mugshot { float:left; width:170px; } #mainContent #teamInfo .mugshot .name {text-align:center;} #mainContent #teamInfo .biography { float:left; width:250px; } #mainContent #teamInfo .biography h2 { background: url(/futureenergy/images/titles/h2-teammember.gif) no-repeat; margin-top: 0px; padding-bottom:5px; text-indent: -9999px;} #mainContent #teamInfo .biography h2.peterwesley { background: url(/futureenergy/images/titles/h2-peterwesley.gif) no-repeat; margin-top: 0px; padding-bottom:5px; text-indent: -9999px;} #mainContent #teamInfo .biography h2.alexbamberg { background: url(/futureenergy/images/titles/h2-alexbamberg.gif) no-repeat; margin-top: 0px; padding-bottom:5px; text-indent: -9999px;} #mainContent #teamInfo .biography h2.chrisharris { background: url(/futureenergy/images/titles/h2-chrisharris.gif) no-repeat; margin-top: 0px; padding-bottom:5px; text-indent: -9999px;} #mainContent #teamInfo .biography h2.michaelwebb { background: url(/futureenergy/images/titles/h2-michaelwebb.gif) no-repeat; margin-top: 0px; padding-bottom:5px; text-indent: -9999px;} #mainContent #teamInfo .biography h2.benkelly { background: url(/futureenergy/images/titles/h2-benkelly.gif) no-repeat; margin-top: 0px; padding-bottom:5px; text-indent: -9999px;} #mainContent #teamInfo .biography h2.johnharris { background: url(/futureenergy/images/titles/h2-johnharris.gif) no-repeat; margin-top: 0px; padding-bottom:5px; text-indent: -9999px;} #mainContent #teamInfo .biography p.jobTitle { color: #01b5cc; font-weight: 600;} #mainContent #contactInfo #leftColumn { background-color: #ffffff; float:left; margin-bottom: 20px; margin-right: 10px; padding:10px; width: 570px;} #mainContent #contactInfo #rightColumn { background-color: #ffffff; float:right; margin-bottom: 20px; padding:10px; padding-left: 0px; width: 290px;} #mainContent #rightColumn { float: left; width: 280px; z-index: 99; } #mainContent #rightColumn img { margin-bottom: 16px; padding-left: 16px; } #mainContent #leftContact { border: solid 1px green; width:600px;} #mainContent #leftContact .columnOne { float: left; margin-right: 34px; padding-bottom: 10px; width: 280px;} #mainContent #leftContact .columnTwo { float: left; padding-bottom: 10px; width: 280px; } #mainContent #leftContact .columnTwo.small p { color: #7d8d94; font-size: 10px; } #mainContent #contactInfo #rightColumn ul {list-style: none;} #mainContent #contactInfo #rightColumn ul.contact li {margin-left: 10px;} #mainContent #contactInfo #rightColumn ul.contact li span { color: #777; display: block; float: left; font-size: 9px; width: 35px;} #mainContent #contactInfo #rightColumn ul.contact {margin-bottom: 10px; margin-left: 0px; padding: 2px;} a h2 { border: none;} li { line-height: 1.5em; margin-left: 20px;} li.listColumn2 { margin-left: 220px;} li.first { margin-top: -6em; }