section {
    float:left;
    clear:left;
    width:100%;
    position:relative;
    overflow-x:clip;
    overflow-y:visible;
    scroll-margin-top: 120px;
}

h1 {
    text-align: center;
    padding:var(--global_padding_inline);
}

.member {
    position: relative;
    display:Grid;
    grid-template-columns: 500px 1fr;
    grid-gap:5rem;
    padding-inline:var(--global_padding_inline);
    margin-bottom:var(--global_padding_inline);
    align-items: start;
}

    .image {
        position:relative;
        text-decoration: none;
        filter:drop-shadow(0 3px 6px #0004);
        rotate:-3deg;


        & .photo,
        &::after {
            position:absolute;
            width:95%;
            left:2.4%;
            top:5%;
            aspect-ratio: 1;
            object-fit:cover;
            z-index:1;
        }

        &::after {
            content:'';
            box-shadow:0 0 50px inset #0005;
            z-index:2;
        }

        & .polaroid {
            position: relative;
            z-index:3;
            aspect-ratio: 0.827;
            width:100%;
        }

        & .front-name {
            position:absolute;
            z-index:4;
            font-family: "Caveat", cursive;
            color:var(--dblue);
            letter-spacing: -0.03em;
            font-size:11cqw;
            top:80%;
            left:0;
            width:100%;
            padding:1rem;
            text-align: center;
            margin:0;
            rotate:-5deg;
        }
    }

    .text h2 {
        font-size:2.5rem;
        margin-bottom:0;
    }

    .linkedin {
        display:inline-block;
        width:3rem;
        rotate:3deg;
        border:1.5px solid var(--dblue);
        padding:0.5rem;
        border-radius:0.5rem;
        margin-left:0.75rem;

        &:hover {
            border:1.5px solid var(--blue);
        }

        &:hover img {
            opacity:0.5;
        }
    }

    .dblue-outline-btn {
        clear:both;
        margin-top:2rem;
    }

    .dblue-outline-btn::after {
        display:none;
    }

@media screen and (max-width:1300px){
    .member {
        grid-template-columns: 300px 1fr;

    }
}

@media screen and (max-width:800px){
    .member {
        grid-template-columns: 1fr;
        text-align: center;

        & .align_right {
            width:100%;
            text-align:center;
        }
    }

    /* .image {
        & .photo,
        &::after {
            width:87cqw;
            left:5.5%;
        }
    } */
}