/* @override http://www.power2010.org.uk/?css=styles/index.v.1272046469 */ /* @override http://www.power2010.org.uk/?css=styles/index.v.1270559069 */ /* @override http://www.power2010.org.uk/?css=styles/index.v.1270558695 */ /* @override http://www.power2010.org.uk/?css=styles/index.v.1268668034 */ /* @override http://www.power2010.org.uk/?css=styles/index.v.1267826221 */ /* @override http://www.power2010.org.uk/?css=styles/index.v.1266339883 */ /* ---------------------------------------------------------- **Client Name** CSS Managed by: Blue State Digital Last Update: May 2009 TABLE OF CONTENT 01 - GLOBAL BROWSER RESET 02 - COMMON STYLE 03 - LAYOUT 04 - HOMEPAGE 05 - SUBPAGES 06 - FRAMEWORK 07 - UTILITY COLOR GUIDE (Main Site Colors and their Hex Codes) ---------------------------------------------------------- */ /* @group 01 =GLOBAL BROWSER RESET */ /* 01 =GLOBAL BROWSER RESET ---------------------------------------------------------- */ /* YUI Reset version: 2.7.0 */ html { color: #000; height:100%;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; } address,caption,cite,code,dfn,em,strong,th,var,optgroup { font-style: inherit; font-weight: inherit; } del,ins { text-decoration: none; } li { list-style: none; } caption, th { text-align: left; } h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; } q:before, q:after { content: ''; } abbr,acronym { border: 0; font-variant: normal; } sup { vertical-align: baseline; } sub { vertical-align: baseline; } /*because legend doesn't inherit in IE */ legend { color: #000; } input,button,textarea,select,optgroup,option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; } /*@purpose To enable resizing for IE */ /*@branch For IE6-Win, IE7-Win */ * { outline:none; } /* @end */ /* @group 02 =COMMON STYLE */ /* 02 =COMMON STYLE ---------------------------------------------------------- */ body { background:#373839 url(http://www.power2010.org.uk/page/-/images/assets/bg-bottom.png); font-size:62.5%; font-family: "Helvetica", "Arial", "Sans Serif"; color:#cccccc; height:100%; } .base h1 { float:left; margin-top:17px; } .base h2 { font-size:21px; color: #fff; text-transform: uppercase; margin-bottom: 12px; display:inline-block; width:auto; float:left; clear:left; } .base h3 { font-size:18px; line-height:1.6em; font-weight: bold; clear:left; } .base h3 a { color: #ccc; } .base h4 { font-size:14px; line-height:1.6em; font-weight: bold; clear:left; } .pink { color: #e4218b !important; } .fat { font-weight: bold; } .base p, .base span, .main-content li, .main-content blockquote { font-size:14px; line-height:1.6em; } .base a { font-size:inherit; line-height:inherit; color:#ccc; text-decoration: none; } .main-content a { text-decoration: underline; } span.date { font-size: 12px; } .bd a { color: #e4218b; } .bd a:hover { text-decoration: underline; } .bd a.normal { color: #ccc; } .main-navigation a { font-size:1.3em; color:#a3a4a6; font-weight: bold; text-decoration: none; position:relative; } .main-navigation a:hover { color: #e4218b; } .main-navigation ul { display: none; position:absolute; z-index: 2000; } /* ================== */ /* = Skins for mods = */ /* ================== */ /* **************** BASIC STYLES ***************** */ .basic { background: transparent; background-repeat:repeat; display:block; } .basic.no-margin { margin: 0; } .basic.bottom .top { height: 10px; background: url(http://www.power2010.org.uk/page/-/images/assets/top-bot-divider.png); position: absolute; left: 0; top: 0; width: 100%; } /* **************** NAV STYLES ***************** */ .main-navigation { float:right; margin: 6px 0 0 0; display:inline-block; background:#464748; } .main-navigation li { float:left; width:auto; display:inline; margin-left: 5px; } .main-navigation ul { position: absolute; margin-top: -5px; width: 200px !important; } .main-navigation ul li { float: none; display: block; margin: 6px 5px 10px 5px; } .main-navigation ul li a { display: inline; font-weight: normal; } .masthead { position:fixed; height:148px; width:100%; top:0; left:0; z-index: 100; background: url(http://www.power2010.org.uk/page/-/images/assets/bg-top.png) bottom; } .main-content { padding-top: 142px; } /* **************** EXTENDED STYLES FOR BLOGS AND RECENT POSTS ***************** */ .extended { overflow:hidden; } .extended li { display:block; width:96%; margin-right:3.9%; float:left; padding-bottom:10px; margin-bottom:10px; background: url(http://www.power2010.org.uk/page/-/images/assets/border-entry-bottom.png) bottom right no-repeat; } .extended.two-column li { width:46%; } .extended h3 { margin-top:12px; } .extended span, .extended li, .extended h3 { line-height:1.2em !important; } .extended a { text-decoration:none; } .extended p { margin:12px 0; } .extended a img { float: left; margin: 0 10px 0 0; } .right li a { font-size:13px; } .partners { overflow: hidden; padding-top:25px; } .partners li { display: inline-block; float:left; width: auto; text-align: center; margin-left: 0; margin-right:0; padding: 0; padding-left: 30px; background: none !important; border-bottom: none !important; margin-bottom:30px; min-height: 93px;} /* **************** INPUT FIELDS ***************** */ label { background: white; display:block !important; padding:5px !important; margin-bottom:8px !important; } input, select { width:100%; background:white; border:1px solid white; font-size:13px !important; color:gray; /*line-height:16px;*/ } button { border: none; background: none; padding-left:5px; } .striped .col1 { width: 67.5%; overflow:hidden; float:left; } .striped .col2 { width: 32%; overflow:hidden; float:left; } /* **************** SIDEBAR CONNECT ***************** */ .connect { overflow: hidden; } .connect li { display:inline; margin-right:6px; } /* **************** BLOCKQUOTES ***************** */ blockquote { margin:10px 20px; padding:15px; background: #494b4c; } blockquote ul { overflow:hidden; } blockquote li { background: none!important; padding: 0px 0px 0px 20px;} .underline { text-decoration: underline !important; } /* **************** SECTION HEADING ***************** */ .top .sec-hd { margin-bottom: 0; } /* **************** SPACER ***************** */ .unit-spacer { display:block; height:22px; line-height:0;} .footer { text-align: center; margin: 10px 0; font-weight: bold; color: #727476; } .footer a { text-decoration: none; } /* **************** TWITTER FEED ***************** */ #twitter-feed img { float: right; margin:0 0px 10px 10px; padding: 5px; background: #464748; border: 1px solid #ed2190;} #twitter-feed li { margin-bottom: 10px; padding-bottom: 10px; background: url(http://www.power2010.org.uk/page/-/images/assets/border-entry-bottom.png) bottom right no-repeat; } #twitter-feed a { color: #e4218b; font-weight: bold;} #twitter-feed .time { font-size: 11px; display: block; background: url(http://www.power2010.org.uk/page/-/images/assets/border-entry-bottom.png) t right no-repeat; padding: 10px 0 0 0; margin: 10px 0 0 0;} /* @end */ /* 03 =LAYOUT ---------------------------------------------------------- */ /* @group 04 =HOMEPAGE */ /* 04 =HOMEPAGE ---------------------------------------------------------- */ .home .masthead { height:374px; position:absolute; } #home { padding-top:5px; padding-bottom:0; } .home .main-content { padding-top: 368px; } .home big { font-size:2.4em; font-weight: bold; display:block; text-align: center; padding-top: 61px; } .home-action-button { text-align: center; margin-top: 25px; } #countdown-splash { margin-left: 200px; margin-top: 40px;} #countdown-splash .countdown-timer { height: 20px; width: 590px; height:149px; margin-bottom: 30px; position: relative; } .new-hand { position: relative; } .new-hand a { position: absolute; left: 300px; top:-60px; } .new-counter { display:inline-block; position:relative; left:350px; top:-55px; } /* @end */ /* @group 05 =SUBPAGES */ /* 05 =SUBPAGES ---------------------------------------------------------- */ /* **************** VOTE STLES ***************** */ .hd.votes h3 { font-size: 30px; margin-bottom: 10px; } .bd.votes img { float: left; margin-bottom: 15px; margin-right: 15px; } #vote-idea { float: right; } .vote-idea { text-decoration: none !important; } .vote-idea span { display: inline !important; vertical-align: text-top; border: 1px gray solid; padding: 5px; position: absolute; right: 190px; top: 0; } .vote-idea em { font-style: normal; } .vote-idea img { position: absolute; right: 0; top: 0; } .vote-entry h3 { position: relative; } span.vote { position: absolute; font-size: 20px; font-weight: bold; left: 9px; top: 20px; padding: 0; text-align: center; } .vote em { font-size: 13px; font-style: normal; margin-top: -5px; text-align: center; width: 100%; } .issue img { float:left; padding:0 10px 10px 0; } .extended li { position:relative; } .s-button { position:absolute; top:45px; left:20px; display:none; } .leader .s-button { top:35px; } .extended li:hover .s-button { display:block;} #pop-signup { display:block !important; padding:15px; } #pop-signup .input { border: 1px #ccc solid; background:#ddd;} #pop-signup .input input {background:#ddd; border:none !important; } #pop-signup .input:focus { border: 1px #ee2391 solid;} .input.submit {background: #ee2391 !important; } #pop-signup p, #pop-signup div, #pop-signup span { color:#333; } /* **************** LEADERBOARD STYLES ***************** */ .leader { width: 100% !important; background: #323333 !important; padding: 0px 0 !important; overflow: hidden !important; height: 92px; } .leader h3 { line-height: 24px !important; font-size: 16px; margin: 0; } .leader h3 a {line-height: 30px;} .leader p { margin: 0; line-height: 19px; padding-right: 10px; } .leader img { margin-left: 70px !important; } /* **************** COUNTDOWN TIMER ***************** */ .countdown-timer { height: 20px; background-image: url(http://www.power2010.org.uk/page/-/images/assets/countdown-sprite.png); width: 590px; height:149px; margin-bottom: 30px; position: relative; } .countdown-timer div { display: block; width: 15px; height: 28px; position: absolute; background-image: url(http://www.power2010.org.uk/page/-/images/assets/countdown-sprite.png); top: 49px; } .countdown-timer .counta1 { left: 207px; } .countdown-timer .counta2 { left: 236px; } .countdown-timer .countb1 { left: 299px; } .countdown-timer .countb2 { left: 328px; } .countdown-timer .countc1 { left: 390px; } .countdown-timer .countc2 { left: 419px; } .countdown-timer .countd1 { left: 484px; } .countdown-timer .countd2 { left: 513px; } .countdown-timer.inner-pages { height: 20px; background-image: url(http://www.power2010.org.uk/page/-/images/assets/countdown-sprite3.png); width: 590px; height:90px; margin-bottom: 30px; position: absolute; top: -83px !important; right:-350px; } /* Sprites for Countdown Timer */ .image0 { background-position: 0 0; } .image1 { background-position: 0 -38px; } .image2 { background-position: 0 -75px; } .image3 { background-position: 0 -112px; } .image4 { background-position: 0 -150px; } .image5 { background-position: 0 -186px; } .image6 { background-position: 0 -223px; } .image7 { background-position: 0 -261px; } .image8 { background-position: 0 -297px; } .image9 { background-position: 0 -335px; } .sprite-power-2010-background { background-position: 0 -373px; } .vote-title { font-style: normal; width: 330px !important; display: block; line-height: 30px; } /* **************** TWEET FOR POWER2010 ***************** */ #tweet-for p { padding:15px; } /* **************** ABOUT PAGES ***************** */ .hide { display: none; } #declaration { height: 450px; } #masthead-dec { position: absolute; left: 330px; } .full-width #signup { width: 250px; position: absolute; top: 150px; right: 10px;} .no-float #signup { position: static !important; width: 350px ;} .full-width .declaration { position: absolute !important; top: 0px !important; right: 370px !important; width: 450px !important; } .vote ul { overflow: hidden; } .vote .left { float: left; text-align: center; margin-right: 15px; } .vote .num { font-size: 22px; font-weight: bold; } .vote .text { display: block; margin-top: -9px; } .votes p { margin-bottom: 14px; } .leader h3 a { line-height: 22px; } #cboxPrevious, #cboxNext, #cboxCurrent { display: none !important; } /* @end */ /* @group 06 =FRAMEWORK */ /* 06 =FRAMEWORK ---------------------------------------------------------- */ #disqus_thread { margin-top: 10px; } .dsq-brlink { display: none; } .dsq-item-trackback { display: none; } .pp-wrapper { position: relative; } .pp-wrapper a { display: block; position: absolute; width: 90px; height: 100px; text-indent: -999em; cursor: pointer; } #pp1 { top: 170px; left: 10px; } #pp2 { top: 170px; left: 102px; } #pp3 { top: 170px; left: 195px; } #pp4 { top: 170px; left: 287px; } #pp5 { top: 170px; left: 378px; } /* **************** TOOLS STYLES ***************** */ .tools { font-size: 13px; } .tools h2 { display:block; width:100%; } .field input { padding: 8px; margin-bottom: 10px; } .input { overflow: hidden; margin-right: 10px; background: #fff; padding: 8px;} #signup { width: 80%; } #signup table { width: 100%; } #signup #addr2 { display: none; } #invitationpage label, #signup label { background: none; margin-top: 10px; padding: 0; text-align: left; font-size: 13px; } #signup textarea { background: none; border: none; width: 100%;} #signup input { float:none !important; } #submit { text-align: left; } #submit input { width: auto !important; margin-top: 15px !important; padding: 10px; background: #f22d98 !important; border-color: #ff78c1; font-size: 15px !important; font-weight: bold; color: #25282b; margin-bottom: 10px;} #invite_table { width: auto !important; padding: 10px !important; background: #fff !important; margin-bottom: 15px ; } #invitationpage div { width: auto !important; overflow: hidden !important;} #invitationpage .label { padding-right: 15px; } #invitationpage label { width: auto !important; font-size: 13px !important; display: inline; } #to.contact_importer_email { width: auto !important; border: none; } #contact_importer_button_container { width: auto !important; margin-bottom:10px !important; } #contact_importer_button { margin: 0 !important; width: auto !important; padding: 8px !important; background: #f02995 !important; border: none !important; color: #25282b !important; } #invitationpage #submit_button { width: auto !important; padding: 8px !important; border-color: #ff78c1; background-color: #ee2391 !important; color: #25282b !important; margin-top: 10px;} .wrapper-submit { width: 120px; } .wrapper-submit input { background-color: #ee2391 !important; color: #25282b !important; border: 0; font-weight: bold; } .checkbox input { float: right !important; width: 30px; } .checkbox label { float: ; clear: left; width: auto; display: inline; color: #444; font-weight: bold; } /* speakout */ table#recipient_table { border-right: 1px dashed #666; } form#speakout_form table.step tr.recipient-header th { background:none !important; border:none !important; } #help-1 p { margin:5px 0 0 0 !important; color:#000 !important; font-size:12px !important; } ul#tip-tabs li.tip-off { color:#fff !important; } form#speakout_form table.step label { display:inline-block; background: none; color:#fff !important; } ul#nav-tabs { margin:0px 0px 0px !important; border-bottom:0px !important; } form#speakout_form td.tips div.tip-content { margin:5px 0 0 !important; padding:5px 5px !important; } ul#tip-tabs { height:22px !important; } div#speakout form#participate table { background:none !important; border:0px !important; } div#speakout table#landing div.goal div table td { color:#fff !important; } .goal-frame h3, .goal-frame td p, .goal-frame td b, div#speakout table#landing div.goal .goal-frame tr td { color: #333 !important; } .module_event2 .main { background: #fff; } .module_event2 #account_actions a, .module_event2 #account_actions { color: #f6399f; } .module_event2 .form_label, p.instructions, .module_event2 td, .module_event2 div, .module_event2 select, .module_event2 input { color: #292929 !important; } .module_event2 select { margin-bottom: 10px; border: 1px solid #ccc; } .module_event2 .buttonImage { width: 20px; padding: 0; border: none !important; } .module_event2 input, .module_event2 textarea { border: 1px solid #b9b9b9 !important; padding: 8px; width: 30%; margin-bottom: 10px; } .module_event2 #qf_bfe79c { width: auto; position: relative; left:-350px; } .module_event2 input.submit { background: #f02995; cursor: pointer; } .module_event2 a { color: #f02995 !important; } .module_event2 #control_set { background: none !important; } .module_event2 h1 { margin-right: 15px !Important; color: #fff !important; } .module_event2 h2 { color: #2c2d2e !important; border-bottom: 1px solid !important; border-color: #f02995 !important; } .module_event2 .rsvp_button a { color: #fff !important; } .module_event2 #detailtable * { font-size: 14px; } #rsvp_container { position: relative; } .module_event2 #event_rsvp { position: relative; /* left: -550px; */ float: left; top:40px; margin-bottom: 40px; } @-moz-document url-prefix() { .module_event2 #event_rsvp { left: -550px; } } .module_event2 #eventcreate #event_rsvp { position: static !important; background: #fff; float: none; } .module_event2 #eventcreate #event_rsvp .submit { width: auto !important; } #constituent .logintitle { color: #fff !important; margin: 0 !important; } #constituent #login table { margin: 0 !important; margin-top: 10px !important; color: #333; padding: 15px ; } #constituent #login table input { padding: 8px !important; width: auto !important; background:; display: static; } #constituent #login table label { display: none !important; } #login_status { color: #fff; } .checkbox .text { float: left !important; margin-top: 5px; } #qf_d9997c { display: none !important; } #constituent #signupform { color: #333 !important; } #constituent #signupform input { color: #333 !important; padding: 8px; width: 200px; margin-bottom: 10px; } .signuptitle { color: #fff !important; margin: 0 !important; } #constituent #signupform table { margin: 0; margin-top: 10px; } /* @end */ /* @group 07 =UTILITY */ /* 07 =UTILITY ---------------------------------------------------------- */ /* **************** GRID ***************** */ .container_3 { margin-left: auto; margin-right: auto; width: 969px; } .grid_1, .grid_2, .grid_3 { display:inline; float: left; position: relative; margin-left: 4px; margin-right: 4px; } .alpha { margin-left: 0; } .omega { margin-right: 0; } .container_3 .grid_1 { width:314px; } .container_3 .grid_2 { width:637px; } .container_3 .grid_3 { width:960px; } .image-left { margin-right: 10px; margin-bottom: 10px; } /* **************** BLOCK STRUCTURES ***************** */ /* mod */ .mod { padding: 6px; margin-bottom:8px; position: relative;} .grid_1 .mod {padding: 19px 17px; } .grid_2 .mod, .main-content .grid_3 .mod {padding: 19px 21px; } label span { display: none; } .mod .inner{/*background: url(skin/transparent.png) repeat left top;*/} .hd,.bd,.ft{overflow:hidden;} .inner{position:relative;} .stretcher { clear: both; height: 1px; visibility: hidden; } .nomargin { margin-bottom: 0px; } .floatl {float: left; margin: 0; padding: 0 10px 10px 0;} .floatr {float: right; margin: 0; padding: 0 0 10px 10px;} .floatl-nomargin { float: left; margin: 0; padding: 0;} .floatr-nomargin { float: right; margin: 0; padding: 0;} .clear {clear:both; height:0; margin:0; font-size: 1px; line-height: 0;} .required { color: red; } label span.required { display:inline !important; } i, em { font-style: italic; } b, strong { font-weight: bold; } sup, sub { height: 0; line-height: 1; vertical-align: baseline; _vertical-align: bottom; position: relative;} sup { bottom: 1ex; } sub { top: .5ex; } .clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } .clearfix {display:inline-block;} .clearfix {display:block;} table#landing { clear:left !important; } #speakout form { background: none !important; } #speakout input, #speakout label { color: #000 !important } #speakout .wrapper-submit #zip { background: #fff !important; } #speakout #recipient_table { margin-right: 10px; padding-right: 10px !important;} #speakout #recipient_table td { color: #333 !important; text-align: center; vertical-align: middle; } #speakout #recipient_table input[type=checkbox] { float: none !important; display: inline !important; background: none !important;} #speakout #recipient_table .recipient-divider { display: none; } #speakout #recipient_table th { text-align: center !important; padding-right: 8px; padding-bottom: 10px;margin-bottom: 10px !important; color: #a6a7a7; font-weight: bold; font-size: 9px !important; } #speakout #recipient_table .recipient-header { border-top: 1px solid #fff !important; } #speakout #recipient_table td.stat { color: #fff !important; } #speakout #nav-tabs li { color: #333 !important; } #speakout #nav-tabs li.tab-on { color: #fff !important; } #speakout #address_table label { width: auto !important; display: inline !important; } .logindesc { color: #333; } #loginform th { color: #333; float: left; } #loginform .checkbox label { background: none; width: 100px !important; float: left; } #loginform #remember_me { float: left !important; clear: left !important; } #loginform #username { width: auto; } #loginform input { padding: 5px; } #speakout .splash { color: #ccc; } /* @end */ div.tooltip { background-color: #000; border: 1px solid #fff; padding: 10px 15px; width: 200px; display: none; color: #fff; text-align: left; font-size: 12px; -moz-box-shadow: 0 0 10px #000; -webkit-box-shadow: 0 0 10px #000; z-index: 20; } .entry { width: 511px; height: 259px; position: relative; background: red; overflow: hidden; background: url(http://www.power2010.org.uk/page/-/where-do-they-stand/img/form-bg.png) center top no-repeat; } .entry h2 { display: none; } .entry p { color: #d7d7d7; font-size: 12px; line-height: 16px; text-align: center; margin-top: 100px; } .entry label { display: none; } .entry input { border: none; font-size: 15px; color: #b1b1b1; font-weight: bold; position: absolute; background: none; outline: none; } .entry input.err { background: url(http://www.power2010.org.uk/page/-/where-do-they-stand/img/no.png) no-repeat right; } .entry input.ok { background: url(http://www.power2010.org.uk/page/-/where-do-they-stand/img/yes.png) no-repeat right; } .entry #email { top: 145px; left: 223px; padding: 10px; width: 221px; } .entry #postcode { top: 145px; left: 40px; padding: 10px; width: 147px; } .entry #entry_submit { cursor: pointer; background: none; border: none; font-size: 0px; line-height: 0px; text-indent: -999em; width: 194px; height: 50px; position: absolute; top: 201px; left: 159px; }