.aboutPic {grid-area: pic;}
.highlights {grid-area: tldr;}
.summary {grid-area: text;}

.aboutGrid {
    position: relative;
    display: grid;
    grid: 
    'pic text text'
    'tldr text text';
    grid-gap: 5%;
    padding: 29px;
    
    padding-left: 5rem;
    padding-right: 5rem;
    
    margin-bottom: 50px;
    margin-left: 5%;
    margin-right: 5%;
    
}

@media (max-width: 900px){
    .aboutGrid {
        display: grid;
        position: relative;
        grid: 'pic tldr'
            'text text';
    }
    
    .summary {
        padding-top: 0;
    }

    .aboutPic, .highlights {
        margin-bottom: 0;
        padding-bottom: 0;
       
    }
}

@media (max-width: 600px){
    .aboutGrid {
        display: grid;
        position: relative;
        grid: 'pic'
            'text'
            'tldr';
        overflow: scroll;
    }
    
    .summary {
        padding-top: 0;
    }
}

.aboutPic .aboutImage {
    width: 100%;
    border-radius: 30px;
}

 .highlights { 
    font-size: 18px;
}

.summary {
    font-size: 20px;
    border-radius:  30px;
    padding: 1rem;
}


.btnContainer {
    /* Center child horizontally*/
    display: flex;
    justify-content: center;
}

.btnContainer .chatBtn {
    font-size: 18px;
    padding: 1rem;
    border-radius: 30px;
    border-style: solid;
    border-color: #a3aeb3;
    background-color: rgba(135, 135, 180, 0.324);
}

.btnContainer .chatBtn:hover {
    background-color:rgba(135, 135, 180, 0.69);

}

