/* This is the FRIEND stylesheet


      1. Baseline 
      2. HTML and body
      3. Typography
      4. Menu bar
			5. Tables
			6. Buttons

1.=======================================================
      First we establish a baseline for the whole document with a standard font size
      and consistent margin and padding values. This gets around any default browser
      behaviour which might affect page rendering
=========================================================
*/

*	{
	font-size: 100%;
	margin: 0;
	padding: 0;
	}

/*
2.=======================================================
			html and body
=========================================================

      Here we start to establish some typographic consistency. 
      We set the font-size of the whole document to 76% which equates to about 12.16px on
			most browsers. 
      We then set the line height of the whole document to 1.5 which equates to about
			18.24px on most browsers.
      So we end up with line spacing approximately half the height of the text.
*/

html	{
	/*font-family: Verdana, Arial,  Helvetica, sans-serif; */
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 76%;
	line-height: 1.5;
	}

body	{
	position: relative;
	color: #333333;
	/* background: #ffffff url('../images/background.jpg') top left no-repeat; */
	font-size: 1.1em;
	}


.home	{
background: #ffffff url('../images/background.gif') top center no-repeat;
	}
  /*
.hide	{
	width: 0px;
	position: absolute;
	left: -9999px;
	overflow: hidden;
	}
*/

.footer	{
	clear: both;
	overflow: hidden;
   width: 100%;
	}

form	{
	text-align: center;
	}
/*
3.=======================================================
			typography 
=========================================================
*/
h1, h2, h3, h4, h5, h6, .pageHeading, caption	{
	font-family: Arial, Helvetica, sans-serif;
	color: #0d4c90;
	font-weight: bold;
	margin: 1em;
	}

h1, .pageHeading	{
	font-size: 1.8em;
	line-height: 1;
	margin-bottom: 1em;
	}

h2	{
	font-size: 1.5em;
	line-height: 1;
	margin-top: 1em;
	margin-bottom: 1em;
	text-align: center;
	}

h3	{
	font-size: 1.3157em;
	line-height: 1.14;
	margin-left: 0;
	margin-bottom: 1.14em;
	}
	
.home {
	text-align: center;
	}

.centralised	{
	text-align: center;
	}
	
h4	{
	font-weight: bold;
	font-size: 1.1513em;
	line-height: 1.3486;
	margin-bottom: 1.3028em;
	}

h5	{
	font-size: 1em;
	line-height: 1.5;
	margin-bottom: 1.5em;
	font-weight: bold;
	}

h6	{
	font-size: 0.8223em;
	line-height: 1.824;
	margin-bottom: 1.824em;
	font-weight: bold;
	}

p, ul, ol, dl, li, caption, address	{
	font-size: 1em;
	margin-bottom: 1em;
	}

p#contact {
	margin: 0 0 24em 0;
	}	

p#links	{
	margin: 0 0 18em 0;
	}
		
ul, ol	{
	padding: 0 2em;
	}
	
dl	{
	padding: 0;
	}
	
dt	{
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 1.1513em;
	line-height: 1.3486;
	padding: 0;
	margin-bottom: 1.3028em;
	color: #0d4c90;
	}
	
li, dd	{
	padding: 0;
	margin: 0 0 1em 0;
	}

dd	{
	padding: 0 2em 0 0;
	}
	
ul li	{
	list-style-image: url('../images/arrow.gif');
	}

ol ol	{
	list-style-type: lower-roman;
	}
	
li ul,
li ol,
li dl,
dd ul,
dd ol,
dd dl	{
	margin: 1.5em 0 0 0;
	}

th,
td	{
	font-size: 1em;
	text-align: left;
	}
	
caption	{
	font-size: 1.3157em;
	line-height: 1.14;
	padding-bottom: 1.14em;
	margin: 0;
	}

blockquote	{
	font-size: 1em;
	font-style: normal;
	margin: 0 4% 1.5em 4%;
	padding: 1.5em 1em 1.5em 1em;
	border: 1px solid #999999;
	background-color: #e6e7e8;
	}

blockquote h3	{
	margin-left: 0;
	}
	
.leftblock blockquote {
	margin: 0 30% 1.5em 4%;
	}
	
.rightblock blockquote {
	margin: 0 4% 1.5em 30%;
	}

.story	{
	font-size: 1em;
	font-style: normal;
	margin: 0 4% 1.5em 4%;
	padding: 1.5em 1em 1.5em 1em;
	border: 1px solid #999999;
	background-color: #e6e7e8;
	}
	
 .storylt	{
	font-size: 1em;
	font-style: normal;
	margin: 0 30% 1.5em 4%;
	padding: 1.5em 1em 1.5em 1em;
	border: 1px solid #999999;
	background-color: #e6e7e8;
	}
	
.storyrt	{
	font-size: 1em;
	font-style: normal;
	margin: 0 4% 1.5em 30%;
	padding: 1.5em 1em 1.5em 1em;
	border: 1px solid #999999;
	background-color: #e6e7e8;
	}	

code	{
	font-family: "Courier New", Courier, monospace;
	font-size: 1em;
	color: #3366FF;
	}

em	{
	font-family: Arial, Helvetica, sans-serif;
	font-style: italic;
	/*font-weight: bold;
	color: #4a96cd; */
	}

strong,
b	{
	font-weight: bold;
	color: #494a4d;
	font-size: 1em;
	}

a:link,
a:visited	{
	font-size: inherit;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #0d4c90;
	font-size: 0.9em;
	text-decoration: underline;
	}

a:hover,
a:active,
a:focus	{
	text-decoration: none;
	}
.menu
         {
         /* font-size: 50%; */
         }
				 
.toc {
	margin-left: 35%;
	text-align: left;
	}
	
.maintext {
	margin-top: 3%;
	margin-right: 5%;
	margin bottom: 3%;
	margin-left: 5%;
	padding: 0 0 1.5em 0;
	text-align: left;
	}
	
/*	
#header	{
	position:relative; 
	padding: 0; 
	height:62px; 
	overflow:hidden; 
	background: #80bee7 url('../images/logo-background.jpg') bottom left no-repeat;
	border-bottom: 1px solid #eaf4fb;
*/

body#party2008 #wrapper  {
  width: 90%;
  margin: 0 5%; 
}

body#index #wrapper  {
}

#sponsors {
  width: 180px;
  float: right;
  margin-right: 30px;
  margin-left: 30px;
  min-height: 500px;
/*  border: 1px #73ba98 solid; */
}

#sponsors h3,
#sponsors p {
	text-align: center;
	margin-right: 0;
}
#sponsors img {
  border: none;
}

#header h1 {
	position: relative;
    background: url(../images/friendheader.jpg) no-repeat;
	width: 100%;
	height: 108px;
	overflow: hidden;
	font-size: 20px;
	margin: 0;
	}



#header h1 span {
	width: 0px;
	left: -9999px;
	overflow: hidden;
  position: absolute;

	width: 100%;
	height: 100%;
	padding: 0 0 1.5em 0;
	}
 


#book h1 {
	position: relative;
	width: 100%;
	height: 108px;
	overflow: hidden;
	font-size: 20px;
	margin: 0;
    background: #80bee7 url(../images/bookheader.gif) no-repeat;
	}

#book h1 span {
	width: 0px;
	left: -9999px;
	overflow: hidden;
    position: absolute;

	width: 100%;
	height: 100%;
	padding: 0 0 1.5em 0;
	}


/*
4.=========================================================
      Menu bar
=========================================================
*/

.animatedtabs{
	border-bottom: 1px solid gray;
	overflow: hidden;
	width: 100%;
	font-size: 10px; /*font of menu text*/
	}


.animatedtabs ul{
	list-style-type: none;
	margin: 0;
	margin-left: 10px; /*offset of first tab relative to page left edge*/
	padding: 0;
	}

.animatedtabs li{
	float: left;
	margin: 0;
	padding: 0;
	}

.animatedtabs a{
	float: left;
	position: relative;
	top: 5px; /* 1) Number of pixels to protrude up for selected tab. Should equal (3) MINUS (2) below */
	background: url(../images/tab-blue-left.gif) no-repeat left top;
	margin: 0;
	margin-right: 3px; /*Spacing between each tab*/
	padding: 0 0 0 9px;
	text-decoration: none;
	}

.animatedtabs a span{
	float: left;
	position: relative;
	display: block;
	background: url(../images/tab-blue-right.gif) no-repeat right top;
	padding: 5px 14px 3px 5px; /* 2) Padding within each tab. The 3rd value, or 3px, should equal (1) MINUS (3) */
	font-weight: bold;
	color: black;
	}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
.animatedtabs a span {
	float:none;
	}
/* End IE5-Mac hack */


.animatedtabs .selected a{
	background-position: 0 -125px;
	top: 0;
	}

.animatedtabs .selected a span{
	background-position: 100% -125px;
	color: black;
	padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
	top: 0;
	}

.animatedtabs a:hover{
	background-position: 0% -125px;
	top: 0;
	}

.animatedtabs a:hover span{
	background-position: 100% -125px;
	padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
	top: 0;
	}

/*
5.=========================================================
	Tables	
===========================================================
*/
table	{
	width: 80%;
	padding: 0;
	margin: 0 20% 1.5em 20%;
	clear: both;
	}
/*
6.=========================================================
	Images	
===========================================================
*/

.centreimg {
	text-align: center;
	width 426px;
	font-size: .75em;
	margin-left: 0;
	margin-bottom: 1.5em;
	}

.centreimg em {
	font-style: italic;
	}	

.floatrimg {
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
	width: 213px;
	}

.floatrimg p {
	text-align: center;
	font-size: .75em;
	
	}
	
.floatrimg em {
	font-style: italic;
	}

.floatlimg {
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
	text-align: center;
	font-size: .75em;
	width: 213px;
	}

.floatlimg em {
	font-style: italic;
	}

.extrapadding	{
	padding: 22em 0 0 0;
	}
#moretop	{
	margin-top: 8em;
	}

div#figure p {
  text-align: center;
  /* font-style: italic; */
  /* font-size: smaller; */
  text-indent: 0;
	}

.questions	{
	margin: 1.5em 0 1.5em 25%;
	}
/*
  =========================================================
  6. Buttons
===========================================================
*/
a.button {
	background: transparent url('images/bg_button_a.gif') no-repeat scroll top right;
   color: #444;
   display: block;
   float: left;
   font: normal 12px arial, sans-serif;
   height: 24px;
   margin-right: 6px;
   padding-right: 18px; /* sliding doors padding */
   text-decoration: none;
	}	

a.button span {
   background: transparent url('images/bg_button_span.gif') no-repeat;
   display: block;
   line-height: 14px;
   padding: 5px 0 5px 18px;
	} 

a.button:active {
   background-position: bottom right;
   color: #000;
   outline: none; /* hide dotted outline in Firefox */
	}

a.button:active span {
   background-position: bottom left;
   padding: 6px 0 4px 18px; /* push text down 1px */
	}

/*
  =========================================================
	End friend.css
===========================================================
*/