@media only screen and (min-width: 0px) {
    #biomarkers {
        display: flex;
        width:100%;
        align-items: center;
        justify-content: center;
        flex-direction: column;  
        row-gap: -10px;
        padding:100px 0;
    }
   
    .bio {
        display:flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        row-gap: 50px;
        padding:50px 0px;
    }
    
    .bio-item {
        background-color: white;
        display: flex;
        flex-direction: column;
        row-gap: 20px;
        align-items: center;
        justify-content: center;
        border-radius: 20px;
        width: 80%;
        height: 250px;
        text-align: center;
        padding:20px;
        box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.2);

        opacity: 0;
        filter: blur(10px) brightness(0.98);
        transition: transform 0.15s ease-in-out, opacity 1s cubic-bezier(.18,.54,.55,1), filter 1s cubic-bezier(.18,.54,.55,1);
    }

    .bio-item.show {
        opacity: 1;
        filter: blur(0px);
    }

    .bio-item:hover {
        transform: translateY(-4px);
    }

    .bio-item p {
        max-width: 50ch;
    }
    
    .bio-item img {
        background-color: #2596BE;
        border-radius: 50%;
        width: auto;
        height: 100%;
        aspect-ratio: 1/1;
        max-height: 100px;
        color:white;
    }
}