/* ---------------------------------------------------------- Partners in Health 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) ---------------------------------------------------------- */ /* 01 =GLOBAL BROWSER RESET ---------------------------------------------------------- */ /* YUI Reset version: 2.7.0 */ html { color: #000; background: #FFF; } 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 */ input,button,textarea,select { *font-size: 100%; } /* 02 =COMMON STYLE ---------------------------------------------------------- */ body { font: .8em/1.45em "Helvetica", Helvetica; color: #333333; } .base h1 { text-transform: uppercase; color: #405f7f; font-size: 1.8em; margin-bottom: 10px; font-weight: bold; line-height: 1.1em; } .base h2 { text-transform: uppercase; color: #405f7f; font: bold 1.35em Georgia, "Times New Roman", Times, serif; margin-bottom: 10px; } .base h3 { font-size: 1.1em; color: #333333; font-weight: bold; margin-bottom: 5px; line-height: 1.3em; } h4 { color: #fff; font-size: 23px; line-height: 29px; } h4 a { color: #fff; text-decoration: underline; } h4 a:hover { color: #fff; text-decoration: none; } .base p { margin-bottom: 10px; } a { color: #b35108; text-decoration: none; } a:hover { text-decoration: underline; } .base h3 a { text-decoration: none; color: #b35108; } .base ul, .base ol { padding-left: 25px; margin: 15px 0;} .base ul li { list-style-type: square; margin-bottom: 5px;} .base ol li { list-style-type: decimal; } .base li ol, .base li ul { margin: 0; } input { font-size: 12px; padding: 4px; color: #000000;} .title{ background: #e8ebed; margin-bottom: 0; padding: 5px 20px; } .title h2 { margin: 0; float: left; margin-right: 10px; } .title h2 a { text-decoration: none; color: #405f7f; } #blog p.more a { color: #b35108; text-decoration: none; } /* 03 =LAYOUT ---------------------------------------------------------- */ #wrapper { width: 970px; margin: 0 auto; } #content { background: url(/page/-/img/content_bg.jpg); float: left; width: 969px; } #home-one #content { background: none; float: left; width: 969px; } #bsd.full-width #content { background: none; } #socialnet #SKIN { float: left; padding: 0; width: 635px; } #socialnet #left-container { float: left; padding: 0; width: 635px; } #socialnet { width: 889px; float: left; } /** 03.1 =HEADER ---------------------------------------------------------- **/ #header { float: left; background: url(/page/-/img/header.jpg); width: 969px; height: 107px; margin-top: 5px; } #header #header-logo a h1{ display: block; text-indent: -9999px; float: left; margin-top: 20px; margin-left: 25px; width: 160px; height: 55px; } #header #quick-signup { float: right; width: 310px; margin-top: 54px; } #header #quick-signup input#quick-email { float: left; width: 125px; margin-right: 5px;} #header #quick-signup input#quick-zip { float: left; width: 60px; margin-right: 5px; } #header input#quick-submit { padding: 0; } a.link-back { color: #536f94; margin-top: 4px; float: left; } #main { float: left; width: 615px; padding: 15px; } #home-one #main { float: left; width: 970px; padding-top: 10px; padding-left: 0; padding-right: 0; } #one-year #main { padding-top: 0; } #bsd.full-width #main { float: left; width: 940px; padding:} /** 03.1.1 =PARTNER PAGES ---------------------------------------------------------- **/ body.partner-kayak #header { background-image: url(/page/-/img/swh/swh-kayak-donation-header.jpg);} body.partner-kayak #quick-signup { display: none; } body.partner-kayak #site-nav { display: none; } body.partner-kayak #header-logo { display: none; } /** 03.2 =NAV ---------------------------------------------------------- **/ #site-nav { float: left; width: 929px; height: 167px;position: relative; z-index: 1000; background-color: #f36d03; border-top: 1px solid #fff; border-bottom: 1px solid #fff; margin-bottom: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomleft: 10px; -webkit-border-bottom-left-radius: 10px; padding: 20px; } #site-nav.framework { height: 66px; } #site-nav.framework h2{ margin-top: 8px; } .interior #site-nav { height: 66px; } .interior #site-nav h2{ margin-top: 8px; } .interior #site-nav .left-callout h4 { display: none; } #site-nav h2 { display: block; background: url(/page/-/img/stand-with-h2.png) no-repeat; width: 589px; height: 50px; text-indent: -9999px; margin-bottom: 10px; } #site-nav h2 a { overflow: hidden; } #site-nav a { overflow: hidden; } #site-nav .left-callout { float: left; width: 600px; } .header-actions { float: right; width: 295px; } .header-actions img{ border: none; padding: 0; margin-bottom: 0} .header-actions a { display: block; border: none; padding: 0; height: 45px; margin-bottom: 5px; } .header-actions a.donate { margin-bottom: ; height: 66px; } #site-nav ul li { float: left; } #site-nav ul li a.top-level { height: 35px; display: block; text-indent: -9999px; overflow: hidden; color: #fff; padding: 0 3px 0 0; } #site-nav ul li ul li a:hover { background: #6482a4; color: #fff; } #site-nav ul li ul { padding: 4px; background: #a5bcce; margin-top: 6px; } #site-nav ul li ul li a { text-indent: 0; } #site-nav ul li.who a.top-level { width: 159px; } #site-nav ul li.what a.top-level { width: 159px; } #site-nav ul li.where a.top-level { width: 159px; } #site-nav ul li.issues a.top-level { width: 157px; } #site-nav ul li.action a.top-level { width: 160px; } #site-nav ul li.resources a.top-level { width: 157px; margin-right: 0; } /*** ESSENTIAL STYLES ***/ .sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; } .sf-menu { line-height: 1.0; } .sf-menu ul { position: absolute; top: -999em; width: 153px; } .sf-menu ul li { width: 100%; } .sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ } .sf-menu li { float: left; position: relative; } .sf-menu a { display: block; position: relative; } .sf-menu li:hover ul, .sf-menu li.sfHover ul { left: 0; top: 2.5em; /* match top ul list item height */ z-index: 99; } ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top: -999em; } ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; } ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } /*** DEMO SKIN ***/ .sf-menu { float: left; margin-bottom: 0; } .sf-menu a { text-transform: uppercase; text-decoration:none; color: #2e3b44; padding: .75em .5em; font-weight: bold; } .sf-menu li li { background: #a5bcce; } .sf-menu li li li { background: #9AAEDB; } .sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { outline: 0; } /*** 03.2.1 =SUPERFISH STYLES ---------------------------------------------------------- ***/ /*** adding the class sf-navbar in addition to sf-menu creates an all-horizontal nav-bar menu ***/ .sf-navbar { background: #BDD2FF; height: 2.5em; padding-bottom: 2.5em; position: relative; } .sf-navbar li { background: #AABDE6; position: static; } .sf-navbar a { border-top: none; } .sf-navbar li ul { width: 44em; /*IE6 soils itself without this*/ } .sf-navbar li li { background: #BDD2FF; position: relative; } .sf-navbar li li ul { width: 13em; } .sf-navbar li li li { width: 100%; } .sf-navbar ul li { width: auto; float: left; } .sf-navbar a, .sf-navbar a:visited { border: none; } .sf-navbar li.current { background: #BDD2FF; } .sf-navbar li:hover, .sf-navbar li.sfHover, .sf-navbar li li.current, .sf-navbar a:focus, .sf-navbar a:hover, .sf-navbar a:active { background: #BDD2FF; } .sf-navbar ul li:hover, .sf-navbar ul li.sfHover, ul.sf-navbar ul li:hover li, ul.sf-navbar ul li.sfHover li, .sf-navbar ul a:focus, .sf-navbar ul a:hover, .sf-navbar ul a:active { background: #D1DFFF; } ul.sf-navbar li li li:hover, ul.sf-navbar li li li.sfHover, .sf-navbar li li.current li.current, .sf-navbar ul li li a:focus, .sf-navbar ul li li a:hover, .sf-navbar ul li li a:active { background: #E6EEFF; } ul.sf-navbar .current ul, ul.sf-navbar ul li:hover ul, ul.sf-navbar ul li.sfHover ul { left: 0; top: 2.5em; /* match top ul list item height */ } ul.sf-navbar .current ul ul { top: -999em; } .sf-navbar li li.current > a { font-weight: bold; } /*** point all arrows down ***/ /* point right for anchors in subs */ .sf-navbar ul .sf-sub-indicator { background-position: -10px -100px; } .sf-navbar ul a > .sf-sub-indicator { background-position: 0 -100px; } /* apply hovers to modern browsers */ .sf-navbar ul a:focus > .sf-sub-indicator, .sf-navbar ul a:hover > .sf-sub-indicator, .sf-navbar ul a:active > .sf-sub-indicator, .sf-navbar ul li:hover > a > .sf-sub-indicator, .sf-navbar ul li.sfHover > a > .sf-sub-indicator { background-position: -10px -100px; /* arrow hovers for modern browsers*/ } /*** remove shadow on first submenu ***/ .sf-navbar > li > ul { background: transparent; padding: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topright: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-left-radius: 0; } /*** 03.2.1 =NAV ---------------------------------------------------------- ***/ ul#sub-nav { float: left; width: 950px; display: block; padding: 10px; border-bottom: solid #fff 2px; height: 15px; } ul#sub-nav li { display: inline; } ul#sub-nav.who-we-are { background-color: #f36d03; } ul#sub-nav.who-we-are li a { color: #fff; text-decoration: none; text-transform: uppercase; font-weight: bold; border-left: 1px solid #b44d08; padding: 5px 10px 5px 6px; margin-right: -4px;} ul#sub-nav.who-we-are li a:hover, ul#sub-nav.who-we-are li.nav_active a { background: #b44d08; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.who-we-are li.first a{ border-left: none; } ul#sub-nav.what-we-do { background-color: #26ab99; } ul#sub-nav.what-we-do li a { color: #fff; text-decoration: none; text-transform: uppercase; font-weight: bold; border-left: 1px solid #12695d; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.what-we-do li a:hover, ul#sub-nav.what-we-do li.nav_active { background: #12695d; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.what-we-do li.first a{ border-left: none; } ul#sub-nav.where-we-work { background-color: #a6bf27; } ul#sub-nav.where-we-work li a { color: #fff; text-decoration: none; text-transform: uppercase; font-weight: bold; border-left: 1px solid #82961b; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.where-we-work li a:hover, ul#sub-nav.where-we-work li.nav_active { background: #82961b; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.where-we-work li.first a{ border-left: none; } ul#sub-nav.issues-we-face { background-color: #58b32c; } ul#sub-nav.issues-we-face li a { color: #fff; text-decoration: none; text-transform: uppercase; font-weight: bold; border-left: 1px solid #3c811c; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.issues-we-face li a:hover, ul#sub-nav.issues-we-face li.nav_active { background: #3c811c; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.issues-we-face li.first a{ border-left: none; } ul#sub-nav.what-you-can-do { background-color: #59598a; } ul#sub-nav.what-you-can-do li a { color: #fff; text-decoration: none; text-transform: uppercase; font-weight: bold; border-left: 1px solid #8687cd; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.what-you-can-do li a:hover, ul#sub-nav.what-you-can-do li.nav_active { background: #8687cd; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.what-you-can-do li.first a{ border-left: none; } ul#sub-nav.resources { background-color: #6b6b6b; float: left; width: 950px; display: block; padding: 10px; border-bottom: solid #fff 2px; height: 15px; } ul#sub-nav.resources li a { color: #fff; text-decoration: none; text-transform: uppercase; font-weight: bold; border-left: 1px solid #333; margin-right: -4px; padding: 5px 10px 5px 6px; } ul#sub-nav.resources li a:hover, ul#sub-nav.resources li.nav_active { background: #333; padding: 5px 10px 5px 6px; margin-right: -4px; } ul#sub-nav.resources li.first a{ border-left: none; } /** 03.3 =SIDEBAR ---------------------------------------------------------- **/ #sidebar {float: right; width: 313px; padding: 4px 4px 10px 1px; } #sidebar a { color: #333; } #sidebar h2 { color: #bfd9ed; text-align: center; background-color: #405f7e; padding-bottom: 20px; margin-bottom: 0; text-transform: uppercase; font: normal 1.4em Georgia, "Times New Roman", Times, serif; } #sidebar #sidebar-donate { text-align: center; padding: 10px; font-family: Georgia, "Times New Roman", Times, serif; } #sidebar .side-box { background: url(/page/-/img/side_top.jpg) no-repeat; background-color: #405f7e;padding-top: 10px; margin-bottom: 10px; width: 313px; float: right; overflow: hidden; } #badge { width: 260px; margin-left: auto; margin-right: auto; margin-top: 17px; } #badge textarea { width: 252px; } #badge h4 { margin-bottom: 5px } .join-sidebar { background-color:#405F7E; color:#BFD9ED; padding-right:12px; padding-top:5px; text-align:right; } .sidebar-image { padding-left: 10px; padding-top: 9px; } #sidebar #sidebar-community .join-sidebar a.login-button { color:#BFD9ED; font-size:12px; font-weight:bold; } #sidebar-community ul.tabset { width: 313px; } #sidebar ul.tabset li{ float: left; text-transform: uppercase; display: inline; } #sidebar #sidebar-community li a.tab { font-size: .8em; float: left; height: 17px; text-align: center; color: #506c05; ; text-transform: uppercase; text-decoration: none; background: #a6bf27; -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border: 1px solid #a6bf27; padding: 5px; font-weight: bold;padding: 2px 7px; margin-left: 4px; display:inline; } #sidebar #sidebar-community li a.tab.active { color: #506c05; background: #f3fbc9; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border: 1px solid #f3fbc9; padding: 2px 7px; border-bottom: 1px solid #f3fbc9; font-weight: bold; } #sidebar #sidebar-community div.tab { height: 115px; margin: 0; text-align: center; overflow: hidden; background: #f3fbc9; padding: 10px 9px; width: 293px;-moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border: 1px solid #f3fbc9; } #sidebar #sidebar-community .tab-inside { background: #d2dea2; width: 283px; height: 105px; padding: 5px; } #fw_header.diagram { height: 200px } #sidebar ul.tabset { height: 19px; } #sidebar li a.tab { font-size: .8em; float: left; height: 17px; text-align: center; color: #fff; ; text-transform: uppercase; text-decoration: none; background: #2f3a44; -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border: 1px solid #2f3a44; padding: 5px; font-weight: bold;padding: 2px 7px; margin-left: 4px; display: inline; } #sidebar li a.tab.active { color: #2f3a44; background: #bfd9ed; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border: 1px solid #bfd9ed; padding: 2px 7px; border-bottom: 1px solid #bfd9ed; font-weight: bold; } #sidebar div.tab { margin: 0; text-align: center; overflow: hidden; background: #bfd9ed; padding: 10px 9px; width: 293px;-moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border: 1px solid #bfd9ed; color: #333; } #sidebar div.tab p {line-height: 19px; color: #333; margin-bottom: 10px; text-align: left; font-size: 1em; } #sidebar #sidebar-community a { color: #546f0a; text-decoration: underline; } #sidebar div.tab label { font-weight: bold; font-size: 13px; color: #333; margin: 0 5px 5px 0; display: inline-block;} #sidebar div.tab p.actions { font-weight: bold; font-size: 13px; color: #e52e1f; text-transform: uppercase; margin-top: 15px; } #sidebar div.tab p.actions img { vertical-align: middle; } #sidebar div.tab p.actions span { display: inline-block; line-height: 25px; margin: 0 5px;} #sidebar div.tab select.searchswitcher { margin-bottom: 5px; } #sidebar div.tab input.field { font-size: 12px; display: inline; padding: 3px; margin-right: 5px;} #sidebar div.tab input.field, #sidebar #my-nation div.tab input.btn1 { vertical-align: middle; float: ; } #sidebar div.tab input.search { padding: 0; position: relative; top: 8px; } #tab05 ul { background: #a5bccf; padding: 5px; } #tab05 ul li { text-align: left; list-style-type: disc; list-style-position: inside; } #tab05 ul li a { text-decoration: underline; } #tab05 ul li a:hover { text-decoration: none; } #tab06 ul { background: #a5bccf; padding: 5px; } #tab06 ul li { text-align: left; list-style-type: disc; list-style-position: inside; } #tab06 ul li a { text-decoration: underline; } #tab06 ul li a:hover { text-decoration: none; } #tab07 ul { background: #a5bccf; padding: 5px; } #tab07 ul li { text-align: left; list-style-type: disc; list-style-position: inside; } #tab07 ul li a { text-decoration: underline; } #tab07 ul li a:hover { text-decoration: none; } #tab10 ul { background: #a5bccf; padding: 5px; } #tab10 ul li { text-align: left; list-style-type: disc; list-style-position: inside; } #tab10 ul li a { text-decoration: underline; } #tab10 ul li a:hover { text-decoration: none; } #sidebar input#event_search_zip { float: left; width: 150px; padding: 4px; display: inline; margin-top: 2px; margin-left: 5px; } #sidebar #simplesearch input.btn1{ float: right; position: relative; right: 44px; top: 3px; padding: 0; } #sidebar #event_radius_unit { display: none; } #sidebar #simplesearch tr { float: left; } #sidebar #simplesearch tr#event_radius_row { display: none; } #sidebar-related-multimedia.side-box { width: 293px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } #sidebar-related-multimedia.side-box p { color: #fff; } #sidebar.text .side-box-text { -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; background: #405f7e; padding: 10px; margin-bottom: 10px; color: #fff;} #sidebar-text-box { -moz-border-radius: 5px; -webkit-border-radius: 3px; border-bottom: 1px solid #bfd9ed; background-color: #bfd9ed; padding: 10px; margin-bottom: 10px; color: #2f3a44; } #sidebar-related ul { background: #4e6b8b; padding-left: 15px; width: 298px; padding-top: 10px; overflow: hidden; } ul#related_multimedia { background: #4e6b8b; padding-left: 15px; width: 280px; padding-top: 10px; overflow: hidden; } #sidebar-related ul li { margin-bottom: 5px; } #sidebar-related ul li a { color: #bfd9ed; } .related-more { float: right;width: 291px;-moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border: 1px solid #bfd9ed; background: #bfd9ed; margin-bottom: 10px; padding: 10px; } #sidebar-related h4.related-section { background-color: #bfd9ed; text-transform: uppercase; padding: 10px 10px 0; } #sidebar-related h3 { font-weight: bold; margin-bottom: 5px; } #sidebar a:hover { text-decoration: none; } #sidebar-related .sidebar-downloads h4.related-section { background-color: #bfd9ed; text-transform: uppercase; padding: 10px 10px 5px 0; } #sidebar-related h2 { padding-top: 5px; padding-bottom: 5px; } #sidebar-community { overflow: hiddern; height: 243px; background-color: #405f7e; } #socialnet #sidebar-community { overflow: hidden; height: 201px; } #sidebar-related-research ul { padding: 5px; } #sidebar-related-research ul li { text-align: left; list-style-type: none; } #sidebar-related-research ul li a { text-decoration: underline; color: #a5bccf; } #sidebar-related-research ul li a:hover { text-decoration: none; } #sidebar-community-nav a { color: #fff; } #sidebar-community-nav { color: #fff; padding-left: 20px; padding-top: 10px; } #sidebar-community-nav h4 { margin-bottom: 5px; border-bottom:1px solid #D3D3D3; margin:15px 20px 10px 0px !important;} #sidebar-community-nav ul { padding-left: 20px; } #sidebar #photo_caption p {text-align:center} #photo_caption {-moz-background-clip:border; -moz-background-inline-policy:continuous; -moz-background-origin:padding; background:#A5BCCF none repeat scroll 0 0; padding:5px;} #sidebar-related .related-more .entry {padding-bottom:5px} #sidebar-search form#cse-search-box { float: left; width: 270px; padding: 10px 20px; } #sidebar-search input.search-button { position: absolute; padding: 0; float: left; margin-right: 0; margin-top: 2px; } #sidebar-search input { margin-right: 5px; } #sidebar #sidebar-search.side-box { background: none; background-color: #405f7e;padding-top: 0px; margin-bottom: 10px; width: 313px; float: right; overflow: hidden; -moz-border-radius: 5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #haiti_links {font-weight:bold; padding-left:10px; padding-right:10px } #haiti_links a {text-decoration:none; color:#ffffff;} #haiti_links li {padding-top:5px; padding-bottom:5px; border-bottom:2px #4b6283 solid} #haiti_links ul li {padding-left:20px;} #one-year #sidebar { padding: 10px; width: 299px; } #one-year #sidebar h3 a { color: #bfd9ed; text-align: center; background-color: #405f7e; padding-bottom: 15px; margin-bottom: 0; text-transform: uppercase; font: normal 1.4em Georgia, "Times New Roman", Times, serif; float: left; width: 262px; font-weight: bold; text-align: center; } #one-year #sidebar .side-box { padding: 10px 20px; width: 260px; background-color: #405f7f; margin-left: auto; margin-right: auto; float: none; -webkit-border-radius: 5px; background-image: none; } #one-year #sidebar .tweet-text { color: #fff; } #one-year #sidebar .tweet-text a { color: #ed8634; } #one-year #sidebar #events .event input#eventtxtfield { width: 110px; } #one-year #side-nav li a { padding-left: 15px; color: #6583a5; } #one-year #side-nav.side-box { background: #aec3d4 none; width: 259px; border-left: none; border-bottom: none; border-color: #6583a5; border-width: 1px; } #side-nav h3 { color: #405f7e; text-align: center; padding-bottom: 15px; margin-bottom: 0; text-transform: uppercase; font: normal 1.4em Georgia, "Times New Roman", Times, serif; float: left; width: 257px; font-weight: bold; text-align: center; } #one-year #sidebar #actions{ padding: 10px 20px; width: 259px; background-color: #405f7f; margin-left: auto; margin-right: auto; float: none; -webkit-border-radius: 5px; margin-bottom: 10px; } #one-year #sidebar #action-buttons { width: 260px; margin: auto; } #one-year #sidebar #actions h3 { color: #bfd9ed; text-align: center; padding-bottom: 0; margin-bottom: 13px; text-transform: uppercase; font: normal 1.4em Georgia, "Times New Roman", Times, serif; ; font-weight: bold; text-align: center; } /** 03.4 =FOOTER ---------------------------------------------------------- **/ #footer{background: #aec3d4; float: left; border-top: 2px solid #fff; width: 970px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; } #footer .nav-search {padding: 10px; border-bottom: 1px solid #9cafbe; height: 26px; } #footer .footer-nav a{color: #fff; padding-right: 25px; font-size: .9em; } #footer .footer-nav {float: left; padding-top: 4px; } #footer .donate-footer{float: right; width: 433px; height: 39px; color: #000; } #footer .donate-footer h4 {color: #000; font-size: 1em; line-height: 16px; font-weight: bold; } #footer .contact {padding: 15px; float: left; width: 257px; font-weight: bold; } #footer .footer-networks {border-left: 1px solid #9cafbe; float:right; width: 650px; height: 46px; padding: 15px; } #footer .footer-networks .network {float: left; margin-right: 55px; display: inline; } #footer .footer-networks h4 {margin-bottom: 5px; } #footer .footer-networks a {float: left; margin-right: 10px; padding: 0; color: #333; } #footer .footer-networks a.network-link {padding-top: 15px; } p.copyright {float: left; text-align: center; color: #333333; padding-top: 5px; width: 970px; padding-bottom: 500px; } /* 04 =HOMEPAGE ---------------------------------------------------------- */ #home #main { padding: 0; width: 645px; } .home { background: #f3f5f6; padding: 20px; margin-bottom: 10px; } #home #news.home .entry { float: left; width: 290px; padding-right: 10px;} #news.home .entry h3 { margin-bottom: 0; } #news.home .entry p { margin-top: 0; margin-bottom: 5px; } #news.home .entry-text { float: right; width: 199px;} #news.home .entry-text.blog { float: left; width: 290px; } #news.home { width: 282px; float: left; display: inline; margin-bottom: 1px; height: 650px; } .news-image { float: left; margin-right: 10px; display: inline; } .news-image img{ border: 2px solid #b35108; float: left; width: 75px; } .title.news { float: left; display:; width: 282px; height: 20px; } a#more_news {color:#333333; text-decoration:underline; float: right;} .title a.rss-link { float: left; display: block; } .tweets { float: left; margin-bottom: 10px; } .tweet-time { color: #666; } .col-1{ width: 320px;float: left; } #blog.home { float: left; margin-bottom: 10px; } .col-2{ width: 321px;float: right; } .support-haiti { float: left; width: 645px; } .support-content { background: #f3f5f6; padding: 20px; margin-bottom: 10px; } #home-one .box { width: 270px; float: left; display: inline; margin-bottom: 20px; height: auto; } #home-one .col-1 { width: 310px;float: left; overflow: hidden; } #home-one .col-2 { width: 310px;float: left; margin-left: 20px; margin-right: 20px; overflow: hidden; } #home-one .col-3 { width: 310px;float: left; overflow: hidden; } #home-one .support-content { background: #f3f5f6; padding: 20px; margin-bottom: 10px; width: 268px; float:left; } #home-one .title.news { float: left; display:; width: 271px; height: 20px; } #home-one .box .news-image img{ border: 2px solid #b35108; float: left; width: 50px; } #home-one .box.entry { float: left; width: 275px; padding-right: 0;} #home-one .box p.byline { margin-bottom: 2px; font-size: .85em; font-weight: bold; text-transform: uppercase; line-height: 9px; } #home-one #blog .entry-text { float: right; width: 204px; } #home-one #press .entry-text { float: left; width: 270px; } #home-one #press .entry { float: left; width: 276px; margin-bottom: 15px; padding-right: 0; } #home-one #events-content { width: 247px; margin-left: auto; margin-right: auto; } #home-one #events-content p { color: #000; } #home-one #events-content h4 { font-size: 1.1em; color: #333333; font-weight: bold; margin-bottom: 5px; line-height: 11px; } #home-one #events-content h4 a { color: #b35108; padding-top: 0; } #home-one #events-content input#eventtxtfield { margin-top: 4px; margin-right: 4px; width: 97px; margin-bottom: 10px; } #home-one #events-content h4 span { padding-top: 0 !important; } #home-one #events-content h4.jan14-event { line-height: 18px; } #home-one #events-content h4.jan14-event .date { font-size: .85em; } #action-buttons { width: 271px; margin: auto; } #action-buttons a { display: block; margin: 7px 0; } #action-buttons .big-button { color: white; padding: 12px 20px; background: #f36d03 url(/page/-/img/button-shine.png) 0 0 repeat-x; text-align: center; font-size: 18px; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; } #action-buttons .big-button:hover { text-decoration: none; } .hero { left: 0; z-index: 0; width: 582px; height: 310px; margin-bottom: 5px; float: left; } .hero .info { background: #405f7f; opacity: .85; float: left; z-index: 32; position: absolute; width: 610px; left: 19px; height: 79px; top: 211px; } .hero { position: relative; } .hero-content { height: 310px; } .home-rotator-entry { height: 310px; margin: 0; position: relative;} .home-rotator-entry { width: 645px; height: 310px !important; } .home-rotator-entry img { position: absolute; top: 0; left: 0; width: 645px; z-index: -10000; } .home-rotator-entry .overlay a { display: block; height: 311px; width: 645px; } .home-rotator-entry h1 { position: absolute; top: 185px; left: 10px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF; font-size: 16px; opacity: 1;} .home-rotator-entry .home-rotator-info { position: absolute; z-index: 100; padding: 10px 20px 15px 10px; left: 11px; top: 225px; background: #314e6d; color: #fff; margin: 0; width: 298px; opacity: .8; height: 55px; font-weight: bold; } .home-rotator-entry .home-rotator-info a { color: #fa7b18; padding-left: 10px; opacity: 1; } .home-rotator-entry .home-rotator-info h2 { font-family: helvetica; text-transform: none; color: #fff; margin-bottom: 0; opacity: 1; } #home-rotator-nav { position: absolute; z-index: 100; left: 338px; top: 225px; background: #314e6d; margin: 0; height: 45px; width: 270px; padding: 20px 10px 15px 16px; opacity: .9; overflow: hidden; } #home-rotator-nav li { display: inline; margin-left: 0; padding: 0; margin-right: 6px; } #home-rotator-nav li img { width: 80px; } #home-rotator-nav li a img{ border: 2px solid #53769a; opacity: 1;} #home-rotator-nav li a.activeSlide img{ border: 2px solid #fa7b18; opacity: 1;} a#prev { position: relative; z-index: 5000; top: -59px; left: 344px; text-indent: -99999px; background: url(/page/-/img/btn_prev.png) no-repeat; display: block; float: left; width: 7px; height: 29px; overflow: hidden; } a#next { position: relative; z-index: 50000; top: -59px; left: 614px; text-indent: -99999px; background: url(/page/-/img/btn_next.png) no-repeat; display: block; float: left; width: 8px; height: 29px; overflow: hidden;} #home-one .hero { left: 0; z-index: 0; width: 967px; height: 310px; margin-bottom: 5px; float: left; position: relative;} #home-one .hero .info { background: #405f7f; opacity: .85; float: left; z-index: 32; position: absolute; width: 610px; left: 19px; height: 79px; top: 211px; } #home-one .hero-content { height: 310px; } #home-one .home-rotator-entry { height: 310px; margin: 0; position: relative;} #home-one .home-rotator-entry { width: 645px; height: 310px !important; } #home-one .home-rotator-entry img { position: absolute; top: 0; left: 0; width: 970px; z-index: -10000; height: 315px; } #home-one .home-rotator-entry .overlay a { display: block; height: 311px; width: 970px; } #home-one .home-rotator-entry h1 { position: absolute; top: 185px; left: 10px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFFFFF; font-size: 16px; opacity: 1;} #home-one .home-rotator-entry .home-rotator-info { position: absolute; z-index: 100; padding: 10px 20px 15px 10px; left: 11px; top: 225px; background: #314e6d; color: #fff; margin: 0; width: 298px; opacity: .8; height: 55px; } #home-one .home-rotator-entry .home-rotator-info a { color: #fa7b18; padding-left: 10px; opacity: 1; } #home-one .home-rotator-entry .home-rotator-info h2 { text-transform: none; color: #fff; margin-bottom: 2px; opacity: 1; font: bold 14px helvetica; } #home-one #home-rotator-nav { position: absolute; z-index: 100; left: 338px; top: 225px; background: #314e6d; margin: 0; height: 25px; width: 595px; padding: 30px 10px 25px 16px; opacity: .9; overflow: hidden; } #home-one #home-rotator-nav li { display: inline; margin-left: 0; padding: 0; margin-right: 6px; } #home-one #home-rotator-nav li img { width: 61px; } #home-one #home-rotator-nav li a img{ border: 2px solid #53769a; opacity: 1;} #home-one #home-rotator-nav li a.activeSlide img{ border: 2px solid #fa7b18; opacity: 1;} #home-one a#prev { position: relative; z-index: 5000; top: -58px; left: 344px; text-indent: -99999px; background: url(/page/-/img/btn_prev.png) no-repeat; display: block; float: left; width: 7px; height: 29px; overflow: hidden; } #home-one a#next { position: relative; z-index: 50000; top: -58px; left: 914px; text-indent: -99999px; background: url(/page/-/img/btn_next.png) no-repeat; display: block; float: left; width: 8px; height: 29px; overflow: hidden;} #nav {position: absolute; height: 80px; margin: 15px; z-index: 10000; float: right; top: 345px; right: 679px; } #nav li { width: 50px; float: left; margin: 8px; list-style: none } #nav a { width: 50px; padding: 3px; display: block; border: 1px solid #ccc; } #nav a.activeSlide { background: #88f } #nav a:focus { outline: none; } #nav img { border: none; display: block } a.more-link { float: right; color: #000; text-decoration: underline; } a.more-link:hover { text-decoration: none; } .event-by { display: none; } .event select { display: none } .event input.btn1 { padding: 0; position: absolute; margin-top: 2px; } .event input#eventtxtfield { margin-top: 4px; margin-right: 4px; } #sidebar-events { width: 292px; margin-left: auto; margin-right: auto; margin-top: 10px; height: 135px; border-bottom: 1px solid #fff; border-top: 1px solid #fff; padding-top: 10px; } #personal-fundraising { width: 292px; margin-left: auto; margin-right: auto; margin-top: 10px; height: 285px; border-bottom: 1px solid #fff; border-top: 1px solid #fff; padding-top: 10px } #sidebar #personal-fundraising h4 { float: left; width: 172px; line-height: 16px; margin-bottom: 5px; } .thermometer { float: left; padding-right: 15px; margin-bottom: 5px; } #sidebar h4 { font-size: 14px; font-weight: bold; line-height: 14px; } #sidebar h4.host { float: left; margin-top: 10px; margin-bottom: 15px; } #sidebar h4 a { color: #fff; } .event p { color: #fff } #fundraising .btn { color: white; padding: 8px 5px; background: #f36d03 url(/page/-/img/button-shine.png) 0 0 repeat-x; text-align: center; font-size: 11px; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; display: block; float: right; width: 178px; font-weight: bold; margin-right: 0; margin-left: 0; margin-bottom: 8px; } #fundraising.btn:hover { text-decoration: none; } #fundraising h4 a { float: left; color: #b35108; font-size: 11px; width: 270px; padding-top: 8px; } /* 05 =SUBPAGES ---------------------------------------------------------- */ #news .entry { margin-bottom: 25px; float: left; width: 525px; } #news p.byline { margin-bottom: 5px; } #news h2 a { font-size: 1.1em; color: #b35108; font-weight: bold; font-family: helvetica; text-decoration: none; } #news h2 { margin-bottom: 5px; } #subjects #main h2 { font: 1.1em/1em "Helvetica", Helvetica; color: #333333; font-weight: bold; line-height: 1.3em; text-transform: none; margin-bottom: 5px; } #subjects #main .subject-nav { background: #e7ebee; padding: 10px; margin-top: 10px; } #subjects #main h3 { float: left; padding-right: 5px; text-transform: none; } #subjects p.byline { float: left;} #subjects #main .title-area { float: left; width: 590px; } #subjects #main #stories-publications { background: #f4f5f7; padding: 20px 10px 10px; } #subjects #main #stories-publications .entries { margin-bottom: 15px; float: left; width: 100%;} .subject-more { float: left; width: 100% } form#cse-search-box { float: left; padding-left: 55px; padding-bottom: 20px; } #video h1 { margin-left: -20px; } #video .videos { padding-right: 20px; padding-left: 20px ;} #video .left { margin: 0 auto 15px; } #video .video-thumb { width: 100px; } #video span.thumb { display: block; margin-right: 5px; border: 2px solid #405f7e; width: 100px; height: 115px; text-align: center; font-weight: bold; padding: 5px; float: left; } #stories-publications .entry {margin-bottom:25px} .message {float: left; margin-right: 1em;} .gallery-entry { float: left; width: 268px; border: 1px solid #ccc; margin-right: 10px; display: inline; } .gallery-entry img { float: left; } .gallery-entry h3 { float: right; width: 158px; } .gallery-entry p { float: right; width: 158px; } .page-title { background: #fff; margin-bottom: 0; padding: 5px 20px 11px; } .page-title a { font-weight: bold; } #one-year #main h1 { float: left; display: inline; margin-bottom: 0; height: auto; background-color: #6583a5; width: 585px; padding: 15px; font-size: 23px; line-height: 29px; color: #fff; text-transform: none; font-weight: bold; } .page-title .prev { float: left; } .page-title .next { float: right; } .title h2 a { text-decoration: none; color: #405f7f; } .page-title { float: left; display:; width: 575px; margin-bottom: 0; } .next-arrow { border-color: #fff #fff #fff #787878; float: right; border-style: solid; border-width:5px; width:0; height: 0; padding-bottom: 0; margin: 5px -20px 0 10px; } .prev-arrow { border-color: #fff #787878 #fff #fff ; float: left; border-style: solid; border-width:5px; width:0; height: 0; padding-bottom: 0; margin: 4px 10px 0 -20px; color: #787878; } /* 06 =FRAMEWORK ---------------------------------------------------------- */ /*=GENERAL STYLES*/ #framework .checkbox, #framework .radiobutton, #framework .label, #framework .text, #framework input[type=text], #framework input[type=radio] { margin: 0 .5em 0 0; } /*Adds spacing to the right of check boxes and radio buttons*/ #framework .label, #framework .fieldlabel { padding-right: .5em; text-transform: none; font-weight: normal; font-style: normal; } /*targets label elements in form*/ #framework .checkbox {text-transform:normal; font-weight:normal} #framework input.text, #framework textarea { margin: 2px 5px 2px 0; } /* Adds spacing around text input fields*/ #framework #invitationpage #submit_button, #framework .loginbutton input, #framework .signupbutton input { margin: 1em 0 0 0; } /*Adds top margin to buttons that appear at the end of forms i.e. beneath input fields*/ #framework #captcha_container #captcha_buttons { line-height: 0; margin: 0; } /*Removes vertical spacing between captcha buttons*/ #framework #contribution td, #framework #contribution th, #framework #signup td, #framework #signup th, #framework #invitationpage td, #framework #invitationpage th, #framework #SKIN td, #framework #SKIN th { padding-top: 2px; padding-bottom: 2px; vertical-align: top; font-size: 14px; line-height: 20px; } #framework #contribution .amounts td { vertical-align: middle; } /*=LOGIN and SIGN-UP FORMS*/ #socialnet #loginform, #socialnet #signupform { background: none; border: none; width: 600px; } #socialnet #loginform .logintitle, #socialnet #signupform .signuptitle { border-bottom: 1px solid #ccc; color: #333; margin: 0 0 5px 0; padding: 15px 10px 10px; text-align: left; text-transform: capitalize; width: 100%; }/*text formatting and spacing of log in and sign up box headers*/ #socialnet #loginform table, #socialnet #signupform table { background: none; border: none; margin: 10px 0; padding: 10px 0; } #socialnet #loginform td, #socialnet #loginform th, #socialnet #signupform td, #socialnet #signupform th { padding: 2px 10px; text-align: left; } #socialnet #loginform th, #socialnet #signupform th { width: 100px; } #socialnet #loginform table .loginbutton, #socialnet #signupform table .signupbutton { padding: 7px 0 0; } /*padding around submit buttons*/ #socialnet #SKIN #myeventslogin { width: 100% } #socialnet #SKIN .even a, #socialnet #SKIN .odd a { color: #333333; text-decoration: underline; } #socialnet #SKIN .even a:hover, #socialnet #SKIN .odd a:hover { text-decoration: none; } #socialnet #SKIN .odd { background-color: #bfd9ed; } #socialnet #SKIN .even { background-color: #5c80af; } #socialnet #SKIN .typedesc th { padding-left: 10px; } textarea.contact_importer_email { width: 300px } #eventdetail #invitetable input { width: 300px } #eventdetail #invitetable .invitebutton input { width: 100px } ---------------------------------------------------------- */ #bsd .yui-panel { border: 1px solid #ccc; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #bsd .yui-panel-container.shadow .underlay { display: none; } #bsd .yui-panel .container-close { right: 10px; } /*This targets the close button in the popover. You can replace the default image with one of your choosing. Image dimensions should be 12px square*/ #bsd .yui-panel .hd { background: #eee; color: #333; border: none; border-bottom: 1px solid #ddd; font-size: 18px; font-weight: bold; line-height: 24px; margin-bottom: 6px; padding: 10px; } #bsd .yui-panel .bd { font-size: 12px; line-height: 18px; padding: 6px; } #bsd #contact_importer_wrapper { margin: 0; } #bsd #contact_importer_wrapper #contact_importer_error { margin: 18px 0 0 0; } #bsd #contact_importer_dialog .button-group button { background: #eee; border: 1px solid #ddd; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; cursor: pointer; padding: 3px 10px; } /*Contact Listings*/ #bsd #contact_importer_wrapper #results_table_header { background: #eee; } #bsd #contact_importer_wrapper #results_table_outer { border: 1px solid #ddd; } /*----------------------------------------------------------- STYLES FOR INVITE, SIGNUP, TAF, AND CONTRIBUTIONS ---------------------------------------------------------- */ #framework input[type=button], #framework .submit, #framework #invitationpage #submit_button, #framework #date-filter, #framework .loginbutton input, #framework .signupbutton input, #framework .search_form button { background: #f36d03; color: #fff; border: none; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; cursor: pointer; padding: 4px 6px; font-weight: bold; } /*Targets most Buttons*/ #framework .bsd-contribForm-twoCol input.submit { margin-left: 328px; margin-right: auto; float: none; padding: 10px; font-size: 16px; } #framework .bsd-contribForm-oneCol input.submit { margin-left: 0; margin-right: auto; float: none; padding: 10px; font-size: 16px; } #framework #invitationpage #submit_button, #framework .loginbutton input, #framework .signupbutton input { margin: 1em 0 0 0; background-color: #405f7e; } #framework #contact_importer_button { font-size: 12px; padding: 5px 0; } .bsd-contribForm-oneCol .bsd-contribForm-aboveContent { float: left; width: 50%; margin-right: 20px; min-height: 800px; } .bsd-contribForm-oneCol .bsd-contribForm-belowContent { float: left; width: 100%; } .bsd-contribForm-twoCol .bsd-contribForm-aboveContent { padding-bottom: 25px } /* CAM'S PATCHES TO RESTORE MISSING STYLES */ /* ERRORS */ #contribution .error { color: red; font-size: 110%; } .contriberrorbanner { color: red; font-size: 110%; font-weight: bold; padding-top: 15px; } #paypal_notice { display: none; } .nested_table, #country_table td, #custom_country_field_table_1 td, #custom_country_field_table_2 td { padding: 0px; } #pa_iframe { border: 0; } /*=SIGN UP*/ #signupheader { margin: 0 0; padding: 0; } #signupfooter { } .signuperror { color: red; font-size: 100%; font-weight: bold; text-transform: uppercase; } #signup .uploaded_file_saved { width: 100%; overflow: auto; color: red; font-weight: bold; } #signup .opt_in_description { overflow: auto; width: 100%; height: 100px; } /*=INVITE/TAF*/ #invitationpage span.error { color:red;font-weight:bold;line-height: 1.5em;} #invitationpage #captcha_container #recaptcha_image embed { margin-bottom: -15px; } /* 07 =STAND WITH HAITI ---------------------------------------------------------- */ #content { position: relative; } #pinned-wrapper { left: -130px; position: absolute; width: 120px; z-index: 100; /* required to avoid jumping */ } #pinned { position: absolute; top: 0; margin-top: 20px; } #pinned.fixed { position: fixed; top: 0px; } #pinned { width: 120px; background: #F36D01; padding: 5px; } #pinned-social { background: #fff; padding: 10px; margin-top: 5px; } #pinned-facebook { text-align: center; width: 60px; margin: 0 auto; } /* 08 =UTILITY ---------------------------------------------------------- */ .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; } .caption { text-align: center; font-size: .85em; font-style: italic; } 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;} a.read-more {padding-bottom:10px}