/* All encapsulating content placeholder */
#pagecontent {
	margin: 0 auto;
	padding: 0;
	width: 770px;
	font-family: Verdana;
	font-size: 11px;
}

.Display {
	visibility: visible;
    display: block;
}

.NoDisplay {
	visibility: hidden;
	display: none;
}

/* Top navigation */
#navigation {
	float: left;
	width: 169px;
	height: 100%;
}

/* Custom Flash piece */
#flashBanner {
	float: left;
	clear: right;
	width: 600px;
	height: 210px;
	background: url(../library/flashBanner.jpg) top left no-repeat;
}

.w600 {
	width: 600px;
}
	
.h210 {
	height: 210px;
}         

/* Main page content place holder */
#maincontent {
	float: left;
	width: 435px;
	height: 100%;
}

/* Pill CSS declarations */
#maincontent .one, #maincontent .two, #maincontent .three, #maincontent .four, #maincontent .five  {
	float: left;
	clear: left;
	margin-left: 10px;
}

#maincontent .one ul, #maincontent .two ul, #maincontent .three ul, #maincontent .four ul, #maincontent .five ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#maincontent .one ul li, #maincontent .two ul li, #maincontent .three ul li, #maincontent .four ul li, #maincontent .five ul li {
	padding-left: 10px;
	background: url(../img/li_item_bluearrow.gif) center left no-repeat;
}

/* Pill One */
#maincontent .one {
	width: 415px;
	height: 198px;
	background: url(../img/bg_pillone_bottom.gif) bottom left no-repeat;
}

#maincontent .one .pillbox-hdr {
	width: 414px;
	height: 38px;
	background: url(../img/bg_pillone_top.gif) bottom left no-repeat;
}

#french_content #maincontent .one .pillbox-hdr {
	background-image: url(../img/fr/bg_pillone_top.gif);
}


#maincontent .one .img {
	float: left;
	width: 130px;
	height: 130px;
}

#maincontent .one p {
	float: left;
	clear: right;
	margin: 0 0 8px 0;
	width: 250px;
}

#maincontent .one ul {
	float: left;
	clear: none;
	margin: 3px 0 0 3px;
	width: 250px;
}

/* Pill Two */
#maincontent .two {
	width: 415px;
	height: 161px;
	background: url(../img/bg_pilltwo_bottom.gif) bottom left no-repeat;
}

#maincontent .two .pillbox-hdr {
	width: 414px;
	height: 38px;
	background: url(../img/bg_pilltwo_top.gif) bottom left no-repeat;
}

#french_content #maincontent .two .pillbox-hdr {
	background-image: url(../img/fr/bg_pilltwo_top.gif);
}


#maincontent .two .img {
	float: right;
	margin-right: 1px;
	width: 154px;
	height: 88px;
}

#maincontent .two p {
	float: left;
	clear: left;
	margin: 8px 0 8px 18px !important;
    margin: 8px 0 8px 10px;
	width: 240px;
}

#maincontent .two ul {
	float: left;
	clear: left;
	margin-left: 18px !important;
	margin-left: 10px;
	width: 250px;
}

/* Pill Three */
#maincontent .three {
	width: 415px;
	height: 157px;
	background: url(../img/bg_pillthree_bottom.gif) bottom left no-repeat;
}

#maincontent .three .pillbox-hdr {
	width: 415px;
	height: 38px;
	background: url(../img/bg_pillthree_top.gif) bottom left no-repeat;
}

#french_content #maincontent .three .pillbox-hdr {
	background-image: url(../img/fr/bg_pillthree_top.gif);
}

#maincontent .three .img {
	float: left;
	width: 141px;
	height: 87px;
}  

#maincontent .three p {
	float: left;
	clear: right;
	margin:  0 0 8px 0;
	width: 250px;
}

#maincontent .three ul {
	float: right !important;
	float: left;
	margin-right: 22px !important;
	margin-left: 71px;
	width: 250px;
}

/* Pill Four */
#maincontent .four {
	width: 415px;
	height: 149px;
	background: url(../img/bg_pillthree_bottom.gif) bottom left no-repeat;
}

#maincontent .four .pillbox-hdr {
	width: 414px;
	height: 38px;
	background: url(../img/bg_pillfour_top.gif) bottom left no-repeat;
}

#french_content #maincontent .four .pillbox-hdr {
	background-image: url(../img/fr/bg_pillfour_top.gif);
}


#maincontent .four .img {
	float: right;
	margin-right: 1px;
	width: 130px;
	height: 105px;
}

#maincontent .four p {
	float: left;
	clear: left;
	margin: 8px 0 8px 18px !important;
	margin: 8px 0 8px 9px;
	width: 240px;
}

#maincontent .four ul {
	float: left;
	clear: left;
	margin: 8px 0 8px 18px !important;
	margin: 8px 0 8px 9px;
	width: 250px;
}

/* Pill Five */
#maincontent .five {
	width: 415px;
	height: 165px;
	background: url(../img/bg_pillfive_bottom.gif) bottom left no-repeat;
}

#maincontent .five .pillbox-hdr {
	width: 414px;
	height: 38px;
	background: url(../img/bg_pillfive_top.gif) bottom left no-repeat;
}

#french_content #maincontent .five .pillbox-hdr {
	background-image: url(../img/fr/bg_pillfive_top.gif);
}


#maincontent .five .img {
	float: left;
	width: 119px;
	height: 89px;
	margin-top:15px;
}

#maincontent .five p {
	float: left;
	clear: right;
	margin: 8px 0;
	margin-left: 17px;
	width: 250px;
}

#maincontent .five ul {
	float: left;
	margin-left: 17px;
	width: 250px;
}
        
/* Sidebar */
#sidebar {
	float: left;
	clear: right;
	
	margin-left:17px;
	width: 148px;
	height: 100%;
	font-size:110%;
}

/* Sidebar Pill one */
#sidebar .one {
	width: 148px;
	background: url(../img/bg_pillone_right.gif) bottom left no-repeat;
}


#sidebar .one .img {
	margin: 15px 0 5px 36px;
}

#sidebar .one p {
	margin-left: 5px;
	width: 140px;
}

#sidebar .one ul {
	margin: 0;
	margin-left: 5px;
	padding: 0;
	list-style: none;
	font-size: 12px;
	padding-bottom:15px;
}

#sidebar .one ul li {
	padding-left: 10px;
	background: url(../img/li_item_bluearrow.gif) center left no-repeat;
}

/* Sidebar Pill two */
#sidebar .two {
	margin-top: 10px;
	width: 153px;
}        

#sidebar .two ul {
	margin: 5px 0 8px 14px;
	padding: 0;
	list-style: none;
}

#sidebar .two ul li {
	margin-top: 10px;
}

/* Sidebar Pill three */
#sidebar .three {
	margin-top: 10px;
	width: 153px;
}

#sidebar .three img {
	position:relative;
	z-index:100;
}

#sidebar .three h2 {
	margin: 0;
}

#sidebar .three ul {
	margin: 0;
	margin-top: -10px;
	padding: 10px 10px 10px 23px;
	list-style: none;
	background-color: #fff7da;
}

#sidebar .three ul li {
	margin-top: 10px;
}

/* Map Page - List of 2008 RBC Olympians */
.ListWrapper {
	margin: 0;
	padding: 0;
}

#backLink {
	float: right;
}

.backlink {
	padding-left: 20px;
	background: url(../img/img_backarrow.gif) center left no-repeat;
	line-height:17px;
	display:block;
	font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;
	 font-size: 8pt; color: #0035AD; text-decoration: underline;
}

#flashContainer {
	border:solid 1px #cccccc;
	border-bottom:none;
	width:583px;
	margin-left:2px;
}

ol#athletes {
	margin: 10px 0 20px 0;
	padding: 0 0 0 10px;
	width: 572px;
	height: 185px;
	list-style: none;
	background: url(../img/bg_olympianslist.jpg) bottom no-repeat;
}

ol#athletes li {
	padding-left: 10px;
	width: 156px;
	line-height: 1.2em;
	background: url(../img/li_item_bluearrow.gif) center left no-repeat;
}

li.column1 { margin-left: .5em; list-style-type:none;}
li.column2 { margin-left: 14em; list-style-type:none;}
li.column3 { margin-left: 29em; list-style-type:none;}

li.reset {
	margin-top: -12em;
}

#BC, #AB, #SK, #MB, #ON, #PQ, #NF, #NB, #NS, #PEI {
	float: left;
	width: 584px;
}

#BC h1, #AB h1, #SK h1, #MB h1, #ON h1, #PQ h1, #NF h1, #NB h1, #NS h1, #PEI h1 {
    margin-bottom: 0;
	font-size: 14px;
}

.olympian {
	float: left;
	margin-bottom: 31px;
	width: 195px;
	height: 151px;
	background: url(../img/bg_olympian.jpg) top left no-repeat; 
	font-family: Verdana;
	font-size: 10px;
}

.last {
	width:194px;
}


.olympian .left {
	float: left;
	padding-top: 7px;
	width: 93px;
	height: 112px;
}

.olympian .right {
	float: right;
}

.olympian h2 {
	margin: 0 0 5px 8px;
	padding: 14px 0 0 30px;
	background: url(../img/img_coloredboxes.gif) 0 20px no-repeat;
	font-size: 10px;
	font-style: italic;
	color: #0035ad;
}

.olympian ul {
	margin:0;
	padding: 0;
	list-style: none;
	width:90px;
	margin-right:5px;
}

.olympian ul li {
	margin:0;
	margin-bottom: 10px;
}

.olympian ul li.bio a {
	display:block;
	background: url(../img/li_item_bluearrow.gif) 0% 50% no-repeat;
	padding-left: 10px;	
}

.first {
	clear: left;
}

/*
----------------------------------------------------
	TIMELINE PAGE
----------------------------------------------------
*/
.GreyTitle
{
	font-size:			1.4em;
	font-weight:		normal;
	color:				#88898a;
	padding:			10px;
}

.IntroCopy
{
	border:				solid;
	border-width:		1px 0px;
	border-color:		#c1c1c1 #FFFFFF #e4e7ee #FFFFFF;
	color:				#00234c;
	padding:			10px;
	background:			url('../img/introcopybackground.jpg') repeat-x left center;
	margin:				0px 0px 24px 0px;
}


.Timeline .Left
{
	float:				left;
	width:				535px;
}



.Timeline .Panel
{
	float:				right;
	width:				220px;
	clear: right;
}
.Timeline .Panel p
{
	font-size: 11px;
}
.Timeline .Medals
{
	margin-bottom: 12px;
}
.Timeline .Medals .Gold,
.Timeline .Medals .Silver,
.Timeline .Medals .Bronze
{
	width:				18px;
	height:				15px;
	padding:			3px 0px 3px 0px;
	_padding:			3px 0px 0px 0px;
	margin-right: 30px;
	margin-top: -10px;
	font-weight:		bold;
	color: #ffffff;
	text-align:			center;
	font-family:		Verdana,Geneva,Arial,Helvetica,sans-serif;
	font-size:			9px;
	float: left;
}


.Timeline .Medals .Gold
{
	background:		url(/collectivites-durabilite/_assets-custom/images/gold-medal.jpg) repeat-x left bottom;	
}
.Timeline .Medals .Silver
{
	background:		url(/collectivites-durabilite/_assets-custom/images/silver-medal.jpg) repeat-x left bottom;	
}
.Timeline .Medals .Bronze
{
	background:		url(/collectivites-durabilite/_assets-custom/images/bronze-medal.jpg) repeat-x left bottom;	
}

#timeline
{
	width:				585px;
	height:				280px;
	margin-left: auto;
	margin-right: auto	
}

#timeline #description
{
	position:			relative;	
	background:			url('../library/medal.jpg') no-repeat 5px 0px;
	border:				solid #CCCCCC;
	border-width:		0px 0px 1px 0px;
	width:				530px;
	height:				41px;
	padding:			10px 10px 10px 45px;
	font-family:		Verdana,Geneva,Arial,Helvetica,sans-serif;
	font-size:			11px;
}

#timeline #description #year
{
	float:				left;
	margin-right:		7px;
	font-weight:		bold;
	color:				#002888;
}

#timeline #description #copy
{
	float:				left;
	color:				#000000;
	width:				450px;
}

#timeline #image
{
	width:				585px;
	height:				228px;
}

#timeline #years
{
	color:				#0035ad;
	padding:			10px;
	height:				10px;
	font-family:		Verdana,Geneva,Arial,Helvetica,sans-serif;
	font-size:			11px;
}

#timeline #years a:link,
#timeline #years a:visited,
#timeline #years a:active
{
	color:				#0035ad;
	text-decoration:	underline;
}

#timeline #years a:hover,
#timeline #years a:focus
{
	color:				#0035ad;
	text-decoration:	none;
	font-weight:		bold;
}

#timeline #years .nav
{
	float:				left;
	color:				#999999;
	width:				60px;
}

#timeline #years .navBold
{
	float:				left;	
	width:				60px;	
	font-weight:		bold;
	color:				#333333;
}

#timeline #slider
{
	position:			relative;
	height:				34px;
	background:			url('../library/slider.jpg') repeat-x;
}

#timeline #slider #nav
{
	left:				12px;
}

.right_arrow 
{
	background-image: url(/collectivites-durabilite/_assets-custom/images/right-arrow.jpg);
	height: 61px;
	width: 31px;
	float: right;
	position: relative;
	top: 90px;
	right: 20px;
	outline: none;	
}

.left_arrow
{
	background-image: url(/collectivites-durabilite/_assets-custom/images/left-arrow.jpg);
	height: 61px;
	width: 31px;
	float: left;
	position: relative;
	top: 90px;
	left: 20px;
	outline: none;
	
}

.disabledleft_arrow
{
	background-image: url(/collectivites-durabilite/_assets-custom/images/disable-left-arrow.jpg);
	height: 61px;
	width: 31px;
	float: left;
	position: relative;
	top: 90px;
	left: 20px;
	outline: none;
	
}
.disabledright_arrow 
{
	background-image: url(/collectivites-durabilite/_assets-custom/images/disable-right-arrow.jpg);
	height: 61px;
	width: 31px;
	float: right;
	position: relative;
	top: 90px;
	right: 20px;
	outline: none;	
}
.mouseOverLeft
{
	background-image: url(/collectivites-durabilite/_assets-custom/images/yellow-leftarrow.jpg);
	height: 61px;
	width: 31px;
	float: left;
	position: relative;
	top: 90px;
	left: 20px;
	outline: none;
}
.mouseOverRight
{
	background-image: url(/collectivites-durabilite/_assets-custom/images/yellow-rightarrow.jpg);
	height: 61px;
	width: 31px;
	float: right;
	position: relative;
	top: 90px;
	right: 20px;
	outline: none;	
}

a:hover.right_arrow 
{
	background-image: url(/collectivites-durabilite/_assets-custom/images/yellow-rightarrow.jpg);
	height: 61px;
	width: 31px;
	float: right;
	position: relative;
	top: 90px;
	right: 20px;
}

a:hover.left_arrow
{
	background-image: url(/collectivites-durabilite/_assets-custom/images/yellow-leftarrow.jpg);
	height: 61px;
	width: 31px;
	float: left;
	position: relative;
	top: 90px;
	left: 20px;
	
}