/* Base styles */ blockquote { margin: 0 30px 20px; border-left: 5px solid #e2e3e4; padding-left: 20px; font-size: 12px; } .base { padding-right: 20px; } #content-btff p { margin-bottom: 10px; } #content-btff .base ul, #content .base ol { font-size: 12px; margin-bottom: 12px; padding: 0; } #content-btff .base ul li, #content .base ol li { list-style-position: outside; } #content-btff .base ul li { list-style-type: disc; } #content-btff .base ol li { list-style-type: decimal; margin-bottom: 15px; } #content-btff .base li ol { padding-left: 10px; margin-bottom: 0; } #content-btff .base li ul { padding-left: 10px; margin-bottom: 0; } #content-btff .base h1 { color: #363636; font-size: 26px; padding: 50px 0 20px 0; text-transform: none; } #content-btff .base h2, #content .base h3 { text-transform: none; color: #002c5f; text-align: left; } #content-btff .base h3 { margin-bottom: 10px; } #content-btff p#breadcrumb, p#breadcrumb a:link, p#breadcrumb a:visited { font-size: 11px; color: #515151; margin: 10px 0; } .btff #content-wrap { background: #FFF; } /* end base styles */ #content-btff h3, #content-btff h4, #content-btff h5 { font-family: "Endzone Sans", serif; font-weight: normal; color: #16254f; } #content-btff h2 { font-size: 24px; line-height: 1.2; padding: 0; background: none; height: auto; width: auto; text-indent: 0; color: #002c5f; text-align: left; margin: 15px 0; font-weight: bold; } #content-btff h2 a { color: #002c5f; display: inline; font-size: inherit; } #content-btff h2.base, #content-btff h3.base { color: #002c5f; text-align: left; } #content-btff h3, #content-btff h3 a { font-size: 24px; font-weight: bold; padding: 20px 0 10px; line-height: 1.2; display: block; margin: 0; clear: left; } #content-btff h3 a { padding: 0; } #content-btff h4 { font-size: 13px; line-height: 1.2; text-transform: none; color: #FFF; } #content-btff p, #content-btff li { font-size: 14px; } #content-btff a { font-size: inherit; font-weight: normal; } #content-btff a:link { color: #002c5f; text-decoration: underline; } #content-btff a:visited { color: #001c3d; text-decoration: underline; } #content-btff a:hover, #content-btff a:active { color: #d31a1e; } #content-btff ol, #content-btff ul { margin: 0 0 0 20px; padding: 15px 0 0; } #content-btff li { list-style: none outside; } #content-btff a img { border: none; } input, textarea, select { color: #000; } #btff { background: #FFF; margin: 0 auto; width: 960px; } #content-wrap { padding-top: 30px; } #content-btff { background: #FFF; color: #000; font-family: Helvetica, Arial, sans-serif; float: left; padding: 0; width: 960px; } #btff-home-top { background: #981917 url("/page/-/btff11/mesh-bg-red.jpg") 0 0 no-repeat; height: 400px; padding: 10px; } h2#btff-header { color: #FFF; background: #002c5f url("/page/-/btff11/header.jpg") 0 0 no-repeat; height: 148px; margin-bottom: 0; margin-top: 0; width: 960px; text-transform: none; text-align: left; } h2#btff-header { line-height: 1; } /* for IE8 */ h2#btff-header, #ie8#fix { line-height: .8; } /* for all other browsers */ h2#btff-header a { color: #FFF; display: block; text-decoration: none; font-weight: bold; font-size: 20px; padding: 45px 0 0 475px; height: 85px; line-height: 1.3; } #touchdown-dance { float: left; margin-right: 10px; width: 615px; } #btff-action-btns { float: left; width: 315px; } #btff-action-btns .btff-btn { background: #FFF url("/page/-/btff11/btff-sprites.png") 0 -319px no-repeat; width: 315px; height: 126px; margin-bottom: 11px; } #btff-action-btns .btff-btn h4 { } #btff-action-btns .btff-btn h4 a:link, #btff-action-btns .btff-btn h4 a:visited { color: #c71921; font-weight: bold; font-size: 33px; text-transform: uppercase; padding: 22px 57px 0 22px; display: block; text-decoration: none; } #btff-action-btns .btff-btn p { padding: 0 60px 0 25px; font-size: 16px; font-weight: bold; line-height: 1.3; } #btff-social { float: left; width: 335px; } #btff-social-inner { background: #112346 url("/page/-/btff11/mesh-bg-blue.jpg") 0 0; padding: 10px; } #btff-social h4 { text-indent: -9999em; height: 44px; width: 316px; background: #0a5ba2 url("/page/-/btff11/btff-sprites.png") -333px -319px no-repeat; margin-bottom: 5px; } #btff-social h4 a { display: block; height: 44px; } #btff-social #btff-tw { background-position: -333px -373px; background-color: #4ba0c3; } #btff-fb-stream { background: #FFF; margin-top: 10px; } #btff-touts { width: 615px; float: left; margin-right: 10px;} .btff-tout { float: left; width: 300px; } .btff-tout.odd { margin-right: 15px; } #content-btff .btff-tout img { width: 298px; height: 145px; border: 1px solid #112346; } #btff-touts .btff-tout h4 { background: #112346 url("/page/-/btff11/btff-sprites.png") 0 -228px no-repeat; height: 60px; width: 300px; font-size: 19px; text-align: right; text-transform: uppercase; } #btff-touts .btff-tout h4 a { color: #FFF; padding: 9px 57px 0 0; display: block; height: 55px; font-weight: bold; text-decoration: none; } #btff-winner { background: #981917 url("/page/-/btff11/mesh-bg-red.jpg") 0 0 no-repeat; float: left; padding: 10px 10px 10px 20px; color: #FFF; width: 930px; margin: 10px 0; } #btff-winner p, #btff-home-leaderboard p { font-size: 16px; line-height: 1.2; color: #FFF; } #btff-winner p#discount { font-size: 11px; margin: 5px 0 0; } #btff-winner h3, #btff-home-leaderboard h3 { color: #FFF; font-size: 24px; padding: 10px 0 13px; } #btff-winner h4 { text-indent: -9999em; height: 44px; width: 274px; background: #112346 url("/page/-/btff11/btff-sprites.png") -332px -218px no-repeat; margin-bottom: 3px; } #btff-winner h4 a { display: block; height: 44px; } #btff-winner #btff-winner-pledge { background-position: -332px -267px; } #btff-winner-congrats { background: #112346 url("/page/-/btff11/btff-sprites.png") 0 0 no-repeat; width: 500px; height: 209px; float: right; text-align: center; padding: 0 80px 0 20px; } #btff-winner-congrats h3 { text-transform: uppercase; font-size: 18px; padding: 30px 0 20px; } #btff-winner-congrats h3 span { font-size: 24px; text-transform: capitalize; display: block; } .btff #sidebar { width: 335px; float: right; background: none; margin-left: 20px; } .btff #sidebar #btff-action-btns { background: #981917 url("/page/-/btff11/mesh-bg-red.jpg") 0 0 no-repeat; padding: 10px 10px 0; margin-bottom: 10px; } #btff-home-leaderboard { background: #112346 url("/page/-/btff11/mesh-bg-blue.jpg") 0 0; float: left; padding: 10px 10px 10px 20px; width: 930px; margin: 10px 0 30px; } #btff-home-leaderboard-list { background: #FFF url("/page/-/btff11/btff-sprites.png") 540px -475px no-repeat; width: 520px; height: 206px; float: right; text-align: center; padding: 0 80px 0 0; } #btff-home-leaderboard #leaderboard { width: 540px; } #btff-home-leaderboard #leaderboard td { font-size: 18px; padding: 12px 20px; } #btff-home-leaderboard h3 a:link, #btff-home-leaderboard h3 a:visited { color: #FFF; } #leaderboard { width: 549px; padding: 20px 0; margin-bottom: 20px; } #leaderboard td { border-bottom: 1px solid #13264c; padding: 15px 0; border-collapse: collapse; font-size: 14px; } #leaderboard .team-rank { padding: 0 20px; width: 50px; } #leaderboard .team-logo { text-align: center; width: 100px;} #leaderboard .team-name { width: 210px; padding-left: 50px; } #leaderboard .team-count { width: 80px; text-align: right; padding-right: 20px; } #leaderboard img { vertical-align: middle; } #content-btff p.rankings { font-size: 11px; color: #515151; margin-bottom: 10px; } .cufon-loading a { visibility: hidden !important; } /* skin overrides */ #SKIN #eventdetail img.rssimg { border: none; } .full-width #framework { padding-right: 20px; } #event_results #event_list .datebox { width: auto; padding-right: 7px; padding-bottom: 6px; background-color: #f5f5f7; font-size: 14px; overflow: visible; color: #3d3d3d; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } #event_results #event_list .datebox .english { white-space: nowrap; } #event_results #event_list .event .title { text-align: left; } #event_results #event_list .event .title a { color: black; } #event_results #event_list .datebox .calendardate { margin: 0; } #calendar-nav #date { width: 300px; font-size: 12px; padding: 0; } #calendar-nav #date input { width: 53px; font-weight: normal; } #content-btff .bsd-contribForm-oneCol .bsd-contribForm-aboveContent { float: left; width: 450px; margin: 15px 40px 0 0; } /* this style allows you to position the form description to the left of the contribution form (note, you may have to adjust width and height depending on site layout and form options). */ #content-btff .bsd-contribForm-oneCol form#contribution { width: 400px; float: right; } /* SKIN OVERRIDES Last Update: JUNE 11, 2010 NOTE: These definitions assume that framework elements have been wrapped in a div with the id "framework". For the YUI styles to work the body id should be "bsd" */ /*=TYPOGRAPHY ---------------------------------------------------------- */ #framework #SKIN h1, /*If you change the font-soze for h1 or it's top margin or padding properties be sure to change the top margin property for "#SKIN #account_actions" such that the base line for the elements within line up with h1 in control_set div*/ #framework #SKIN .basic .main #eventdetail .title, /*Event Title*/ #framework #profiledetail #sectionheader, #framework #stdheader #title /*Page title on Outreach pages*/ { font-size: 24px; font-weight: bold; line-height: 30px; margin-bottom: 6px; color: #002c5f; } #SKIN #account_actions a { color: #002c5f; } /*if using cufon or typekit for headers be sure to target the following header ids/classes #titletext - header for Outeach pages .headertitle — header for Comunity pages */ #framework #contribution .contribheader, /*Section headers on Contribute form*/ #framework #SKIN h2, #framework #sectionheader, #framework #SKIN .widget_header, #framework #SKIN .widget_title, #framework #community .communitypostinlist .title, /*Blog post title on community web page*/ #framework #community .header, /*Community page headers */ #framework #community .communitypostfull .title, /*Community title for full blog post*/ #framework #community .journaltitle, #framework #community .journalarchive .journalarchivetitle, #framework a#host-button, #framework #loginform .logintitle, #framework #signupform .signuptitle, #framework #outreach_content #loginform .logintitle, #framework #outreach_content #signupform .signuptitle, #framework #manageform .managetitle, #framework #forgotpw .header { font-size: 18px; font-weight: bold; line-height: 24px; margin-bottom: 6px; color: #002c5f; } #framework #SKIN h3, #framework #SKIN .basic .main .typedescheader, #framework #community .postlist table.head .text, /*Table heading on Community Dashboard page*/ #framework #community .subheader, /*Subheader on the Community Blog Entry Preview page*/ #framework #community .profileteaser .title, /* Profile teaser title on Blog home page*/ #framework #odgettingstarted .odsechead, #framework #odprogress .odsechead, #framework #odyourpage .odsechead, #framework #odstats .odsechead, #framework #odaddress .odsechead, #framework #odgroup .odsechead, #framework #outreach_content .omhead { font-size: 14px; font-weight: bold; line-height: 20px; margin-bottom: 6px; } #framework #SKIN h4, #framework #SKIN h5 { font-size: 12px; font-weight: bold; line-height: 18px; } /*HEADERS WITH BOTTOM BORDERS*/ #framework #contribution .contribheader, /*Section headers on Contribute form*/ #framework #sectionheader, #framework .sectionheader, #framework #SKIN .header, #framework #SKIN .basic .main .typedescheader, #framework #community .header /*Community page headers */ #framework #community .communitypostfull .title, /*Community title for full blog post*/ #framework #community .journaltitle, #framework #community .journalarchive .journalarchivetitle, #framework #stdheader, /*Header for Outreach pages*/ #framework #community .profileteaser .title, /* Profile teaser title on Blog home page*/ #framework #odgettingstarted .odsechead, #framework #odprogress .odsechead, #framework #odyourpage .odsechead, #framework #odstats .odsechead, #framework #odaddress .odsechead, #framework #odgroup .odsechead, #framework #outreach_content .omhead, #framework #manageform .managetitle, #framework #forgotpw .header { border-bottom: 1px solid #ddd; padding-bottom: 3px; } /*WIDGET HEADERS*/ #framework #SKIN .widget_header { background: #eee; border-bottom: 1px solid #ddd; margin-bottom: 6px; padding: 5px 10px; position: relative; } /*SUB-HEADERS*/ #framework #SKIN .widget_subheader, /*Widget Subheader on the dashboard*/ #framework #community .subheader /*Subheader on the Community Blog Entry Preview page*/ { background: #F2F7F7; border-bottom: 1px solid #ddd; padding: 5px 10px; } /*=BUTTONS ---------------------------------------------------------- */ /*INPUT BUTTONS*/ #framework input[type=button], #framework input[type=submit], #framework .submit, #framework #invitationpage #submit_button, #framework #date-filter, #framework .loginbutton input, #framework .signupbutton input, #framework #community input[type=submit], #framework .utils_search button { } /*Targets most Buttons*/ /*INPUT HOVER STATES Note this will only work for modern browsers*/ #framework input[type=button]:hover, #framework input[type=submit]:hover, #framework input:hover.submit, #framework #invitationpage input:hover#submit_button, #framework button:hover#date-filter, #framework .loginbutton input:hover, #framework .signupbutton input:hover, #framework #community input[type=submit]:hover, #framework .utils_search button:hover { } /*RSVP and DETAILS BUTTONS*/ #framework #event_results .event_footer .links { float: left; } #framework #event_results .event_footer .links .detail_button, #framework #event_results .event_footer .links .rsvp_button { float: right; } #framework #event_results .event_footer .links .detail_button a, #framework #event_results .event_footer .links .rsvp_button a { display: block; margin-left: 10px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; padding: 2px 10px; } #framework #event_results .event_footer .links .detail_button a { background: #eee; border: 1px solid #ccc; padding: 2px 10px 1px; } #framework #event_results .event_footer .links .rsvp_button a { background: #555; color: #fff; padding: 3px 10px 2px; } #framework #event_results .event_footer .links .detail_button a:hover, #framework #event_results .event_footer .links .rsvp_button a:hover { background: #333; border-color: #333; color: #eee; text-decoration: none; } /*Hover state for RSVP and Details buttons*/ /*CONTACT IMPORTER BUTTOM FOR SHARE AND INVITE FORMS*/ #framework #contact_importer_button { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; font-size: 12px; } /*You can change the background color to match your other input button styles*/ /*SEARCH BUTTON*/ #framework .search_form button { } /*=TEXT INPUT FIELDS AND TEXTAREAS ---------------------------------------------------------- */ #framework input.text, #framework textarea { } /*Use this definition to target most of the text input fields*/ /*=TABS NOTE If the background color for your page is not white you will have to update the bottom border color for the active tabs for Framework, Events and Friends i.e. #framework #SKIN #blue_hat .blue_hat_active { background: none; border-bottom: 1px solid #fff; font-weight: bold; } #framework ul#event_order li.active { background: none; border-bottom: 1px solid #fff; font-weight: bold; } #framework #SKIN #friends_tabs ul li.active_tab { background: none; border: 1px solid #ddd; border-bottom: 1px solid #fff; } ---------------------------------------------------------- */ /*FRAMEWORK TABS*/ #framework #SKIN #blue_hat { background: none; border-bottom: 1px solid #ddd; height: 43px; } #framework #SKIN #blue_hat ul { display: inline; float: right; height: auto; margin: 0 5px; padding: 18px 0 0 0; } #framework #SKIN #blue_hat li { background: #eee; border: 1px solid #ddd; border-top-left-radius: 3px; display: inline; float: right; padding: 5px 10px 4px; text-decoration: none; } #framework #SKIN #blue_hat li a { color: #888; text-decoration: none; } #framework #SKIN #blue_hat .blue_hat_active { background: none; border-bottom: 1px solid #fff; font-weight: bold; } #framework #SKIN #blue_hat .blue_hat_active a { color: #555; } #framework #SKIN #blue_hat li a:hover { background: none; color: #555; } /*EVENT TABS*/ #framework ul#event_order { border-bottom: 1px solid #ddd; clear: both; float: left; list-style-type: none; margin: 0 0 10px 0; top: 0; width: 100%; } #framework ul#event_order li { background: #eee; border: 1px solid #ddd; color: #888; display: inline; float: left; margin: 0 0 -1px 5px; padding: 5px 10px 4px; text-decoration: none; } #framework ul#event_order li a { color: #888; } #framework ul#event_order a:hover { color: #555; } #framework ul#event_order li.active { background: none; border-bottom: 1px solid #fff; font-weight: bold; } #framework ul#event_order li.active a { color: #555; } /*WIDGET TABS*/ /*Note that the active tab background color should be the same as the .widget_header background color under the WIDGET HEADERS category above*/ #framework #SKIN .widget_tabs { margin: 0; padding: 0; } #framework #SKIN .widget_tabs li { border-top-left-radius: 3px; float: left; list-style: none; padding: 5px 10px 4px 10px; margin: 0 5px 0 0; list-style-type: none; } #framework #SKIN .widget_tabs li.active_tab { background: #eee; font-weight: bold; } #framework #SKIN .widget_tabs li.inactive_tab { background: #ddd; } /*FRIENDS TABS*/ #framework #SKIN #friends_tabs { border-bottom: 1px solid #ddd; margin: 18px 0 6px 0; } #framework #SKIN #friends_tabs ul { margin: 0; padding: 5px 0 0 0; list-style: none; } #framework #SKIN #friends_tabs li { border-top-left-radius: 3px; border-top-right-radius: 3px; display: inline; float: left; margin: 0 0 -1px 5px; list-style-type: none; padding: 5px 10px 4px; } #framework #SKIN #friends_tabs ul li.active_tab { background: none; border: 1px solid #ddd; border-bottom: 1px solid #fff; } #framework #SKIN #friends_tabs ul li.active_tab a { color: #555; font-weight: bold; } #framework #SKIN #friends_tabs ul li.inactive_tab { background: #eee; border: 1px solid #ddd; } /*YUI POP OVER This controls the style of the pop over opened after clicking the contact importer button As noted above, in order for this to work the body id should be "bsd" ---------------------------------------------------------- */ #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; } /*=LAYOUT ---------------------------------------------------------- */ /*SOCIAL NET WIDGET COLUMNS*/ #framework #SKIN #widget_group_1 { float: left; width: 49%; } /*Left column*/ #framework #SKIN #widget_group_2 { float: right; width: 49%; } /*Right column*/ /*=PLEASE DO NOT DELETE OR MODIFY ANY OF THE STYLES BELOW ---------------------------------------------------------- */ #framework #SKIN #widget_directory_search_groups_by_keyword { float: none !important; }