body {
	margin: 0;
	padding: 0;
	border: 0;
	background-color: #FFF;
	color: #000;
	text-align: center; /* Hack to centre the wrapper in IE5.x pc */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100.01%;/* Sets default font size. This odd value compensates for several browser bugs. First, setting a default font size in percent (instead of em) eliminates an IE/Win problem with growing or shrinking fonts out of proportion if they are later set in ems in other elements. Additionally, some versions of Opera will draw a default font-size of 100% too small compared to other browsers. Safari, on the other hand, has a problem with a font-size of 101%. Current "best" suggestion is to use the 100.01% value for this property */
	min-width: 868px; 
}

 p {
	font-size: 70%; 
	line-height:150%;
	text-align:justify;
}

#wrapper {
	margin: 0px auto;	
	width: 868px;
	position: relative;
	background-image:url(../images/welcome_repeat.jpg);
	background-repeat:repeat-y;
	text-align: left;
}

#banner {
	background-image: url('../images/welcome_header.jpg');/* sets the background image for the banner div*/
	background-repeat: repeat-x;/* tiles the background image on the x-axis - From left to right on the horizontal plane*/
	width: 868px;/* Provides a width for the banner div */
	height:185px;
	position: relative; /* Allows us to set the navcontainer div absolutely within the banner div*/
}


/*--------------------------------HOME PAGE SETTINGS---------------------------------------*/
#contentHome {
	width:505px;
	margin-top:20px;
	margin-bottom:20px;
	margin-left:260px;
}

#contentHome h3 {
	margin:0 10px;
	padding:0;
	color: #0087dd;
}

#contentHome h3 span {
	display: none;
}

#contentHome p {
	color:#666;
	padding:0 10px;
	text-align:justify;
}

#contentHome h1 {
	font-size: 100%; 
	text-transform: uppercase;
	margin: 0 10px 10px 10px;
	padding-top: 20px;/* adds padding to the top to give a little clearance below the banner*/
	color: #0087dd;/* set the colour for the text*/
	font-weight: 500;/* sets the font weight to slightly less than bold - Where this isn't supported it seems mainly to default to normal - to make the text bold, if that is your wish, you can simply remove this property*/
}


#sidebar {
	float: left; 
	width: 220px;
	margin: 0px 0 0 15px; 
}

#sidebar a:link, #sidebar a:visited {
	color: #6699CC;
	text-decoration: none; 
}

#sidebar a:hover, #sidebar a:focus {
	color: #6699CC;
	text-decoration: underline; 
}

.sidebarQuote {
	margin-left:30px;
	text-align:center;
	}

#issCentre {
	margin-top:15px;
	width:222px;
	border-top: 3px solid #90c2e9;


}


#issCentre h3 {
	margin: 0 10px;
	margin-top:5px;
	padding:0;
	color: #0087dd;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	font-weight: 500;

}


#issCentre p {
	color:#666;
	padding: 0 10px;
	text-align: justify; 
}



#news {
	width:222px;
	}

#news h3 {
	margin-top:0px;
	margin-left:10px;
	color: #0087dd;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	font-weight: 500;

}

#news h4 {
	margin-top:0px;
	margin-left:10px;
	color: #0087dd;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 75%;
	text-align:center;
	font-weight: 400;

}



#news h3 span {
	display:none;
}

#news p {
	margin-top:5px;
	padding: 0 10px;
	text-align:justify;
}




#training {
	width:222px;
	border-top: 3px solid #90c2e9;

	}

#training h3 {
	margin-top:0px;
	margin-left:10px;
	color: #0087dd;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	font-weight: 500;

}

#training h4 {
	margin-top:0px;
	margin-left:10px;
	color: #0087dd;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 75%;
	text-align:center;
	font-weight: 400;

}


#training p {
	color:#666;
	margin-top:5px;
	padding: 0 10px;
	text-align:justify;
}

#bannerHome {
	background-image: url('../images/welcome_header.jpg');/* sets the background image for the banner div*/
	background-repeat: repeat-x;/* tiles the background image on the x-axis - From left to right on the horizontal plane*/
	width: 868px;/* Provides a width for the banner div */
	height:185px;
	position: relative; /* Allows us to set the navcontainer div absolutely within the banner div*/
}
/*---------------------------CONTENT SETTINGS------------------------*/


#content {	
	width:505px;
	margin-top:10px;
	margin-bottom:20px;
	margin-left:260px;

}

/*  Hack for IE \*/
* html #content {
	margin-left: 152px;
	width:505px;
}
/*  end of hack for IE \*/


#content h1 {
	font-size: 100%; /*scales the main content title*/
	text-transform: uppercase;
	margin: 0 0 10px 20px;/* sets the margins*/
	padding-top: 20px;/* adds padding to the top to give a little clearance below the banner*/
	color: #00A1EB;/* set the colour for the text*/
	font-weight: 500;/* sets the font weight to slightly less than bold - Where this isn't supported it seems mainly to default to normal - to make the text bold, if that is your wish, you can simply remove this property*/
}

#content h2 {
	font-size: 90%;/* scale the font size*/
	margin: 0 0 5px 20px;/* set the margins*/
	padding-top: 20px;/* adds the top padding to move it down from elements above - could be done with a top margin*/
	color: #00A1EB;/* sets the font colour*/
	font-weight: 500; /* sets the font weight to slightly less than bold - Where this isn't supported it seems mainly to default to normal - to make the text bold, if that is your wish, you can simply remove this property*/
}

#content h3 {
	font-size: 80%;/* scale the font size*/
	margin: 0 0 5px 20px;/* set the margins*/
	padding-top: 20px;/* adds the top padding to move it down from elements above - could be done with a top margin*/
	color: #00A1EB;/* sets the font colour*/
	font-weight: 500; /* sets the font weight to slightly less than bold - Where this isn't supported it seems mainly to default to normal - to make the text bold, if that is your wish, you can simply remove this property*/
}


#content p {
	margin: 0 0 5px 20px;/* sets the margins on the p element with the content div*/
	font-size: 70%; /* scales the font size - no family declared, we are using the default from the body rule*/
	padding: 10px 20px 0 0;/* sets the padding on the p element when it is within the content div*/
	line-height:200%;
	text-align:justify;
}


#content ol {
	margin: 0 0 5px 40px;
	padding: 10px 20px 0 0;
	font-size: 70%;
	line-height:200%;
	text-align:justify;
}

#content ul {
	margin: 0 0 5px 40px;
	padding: 10px 20px 0 0;
	font-size: 70%;
	line-height:200%;
	text-align:justify;
}

#content li {
	margin-top:0px;
	margin-bottom:15px;
}

#content a:link, #content a:visited{
	color: #CCC; /*sets the link and visited text color*/
	text-decoration: none;/*removes the underline*/
}

#content a:hover, #content a:focus{
	color: #006666;/* sets the text color for hover and focus*/
	text-decoration: underline;
}

.leftimage{
float: left;
margin-right: 10px;
border: 0px solid #000000;
}

.left {/* Floats the images in the main content area to the left */
	float: left;/*Floats the image to the left*/
	margin: 5px 20px 5px 0;/*sets the margins so the image sits nicely in the p elements*/
	border: 0px solid #000;/*sets a border on the image*/
}


.right {/* Floats the images in the main content area to the right */
	float: right;/*Floats the image to the right*/
	margin: 5px 0 5px 20px;/*sets the margins so the image sits nicely in the p elements*/
	border: 0px solid #000;/*sets a border on the image*/
}




#location{
	border: 0px solid red;
	margin-left: 20px;
	margin-right:20px; 
	padding: 10px 5px 10px;
	font: 70% Verdana,sans-serif;
	color: #FFF;
}

#location a:link, #location a:visited{
	padding-left:5px;
	color: #FFF;
	text-decoration: underline;
}

#location a:hover, #location a:focus{
	color: #006666;
	text-decoration: underline;
}

#overview	{
	margin:0 50px;
	
}


#overview h3	{
	margin: 20px 0 10px;
	color: #006666;
	font-size: 90%;
	font-weight: 500;
	border-top: 2px dotted #666;
	padding-top: 10px;
}

#overview p {
	margin: 0 0 5px 0;/* sets the margins on the p element with the content div*/
	font-size: 70%; /* scales the font size - no family declared, we are using the default from the body rule*/
	padding: 10px 20px 0 0;/* sets the padding on the p element when it is within the content div*/
	line-height:200%;
	text-align:justify;
}



/*----------------LEFT COLUMN SETTINGS-----------------------------------*/

#leftColumn {/* Begin laying out the leftColumn div */
    float: left; /* Floats the div to the left to make a column */
    width: 220px; /*sets a width for the div - Imperative for IE mac */
    margin-left: 14px; /*creates a margin on the left to move the div away from the pages edge*/
    background-color: transparent; /* no colour required for the bg colour*/
	border: 0px solid red;
}


#navigation {
	margin-left:10px;
	margin-top: 20px;/* sets a margin on the top to move the div down from the banner*/ 
	padding-top: 0px;/* moves the content of the div down and allows the "tab" bg image to show above it*/
	line-height: 100%;/* helps out IE 5.01 pc */
	width: 180px; /* sets a width for the div */

}

#navigation h3 {/* Sets the title on the navcontainer and the add divs */
	font-size: 70%;/* scales the font size*/
	padding: 5px 3px 3px 7px;/*sets the padding values - the 7px aligns this header with the text in the "tab" image */
	color: #fff;/* sets the text colour to white*/
	margin: 0;/* zeroes off the margins*/
	border-left: 2px solid #B192D5;/* Blends the left edge into the tab highlight*/
}
	

#navigation ul {
	list-style-type: none;/* removes the bullets from our list navigation */
	margin: 0 0 40px 0; /* Moves the "where" div down 40px from the bottom of the navigation list */
	padding: 0;/* zeroes off the padding */
	font-size: 70%;/* scales the font to 80% of the body font declaration*/
 }

 

#navigation ul li {
	border-bottom: 1px dotted #fff;/*sets the bottom border*/
	line-height:15px;
	display: block;
	padding:10px 0 10px 0;
}

/*submenu settings*/
#navigation ul li ul {
	margin-left:20px;
	font-size:90%;
	margin-bottom: 0;
}

#navigation ul li ul li {
	border-bottom: 0px dotted #FFF;/*no bottom border for submenu*/
	line-height:15px;
	display: block;
	padding:10px 0 0px 0;
}

.first {/* Adds a border to the top of the first link - apply to the first link in the list */
	border-top: 1px solid #000; /*provides a border for the top of our first list navigation link - we don't want double borders where the links join in the list navigation, this negates that problem*/
}

#navigation a, #navigation a:visited {/*use dual selectors if the properties and values are the same for each*/
	color: #00A1EB;
	padding: 0; /* sets padding values to give the link text some "air"*/
	text-decoration: none; /*removes the underline*/
}

/* sets the link styles for hover and focus*/
/*You will notice that I have set two selectors on this rule, this is fine when the occasion arises - saves time and space*/
#navigation a:hover, #navigation a:focus { /*use dual selectors if the properties and values are the same for each*/
	text-decoration:underline;
	color: #00A1EB6;/* changes the color of hover and focus text*/
}




/*----------------------------------FOOTER SETTINGS-------------------------------------*/

#footer {
	width: 868px;
	height:217px;
	background-image:url(../images/welcome_bottom.jpg);

	font-size: 60%; 
	text-align: center;
	clear: both;
	margin-top: 0;
}


#footer ul {
	margin: 10px 0 5px 0; 
	padding-top:100px;
	}

#footer li {
	display: inline; 
	}

#footer a:link, #footer a:visited {
	color: #666;
	text-decoration: none;  
}
	
#footer a:hover, #footer a:focus {
	color: #006666;  
	text-decoration: underline; 
}

/* #location{
	margin-left: 20px;
	margin-right:20px; 
	padding: 20px 5px 10px;
	font: 70% Verdana,sans-serif;
	color: #CCC;
} */

.container{
width: 99%; 
float:right;
}




/* Set the navigation container */
/* The relative positioning on the banner allows us to set this div absolutely in relation to its containing element - the banner div. This div holds the image tabs */
#banner #menuDeroulant {
	position: absolute;/* absolute positioning takes this element out of the document flow and places it in relation to the containing element by using top & right values in this instance*/
	top: 85px;/* set the distance from the top of the containing element - in this case the banner div*/
	right: 25px;/* set the distance from the right edge of the containing element*/
	background-color: transparent;/* allows the banner image to show through */
}


/* DROPDOWN MENU SETTINGS */

.nav {
	position:absolute;
	top:157px;
	left:237px;
	padding:0;
	margin:0;
	width: 600px;
	background-color:transparent;
	
}

.nav ul {
	padding:0;
	margin:0;
}
.nav li {list-style: none;} /* removes list bullets */

.topnav {
	width: 110px;
	float: left;
}

.topnavSmaller {
	width: 90px;
	float: left;
}

.topnavBigger {
	width: 180px;
	float: left;
}


.floatfix {margin-right: -3px;}

.parent {position: relative;}
	
/*XXXXXXXXXXXX Primary dropdown rules XXXXXXXXXXX*/

.dropdown { /* rules for dropdown div */
	width: 180px;
	position: absolute;		
	left: -3000px;
	top: auto; /* puts dropdowns directly under top nav */
	text-align: left; /* needed because IE misapplies text centering to boxes */	
	background: url(images/bgfix.gif);
}

.dropdownSmaller { /* rules for dropdown div */
	width: 150px;
	position: absolute;		
	left: -3000px;
	top: auto; /* puts dropdowns directly under top nav */
	text-align: left; /* needed because IE misapplies text centering to boxes */	
	background: url(images/bgfix.gif);
}

.dropdownBigger { /* rules for dropdown div */
	width: 240px;
	position: absolute;		
	left: -3000px;
	top: auto; /* puts dropdowns directly under top nav */
	text-align: left; /* needed because IE misapplies text centering to boxes */	
	background: url(images/bgfix.gif);
}
	
.dropdown ul {
	padding:0; 
	width: 109px; /* tweaked so that dropdowns appear to "line up" with top links */
	border: 1px solid #fff; 
	border-width: 0px 1px 0; /* borders for the sides and top of the dropdowns and flyouts; links 
	provide the bottom border */ 
	margin: 0 30px 30px 30px; /* creates "sticky hovering" zones for dropdowns */
} 

.dropdownSmaller ul {
	padding:0; 
	width: 89px; /* tweaked so that dropdowns appear to "line up" with top links */
	border: 1px solid #fff; 
	border-width: 1px 1px 0; /* borders for the sides and top of the dropdowns and flyouts; links 
	provide the bottom border */ 
	margin: 0 30px 30px 30px; /* creates "sticky hovering" zones for dropdowns */
}


.dropdownBigger ul {
	padding:0; 
	width: 179px; /* tweaked so that dropdowns appear to "line up" with top links */
	border: 1px solid #fff; 
	border-width: 1px 1px 0; /* borders for the sides and top of the dropdowns and flyouts; links 
	provide the bottom border */ 
	margin: 0 30px 30px 30px; /* creates "sticky hovering" zones for dropdowns */
}
	
.five .dropdown ul {width: 120px;} /* modifies width for rightmost "visible" dropdown (tweak) */
		
.topnav:hover div.dropdown {left: -31px;} /* hover rule for dropdowns: the extra pixel makes 
dropdowns "line up" with top links */ 

.topnavSmaller:hover div.dropdownSmaller {left: -31px;} /* hover rule for dropdowns: the extra pixel makes 
dropdowns "line up" with top links */


.topnavBigger:hover div.dropdownBigger {left: -31px;} /* hover rule for dropdowns: the extra pixel makes 
dropdowns "line up" with top links */


/*XXXXXXXXXX Secondary dropdown rules XXXXXXXXXXXX*/

.nav a {
	color: #FFF;
	font-weight: bold;
	text-align:center;
	font-size: .6em;
	text-decoration: none;
	padding: 12px 5px 3px 0px; 
	display: block;
	border-right: 0px solid #fff; /* makes the dividers between the top nav links; must be negated 
	for later links */ 
} 

.five a {border-right: 0;} /* removes right border on last top link */
	
.dropdown li {vertical-align: bottom;} /* IE5/win bugfix */
.dropdownBigger li {vertical-align: bottom;} /* IE5/win bugfix */
				
.dropdown li:hover {background: #0087dd;} /* hover color effect on dropdown links */
.dropdownBigger li:hover {background: #0087dd;} /* hover color effect on dropdown links */

.nav div div a {
	color: #fff;
	border-right: 0; /* negates right border for dropdowns */
	border-bottom: 1px solid #fff;  /* borders the bottoms of the dropdowns */
}
	
/*XXXXXXXXXXX Top nav and dropdown backgrounds XXXXXXXXXX*/
	
.one {background: transparent;}
.one ul {background: #9dc5e8;}

.two {background: transparent;}
.two ul {background: #9dc5e8;}

.three {background: transparent;}
.three ul {background: #9dc5e8;}

.four {background: transparent;}
.four ul {background: #9dc5e8;}

.five {background: transparent;}
.five ul {background: #9dc5e8;}
/*XXXXXXXXXXX Special fixes XXXXXXXXXXX*/

/* This is to hide the following from IE/Mac. \*/
* html .topnav .dropdown li {
	height: 1%;
	margin-left: -16px;
	mar\gin-left: 0;
}

* html .nav a {height: 1%;}
/* */
/* The first 2 rules above fix "bullet region" problems in IE5.x/win, and the second is to make 
all links fully clickable. */    

.brclear { /* Use a break with this class to clear float containers */
	clear:both;
	height:0;
	margin:0;
	font-size: 1px;
	line-height: 0;
}

/* The following shows to IE5/Mac only */
/*\*/ /*/
.nav .dropdown {width: 189px;}
.nav .topnav .dropdown ul {margin: 0px;}
.nav .dropdown {position: static;}
.nav .dropdown ul {border: 0;}
/* this rule block "dumbs down" the nav for IEmac */