.multiple-clinicians {
    margin: auto auto 100px;

    .multiple-clinician-title {
        text-align: center;
        margin: auto auto 50px;
    }

    .multiple-clinician-wrapper {
        margin-left: -1.5rem;
        margin-right: -1.5rem;

        .c-clinician-list {
            /*flex-wrap: nowrap;*/
            display: flex;
            margin: auto;
            max-height: 450px;
            overflow: hidden;
            transition: max-height 1s;
            padding-bottom: 50px;
            margin-bottom: 50px;
            justify-content: center;

            @media all and (max-width: 47em) {
                max-height: 2000px;
            }

            /* &.expand {
                 max-height: 5000px;
             }*/

            .multiple-clinician-item {
                padding-bottom: 1rem;

                @media all and (min-width: 70em) {
                    max-width: 20%;
                }

                &:hover {
                    text-decoration: none;
                }

                .clinician-image {
                    img {
                        margin: auto;
                        max-height: 278px;
                    }
                }

                .clinician-name {
                    font-size: 18px;
                    font-weight: 700;
                    color: #4a4f54;
                    text-transform: uppercase;
                    text-align: center;
                    line-height: 1.25;
                    padding: 10px 0;
                }

                .clinician-title {
                    font-size: 18px;
                    font-weight: 400;
                    text-align: center;
                    color: #4a4f54;
                }

                .c-clinician-list__link {
                    font-size: 18px;
                    font-weight: 700;
                    text-align: center;
                    background-position: calc(76% - 1px) 50% !important;
                    background-repeat: no-repeat !important;
                    background-size: 20px auto !important;
                    padding-right: 20px;
                    max-width: 200px;
                    margin: auto;

                    &:hover,
                    &:focus {
                        color: var(--color-brand-blue);
                        text-decoration: none;
                        background-position: calc(76% - 1px) 50% !important;
                        background-repeat: no-repeat;
                        background-size: 20px auto;
                        padding-right: 20px;
                        max-width: 200px;
                    }
                }
            }
        }
    }
}

.expand-wrapper {
    height: 50px;
    margin-top: -100px;
    z-index: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0) 59%, rgba(255, 255, 255, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(59%, rgba(255, 255, 255, 0)), color-stop(100%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 59%, rgba(255, 255, 255, 1) 100%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 59%, rgba(255, 255, 255, 1) 100%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 59%, rgba(255, 255, 255, 1) 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .75) 59%, rgba(255, 255, 255, 1) 100%);

    .expand-button {
        display: none;
        border: 0;
        color: var(--color-multiple-clinicians-expand-button);
        background: #F4F4F4;
        margin: -15px auto;
        padding-left: 20px;
        z-index: 1;
        position: relative;
        font-size: 20px;
        font-weight: 700;
        text-transform: uppercase;
        border-radius: 4px;
    
        &.visible {
        display: block;
        }

        @media all and (max-width: 47em) {
            span {
                display: none;
            }
        }
    
        .c-primary-nav__icon {
        transform: translateX(-20px);
        transform-origin: 92% 50%;
        width: 13px;
        height: 13px;
        margin-left: 30px;
        margin-top: 8px;
        }
    
        &.expanded {
            .c-primary-nav__icon {
                transform: scaleY(-1) translateX(-20px);
                -moz-transform: scaleX(-1) translateX(-20px);
                -webkit-transform: scaleY(-1) translateX(-20px);
                -ms-transform: scaleX(-1) translateX(-20px);
            }
        }
    }
}