/* Hidden structure */

table#structure {
  visibility: hidden;
}


/* The underlying structure */

body.show_structure,
body.show_horizontal_structure,
body.show_vertical_structure {
  background: #eee;
}

body.show_structure table#structure,
body.show_horizontal_structure table#structure,
body.show_vertical_structure table#structure {
  visibility: visible;
  
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  
  margin: 0 auto;
  
  background: red;
  opacity: 0.65;
  
  font-size: 0.625em; /* 10px */
  line-height: 1; /* 10px */

  table-layout: fixed;
}

body.show_structure table#structure td,
body.show_horizontal_structure table#structure td,
body.show_vertical_structure table#structure td {
  height: 2.4em; /* 24px */
}

body.show_structure table#structure td.column_0,
body.show_horizontal_structure table#structure td.column_0,
body.show_vertical_structure table#structure td.column_0 {
  width: 10em; /* 100px = (920px - 720px width) / 2 margins */
  
  background: #bdf;
}

body.show_structure table#structure tr.even td.column_0,
body.show_vertical_structure table#structure tr.even td.column_0 {
  background: #ace;
}

body.show_structure table#structure td.column_1,
body.show_horizontal_structure table#structure td.column_1,
body.show_vertical_structure table#structure td.column_1 {
  width: 14.4em; /* 144px = (720px width - 432px measure) / 2 margins */
  
  background: #cec;
}

body.show_structure table#structure tr.even td.column_1,
body.show_vertical_structure table#structure tr.even td.column_1 {
  background: #aca;
}

body.show_structure table#structure td.column_2,
body.show_horizontal_structure table#structure td.column_2,
body.show_vertical_structure table#structure td.column_2 {
  width: 20.6em; /* 206px = (432px measure - 20px central gutter) / 2 columns */
  
  background: #dfd;
}

body.show_structure table#structure tr.even td.column_2,
body.show_vertical_structure table#structure tr.even td.column_2 {
  background: #bdb;
}

body.show_structure table#structure td.column_3,
body.show_horizontal_structure table#structure td.column_3,
body.show_vertical_structure table#structure td.column_3 {
  width: 2em; /* 20px central gutter */
  
  background: #cec;
}

body.show_structure table#structure tr.even td.column_3,
body.show_vertical_structure table#structure tr.even td.column_3 {
  background: #aca;
}

body.show_vertical_structure table#structure td.column_0,
body.show_vertical_structure table#structure td.column_1,
body.show_vertical_structure table#structure td.column_2,
body.show_vertical_structure table#structure td.column_3 {
  background: #bdf;
}

body.show_vertical_structure table#structure tr.even td.column_0,
body.show_vertical_structure table#structure tr.even td.column_1,
body.show_vertical_structure table#structure tr.even td.column_2,
body.show_vertical_structure table#structure tr.even td.column_3 {
  background: #ace;
}


/* Everything else */

body.show_structure #everything,
body.show_horizontal_structure #everything,
body.show_vertical_structure #everything {
  position: relative;
}

body.show_structure #everything *,
body.show_horizontal_structure #everything *,
body.show_vertical_structure #everything * {
  background: transparent !important;
}