/* Body */
/************************************/
body {
  background-color : #4e6064;
  text-align: center;
  margin: 0px; /* Prevent default margins for paragraphs etc */
  padding: 0px;
}

/* Misc */
/************************************/
.dateTopLeft {
  color: white;
  font-family: Verdana, Tahoma, Helvetica, Arial;
  font-size: 11px;
  font-weight: bold;
  padding: 10px;
}

.border {
  border: 1px solid #b3b9b7; 
}

.centreAlign{
	text-align: center;
}



/* Links */
/************************************/
a:link {color: #5a91af}     /* unvisited link */

/* Wrappers */
/************************************/
#fullWrapper { /* Wraps everything, pushes all content to the right */
  width: 1000px; text-align: left; margin: auto;
}
#wrapper { /* Wraps everything inside whitebox. Controls width of all content */
  width: 925px; 
}

/* Backgrounds */
/************************************/
#blueBox {
  background-color : #a7bfcb;  
  width: 950px;  
  padding: 10px;  
}
/* See http://www.smashingmagazine.com/2007/05/01/css-float-theory-things-you-should-know/ */
#blueBox:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

#whiteBox {
  background-color : #f6f7f1;  
  width: 927px;  
  padding: 10px;  
  margin-top: 0px;
}
#whiteBox:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

/* Top Decoration (coloured rectangles + FF logo) */
/**************************************************/
.topDecorations {
  float: left;
  margin-bottom: 7px;
}
.topDecorations div {
  float: left;
}
.topDecoration1 {
  width: 170px;
  height: 35px;  
  background-color : #45413e;
}
.topDecoration2 {
  width: 170px;
  height: 35px;  
  background-color : #4e6064;
}
.topDecoration3 {
  width: 255px;
  height: 35px;   
  background-color : #8da084;
  text-align: center;
}
.topDecoration3 img{
  position: relative;
  top: -55px;
}
.topDecoration4 {
  width: 150px;
  height: 35px;  
  background-color : #a7bfcb;
}
.topDecorationFF img {
	border: 0px;
}

/* Nav bar */
/************************************/
#navList {
  clear: both; /* Clear float from .topDecorations */
  text-align: center;
  width: 947px;
  height: 55px;
  margin-left: -10px;
  margin-bottom: 10px;
  background-image: url('images/navBackground2.png'); 
 }
#navList div{
  float: left;
  color: #474340;
  font-size: 13px;
  font-weight: bold;
  font-family: Verdana, Tahoma, Helvetica, Arial;
  cursor: pointer; /* Div is made clickable in javascript so change cursor on mouse over */
}
#navList * a {
  color: #474340; /* unvisited link */
  text-decoration: none;
}  
#navList .blueNavText{
  color: #a6bac3;
  font-size: 11px;
  font-family: georgia,garamond,serif;
}
#navHome {
  padding: 30px 25px 15px 40px;
  border-right: 1px solid #b3b9b7;
}
#navInfo {
  padding: 15px 25px 15px;
  border-right: 1px solid #b3b9b7;  
}
#navBlog {
  padding: 15px 175px 15px 15px;   
}
#navPhotos {
  padding: 30px 20px 15px 20px;
  border-right: 1px solid #b3b9b7;   
}
#navLegacy {
  padding: 15px 25px 15px;
  border-right: 1px solid #b3b9b7;  
}
#navLinks {
  padding: 30px 20px 15px 20px;  
}

/* Pages with single column format e.g links.html*/
/**************************************************/
.singleColumnWrapper {  
  border: 1px solid #b3b9b7;
  padding: 10px;   
}
.singleColumnHeading {  
  font-size: 20px;
  font-weight: 500;
  background-image: url('images/rightHeading.png');
  border: 1px solid #575d5b;
  padding: 6px 16px;  
  
}
.singleColumnContent {        
  color: #474340;
  background-color : #d0ddc9;  
}
.singleColumnContent p{
  padding: 10px; 
  margin: 0px;
  font-weight: 500;
  line-height: 180%
}
.singleColumnContent * a {
} 

/* Pages with double column format e.g. profile.html */
/**************************************************/
.doubleColumnTotalWrapper {  
  border: 1px solid #b3b9b7;
  padding: 10px;
  overflow: hidden;  /* Hack so div encompasses floats. See http://www.quirksmode.org/css/clearing.html */
}
.doubleColumnLeftWrapper {  
 float: left;
 width: 448px;  
}
.doubleColumnRightWrapper {  
  float: right;    
   width: 448px;
}
.doubleColumnLeftContent {    
  color: #474340;
  background-color: #dfd7d4;    
  padding-bottom: 10px;
}
.doubleColumnRightContent {      
  color: #474340;
  background-color : #d0ddc9;
  padding-bottom: 10px;
}
.doubleColumnLeftWrapper * h1{  
  font-size: 20px;
  font-weight: 500;
  background-image: url('images/centreHeading.png');
  border: 1px solid #575d5b;
  padding: 6px 16px;    
  margin: 0px 0px 10px 0px;  
}
.doubleColumnRightWrapper * h1 {  
  font-size: 20px;
  font-weight: 500;
  background-image: url('images/rightHeading.png');
  border: 1px solid #575d5b;
  padding: 6px 16px;    
  margin: 0px 0px 10px 0px;
}
.doubleColumnTotalWrapper * h2{ 
  font-size: 16px;
  font-weight: 600;
  padding-left: 10px;
  padding-right: 10px;  
  margin: 0px 0px 0px 0px;
}
.doubleColumnTotalWrapper * h3{ 
  font-size: 14px;
  font-weight: 600;
  padding: 0px 10px 0px 10px;  
  margin: 0px;
  text-decoration: underline;  
}
.doubleColumnTotalWrapper * p{
  padding-left: 10px;
  padding-right: 10px;
  margin: 0px 0px 10px 0px;
  font-weight: 500;
  font-family: Verdana, Tahoma, Helvetica, Arial;
  font-size: 13px;
}
.doubleColumnTotalWrapper * ul{	
  margin: 10px 0px 10px 0px;  
  position: relative;  
  padding-left: 1.1em; /* To fix IE not indenting list items */
  padding-right: 5px;
  font-family: Verdana, Tahoma, Helvetica, Arial;
  font-size: 13px;
}

.doubleColumnTotalWrapper * li{
  list-style-position: inside; /* To fix IE not showing bullets */ 
}
/* Pages with nav on left e.g. info.html and blog.html*/
/**************************************************/
.twoColumnNavTotalWrapper {  
  border: 1px solid #b3b9b7;
  padding: 10px;
  overflow: hidden;  /* Hack so div encompasses floats. See http://www.quirksmode.org/css/clearing.html */
}
.twoColumnNavLeftWrapper {   
  width: 260px; 
  border: 1px solid #b3b9b7;
  float: left;  
}
.twoColumnNavLeftContent {    
  color: #474340;    
  padding-bottom: 10px;
}
.twoColumnNavRightContent {      
  color: #474340;
  background-color : #d0ddc9;
  padding-bottom: 10px;
}
.twoColumnNavLeftWrapper * h1{   
  color: #515f60;
  font-size: 20px;
  font-weight: 500;
  background-image: url('images/sideBar.png');
  border: 1px solid #b3b9b7;
  padding: 6px 16px;
  margin: 0px;
}
.twoColumnNavLeftWrapper * ul{	
  margin: 10px 0px 10px 0px;  
  position: relative;  
  padding-left: 1.1em; /* To fix IE not indenting list items */
  padding-right: 5px;
  font-family: Verdana, Tahoma, Helvetica, Arial;
  font-size: 13px;
}
.twoColumnNavLeftWrapper * li{
  list-style-position: inside; /* To fix IE not showing bullets */ 
}
.twoColumnNavLeftWrapper * a{
  color: #474340;
  text-decoration: none; 
}
.twoColumnNavLeftWrapper * a:hover{
  color: #5a91af;
  text-decoration: none;  
}
.twoColumnNavRightWrapper {  
  float: right;    
  width: 630px; 
}
.twoColumnNavRightWrapper * h1{   
  font-size: 20px;
  font-weight: 500;
  background-image: url('images/rightHeading.png');
  border: 1px solid #575d5b;
  padding: 6px 16px;    
  margin: 0px 0px 10px 0px; 
}
.twoColumnNavRightWrapper * h2{ 
  font-size: 18px;
  font-weight: 600;   
  padding: 0px 10px 0px 10px;  
  margin: 0px 0px 10px 0px;
}
.twoColumnNavRightWrapper * h3{ 
  font-size: 14px;
  font-weight: 600;
  padding: 0px 10px 0px 10px;  
  margin: 0px;
   
}
.twoColumnNavRightWrapper * p{
  padding-left: 10px;
  padding-right: 10px;
  margin: 0px 0px 10px 0px;  
  font-family: Verdana, Tahoma, Helvetica, Arial;
  font-size: 13px;
}
.twoColumnNavRightWrapper * li{  
  font-family: Verdana, Tahoma, Helvetica, Arial;
  font-size: 13px;
}
.twoColumnNavRightWrapper * table{
  margin-left: 10px;
  border: 1px solid #575d5b;
}
.twoColumnNavRightWrapper * td{
  padding: 3px; 
}