
@media screen and (min-width: 800px){
    section article{
        padding: 50px;
    }
    section article>div{
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        margin: 10px;
    }
    section article>div div{
        width: 60%;
    }
    section article>div:nth-child(2) img{
        box-shadow: 0 0 10px #7f5e06;
        border-radius: 30px;
    }
    section:nth-child(odd) article>div{
        flex-flow: row-reverse;
    }
    section article div{
        margin: 10px;
    }
    section article img{
        width: 20%;
    }
    h1{
        text-align: center;
        font-size: 2em;
    }
}

@media screen and (max-width: 800px){
    section article{
        padding: 50px 5px;
    }
    section article>div{
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;
        margin: 10px;
    }
    section article>div:nth-child(2) img{
        box-shadow: 0 0 10px #7f5e06;
        border-radius: 30px;
    }
    section article div{
        margin: 10px;
    }
    section article img{
        width: 80%;
        margin: 10px;
    }
    h1{
        text-align: center;
        font-size: 2em;
    }
}