/* CSS Style Sheet for Electrification Coalition Coded by MSDS | www.ms-ds.com Cufon Cyan #0096c2 Browser Cyan #009cc7 Cufon Grey# 454545 Browser Gray: #5E5E5E EC Orange: #F15A22 EC Navy: #005789 */ /*Removes blue glow from Safari form input and Firefox dotted line focus*/ :focus, a { -moz-outline-style: none; outline: none !important; } html { height: 100%; background: #FFF url(../img/bgTile-html.gif) repeat -100%; overflow-y: scroll;/*forces vertical scroll bar to prevent page-to-page horizontal jumping*/ } body { min-height: 101%; font: 14px/19px Helvetica, Arial, sans-serif; color: #5e5e5e; background: url(../img/bgTile-wrapper.png) repeat-y top; } :focus, a { -moz-outline-style: none; outline: none !important; }/*Removes blue glow from Safari form input and Firefox dotted line focus*/ #container { width: 800px; margin: 0 auto; overflow: hidden; } em { font-style: italic; } strong { font-weight: bold; } p { margin-bottom: 1em; -webkit-font-smoothing: antialiased; } h1 { font-size: 22px; line-height: 26px; margin-bottom: 0; color: #0096c2; } h2 { font-size: 16px; line-height: 20px; text-transform: uppercase; font-weight: bold; color: #0096c2; margin-bottom: 14px; } h3 { font-size: 16px; line-height: 20px; color: #F15A22; font-weight: bold; } h4 { font-size: 14px; line-height: 18px; margin-bottom: 6px; color: #5E5E5E; } a { color: #009cc7; text-decoration: none; border-bottom: 1px solid #85c5ed; } a:hover { color: #F15A22; border-bottom-color: #f17e53; } .blue { color: #0096c2; } .underline { text-decoration: underline; } .super { font-size: 70%; line-height: 10px; vertical-align: top; margin-right: 0.25em; } a.image_btn { border: none; } a.image_btn:hover { border: none; } .extra_space {margin-top: 30px;} /*------------------------------------------------- =HD -------------------------------------------------*/ #hd { height: 110px; padding: 24px 20px 0 20px; position: relative; background: url(../img/bgTile-hd.png) repeat-x; } #hd h1 { color: #FFF; } #hd h1 a { width: 200px; height: 60px; text-indent: -9999px; overflow: hidden; display: block; background: url(../img/logo-hd.png) no-repeat; border: none; } #nav { position: absolute; bottom: 0; left: 20px; height: 30px; width: 760px; background-color: #F0F0F0; } #nav li { height: 30px; display: block; float: left; } #nav a { border: none; line-height: 30px; height: 30px; font-size: 13px; font-weight: bold; text-transform: uppercase; margin: 0 10px 0 18px; color: #0096c2; } #nav a:hover { text-decoration: none; color: #F15A22; } #home #nav a#home, #about-us #nav a#about-us, #coalition-members #nav a#coalition-members, #events #nav a#events, #news #nav a#news, #roadmap #nav a#roadmap, #analysis #nav a#analysis, #action-center #nav a#action-center, #email-senator #nav a#action-center { color: #F15A22; } /*------------------------------------------------- =BD -------------------------------------------------*/ #bd { margin: 46px 20px 20px 20px; overflow: hidden; } #news #bd ul { margin-bottom: 30px; } #news #bd ul li { background: url(../img/bullet-blue.gif) no-repeat 0 6px; padding-left: 10px; margin-bottom: 0.5em; } #news #bd ol { border-top: 1px solid #5E5E5E; margin-top: 30px; padding-top: 10px; } #news #bd ol li { font-size: 11px; line-height: 13px; margin-bottom: 4px; } /*------------------------------------------------- =MAIN CONTENT AREA -------------------------------------------------*/ #home #main, #about-us #main, #events #main, #news #main, #analysis #main, #action-center #main { width: 500px; float: left; margin-right: 20px; } #home #main a { font-weight: bold; } #home #main a em { font-weight: bold; font-style: italic; } #home #main p { padding-right: 20px; } #home h2 { color: #F15A22; border-top: solid 10px #F15A22; padding-top: 4px; margin-top: 24px; margin-bottom: 1em; } #home h2#news { color: #005789; border-top-color: #005789; } #home p.author { font-size: 12px; line-height: 15px; color: #009cc7; margin: 15px 0 40px 0; } h1.intro { padding-bottom: 15px; border-bottom: 6px solid #F0F0F0; margin-bottom: 15px; } p.grad { padding-top: 20px; margin-top: 20px; border-top: 1px dotted #999; } .toggler {clear: both;} h2.toggler a {text-decoration: none; color: #F15A22; border-bottom: none !important; padding-left: 20px; background: url(../img/arrow-blue.png) no-repeat 4px 4px;} h2.toggler a.open {background: url(../img/arrow-blue.png) no-repeat 4px -19px;} h3.toggler a {text-decoration: none; color: #F15A22; border-bottom: none !important; padding-left: 20px; background: url(../img/arrow-orange.png) no-repeat 4px 4px;} h3.toggler a.open {background: url(../img/arrow-orange.png) no-repeat 4px -19px;} /*------------------------------------------------- =VERTICAL DIVIDER -------------------------------------------------*/ #vertDivider { width: 15px; float: left; display: inline; } #vertDivTop { height: 160px; background: url(../img/divider-vert-top.jpg) no-repeat 0 0; } #vertDivMid { background: url(../img/divider-vert-midTile.jpg) repeat-y; } #vertDivBot { height: 160px; background: url(../img/divider-vert-bottom.jpg) no-repeat 0 0; } /*------------------------------------------------- =RIGHT SIDEBAR (RSB) -------------------------------------------------*/ #rsb { float: right; width: 190px; margin-right: 20px; } #rsb h1 { color: #454545; margin: 0 0 10px 0; } #rsb p, #bioGrid p { font-size: 14px; line-height: 18px; margin-bottom: 0; } a#roadmap-pdf { width: 180px; height: 215px; text-indent: -9999px; overflow: hidden; display: block; background: url(../img/reportDownload.jpg) no-repeat; border: none; } a#roadmap-pdf:hover { background-position: -180px 0px; } a#watchEvent { width: 200px; height: 111px; text-indent: -9999px; overflow: hidden; display: block; background: url(../img/watchEvent.gif) no-repeat; border: none; margin-bottom: 25px; } a#watchEvent:hover { background-position: 0 -111px; } /*------------------------------------------------- =COALITION MEMBERS -------------------------------------------------*/ #bioGrid li { width: 350px; padding: 10px; background: url(../img/bgTile-bioPod.gif) repeat-x; display: block; float: left; margin-right: 20px; margin-top: 30px; /*cursor: pointer;*/ border-top: 2px solid #E0E0E0; } #bioGrid img { border: 4px solid #E0E0E0; float: left; margin-right: 15px; } /*#bioGrid li:hover { border-top-color: #9AD7EA; background-image: url(../img/bgTile-bioPod-hover.gif); }*/ #bioGrid h3 { margin-top: 10px; } #bio h2 { margin-bottom: 16px; } #bio h4 { margin-bottom: 1em; } #bio h3, #bio h4, #bio p, #bio a { margin-left: 170px; } /*------------------------------------------------- =ROADMAP -------------------------------------------------*/ #roadmap #main img { float: right; margin: 0 15px 15px 15px; } /*------------------------------------------------- =ANALYSIS -------------------------------------------------*/ #report_list { margin: 15px 0 15px 0; } .letters { margin: 0 0 15px 0; } #report_list .report_row .cover a {float: left; margin-right: 10px; background: url(../img/cover-whitepaper.gif) no-repeat top left; display: block; width: 56px; height: 67px;} #report_list .main_report .cover a {float: left; margin: 0 10px 15px 0; background: url(../img/cover-impactreport.gif) no-repeat top left; display: block; width: 108px; height: 140px;} #report_list .text {padding-left: 40px;} #report_list h5 {font-size: 17px; margin-bottom: 4px;} #report_list a {color: #009bc9; text-decoration: none; border: none;} #report_list h5 a:hover {color: #f15a22;} .report_row {padding: 15px 0; clear: both; border-top: 1px dotted #999; height: 60px; } .report_row p { margin: 0; } .report_row:hover .cover a {background: url(../img/cover-whitepaper.gif) no-repeat top right !important;} .main_report.report_row:hover .cover a {background: url(../img/cover-impactreport.gif) no-repeat top right !important;} #action-center #report_list #first { border: none; padding-top: 0; margin-top: -10px; } #action-center h3 {font-size: 14px; margin: 0px 0 0px 0px; padding-bottom: 7px; /*border-bottom: 1px dotted #F15A22;*/ } .collapse {margin-left: 10px;} #report_list .report_row .cover a.impact {background: url(../img/cover-thumb-impact.gif) no-repeat top left; } #report_list .report_row .cover a.roadmap {background: url(../img/cover-thumb-roadmap.gif) no-repeat top left; } #report_list .report_row:hover .cover a.impact {background: url(../img/cover-thumb-impact.gif) no-repeat top right !important; } #report_list .report_row:hover .cover a.roadmap {background: url(../img/cover-thumb-roadmap.gif) no-repeat top right !important; } .spacebelow{padding-bottom: 20px;} /*------------------------------------------------- =EVENTS -------------------------------------------------*/ #events span { color: #5E5E5E; } #events #main h1 { margin-bottom: 12px; } #events #main h3 { color: #5e5e5e; margin-top: 7px; } #events #main h4 { margin-bottom: 12px; } div.video { margin: 8px 0 20px 0; } /*------------------------------------------------- =NEWS -------------------------------------------------*/ #events h2 { margin-top: 20px; } #news h1 { margin-bottom: 8px; } #news h2 { color: #5e5e5e; margin: 30px 0 0 0; } /*------------------------------------------------- =FORMS -------------------------------------------------*/ #mainForm form input, input { border-top: 1px solid #CFCFCF; border-left: 1px solid #CFCFCF; border-right: none; border-bottom: none; background: #eee; text-align: left; padding: 2px 5px; display: block; margin: 0 0 10px 0; color: #5E5E5E; font-size: 12px; line-height: 12px; } #rsb form { width: 192px; } #rsb input { width: 180px; } #rsb div.alert { background-color: #ffdce0; padding: 6px 10px 10px 10px; width: 170px; border-top: 2px solid #dc0b0b; color: #dc0b0b; margin-top: 10px; } #rsb div.success { background-color: #c9e8f1; padding: 6px 10px 10px 10px; width: 170px; border-top: 2px solid #009bc9; color: #009bc9; margin-top: 10px; } #rsb input#state { width: 50px; float: left; margin-right: 5px; } #rsb input#zip { width: 110px; float: right; margin-right: 0; } form { width: 340px; float: left; margin-bottom: 40px; } input { width: 300px; } input.firstname, input.city { width: 140px; float: left; } input.lastname { width: 140px; float: left; margin-left: 8px; } input.state { width: 40px; float: left; margin-left: 8px; } select { width: 52px; float: left; margin-left: 8px; font-size: 12px; padding: 2px 0 0 0; color: #5E5E5E; background: #e0edf1; border-top: 1px solid #91d3e6; border-left: 1px solid #91d3e6; border-right: none; border-bottom: none; -webkit-appearance: none; -webkit-border-radius: 0; } option { background: #FFF; } @media screen and (-webkit-min-device-pixel-ratio:0) { /* Safari and Google Chrome only */ select { padding-bottom: 2px; margin-top: 0; padding-left: 5px; } } input.zip { width: 80px; float: left; margin-left: 8px; } form#pdfForm { float: left; margin-right: 25px; } form#printForm { float: right; } #emailText { width: 340px; float: left; margin-right: 25px; font-size: 12px; overflow: hidden; margin-bottom: 20px; } input#keepUpdated { float: left; width: auto; text-align: left; margin: 0 6px 0 0; padding: 0; } label { font-size: 12px; } form div { margin: 20px 0; } input.required, #mainForm #zipform #tempZip, #mainForm #f1, #mainForm #f2, #mainForm #f3, #mainForm #f4, #mainForm #f6, #mainForm #f7, #mainForm #f8, #mainForm select { background: #e0edf1; border-top-color: #91d3e6; border-left-color: #91d3e6; border-bottom: none; border-right: none; } div.alert { width: 300px; background-color: #ffdce0; padding: 6px 10px 10px 10px; border-top: 2px solid #dc0b0b; color: #dc0b0b; margin-top: 10px; } div.success { width: 300px; background-color: #c9e8f1; padding: 6px 10px 10px 10px; border-top: 2px solid #009bc9; color: #009bc9; margin-top: 10px; } div.alert p, #roadmap div.success p { margin: 0; } form p.footnote { font-size: 11px; line-height: 14px; margin: -4px 0 6px 0; font-style: italic; } .submit { background: url(../img/btn-submit.gif); } .sendEmail { background: url(../img/btn-sendEmail.gif); } button.submit, button.sendEmail { background-position: 0 0; height: 22px; clear: both; margin-top: 15px; } a:hover button.submit, a:hover button.sendEmail { background-position: 0 -22px; } .rollover a, button { width: 98px; padding: 0; border: 0; cursor: pointer; display: block; } /*------------------------------------------------- =FORMS -------------------------------------------------*/ .mailSenators { clear: both; border-top: 1px dotted #999; margin-top: 40px; padding-top: 25px; } .btn-downloadPDF { width: 122px; height: 22px; margin-top: 16px; border: none; background-image: url(../img/btn-downloadPDF.gif); text-indent: -9999px; overflow: hidden; display: block; } .btn-downloadPDF:hover { background-position: 0 -22px; text-decoration: none; border: none; } .btn-contactSenator { width: 202px; height: 22px; margin-top: 10px; border: none; background-image: url(../img/btn-contactSenator.gif); text-indent: -9999px; overflow: hidden; display: block; } .btn-requestLetter { width: 113px; height: 22px; margin-top: 10px; border: none; background-image: url(../img/btn-requestLetter.gif); text-indent: -9999px; overflow: hidden; display: block; } .btn-downloadButtons { width: 158px; height: 22px; border: none; background-image: url(../img/btn-download-btns.gif); text-indent: -9999px; overflow: hidden; display: block; } .btn-contactSenator:hover, .btn-requestLetter:hover, .btn-downloadButtons:hover { background-position: 0 -22px; text-decoration: none; border: none; } h2.borderTop { border-top: 1px dotted #999; margin-top: 15px; padding-top: 15px; } .tout-emailSenator { width: 210px; height: 162px; border: none; margin-bottom: 30px; background-image: url(../img/tout-emailSenator.gif); text-indent: -9999px; overflow: hidden; display: block; } .tout-emailSenator:hover { background-position: 0 -162px; text-decoration: none; border: none; } ul.letters li { margin-bottom: 8px; padding-left: 22px; background: url(../img/icon-pdf.png) 0 0 no-repeat; font-size: 12px; } /*------------------------------------------------- =FT -------------------------------------------------*/ #ft { margin: 40px 20px 20px 20px; padding-top: 6px; color: #8f8f8f; position: relative; clear: both; background: url(../img/dotted.gif) repeat-x; overflow: hidden; } #ft p { font-size: 10px; line-height: 16px; margin: 0; float: left; } #ft a { color: #8f8f8f; border: none; } #ft a:hover { color: #F15A22; } #ft a#msdsLink { text-decoration: underline; color: #0096c2; } #ft a#msdsLink:hover { color: #F15A22; } #ft a#safeLink { width: 226px; height: 36px; text-indent: -9999px; overflow: hidden; display: block; float: right; background: url(../img/safeLink.gif) no-repeat; } #ft a#safeLink:hover { background-position: 0 -36px; } #events h1#analysis { width: 500px; height: 28px; text-indent: -9999px; overflow: hidden; display: block; background-image: url(../img/analysis.gif); margin-bottom: 0; } /*------------------------------------------------- =SALSA INTEGRATION -------------------------------------------------*/ #mainForm { width: 100%; font-size: 12px; } #mainForm form { padding: 0; margin: 0; width: 100%; } #mainForm form div { margin: 0; } #mainForm form input { width: auto; } #mainForm #zipform #tempZip { margin-top: 20px; width: 140px; background-image: none; height: auto; text-indent: 0;} #mainForm #zipform input { background: url(../img/btn-submit.gif); background-position: 0 0; height: 22px; width: 98px; text-indent: 9999px; } #mainForm .actioncontent label, #mainForm .supporterInfo label { display: none; } #mainForm .actioncontent { width: 340px; } #mainForm .targets { width: 340px; float: right; display: none; } #mainForm .supporterInfo { width: 340px; } #mainForm #target-page { width: 340px; float: left; overflow: hidden; margin-right: 25px; margin-bottom: 20px; } #mainForm #sign-page { width: 340px; float: right; overflow: hidden; } #mainForm #sign-page input { width: 240px; } #mainForm #sign-page input.submit { background: url(../img/btn-sendEmail.gif); background-position: 0 0; height: 22px; width: 98px; text-indent: 9999px; } #mainForm select { padding: 1px 5px; width: auto; margin: 0 0 10px 0; } #mainForm .formRow { padding: 0; } #mainForm select.errorInput, #mainForm input.errorInput, #mainForm #f1.errorInput, #mainForm #f2.errorInput, #mainForm #f3.errorInput, #mainForm #f4.errorInput, #mainForm #f5.errorInput, #mainForm #f6.errorInput, #mainForm #f7.errorInput, #mainForm #f8.errorInput { background: #ffdddd; border-top: 1px solid #e8a6a6; border-left: 1px solid #e8a6a6; border-bottom: none; border-right: none; } #errorMessage { font-size: 12px; width: 240px; } #errorMessage .error, #district .error{ font-size: 12px; display: block; margin: 2px 5px; width: 240px; } #info-page h1 { display: none; } #info-page #description h1 { display: block; } #action .recipient { display: none; } #action form select { width: 240px; margin: 5px 10px; } #action input.submit { background: url(../img/btn-submit.gif); background-position: 0 0; height: 22px; width: 98px; text-indent: 9999px; } #action .success {display: none;} /*------------------------------------------------- =CLEARFIX -------------------------------------------------*/ .clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } .clearfix { display:inline-block; } .clearfix { display:block; } * html .clearfix { height:1px; }