Flexbox with vh size

Question

I trying to center 2 blocks using flexbox. I have section, they have 100vh. Need first block placed in center. Second block placed in bottom-center.

*********************
*                   *
*                   *
*      center       *
*                   *
*                   *
*  bottom-center    *
*********************

js css classes:

const content = {
  textAlign: 'center',
  padding: '0!import',
};

const someSection= {
  paddingTop: '78px',
  paddingBottom: '78px',
  display: 'flex',
  flexDirection: 'column',
  justifyContent: 'center',
  minHeight: '400px',
  height: '100vh',
};
const container = {
  maxWidth: '1140px',
};
const title = {
  margin: '0',
  marginTop: '78px',
};
const sectionFooter = {
  marginTop: 'auto',
  width: '100%',
};

jsx code:

    <div style={content}>
      <section style={someSection}>
        <div style={container}>
          <h1 style={title}>Title Name</h1>
        </div>
        <div style={sectionFooter}>
          <FlatButton label="button" />
        </div>
       </section>
    </div>

Need button to center-bottom, container to middle-center