/**
 * @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.
 */

#page-wrapper {
  width:1000px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  border: 1px solid #000;
}

#page {
  margin-bottom:10px;
}  
  
#content,
#sidebar-first,
#sidebar-second {
  float: left;
  display: inline;
  position: relative;
}

#content {
  /*width: 100%;*/
	width: 100%;
}
body.sidebar-first #content {
  /*width: 80%;*
  /*width:798px; /** odd thing for wireframe **/
	width: 76%;
  left: 24%; /* LTR */
}

body.sidebar-second #content {
  width: 78%;
}
body.two-sidebars #content {
  width: 54%;
  left: 24%;
}

#sidebar-first {
  /*width: 20%;*/
	
  width: 24%;
  left: -76%; /* LTR */
}
#sidebar-first-upper, #sidebar-first-lower {
	width:100%;
}
body.two-sidebars #sidebar-first {
  left: -54%; /* LTR */
}

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

.section {
  margin: 10px;
}

#sidebar-first .section {
	padding: 0;
	margin: 0;
}

body.sidebar-first #content .section {
  padding-left: 20px;
	margin-left: 0;
  padding-right: 10px;
	margin-right: 0;
}

#header {
	padding:10px;
}
#header .section {
  margin: 0;
}