/* -------------------------------------------------------------- project ONE.org (www.one.org) ABOUT style sheet author: HUGE last updated: 2009.02.09 ----------------------------------------------------------- */ /* ---------- About Hero top ---------- */ #landing-hero{ position:relative; width:920px; height:48px; padding-top:302px; margin:30px 0; } #landing-hero h1{ width:163px; height:42px; background:url(../img/about/title-our-story.png); text-indent:-9999px; position:absolute; top:10px; left:20px; } /* ----------- About Landing hero images ----------- */ .landing-hero-1{ background:url(../img/about/bg-landing-hero-img-1.jpg); } h1.our-partners{ height:67px; width:504px; background:url(../img/about/title-our-partners.gif); } /* ---------- Introduction to ONE ---------- */ #one-intro{ padding-bottom:40px; background:url(../img/lines-hatches/cr-hatch-bl.gif) repeat-x 0 100%; } #one-intro h2{ background:url(../img/about/sprite-landing-titles.gif) no-repeat; height:26px; margin-bottom:20px; text-indent:-9999px; } #one-intro .what{ background-position:0 -26px; } #one-intro .how{ background-position:0 -52px; } #one-intro p{ line-height:125%; margin-bottom:15px; } #one-intro ul{ margin-bottom:-8px; } #one-intro ul li{ margin-bottom:8px; } #one-intro ul li a{ background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 50%; padding:0 0 0 10px; color:#0099ff; } /* ---------- Archive Hero ---------- */ #archive-hero{ height:230px; background:no-repeat 0 100%; padding:38px 0 0 320px; } #archive-hero h1{ font-size:2em; font-weight:700; text-transform:uppercase; margin-bottom:8px; } #archive-hero p{ font-size:1.16em; line-height:135%; padding-right:45px; } #archive-hero p.dates{ margin-bottom:15px; color:#666; } #archive-hero ul{ width:100%; margin-top:17px; color:#ccc; font-size:1.05em; } #archive-hero ul li{ float:left; display:inline; padding-right:5px; } #archive-hero ul li a{ color:#0099FF; } /* ----------Signup panel ---------- */ #pnl-signup{ height:38px; background:url(../img/about/bg-pnl-signup.png); width:880px; height:38px; margin:0 auto; } #pnl-signup form{ position:relative; display:block; padding-left:300px; } #pnl-signup label{ color:#fff; text-transform:uppercase; font-weight:700; float:left; display:inline; padding:14px 10px 0 0; font-size:0.9em; } #pnl-signup .text{ float:left; display:inline; margin:8px 20px 0 0; width:120px; } #pnl-signup .rollover{ margin-top:7px; } #pnl-signup .why{ position:absolute; top:9px; left:854px; _left:554px; width:18px; height:18px; background:url(../img/icons/ico-why.png); text-indent:-9999px; } #pnl-signup .why:hover{ cursor:hand; background-position:-18px 0; } /* ----------- Our Partners ----------- */ #interest-promo{ position:relative; width:88px; height:128px; padding:28px 0 0 101px; text-align:center; background:url(../img/about/bg-interest-girl.jpg) no-repeat; margin-left:760px; margin-top:-132px; font-weight:700; } #page #interest-promo a{ display:block; margin-top:4px; color:#FFF; } #interest-promo.hover a{ text-decoration:underline; } #partners-list{ position:relative; background:url(../img/lines-hatches/cr-hatch-bl.gif) repeat-x; padding-top:20px; } /*ADDED*/#partners-top_partners{ position:relative; padding-top:20px; border-top:5px solid #311913; } /*ADDED*/ /*ADDED*/#partners-list-featured{ position:relative; background:url(../img/lines-hatches/cr-hatch-bl.gif) repeat-x; padding-top:1px; padding-bottom:10px; }/*ADDED*/ /* ----------- Partner Filter ----------- */ .partners-filter{ text-align:right; padding-bottom:10px; font-weight:700; color:#000; } /*ADDED*/.partners-filter-left{ text-align:left; padding-bottom:10px; font-weight:normal; color:#000; }/*ADDED*/ /*ADDED*/.partners-filter-left H3{ font-weight:700; font-size:1.4em; margin-bottom:10px; margin-top:5px;}/*ADDED*/ .partners-filter p{ float:left; margin-top:3px; } .partners-filter form{ float:right; font-size:0.9em; } .partners-filter label{ _margin-top:-14px; zoom:1; } .partners-filter form select{ margin-left:5px; } /* ----------- Structure for both large and small partners ----------- */ .partner-row{ background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x; padding:20px 0; } .partner-row .wrap{ background:no-repeat 50% 50%; } .partner-row a{ display:block; text-indent:-9999px; } .partner-row a.hover, .partner-row a:hover{ margin:0; border:5px solid #0099ff; } #page .partner-row .last{ background:none; padding-right:0; } .partner-row .unit{ background:url(../img/lines-hatches/dot-line-vert-gray.gif) repeat-y 100% 0; float:left; display:inline; } .pr-lrg .unit div{ margin:0 50px; } .pr-lrg a{ width:190px; height:140px; } .pr-lrg .unit .wrap{ height:150px; } .pr-lrg .unit .wrap .desc{ display:none; } .pr-lrg .unit{ width:300px; height:150px; overflow:hidden; } #page .pr-lrg .mid{ padding:0 10px; } .pr-med a{ width:110px; height:90px; } .pr-med .unit{ width:120px; height:100px; padding:0 20px; overflow:hidden; } .pr-med .unit .wrap{ height:100px; } .pr-med .first{ padding:0 20px 0 0; width:120px; } .pr-med .last{ width:120px; } /* Lots of background images for partners - large and medium */ /*CAMBIE IMAGENES*/ .pr-lrg .bread-world{ background-image:url(../img/partners/beadforlife/logo-beadforlife-lrg.gif); } .pr-med .bread-world{ background-image:url(../img/partners/beadforlife/logo-beadforlife-med.gif); } .pr-lrg .care{ background-image:url(../img/partners/care/logo-care-lrg.gif); } .pr-med .care{ background-image:url(../img/partners/care/logo-care-med.gif); } .pr-lrg .evangelicallutheranchurchofamerica{ background-image:url(../img/partners/evangelicallutheranchurchofamerica/logo-elca-lrg.gif); } .pr-med .evangelicallutheranchurchofamerica{ background-image:url(../img/partners/evangelicallutheranchurchofamerica/logo-elca-med.gif); } .pr-lrg .islamicrelief{ background-image:url(../img/partners/islamicrelief/logo-islamicrelief-lrg.gif); } .pr-med .islamicrelief{ background-image:url(../img/partners/islamicrelief/logo-islamicrelief-med.gif); } .pr-lrg .oxfamamerica{ background-image:url(../img/partners/logo-naacp-lrg.gif); } .pr-med .oxfamamerica{ background-image:url(../img/partners/logo-naacp-lrg.gif); } .pr-lrg .red{ background-image:url(../img/partners/red/logo-red-lrg.gif); } .pr-med .red{ background-image:url(../img/partners/red/logo-red-med.gif); } .pr-lrg .results{ background-image:url(../img/partners/results/logo-results-lrg.gif); } .pr-med .results{ background-image:url(../img/partners/results/logo-results-med.gif); } .pr-lrg .savethechildren{ background-image:url(../img/partners/savethechildren/logo-savethechildren-lrg.gif); } .pr-med .savethechildren{ background-image:url(../img/partners/savethechildren/logo-savethechildren-med.gif); } .pr-lrg .sojourners{ background-image:url(../img/partners/sojourners/logo-sojourners-lrg.gif); } .pr-med .sojourners{ background-image:url(../img/partners/sojourners/logo-sojourners-med.gif); } .pr-lrg .unionofreformjudaism{ background-image:url(../img/partners/unionofreformjudaism/logo-unionofreformjudaism-lrg.gif); } .pr-med .unionofreformjudaism{ background-image:url(../img/partners/unionofreformjudaism/logo-unionofreformjudaism-med.gif); } .pr-lrg .usdoctorsforafrica{ background-image:url(../img/partners/usdoctorsforafrica/logo-usdoctorsforafrica-lrg.gif); } .pr-med .usdoctorsforafrica{ background-image:url(../img/partners/usdoctorsforafrica/logo-usdoctorsforafrica-med.gif); } .pr-lrg .womenthriveworldwide{ background-image:url(../img/partners/womenthriveworldwide/logo-womenthrive-lrg.gif); } .pr-med .womenthriveworldwide{ background-image:url(../img/partners/womenthriveworldwide/logo-womenthrive-med.gif); } .pr-lrg .worldvision{ background-image:url(../img/partners/worldvision/logo-worldvision-lrg.gif); } .pr-med .worldvision{ background-image:url(../img/partners/worldvision/logo-worldvision-med.gif); } .pr-lrg .mercycorps{ background-image:url(../img/partners/mercycorps/logo-mercycorps-lrg.gif); } .pr-med .mercycorps{ background-image:url(../img/partners/mercycorps/logo-mercycorps-med.gif); } .pr-lrg .interaction{ background-image:url(../img/partners/interaction/logo-interaction-lrg.gif); } .pr-med .interaction{ background-image:url(../img/partners/interaction/logo-interaction-med.gif); } .pr-lrg .malarianomore{ background-image:url(../img/partners/malarianomore/logo-mnm-lrg.gif); } .pr-med .malarianomore{ background-image:url(../img/partners/malarianomore/logo-mnm-lrg.gif); } .pr-lrg .naacp{ background-image:url(../img/partners/logo-naacp-lrg.gif); } .pr-med .alliance-hunger{ background-image:url(../img/partners/logo-alliance-hunger-med.gif); } .pr-med .arc{ background-image:url(../img/partners/logo-arc-med.gif); } .pr-med .ribbon{ background-image:url(../img/partners/logo-ribbon-med.gif); } .pr-med .bridges-prosperity{ background-image:url(../img/partners/logo-bridges-prosperity-med.gif); } .pr-med .child-health{ background-image:url(../img/partners/logo-child-health-med.gif); } .pr-med .doctors-world{ background-image:url(../img/partners/logo-doctors-world-med.gif); } .pr-med .engineers{ background-image:url(../img/partners/logo-engineers-med.gif); } .pr-med .emergent{ background-image:url(../img/partners/logo-emergent-med.gif); } /* ----------- Tooltips for Partner logos ---------- */ .tooltip{ z-index:99; position:absolute; top:0; left:0; text-align:left; } .tooltip .top{ padding:32px 24px 10px 24px; *padding-bottom:0; line-height:125%; } #tooltip-lrg{ width:348px; } #tooltip-sml{ width:253px; } #tooltip-lrg .top{ background:url(../img/about/tt-partners-lrg-top.png) no-repeat; *height:1%; } #tooltip-sml .top{ background:url(../img/about/tt-partners-sml-top.png) no-repeat; *height:1%; } .tooltip a{ color:#0099ff; font-weight:700; } .tooltip a:hover{ color:#000; text-decoration:none; } .tooltip .desc{ line-height:133%; } .tooltip .desc a{ position:relative; font-size:1.16em; } .tooltip .desc a:hover{ text-decoration:underline; color:#0099ff; } .tooltip .news{ font-size:0.9em; } .tooltip .news h4{ text-transform:uppercase; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x; margin:10px 0 5px 0; padding-top:10px; } .tooltip .news ul{ margin-bottom:-4px; *height:1%; } .tooltip .news ul li{ margin-bottom:4px; *height:1%; } .tooltip .news ul a{ position:relative; display:block; font-weight:400; background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 5px; padding-left:10px; } .tooltip .news ul a:hover{ color:#0099FF; text-decoration:underline; } #tooltip-lrg .btm{ background:url(../img/about/tt-partners-lrg-btm.png) no-repeat; height:29px; } #tooltip-sml .btm{ background:url(../img/about/tt-partners-sml-btm.png) no-repeat; height:29px; }/* -------------------------------------------------------------- project ONE.org (www.one.org) ACT NOW style sheet author: HUGE last updated: 2009.02.09 ----------------------------------------------------------- */ /* ---------- The main 'Act Now' title and intro text */ .land-title{ width:253px; height:56px; background:url(../img/act-now/title-landing.gif); margin-bottom:15px; } .land-intro{ font-size:1.33em; margin-bottom:0; } /* ---------- Actions Overview ----------*/ .actions-ov{ position:relative; background-repeat:no-repeat; padding:35px 0 0 86px; margin-left:-120px; } .supporter-2{ background-image:url(../img/act-now/supporter-2.jpg); } /* ---------- Basic styles for Act Now Landing items ----------*/ .actions-ov .item{ float:left; display:inline; width:280px; margin:0 0 26px 38px; } .actions-ov .status{ padding-left:98px; width:180px; } .actions-ov .status .user-status{ font-size:0.9em; } /* ---------- The 2 column hero action is slightly different. ----------*/ .mod-hero-action h2 { border-bottom:1px solid #CCCCCC; color:#000000; font-size:1.33em; font-weight:700; height:7px; _overflow:hidden; margin:3px 0 30px; text-align:center; text-transform:uppercase; } .mod-hero-action h2 span { position:relative; background:#FFFFFF; padding:1px 10px; text-align:center; } .mod-hero-action .content h3{ font-size:1.5em; margin:2px 0; } .mod-hero-action .desc-wrap{ width:280px; padding-left:245px; } .mod-hero-action .desc-wrap p.desc{ position:relative; float:none; display:block; width:auto; margin:10px 0 15px 0; font-size:1.16em; line-height:125%; } .mod-hero-action .date{ text-transform:uppercase; display:block; margin-top:5px; color:#666; font-size:1.1em; } /* ---------- Act Now Landing, when user is logged out ----------*/ .mod-tell-friend p.desc{ float:none; display:block; width:auto; margin:0 0 15px 0; } #signup-form .signup-email{ width:174px; } #tell-friend-form{ margin:12px 0 20px; } #tell-friend-form .text{ width:200px; margin-bottom:10px; } #signup-form label, #tell-friend-form label{ text-transform:uppercase; display:block; font-weight:700; margin-bottom:3px; font-size:0.9em; } #signup-form .submit{ margin-bottom:20px; } /* ---------- Act Now Landing, when user is logged in ----------*/ .title-sign-up{ width:180px; height:43px; background:url(../img/act-now/title-sign-up.gif); text-indent:-9999px; margin-bottom:20px; } .title-welcome-back{ width:178px; height:74px; background:url(../img/act-now/title-welcome-back.gif); text-indent:-9999px; margin-bottom:20px; } .actions-ov .status .intro-text{ font-size:1.16em; margin-bottom:15px; line-height:120%; } .actions-ov .status .intro-text span{ display:block; font-size:1.16em; font-weight:700; color:#000; } /* ---------- On an action page, the sub-content column (left hand side) ---------- */ #action .sub-content{ background-repeat:no-repeat; padding-top:370px; } #action .sub-content h2{ text-transform:uppercase; font-size:1.33em; font-weight:700; margin-bottom:20px; } #action .sub-content p{ font-size:1.16em; line-height:125%; } /*---------- The introductory title, description and progress bar ---------- */ .action-intro{ background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x 0 100%; padding-bottom:30px; margin-bottom:20px; } .action-intro-no-bdr{ background:none; margin-bottom:10px; } .action-intro h1{ text-transform:uppercase; font-size:2.5em; font-weight:700; letter-spacing:-1px; margin-bottom:5px; } .action-intro span{ text-transform:uppercase; font-size:1.16em; color:#666; } .action-intro .action-summary{ color:#999; font-size:1.33em; letter-spacing:-1px; margin-bottom:20px; } .action-intro .action-progress{ margin-right:12px; } .action-progress{ position:relative; float:left; display:inline; width:280px; height:30px; } .action-progress .bar{ width:0; height:23px; background:url(../img/act-now/bg-petition-progress-ylw.gif); text-align:right; font-size:1.5em; color:#000; padding:6px 5px 0 0; } .action-progress .container{ position:absolute; top:0; left:0; width:280px; height:30px; background:url(../img/act-now/petition-progress-container.png) no-repeat; } .action-status{ line-height:125%; } .action-progress .user-pointer{ color:#000; text-align:center; font-weight:700; text-transform:uppercase; font-size:0.9em; width:36px; height:14px; padding:15px 0 0 0; background:url(../img/act-now/bg-petition-progress-user.png) no-repeat; position:absolute; top:24px; left:36px; } /*---------- The additional information JS-based accordions ---------- */ .additional-info{ color:#000; *height:1%; } .additional-info h3{ background:url(../img/icons/ico-square-expand-off.gif) no-repeat 575px 50% #e5e5e5; margin-bottom:2px; text-transform:uppercase; font-weight:700; cursor:hand; cursor:pointer; } .additional-info h3 a:hover{ display:block; background:url(../img/icons/ico-square-expand-on.gif) no-repeat 575px 50% #e5e5e5; color:#000; } .additional-info h3.active{ background:url(../img/icons/ico-square-collapse-off.gif) no-repeat 575px 50% #e5e5e5; } .additional-info h3 a{ text-decoration:none; padding:10px; display:block; position:relative; } .additional-info h3 a:hover{ background:url(../img/icons/ico-square-expand-on.gif) no-repeat 575px 50% #e5e5e5; } .additional-info h3.active a:hover{ background:url(../img/icons/ico-square-collapse-on.gif) no-repeat 575px 50% #e5e5e5; } .additional-info .slider div{ padding:10px 10px 0 10px; line-height:125%; } .additional-info p{ margin-bottom:15px; } .additional-info ul{ list-style-type:disc; padding:0 0 20px 15px;} /*---------- The petition introduction ---------- */ .petition-wrap{ background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x 0 100%; padding-bottom:30px; margin-bottom:20px; } .petition-desc, .petition-form{ float:left; display:inline; } .petition-desc{ width:320px; margin-right:40px; } .petition-desc p.desc{ font-size:1.16em; margin-bottom:18px; line-height:125%; } .petition-desc p.desc span{ display:block; margin-bottom:20px; font-weight:700; } .petition-form{ width:240px; } #action .content h2{ text-transform:uppercase; margin-bottom:20px; font-weight:700; font-size:1.33em; } .petition-wrap h2 span.not-user{ display:block; padding-top:3px; font-weight:400; font-size:0.73em; text-transform:none; } .petition-wrap h2 span.not-user a{ color:#0099FF; } /*---------- The petition form ---------- */ #action label { text-transform:uppercase; font-weight:700; color:#000; display:block; margin-bottom:3px; } #action .text { width:230px; margin-bottom:10px; } #action .petition-desc textarea{ width:310px; height:100px; } #action .petition-form textarea{ width:230px; height:100px; margin-bottom:20px; } #action .petition-wrap .zip-code { width:88px; margin-bottom:20px; } #action .petition-wrap label .req{ color:#0099ff; font-size:1.1em; } #action .petition-wrap label .opt{ color:#666; text-transform:none; font-weight:400; } /* ---------- Act now - steps ---------- */ .act-steps{ width:600px; height:58px; background:url(../img/act-now/bg-act-steps.gif); margin-bottom:40px; } .act-steps li{ font-size: 0.9em; float:left; display:inline; width:120px; margin-left:80px; padding-top:18px; height:40px; text-transform:uppercase; } .act-steps li.first{ margin-left:50px; } .act-steps li span{ font-size:2.8em; float:left; display:inline; margin:-4px 10px 0 0; font-weight:700; } .act-steps li.complete{ color:#0099FF; } .act-steps a{ color:#0099ff; display:block; } .act-steps a:hover{ text-decoration:none; color:#000; } /* ---------- Act - Compose Letter ---------- */ .act-compose p{ line-height:125%; margin-bottom:15px; } #action .reset-labels label{ display:inline; text-transform:none; font-weight:400; } .act-compose textarea{ width:520px; height:180px; margin-bottom:10px; line-height:115%; } /* ---------- Act - Options ---------- */ .act-controls{ background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x; padding-top:20px; margin-top:30px; } .act-controls input{ float:right; margin-top:1px; } .act-controls .previous-step{ background:url(../img/icons/ico-previous-arrow-off.gif) no-repeat; float:left; display:block; padding:9px 0 10px 37px; } .act-controls .previous-step:hover{ background:url(../img/icons/ico-previous-arrow-on.gif) no-repeat; text-decoration:none; color:#0099FF; } /* ---------- News summary (Policy Landing Page ----------*/ .news-summary .desc{ width:486px; } /* ---------- Recorded Action page ---------- */ #recorded-action-hero{ height:223px; background-position:29px 100%; background-repeat:no-repeat; padding:40px 0 0 316px; } #recorded-action-hero h1{ font-size:2.5em; font-weight:700; text-transform:uppercase; margin-bottom:4px; } #recorded-action-hero .summary{ font-size:1.16em; color:#666; margin-bottom:30px; } /* ---------- Top container on Recorded Action page ---------- */ .status-container{ width:604px; } .status-container .top { background:url(../img/act-now/status-container-top.gif); height:5px; overflow:hidden; } .status-container .content{ padding:8px 0 8px 23px; background:url(../img/act-now/status-container-rep.gif) repeat-y; } .status-container .btm{ background:url(../img/act-now/status-container-btm.gif); height:5px; overflow:hidden; } .status-container table{ float:left; display:inline; margin-right:14px; } .status-container table th{ width:72px; text-transform:uppercase; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; font-size:0.9em; font-weight:700; color:#999; padding:7px 0; } .status-container table td{ background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; width:188px; color:#000; font-size:1.16em; } .status-container table tr.dates th, .status-container table tr.dates td{ border:0; } .status-container table tr.dates span{ font-size:0.8em; text-transform:uppercase; } .status-container .sec-name{ margin-top:7px; } .status-container .action-progress-wrap{ float:left; display:inline; background:url(../img/lines-hatches/dot-line-vert-gray.gif) repeat-y; padding-left:12px; height:75px; } /* ---------- Custom styles for peitition status inside the Milestones module ---------- */ .mod-milestones .petition-status{ padding-top:10px; } #page .mod-milestones .petition-status ul{ position:relative; clear:left; margin:0; } #page .mod-milestones .petition-status ul li{ float:left; display:inline; clear:none; font-size:0.9em; margin:0 5px 0 0; font-weight:400; } .mod-milestones .petition-status ul li a{ margin-right:5px; color:#0099ff; } .mod-milestones .action-progress{ margin-bottom:15px; } /* ---------- Campaign All Stars title ---------- */ .title-campaign-as{ width:273px; height:25px; background:url(../img/act-now/title-campaign-all-stars.gif); margin-bottom:10px; text-indent:-9999px; } /*For Paragraphs inside the squares*/ /*added*/ .act-now { line-height:120%; margin-bottom:10px; } /*added*/ /* ----------- Error handling -------------------- */ #signup-form label.error, #signup-form input.error, #signup-form p.error, #act-now p.error, #act-now label.error { color: red; font-weight: bold } #signup-form p.error, #act-now p.error { padding-bottom: 1em; } #act-now .tellafriend-form p.error { padding-bottom: 0; } /* ---------- Hot topics ---------- */ .hot-topics{ position:relative; zoom:1; background:url(/c/media/img/lines-hatches/cr-hatch-bl.gif) repeat-x 0 100%; padding-bottom:9px; margin-bottom:26px; } .hot-topics .sticker{ position:absolute; top:-5px; left:190px; } .hot-topics .unit{ width:238px; padding:0 1px 0 0; height:148px; } .hot-topics .first,.hot-topics .last{ width:220px; } .hot-topics span{ text-transform:uppercase; font-size:0.9em; font-weight:700; color:#999; } .hot-topics h2 { text-transform:uppercase; font-weight:700; font-size:1.33em; padding:1px 0 10px 0; background:url(/c/media/img/lines-hatches/dot-line-horiz.gif) repeat-x 0 100%; } #page .hot-topics .more-link { margin:-20px 0 0 0; padding-bottom:20px; } .hot-topics .topic{ position:relative; height:148px; background-position:0 100%; background-repeat:no-repeat; } .topic h3 { font-size:1.6em; font-weight:700; padding:0 0 0 20px; } .topic h3 a { display:block; _height:1%; background:url(/c/media/img/icons/ico-more-arrow-lrg-off.gif) no-repeat 0 2px; padding:0 0 0 21px; } .hot-topics .hover h3 a, .hot-topics .topic h3 a:hover { text-decoration:none; color:#0099ff; background:url(/c/media/img/icons/ico-more-arrow-lrg-on.gif) no-repeat 0 2px; } .topic p { visibility:hidden; padding:20px 20px 0 20px; line-height:133%; } .topic p a { font-size:0.83em; } .hot-topics .hover p { visibility:visible; } .hot-topics .hover { background: none !important; } /* To generate combined.css: ls ~/dev/www/us/css/*.css | grep -ve global -ve admin -ve blog | sort | xargs cat > ~/dev/py/wawd/media/css/combined.css cat ~/dev/www/us/css/safe-global.css >> ~/dev/py/wawd/media/css/combined.css */ /* --------------------------------------------------------- project ONE.org (www.one.org) CONTENT style sheet - stylesheet to be applied to article-based content author: HUGE last updated: 2009.02.09 ------------------------------------------------------ */ /* ---------- Top section title ---------- */ #section-title { border-bottom:1px solid #ccc; margin:3px 0 24px; height:7px; _overflow:hidden; text-transform:uppercase; color:#000; text-align:center; } #section-title span { position:relative; text-align:center; padding:1px 10px; background:#fff; letter-spacing:-1px; } /* Special rules for article-based content - defines paragraphs, titles, captions etc, keeps it scoped to individual templates */ .article-wrap .sticker { position:absolute; top:-25px; left:542px; } .content h1 { width:488px; text-align:center; font-size:2.33em; font-weight:700; line-height:115%; margin:0 auto 13px; letter-spacing:-1px; word-spacing:-1px; } .article-pad{ padding:20px 0 10px 0; } .article p, .article dt, .article dd{ line-height:133%; } .article p{ margin-bottom:20px; } .article p.intro, .article-intro p{ font-size:1.16em; line-height:120%; } .article dl{ position:relative; zoom:1; padding-top:16px; padding-bottom:5px; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x; } .article dt{ font-weight:700; float:left; display:inline; width:130px; padding-right:15px; text-align:right; } .article dd{ float:left; display:inline; width:445px; } .dl-hr{ position:relative; clear:both; display:block; height:29px; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 50%; } *span.dl-hr{ width:600px; margin-left:-145px; } .article-wrap .tags{ margin-top:15px;} .content cite, .content h3 { display:block; font-weight:700; color:#000; font-size:1.33em; margin-bottom:10px; font-style:normal; } /* ---------- Drop Cap styles ---------- */ .first-letter { position:relative; display:block; float:left; font-size:6em; margin:-4px 0 10px; font-weight:700; width:50px; color:#000; } .drop-cap .first-para { width:530px; float:left; display:inline; } .drop-cap .first-word { color:#000; font-weight:700; } .big-quote { float:left; display:inline; width:31px; height:27px; background:url(../img/content/quotes-lrg.gif); text-indent:-9999px; margin:3px 10px 0 0; } /* ---------- Large quotes ---------- */ .quote-lrg { display:block; } .content .caption { display:block; line-height:125%; background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x 0 100%; padding:2px 0 5px; font-size:0.9em; text-align:right; margin-bottom:25px; color:#666; } /* ---------- Article image and captions ---------- */ .art-img { display:inline; width:200px; border-bottom:6px solid #ccc; } .art-img img { margin-top:4px; } .art-image-l { float:left; margin:0 20px 10px 0; } .content .art-img .caption { padding:10px 0; background:none; margin:0; text-align:left; } /* ---------- Article author and date info ---------- */ .content h2.author, .content p.date-info { text-align:center; font-size:0.83em; text-transform:uppercase; margin:0; } .content h2.author { margin:5px 0 25px; } .content h2.author a { color:#0099FF; }/* --------------------------------------------------------- project ONE.org (www.one.org) HOME style sheet author: HUGE last updated: 2009.02.09 ------------------------------------------------------ */ /* ---------- Carousel ---------- */ .jcarousel-container { margin-left:-258px; } .jcarousel-item { width:480px; height:350px; background:url(../img/lines-hatches/dot-line-vert.gif) repeat-y 100% 0; } /*.jcarousel-next, .jcarousel-prev{ width:50px; height:50px; position:absolute; top:170px; } .jcarousel-next { background:url(../img/home/btn-carousel-next.png); left:899px; } .jcarousel-prev { background:url(../img/home/btn-carousel-prev.png); left:-28px; } .jcarousel-next:hover, .jcarousel-prev:hover { background-position:0px 0; } */ #carousel-wrap { position:relative; overflow:hidden; width:920px; margin-bottom:0px; } #carousel { overflow:hidden; width:920px; height:286px; padding:0px 0 30px; background:url(../img/lines-hatches/cr-hatch-bl.gif) repeat-x 0 100%; } #carousel .item, #carousel .pnl-event { position:relative; width:440px; height:158px; padding-top:192px; margin-left:20px; } #carousel .desc-wrap { padding:40px 20px 0; width:360px; height:96px; margin-left:20px; background:url(../img/home/bg-caro-desc.png); } #carousel .desc { position:relative; } #carousel .item h2, #carousel .pnl-event h2 { position:relative; font-weight:700; font-size:2.3em; letter-spacing:-1px; line-height:1.1em; margin-bottom:12px; height:64px; } #carousel .action .desc h2 { height:32px; } #carousel .item h2 a, #carousel .pnl-event h2 a { position:relative; z-index:200; color:#fff; } #carousel .item h2 a:hover, #carousel .pnl-event h2 a:hover { position:relative; color:#1ec7ff; text-decoration:none; } #carousel .lbl { position:absolute; top:-40px; left:0; height:22px; } #carousel .lbl a{ display:block; height:22px; text-indent:-9999px; } #carousel .lbl-act-now { width:52px; background:url(http://www.one.org/us/img/home/lbl-partners.png); } /* #carousel .desc .issues { width:62px; background:url(../img/home/lbl-the-issues.png); } #carousel .desc .lbl-blog { width:52px; background:url(http://www.one.org/us/img/home/lbl-blog.png); } #carousel .desc .lbl-partners { width:52px; background:url(http://www.one.org/us/img/home/lbl-partners.png); } #carousel .desc .lbl-policy { width:52px; background:url(http://www.one.org/us/img/home/lbl-policy.png); } */ /* ---------- Act now panel - activated on button click ---------- */ #carousel .pnl-event{ display:none; padding:0; width:400px; padding:20px; height:310px; background:url(../img/lines-hatches/cr-hatch-light-gray.gif); } #carousel .pnl-event form{ position:relative; background:#8c8c8c; padding:40px 20px 0; height:270px; color:#fff; } #carousel .pnl-event .summary{ font-size:14px; margin-bottom:15px; } #carousel .pnl-event label{ display:block; font-size:0.9em; padding-bottom:3px; } #carousel .pnl-event select{ margin-bottom:10px; } #carousel .pnl-event input.text{ margin-bottom:20px; width:90px; } #carousel .pnl-event .lbl{ top:0; left:20px; } #carousel .pnl-event h2{ margin-bottom:5px; height:auto; } #carousel .pnl-event label, #carousel .pnl-event select{ text-transform:uppercase; } #carousel .pnl-event .close{ display:block; width:13px; height:13px; background:url(../img/icons/ico-close-circle.gif); text-indent:-9999px; position:absolute; top:8px; left:379px; } #carousel .pnl-event .close:hover{ /*background-position:-13px 0;*/ } /* ---------- Features panel ---------- */ #features { position:relative; background:url(../img/bg-dot-4col.gif); } #home .gr-four-hero{ background:url(../img/bg-dot-4col-hero.gif); } #features .article { padding:158px 20px 0; } #features h3.advocate { text-indent:-9999px; width:168px; height:111px; background:url(../img/home/title-advocate.gif); margin-bottom:20px; } #features p.cat { text-transform:uppercase; color:#999; font-weight:700; } #features h3.blog { text-indent:-9999px; width:128px; height:39px; background:url(../img/home/title-blog.gif); margin-bottom:20px; } #features h3.title { font-size:1.3em; font-weight:700; margin:0 0 10px; line-height:110%; } #features img { position:absolute; top:0; left:20px; } #features .desc { line-height:133%; } #features .desc a { text-transform:uppercase; font-size:0.83em; font-weight:700; } #features ul li { width:200px; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; margin-bottom:8px; } #features ul li .date { font-size:0.83em; text-transform:uppercase; color:#666; padding-bottom:2px; } #features ul li .author { font-size:0.83em; color:#666; padding-bottom:4px; } #features ul li .summary{ float:left; display:inline; width:160px; padding-bottom:10px; } #features h4 { font-weight:700; width:170px; padding:2px 0 6px; line-height:110%; } #features .comments { float:right; font-size:1.05em; margin-bottom:15px; overflow:hidden; }/* --------------------------------------------------------- project ONE.org (www.one.org) ISSUES style sheet author: HUGE last updated: 2009.02.09 ------------------------------------------------------ */ /* ---------- Issues overview page ---------- */ .land-title { width:282px; height:92px; background:url(../img/issues/title-landing.gif); } #issues-ov { margin-top:19px; } .issue { position:relative; width:200px; height:148px; border-bottom:2px solid #000; background-position:0 100%; background-repeat:no-repeat; margin-bottom:20px; } .issue-last { margin-bottom:0; } .issue h2 { font-size:1.5em; font-weight:700; } .issue h2 a { display:block; background:url(../img/icons/ico-more-arrow-lrg-off.gif) no-repeat 0 2px; padding:0 0 0 21px; } #issues-ov .hover h2 a, .issue h2 a:hover { text-decoration:none; color:#0099ff; background:url(../img/icons/ico-more-arrow-lrg-on.gif) no-repeat 0 2px; } .issue p { visibility:hidden; padding:20px 0 0 10px; line-height:140%; } .issue p a { font-size:0.8em; } #issues-ov .hover p { visibility:visible; } /* ---------- Backgrounds for each issue on the overview page ---------- */ #issues-ov .hiv { background-image:url(../img/issues/bg-hivaidsmaltb.jpg); } #issues-ov .aids { background-image:url(../img/issues/bg-aideffectiveness.jpg); } #issues-ov .water { background-image:url(../img/issues/bg-water.jpg); } /*#issues-ov .food { background-image:url(../img/issues/bg-issue-food.jpg); }*/ #issues-ov .dev-assist { background-image:url(../img/issues/bg-dev.jpg); } /*#issues-ov .corruption { background-image:url(../img/issues/bg-issue-corruption.jpg); }*/ #issues-ov .climate { background-image:url(../img/issues/bg-climate.jpg); } #issues-ov .trade-justice { background-image:url(../img/issues/bg-trade.jpg); } #issues-ov .child-health { background-image:url(../img/issues/bg-health.jpg); } #issues-ov .debt { background-image:url(../img/issues/bg-debt.jpg); } #issues-ov .education { background-image:url(../img/issues/bg-education.jpg); } #issues-ov .agriculture { background-image:url(../img/issues/bg-agriculture.jpg); } #issues-ov .gov-security { background-image:url(../img/issues/bg-gov.jpg); } #issues-ov .hover { background-image:none; } /* ---------- Issues Detail - Hero Feature ----------*/ .issues-hero{ height:295px; background-repeat:no-repeat; } .issues-hero p.intro{ font-size:1.16em; padding:186px 0 15px; line-height:125%; width:410px; } .issues-hero-san{ background-image:url(../img/issues/bg-hero-sanitation.jpg); }/* --------------------------------------------------------------- project ONE.org (www.one.org) MEDIA CENTER style sheet author: HUGE last updated: 2009.02.09 ------------------------------------------------------------ */ /* ----------- Introductory panel ---------- */ .land-title{ width:442px; height:56px; background:url(../img/media-center/title-media-center.gif); } .media-center-bg{ height:241px; background:url(../img/media-center/bg-media-center-mics.jpg) no-repeat 50% 100%; } *.media-center-bg{ height:261px; }/* -------------------------------------------------------------- project ONE.org (www.one.org) MODULES style sheet author: HUGE last updated: 2009.02.11 ----------------------------------------------------------- */ /* ---------- Generic module structure ---------- */ /*ADDED*/.mod-noline{ position:relative; zoom:1; border-top:0px solid #311913; padding:0px 0 20px 0; z-index:1; }/*ADDED*/ .mod{ position:relative; zoom:1; border-top:5px solid #311913; padding:10px 0 20px 0; z-index:1; } .mod ul:after, .mod li:after, .mod:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } .mod h3, .mod-action h3{ text-transform:uppercase; letter-spacing:-1px; font-weight:700; font-size:1.33em; margin-bottom:15px; } .mod h4{ font-weight:700; line-height:110%; } .mod h4 a:hover, .mod-rel-articles ul li a:hover, .mod-arrow-list ul li a:hover, .news-summary h4 a:hover{ color:#0099ff; text-decoration:none; } .mod p{ line-height:133%; } .mod p.more-link{ margin-top:10px; } /*ADDED*/ .mod-noline ul.item-borders li{ background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; } /*ADDED*/ .mod ul.item-borders li{ background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; } .mod .cmt{ color:#fff; line-height:100%; } #page .mod .display-list{ text-align:right; margin-bottom:10px; padding:0; color:#000; } .content .mod h4{ font-size:1.2em; } .no-bdr{ border:0; padding-top:0; } .mod .left{ float:left; display:inline; margin:1px 10px 4px 0; } /* ---------- Mod - Recruit your friends ---------- */ .mod-recruit h3{ background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x 0 100%; padding-bottom:9px; margin-bottom:10px; } .mod-recruit h3 span{ display:block; font-size:1.67em; } .mod-recruit p{ width:172px; } .mod-recruit .btn-wrap{ margin:15px 0; } .mod-recruit .friend{ position:absolute; display:block; width:96px; height:184px; background:url(../img/modules/recruit/friend.png); margin-top:-184px; } .sub-content .mod-recruit .friend{ margin-left:184px; } /* ---------- Mod - Related Video (and latest videos) ---------- */ .mod-video .video-wrap{ background:url(../img/lines-hatches/cr-hatch-light-gray.gif); margin-bottom:20px; padding:10px 0; } .mod-video .video-wrap p{ border:1px solid #e8e8e8; width:198px; height:140px; margin:0 auto; padding:4px; background:#fff; } .mod-video .video-wrap p a{ position:relative; display:block; height:100%; text-indent:-9999px; background:no-repeat 50% 50%; } .mod-video .video-wrap p.brad a{ background-image:url(../img/modules/video/video-thumb-brad.jpg); } .mod-video .video-wrap p a span{ display:block; width:280px; height:170px; background:url(../img/icons/ico-vid-lrg-off.png) no-repeat 15px 60px; _background-image:url(../img/icons/ico-vid-lrg-off.gif); position:absolute; top:-15px; left:-41px; } .mod-video .video-wrap p a:hover span{ background:url(../img/icons/ico-vid-lrg-on.png) no-repeat 15px 60px; _background-image:url(../img/icons/ico-vid-lrg-on.gif); } /* ---------- Styles for list-based modules (to eliminate duplication) ---------- */ .mod-list ul{ *height:1%; } /* IE Fix */ .mod-list ul p{ margin-bottom:5px; } .mod-list ul p a{ text-transform:uppercase; font-size:0.83em; } .mod-list ul li{ position:relative; clear:both; padding-bottom:10px; *height:1%; } .mod-list ul li .desc{ float:left; display:inline; } .mod-list h4{ color:#666; padding-bottom:4px; font-size:1.1em; } .mod-list h4 a{ font-weight:700; padding-bottom:2px; } .mod-list li .img{ position:relative; width:120px; height:90px; overflow:hidden; display:inline; float:left; margin:1px 10px 0 0; } .mod-list li .img a{ position:absolute; top:0; left:0; display:block; width:120px; height:90px; background:50% 50% no-repeat; text-indent:-9999px; } .mod-list li .img a.vid{ background-image:url(../img/icons/ico-vid-lrg-off.png); _background-image:url(../img/icons/ico-vid-lrg-off.gif); } .mod-list li .img a.vid:hover{ background-image:url(../img/icons/ico-vid-lrg-on.png); _background-image:url(../img/icons/ico-vid-lrg-on.gif); } .mod-list .dl-link{ display:block; margin-top:10px; } .mod-list ul li p.date{ font-size:0.9em; } .mod-list .meta{ text-transform:uppercase; display:block; color:#999; font-size:0.83em; margin-bottom:3px; } .gr-browse .mod-list ul li{ background-position:0 0; padding-top:10px; margin-bottom:0; } /* ---------- For list-based modules in the main content area (class content) ---------- */ .content .mod-list h4{ padding-right:40px; } .content .mod-list p{ line-height:133%; padding-right:40px; } .content .mod-list ul{ margin-bottom:-10px; } .content .mod-list ul li{ margin-bottom:10px; } .content .mod-list ul li .desc{ width:470px; } /* ---------- For list-based modules in the sub-content area (right hand rail) ---------- */ .sub-content .mod-list li .desc{ width:149px; } /* ---------- Top 5 table ---------- */ .mod-top-5 table{ width:100%; } .mod-top-5 table tr td{ padding:6px 10px; vertical-align:top; } .mod-top-5 table tr.alt td{ background:#f2f2f2; } .mod-top-5 table tr td.impact{ text-align:right; font-size:1.83em; } .mod-top-5 table tr.top td.impact{ font-size:2.5em; } .mod-top-5 table tr td a{ font-weight:700; color:#0099ff; display:block; margin-top:3px; } .mod-top-5 table tr td span.city{ display:block; padding-top:3px; font-size:0.83em; color:#999; } .mod-top-5 table tr td span.total-impact{ text-align:right; float:right; font-size:0.33em; color:#999; padding:6px 10px 0 0; } .mod-top-5 table tr td span.num{ display:inline;float:right; } .mod-top-5 table.light td.impact{ color:#99cc00; } .mod-top-5 table.dark td.impact{ color:#999; } .mod-top-5 table.dark tr.top td.impact{ color:#000; } /* ---------- Mod - Related Articles ---------- */ .mod-rel-articles ul li{ float:left; display:inline; width:280px; } .mod-rel-articles ul li.left{ margin-right:40px; } .mod-rel-articles ul li a{ background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 50%; padding:7px 0 7px 12px; display:block; } /* ---------- Mod - Popular Articles ---------- */ .mod-press-rel ul, .mod-pop-articles ul{ margin-bottom:-10px; } .mod-pop-articles li{ margin-bottom:16px; } div.mod-my-one{ padding-bottom:30px; } .mod-press-rel li{ margin-bottom:10px; } /* ---------- Defines margins and paddings for module sets ---------- */ .no-mrg{ margin-bottom:0; padding-bottom:0; } /* ---------- Mod - List with arrows ---------- */ .mod-arrow-list ul li{ margin:0; *height:1%; } .mod-arrow-list ul li a{ display:block; padding:5px 0 7px 10px; background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 8px; line-height:110%; } .mod-arrow-list ul li.active a{ background:url(../img/icons/arrow-rel-gray.gif) no-repeat 0 8px; color:#999; font-weight:700; } .mod-arrow-list .ext-list li{ padding:5px 0; } /* ---------- Act now actions ---------- */ .mod-action{ width:280px; } .mod-action h3{ font-size:1.25em; } .mod-action .top{ background:url(../img/action-panel/action-top.png) no-repeat; height:7px; overflow:hidden; _margin-bottom:-3px; } .mod-action .desc{ float:right; display:inline; width:140px; margin-left:10px; line-height:110%; } /*CHANGE the height of the square that contains the action*/ .mod-action .rep{ position:relative; background:url(../img/action-panel/action-rep.png); height:340px; _height:260px; } /*CHANGE*/ /*CHANGE the height of the square that contains the action hover*/ .mod-action .rep .content{ position:absolute; top:-3px; left:4px; width:232px; height:315px; padding:15px 20px; _top:0; } /*CHANGE*/ .mod-action .rep .content-hover{ border:5px solid #0099FF; border-top:5px solid #0099FF; padding:10px 15px; } .mod-action .btm{ background:url(../img/action-panel/action-btm.png) no-repeat; height:7px; margin-top:-3px; overflow:hidden; } .mod-action img{ margin-bottom:10px; } .sub-content .mod-action{ margin-bottom:25px; } /* ---------- Hero action - based on 1 column with edits ---------- */ .actions-ov .mod-hero-action{ width:600px; } .mod-hero-action .bg_img{ background:url(../img/act-now/bg-usaid.jpg) no-repeat 50px 100%; height:257px; _height:260px; } .mod-hero-action .top{ background:url(../img/action-panel/action-hero-top.png) no-repeat; } .mod-hero-action .rep{ position:relative; background:url(../img/action-panel/action-hero-rep.png); } .mod-hero-action .rep .content{ width:552px; } .mod-action .bnr-urgent{ width:95px; height:95px; background:url(../img/bnr-urgent.png); text-indent:-9999px; position:absolute; top:-7px; left:187px; } .mod-hero-action .bnr-urgent{ top:-7px; left:506px; } .mod-hero-action .btm{ background:url(../img/action-panel/action-hero-btm.png) no-repeat; } /* ---------- Mod - ONE Blog ---------- */ .content .news-summary h3{ margin-bottom:30px; } .news-summary .item { position:relative; clear:both; zoom:1; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; margin-bottom:15px; } .news-summary .date{ color:#000; float:left; display:inline; width:40px; text-transform:uppercase; text-align:center; font-weight:700; font-size:0.9em; padding:15px 20px 15px 0; background:url(../img/policy-news/bg-date-cal.gif) no-repeat; } .news-summary .date span{ display:block; margin-left:-3px; font-size:2.33em; letter-spacing:-2px; } .news-summary h4 { font-weight:700; margin-bottom:4px; } .content .news-summary h4{ font-size:1.16em; } .news-summary .desc{ float:left; display:inline; } .news-summary .desc p{ margin-bottom:15px; line-height:133%; } .news-summary .desc p a { text-transform:uppercase; font-size:0.8em; } .news-summary .desc .meta { display:block; color:#999; margin-bottom:7px; font-size:0.9em; } .news-summary .desc .highlight { color:#ff0000; } .news-summary .desc .time { text-transform:uppercase; } .news-summary .cmt{ float:right; } .mod .news-summary .desc{ width:186px; } .mod .news-summary .time{ display:block; } /* ---------- Mod - Related Partners ---------- */ .mod-rel-partners ul{ *height:1%; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; } .mod-rel-partners ul li{float: left; display: inline; width: 130px; margin-bottom: 5px;} .mod-rel-partners ul li a{display: block; padding-left: 70px; background-repeat: no-repeat; background-position: 0 50%; padding-top: 15px; height:40px; color:#0099ff; font-size: 1.1em;} .mod-rel-partners ul li a.ptr-oxfam{ background-image: url(../img/partners/logo-oxfam-sml.gif);} .mod-rel-partners ul li a.ptr-red{ background-image: url(../img/partners/logo-red-sml.gif);} .mod-rel-partners ul li a.ptr-world{ background-image: url(../img/partners/logo-world-sml.gif);} .mod-rel-partners ul li a.ptr-hope{ background-image: url(../img/partners/logo-hope-sml.gif);} /* ---------- Mod - Quick Facts ---------- */ .mod-quick-facts ul{ margin-bottom:-10px; } .mod-quick-facts ul li{ margin-bottom:10px; } .mod-quick-facts ul li h3{ display:inline; float:left; background:#ffcc00; font-size:1.5em; padding:6px 4px; margin-bottom:5px; font-weight:700; color:#000; text-transform:none; } .mod-quick-facts ul li p{ position:relative; clear:both; margin-bottom:0; } .mod-quick-facts .download{ float:right; } /* ---------- Mod - Milestones ---------- */ #page .mod-milestones .milestone{ padding-bottom:0; background:url(../img/about/bg-milestone.gif) repeat-y; } #page .mod-milestones li.now{ background:url(../img/about/bg-milestone-now.gif) repeat-y; } #page .mod-milestones li.now .date{ background:url(../img/about/lbl-milestone-now.gif) no-repeat 39px 9px; text-indent:-9999px; } .mod-milestones li .date{ width:85px; float:left; display:inline; padding:11px 0 11px 8px; font-size:0.83em; color:#666; text-transform:uppercase; } .content .mod-milestones p{ padding-right:10px; } .content .mod-milestones p a{ text-transform:none; } .content .mod-milestones li .desc{ width:476px; padding:8px 15px 18px; float:left; display:inline; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; } /* ---------- Mod - Media Contacts ---------- */ .mod-media-contacts li{ margin-bottom:10px; } .mod-media-contacts h4{ color:#000; font-size:1.2em; } #page .mod-media-contacts p{ margin-bottom:2px; } #page .mod-media-contacts a{ text-transform:none; font-size:1em; } /* ---------- Mod - Hot off the Presses ---------- */ .mod-hot-press ul li .img{ width:200px; height:150px; margin-right:20px; } .content .mod-hot-press ul li .desc{ width:380px; } .content .mod-hot-press ul li h4{ font-size:1.33em; letter-spacing:-1px; } .content .mod-hot-press ul li p.summary{ font-size:1.16em; } .content .mod-hot-press ul li p a{ font-size:0.7em; } .content .mod-hot-press ul li div.img a.vid{ width:200px; height:150px; } /* ---------- Mod - Featured Series ---------- */ .mod-featured-series h3{ width:166px; height:29px; background:url(../img/blog/title-featured-series.gif); text-indent:-9999px; } .sub-content .mod-featured-series ul li .desc{ width:220px; } .mod-featured-series ul{ margin-bottom:-10px; } .mod-featured-series ul li{ margin-bottom:10px; } .mod-featured-series ul li h4{ margin-bottom:5px; } .mod-featured-series ul li .img{ width:50px; height:50px; margin-right:6px; } .mod-featured-series ul li .sec-name{ font-weight:400; padding-bottom:0; } .mod-featured-series ul li p a{ background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 6px; text-transform:none; font-size:1em; display:block; padding:2px 0 0 8px; } /* ---------- Mod - About ONE ---------- */ .mod-about-one p{ margin-bottom:15px; } /* ---------- Mod - Related issues ---------- */ .mod-rel-issues ul li{ padding-bottom:1px; margin-bottom:20px; } .mod-rel-issues ul li .issue-wrap{ min-height:61px; height:auto !important; height:61px; background:no-repeat 100% 100%; } .mod-rel-issues h4 a{ display:block; background:url(../img/icons/ico-more-arrow-lrg-off.gif) no-repeat 0 2px; padding:1px 162px 0 21px; height:60px; font-size:1.16em; line-height:110%; } .mod-rel-issues h4 a:hover{ background:url(../img/icons/ico-more-arrow-lrg-on.gif) no-repeat 0 2px; } /* ---------- Mod - Member messages ---------- */ .mod-mem-messages{ margin-bottom:-20px; } #page .mod-mem-messages h4{ margin-bottom:16px; font-weight:400; color:#999; font-size:0.9em; } #page .mod-mem-messages h4 a{ font-size:1.33em; font-weight:700; color:#0099ff; } #page .mod-mem-messages h4 a:hover{ text-decoration:underline; } .mod-mem-messages .comment{ position:relative; *height:1%; margin-bottom:20px; border:2px solid #e8e8e8; } .mod-mem-messages .comment-bubble{ position:relative; zoom:1; margin-top:-14px; background:url(../img/cmt-bubble-point.gif) no-repeat 15px 0; padding:29px 15px 15px 15px; line-height:133%; } /* ---------- Mod - My ONE ----------- */ .mod-my-one h3{ width:auto; height:33px; background:url(../img/act-now/title-my-one-sml.gif) no-repeat; text-indent:-9999px; margin-bottom:0; } .mod-my-one .title-wrap{ padding-bottom:1px; background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x 0 100%; } .mod-my-one h4{ width:62px; background:url(../img/act-now/star-your-impact-1.gif); height:61px; text-indent:-9999px; float:left; display:inline; margin:15px 15px 0 0; } .mod-my-one .desc{ float:left; display:inline; width:200px; margin-top:15px; } .mod-my-one p .user{ font-weight:700; color:#000; font-size:1.5em; display:block; margin-bottom:5px; } .mod-my-one ul{ margin-top:10px; } .mod-my-one ul li a{ color:#0099ff; font-size:0.9em; padding:2px 0 2px 10px; background-position:0 50%; } .mod-my-one ul li a:hover{ text-decoration:underline; }/* -------------------------------------------------------------- project ONE.org (www.one.org) MODULES style sheet author: HUGE last updated: 2009.02.11 ----------------------------------------------------------- */ /* ---------- Introduction and My ONE summary ---------- */ h1.land-title{ width:198px; height:51px; background:url(../img/my-one/title-my-one.gif); margin-bottom:25px; } .land-intro{ font-size:1.16em; margin-bottom:20px; } /* My ONE Summary */ .myone-summary{ position:relative; margin-bottom:20px; } .myone-summary .unit{ padding-bottom:0px; } .myone-summary h2{ font-weight:700; font-size:2em; margin-bottom:8px; } .myone-summary h2 span{ font-size:0.45em; font-weight:400; color:#666; padding-left:5px; } .myone-summary .user-info{ margin-bottom:15px; } .myone-summary .user-info li{ float:left; display:inline; } .myone-summary .user-info li span{ padding:0 5px; } .myone-summary .user-info li a{ color:#0099ff; } .myone-summary h3{ text-transform:uppercase; font-weight:700; margin-bottom:15px; } .myone-summary h3 a{ text-transform:none; font-weight:400; font-size:0.9em; padding-left:5px; } .myone-summary a{ color:#0099ff; } .myone-summary a:hover{ text-decoration:underline; } /* Impact sub-section */ .impact h4{ width:87px; background:url(../img/my-one/starburst-lrg.gif) no-repeat; text-align:center; font-weight:700; font-size:2em; color:#fff; padding:30px 0; letter-spacing:-1px; float:left; display:inline; margin-right:14px; } .impact table{ float:left; display:inline; width:178px; margin-top:-4px; } .impact table thead{ display:none; } .impact table td{ color:#666; padding:6px 0; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; } .impact table td.val{ color:#99ca3c; width:60px; font-size:1.5em; font-weight:700;} /* Updates sub-section */ .myone-summary .updates p{ padding-top:5px; } .out-summary .myone-summary .updates p{ width:140px; line-height:133%; } .myone-summary .updates table{ width:100%; margin-top:9px; } .myone-summary .updates table td{ padding:9px 0; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; } .myone-summary .updates table td.first{ width:160px; } /* The Badge carousel */ .badge-carousel-wrap{ position:relative; } .badge-carousel{ height:50px; margin-left:30px; overflow:hidden; } .badge-carousel li{ float:left; display:inline; height:50px; width:48px; margin-right:10px; } .badge-control{ display:block; width:20px; height:20px; background:url(../img/icons/ico-carousel-prev-sml.gif); position:absolute; top:14px; left:0; text-indent:-9999px; } .badge-control:hover{ background-position:-20px 0; } .badge-next{ left:260px; background:url(../img/icons/ico-carousel-next-sml.gif); } .badge-carousel-wrap .disabled{ background-position:-40px 0; } /* Logged out */ .out-summary{ position:relative; min-height:140px; height:auto !important; *height:140px; background:url(../img/my-one/bg-my-one-updates.jpg) no-repeat 100% 100%; } .out-summary .myone-summary{ margin-bottom:0; } /* Login form */ .myone-summary .login form{ padding-top:5px } .myone-summary .login label{ text-transform:uppercase; font-size:0.9em; font-weight:700; float:left; display:inline; width:65px; padding:7px 10px 0 0; text-align:right; } .myone-summary .login .text{ margin-bottom:5px; } .myone-summary .login .email{ width:190px; } .myone-summary .login .pass{ width:138px; } .myone-summary .submit{ float:left; display:inline; margin:5px 0 0 75px; } .myone-summary .forgot-pass{ display:inline; float:left; margin:12px 0 0 10px; font-size:0.9em; } /* My ONE Navigation */ #page .myone-nav{ padding:30px 0 10px; } .myone-nav h3{ font-size:1.5em; font-weight:700; margin-bottom:8px; } .nav-disabled h3{ color:#999; } .myone-nav .expander-wrap{ position:relative; zoom:1; padding-bottom:1px; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; margin-bottom:6px; } .myone-nav p{ margin-bottom:10px; } .myone-nav ul{ zoom:1; overflow:hidden; } .myone-nav ul li{ padding:4px 5px; height:50px; margin-bottom:8px; background:url(../img/icons/ico-myone-nav-off.gif) no-repeat 260px 50%; } .myone-nav ul li.active, .myone-nav ul li.hover{ background:url(../img/icons/ico-myone-nav-on.gif) no-repeat 260px 50% #ffcc00; } .myone-nav ul li img{ float:left; display:inline; border:1px solid #e8e8e8; margin-right:10px; } .myone-nav ul li h4{ padding:10px 0 6px; font-weight:700; } .myone-nav ul li h4 a { color:#0099ff; } .myone-nav ul li.hover h4 a, .myone-nav ul li.active h4 a{ color:#000; } .myone-nav ul li p{ font-size:0.9em; color:#666; margin-bottom:0; } .myone-nav ul li p span{ color:#ccc; } .myone-nav .show-hide-actions{ zoom:1; text-transform:uppercase; font-size:0.83em; font-weight:700; margin-bottom:21px; padding-top:4px; } .myone-nav .show-hide-actions a{ padding-right:10px; background:url(../img/icons/arrow-expand.gif) no-repeat 100% 50%; } .myone-nav .show-hide-actions a.collapse{ background-image:url(../img/icons/arrow-collapse.gif); } /* ---------- Action summary ---------- */ .action-summary .img{ width:238px; height:133px; float:left; display:inline; border:1px solid #e8e8e8; margin:0 20px 35px 0; } .action-summary .desc{ width:250px; float:left; display:inline; } .action-summary .desc p{ margin-bottom:5px; font-size:1.13em; line-height:110%; color:#666; } .action-summary .desc p a.action-page{ font-size:0.785em; background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 50%; padding-left:10px; } .action-summary .desc .btn{ margin-top:15px; } .action-summary h2{ font-size:1.75em; font-weight:700; margin-bottom:10px; } .action-summary h2 a:hover{ text-decoration:none; } .action-summary p.impact{ margin-left:20px; font-size:2em; color:#fff; font-weight:700; background:url(../img/icons/ico-starburst-action-impact.gif) no-repeat; float:left; display:inline; width:66px; height:60px; padding-top:22px; text-align:center; } .action-summary p.impact span{ position:absolute; left:-9999px; } /* ---------- Action status panel ---------- */ .title-action-status{ float:left; display:inline; width:138px; height:18px; background:url(../img/my-one/title-action-status.gif) no-repeat; text-indent:-9999px; margin-bottom:10px; } #activity-filter{ float:right; display:inline; text-align:right; } #activity-filter label{ text-transform:uppercase; font-weight:700; } #action-status{ position:relative; clear:both; border-top:4px solid #000; width:598px; } body #page .status-active{ border:1px solid #e8e8e8; border-top:4px solid #000; overflow-y:auto; overflow-x:hidden; margin-bottom:30px; } #action-status p{ font-size:1.16em; padding:20px 0 70px 0; color:#666; } #action-status table{ width:100%; } #action-status table tr td{ padding:10px 0; background:#f5f5f5; color:#999; } #action-status table tr.alt td{ background:#fff; } #action-status .impact{ width:45px; } #action-status .impact span{ display:block; width:24px; height:24px; background:url(../img/icons/ico-starburst-plus-1.gif) no-repeat; text-indent:-9999px; margin-left:10px; } #action-status .name-city{ width:315px; font-size:0.9em; } #action-status .name-city h4{ font-size:1.27em; margin-bottom:3px; } #action-status .name-city h4 a{ font-weight:700; } #action-status .add-contact{ width:120px; font-size:0.9em; } #action-status .act-status{ font-size:0.9em; } #action-status a{ color:#0099ff; } #action-status a:hover{ text-decoration:underline; } #action-status .acted{ font-weight:700; color:#8ebe33; } h3.panel-title{ height:18px; text-indent:-9999px; border-bottom:5px solid #311913; padding-bottom:10px; margin-bottom:20px; } /* ---------- Tell More Friends Panel ---------- */ .pnl-tell-friends{ padding-bottom:30px; } .pnl-tell-friends form{ float:left; display:inline; width:370px; } .pnl-tell-friends label{ display:block; padding-bottom:5px; } .pnl-tell-friends textarea{ width:320px; height:90px; margin-bottom:20px; } .pnl-tell-friends ul{ font-size:0.9em; padding-top:18px; } .pnl-tell-friends ul li{ margin-bottom:5px; } .pnl-tell-friends ul li a{ background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 50%; color:#0099ff; padding-left:10px; } h3.title-tell-friends{ background:url(../img/my-one/title-tell-friends.gif) no-repeat; } /* ---------- Campaign All-Stats panel ---------- */ h3.title-campaign-all-stars{ background:url(../img/my-one/title-campaign-all-stars.gif) no-repeat; } .pnl-all-stars .mod{ border:0; padding:0; } .pnl-all-stars h4{ text-transform:uppercase; letter-spacing:-1px; font-weight:700; font-size:1.33em; margin-bottom:10px; } .pnl-all-stars div{ float:left; display:inline; width:280px; } .pnl-all-stars .first{ padding-right:20px; background:url(../img/lines-hatches/dot-line-vert-gray.gif) repeat-y 100% 0; margin-right:20px; } /* ---------- Tooltip ---------- */ #tooltip{ text-align:left; width:338px; position:absolute; top:10px; left:10px; } #tooltip .top{ width:338px; background:url(../img/my-one/tooltip-top.png) no-repeat; } #tooltip .top .content{ position:relative; min-height:70px; padding:3px 3px 3px 14px; } #tooltip .top .content h3{ width:90px; height:17px; overflow:hidden; background:url(../img/my-one/lbl-my-one-contact.gif); margin-left:20px; text-indent:-9999px; } #tooltip .top a.close{ z-index:20; display:block; width:19px; height:19px; background:url(../img/icons/ico-tooltip-close.gif); text-indent:-9999px; float:right; display:inline; margin:10px 10px 0 0; } #tooltip .top .content .contact{ position:relative; clear:both; padding:10px 0; } #tooltip .top .content .contact p{ font-size:1.5em; font-weight:700; padding-left:20px; margin-bottom:10px; color:#000; } #tooltip .top .content .contact p span{ font-size:0.611em; font-weight:normal; color:#666; } #tooltip .top .content h4{ margin-left:20px; } #tooltip .btm{ width:308px; padding:6px 0 0 30px; height:23px; background:url(../img/my-one/tooltip-btm.png) no-repeat; } #tooltip .btm a{ font-size:0.9em; color:#0099ff; } #tooltip a{ position:relative; } /* ---------- Account Settings form ---------- */ .acc-sets h2{ font-size:1.75em; font-weight:700; margin-bottom:15px; float:left; display:inline; } .acc-sets .rel-link{ float:right; display:inline; margin-top:5px; } .acc-sets .rel-link a{ background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 50%; padding-left:10px; } #page .acc-sets .intro{ position:relative; clear:both; color:#666; font-size:1.16em; margin-bottom:25px; } /* Account panels */ .acc-sets .pnl{ background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x; padding:15px 0; min-height:65px; height:auto !important; *height:65px; } .acc-sets .pnl h4{ font-size:1.33em; font-weight:700; width:124px; line-height:110%; margin-right:40px; float:left; display:inline; } .acc-sets .pnl p.summary{ font-size:1.16em; color:#666; } .acc-sets .pnl .form{ float:left; display:inline; width:435px; } .acc-sets .pnl .form p{ margin-bottom:15px; } .acc-sets .form span{ display:block; padding-top:5px; } .acc-sets .pnl .form label{ display:block; text-transform:uppercase; font-size:0.9em; font-weight:700; color:#000; padding-bottom:3px; } .acc-sets .pnl .form label .opt{ font-weight:400; display:inline; text-transform:none; color:#999; } .acc-sets form .submit{ float:left; display:inline; margin:0 10px 20px 0; width:158px; height:32px; } .acc-sets form .cancel{ display:inline; float:left; padding-top:10px; } /* Error handling */ .acc-sets .form .error label, .acc-sets .form .error span{ color:#ff0000; } .acc-sets .form input{ padding:2px; } .acc-sets .form .error input{ background:#ffcccc; } /* Input box sizes */ .acc-sets .pnl .form input.text{ color:#999; } .acc-sets .pnl .form input.long{ width:280px; } .acc-sets .pnl .form input.med{ width:160px; } .acc-sets .pnl .form input.short{ width:80px; }/* ---------------------------------------------------------- project ONE.org (www.one.org) OVERLAY style sheet author: HUGE last updated: 2009.02.11 ------------------------------------------------------- */ /* ---------- Overlay for modal window and modal styles ---------- */ #overlay{ position:absolute; top:0; left:0; background:#000; cursor:pointer; cursor:hand; } #one-box{ text-align:left; display:none; position:absolute; top:0; left:0; background:#fff; } #one-box .pos-wrap{ position:relative; padding:0 30px 30px; width:360px; } #one-box .close{ float:right; display:inline; margin:10px 10px 0 0; color:#0099ff; background:url(../img/icons/ico-close.gif) no-repeat 100% 0; text-transform:#0099ff; text-transform:uppercase; font-size:0.83em; padding-right:12px; margin-right:-20px; } #one-box .lbl-act-now{ width:68px; height:26px; background:url(../img/lbl-act-now.gif); text-indent:-9999px; margin-bottom:30px; } #one-box .confirm-wrap{ padding-bottom:35px; background:url(../img/lines-hatches/cr-hatch-dark-gray.gif) repeat-x 0 100%; margin-bottom:15px; } #one-box .confirm{ padding-left:45px; min-height:35px; height: auto !important; height:35px; color:#000; margin-bottom:0; } #one-box .confirm .user{ display:block; font-size:1.33em; font-weight:700; padding:2px 0 2px; } .confirm-success{ background:url(../img/icons/ico-success.gif) no-repeat; } #one-box h3{ font-weight:700; font-size:1.33em; margin-bottom:10px; } #one-box p{ line-height:133%; margin-bottom:20px; } #one-box label{ postion:realtive; clear:both; color:#000000; display:block; font-size:0.9em; font-weight:700; margin-bottom:3px; text-transform:uppercase; } #one-box label .opt{ color:#666666; font-weight:400; text-transform:none; } #one-box .opts{ display:block; position;relative; clear:both; margin-bottom:20px; background:url(../img/icons/arrow-rel-blue.gif) no-repeat 0 50%; padding-left:8px; font-size:0.9em; } #one-box textarea{ margin-bottom:10px; float:left; line-height:133%; } #one-box .ta-emails{ width:251px; height:82px; margin-right:15px; } #one-box .ta-messages{ width:320px; height:85px; } #one-box .input-info{ font-size:0.9em; color:#999; line-height:120%; } #one-box .ta-messages{ padding:10px 0 10px 10px; } #one-box .btn-tell-friends{ float:left; display:inline; } #one-box .no-thanks{ float:left; display:inline; padding:7px 0 0 8px; }/* -------------------------------------------------------------- project ONE.org (www.one.org) POLICY NEWS style sheet author: HUGE last updated: 2009.02.09 ----------------------------------------------------------- */ /* ---------- Introduction ---------- */ .land-title { width:369px; height:56px; background:url(../img/policy-news/title-landing.gif); } /* ---------- Hot topics ---------- */ .hot-topics{ position:relative; zoom:1; background:url(../img/lines-hatches/cr-hatch-bl.gif) repeat-x 0 100%; padding-bottom:9px; margin-bottom:26px; } .hot-topics .sticker{ position:absolute; top:-5px; left:190px; } .hot-topics .unit{ width:238px; padding:0 1px 0 0; height:148px; } .hot-topics .first, .hot-topics .last{ width:220px; } .hot-topics span{ text-transform:uppercase; font-size:0.9em; font-weight:700; color:#999; } .hot-topics h2 { text-transform:uppercase; font-weight:700; font-size:1.33em; padding:1px 0 10px 0; background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x 0 100%; } #page .hot-topics .more-link { margin:-20px 0 0 0; padding-bottom:20px; } .hot-topics .topic{ position:relative; height:148px; background-position:0 100%; background-repeat:no-repeat; } .topic h3 { font-size:1.6em; font-weight:700; padding:0 0 0 20px; } .topic h3 a { display:block; _height:1%; background:url(../img/icons/ico-more-arrow-lrg-off.gif) no-repeat 0 2px; padding:0 0 0 21px; } .hot-topics .hover h3 a, .hot-topics .topic h3 a:hover { text-decoration:none; color:#0099ff; background:url(../img/icons/ico-more-arrow-lrg-on.gif) no-repeat 0 2px; } .topic p { visibility:hidden; padding:20px 20px 0 20px; line-height:133%; } .topic p a { font-size:0.83em; } .hot-topics .hover p { visibility:visible; } /* ---------- Hot topic ~ background images ---------- */ .hot-topics .eu { background-image:url(../img/policy-news/bg-topic-eu.jpg); } .hot-topics .doha { background-image:url(../img/policy-news/bg-topic-doha.jpg); } .hot-topics .bank { background-image:url(../img/policy-news/bg-topic-bank.jpg); } .hot-topics .g8 { background-image:url(../img/policy-news/bg-topic-g8.jpg); } .hot-topics .hover { background-image:none; } /* ---------- News summary (Policy Landing Page ----------*/ .news-summary .desc{ width:486px; } /* ---------- Policy News Detail ---------- */ .policy-news-headline{ height:195px; } .policy-news-headline h1, .policy-news-headline .sec-name{ position:absolute; text-indent:-9999px; } .policy-news-headline p{ padding:96px 0 0 20px; width:320px; font-size:1.16em; line-height:133%; } .policy-news-headline .sticker{ position:absolute; top:-20px; left:180px; } .headline-doha{ background:url(../img/policy-news/bg-hero-doha.jpg) no-repeat; }/* --------------------------------------------------------- project ONE.org (www.one.org) GLOBAL style sheet author: HUGE last updated: 2009.02.11 ------------------------------------------------------ */ /*-------------- Styles for screen media -------------*/ @media screen,projection{ li { margin: 8pt 15px; line-height: 135%; } /* (loosely based on) Eric Meyer's Reset CSS | http://meyerweb.com/eric/tools/css/reset/index.html | 20090105 */ /* Reset elements only in areas that HUGE needs reset */ body, img, #header *, #footer *, #breadcrumb *, .pagination *, .mod *, .mod-noline *, .news-summary *, .share-wrap *, .blog.unit *, ul.comment-opts *, #archive-hero *, .issues-hero *, #campaigns-hero *, .actions-ov fieldset, .actions-ov p, #about fieldset, #one-intro li, .comment-submit p, ul.blog-pagination, ul.blog-pagination *, .blog-filter *, .comment-summary *, .comment-text p, .reset * { line-height: 100%; margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; } /* Don't reset header sizes */ h1,h2,h3,h4,h5,h6 { margin:0; padding: 0; } #blog h2 { font-size: 100%; } /* Make these work even in the modules, etc. where everything is reset */ i, em { font-style: italic !important; } b, strong { font-weight: bold !important; } body { line-height:100%; color:black; background:white; } #header ul, #footer ul, #actnow ul, #about ul, .mod ul, .article .mod ul, .news_summary ul, .blog.unit ul, ul.comment-opts, ul.blog-pagination { list-style:none; } ul.unIndentedList, ul.indentedList, .article ul { list-style: disc /* for TinyMCE content */ } /* Pull in some stuff from backwards.css */ .required { color:red; font-weight:bold; } .no-side-mrg h3, .no-side-mrg p { margin-left: 0 !important; margin-right: 0 !important; } .bdr-dotted-top { border-top: dotted black 1px; padding-top: 7px; } .backwards h1 { margin: .67em 0 .67em 0; } .backwards h2 { margin: .83em 0 .83em 0; } .backwards h3 { margin: 1em 0 1em 0; } .backwards h4 { margin: 1.33em 0 1.33em 0; } .backwards h5 { margin: 1.67em 0 1.67em 0; } .backwards h6 { margin: 2.33em 0 2.33em 0; } /* ---------- Float Clearing Wrappers - multiple assets across site. Easier to maintain. ---------- */ .clearfix:after, .news-summary .item:after, #top-nav:after, #features ul li:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; } .clearfix{ zoom:1; } .clear { position:relative; clear:both; width:auto; height:0; overflow:hidden; } /* ---------- Global site assets ---------- */ body { font:0.75em/1 Arial,sans-serif; color:#333; text-align:center; } h1,h2,h3,h4{ color:#000; } .backwards a{ color: rgb(0, 153, 255); } .backwards td { text-align: left; } a{ color:#000; text-decoration:none; } a:hover { text-decoration:underline; color:#0099ff; } h3 a:hover, h4 a:hover{ text-decoration:none; } strong { font-weight:700; } .hide,legend,body.has_js .js_hide { display:block; text-indent:-9999px; display:none; width:0; height:0; line-height:0; overflow:hidden; } .uc{ text-transform:uppercase; } textarea{ font:1em/1 Arial,sans-serif; padding:3px; } .intro-copy p{ font-size:1.16em; margin-bottom:25px; line-height:125%; } #page { position:relative; } #page p a, .mod h4 a:hover, #one-box a { color:#0099ff;} #page p { line-height: 135% } /* ---------- Site wrapper ----------*/ #wrapper { position:relative; width:920px; text-align:left; margin:0 auto; padding:0px 0; z-index:0; } /* ---------- Grid variations ---------- */ .grid{ position:relative; } .grid .unit { position:relative; float:left; display:inline; padding:0 20px 12px; } .gr-three{ background:url(../img/bg-dot-3col.gif) repeat-y; } .gr-three .unit { width:280px; } .gr-four { width:920px; } .gr-four .unit { width:200px; } .gr-four .hero { width:440px; } .gr-content, .gr-browse{ margin-top:40px; } .grid .content, .grid .first { padding-left:0; } .gr-content { background:url(../img/lines-hatches/dot-line-vert-content.gif); } .gr-content .content { width:600px; } .gr-content .sub-content { width:280px; } .gr-bl-border .unit { background:url(../img/lines-hatches/dot-line-vert.gif) repeat-y 100% 0; } .grid .sub-content, .grid .last { padding-right:0; background:none; } .more-pnl{ overflow:hidden; display:block; } /* Act Now */ .gr-act{ margin-top:40px; } .gr-act .sub-content{ padding:0; margin-right:40px; width:280px; } .gr-act .content{ width:600px; padding-right:0; } /* Browse list */ .gr-browse { background:url(../img/lines-hatches/dot-line-vert-browse.gif) repeat-y; } .gr-browse .sub-content{ width:300px; padding:0 0 0 0; } .gr-browse .mod-arrow-list{ margin-right:20px; } .gr-browse .content { padding:0 0 0 20px; width:600px; } .gr-browse h1{ font-size:1.83em; font-weight:700; margin-bottom:5px; } .gr-browse p.intro{ font-size:1.13em; margin-bottom:26px; line-height:140%; } /* My ONE */ .gr-my-one{ background:url(../img/lines-hatches/line-vert-my-one.gif) repeat-y; } /* ---------- Header ---------- */ #header { border-bottom:5px solid #000; } #logo { position:absolute; top:5px; left:10px; width:90px; height:91px; } #header form { float:right; text-align:right; } #header p { padding:34px 0 20px 111px; color:#666; } #header p a { color:#0099ff; font-weight:700; } #header p span.welcome { color:#000; padding:1px 2px; font-size:1.3em; font-weight:700; } #header p span.regular a{ font-weight:400; } #header p span.highlight { background:#ffcc00; } #header p span.placeholder{ font-size:1.83em; } /* ---------- Top links ---------- */ #top-links { font-size:0.9em; float:right; color:#ccc; } #top-links li { float:left; margin-left:5px; } #top-links li.sub-site { margin-left:8px; } #top-links li a { margin-right:5px; } #top-links li a:hover { border-bottom:2px solid #ff0000; text-decoration:none; color:#000; } #top-links li.sub-site a { margin-right:8px; } #top-links li.sub-site a:hover { border-bottom:0; text-decoration:underline; } #top-links .active { color:#000; font-weight:700; border-bottom:2px solid #ff0000; position:relative; } #top-links .active:hover { text-decoration:none; } /* ---------- Top nav ---------- */ #nav-wrap { background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x; } #top-nav { float:left; padding:11px 0 11px 114px; } #top-nav li { float:left; text-transform:uppercase; color:#ccc; padding:0 5px; background:url(../img/pipe-light-gray.gif) repeat-y 100% 0; } #top-nav li.first{ padding-left:0; } #top-nav li.last{ background:none; } #top-nav a { position:relative; display:block; float:left; display:inline; font-weight:700; padding:3px 4px 3px; margin:-3px 0; } #top-nav a:hover, #top-nav a.current{ color:#000; background:#ffcc00; text-decoration:none; } #top-nav a.current:hover { text-decoration:none; } /* ---------- Global search box ---------- */ #search-form{ float:right; display:inline; width:220px; } #search-input { width:150px; margin-top:7px; border:1px solid #999; height:14px; padding:2px; float:left; display:inline; border:1px solid #c3c3c3; background:url(../img/bg-global-search.gif) no-repeat; border-top-color:#7c7c7c; border-bottom-color:#ddd; } #search-submit { margin:7px 0 0 5px; display:inline; float:left; } /* ---------- Footer ---------- */ #footer { font-size:0.9em; background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x; margin-top:50px; color:#ccc; } #footer p { position:relative; clear:both; color:#999; background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x; padding-top:10px; } #footer #partners { float:right; } /* ---------- Legal links ---------- */ #legals { float:left; padding:10px 0; } #legals li { float:left; margin-top:5px; padding-right:5px; } #legals a { margin-right:5px; } #legals a.current, #legals a.current:hover{ color:#999; } #legals a:hover{ color:#000; } /* ---------- Partner logos ---------- */ #partners li { float:left; display:inline; margin:10px 0 0 20px; height:18px; } #partners li a { display:block; height:18px; background-image:url(../img/partner-logos.gif); text-indent:-9999px; } #partners .flickr { width:47px; } #partners .flickr:hover { width:47px; background-position:0 -18px; } #partners .youtube { width:46px; background-position:-68px 0; } #partners .youtube:hover { background-position:-68px -18px; } #partners .myspace { width:68px; background-position:-134px 0; } #partners .myspace:hover { background-position:-134px -18px; } #partners .facebook { width:65px; background-position:-222px 0; } #partners .facebook:hover { background-position:-222px -18px; } #partners .twitter { width:68px; background-position:-306px 0; } #partners .twitter:hover { background-position:-306px -18px; } /* ---------- Eye brow ----------- */ .sec-name{ display:block; text-transform:uppercase; color:#999; font-size:0.83em; font-weight:700; padding-bottom:3px; } #page .sec-name a{ color:#999; } #page .sec-name a:hover{ color:#0099ff; text-decoration:none; } /* ---------- Signup form ---------- */ #signup-form label { font-size:0.9em; text-transform:uppercase; display:block; font-weight:700; margin-bottom:3px; color:#000; } #signup-form .text { margin-bottom:10px; } #signup-form .signup-email { width:190px; } #signup-form .zip-code { width:88px; margin-bottom:15px; } /*---------- Global jCarousel components ---------- */ .jcarousel-container { position:relative; } .jcarousel-clip { z-index:2; padding:0; margin:0; overflow:hidden; position:relative; } .jcarousel-list { z-index:1; overflow:hidden; position:relative; top:0; left:0; margin:0; padding:0; } .jcarousel-list li,.jcarousel-item { float:left; list-style:none; } .jcarousel-next, .jcarousel-prev{ z-index:3; display:none; cursor:pointer; cursor:hand; } /* ---------- Buttons with icons ---------- */ .btn { display:block; text-indent:-9999px; height:25px; background-repeat:no-repeat; } a.attend-event { background-image:url(../img/buttons/btn-attend-event.gif); width:131px; } a.attend-event:hover { background-position:-131px 0; } a.tell-friend { background-image :url(../img/buttons/btn-tell-friend.gif); width:109px; } a.tell-friend:hover{ background-position:-109px 0; } a.act-now { background-image :url(../img/buttons/btn-act-now.gif); width:76px; } a.act-now:hover{ background-position:-76px 0; } a.join-now { background-image :url(../img/buttons/btn-join-now.gif); width:78px; } a.join-now:hover{ background-position:-78px 0; } /* ---------- Comment bubble ---------- */ .cmt { display:block; width:25px; height:25px; color:#fff; text-align:center; font-weight:700; background:url(../img/bg-comment-bubble.gif) no-repeat; } .cmt span { display:block; text-indent:-9999px; } #page .cmt a{ display:block; height:21px; padding-top:4px; color:#fff; text-decoration:none; background:url(../img/bg-comment-bubble.gif) no-repeat; } #page .cmt a:hover{ background-position:-50px 0; } /* ---------- Arrow link ---------- */ #page .more-link{ display:block; text-align:right; padding:0 0 5px; margin-bottom:0; margin-top:10px; } #page .more-link a { font-size:0.9em; color:#000; background:url(../img/icons/ico-more-arrow-off.gif) no-repeat 100% 50%; padding:1px 17px 0 0; } #page .more-link a:hover{ text-decoration:none; color:#0099ff; background-image:url(../img/icons/ico-more-arrow-on.gif); } /* ---------- RSS link ---------- */ #page .rss-link { display:block; text-align:right; padding:0 0 5px; margin-bottom:0; margin-top:10px; } #page .rss-link a { font-size:0.9em; color:#000; background:url(../img/icons/ico-rss-off.gif) no-repeat 100% 50%; padding:3px 22px 3px 0; } #page .rss-link a:hover{ text-decoration:none; color:#0099ff; background-image:url(../img/icons/ico-rss-on.gif); } /* ---------- Download link ---------- */ #page .dl-link { color:#000; background:url(../img/icons/ico-download-off.gif) no-repeat; padding:1px 0 4px 24px; font-size:0.9em; } #page .dl-link:hover { background:url(../img/icons/ico-download-on.gif) no-repeat; text-decoration:none; color:#0099FF; } /* ---------- More link ----------- */ .show-more, .show-less{ text-transform:uppercase; font-size:0.73em; background:url(../img/icons/arrow-expand.gif) no-repeat 100% 50%; padding-right:10px; } .show-less{ background-image:url(../img/icons/arrow-collapse.gif); } /* ---------- Media link ---------- */ #page .media-link span{ text-transform:none; font-size:0.9em; color:#999; background-repeat:no-repeat; background-position:0 50%; padding-left:22px; } #page .media-link a:hover{ text-decoration:none; color:#0099FF; } #page .media-link span.photos-videos{ background-image:url(../img/icons/ico-photo-video.gif); padding:0 0 0 44px; } #page .media-link span.photos{ background-image:url(../img/icons/ico-photo.gif); } #page .media-link span.videos{ background-image:url(../img/icons/ico-video.gif); } /*---------- Small one logo, next to articles ---------- */ .one-logo { height:17px; background:url(../img/logo-sml.gif) no-repeat 100% 0; padding:0 20px 5px 0; } /* ---------- Stickers ---------- */ .sticker { width:52px; height:52px; background-repeat:no-repeat; text-indent:-9999px; } .sticker-fresh { background-image:url(../img/sticker-fresh.png); } /* ---------- Third level page - breadcrumb ---------- */ #breadcrumb { background:url(../img/lines-hatches/cr-hatch-light-gray.gif); padding:8px; font-size:0.83em; } #breadcrumb ul { background:url(../img/content/bull-breadcrumb.gif) no-repeat 0 50%; text-transform:uppercase; padding:0 0 0 14px; color:#666; } #breadcrumb ul li { float:left; display:inline; margin-right:4px; } #breadcrumb ul li a { margin-right:4px; } #breadcrumb ul li a:hover{ text-decoration:none; } /* ---------- Share bar ---------- */ .share { background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x; padding:5px 0; } .share ul li { float:left; display:inline; } .share-wrap { position:relative; z-index:100; background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x 0 100%; margin-bottom:5px; } #wrapper .share p { margin:0; color:#fff; background:url(../img/arrow-share.gif) no-repeat; width:53px; padding:6px 0 0 5px; height:16px; font-size:0.83em; font-weight:700; text-transform:uppercase; float:left; display:inline; line-height:1em; } .share .networks{ float:left; display:inline; margin-top:3px; width:200px; } .share .networks a{ display:block; text-indent:-9999px; width:16px; height:17px; margin-right:10px; background-repeat:no-repeat; } .share .networks a:hover{ background-position:-16px 0; } .share .networks .in{ background-image:url(../img/icons/ico-in.gif); } .share .networks .digg{ width:15px; background-image:url(../img/icons/ico-digg.gif); } .share .networks .digg:hover{ background-position:-15px 0; } .share .networks .facebook{ background-image:url(../img/icons/ico-facebook.gif); } .share .networks .reddit{ background-image:url(../img/icons/ico-reddit.gif); } .share .networks .delicious{ background-image:url(../img/icons/ico-delicious.gif); } .share .networks .buzz{ background-image:url(../img/icons/ico-buzz.gif); } /* Share - Dropdown */ .share-more{ position:relative; } .share .networks a.share-more-dd{ text-indent:0; width:48px; height:13px; padding:2px 0 1px 9px; background:url(../img/bg-share-more.gif) no-repeat; text-transform:lowercase; font-size:0.95em; } .share .networks a.share-more-dd:hover{ color:#000; text-decoration:none; background-position:-88px 0; } #page .share .networks ul li a.active{ width:79px; background-position:-176px 0; } .share .networks .share-additional{ padding:0 4px; width:78px; overflow:hidden; border:1px solid #ccc; border-top:0; position:absolute; top:16px; left:0; _left:-98px; background:#fff; } .share .networks .share-additional li{ float:none; display:block; padding:7px 0 2px; background:url(../img/lines-hatches/dot-line-horiz-gray.gif) repeat-x 0 100%; } .share .networks .share-additional a{ display:block; width:100%; padding:4px 0 0 20px; color:#666; line-height:1em; text-indent:0; font-size:0.9em; } .share .networks .share-additional a:hover{ color:#0099ff; text-decoration:none; background-position:0 0; } .share-wrap .tools { float:right; display:inline; } .share .tools a{ display:block; text-indent:-9999px; width:17px; height:17px; margin:1px 0 0 10px; } .share .tools a:hover{ background-position:-17px 0; } .share .tools .download{ background-image:url(../img/icons/ico-download.gif); } .share .tools .subscribe{ background-image:url(../img/icons/ico-rss.gif); } .share .tools .email{ background-image:url(../img/icons/ico-email.gif); } .share .tools .print{ background-image:url(../img/icons/ico-print.gif); } /*---------- Landing page assets ----------*/ #intro{ padding-bottom:9px; background:url(../img/lines-hatches/cr-hatch-bl.gif) repeat-x 0 100%; } .land-title { text-indent:-9999px; margin:28px auto 20px; } .land-intro { text-align:center; line-height:130%; color:#333; font-size:1.16em; width:584px; margin:0 auto 0; padding-bottom:27px; } /* ---------- Pagination ---------- */ .pagination { width:600px; overflow:hidden; background:url(../img/lines-hatches/cr-hatch-light-gray.gif); text-align:right; font-size:1.16em; } .gr-browse .pagination{ margin:20px 0 0; } .pagination ul { background:#fff; float:right; padding-left:5px; color:#666; padding-top:3px; } .pagination ul li { float:left; display:inline; text-align:right; } .pagination ul a { padding:0 7px; color:#0099FF; } .pagination a.prev,.pagination a.next { position:relative; width:21px; height:21px; margin-top:-3px; } .pagination ul a.prev { background:url(../img/buttons/btn-prev-sml.gif); } .pagination ul a.next { background:url(../img/buttons/btn-next-sml.gif); } .pagination ul a.prev,.pagination ul a.next { display:block; padding:0; height:21px; text-align:left; text-indent:-9999px; } .pagination ul a.prev:hover, .pagination a.next:hover { background-position:-21px 0; } .pagination ul li a.current{ text-decoration:none; color:#000; font-weight:700; } .pagination ul li a:hover{ font-weight:700; } /* ---------- Page Tags ---------- */ .tags { font-size:0.9em; margin-bottom:40px; } /* ---------- Sub Titles -----------*/ .sub-title-more { width:115px; height:39px; background:url(../img/content/sub-title-more.gif); text-indent:-9999px; margin-bottom:20px; } /* ----------- Wide Carousel -----------*/ .wide-carousel{ position:relative; background:url(../img/lines-hatches/cr-hatch-light-gray.gif); padding:12px; } .wide-carousel .loading{ position:absolute; left:-9999px; } .wide-carousel .learn{ text-transform:uppercase; font-weight:700; color:#000; font-size:1.16em; letter-spacing:-1px; } .wide-carousel .learn a{ padding-right:12px; background-image:url(../img/icons/arrow-cr-expand.gif); background-position: 100% 50%; background-repeat: no-repeat; letter-spacing:0; font-size:0.8em; font-weight:700; } .wide-carousel .learn a.active{ background-image:url(../img/icons/arrow-cr-collapse.gif); } .wide-carousel .prev-wrap, .wide-carousel .next-wrap, .wide-carousel .carousel-wrap{ height:90px; float:left; display:inline; margin:15px 10px 15px 0; } .wide-carousel .next-wrap{ margin-right:0; } .carousel-wrap { width:820px; margin-bottom:35px; } .wide-carousel .caro-btn{ display:block; width:28px; height:28px; text-indent:-9999px; margin-top:32px; } .wide-carousel .caro-btn:hover{ /*background-position:-28px 0;*/ } .wide-carousel .prev{ background-image:url(../img/issues/carousel-prev.gif); } .wide-carousel .next-wrap .disabled, .wide-carousel .prev-wrap .disabled{ /*background-position:-56px 0;*/ } .wide-carousel .next{ background-image:url(../img/issues/carousel-next.gif); } .wide-carousel .carousel{ position:relative; height:90px; } .wide-carousel .carousel li{ float:left; display:inline; width:128px; height:88px; margin-right:8px; border:1px solid #e8e8e8; } .wide-carousel .filter{ background:#000; width:128px; height:88px; margin-bottom:-88px; } .wide-carousel h4{ position:relative; _height:1%; } .wide-carousel .carousel li h4 a{ display:block; font-weight:700; padding:10px; height:65px; border-bottom:3px solid #000; line-height:125%; } .wide-carousel .carousel li.hover h4 a{ color:#fff; text-decoration:none; border-bottom:3px solid #fff; } .wide-carousel-btm{ margin:30px 0 -20px 0; background:url(../img/lines-hatches/dot-line-horiz.gif) repeat-x; padding-top:1px; } } /* End screen media */ /*-------------- Styles for print media --------------*/ @media print { #top-nav, #footer{ display:none; } } /* End print media */