﻿/* testing changes to non-theme files  */

.handouts-img img:hover {
    -webkit-filter: brightness(70%);
    -ms-filter: brightness(70%);
    filter: brightness(70%);
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -ms-transition: all .5s ease;
    transition: all .5s ease;
}

.handouts-photos {
    background-color: #595960;
    min-height: 900px;
    margin: 0;
    padding-top: 0;
    display: flex;
    color: white;
}

    .handouts-photos.old {
        background-color: #cccccc;
        color: #595959;
    }

    .handouts-photos > div {
        max-width: 1440px;
        margin: 0 auto;
        display: flex;
        
        flex-flow: column nowrap;
        justify-content: center;
    }

    .handouts-photos .handouts-photo-row {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-content: center;
        align-self:center;
        gap: 52px;
        
        width: 740px;
    }

    .handouts-photos .handouts-column {
        display: flex;
        flex-direction: column;
        flex-basis: 100%;
        flex: 1;
        align-content: center;
       
    }

        .handouts-photos .handouts-column > * {
            flex: 0 auto 1;
        }



    .handouts-photos figure {
        display: flex;
        flex-flow: column;
        flex: 1 1 0px;

        flex-wrap: wrap;
        
    }

        .handouts-photos figure img {
            display: flex;
            align-self: center;
            
            max-width: 100%;
            
        }

    .handouts-photos a {
        color: white;
        font-weight: bold;
    }



    .handouts-photos figure figcaption {
        align-self: center;
        font-family: open-sans, sans-serif;
        font-size: 14px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.29;
        letter-spacing: normal;
        text-align: center;
        color: white;
        margin: 30px 0 100px 0;
    }

    .handouts-photos.old figure figcaption {
        color: #595959;
    }

    /*        .handouts-bkg-photo {
    width: 260px;
    height: 350px;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important ;
}
*/
    .handouts-photos h2 {
        font-family: proxima-nova, sans-serif;
        font-size: 36px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: .25em;
        text-align: center;
        color: white !important;
        margin: 0;
        margin-top: 100px;
        margin-left: 10px;
        margin-bottom: 60px;
    }

.handouts-desc {
    text-align: center;
    margin-bottom: 80px;
}

.handouts-photos.old h2 {
    color: #595959;
}

    .handouts-photos.old h2:after {
        color: #595960;
    }


a.handouts-footer-link {
    font-size: 24px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 2;
    letter-spacing: 1.2px;
    text-align: center;
    color: #fefefe;
    margin: 40px 0 80px 0;
}

.handouts-pager {
    background-color: #cccccc;
    margin: 0;
    height: 100px;
}

    .handouts-pager ul.pagination {
        margin: 0
    }


    .handouts-pager .slick-dots {
        display: flex;
        padding: 0;
        justify-content: center;
        width: 100%;
        position: absolute;
        list-style: none;
    }


        /*the following style isn't updating*/
        .handouts-pager .slick-dots > li {
            margin: 0 8px;
            list-style-image: none !important;
        }

            .handouts-pager .slick-dots > li > a {
                display: block;
                outline: none;
                width: 10px;
                height: 10px;
                padding: 0;
                border: 1px solid #595960;
                border-radius: 50%;
                background-color: transparent;
                cursor: pointer;
                text-indent: -9999px;
            }

            .handouts-pager .slick-dots > li.slick-active > a, .slick-dots > li.slick-active > a:hover {
                background-color: #7A1341;
                border: 1px solid #7A1341;
            }


            .handouts-pager .slick-dots > li > a:hover {
                border: 1px solid white;
                background-color: rgba(220,220,220,0.5);
            }


@media only screen and (max-width:900px) {
    
    .handouts-photos .handouts-photo-row {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: center;
        align-content: center;
        align-self: center;
        gap: 10px;
        
       /* margin: 0 auto;*/
        /* padding: 0 9.25vw;*/
        width: 260px !important;
    }

    .handouts-photos a
    {
        width: 100%;
    }

    .handouts-photos figure {
        width: 100%;
        flex-wrap: nowrap;
        margin: 20px 0;
    }
        .handouts-photos figure figcaption {
            width: 100%;
            margin: 20px 0;
        }

    .handouts-photos h2 {
        font-size: 27px;
    }

    .handouts-desc {
        margin-left: 10px;
        margin-right: 10px;
        margin-bottom:20px;
        padding: 5px;
    }

    
}
