/* ----------------------------------- TOC ----------------------------------- Fonts:....................Available font-family declarations Globals:..................Styling of HTML and BODY Bootstrap Overrides:......Changes to base-Bootstrap CSS Site Elements:............Re-usable site elements Structure:................Site structural components Section Specific:.........Styles for Home and all Sub Pages Template Specific:........Styles for WP Templates Page/Element Specific:....Page, element or flow Specific CSS Additive CSS:.............Additive/override CSS Responsive:...............Specific styles for Desktop, Tablet and Mobile */ /*----------------------------------- Globals -----------------------------------*/ html body { font-size:16px; } /*----------------------------------- Visual Composer Overrides -----------------------------------*/ .spacer_height_30 { height:20px !important; } .spacer_height_70 { height:46px !important; } .donate_feature h3 { font-size:23px; } /*----------------------------------- Site Elements -----------------------------------*/ /* ---- Hierarchy ---- */ h1 { font-size:47px; } h2 { font-size:28px; } h3 { font-size:18px; } h4 { font-size:16px; } /* ---- Paragraph ---- */ p.intro { font-size:19px; } p.intro.emphasis { margin-bottom:39px; font-size:28px; } /* ---- Quotes ---- */ .quote_container { font-size:23px; } .quote_container .quote_attribution { font-size:14px; } .quote_container .open_quote_large img { width:26px; height:auto; } /*----------------------------------- Structure -----------------------------------*/ /* ---- Alert CTA ---- */ .alert_cta_content { font-size:16px; } .alert_cta_content .alert_cta { top:-1px; } /* ---- Header ---- */ .header { padding-top:25px; } /* Global Navbars */ /* Headernav */ .headernav { margin-top:-10px; padding-top:3px; } .headernav_socialmedia.socialmedia_facebook { display:none; } .headernav_socialmedia.socialmedia_twitter { display:none; } .headernav_socialmedia.socialmedia_youtube { display:none; } .headernav_socialmedia.socialmedia_linkedin { display:none; } .navbar-brand { margin-top:0; } .navbar-nav > li > a { font-size:14px; } .navbar-nav > li > .dropdown-menu { width:180px; } .dropdown-menu > li > a { padding:12px 10px 11px; } /* Social Media */ .socialmedia_list_item a { width:24px; height:24px; } /* ---- Content Area ---- */ .content_container { min-height:900px; padding-bottom:75px; } /*---- Newsletter Signup ---- */ .newsletter_signup_container { padding:20px 0; font-size:14px; } .newsletter_signup_content { display:block; } .newsletter_signup_content .roca_ink_logo { height:25px; margin-bottom:5px; float:none; } .newsletter_signup_form { margin-top:-11px; } /* ---- Sponsors ---- */ .sponsor_container { padding:43px 0; } .sponsor_container ul { width:55%; } /* ---- Footer ---- */ .footer { font-size:13px; } /* FooterNav */ /* FooterNav: Contact */ .footernav_contact { font-size:13px; } /* Roca Locations */ .footer_locations { padding-top:30px; font-size:13px; } .footer_locations strong { font-size:13px; } /*----------------------------------- Section Specific -----------------------------------*/ /* ---- Home Page ---- */ /* Hero Carousel */ #home_carousel { margin-bottom:59px; } /* Carousel Controls */ #home_carousel .chevron-left, #home_carousel .chevron-right { width:43px; height:auto; top:calc(50% - (43px / 2)); } /* ---- Sub Pages ---- */ /* Section Banner */ .section_banner { margin-bottom:59px; } .section_banner_title { padding:7px 0 6px; } /* Section Banner Carousel */ #section_banner_carousel { margin-bottom:59px; } /* Arrow Banner */ .arrow_banner_content { padding:46px 0; } .arrow_banner_content h3 { font-size:20px; } /* Basic Full-Width Feature Banner */ .basic_banner h3 { font-size:23px; } .basic_banner.basic_banner_padding_50 { padding:33px 0; } .basic_banner.basic_banner_padding_70 { padding:46px 0; } /* Outcomes Feature */ /* Visual Composer Version */ .vc_outcomes_feature { font-size:19px; } .vc_outcomes_feature h4 { font-size:145px; } /* Story Gallery */ .story_gallery_container { padding-top:33px; } .story_gallery_container .story_card { height:220px; margin-bottom:33px !important; } .story_gallery_container .story_card_content h3 { font-size:19px; } .story_gallery_container .story_card_content h4 { font-size:14px; } /* Story Carousel */ .story_carousel_header { height:266px; } .story_carousel_body { margin-top:-266px; } /* Carousel */ .story_carousel:before { top:266px; background-image:url(../images/sm-bg-story-carousel.png); } .story_carousel .item { padding:0 20px 20px; } /* Image Banner */ .story_carousel_image_banner { margin:0 -20px; } .story_carousel_image_banner .row { height:266px; } /* Post Content */ .story_carousel_post_content { margin-top:-188px; } .story_name { padding:0 20px; font-size:37px; } .story_title { padding:0 20px; margin-bottom:20px; font-size:22px; } .story_carousel_quote { padding:calc(188px / 2) 23px 20px 23px; } .story_quote { font-size:22px; } .story_quote_attribution { font-size:16px; } .story_carousel_content { padding:20px; font-size:15px; } /* Carousel Controls */ .story_carousel_controls { right:30px; top:30px; } .story_carousel_controls ol.carousel-indicators { padding-top:2px; } /*----------------------------------- Template Specific -----------------------------------*/ /* ---- Location Detail Template ---- */ .google_map iframe { height:350px; } /*----------------------------------- Page/Element Specific -----------------------------------*/ /* ---- Work: Overview ---- */ /* Program Feature */ .program_feature_element { padding:26px; } .program_feature_element_image { height:227px; margin-bottom:15px; } .program_feature_element_desc { font-size:17px; } .program_feature_element_desc h3 { margin-bottom:10px; font-size:17px; } /* ---- Work: Our Intervention Model ---- */ /* Intervention Model Components */ .intervention_components_feature { padding-bottom:79px; } .im_components_panel_image { height:168px; } .im_components_panel_content { font-size:14px; } .im_components_panel_content h3 { font-size:22px; } .im_components_panel_content_mask { top:168px; } /* ---- Work: Young Men & Mothers Programs ---- */ /* Stats Feature */ .stats_table_container h3 { font-size:23px; } .stats_table td.stats_table_left_col { font-size:23px; } .stats_table td.stats_table_right_col { font-size:16px; } .stats_table_footer { font-size:19px; } /* ---- Work: Locations ---- */ /* Location Feature */ .location_feature_image { height:240px; } /* ---- Impact: Overview ---- */ /* Carousel Controls */ #outcomes_carousel .chevron-left, #outcomes_carousel .chevron-right { width:43px; height:auto; top:calc(50% - (43px / 2)); } /* ---- Impact: News ---- */ /* News Feature */ .news_feature { font-size:15px; } .news_feature h2 { padding-bottom:15px; } .news_element { padding:0 0 0 52px; background-size:40px 23px; } .news_element h3 { font-size:15px; } .news_element .news_publish_date { font-size:13px; } .news_element .news_permalink { font-size:13px; } /* News Feature: Nav */ .archived_news_nav { padding-top:26px; font-size:15px; } .archived_news_nav h2 { padding-bottom:2px; font-size:18px; } /* Twitter Feed */ .twitter_heading { padding:0 calc(30px + 16px); background-size:30px 30px; } .twitter_feature { padding:46px 0; } .twitter_feature .kcontainer { margin-bottom:33px; } .twitter_feature .kebo-tweets.list > .ktweet { padding:25px 25px 63px !important; border:none; border-bottom:15px solid #e6e7e8; background:#fff; position:relative; } .twitter_feature .kebo-tweets.list > .ktweet:last-child { border-bottom:none; } .twitter_feature .kebo-tweets > .ktweet .kfooter { bottom:18px; right:25px; } /*---- Impact: Roca Ink ---- */ .template_ink .sidebar_container { font-size:14px; } .template_ink .sidebar_container h3 { margin-bottom:12px; font-size:14px; } .template_ink .sidebar_container h4 { font-size:18px; } .template_ink .sidebar_container .archive-posts { margin-bottom:20px; } .ink_email_blast { font-size:14px; } .ink_email_blast h1 { padding:10px 26px 5px; margin-bottom:26px; font-size:23px; } .ink_email_blast .ink_intro { padding-left:13px; } .ink_email_blast .ink_article h3 { font-size:14px; } /* ---- Join Us: Contact Form ---- */ /* Contact Form: Alerts */ .alert { font-size:14px; } /* ---- Join Us: Fundraise ---- */ .fundraise_feature { padding:20px 0; } .fundraise_feature h3 { font-size:19px; } /* ---- COVID-19 ---- */ #covid_19_feature h3 { font-size:25px; } #covid_19_feature h4 { font-size:18px; } #covid_19_feature h4:after { background-size:12px 12px; right:calc(-1 * (50vw - 205px / 2)); left:205px; } .facebook_feed_container { padding:30px 0 12px; } .facebook_feed_container:before { background-size:12px 12px; } .facebook_feed_content { padding-bottom:0; } .facebook_heading{ padding:0 calc(30px + 30px) 0 15px; background-size:30px 30px; } .facebook_heading:before { left:calc(-1 * (50vw - 216px / 2)); right:216px; background-size:12px 12px; } .facebook_heading:after { right:calc(-1 * (50vw - 216px / 2)); left:216px; background-size:12px 12px; } /* ------------------------------------ $ Override CSS ------------------------------------ */ /* ---- Additive / Reductive CSS ---- */ /* Add */ /* Add: Margin-Bottom */ .add_margin_0_sm { margin-bottom: 0 !important; } .add_margin_5_sm { margin-bottom: 5px !important; } .add_margin_10_sm { margin-bottom: 10px !important; } .add_margin_15_sm { margin-bottom: 15px !important; } .add_margin_20_sm { margin-bottom: 20px !important; } .add_margin_25_sm { margin-bottom: 25px !important; } .add_margin_30_sm { margin-bottom: 30px !important; } .add_margin_35_sm { margin-bottom: 35px !important; } .add_margin_40_sm { margin-bottom: 40px !important; } .add_margin_45_sm { margin-bottom: 45px !important; } .add_margin_50_sm { margin-bottom: 50px !important; } .add_margin_60_sm { margin-bottom: 60px !important; } .add_margin_70_sm { margin-bottom: 70px !important; } .add_margin_75_sm { margin-bottom: 75px !important; } .add_margin_80_sm { margin-bottom: 80px !important; } .add_margin_90_sm { margin-bottom: 90px !important; } .add_margin_100_sm { margin-bottom: 100px !important; } /* Add: Text-Align */ .text_left_sm { text-align:left; } .text_center_sm { text-align:center; } .text_right_sm { text-align:right; }