如何获得高度等于自由空间2/3的布局

body { margin: 0; }

#page-contents { height: 100vh; display: flex; flex-direction: column; }
#page-contents #variable-content { padding: 15px; background: red; color: white; flex: 0 1 auto; }

#page-contents #remaining-space { flex: 0 1 100%; background: blue; display: flex; flex-direction: column; }

#page-contents #remaining-space #two-thirds { flex: 0 0 66.6666%; background: yellow; }
#page-contents #remaining-space #one-third { flex: 0 0 33.3333%; background: orange; }

<div id="page-contents">
  <div id="variable-content">
    <p>Hi my name is Michael</p>
  </div>
  <div id="remaining-space">
    <div id="two-thirds">
    </div>
    <div id="one-third">
    </div>
  </div>
</div>