Как сделать изображение слева, текст справа от flexbox, мой код не работает

Question

Я хочу разместить изображение слева, а текст справа. .main - это контейнер, .picture - это изображение, .intro - это txt.

<div class = "main">
    <div class="picture">
    <img src = "img/riesling.jpeg" />
    </div>

    <div class="intro">
    <h3>Intro</h3>
    <p>Always very high in acid, when made as a table wine Rieslings can be harmoniously sweet (sweet and sour) or dry (very acidic). The wine is polarizing because some people find dry styles too acidic and sweet styles too cloying, but sweetness is always a wine making decision and not inherent to the grape.
    </p>
    </div>


main {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap; 
}

.picture{
   width: 50%;
   align-items: flex-start;
}

.intro{
    width: 50%;
    align-items: flex-end;    
}

Но текст находится под изображением, а не справа от него, как это исправить?