Не сворачивается форма при уменьшении размеров экрана

Форма HTML

<Form action="enternames.php">
    <div class="container">
    <div class="fields">
    <label>
    <span> Имя героя </span> <input type="text" name="name" autocomplete="off">
    </label>
    <label>
    <span> Год первого появления </span> <input type="text" name="year" autocomplete="off">
    </label>
    </div>
    <img src="https://www.nicepng.com/png/detail/83-832594_dc-comics-logo-dc-comics-sticker.png" alt="dcsymbol">
    </div>
    <input type="submit"> 
</Form>

CSS

.container {display: flex; flex-wrap: wrap;}

.fields {
    display: flex; flex-wrap: wrap;
    max-width: 400px; /*Вот это может двигать картинку*/
}

label {display: flex; flex-wrap: wrap; width: 430px}

span {flex-basis: 200px;}
form img {width: 100px; vertical-align: top;}

Как сделать так, чтоб при уменьшении экрана поля уходили под надписи, а картинка под них? Я чувствую, что дело в флекс-контейнере .fields полей и лейблах. Там надо правильно max-width, flex`ы расставить. Но как именно?