/*CRG Website - CSS - Hybrid*/

/*Original CSS file*/
body {
	color: #545d98;
	background-color: #545d98;
	margin-top: 0;
	padding: 0;
}

p, tr, td, li, ul, ol, div, h1, h2, h3, h4, h5, h6 {
	font-family: "Trebuchet MS", Arial, sans serif;		
}	

p, ul, ol, dd, dl {
	margin-top: 0;
	color: #545d98;
	font-size: 11px;
	text-align: justify;
	line-height: 150%;
	background: transparent;
}

ul { 	
	list-style-image: url("images/design/checkmark.gif");
	line-height: 150%;
}

a { text-decoration: none;}

a:link { color: #84ad85;}
a:visited { color: #84ad85}
a:hover { color: #545d98}

h1 {
	font-size: 16px;
	color: #545d98;
	line-height: 150%;
	font-weight: bold;
	background: transparent;
	margin: 0;
}

h2 {
	font-size: 11px;
	line-height: 100%;
	color: #545d98;
	font-weight: bold;
	background: transparent;
	padding-top: 0;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 10px;
	margin: 0;
}

h3 {
	font-size: 16px;
	line-height: 100%;
	color: #545d98;
	font-weight: bold;
	background: transparent;
	margin: 0;
}

h4 {
	font-size: 12px;
	line-height: 100%;
	color: #545d98;
	font-weight: normal;
	background: transparent;
	margin: 2px 0 5px 0;
}

h5 {	
	margin: 10px 0 10px 0;
	font-family: "Trebuchet MS", "ariel","sans";
	font-size: 16px; 
	font-weight: bold; 
	line-height: 100%;
	color: #8cb38c;
	text-align: right;
	}
	
/*Additions from Prototype*/

/* Main layout and header */

#wrap {
	width: 759px; 
	padding: 0px; 
	margin: 0px; 	
	margin-left: auto; 
	margin-right: auto;
	color: #545d98; /*same colour as original*/	
	}
	
#indexwrap {
	width: 759px; 
	padding: 0px; 
	margin: 0px; 	
	margin-left: auto; 
	margin-right: auto;
	color: #ffffff; /*white background*/
	}

#white {
	background-color:#ffffff; 
	width: 759px; 
	color: #545d98; /*same colour as original*/
	} 
	
#header {
	background-image: url(../images/design/header.png); 
	background-repeat: no-repeat; 
	height: 193px;
	}

	

/*Horizontal Navigation Menu*/
#nav-menu {
	position:relative;
	width:759px; 
	height:24px; 
	background:transparent url(../images/design/h-nav-menu1.png); 
	overflow:hidden; 
	margin:0 auto;
	}
	
#nav-menu ul {
	margin:0; 
	padding:0;
	}
	
#nav-menu li {
	list-style-type:none; 
	width:189.75px; 
	height:24px; 
	display:inline;
	}
	
#nav-menu a {
	display:block; 
	float:left; width:189.75px; 
	height:0; 
	overflow:hidden; 
	color:#000; 
	text-decoration:none; 
	padding-top:24px; 
	background:transparent url(../images/design/h-nav-menu-selected.png) no-repeat 800px 800px;
	}
	
* html #nav-menu a  {
	height:24px; 
	height:0;
	}

#nav-menu a#itema:hover {
	background-position: 0 0; 
	z-index:50;
	}
	
#nav-menu a#itemb:hover {
	background-position: -189.75px 0; 
	z-index:50;
	}
	
#nav-menu a#itemc:hover {
	background-position: -379.5px 0; 
	z-index:50;
	}
	
#nav-menu a#itemd:hover {
	background-position: -569.25px 0; 
	z-index:50;
	}

/* Left sidebar and menu  - About CRG, Mission and History*/
#left-menu {position:relative; clear: left; float: left; width:249px; height:207px; background:transparent url(../images/design/left-nav.png); overflow:hidden; margin:0 auto; }
#left-menu ul {margin:0; padding:0;}
#left-menu li {list-style-type:none; width:249px; height:19px; display:inline;}
#left-menu a {display:block; float:left; width:249px; height:0; overflow:hidden; color:#000; text-decoration:none; padding-top:19px; background:transparent url(../images/design/left-nav-selected.png) no-repeat 500px 500px;}
* html #left-menu a  {height:207px; height:0;}

#left-menu a#item1:hover {background-position: 0 0; z-index:50;}
#left-menu a#item2:hover {background-position: 0 -19px; z-index:50;}
#left-menu a#item3:hover {background-position: 0 -38px; z-index:50;}
#left-menu a#item4:hover {background-position: 0 -57px; z-index:50;}
#left-menu a#item5:hover {background-position: 0 -76px; z-index:50;}
#left-menu a#item6:hover {background-position: 0 -95px; z-index:50;}
#left-menu a#item7:hover {background-position: 0 -114px; z-index:50;}
#left-menu a#item8:hover {background-position: 0 -133px; z-index:50;}
#left-menu a#item9:hover {background-position: 0 -152px; z-index:50;}
#left-menu a#item10:hover {background-position: 0 -171px; z-index:50;}
#left-menu a#item11:hover {background-position: 0 -190px; z-index:50;}

/* Left sidebar and menu  - Contact Us Page*/
#left-menu-contact {position:relative; clear: left; float: left; width:249px; height:207px; background:transparent url(../images/design/contactus.png); overflow:hidden; margin:0 auto;}
#left-menu-contact ul {margin:0; padding:0;}
#left-menu-contact li {list-style-type:none; width:249px; height:19px; display:inline;}
#left-menu-contact a {display:block; float:left; width:249px; height:0; overflow:hidden; color:#000; text-decoration:none; padding-top:19px; background:transparent url(../images/design/contact-sel.png) no-repeat 500px 500px;}
* html #left-menu-contact a  {height:207px; height:0;}

#left-menu-contact a#item1:hover {background-position: 0 0; z-index:50;}
#left-menu-contact a#item2:hover {background-position: 0 -19px; z-index:50;}
#left-menu-contact a#item3:hover {background-position: 0 -38px; z-index:50;}
#left-menu-contact a#item4:hover {background-position: 0 -57px; z-index:50;}
#left-menu-contact a#item5:hover {background-position: 0 -76px; z-index:50;}
#left-menu-contact a#item6:hover {background-position: 0 -95px; z-index:50;}
#left-menu-contact a#item7:hover {background-position: 0 -114px; z-index:50;}
#left-menu-contact a#item8:hover {background-position: 0 -133px; z-index:50;}
#left-menu-contact a#item9:hover {background-position: 0 -152px; z-index:50;}
#left-menu-contact a#item10:hover {background-position: 0 -171px; z-index:50;}
#left-menu-contact a#item11:hover {background-position: 0 -190px; z-index:50;}

/* Left sidebar and menu  - What We Do Page*/
#left-menu-wwd {position:relative; clear: left; float: left; width:249px; height:207px; background:transparent url(../images/design/wwd.png); overflow:hidden; margin:0 auto;}
#left-menu-wwd ul {margin:0; padding:0;}
#left-menu-wwd li {list-style-type:none; width:249px; height:19px; display:inline;}
#left-menu-wwd a {display:block; float:left; width:249px; height:0; overflow:hidden; color:#000; text-decoration:none; padding-top:19px; background:transparent url(../images/design/wwd-sel.png) no-repeat 500px 500px;}
* html #left-menu-wwd a  {height:207px; height:0;}

#left-menu-wwd a#item1:hover {background-position: 0 0; z-index:50;}
#left-menu-wwd a#item2:hover {background-position: 0 -19px; z-index:50;}
#left-menu-wwd a#item3:hover {background-position: 0 -38px; z-index:50;}
#left-menu-wwd a#item4:hover {background-position: 0 -57px; z-index:50;}
#left-menu-wwd a#item5:hover {background-position: 0 -76px; z-index:50;}
#left-menu-wwd a#item6:hover {background-position: 0 -95px; z-index:50;}
#left-menu-wwd a#item7:hover {background-position: 0 -114px; z-index:50;}
#left-menu-wwd a#item8:hover {background-position: 0 -133px; z-index:50;}
#left-menu-wwd a#item9:hover {background-position: 0 -152px; z-index:50;}
#left-menu-wwd a#item10:hover {background-position: 0 -171px; z-index:50;}
#left-menu-wwd a#item11:hover {background-position: 0 -190px; z-index:50;}

/* Left sidebar and menu  - Systematic Review Page*/
#left-menu-sr {position:relative; clear: left; float: left; width:249px; height:207px; background:transparent url(../images/design/sr-nav.png); overflow:hidden; margin:0 auto;}
#left-menu-sr ul {margin:0; padding:0;}
#left-menu-sr li {list-style-type:none; width:249px; height:19px; display:inline;}
#left-menu-sr a {display:block; float:left; width:249px; height:0; overflow:hidden; color:#000; text-decoration:none; padding-top:19px; background:transparent url(../images/design/sr-nav-sel.png) no-repeat 500px 500px;}
* html #left-menu-sr a  {height:207px; height:0;}

#left-menu-sr a#item1:hover {background-position: 0 0; z-index:50;}
#left-menu-sr a#item2:hover {background-position: 0 -19px; z-index:50;}
#left-menu-sr a#item3:hover {background-position: 0 -38px; z-index:50;}
#left-menu-sr a#item4:hover {background-position: 0 -57px; z-index:50;}
#left-menu-sr a#item5:hover {background-position: 0 -76px; z-index:50;}
#left-menu-sr a#item6:hover {background-position: 0 -95px; z-index:50;}
#left-menu-sr a#item7:hover {background-position: 0 -114px; z-index:50;}
#left-menu-sr a#item8:hover {background-position: 0 -133px; z-index:50;}
#left-menu-sr a#item9:hover {background-position: 0 -152px; z-index:50;}
#left-menu-sr a#item10:hover {background-position: 0 -171px; z-index:50;}
#left-menu-sr a#item11:hover {background-position: 0 -190px; z-index:50;}

/* Left sidebar and menu  - Systematic Review Services sub menu Pages*/
#left-menu-sr-sub {position:relative; clear: left; float: left; width:249px; height:207px; background:transparent url(../images/design/sr-services.png); overflow:hidden; margin:0 auto;}
#left-menu-sr-sub ul {margin:0; padding:0;}
#left-menu-sr-sub li {list-style-type:none; width:249px; height:17px; display:inline;}
#left-menu-sr-sub a {display:block; float:left; width:249px; height:0; overflow:hidden; color:#000; text-decoration:none; padding-top:17px; background:transparent url(../images/design/sr-services-sel.png) no-repeat 500px 500px;}
* html #left-menu-sr-sub a  {height:207px; height:0;}

#left-menu-sr-sub a#item1:hover {background-position: 0 0; z-index:50;}
#left-menu-sr-sub a#item2:hover {background-position: 0 -17px; z-index:50;}
#left-menu-sr-sub a#item3:hover {background-position: 0 -34px; z-index:50;}
#left-menu-sr-sub a#item4:hover {background-position: 0 -51px; z-index:50;}
#left-menu-sr-sub a#item5:hover {background-position: 0 -68px; z-index:50;}
#left-menu-sr-sub a#item6:hover {background-position: 0 -85px; z-index:50;}
#left-menu-sr-sub a#item7:hover {background-position: 0 -102px; z-index:50;}
#left-menu-sr-sub a#item8:hover {background-position: 0 -119px; z-index:50;}
#left-menu-sr-sub a#item9:hover {background-position: 0 -136px; z-index:50;}
#left-menu-sr-sub a#item10:hover {background-position: 0 -153px; z-index:50;}
#left-menu-sr-sub a#item11:hover {background-position: 0 -170px; z-index:50;}
#left-menu-sr-sub a#item12:hover {background-position: 0 -187px; z-index:50;}
#left-menu-sr-sub a#item13:hover {background-position: 0 -204px; z-index:50;}

/* Main content variations */
#title-spacer {
	float: right;
	background-color: #ffffff;
	border-left:1px solid #8cb38c;
	width: 507px;
	min-height: 39px !important;
	}

#title-spacer h1 {
	padding-top: 10px;
	padding-left: 17px;
	padding-right: 15px;
	padding-bottom: 0px;
	font-family: "Trebuchet MS", "ariel","sans";
	font-size: 16px; 
	font-weight: bold; 
	line-height: 100%;
	color: #8cb38c;
	/*float: right;*/
	text-align: center;
	}
	
#title-spacer h2 {
	padding-top: 15px;
	padding-left: 17px;
	padding-right: 15px;
	padding-bottom: 0px;
	font-family: "Trebuchet MS", "ariel","sans";
	font-size: 11px; 
	font-weight: bold;
	font-style: italic;
	line-height: 100%;
	color: #545d98;
	text-align: center;
	}

#contentwide {
	float: right;
	background-color: #ffffff;
	border-left:1px solid #8cb38c;
	padding-top: 0px;
	padding-left: 17px;
	padding-right: 15px;
	padding-bottom: 10px;	
	width: 475px;
	text-align: justify;
	min-height: 168px !important;
	}

#contentwide ul { 	
	list-style-image:url(../images/design/checkmark.gif);
	line-height: 150%;
}

#contentwide table { 	
	color: #545d98;
	font-size: 11px;
	text-align: left;
	line-height: 100%;
	background: transparent;
	vertical-align: text-bottom;
}


/*Team Page Thumbnail Layout*/
/*on team.html, the thumbnails along the left nav bar are #thumbnail.  the ones along the right side of the page are #thumnail (no "b") */
#thumbnail{ clear: both; margin-top: 5px; margin-left:5px; width: 255px;}
.icony { display: inline; float: left; padding: 0; margin-top: 5px; width: 200px;}
.icony .icon { float: left; border: 0; vertical-align: bottom; margin: 3px; }

.icony a { font-size: 12px; font-weight: bold; color: #545d98; line-height: .5em;}
.icony p { font-size: 11px; line-height: .6em; }

	
#portrait img {
	background:#ffffff; 
	border:0; 
	color:#8585a3; 
	
	padding-top:0; padding-left:0; padding-right:5px; padding-bottom:5px;
	margin: 0;
	float: left;
	}
	
#logos img {
	background:#ffffff; 
	border:0; 
	color:#8585a3; 	
	padding-top:0; padding-left:0; padding-right:0; padding-bottom:5px;
	margin: 0;
	float: right;	
	}
	
		/* Footer */
#footer {
	background-image: url(../images/design/footer.png); 
	background-repeat: no-repeat; 
	height: 62px; 
	border-top:1px solid #8cb38c; 
	clear:both; 
	color:grey; 
	font-size:0.9em; 
	margin:0 auto; 
	padding:0 0 0 0; 
	text-align:right; 
	width:759px;}

/* to stretch the footer div to contain floated list */
#footer:after {
        display: block;
        line-height: 1px;
        font-size: 1px;
        clear: both;
		
		}

/* Image Map */		
#menu a {
	position: relative;
	float: left; 
	height: 62px;
	width: 760px;
	text-decoration: none;
  }

/* Render the italicized text invisible*/  
#menu a i { 
	visibility: hidden; 
	}

/* Positioning the Image Map links */	
a#cheo { 
	float: left;
	left: 250px; width: 110px;
	}
a#cheori { 
	float: left;
	left: 300px; 
	width: 71px;
	}
a#epc { 
	float: left; 
	left: 300px; 
	width: 50px;
	}
a#cochrane { 
	float: left; 
	left: 305px; 
	width: 55px;
	}
a#htai { 
	float: left; 
	left: 310px; 
	width: 70px;
	}
a#uottawa { 
	float: left; 
	left: 305px; 
	width: 55px;
	}
a#consort { 
	float: left; 
	left: 310px; 
	width: 34px;
	}

.hiddenPic {display:none;}