.fl-post .bglefttop img {object-position:left top}
.fl-post .bgleftcenter img {object-position:left center;}
.fl-post .bgleftbottom img {object-position:left bottom;}
.fl-post .bgcentertop img {object-position:center top;}
.fl-post .bgcentercenter img {object-position:center center;}
.fl-post .bgcenterbottom img {object-position:center bottom;}
.fl-post .bgrighttop img {object-position:right top;}
.fl-post .bgrightcenter img {object-position:right center;}
.fl-post .bgrightbottom img {object-position:right bottom;}

/* Spotlight Card */
.arrow_diagonal {
    background-position-x: calc(100% - 4px);
    background-position-y: 4px;
    background-repeat: no-repeat;
    background-size: 26px;
    transition: background-position .25s ease-in-out;
}
.arrow_diagonal.black { background-image: url('/wp-content/uploads/ui-arrow-diagonal-black.svg'); }
.arrow_diagonal.white { background-image: url('/wp-content/uploads/ui-arrow-diagonal-white.svg'); }

/* spotlight card image */
.card--spotlight--img {
    position: relative;
}
.card--spotlight .img {
    bottom: 0px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}
.card--spotlight .img .fl-photo-content {
    height: 100%;
    overflow: hidden;
    width: 100%;
}
.card--spotlight .img img {
    max-height: 334px;
    height: 40vw !important;
    object-fit: cover;
    object-position: center center;
    /* Ken Burns faster zoom out on hover off */
    transition: transform 1s ease-in-out;
    width: 100%;
}

.grayscale {
    filter: grayscale(100%);
    transition: filter .75s ease-in-out;
    transition-delay: .25s;
}

/* hover states, excluding mobile */
@media only screen and (min-width: 769px) {
    .card--spotlight:hover {
        cursor: pointer;
    }
    .card--spotlight:hover .grayscale { 
        filter: grayscale(0); 
    }
    .card--spotlight:hover .arrow_diagonal {
        /* background-position-x: calc(100% - 14px);
        background-position-y: 14px;
        transition: background-position .5s ease-in-out; */
        animation: 1s arrow-bounce infinite alternate;
    }
}
@keyframes arrow-bounce {
    0% {
        background-position-x: calc(100% - 4px); /* Start at the initial position */
        background-position-y: 4px;
        animation-timing-function: ease-out; /* Accelerate as it moves down */
    }
    25% {
        background-position-x: calc(100% - 4px); /* Start at the initial position */
        background-position-y: 4px;
        animation-timing-function: ease-out; /* Accelerate as it moves down */
    }
    50% {
        background-position-x: calc(100% - 14px); /* Move diagonally down and right */
        background-position-y: 14px;
        animation-timing-function: ease-in; /* Decelerate as it reaches the peak of the bounce */
    }
    100% {
        background-position-x: calc(100% - 4px); /* Return to the initial position (or another point for continuous bounce) */
        background-position-y: 4px;
        animation-timing-function: ease-in; /* Accelerate again for the next bounce */
    }
}
/* Ken Burns slow zoom on hover */
.card--spotlight:hover .img img {
    transform: scale(1.03);
    transition: transform 1s ease-in-out;
}
.card--spotlight.people .img img { object-position: top center; }

/* hides trigger button */
body:not(.fl-builder-edit) .uabb-offcanvas-trigger { display: none !important; }

/* BB XL Desktop*/
@media only screen and (min-width: 1367px) {
    .spotlights.people {  justify-content: right; }
}
/* BB L Desktop*/
@media only screen and (min-width: 993px) and (max-width: 1366px) {
    /* .spotlights.work > div:nth-of-type(1),
    .spotlights.work > div:nth-of-type(2){
        flex-grow: 1;
    }
    .spotlights.work > div:nth-of-type(3) {
        flex-grow: 0;
        flex-basis: calc(50% - calc(21px / 2)); /* half the container - half the gap */
    /* } */

    .spotlights.work .card--spotlight {
        flex-basis: 270px;
        flex-grow: 1;
        min-height: 693px;
    }
    .spotlights.work .card--spotlight--img {
        height: 100%;
        max-height: 335px;
    }
    .spotlights.work .card--spotlight--info {
        height: 100%;
        min-height: 359px;
    }

    .spotlights.people {  justify-content: right; }
}
/* Custom */
@media only screen and (min-width: 1047px) and (max-width: 1228px) {
    .spotlights.work .card--spotlight {
        min-height: 750px;
    }
    .spotlights.work .card--spotlight--info {
        min-height: 416px;
    }
}
/* Custom */
@media only screen and (min-width: 993px) and (max-width: 1046px) {
    /* .spotlights.work > div {
        flex-basis: 418px;
        flex-grow: 0 !important;
    } */

    /* flex-basis: 394px; for smallest before tablet */

    .spotlights.work .card--spotlight {
        min-height: 790px;
    }
    .spotlights.work .card--spotlight--info {
        min-height: 456px;
    }
}
/* BB Tablet */
@media only screen and (max-width: 992px) {
    .row--spotlights .fl-builder-shape-layer svg {
        height: 270px;
    }
    .spotlights.work > div:nth-of-type(1),
    .spotlights.work > div:nth-of-type(2){
        flex-grow: 1;
    }
    .spotlights.work > div:nth-of-type(3) {
        flex-grow: 0;
        flex-basis: calc(50% - calc(21px / 2)); /* half the container - half the gap */
    }
    .spotlights.people {  justify-content: left; }
}
/* Custom */
@media only screen and (min-width: 769px) and (max-width: 785px) {
    .spotlights.work > div:nth-of-type(1),
    .spotlights.work > div:nth-of-type(2),
    .spotlights.work > div:nth-of-type(3){
        flex-basis: 330px;
    }
}
/* BB Mobile */
@media only screen and (max-width: 768px) {
    .row--founders .maxwidth500 {
        margin-left: 0;
    }
    .row--spotlights .fl-builder-shape-layer svg {
        height: 219px;
    }
    .spotlights.work > div:nth-of-type(1),
    .spotlights.work > div:nth-of-type(2){
        /* flex-basis: 339px; */
        flex-basis: 264px;
        flex-grow: 1;
    }
    .spotlights.work > div:nth-of-type(3) {
        flex-grow: 0;
        flex-basis: calc(50% - calc(21px / 2)); /* half the container - half the gap */
    }
    .spotlights.work .card--spotlight .img img {
        max-height: 219px;
        height: 60vw !important;
    }
    .spotlights.work .card--spotlight {
        min-height: 300px;
        height: auto;
    }
    .spotlights.work .card--spotlight--img {
        /* height: 100%; */
        /* max-height: 219px; */
        height: 219px;
    }
    .spotlights.work .card--spotlight--info {
        /* height: 100%;
        min-height: 409px; */
        height: auto;
        min-height: 0;
        gap: 26px;
    }


    .people .card--spotlight .img img {
        height: 154px !important;
    }
    /* .card--spotlight .grayscale { 
        filter: grayscale(0); 
    } */
    .spotlights.people .arrow_diagonal { flex-grow: 1; }


}
/* Custom */
@media only screen and (max-width: 600px) {
    .spotlights.work > div:nth-of-type(1),
    .spotlights.work > div:nth-of-type(2),
    .spotlights.work > div:nth-of-type(3){
        flex-grow: 1;
        flex-basis: 290px;
    }
}


/* people */
.people--name { width: min-content; }




/* flyout as individual post */

body:not(.fl-builder-edit).flyout-template-default .hero-grayscale .fl-row-content-wrap {
    opacity: 0;
}
body:not(.fl-builder-edit).flyout-template-default .hero .fl-row-content-wrap{
    padding-top: 170px !important;
    padding-left: var(--content-padding) !important;
    padding-right: var(--content-padding) !important;
}
body:not(.fl-builder-edit).flyout-template-default .flyout--bio .fl-row-content-wrap {
    padding-top: 170px !important;
}
body:not(.fl-builder-edit).flyout-template-default .flyout--spacer {
    display: none;
}

body:not(.fl-builder-edit).flyout-template-default .flyout--bio .fl-col-group-equal-height > div:first-of-type > .fl-col-content {
    padding-left: var(--content-padding) !important;
}
body:not(.fl-builder-edit).flyout-template-default .flyout--bio .fl-col-group-equal-height > div:last-of-type > .fl-col-content{
    padding-right: var(--content-padding) !important;
}
/* BB XL DESKTOP, and up */
@media only screen and (min-width: 1368px) {
    body:not(.fl-builder-edit).flyout-template-default .hero .fl-row-content-wrap,
    body:not(.fl-builder-edit).flyout-template-default .content .fl-row-content,
    body:not(.fl-builder-edit).flyout-template-default .flyout--bio .fl-row-content-wrap {
        max-width: 1366px;
        margin: auto;
        padding-left: var(--content-padding) !important;
        padding-right: var(--content-padding) !important;
    }
    body:not(.fl-builder-edit).flyout-template-default .content .fl-row-content-wrap {
        border-right: none;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
/* BB Tablet */
@media only screen and (max-width: 768px) {
    body:not(.fl-builder-edit).flyout-template-default .hero .fl-row-content-wrap,
    body:not(.fl-builder-edit).flyout-template-default .flyout--bio .fl-row-content-wrap {
        padding-top: 84px !important;
    }
    body:not(.fl-builder-edit).flyout-template-default .flyout--bio .fl-row-content-wrap {
        padding-left: 0;
        padding-right: 0;
    }
}
        

/* flyout */
.uabb-offcanvas {
    max-width: 100% !important;
    height: 100lvh !important;
}
.uabb-offcanvas-animating, .uabb-offcanvas, .uabb-offcanvas-overlay {
    -webkit-transition: all .75s;
    transition: all .75s;
}

/* when uabb-offcanvas is open */
html:has(.uabb-off-canvas-show){
    overflow-y: hidden; /* prevent document from scrolling behind overlay */
}
.uabb-off-canvas-show~.uabb-offcanvas-overlay {
    transition: all .75s;
    /* transition-delay: 0s; */
}
.uabb-offcanvas-overlay{
    transition: all .75s;
    /* transition-delay: 1s; */
}
body.flyout-open header.fl-page-header {
    transition-delay: 0s;
}
body header.fl-page-header {
    transition: all .5s;
    transition-delay: .5s;
}

/* close button */
.uabb-offcanvas .uabb-offcanvas-close-icon-wrapper .uabb-offcanvas-close {
    background: var(--SFF-SFF-Cool-Grey);
    border: 1px solid var(--SFF-SFF-Cool-Grey) !important;
    height: 70px;
    line-height: 0;
    opacity: 0;
    pointer-events: none; /* disable buttons on flyouts that aren't open, so they don't block ones that are */
    position: fixed;
    /* right: -70px; */
    right: 0px;
    top: 38px;
    transition: all .05s ease-in-out;
    transition-delay: -.25s;
    transition-property: opacity;
    width: 70px;
}
.uabb-offcanvas.uabb-off-canvas-show .uabb-offcanvas-close-icon-wrapper .uabb-offcanvas-close {
    opacity: 1;
    pointer-events: auto; /* reenable button on flyout that is open */
    right: 0;
    transition-delay: 1.5s;
    transition: opacity 1s ease-in-out;
}
body.admin-bar .uabb-offcanvas.uabb-off-canvas-show .uabb-offcanvas-close-icon-wrapper .uabb-offcanvas-close {
    margin-top: var(--admin-bar-height);
}

.uabb-offcanvas-close-icon-wrapper .uabb-offcanvas-close-icon {
    line-height: 0.65;
    pointer-events: none;
}
.uabb-offcanvas-close .fa-times:before {
    content: url('/wp-content/uploads/action-close.svg');
    pointer-events: none;
}
.uabb-offcanvas .fl-builder-content { background-color: var(--SFF-SFF-Warm-White); }

/* START :: hero grayscale background image */
body:not(.fl-builder-edit) .hero-grayscale { position: relative; }
body:not(.fl-builder-edit) .hero-grayscale:before {
    bottom: 0;
    content: " ";
    display: block;
    filter: grayscale(100%);
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0;
}
body:not(.fl-builder-edit) .hero-grayscale > .fl-row-content-wrap {
    position: relative;
    z-index: 1;
}
/* END   :: hero grayscale background image */

.hero--img img {
    object-fit: cover;
}
/* BB XL Desktop*/
@media only screen and (min-width: 1367px) {
    .hero--img img {
        height: 77vw !important;
        max-height: 598px;
        width: 395px;
    }
}
/* BB L Desktop*/
@media only screen and (min-width: 993px) and (max-width: 1366px) {
    .uabb-offcanvas .uabb-offcanvas-close-icon-wrapper .uabb-offcanvas-close {
        height: 60px;
        width: 60px;
    }
    .hero--img img {
        height: 77vw !important;
        max-height: 598px;
        width: 405px;
    }
}
/* BB Tablet */
@media only screen and (max-width: 992px) {
    .uabb-offcanvas-close .fa-times:before {
        background-size: cover;
        background: url('/wp-content/uploads/action-close-tablet.svg') no-repeat center center;
        content: "";
        display: inline-block;
        height: 17px;
        width: 17px;
    }
    .uabb-offcanvas .uabb-offcanvas-close-icon-wrapper .uabb-offcanvas-close {
        height: 36px;
        width: 36px;
    }
    .hero--img img {
        height: 77vw !important;
        max-height: 496px;
        width: 336px;
    }
}
/* BB Mobile */
@media only screen and (max-width: 768px) {
    /* close button */
    .uabb-offcanvas .uabb-offcanvas-close-icon-wrapper .uabb-offcanvas-close {
        height: 34px;
        top: 36px;
        width: 34px;
    }
    .hero--img img {
        height: 77vw !important;
        max-height: 256px;
        width: 235px;
    }
}



.tag {
    border: 1px solid var(--SFF-SFF-Warm-White);
    padding: 4px 16px;
    width: fit-content;
}
.tag p {
    font-family: var(--font-content);
    font-size: 14px;
    font-size: 0.88rem;
    font-weight: 400;
    line-height: 22px; 
    line-height: 1.38rem;
    white-space: nowrap;
}