/* This file only contains CSS rules that directly affect the basic layout
** and positioning of page elements.
*/

/***********************************************************************************
** Basic page layout and sizing
*/
body {
  margin: 0;
  padding: 0;
  text-align: center; /* This centers the #page div in older IE browsers. */
}

#page {
  margin: 0 auto;   /* This centers the #page div in standard browsers. */
  text-align: left; /* Reset text alignment (from the value set on the body element). */
  width: 1008px;
}

/***********************************************************************************
** Header
*/
#header {
	padding: 17px 37px; /* 34px vertical padding + 74px image height = 108px */
}

/***********************************************************************************
** Main content area and sidebars
*/
#main {
  position: relative;
  height: 100%;
}

#content {
  float: left;
  width: 864px; /* 36px grid x (4 + 16 + 4) */
}

#sidebar-left {
  position: relative;
  float: left;
  width: 144px;  /* 36px grid x 4 */
  height: 324px; /* 36px grid x 9 */
  border-top: 1px solid #999;
  border-bottom: 1px solid #999;
  padding: 0; /* do not add padding to this element, use #sidebar-left-inner instead */
}

#sidebar-left-inner {
  margin: 0;
  padding: 18px 0;
}

/* used for all pages except home page */
#sidebar-left2 {
  position: relative;
  float: left;
  width: 944px;  /* 36px grid x 4 */
  height: 324px; /* 36px grid x 9 */
  border-top: 1px solid #999;
  border-bottom: 1px solid #999;
  padding: 0; /* do not add padding to this element, use #sidebar-left-inner instead */
}


#cover-text {
	margin-left: 288px; /* 36px grid x (4 + 4) */
	margin-right: 144px; /* 36px grid x 4 */
}
  
/***********************************************************************************
** Vertical menu
**
** A simple base class for creating vertical CSS menus.
*/
ul.menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

ul.menu li {
  font-size: 1.25em;
}

ul.menu a {
  display: block;
  width: 120px;
  padding: 9px 12px;
  background: white; /* IE doesn't always get the hover right with no bg color */
}

ul.menu a:hover, ul.menu a:active {
	background: #eee;
	text-decoration: none;
}

/***********************************************************************************
** Footer section
*/
#footer {
  padding: 18px;
  text-align: center;
}

/***********************************************************************************
** Clutter-free clearing for floats
** See http://positioniseverything.net/easyclearing.html 
*/
.clear-block:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clear-block {
  display: inline-block;
}

/* Hides from IE-mac \*/
* html .clear-block {
  height: 1%;
}
.clear-block {
  display: block;
}
/* End hide from IE-mac */
