

/*--CSS--*/

h2{
    display:block;
    padding:0;
    margin:30px 30px 10px 30px;
}

.list-people{
    position:relative;
    display:grid;
    grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;
    column-gap:var(--padding-med);
    row-gap:var(--padding-med);
    grid-gap:var(--padding-med);
    margin:0 var(--padding-med) 0 var(--padding-med);
    }


    .list-people .person{
        display:block;
        padding:0;
        margin:0;
        width:auto;
        vertical-align:top;
        box-sizing:border-box;
        }

        .list-people .person .wrapper{
            display:block;
            padding:var(--padding-sml);
            width:100%;
            height:100%;
            background:#FFFFFF;
            box-sizing:border-box;
            border-radius:var(--radius-med);
            box-shadow: 0 20px 70px -30px rgb(0 53 54 / 30%);
            }

        .list-people .person .image{
            display:block;
            width:100%;
            height:12vw;
            margin:0 0 1em 0;
            overflow:hidden;
            }

        .list-people .person img{
            display:block;
            margin:0 0 0 -10%;
            width:120%;
            }

        .list-people .person .title{
            display:block;
            float:left;
            margin:0 0 0.8vw 0;
            font-family:'League Gothic', Helvetica, Arial, sans-serif;
            font-size:1.6vw;
            text-align:center;
            color:#006D50;
            text-transform:uppercase;
            width:100%;
            }

            .list-people .person .title-normal{
              text-transform:none;
            }

            .list-people .person .title-sml{
                display:block;
                font-size:1em;
                text-transform:uppercase;
                }

                .list-people .person .title-sml .bold{
                    display:block;
                    font-family:'roboto_condensedbold', Helvetica, Arial, sans-serif;
                    font-size:0.9em;
                    text-transform:none;
                    }

        .list-people .person .info{
            display:block;
            float:left;
            clear:both;
            margin:3% 0 3% 0;
            }

            .list-people .person .info p{
                display:block;
                clear:both;
                padding:0 0 0 0;
                margin:0.7em 0 0.5em 0;
                }

@media only screen and (max-width:768px) and (orientation: portrait){

    .list-people{
        position:relative;
        display:grid;
        grid-template-columns:1fr 1fr;
        column-gap:var(--padding-med);
        row-gap:var(--padding-med);
        grid-gap:var(--padding-med);
        margin:0 var(--padding-med) 0 var(--padding-med);
        }

        .list-people .person .image{
            display:block;
            width:100%;
            height:28vw;
            margin:0 0 1em 0;
            overflow:hidden;
            }

        .list-people .person .title{
            display:block;
            float:left;
            margin:0 0 0.8vw 0;
            font-family:'League Gothic', Helvetica, Arial, sans-serif;
            font-size:4vw;
            text-align:center;
            color:#006D50;
            text-transform:uppercase;
            width:100%;
            }

}
