#mount {
  height : 100%;
}

html, body {
  margin:0;
  padding:0;
  height:100%; /* needed for container min-height */
  background:white;

  font-family:arial,sans-serif;
  font-size:small;
  color:#666;
}

body {
  position: absolute;
  top: 200px;
  right: 0;
  bottom: 0;
  left: 0;
  
  display: flex;
}


main {
  flex: 5;
  display: flex;
  flex-direction: column;
}

content {
  flex: 1;
  display: flex;
  overflow: auto;
}

box {
  min-height: -webkit-min-content;
  display: flex;
}

article {
  min-height :1000px;
}
  
nav {
  background: #ccccff;
  display : flex;
  flex-flow : column;
  align-items : start;
}

crumbs {
  background : pink;
}
 
header {
  min-height : 100px;
}



header, footer {
  background: #ffeebb;
}
 
  /* Too narrow to support three columns */
@media all and (max-width: 640px) {

  body {
    flex-flow: column;
  }


  nav {
    flex-flow : row;
    justify-content: center;
  }
}