/*  
FILE NAME: main.css 
DATE MODIFIED: 13 November 2009  
DESCRIPTION: This stylesheet styles the look and feel for the "Events Online", Innovation Project. 
VERSION:  6
AUTHOR: Edward Birchall
modified by: Rebecca Trynes

   :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
   HOW TO USE THIS STYLE SHEET:
   Uncomment any properties that you modify.
   Delete any properties (or styles) that you have not modified.
   :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::  */

#floatleft {float: left; width: 280px;}
#floatleft li {width: 300px;}
.clear {clear:both; padding-top: 20px;}
#compactlist {width: 800px;}
#compactlist ul {list-style-type: none;}
#compactlist li {float:left; width: 300px; padding: 0 5px; margin: 0;}

body{
	color: #000;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 76%;
	margin: 0;
	padding: 0;
	background-image: url(images/bodybg.gif);
	background-repeat: no-repeat;
	background-position: 0% 0%;
	background-color:#FFFFFF;
}

/* ------------------------- main content top-left frame graphic with the image in top-left corner ----------------------- */

body#volunteer{
	background-image: url(images/bodybg_vol2.gif);
}

body#globallinks{
	background-image: url(images/bodybg_pop.gif);
	width: auto;
}

body#globallinks #textmenu{
	padding: 0 0 0 25px;
}

body#audio{
	background-image:url(images/bodybg_pop.gif);
}



/* --------------------------------------------------------- Headings ------------------------------------------------------- */

h1{
	color: #333333;
	margin: 0;
	padding: 35px 0px 0px 250px;
	font-size: 200%;
	font-weight: 300;
}

h2.title {
	margin: 15px 0;
	font-size: 140%;
	color: #194030;
	background:url(images/h1t_bg.jpg) bottom left no-repeat;
	height: 30px;
	padding: 15px 0 0 8px;
}

h2 {
	margin:25px 0 15px 0;
	color:#215949;
	font-size:140%;
	background:url(images/h1_bg.jpg) bottom left no-repeat;
	height: 23px;
	padding: 8px 0 0 8px;
}

h3, p.activityHead {
	margin: 15px 0 5px 0;
	color: #575757;
	font-size:110%;
}

h3 {
	margin: 15px 0 0 0;
	padding: 3px 0 5px 8px;
	color: #003333;
	font-size: 118%;
	height:15px;
	background:url(images/h2_bg.jpg) top left no-repeat;
	font-weight: bold;
}

h4 {
	margin:15px 0 0 5px;
	font-size:100%;
	font-weight: bold;
	font-size:110%;
	height:15px;
	color: #1D4C3A;
}

h5 {
	margin:15px 0 0 5px;
	font-size:99%;
	font-weight: bold;
	font-size:110%;
	height:15px;
	color: #1D4C3A;
}

.activity {
	font-weight:bold;
	color: #930;
	font-size: 110%;
	width: 670px;
	margin: 0;
	height: auto;
	padding: 10px;
	line-height: 1.6em;
	border-left: 1px solid #090;
	border-right: 1px solid #090;
}

/* --------------------------------------------------- Table of contents image position ----------------------------------- */

.TOCimg {
	float: right;
	padding: 0px 10px 10px 10px;
	margin-right: -100px;
}

/* --------------------------------------------------- Block level values -------------------------------------------------- */


p {
	padding: 0 0 5px 5px;
	margin:5px 0;
	line-height:1.6;
	width:600px;
	max-width:600px;
	}
	
p.flash {
	padding:30px 0 20px 38px;
	width: 200px;
	}
	
p.caption {
	color: #006666;
	margin:0 0 10px 0;
	font-size:90%;
}

blockquote {
	margin:5px 10px 5px 50px;
	max-width:345px;
}

blockquote p {
	color: #006666;
	margin:5px 0;
	font-size:95%;
}

code {
	width: 500px;
	margin: 0 auto;
	font-family:Courier,Courier New,monospace;
	font-size:110%;
	display: block;
	white-space: pre;
}

pre
{
	margin:0;
}

a {color:#333333;}
a:link {color: #063;}
a:visited {color: #030;}
a:focus,
a:hover,
a:active {color:#22584D; text-decoration: none;}

#topNav {
	margin:0 0 0 30px;
	}

a.topNav {
	padding:0;
	color:#333333;
}

a.topNav:link {
	color:#333333;
}
a.topNav:visited {
	color:#B4250B;
}
a.topNav:focus,
a.topNav:hover,
a.topNav:active {
	color:#006633;
}

#globallinks #header a{
	margin: 0 0 0 60px;
	color: #333333;
	top: 40px;
	position: relative;
	font-size: 1.2em;
	font-weight: bold;
	}
	
#globallinks #header a:link{}
#globallinks #header a:visited{
	color:#B4250B;
}
#globallinks #header a:focus,
#globallinks #header a:hover,
#globallinks #header a:active{
	color:#006633
	}

/* --------------------------------------------------------- list styles ------------------------------------------------------- */

#globallinks ol li{
	padding:3px 0 3px 5px;
	font-size: 1em;
	list-style:decimal;
}

#globallinks ul li{
	padding:3px 0 3px 5px;
	font-size: 1em;
	list-style: disc;
}

#content ul{
	margin: 5px 0 5px 10px;
	font-size: 100%;
	width: 550px;
	line-height: 1.6em;
}


#content ul li, #content ol ul li{
	padding:2px 0 3px 5px;
	font-size: 1em;
	list-style:disc;
}

#content ol{
	margin:0 0 0 0px;
	padding: 0 0 0 15px;
	font-size: 100%;
	width: 550px;
}

#content ol li{
	padding:3px 0 3px 5px;
	font-size: 1em;
	list-style:decimal;
}


ul, li {
	margin:0 0 0 0;
	padding: 0;
	list-style-type: none;
	font-size: 95%;
}

.textmenu ul li ul li ul li ul li a{
	margin:0 0 0 0;
	padding: 0;
	list-style-type: none;
	font-size: 1.5em;
}

.textmenu ul li ul li ul li a{
	margin:0 0 0 0;
	padding: 0;
	list-style-type: none;
	font-size: 1.5em;
}

.textmenu ul li ul li a{
	margin:0 0 0 0;
	padding: 0;
	list-style-type: none;
	font-size: 1.5em;
}

.textmenu ul li a{
	margin:0 0 0 0;
	padding: 0;
	list-style-type: none;
	font-size: 1.5em;
}

li {
	margin:3px 0 3px 35px;
	color:#000;
}

#global_nav li {
	margin:3px 0 3px 35px;
	color:#000;
}

li p {
	margin:5px 0;
	color:#000;
	min-width:0;
	max-width:400px;
}

ul li ul li {
/* Unordered list nested once */
list-style-type:circle;
margin :5px 5px 5px 35px;
display:list-item;
}

ol li ol li {
/* Ordered list nested once */
list-style-type: lower-alpha;
margin :5px 5px 5px 35px;
display:list-item;
}

ol li ol li ol li {
/* Ordered list nested twice */
list-style-type:lower-roman;
margin :5px 5px 5px 35px;
display:list-item;
}

dl{
	border:1px solid #5A5A5A;
	padding:0;
	margin:0;
	width:96%;
	max-width:600px;
}
dt
{
	border-bottom:1px solid #5A5A5A;
	background-color:#EDF1F5;
	font-weight:bold;
	color:#003366;
	padding:3px;
	margin:0;
}
dd
{
	padding:3px;
	margin:0;
}


/*-------------------------------------------------------------layout styles------------------------------------------------------------*/

#header{
	padding: 0;
	margin: 0;
	height: 95px; /*changed from 75*/
	background-image: url(images/headerbg2a.jpg);
	background-repeat: no-repeat;
	background-position: 100% 0%;
	width: 100%;
	
}

img#headerAlt{
	padding:0;
	margin:0;
	width: 1px;
	height: 1px;
	right: 28px;
	position: absolute;
	top: 28px;
	}

#main{	
	position: absolute;
	top: 75px;
	z-index:1;
	width:100%;
	padding: 0;
	margin: 0;
}

#unit_nav{
	position: absolute;
	top: 46px;
	left: 22px;
	width: 164px;
	margin: 0;
	padding: 0;
	background-image: url('images/nav_03.gif');
	background-position: right top;
	background-repeat: no-repeat;
	z-index:1;
}

/*audio player image in content*/

.imgleft {float:left; clear: left;
           margin:5px 10px 10px 0;
          }

/* ------------------------------ Recruit/Retain Volunteers - bottom right faded background Image -------------------------------- */


#bgdrecnet {
	background:url(images/vol_bg_1_net.jpg) bottom right no-repeat;
}

#bgdrecsol {
	background:url(images/vol_bg_1_gs.jpg) bottom right no-repeat;
	padding: 0;
	margin: 0;
}

#bgdretnet {
	background:url(images/vol_bg_2_net.jpg) bottom right no-repeat;
}

#bgdretsol {
	background:url(images/vol_bg_2_gs.jpg) bottom right no-repeat;
}

/* ----------------------------------------- Venues - bottom right faded background Image --------------------------------------- */


#bgdspesol {
	background:url(images/venue_bg_1_gs.jpg) bottom right no-repeat;
}

#bgdspenet {
	background:url(images/venue_bg_1_net.jpg) bottom right no-repeat;
}

#bgdconsol{
	background:url(images/venue_bg_2_gs.jpg) bottom right no-repeat;
}

#bgdconnet{
	background:url(images/venue_bg_2_net.jpg) bottom right no-repeat;
}

/* --------------------------- Address Regulatory Requirements - bottom right faded background Image --------------------------- */

#bgdimpsol{
	background:url(images/reg_bg_2_gs.jpg) bottom right no-repeat;
}

#bgdimpnet{
	background:url(images/reg_bg_2_net.jpg) bottom right no-repeat;
}

/* ----------------------------------------- Safety - bottom right faded background Image -------------------------------------- */

#bgdrisol{
	background:url(images/safety_bg_1_gs.jpg) bottom right no-repeat;
}

#bgdrisnet{
	background:url(images/safety_bg_1_net.jpg) bottom right no-repeat;
}



/* --------------------------------------------------------- Main Content ------------------------------------------------------- */

#content {
	position: relative;
	top: 30px; /*changed from 0*/
	color: #000000;
	height: 430px;
	overflow: auto;
	margin: 10px 0px 0px 195px;
	padding: 3px 8px 20px 10px; /*changed from 3px 160px 20px 10px*/
	background-color: #FFF;
}

.content {
	position: relative;
	top: 20px; /*changed from 0*/
	color: #000000;
	height: 350px;
	overflow: auto;
	margin: 0px 0px 0px 195px;
	padding: 3px 8px 20px 10px; /*changed from 3px 160px 20px 10px*/
	background-color: #FFF;
}

/* --------------------------------------------------------- Pop up Content ------------------------------------------------------- */

#content.pop {
	position: relative;
	top: 20px; /*changed from 0*/
	color: #000000;
	height: 100%;
	overflow: auto;
	margin: 0px 0px 0px 20px;
	padding: 3px 8px 20px 10px; /*changed from 3px 160px 20px 10px*/
	background-color: #FFF;
	clear: both;
	left: 0px;
}

#contentpop {
	position: relative;
	top: 20px; /*changed from 0*/
	color: #000000;
	height: 100%;
	overflow: auto;
	margin: 0px 0px 0px 20px;
	padding: 3px 8px 20px 10px; /*changed from 3px 160px 20px 10px*/
	background-color: #FFF;
	clear: both;
	left: 0px;
}

/*general image styles*/
img {
	border:0;
	margin: 0 0 0 5px;
}

a img {
border:0;
}


/* ----------------------------------------------- Bottom Navigation Menu styles ----------------------------------------------- */

p.navBot {
	color:#000000;
	font-size:0.95em;
	text-align:left;
	margin-right:15px;
	margin-top:20px;
	padding-right:0;
	max-width:600px;
}
p.navBot a#copyright{
/* show or hide the copyright link here */
}
a.navBot{
	text-decoration:none;
	color:#000000
}


a.navBot:link{
	color:#000000
	}
a.navBot:visited {
	color:#B4250B;
}

a.navBot:focus, 
a.navBot:hover,
a.navBot:active {
	color: #006633;
}

a#currentBot {
	font-weight:bold;
	text-decoration:none;
	color: #000000;
	border:solid #666666 1px;
	padding:0 2px 0 2px;
}

a#currentBot:link,
a#currentBot:visited{
	color:#B4250B;
}
a#currentBot:focus,
a#currentBot:hover,
a#currentBot:active{
	color: #990000;
}

/* ----------------------------------------------- Top Navigation Menu styles ----------------------------------------------- */

a#currentTop {
	font-weight:bold;
	text-decoration:none;
	color:#000000;
	border:solid #666666 1px;
	padding:0 2px 0 2px;
}

a#currentTop:link,
a#currentTop:visited{
	color:#B4250B;
	border:solid #666666 1px;
	padding:0 2px 0 2px;
	text-decoration:none;
	font-weight:bold;
}
a#currentTop:focus,
a#currentTop:hover,
a#currentTop:active{
	color: #990000;
	border:solid #666666 1px;
	padding:0 2px 0 2px;
	text-decoration:none;
	font-weight:bold;
}

/* ---------------------------------------------- global Navigation Menu styles --------------------------------------------- */

#global_nav {
	position: absolute;
	right: 180px;
	top: 60px;
	padding: 0;
	margin: 0;
	text-decoration: none;
	display: block;
	background-color: #FFF;
	z-index: 4;
	width: 348px;
	text-align: center;
	height: 9px;
}
#global_nav h4 {font-size: 1.3em;}

/* ------------------------------------------------------ footer styles --------------------------------------------------- */

#footer{
	position: relative;
	margin: 15px 0 0 0;
	width: 550px;
	padding: 5px 0 0 0;
	text-align: left;
	background-color: transparent;
	font-size:75%;
	color:#333333;
}

#footerLinks{
	position: relative;
	margin: 25px 0 5px 15px;
	width: 95%;
	padding: 5px 0 0 0;
	text-align: center;
	border-top:solid #666666 1px;
	border-bottom:solid #666666 1px;
}

.footer {
	margin:10px 0 0 0;
	color:#575757;
	padding:2px 0 6px 10px;
	border-top:1px #e4e4e4 solid;
	text-align: left;
	width: 100%;
}

#footerLinks ul{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:1.2em;
	text-align: center;
	margin: 5px 0;
	}

#footerLinks ul li{
	display:inline;
	}
	
#footerLinks li{
	padding:0;
	}
	
#footerLinks ul li a{
	text-decoration: none;
	color:#575757;
	}

#footerLinks ul li a:link{color:#575757;}
#footerLinks ul li a:visited{color:#B4250B;}
#footerLinks ul li a:focus,
#footerLinks ul li a:hover,
#footerLinks ul li a:active{
	color:#006633;
	}


#footer p.copyright{
	padding: 0;
	margin:0;
	line-height:2;
	max-width:100%;
	text-align:center;
	}

a.printLink
{
	 margin-left:1.5em;
	color:#575757;
}
a.printLink:link{}
a.printLink:visited{
	color:#B4250B;
}
a.printLink:focus,
a.printLink:hover,
a.printLink:active
{
	color:#003366;
}


.lyrTop {
	height:24px;
	width:50%;
	padding:5px 0 0 0;
	z-index:1;
	margin: 30px 0 0 30px;
	position: relative;
}

#lyrContent {
	position:relative;
	width:98%;
	vertical-align:top;
	height:80%;
	margin:15px 0 0 0;
	padding:0;
	background-color: #FFFFFF; /* background colour is declared in body */
}


/* -------------------------------------------- Styles for tables ------------------------------------------- */


/* --- Tabular table styles --- */

table.tabular {
	width:620px;
	background-color: #FFFFFF;
	margin:10px 0 10px 0;
	border-collapse:collapse;
	min-width:0;
	max-width:600px;
}

caption {
	width:600px;
	padding:1em 0 0.5em 0;
	color:#000;
	font-weight:bold;
	text-align:left;
}

table.tabular th {
	background-color: #EEFFF1;
	color: #05442E;
	font-weight:bold;
	padding:3px 5px;
	border:1px #5A5A5A solid;
	vertical-align:top;
}

table.tabular td {
	color:#000;
	font-size:90%;
	text-align:left;
	padding:3px 5px;
	background-color:#fff;
	border:1px #5A5A5A solid;
	vertical-align:top;
}

table.tabular p {
	margin:5px 5px 5px 0;
	color:#000;
	text-align:left;
}

table.tabular li {
	color:#000;
	display:list-item;
	text-align:left;
	 margin:0 5px 5px 10px;
}

table.tabular ol li ol li {
	list-style-type:lower-alpha;
	margin:5px 0 0 -10px;
}

table.tabular p.caption {
	margin:5px;
	color:#204162;
	text-align:left;
}

table.tabular img {
margin:0;
}

/* ---- Layout table styles --- */

table.layout {
	margin:10px 0 20px 10px;
	border-collapse:collapse;
	width:630px;
	min-width:0px;
	max-width:630px;
	border:none;
}

table.layout th {
	background-color: #FFFFFF;
	color: #05442E;
	text-align: left;
	font-weight:bold;
	padding:0;
	border:0;
	vertical-align:top;
}

table.layout td {
    padding:0 0 3px 0;
	border:0;
	color:#575757;
	text-align:left;
	vertical-align:top;
}

table.layout p {
	margin:0px 10px 5px 10px;
	color:#000000;
}

#popup table.layout p {
	width:500px;
}

table.layout p.caption {
	color: #006666;
	margin:5px;
	text-align:left;
}

table.layout img {
	margin:0;
	padding:0;
	border: none;
}

/* --- List style used within Layout tables --- 
           (not for tabular tables) */

table.layout li {
	margin:5px 5px 5px 20px;
	list-style-position:outside;
	color:#575757;
	display:list-item;
	text-align:left;
}

/* --- Layout table links --- */
a.layout {
font-size:100%;
font-weight:normal;	
}
a.layout:link {color:#575757;}
a.layout:visited {color:#B4250B;}
a.layout:focus {color: #003366;}
a.layout:hover {color:#003366;}
a.layout:active {color: #666;}



table greenroom {
width:300px;
}

/*---------------------------------audio--------------------------------*/

#audio a.printLink{
	display:none;
}

#audioDiv
{
	position:relative;
	width:600px;
	height:345px;
	top:0;
	left:0;
	padding:0;
	border:1px solid #333;
	margin: 10px 0 0 10px;
}
#audioMedia
{
	position:absolute;
	top:0;
	left:0;
	width:280px;
	padding:5px;
}

#audioShow
{
	position:absolute;
	display:none;
	top:60px;
	right:20px;
}
#transcript
{
	visibility:visible;
	padding: 2px;
	height: auto;
	width: 265px;
}
#audioText
{
	width:288px;
	height:318px;
	overflow:auto;
	padding:10px;
	margin:0 0 0 290px;
	border-left:1px dotted #333;
}

#audioText h2
{
	font-size:90%;
	margin:0 0 5px 0;
	padding:7px 0 3px 5px;
	color:#006633;
	border-bottom:1px dotted #5A5A5A;
}

#transcript p
{
	margin:0;
	padding:0;
	width: 265px;

}
	
p.noscript {
	color:#FFFFFF;
	background-color:#FF0000;
	}

/*-------------------------------------flash popup------------------------------------------*/

a.flash{
	/*width:560px;*/
	text-decoration:none;
	color:#333333;
}


a.flash:link{}
a.flash:visited {color:#B4250B;}

a.flash:focus, 
a.flash:hover,
a.flash:active {
	color: #006633;
}

#flashcontent{
	margin:0 0 0 10px;
	}


/*-------------------------------------body popup------------------------------------------*/


body#popup  {
	margin-left:15px;
	background-image: url(images/bodybg_pop.gif);
}

#popup ul {
	width: 500px;
}
#popup li {
	list-style:disc;
	color:#000000;
	font-size:100%;
}


body#popup blockquote p { width:520px; }

/*-------------------------------------green room------------------------------------------*/


#main #contentpop table p{
width:auto;
}

#floatleft2 {float: left; clear: right; margin: -27px 0 0 60px; width: 500px;}