/**
 * @file
 * Stark layout method
 *
 * To avoid obscuring CSS added to the page by Drupal or a contrib module, the
 * Stark theme itself has no styling, except just enough CSS to arrange the page
 * in a traditional "Header, sidebars, content, and footer" layout.
 *
 * This layout method works reasonably well, but shouldn't be used on a
 * production site because it can break. For example, if an over-large image
 * (one that is wider than 20% of the viewport) is in the left sidebar, the
 * image will overlap with the #content to the right. The exception to this
 * is IE6 which will just hide the navigation block completely in these
 * instances due to a positioning bug.
 */

#content,
#sidebar-first,
#sidebar-second {
  float: left;
  display: inline;
  position: relative;
}

#content {
  width: 100%;
}
body.sidebar-first #content {
  width: 80%;
  left: 20%; /* LTR */
}
body.sidebar-second #content {
  width: 80%;
}
body.two-sidebars #content {
  width: 60%;
  left: 20%;
}

#sidebar-first {
  width: 20%;
  left: -80%; /* LTR */
}

body.two-sidebars #sidebar-first {
  left: -60%; /* LTR */
}

#sidebar-second {
  float: right; /* LTR */
  width: 20%;
}

.section {
  margin: 10px;
}