.bio {
    text-align: left;
}

h1 {
    font-size: 50px;
}

.bio {
    padding-left: 5%;
}

p{
    font-size: 14px;
}

.profile {
    background: linear-gradient(
        to right,
        #9bcdd1 0%,
        #9bcdd1 50%,
        #ffffff 50%,
        #ffffff 100%
    );

    padding: 1%;
    width: 80%;
    margin: 0 auto;
    float: none;
    margin-top: 10%;
    height: 70%
}

div.buttons {
    margin-top: 10%;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1) and (max-width:768px) {
    div.left-profile{
        display: block;
        width:50%;
        margin-left: auto;
        margin-right: auto;
        border-bottom: black solid 1px;
    }
    div.buttons {
        margin-top: 20px;
        margin-bottom:20px
    }
    h1 {
        font-size: 30px;
    }
    p{
        font-size: 12px;
    }
    .profile {
        background: white;
        height:75%
    }
    img {
        display: block;
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }
}
@media only screen and (max-width:870px) {
    div.left-profile{
        display: block;
    }
    img {
        display: block;
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }
}
@media only screen and (min-width:871px) {
    img {
        display: block;
        height: 50%;
        margin-left: auto;
        margin-right: auto;
    }
}