@media screen and (max-width: 950px) {
    main {
        width: 90%;
        margin: 0 5% 0 5%;
    }
    h3 {
        padding-top: 1%;
        padding-bottom: 1%;
    }
    main div {
        display: flex;
        flex-direction: column;
        padding-top: 5%;
        padding-bottom: 5%;
    }
    .image {
        width: 100%;
    }
    .paragraph {
        width: 100%;
        text-align: justify;
    }
    .image img {
        width: 100%;
    }
}

@media screen and (min-width: 951px) {
    main {
        width: 80%;
        margin: 0 10% 0 10%;
    }
    h3 {
        padding-bottom: 2%;
    }
    main div {
        display: flex;
        justify-content: flex-start;
        height: 100%;
        padding-top: 1%;
        padding-bottom: 5%;
    }
    .image {
        width: 40%;
        float: left;
        margin-right: 10%;
    }
    .paragraph {
        width: 50%;
        float: right;
    }
    .image img {
        width: 100%;
        height: auto;
    }
}