/*
Layout based on 
http://matthewjamestaylor.com/blog/ultimate-3-column-holy-grail-pixels.htm

Author: Chaitan Bandela
http://chaitan.com
*/
#siteContainer {
  width:974px;
  margin:auto;
}

#layoutdims {
  clear:both;
  margin:0;
  padding:6px 15px !important;
  text-align:right;
}

/* column container */
.colmask {
  /*position:relative; /* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
  clear:both;
  float:left;
  width:100%; /* width of whole page */
  overflow:hidden; /* This chops off any overhanging divs */
}
.colmask2 {
  padding-top:3px;
}

.holygrail .colmid {
  float:left;
  width:200%;
  margin-left:-230px;     /* Width of right column */
  position:relative;
  right:100%;
}

.holygrail .colleft {
  float:left;
  width:100%;
  margin-left:-50%;
  position:relative;
  left:460px;             /* Left column width + right column width */
}

.holygrail .col1wrap {
  float:left;
  width:50%;
  position:relative;
  right:230px;                /* Width of left column */
  padding-bottom:1em;         /* Centre column bottom padding. Leave it out if it's zero */
}

.holygrail .col1 {
  margin:0 245px;         /* Centre column side padding:
                                Left padding = left column width + centre column left padding width
                                Right padding = right column width + centre column right padding width */
  position:relative;
  left:200%;
  overflow:hidden;
  padding-top: 205px; /* make room for banner */
}

.holygrail .col2 {
  float:left;
  float:right;                    /* This overrides the float:left above */
  width:200px;            /* Width of left column content (left column width minus left and right padding) */
  position:relative;
  right:15px;             /* Width of the left-had side padding on the left column */
  margin-top:306px; /* make room for logo */
}

.holygrail .col3 {
  float:left;
  float:right;                    /* This overrides the float:left above */
  width:200px;            /* Width of right column content (right column width minus left and right padding) */
  margin-right:45px;      /* Width of right column right-hand padding + left column left and right padding */
  position:relative;
  left:50%;
}

/* Header styles */
#header {position:relative;text-align:right;}
#header .logo {
  margin-left:10px;
  text-align:left;
}
/* Footer styles */
#footer {
  clear:both;
  float:left;
  /* padding:13px 0; */
  padding:3px 0;
  width:100%;
}

/* Navigation */
.nav ul {
  width:100%;
}
.nav ul li a.main-nav {
  display:block;
  height:0;
  margin-bottom:5px;
  overflow:hidden;
  padding-top:35px;
  width:100%;
}
.nav ul li#nav-who a.main-nav {background-position:0px -41px;} 
.nav ul li#nav-what a.main-nav {background-position:0px -84px;} 
.nav ul li#nav-partner a.main-nav {background-position:0px -127px;} 
.nav ul li#nav-impact a.main-nav {background-position:0px -171px;} 
.nav ul li#nav-pub a.main-nav {background-position:0px -213px;} 
.nav ul li#nav-involved a.main-nav {background-position:0px -256px;} 
#siteContainer .nav .sub-nav {
  margin-bottom:5px;
}
#siteContainer .nav .sub-nav li {
  margin-left:20px;
  text-align:left;
}
#siteContainer .nav .sub-nav li a {
  display:block;
  padding:5px 10px;
}

.navTop ul {
  margin-top:31px;
  margin-bottom:31px;
  width:352px;
  float:right;
}
.navTop ul li a {
  display:block;
  float:left;
  height:0;
  overflow:hidden;
  padding-top:50px;
  width:0;
} 
.navTop ul li#nav-donate a {width:101px;}
.navTop ul li#nav-join a {background-position:-101px 0px; width:110px;}
.navTop ul li#nav-contact a {background-position:-211px 0px; width:118px;}

/* Content Areas */
.logo {position:absolute;left:0;top:3px;z-index:10;}
#siteContainer .col3 .banner {
  margin-left:-516px;
  margin-bottom:10px;
  padding-bottom:10px;
  padding-top:9px;
}
/* Content Areas - Main */
#siteContainer .col1Content {
  margin-top:20px;
  text-align:left;
}
#siteContainer .col1Content h1 {
  margin-bottom:10px;
}
#siteContainer .col1Content p {
  margin-bottom:1em;
}
#siteContainer .col1Content ul li, #siteContainer .col1Content ol li {
  margin-left:2em;
}

/* Content Areas - Sidebar */
#siteContainer .col3Content p {
  margin-bottom:1em;
  text-align:left;
}
#siteContainer .col3Content img.sidebarTitle {margin-left:-4px;}
#siteContainer .col3Content ul li, #siteContainer .col3Content ol li {
  margin-left:2em;
}
/* Content Areas - Footer */
#siteContainer #footer .footerContent {
  float:right;
  /* margin-right:13px; */
  margin-right:3px;
  padding:5px 0;
  /* width:718px; */
  width:738px;
}
#siteContainer #footer .footerContent .notice {
  float:left;
  text-align:left;
}
#siteContainer #footer .footerContent .siteCredit {
  margin-top:1em;
  padding:5px;
  text-align:right;
}