/** 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 td.dayCellEmpty, #mainContent td.dayCellReportTitle, #mainContent td.dayCellAMTitle, #mainContent td.dayCellPMTitle { background-color: #00C2D7; color: #ffffff;} #mainContent td.dayCellReportTitle { width: 65px;} #mainContent td.calendarHeading { color: #00C2D7; font-weight: bold;} #mainContent td.calDateHead { color: #00C2D7; font-weight: bold; font-size: 1.5em;} #mainContent td.dayCellAM0, #mainContent td.dayCellAM1, #mainContent td.dayCellAM2, #mainContent td.dayCellAM3, #mainContent td.dayCellAM4, #mainContent td.dayCellAM5, #mainContent td.dayCellAM6, #mainContent td.dayCellPM0, #mainContent td.dayCellPM1, #mainContent td.dayCellPM2, #mainContent td.dayCellPM3, #mainContent td.dayCellPM4, #mainContent td.dayCellPM5, #mainContent td.dayCellPM6, #mainContent td.dayCell0, #mainContent td.dayCell1, #mainContent td.dayCell2, #mainContent td.dayCell3, #mainContent td.dayCell4, #mainContent td.dayCell5, #mainContent td.dayCell6{ color: #00C2D7;font-weight: bold; width: 70px; vertical-align: top; height: 60px; text-align: right; border: solid 1px #7D8588; } #mainContent td.dayCellAM5, #mainContent td.dayCellAM6, #mainContent td.dayCellPM5, #mainContent td.dayCellPM6, #mainContent td.dayCell5, #mainContent td.dayCell6{ background-color: #cccccc; } #mainContent td.dayCellAM0:hover, #mainContent td.dayCellAM1:hover, #mainContent td.dayCellAM2:hover, #mainContent td.dayCellAM3:hover, #mainContent td.dayCellAM4:hover, #mainContent td.dayCellAM5:hover, #mainContent td.dayCellAM6:hover, #mainContent td.dayCellPM0:hover, #mainContent td.dayCellPM1:hover, #mainContent td.dayCellPM2:hover, #mainContent td.dayCellPM3:hover, #mainContent td.dayCellPM4:hover, #mainContent td.dayCellPM5:hover, #mainContent td.dayCellPM6:hover, #mainContent td.dayCell0:hover, #mainContent td.dayCell1:hover, #mainContent td.dayCell2:hover, #mainContent td.dayCell3:hover, #mainContent td.dayCell4:hover, #mainContent td.dayCell5:hover, #mainContent td.dayCell6:hover{ background-color: #7D8588; color: white;font-weight: bold;} #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: 0; } #mainContent fieldset { background: #E8E8E8 url(/futureenergy/images/layout/horizontaldots.gif) repeat-x left top; border: none; padding: 10px; } #mainContent fieldset fieldset { background: transparent; border: none; } #mainContent legend { } #mainContent p.quote { font-style: italic; color: #000000;} #mainContent p.mainquote { font-style: italic; color: #000000; border: dashed 1px #DBDCD7; background-color: #e8e8e8; height: 1%; margin-bottom: 20px; padding:10px;} #mainContent p.mainquote:hover {border: dashed 1px #4F595D; } #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; 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.batteryGurusDownloads{ background: url(/futureenergy/images/titles/h2-batterygurusdownloads.gif) no-repeat; text-indent: -9999px; } #mainContent h2.batteryGurusProducts{ background: url(/futureenergy/images/titles/h2-batterygurusproducts.gif) no-repeat; text-indent: -9999px; } #mainContent h2.caseStudies{ background: url(/futureenergy/images/titles/h2-casestudies.gif) no-repeat; text-indent: -9999px; } #mainContent h2.fourSimpleSteps{ background: url(/futureenergy/images/titles/h2-4simplesteps.gif) no-repeat; text-indent: -9999px; } #mainContent h2.sevenSimpleSteps{ background: url(/futureenergy/images/titles/h2-7simplesteps.gif) no-repeat; text-indent: -9999px; } #mainContent h2.avonRIB{ background: url(/futureenergy/images/titles/h2-avonrib.gif) no-repeat; text-indent: -9999px; } #mainContent h2.cityCruises{ background: url(/futureenergy/images/titles/h2-citycruises.gif) no-repeat; text-indent: -9999px; } #mainContent h2.sheepdrove{ background: url(/futureenergy/images/titles/h2-sheepdrove.gif) no-repeat; text-indent: -9999px; } #mainContent h2.forkwayGroup{ background: url(/futureenergy/images/titles/h2-forkwaygroup.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.calculator{ background: url(/futureenergy/images/titles/h2-calculator.gif) no-repeat; text-indent: -9999px; } #mainContent h3.presentations{ border: solid 1px black ; background: url(/futureenergy/images/titles/h3-presentations.gif) no-repeat; margin-bottom: 0px; margin-top: 20px; text-indent: -9999px; } #mainContent h3.caseStudies{ background: url(/futureenergy/images/titles/h3-casestudies.gif) no-repeat; margin-top: 20px; text-indent: -9999px; } #mainContent h3.technicalDocuments{ background: url(/futureenergy/images/titles/h3-technicaldocuments.gif) no-repeat; margin-top: 20px; text-indent: -9999px; } #mainContent span.highlight{ font-weight: 600; } #mainContent img.powerBattImage { margin-bottom: 5px; margin-top:10px;} #mainContent img.powerBattPlusBottleImage { float:right; margin-bottom: 10px; margin-top: 100px; margin-left: 30px; } #mainContent img.contentImage { margin-bottom: 20px; margin-right: 30px; } #mainContent img.contentImageFloatLeft { float:left; margin-bottom: 10px; margin-top: 5px; margin-right: 30px; } #mainContent img.contentImageFloatRight { float:right; margin-bottom: 10px; margin-top: 5px; margin-left: 30px; } #mainContent img.quoteImageFloatLeft { float:left; margin-bottom: 5px; margin-top: 5px; margin-right: 10px; } #mainContent img.quoteImageFloatRight { float:right; margin-bottom: 5px; margin-top: 5px; margin-left: 10px; } #mainContent h3.login{ padding-top: 0px; } #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; border: dashed 1px #DBDCD7; color: #4F595D; float: left; text-decoration: none; width: 282px; } #mainContent #threeColumns #columnOne:hover, #mainContent #threeColumns #columnTwo:hover, #mainContent #threeColumns #columnThree:hover { background-color: #e8e8e8;border: dashed 1px #4F595D; } #mainContent #threeColumns #columnOne { margin-right: 24px; } #mainContent #threeColumns #columnTwo { margin-right: 24px; } #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 #threeColumns #columnThree h2 { background: url(/futureenergy/images/titles/h2-contactus.gif) no-repeat; margin-top:5px; height: 16px; padding-bottom: 0px; text-indent: -9999px;} #mainContent #productInfo .row { border: dashed 1px #DBDCD7; height: 125px; margin-bottom: 20px; padding:10px;} #mainContent #productInfo .row:hover { background-color: #e8e8e8; border: dashed 1px #4F595D; } #mainContent #productInfo .row .rowLeft { float:left; width:300px;} #mainContent #productInfo .row .rowRight { float:left; width:575px;} #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 #caseStudyInfo .row { border: dashed 1px #DBDCD7; height: 1%; margin-bottom: 20px; padding:10px;} #mainContent #caseStudyInfo .row:hover { background-color: #e8e8e8; border: dashed 1px #4F595D; } #mainContent #caseStudyInfo .row .rowLeft { float:left; width:130px;} #mainContent #caseStudyInfo .row .rowRight { float:left; width:745px;} #mainContent #caseStudyInfo .row .rowRight h2 { margin-top: 0px; padding-bottom:5px; } #mainContent #powerBattInfo .row { border: dashed 1px #DBDCD7; height: 1%; margin-bottom: 20px; padding:10px;} #mainContent #powerBattInfo .row:hover { background-color: #e8e8e8; border: dashed 1px #4F595D; } #mainContent #powerBattInfo .row .rowLeft { float:left; width:750px;} #mainContent #powerBattInfo .row .rowRight { float:left; width:130px;} #mainContent #powerBattInfo .row .rowRight h2 { margin-top: 0px; padding-bottom:5px; } #mainContent #downloadInfo .row { border: dashed 1px #DBDCD7; height: 1%; margin-bottom: 20px; padding:10px;} #mainContent #downloadInfo .innerrow { border: dashed 1px #DBDCD7; height: 1%; margin-bottom: 20px; padding:10px;} #mainContent #downloadInfo .row:hover { background-color: #e8e8e8; border: dashed 1px #4F595D; } #mainContent #downloadInfo .innerrow:hover { border: dashed 1px #4F595D; } #mainContent #downloadInfo .row .rowLeft { float:left; width:750px;} #mainContent #downloadInfo .row .rowRight { float:left; width:130px;} #mainContent #downloadInfo .row .rowRight h2 { margin-top: 0px; padding-bottom:5px; } #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.johndickson { background: url(/futureenergy/images/titles/h2-johndickson.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: 700px;} #mainContent #contactInfo #rightColumn { background-color: #ffffff; float:right; margin-bottom: 20px; padding:10px; padding-left: 0px; width: 150px;} #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;} #mainContent fieldset#calcInputs{ background:#e8e8e8 none repeat scroll 0 0; border-bottom:1px dotted #c8c8c8; border-left:1px solid #01B5CC; border-right:1px solid #01B5CC; border-top:1px solid #01B5CC; color:#586163; padding:1em; } #mainContent fieldset#calcInputs input{ margin-bottom: 5px; width: 50px; } #mainContent fieldset#calcInputs input.butSend{ margin-bottom: 5px; width: 75px; } #mainContent fieldset#calcInputs input.butCalculate{ margin-bottom: 5px; width: 100px; } #mainContent fieldset#caveats #butPrint{ margin-bottom: 5px; width: 100px; padding-bottom: 10px; } #printIntro{ display: none; } #mainContent fieldset#calcOutputs{ background:#d8d8d8 none repeat scroll 0 0; border:1px dotted #c8c8c8; border-left:1px solid #01B5CC; border-right:1px solid #01B5CC; color:#586163; padding:1em; } #mainContent fieldset#caveats{ background:#e8e8e8 none repeat scroll 0 0; border-top:1px dotted #c8c8c8; border-left:1px solid #01B5CC; border-right:1px solid #01B5CC; border-bottom:1px solid #01B5CC; color:#586163; font-weight: 600; padding:1em; width: 676px; } #mainContent fieldset#calcInputs label { display: block; float: left; margin: 0; width: 250px; } #mainContent fieldset#calcOutputs label { display: block; float: left; margin: 0; width: 250px; } #mainContent fieldset#calcOutputs span { display: block; font-weight: 600; font-size:1.2em;} #mainContent fieldset#calcOutputs span.highlight { color: #73B649;} #mainContent fieldset h3 { text-decoration: underline; margin: 0px;} #mainContent fieldset h4 { font-weight: 600; margin: 0px;} #mainContent fieldset h4.maintenance {margin-top:20px;}