/* sanitize */
html
{
    box-sizing: border-box;
    width: 100%;
    height: 100%;
}

/* wrap in min-width */
@media only screen and (min-width:0)
{
    ul
    {
        list-style-position: inside;
    }

    a,
    a:active,
    a:visited
    {
        text-decoration: none;

        color: #015570;
    }

    a:hover
    {
        text-decoration: underline;
    }

    hr 
    {
        border: 0;
        height: 1px;
        background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
    }

    .header {
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }

    .page-header
    {
        font-size: 1.5rem;

        padding: 30px 0 40px 0;

        text-align: center;
        text-transform: uppercase;

        color: #000;
    }

    .page-header__alt
    {
        font-size: 1.5rem;

        padding: 30px 0 10px 0;

        text-align: center;
        text-transform: uppercase;

        color: #000;
    }

    .v10-logo
    {
        width: 50px;

        background: transparent;
    }

    .hero-wrapper
    {
        position: relative;

        overflow: hidden;

        width: 100vw;
        height: 70vh;
    }

    .fancy
    {
        display:         flex;
        display: -webkit-flex;
                flex-direction: row;

        width: 100%;
        height: 100%;

        -webkit-transition: ease 1s all;
           -moz-transition: ease 1s all;
             -o-transition: ease 1s all;
                transition: ease 1s all;
        animation-name: ken-burns;
        animation-duration: 3s;
        animation-timing-function: ease;
        animation-delay: 0s;
        animation-iteration-count: 1;

        background-color: #000;
        background-repeat: no-repeat;
        background-attachment: initial;
        background-position: 50% 50%;
        background-size: cover;

        -webkit-flex-direction: row;
        -webkit-align-items: center;
                align-items: center;
        -webkit-justify-content: center;
                justify-content: center;
        animation-fill-mode: forwards;
    }

    .fancy::after
    {
        position: absolute;
        top: 0;
        left: 0;

        display: block;

        width: 100vw;
        height: 80vh;

        content: '';

        background: rgba(0,0,0,.5);
    }

    .announcement-link-override {
        color: #fff;
    }

    @keyframes ken-burns
    {
        0%
        {
            -webkit-transform: scale(1.2);
                    transform: scale(1.2);

            opacity: 1;
        }

        1.5625%
        {
            opacity: 1;
        }

        23.4375%
        {
            opacity: 1;
        }

        26.5625%
        {
            -webkit-transform: scale(1);
                    transform: scale(1);

            opacity: 1;
        }

        100%
        {
            -webkit-transform: scale(1);
                    transform: scale(1);

            opacity: 1;
        }
    }

    .hero-logo
    {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;

        width: 50%;
        max-width: 400px;
        margin: auto auto;

        background: transparent;
    }

    /* Members Landing Page */
    .member-list__container
    {
/*
        display: flex;
        flex-direction: row;

        margin: 0 auto;

        flex-flow: row wrap;
        flex-wrap: wrap;
        -webkit-align-items: center;
                align-items: center;
        -webkit-justify-content: center;
                justify-content: center;
        align-content: space-between;
        padding-bottom: 1em;
*/
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 1rem;

        margin: 0 auto;
        padding-bottom: 1em;
    }

    .member-hof__blurb
    {
        text-align: center;
        max-width: 90%;
        padding-bottom: 1em;
    }

    .member-list__member
    {
        padding-bottom: 1.5rem;
    }

    .member-list__thumbnail
    {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;

        display: block;

        width: 100%;
        height: auto;
        margin: auto;
    }

    .member__headshot
    {
        position: relative;

        width: 100%;
        height: auto;
    }

    .member-list__thumbnail-container
    {
        position: relative;

        overflow: hidden;

        width: 100%;
        height: 0;
        margin: 0 0 0 0;

        background: #000;
    }

    .member-list__thumbnail-title
    {
        font-size: 1rem;
        font-weight: bold;
        line-height: auto;

        overflow: hidden;

        padding: .25rem .5rem 0 .5rem;

        text-align: center;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .member-list__thumbnail-quick-details
    {
        font-size: .75rem;

        padding: .125rem .5rem 0rem .5rem;

        text-align: center;

        color: #777;
    }

    .article__headline-container
    {
        position: absolute;
        top: 0;
        bottom: 0;

        display: -webkit-box;
        display:    -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display:         flex;
                flex-direction: column;

        width: 100%;
        height: 100%;
        margin-bottom: 1rem;
        /* WebKit */

        -webkit-transition: all .3s ease-in;
           -moz-transition: all .3s ease-in;
        /* Opera */
             -o-transition: all .3s ease-in;
        /* Standard */
                transition: all .3s ease-in;
        text-align: center;

        background: rgba(0,0,0,.5);

        -webkit-flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .article__byline
    {
        font-size: .725rem;

        margin: 0 auto;
    }

    .story__blurb
    {
        font-size: .75rem;

        color: #fff;
    }

    .article__headline
    {
        font-size: 1.5rem;

        max-width: 24rem;

        text-align: center;

        color: #fff;
    }

    .post__thumbnail-container
    {
        position: relative;
    }

    .post__thumbnail
    {
        position: absolute;
        top: 0;
        left: 0;
    }

    .post__link
    {
        position: relative;
    }

    .post__link:active .article__headline-container,
    .post__link:hover .article__headline-container
    {
        background: rgba(0,0,0,.25);
    }

    .post__name
    {
        max-width: 80%;

        color: #fff;
    }

    .icon-container
    {
        display: inline-block;

        width: 36px;
        height: 36px;
        margin: 0 4px;

        background: #fff;
    }

    .icon-container-link 
    {
        background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAPXSURBVGhD7drbyxVVGMfxtywrCYIuioKCTlYGUVmZEmbXYmQk/QcRYReiFUFlFxFEF4FW5IEkOqnYjVJdWCEaFHUbFOGFWWYnNRSzsoPfb7hiGJ6ZvWb2zN5b6Aefi/0ye2aevWdmrfXsd2pCcjrm4xGsxRa8iudxD87HROdcPIVv8E+N49iAyzFxWYzvEJ14ld/xACYip+EJ/I3oZHO8BPcztnhwTyI6uaa8n8aSLovQn7gVI01uEd4z6/AYnsYniLZLPsDIklPEb1iOM1DOXTiE6H26Ab0np4hf4BhSlzvgpRS93wdHr8ktYh5y8iaifbyP3tJ1EWYJov18iV7SRxHmdkT7+gmdxyIWYhnux8N4DXuQDtymCOOcq1hA0ts3UpXr4WSwTRHmZUSF9HqPdJ1LcBRRIY43nWcGvJa9Mb207jv5+my0zXQ48EVF6GZ0Eu+Le7ENxxAd7Ajexm1okmnYjGif+hwef+j4aX+G6CBVvE9yFkoWsQnRPhIfLENnKVzwRAcYZDeuQVUs4i1E703exVDxq1yFaOdNfIGzUE5OEV/hPLSORbyIaOdtlO8Zi3gD0bbJ97gSrWMRg0Zs/QUHqY9RHAgjxTHFIhw8o+0Si7gWrZNThE8sn+kXo5gbsRPl7YuXlkXYNSlvU7QfvRfhfGcuquI6w27JYbhW34V0s1uEHZJov4kLrrqHw8DkFPEzchc39q8cNFN8/Qqi/Sb7cDVaJ6eIA/DSMW5vq8bL6CM8ePJvVTkTgy4ni5iJ1skp4iBuQoortfI27+AilHMdovum6Fv0XoRr6NlI8T1Oz6NtfQhsxbNYDZ9mg3padh6vQuu0KcI4KaxaUze1F1dgqNiGiXae+KlXzTZ3IHpPE19j6CIWoe4rt4hbUBUvBT/N6L057GGVx6DG8ZFY1xG3iDkYlAsx6CYuc+Lp5TzMmuW/1F1SFlE32JXjfebCyrVCtL/kV2zELHQSD1z1bdjGX4C2cSB7CP5g42RwDVbibhQHxk7idR8VIduYp0weRVSEkzRH36ZxXrUCF/z7aoR5AVEh69E0FpHW2GkgtLdl79aZq+OPT8dz0HlsCpSL0ONokmIRVX5AZzd3OVVT6GeQm7EXYZwDRQf+FDmZiCJMVZdb/shSFx8GE1GEsRvxB6KTcDC8E1EuxaD51ciKSKlbajqFeB12Ex1z7Io7sNk9jLZPRl6EuQyO4tEJtTGWIlLsHEYn1dRYi0ipGhxz2QEcqlHQZRyJ26z23sPE/RePrcztiE64zK6i/yAz0XFZ+yQ+hB30H2Eb1J+7nkPOYuv/5Gdq6gSz+zJ2W9R9lgAAAABJRU5ErkJggg==") left center no-repeat;
        background-size: 15px 15px;
        padding-left: 20px;
    }
}

@media only screen and (min-width:768px)
{
    .v10-logo
    {
        width: 70px;
    }

    .hero-image
    {
        width: auto;
        max-height: 700px;
        margin-left: 15%;
    }

    .hero-title
    {
        right: 15px;
        bottom: 40vh;
        left: initial;

        max-width: 300px;

        background: none;
    }

    .article__headline
    {
        font-size: 2rem;
        line-height: 1.25em;
    }

    .story__blurb
    {
        font-size: 1rem;
        line-height: 1;
    }

    .article__byline
    {
        font-size: 1rem;
    }

    .recent-posts
    {
        display: flex;
        flex-direction: row;

        margin: 0 auto;

        flex-flow: row wrap;
        flex-wrap: wrap;
        -webkit-align-items: flex-start;
                align-items: flex-start;
        -webkit-justify-content: flex-start;
                justify-content: flex-start;
        align-content: space-between;
    }

    .post
    {
        flex: 50%;
    }

    .member-list__thumbnail-title
    {
        font-size: 1rem;
    }
}

@media only screen and (min-width:1024px)
{
    .v10-logo
    {
        width: 100px;
    }

    .post
    {
        flex: 33.33%;
    }

    .member-list__container
    {
        grid-template-columns: repeat(4, 1fr);
    }

    .member-list__thumbnail-title
    {
        font-size: 1.25rem;
    }
}

@media only screen and (min-width:1440px)
{
    .member-list__container
    {
        max-width: 1280px;
    }
}

@media only screen and (min-width:49em)
{
}
