.container {
    min-height: 800px;
    display: flex;
    flex-direction: column;
    border: 8px solid #000;
    justify-content: flex-start; /* выровнять содержимое, main axis */
    /**
      flex-start (по умолчанию) — прижимает элементы к началу оси.
      center — выравнивает элементы ровно по центру контейнера.
      flex-end — прижимает элементы к концу главной оси.
      space-between — распределяет элементы равномерно:
          первый элемент прижат к началу, последний — к концу,
          а пустое пространство делится поровну между ними.
      space-around — распределяет элементы равномерно,
          при этом пустое пространство делится поровну вокруг каждого элемента
          (из-за этого отступы по краям контейнера вдвое меньше, чем между элементами).
      space-evenly — распределяет элементы так, чтобы все промежутки между ними
          и по краям контейнера были абсолютно одинаковыми.
    */
}

.box {
    width: 200px;
    height: 200px;
    background: #0071ff;
    font-size: 40px;
}
