/* body.dark.climate-action.feature {
    --theme-color: #000;
} */

#main {
    --flex-gap: 10px;
    --icon-gap: 5px;
    --grant-icon-count: 1;
    --grant-icon-size: 30px;
    --grant-icon-col-size: calc(var(--grant-icon-size) * var(--grant-icon-count) + var(--icon-gap) * ( var(--grant-icon-count) - 1 ));
    --indent: calc(var(--grant-icon-col-size) + var(--flex-gap) * (max(0, min(var(--grant-icon-count), 1))));
}

.feature #article b {
    display: inline-block;
    font-size: 12px;
    line-height: 18px;
    color: #FFF;
    break-before: avoid-column;
    break-inside: avoid-column;
}

.feature-body img {
    margin-bottom: 11px;
    break-after: avoid-column;
    cursor: url('../../media/svg/zoom-plus-3-w.svg') 10 10, zoom-in;
}
.viewing-fullwindow .feature-body img {
    cursor: url('../../media/svg/zoom-minus-3-w.svg') 10 10, zoom-out;
}
.feature blockquote {
    margin-right: 0px;
    margin-left: 0px;
}

.grantee-card,
.grantee-row {
    display: flex;
    gap: var(--flex-gap);  
    align-items: flex-start;  
    -webkit-transition: opacity 0.5s;
       -moz-transition: opacity 0.5s;
        -ms-transition: opacity 0.5s;
         -o-transition: opacity 0.5s;
            transition: opacity 0.5s;
}
.feature.viewing-fullwindow .grantee-card {
    pointer-events: none;
}
.feature #content {
    padding-top: 112px;
    padding-right: 110px;
    /* padding-bottom: 70px; */
    margin: 0;
    max-width: initial;
}

.hiding-grants-details.feature .page-header .organization {
    opacity: 0;
}

.viewing-fullwindow.feature .page-header .organization {
    opacity: 1;
}
.feature #back-btn {
    bottom: 20px;
    background-image: url(/media/svg/arrow-up-left-3-w.svg);
    /* transform: rotate(90deg); */
    /* opacity: 0.1; */
}
.feature #back-btn:hover {
    background-image: url(/media/svg/arrow-up-left-3-counter-w.svg);
    transform: rotate(0deg);
    opacity: 1;
}
.feature #next-btn {
    bottom: 130px;
}

.feature #next-btn:hover {
    background-image: url(/media/svg/arrow-right-3-counter-w.svg);
    background-color: transparent;
}
.feature .page-header {
    max-width: calc(100% - 60px);
}
.feature .page-header .organization {
    /* margin-bottom: 66px; */
    -webkit-transition: opacity 0.5s;
       -moz-transition: opacity 0.5s;
        -ms-transition: opacity 0.5s;
         -o-transition: opacity 0.5s;
            transition: opacity 0.5s;
}
#feature-footer {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 20px;
    margin-top: 240px;
    
}
.feature-indent {
    padding-left: var(--indent);
}
.feature #details-full ul {
    padding-left: 0px;
}
.feature #details-full li {
    margin-top: 0px;
}

.feature #details-full-pad {
    display: block;
    height: 95vh;
}

.feature #details-full-grantee {
    color: transparent;
}
.feature #article blockquote {
    margin-left: 0px;
}

.feature #article > div:last-of-type {
    padding-bottom: 22px;
}

.feature #next-up,
.feature #related {
    max-width: 500px;
    background-color: transparent;
    position: relative;
}
.feature #bio { 
    font-family: sf-mono, monaco, courier, monospace; 
    font-size: 14px;
    /* margin-top: 22px; */
}

.feature #bio a { 
    border-bottom: initial;
}

.feature #bio a::before {
    content: "";
    display: inline-block;
    height: 15px;
    width: 15px;
    padding-right: 10px;
    background-size: 15px 15px;
    background-position: 0px 2px;
    background-repeat: no-repeat;
}

.feature #bio a[href$=".pdf"]::before {
    background-image: url('/media/svg/pdf-1-w.svg');
}

.feature #bio a:not([href$=".pdf"])::before {
    background-image: url('/media/svg/arrow-right-3-w.svg');
}
.grantee-row + .grantee-row {
    margin-top: 25px;
}
.grantee blockquote {
    margin-left: 0;
    margin-right: 0;
}

.feature.viewing-grants-icon .page-header .grantee,
.feature.viewing-grants-icon .page-header .organization {
    display: none;
}

.grants-icon {
    width: var(--grant-icon-size);
    height: var(--grant-icon-size);
    flex: 0 0 var(--grant-icon-size);
    display: inline-block;
    vertical-align: top;
}
.feature .grants-icon {
    overflow: hidden;
    cursor: url('../../media/svg/zoom-plus-3-w.svg') 10 10, zoom-in;
    user-select: none; 
    -webkit-user-select: none; 
    -ms-user-select: none; 
    text-align: center;
}
.feature.viewing-grants-icon .grants-icon.fullwindow {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 530px;
    height: 530px;
    margin-top: initial;
    padding: 30px;
    cursor: url('../../media/svg/zoom-minus-3-w.svg') 10 10, zoom-out;
    /* cursor: zoom-out; */
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
         -o-transform: translate(-50%, -50%);
}
.feature.viewing-grants-icon .grants-icon:not(.fullwindow ){
    display: none;
}

.arrows-icon {
    width: 100%;
    height: 100%;
    position: relative;
}
.arrows-icon-shape,
.bg-hosting {
    background-image: url('/media/png/hosting.png');
    background-size: cover;
    background-repeat: no-repeat;
    animation: hosting var(--rotate-duration) var(--rotate-bezier) infinite;
}
.arrows-icon-shape {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
}

/* .viewing-grants-icon .grants-icon.hosting-icon {
    display: none;
} */
/* .grants-icon .white, */
.grants-icon .grants-icon-content {
    color: transparent;
    overflow: hidden;
    width:100%;
    height: 100%;
}

/* .viewing-grants-icon .grants-icon .white, */
.viewing-grants-icon .grants-icon .grants-icon-content {
    color: inherit;
    width: auto;
    height: auto;
}
.viewing-grants-icon .grants-icon .flip-card {
    --duration: 7s;
}
/* .dark .list .grants-icon {
    position: relative;
    top: 0px;
    left: 0px;
    margin-right: 5px;
    flex: 0 0 30px;
    vertical-align: bottom;
} */
.feature .grants-icon.hosting-icon {
    /* position: fixed; */
    /* top: 20px; */
    /* left: 55px; */
}
.category-icons-container {
    flex: 0 0 var(--grant-icon-col-size);
    display: flex;
    
    gap: var(--icon-gap);
    margin-top: -5px;
    align-items: center;
}
.grantee-info-container {
    flex: 1;
}
.showing-next-btn #next-btn,
.showing-next-btn #back-btn {
    -webkit-transition: opacity 0.5s, transform 0.0s !important;
       -moz-transition: opacity 0.5s, transform 0.0s;
        -ms-transition: opacity 0.5s, transform 0.0s;
         -o-transition: opacity 0.5s, transform 0.0s;
    -webkit-transition: opacity .25s, -webkit-transform 0.0s !important;
            transition: opacity 0.5s, transform 0.0s !important;
    opacity: 1.0;
    transform: rotate(0deg);
}
.related-grantee + .related-grantee,
.next-up-grantee + .next-up-grantee {
    margin-top: 25px;
}
@media screen and (max-width: 500px) {
    body.feature .main-container {
        display: block;
    }

    .feature #next-btn {
        bottom: 90px;
    }

    /* .feature .grantee blockquote,
    .feature .organization blockquote {
        margin-right: 90px;
    } */

    /* .feature #details-full-grantee blockquote,
    .feature #details-full-organization blockquote {
        margin-right: 70px;
    } */

    .feature.viewing-grants-icon .grants-icon {
        width: 100%;
        height: auto;
    }
    .grantee-card {
        margin-left: 0;
    }
    .feature #content {
        max-width: none;
        /* margin-top: 44px; */
        /* margin-top: 150px; */
        padding-right: 40px;
        margin-left: 0px;
        margin-right: 0px
    }
    #details-full-grantee,
    #details-full-organization,
    .page-header .grantee,
    .page-header .organization {
        margin-right: 70px;
    }
}