/* Blanford Pupsite - GHAPS Sinking Fund */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;700&display=swap');

:root {
    --GHAPS_DkBlue:         #071d3b; /* 9.5 */
    --GHAPS_Blue:           #012169; /* 9.5 */
    --GHAPS_MedBlue:        #0034A1; /* 5.71 */
    --GHAPS_Gold:           #FFB81C; /* 1.55 */

    --GHAPS_White:          #fff; /* 1.12 */
    --GHAPS_LtGray:         #f1f1f1; /* 1.12 */
    --GHAPS_XLtBlue:        #e9ebf5; /* 1.12 */
    --GHAPS_Black:          #221f20; /* 16.34 */

    --DK_TransTeal:         hsla(172.73deg, 38.37%, 33.73%, 93%);
    --GHAPS_FilterDkBlue:  brightness(0) saturate(100%) invert(9%) sepia(16%) saturate(6586%) hue-rotate(196deg) brightness(100%) contrast(99%);

    --Color_Primary:        var(--GHAPS_Blue);
    --Color_PrimaryDk:      var(--GHAPS_Blue);
    --Color_Secondary:      var(--GHAPS_MedBlue);
    --Color_Accent:         var(--GHAPS_Gold);
    --Color_Text:           var(--DL_Black);
    --Color_Link:           var(--Color_Secondary);

    --Color_BackgroundLt:   var(--GHAPS_LtGray);
    --Color_BackgroundXLt:  var(--GHAPS_XLtBlue);
    --Color_ComplPrimary:   var(--Color_White);

    --Font_Base:            'Open Sans', Arial, Helvetica, sans-serif;
    --Font_Heading:         'Open Sans', Arial, Helvetica, sans-serif;

    --Site_ComponentMargin: 3rem;
    --Site_ComponentWidth:  calc(100% - (var(--Site_ComponentMargin) * 2));
    --Site_MainLogoWidth:   80px;
    --Site_BorderRadius:    15px;
    --Site_TextShadow:      none;
    --Site_BoxShadow:       2px 2px 5px rgba(0, 0, 0, .4);
}

html {
    text-wrap: pretty;
}

.nav-slider-deactivated .nav-main .top_level_item.active .top_level_link, 
.nav-slider-deactivated .nav-main .top_level_item:hover .top_level_link, 
.nav-slider-deactivated .nav-main .top_level_item.hoverfocus .top_level_link
{
    color: var(--Color_Accent);
}

h1
{
    font-weight: 600;
    font-size: 2.75rem;
}

h2,
h3, 
.fbcms_news_headlines .fbcms_article_title, 
.fbcms_newscontent .newsarticle_title, 
.fbcms_storylist .story_title, 
.fbcms_story_search .story_title
{
    font-weight: 700;
}
h2:where(:not(.fbcms_ec_titletext))
{
    background: var(--Color_Primary);
    color: var(--GHAPS_White);
    padding: .5em .75em;
    border-left: solid 6px var(--Color_Accent);
    font-weight: bold;
}
h2:where(:not(.fbcms_ec_titletext))
{
    padding: .25em .75em;
}
h1 span 
{
    display: block;
    font-size: .75em;
    color: var(--Color_Secondary);
}

.fbcms_ec_title {
    border-left: solid 6px var(--Color_Accent);
}
.fbcms_ec_title:hover, .fbcms_ec_title:focus-visible {
    background-color: var(--Color_Secondary);
}
.fbcms_ec .fbcms_richtext_content {
    padding: 10px;
    background-color: var(--Color_BackgroundXLt);
}

/* Welcome */
.home_focus 
{
    border-bottom: solid 6px var(--Color_Accent);
}
.flexi .fbcms_content.flexi_block.pup_welcome:first-child
{
    width: 100% !important;
    text-align: center;
    padding: 0;
}
.flexi .fbcms_content.flexi_block.pup_welcome:first-child h1
{
    position: relative;
    z-index: 100;
    margin-top: -2.5em;
    color: #fff;
    text-shadow: 1px 1px 2px hsla(0, 0%, 0%, 0.55), -1px -1px 2px hsla(0, 0%, 0%, 0.55), 1px -1px 2px hsla(0, 0%, 0%, 0.55), -1px 1px 2px hsla(0, 0%, 0%, 0.55);
}
@media only screen and (min-width: 1200px)
{
    .main_focus .flexi .fbcms_content.flexi_block
    {
        padding: 3rem 0;
    }

    /* When 3 or 6 flexi content blocks */
    .main_focus .flexi .flexi_block:first-child:nth-last-child(3), 
    .main_focus .flexi .flexi_block:first-child:nth-last-child(3) ~ .flexi_block,
    .fbcms_editmode .main_focus .flexi .flexi_block:first-child:nth-last-child(4), 
    .fbcms_editmode .main_focus .flexi .flexi_block:first-child:nth-last-child(4) ~ .flexi_block,
    .main_focus .flexi .flexi_block:first-child:nth-last-child(6), 
    .main_focus .flexi .flexi_block:first-child:nth-last-child(6) ~ .flexi_block,
    .fbcms_editmode .main_focus .flexi .flexi_block:first-child:nth-last-child(7), 
    .fbcms_editmode .main_focus .flexi .flexi_block:first-child:nth-last-child(7) ~ .flexi_block
    {
        width: calc(50% - (2rem / 2));
    }
    /* Any more than 3 defaults to halves */
}

/* Proposed Projects */
.component1 .component_liner
{
    width: 100%;
    background: var(--GHAPS_DkBlue);
    padding: 0;
}
.component1 .fbcms_news_headlines 
{
    padding: 0;
    margin: 0;
}
.component1 .fbcms_news_headlines .fbcms_contentheader
{
    padding: 2em var(--Site_ComponentMargin) 0;
    text-align: center;
}
.component1 .fbcms_headline_list_content 
{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-gap: 2px;
}
.component1 .fbcms_news_headlines .fbcms_article
{
    position: relative;
    margin: 0;
    background: var(--Color_Secondary);
}
.component1 .fbcms_news_headlines .fbcms_article_imageblock
{
    line-height: 0;
}
.component1 .fbcms_news_headlines .fbcms_article_imageblock img 
{
    width: 100%;
    line-height: 0;
}
.component1 .fbcms_news_headlines .fbcms_article_textblock
{
    padding: 1rem;
    background: var(--DK_TransTeal);
    color: #fff;
}
.component1 .fbcms_news_headlines .fbcms_news_headlines_title,
.component1 .fbcms_news_headlines .fbcms_article_title,
.component1 .fbcms_article_summary a
{
    color: #fff;
}
.component1 .fbcms_news_headlines .fbcms_article_summary
{
    font-size: .825em;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 8;
    overflow: hidden;
    -webkit-box-orient: vertical;
    margin-bottom: .5em;
}
@media only screen and (min-width: 768px)
{
    .component1 .fbcms_headline_list_content 
    {
        grid-gap: 0;
    }
    .component1 .fbcms_news_headlines .fbcms_article_textblock
    {
        position: absolute;
        top: 30%;
        width: 60%;
        box-shadow: var(--Site_BoxShadow);
    }
}

/* Projects and statistics */
.component2
{
    background: var(--GHAPS_White);
}
@media only screen and (min-width: 768px)
{
    .component2 .left_col .column_inner
    {
        position: sticky;
        top: 2rem;
    }
    .component2 .column.left_col 
    {
        width: calc(50% - 2rem);
    }
    .component2 .column.right_col
    {
        width: calc(50% - 2rem);
    }
}
@media only screen and (min-width: 994px)
{
    .component2 .left_col .column_inner
    {
        position: sticky;
        top: 2rem;
    }
    .component2 .column.left_col 
    {
        width: calc(60% - 3rem);
    }
    .component2 .column.right_col
    {
        width: calc(40% - 3rem);
    }
}

/* Vertical No Wrap special style */
.spotlights_vertical .fbcms_spotlight.linedup
{
    margin-bottom: 0;
    padding: 5px 0;
}
.spotlights_vertical .fbcms_spotlight.linedup:after,
.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:after
{
    display: none;
}
    
.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner
{
    padding: 0;
    display: grid;
    grid-template-columns: 80px 1fr;
}
.spotlights_vertical .fbcms_spotlight.linedup a.fbcms_spotlight_liner:hover,
.spotlights_vertical .fbcms_spotlight.linedup a.fbcms_spotlight_liner:focus
{
    background: transparent;
}

.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_image
{
    text-align: center;
    background-color: #fff;
    padding: 20px;
    border: solid 3px var(--Color_Accent);
    border-right: none;
    border-radius: 2px 0 0 2px;
    position: relative;
    display: grid;
    align-content: center;
    margin: 0 auto;
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    min-height: 100%;
}
.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_image:after 
{
    display: none;
}

.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_text
{
    background-color: var(--Color_Primary);
    color: #fff;
    padding: 1rem 12px;
    height: 100%;
    display: grid;
    align-content: center;
    transition: all .3s ease;
    border-radius: 2px;
    grid-column-start: 1;
    grid-column-end: last;
    text-align: center;
}
.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_image ~ .fbcms_spotlight_text
{
    grid-column-start: 2;
    border-radius: 0 2px 2px 0;
    text-align: left;
}
.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:hover .fbcms_spotlight_text, 
.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:focus .fbcms_spotlight_text {
    background-color: var(--Color_Secondary);
}
.spotlights_vertical .fbcms_spotlight.linedup .desc_short
{
    color: #fff;
    font-size: 1.2rem;
    font-weight: 700;
/*    text-transform: uppercase;*/
    margin-bottom: 0;
}    
.spotlights_vertical .fbcms_spotlight.linedup .desc_long
{
    font-size: .825rem;
}
.spotlights_vertical .fbcms_spotlight.linedup .desc_long:empty,
.spotlights_vertical .fbcms_spotlight.linedup .more_link,
.spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_text:after
{
    display: none;
} 
@media only screen and (min-width: 994px)
{
    .spotlights_vertical .fbcms_spotlight.linedup
    {
        overflow: visible;
    }
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner
    {
        display: grid;
        grid-template-columns: 120px 1fr;
    }
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_image img
    {
        transform: scale(.9);
        transition: all .3s ease-out;
    }
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:hover .fbcms_spotlight_image img,
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:focus .fbcms_spotlight_image img
    {
        transform: scale(1) rotate(0.01deg);
    }

    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_text
    {
        position: relative;
        padding: 15px 20px;
        min-height: 80px;
        grid-template-rows: auto 0fr;
        align-items: center;
    }
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_text:has(.desc_long:not(:empty))
    {
        grid-template-rows: auto 0fr;
    }
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:hover .fbcms_spotlight_text:has(.desc_long:not(:empty)),
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:focus .fbcms_spotlight_text:has(.desc_long:not(:empty))
    {
        grid-template-rows: auto 1fr;
    }
    .spotlights_vertical .fbcms_spotlight.linedup .desc_long
    {
        overflow: hidden;
        opacity: 0;
        transition: all .3s;
    }
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:hover .desc_long,
    .spotlights_vertical .fbcms_spotlight.linedup .fbcms_spotlight_liner:focus .desc_long
    {
        opacity: 1;
    }
}

/* Calculator */
.component3
{
    background: var(--GHAPS_LtGray);
}


/* FAQs */
.component4
{
    background: var(--GHAPS_White);
}
@media only screen and (min-width: 768px)
{
    .component4 .left_col .column_inner
    {
        position: sticky;
        top: 2rem;
    }
}


/* Interviews */
.component5
{
    background: var(--GHAPS_LtGray);
}
.pup_content5.fbcms_videoblock:not(.lastone)
{
    padding: 0 0 2rem;
}
.fbcms_component:not(.home_focus) h2.fbcms_videoblock_title
{
    font-size: 1.2rem;
    color: var(--EF_XDkBlue);
    margin-bottom: 0;
}
@media only screen and (min-width: 768px)
{
    .component5 .pup_content5
    {
        text-align: center;
    }
    .component5 .component_liner,
    .component5 .pup_content5.vpadm_editable_section
    {
        display: grid;
        align-items: start;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-gap: 2rem; 
    }
    .fbcms_editmode .component5 .component_liner
    {
        display: block;
    }
    .component5 .pup_content6.fbcms_content
    {
        width: 100%;
    }
    .component5 .pup_content5:not(.fbcms_videoblock),
    .component5 .pup_content5 .addblock_buttonbar_wrapper 
    {
        grid-column: 1 / 3;
    }
    .pup_content5.fbcms_videoblock
    {
        display: grid;
        align-items: start;
        grid-gap: .5rem;
    }
    .pup_content5.fbcms_videoblock .fb_videoresponsive 
    {
        grid-row: 1;
    }
    .pup_content5.fbcms_videoblock .fbcms_contentheader 
    {
        grid-row: 2;
    }
}
@media only screen and (min-width: 1200px)
{
    .component5 .component_liner,
    .component5 .pup_content5.vpadm_editable_section
    {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .component5 .pup_content5:not(.fbcms_videoblock),
    .component5 .pup_content5 .addblock_buttonbar_wrapper  
    {
        grid-column: 1 / 4;
    }
}

/* Documents / Links / Flexi */
.component6
{
    background: var(--Color_Secondary);
    position: relative;
    color: #fff;
}
.component6 a,
.component6 h2,
.component6 h3,
.component6 h4,
.component6 h5,
.component6 h6,
.component6 .content_intro
{
    color: #fff;
}

.component6:after 
{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: cover;
    background-attachment: fixed;
    z-index: 1;
    opacity: .05;
}
.component6 .fbcms_content,
.component6 .fbcms_section
{
    position: relative;
    z-index: 2;
}

.component6 h2.data-driven-title
{
    text-align: center;
    margin-bottom: 2em;
}
.component6 .fbcms_spotlights .horz_layout_0 .fbcms_spotlight_slide_liner
{
    max-width:  1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    grid-gap: 1rem 3rem;
}
.component6 a.fbcms_spotlight_liner:hover,
.component6 a.fbcms_spotlight_liner:focus
{
    background: transparent;
}
.component6 .fbcms_spotlights .fbcms_spotlight_image 
{
    filter: var(--DK_TransTeal);
    transform: scale(.9);
    transition: all .3s;
}
.component6 a.fbcms_spotlight_liner:hover .fbcms_spotlight_image,
.component6 a.fbcms_spotlight_liner:focus .fbcms_spotlight_image 
{
    transform: scale(1);
}
.component6 a.fbcms_spotlight_liner .desc_short
{
    color: #fff;
}
.component6 a.fbcms_spotlight_liner:hover .desc_short,
.component6 a.fbcms_spotlight_liner:focus .desc_short 
{
    text-decoration: underline;
}