/********************************************************
* This is the main CSS file for the Preceptor web site.  
* DO NOT EDIT THIS FILE!
*
* Created by: Eva Placko (eva@uwo.ca)
* Date:       December 2009
*
***********************************************************/
/*         N D M S   Web Site S T Y L E S H E E T       */
/**********************************************************/
/*
            COLOURS USED: 
			
	green:		#009933	
	pale yellowish: 		#fcf2d7	
	red:		#ff0000
	dark grey:	#999999
	pale purple: #cdb7d8

*/
/***********************************************************				
 *
 * 			Standard HTML tag definitions
 *
 **********************************************************/

/* All fonts on a page will be Arial with size 12 pixels 
   by default unless overriden.
*/
body {
	margin: 0;             /* Define customized values for each element rather than defaults */
	padding: 0;
	/*font-family:  Helvetica, sans-serif;*/
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: right;    /* To center the page box in the center of screen in some browsers */
	background-image: url(../images/bg_blue3.jpg);
	background-repeat: repeat-x;
	background-color: #a345d0;
	/***/
	height:auto !important; /* real browsers */
	height:100%; /* IE6: treaded as min-height*/
	min-height:100%; /* real browsers */

	}
.borderImage{
	border: 1px #670099 solid;	
	}
/* Paragraphs will have 1.5 times the letter height between lines,
   no margin, and have padding of 10 pixels at left, bottom and right.
*/	

.paddingInterireurPlus{
/*	margin: 0px 0px 0px 0px;*/
padding-left:10px;
padding-right:10px;
	}
	
.paddingInterireurPlus p{
/*	margin: 0px 0px 0px 0px;*/
margin-left:0px;
padding-left:0px;
	}	
	
.imgPadR{
	 padding-right:5px;
	 padding-bottom:5px;
	}
.imgPadL{
	 padding-left:5px;
	 padding-bottom:5px;
	}
	#imgBorder img{
		border: #670099 1px solid;
		}
		
	.paddingULniv1{
		padding-left:20px;
		}	
	.paddingUL30{
		padding-left:30px;
		}			
p {
	line-height: 1.5em;
	margin: 10px 10px 10px 10px;
	text-indent: 30px;
	text-indent: 0;
	
	}
	
/* Indenting a paragraph - padding of 30 pixels at the right.  */	
p.indent {
	padding: 0 10px 10px 30px;
	}
	
p.noIndent {
	text-indent: 0;
	}	
	
/* This is the text inside a box.  E.g. "Enter the Modules" link in a box. */	
p.inABox {
	border: 1px solid #54401F;
	padding: 10px;
	margin: auto;
	width: 400px;
	text-indent: 0;
	text-align: center;
	}
	
/* The following set the link colours.  MUST be defined in this order. */
a {
	font-family: Arial, Helvetica, sans-serif;
	color: #40055d;
	text-decoration:none;
	}
a:link    {
	font-family: Arial, Helvetica, sans-serif;
	color: #40055d;
	font-weight: bold;
}   /* not visited and not moused-over */
.superscript {
	font-size: 14px;
	font-weight: bold;
}

a:visited {
	font-family: Arial, Helvetica, sans-serif;
	color: #40055d;
	font-weight: bold;
}   /* have been visited */
a:hover   {
	font-family: Arial, Helvetica, sans-serif;
	/*color: #ccaadd;*/
	color: #670099;
	text-decoration: underline;
	}     					   /* when moused-over */
a:active  {
	font-family: Arial, Helvetica, sans-serif;
	color: #40055d;
}  /* when clicked */

/* This section is used to "light up" the appropriate button 
   on the navigation menu bar depending on the page you are on. */
body#home-page           		li a#menu-home,
body#funding-page       		li a#menu-funding,
body#cdaChair-page      		li a#menu-cdaChair,
body#projectFramework-page		li a#menu-framework,
body#programmeComponents-page   li a#menu-components,
body#sitemap-page       		li a#menu-sitemap
 	{
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	background-color: #9293A3;
   /* background: url("../images/buttonOn.jpg");		*/

	}
	
h1 {
	font-size: 24px;
	padding: 5px 10px 0px 10px;
	font-weight: bold;
	margin:0;
	color: #670099;	
	}
	
h2 {
	font-size: 20px;
	padding: 10px;
	font-weight: bold;
	margin:0;
	color: #670099;
	}
	
h3 {
	font-size: 16px;
	padding: 10px;
	font-weight: bold;
	margin: 0;
	color: #670099;
	}	
	
.h3 {
	font-size: 16px;
	padding: 0;
    padding-bottom: 5px;	
	font-weight: bold;
	margin: 50px 0 0 0;
	margin-left: 10px;
	color: #670099;
	}
	
	
h4 {
	font-size: 14px;
	padding: 10px;
	font-weight: normal;
	margin:0;
	color: #670099;
	}
		
.h4 {
	font-size: 14px;
	font-weight: normal;
	margin:50px 0 0 0;
	color: #670099;
	}
	
h5 {
	font-size: 12px;
	padding: 10px;
	font-weight: bold;
	margin:0;
	color: #670099;
	}
	
	
.tableLineHori td{
border-bottom:solid #99ca3c 1px;
padding-bottom:2px;
padding-top:2px;
	}
	
ul.noBullet {
	list-style: none;
	}
		
li {
	line-height: normal;
	}

hr {
margin-left: 10px;
background-color:#99ca3c;
height:1px;
border:0;
/*border-top:1px solid #a345d0;*/

	}
	
/*********************************************************************
 *
 * 			Clearing fixes.
 *
 ********************************************************************/						
/*------------------------ CLEARFIX --------------------------------*/
/* Here follows the brillant "no-extra-markup" clearing method devised by Tony Aslett - www.csscreator.com */
/* simply add the clearfix class to any containter that must enclose floated elements */
/* read the details of how and why this works at http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {
    content: ".";            /* the period is placed on the page as the last thing before the div closes */
	display: block;          /* inline elements don't respond to the clear property */ 
    height: 0;               /* ensure the period is not visible */
    clear: both;             /* make the container clear the period */
    visibility: hidden;	     /* further ensures the period is not visible */
}

.clearfix {display: inline-block;}   /* a fix for IE Mac */

/* next a fix for the dreaded Guillotine bug in IE6 */
/* Hides from IE-mac */
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* end of "no-extra-markup" clearing method */				   
  
.clearfloats {
	clear: both;
	height: 0;
	line-height: 0;
	}	
	
	.borderBottom1pxBlack{
		border-bottom:#000 solid 1px;
		}
/*------------------- End of Clearing Fixes------------------------------*/ 
	
/**********************************************************
 *
 * 			Definitions of IDs
 *
 **********************************************************/
/*=============== THE WHOLE PAGE ======================*/ 	
/* This encloses the entire page including navigation, content
   and footer. */	
#pageBoundary {
	width: 882px;
	margin-left: auto;    /* Center page in the browser */
	margin-right: auto;   /* Center page in the browser */
	text-align: left;
	background-image: url(../images/bgfooter.jpg);
	background-repeat:repeat-y;
	background-color: #FFFFFF;
	height:100%;
	
	/*
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;*/
	}
	
#header {
	
	margin-left:36px;
	/*text-align: center;*/
	/*	height: 170px;*/
	/*background-color: #000000;*/
	/*border: 1px solid yellow;*/
	}	
	
#headerForPrint {
	display: none;
	}	
/*=============== CONTENT and NAVIGATION ==================*/ 	
/* This encloses both the content column and the navigation column. 
   The buttonBackground image is used to fill in the navigation
   column with the background colour if the content is longer than
   the navigation bar. */
#contentArea {
	position: relative;
	width: 882px;
	/* This creates the green colour behind the buttons and white behind the
	   content.  The green column will appear to stretch down if the content column
	   is longer than the navigation column. */
	   background-repeat:no-repeat;
	   min-height:912px;
	background-image: url(../images/bgmiddle.jpg);
/*    border: 1px solid yellow; */
	}
/*=============== CONTENT COLUMN =============================*/ 	
/* This is the main information column where the content will go. 
   It has a width of 560px and floats left to sit next to the navigation column. 
   The total width of the Navigation Bar and Content Area is 710px to fix 
   into the 720px boundary. */
#contentcolumn {
	margin: 0px;
	width: 389px;
	float: left;
	background-color: #ffffff;
	padding: 20px 0 15px 15px;
	/*border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #666666;*/
	
/*	    border: 1px solid blue; */
    }
#contentcolumn p {
	margin-left: 10px;

    }
	
	
#contentcolumn2 {
	margin: 0px;
	width: 211px;
	float: left;
	background-color: #ffffff;
	padding: 20px 0 15px 15px;
	/*padding: 15px 0 15px 15px;*/
	/*border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #666666;*/
	
/*	    border: 1px solid blue; */
    }

	
		
/*==================== NAVIGATION  ==========================*/ 	
/* This is the Navigation Bar at the left of the page. 
   The column is 150px wide and floats to the left as the left-most column. */
#navButtonsColumn {
	margin-left:39px;
	width: 162px;
	float: left;
	height:415px;
	
	/*
	background-color: #9293A3;*/
	
	background-image: url(../images/bgmenu.jpg);
	font-size: 12px;
	}
	
		
	/*
#navButtonsColumn ul {
	padding: 0px;
	margin: 0px;
	list-style: none;    
	font-weight : bold;
	text-align: left;
	border-bottom-width: 30px;
	border-bottom-style: solid;
	border-bottom-color: #9293A3;
	}
#navButtonsColumn li {
	margin: 0px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFFFFF;
	}		

#navButtonsColumn li a {
	padding-left: 10px;
	display: block;     
	color: #000000;
	text-decoration : none;
	background-color: #9293A3;

	}

#navButtonsColumn li a:hover {
	color: #FFFFFF;
	
	}

#navButtonsColumn  li a.active {
	color: #000000;
		}		
	
#navButtonsColumn  .navBarTitle {
	color: #ffffff;
	font-size: 14px;
	font-weight:bold;
	background-color: #9293A3;
	}
#navButtonsColumn  p {	
	margin-top: 20px;
	text-indent: 0;
	}
*/
/* The top navigation menu bar */
#navTop {
	padding: 0px 0 0 0px;
	list-style: none;
	width: 800px;
	height: 21px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	border-bottom: 1px solid #cccccc;
	background-color: #354596;
	}
#navTop ul {	
	width: 98%;
	padding: 0;
	margin: 0;
	margin-left: 150px;
	border: 0;
	list-style: none;
	}
#navTop a {
	display: block;
	color:#ffffff;
	text-decoration:none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
 
	}
#navTop li {
	float: left;
	color:#ffffff;
	background:#609;
	font-weight:bold;
	padding: 0px 3px 0px 3px;
	border-right: 2px solid #ffff00;
	}
#navTop li a:hover {
	color:#ffff00;
	text-decoration: none;
	padding: 0px;	
	border-bottom: 2px solid #ffff00;
	
	}

/*=============== END OF NAVIGATION ==========================*/ 

/* The site map text is indented 50px from the left. */
#sitemap {
	padding-left: 50px;
	}	
/*=============== FOOTER =====================================*/ 
/* This is the footer at the bottom of each web page */	
#footer {
	
	font-size: 10px;
	font-weight:bold;
	width: 100%;
	
	margin: 0px;
	
	background-image: url(../images/bgfooter.jpg);
	background-repeat:repeat-y;
	/*
	border-top: 2px solid #999999;*/
	}		
#bgfooterbarre {
		margin-left: 38px;

	
	background-image: url(../images/bgfooterbarre.jpg);
	background-repeat:no-repeat;
	/*
	border-top: 2px solid #999999;*/
	}		
	

#footer a{
	color: #000000;
	text-decoration: underline;
	}	
#footer a:link{
	color: #000000;
	text-decoration: none;
	}	
#footer a:visited{
	color: #000000;
	text-decoration: underline;
	}	
	
#footer a:hover{
	color: #CC6600;
	text-decoration: underline;
	}	



/* Used for the Copyright message in the footer. */ 
#copyright {
	padding-top: 20px;
	padding-bottom: 10px;
	margin: 0px;
	text-align: center;
	color: #999999;
    }
#copyright a, 
#copyright a:link, 
#copyright a:visited, 
#copyright a:hover,
#copyright a:active {
	color: #000000;
	text-decoration: underline;
	}	

/* To Top of Page links */		
#topOfPage {
	padding: 10px;
	font-size: 80%;
	text-align: center;
	}
/* To HELP file */		
#help {
	float: right;
	padding: 10px 0 0 0 ;
	font-size: 120%;
	text-align: right;
	}
#help a {
	font-weight:bold;
	color: #65A4B6;
	}	
#closeWindow {
	width: 150px;
	margin: auto;
	padding: 0px;
	}

#newsBox {	
	float: right;
	width: 150px;
    margin: 0px 5px auto;
    padding: 0px 0 10px 0;
	background-color: #c0c4a3 ;
	color: #006633;
	border: 1px solid #006633;
   }	

#sponsorBox {
	font-size: 80%;
	font-weight:bold;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border-top: 1px solid #c0c4a3;
	}
	
/**************************** TABLES  *********************************/
/* Table of sponsors */	
table#sponsorTable {
	margin-left: 30px;
	border: 1px solid #000000;
	border-collapse:collapse;
	}
table#sponsorTable th { 
	text-align: left;
	font-weight: normal;
	font-size: 80%;
	}	
table#sponsorTable td { 
	padding: 15px;
	border: 1px solid #000000;
	}
	
/*********************End of  TABLES  *********************************/		

/*=============== IMAGES ==========================/ 
/* Image floats right, text will wrap to the left of it. 
   Margin at left. */	
img.atRight { 
	float: right;
	margin: 30px 10px 0 10px;
	}
/* Image floats right, text will wrap to the left of it.  
   Margin at right. */
img.atRightWithMargin  {
	float: right;
	margin: 0 15px 10px 10px;
	}
img.atRightWithMargin2  {
	float: right;
	margin: 15px 15px 15px 10px;
	}	
/* Image floats left, text will wrap to the right of it.  
   Margin at right. */		
img.atLeft { 
	float: left;
	margin: 0;	
	}
img.atLeftWithMargin { 
	float: left;
	margin: 0 10px 5px;	
	}	
/* Image floats left, text will wrap to the right of it. 
   No margins. */		
img.atRightBottom { 
	float: right;
 	position: inherit;
 	right: 0px;
 	bottom: 0px;
 	}
img.atCenter {
	margin: 0 auto;
}	

img.uwoRight {
	float: right;
	margin-right: 10px;
	}
img.uwoLeft {
	float: left;
	margin-right: 10px;
	}
/*=============== END OF IMAGES ==========================/ 
/***************** FORMS ********************************************/
/*----------------------- General for all forms --------------*/
form { 	
	margin: 15px 10px 40px 10px;
	padding-top: 10px;
	font-size: 14px; 
 	}
 
/* Starts next item on a new line after a BR */
form br {
	clear: left;
	}
		
/* The form's LABEL field  */				
/* This affects the form's LABEL field.*/				
form label {
	padding-right: 10px;	
    padding-top: 0px;
	margin-bottom: 10px;
	text-align: right;
	color: #000000;          
	float: left;   
    /*border: 1px solid red; */
	}	

/* This seems to control the radio button label position
   (beside button, rather than under button) */
form label, input {
	/*float: left; */
	}
/* The form's LEGEND text */
form legend {
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	padding: 10px 10px 20px 10px;
	font-weight: bold;
	margin:0;
	color: #65A4B6;     /* Pale blue */
	}
form fieldset {
	width: 90%;
/*	width: 720px;*/
	}
	
form#searchForm {
	margin: 0px auto;
	padding: 0px;
	width: 140px;
	}	

form#searchForm input {
	font-size: 11px;
	margin-top: 5px;
	}		
/* ------------------ End of general FORMS --------------------------*/	
/* ------------------ FORM classes --------------------------------- */	
		
/* Used for Buttons. Button is 120px wide. */
form .submit {
	text-align: center;
	}	
/* Used as "class=fixedWidth" for labels or input boxes.
   If no "class=fixedWidth" is specified, the size is as defined by SIZE or default. */	
form .fixedWidth {
	width: 210px;
	}
form .fixedWidth2 {
	width: 180px;
	}
	
/* Used as "class="radioButton". Smaller width for the radio button. */	
form .radioButton {
	width: 30px;
	}
/* This puts the submit button on the same line rather than below. 
   Overrides "form label, input" definition above.  */	
form .inline {
	float: none; 
	margin: 0 0 0 20px;
	}	
/* ------------------ End of FORM classes --------------------------*/		
/******************** End of FORMS **********************************/		

/**********************************************************
 *
 * 			Class definitions
 *
 **********************************************************/
.highlight {
	color: #5c8a04;
	font-weight: bold;
}

.highlightdates{
	color: #5c8a04;
	font-weight: bold;
	font-size: 16px;
}
.singlelinespacing {
	line-height: normal;
}

/* ONLY DISPLAYS if the browser doesn't support CSS.  
   The text between the .alt will normally not show up.*/
.alt {
	display: none;
	}
.caption {
	font-size: 90%;
	}
.smallText {
	font-size: 80%;
	}
.requiredMarker {
	color:#5c8a04;
	}
.docteurCarre{
padding-left:40px;
padding-bottom:40px; 
width:166px; 
float:right; 
margin-right:0px;
}

/*--- Ajout de Charles ----------------------------*/

.forprint,
.scrap {
	display: none !important;
	}

/* ---  -------------------------------------*/	
	
#contentcolumn .list-collapsible div.section.collapsible {
	margin-bottom: 10px;
	}
	
#contentcolumn div.section.collapsible {
    margin-bottom: 18px;
}	

#contentcolumn div.section.collapsible h5,
#contentcolumn div.list-collapsible h5 {
	color:black;
	padding: 4px 10px;
	}	
	
#contentcolumn div.list-collapsible h6 {
	font-weight: normal;
	margin: 4px 4px 4px 10px;
	color:black;
	padding: 4px 10px;
	font-size: 12px
	}
	
#contentcolumn div.section.collapsible .teaser  {
	width: 366;
	}
	
#contentcolumn div.section.collapsible .main  {
	width: 366;
	padding: 3px 3px 3px 10px;
	display: none;
	}		
#contentcolumn div.section.collapsible .togglemain  {
	width: 388px;
	}

#contentcolumn div.section.collapsible .togglemain .icon  {
	float: right;
	margin-top: 13px;
	display:none;
	}
#contentcolumn div.section.collapsible .togglemain .icon a {
	color: #99ca3c;
	text-decoration: none;
	}	
	
#contentcolumn div.section.collapsible .togglemain .hide  {
	display: none;
	}	
	
#contentcolumn div.section.collapsible .togglemain .readmore  {
	padding: 3px 3px 3px 0px;
	/*width: 350px;*/
	width: 388px;
	height: 15px;
	margin: 0 0 0 10px;
	border-bottom: 1px solid #99CA3C;
	}	
	

#contentcolumn div.section.collapsible .togglemain .readmore a:visited
#contentcolumn div.section.collapsible .togglemain .readmore a:active
#contentcolumn div.section.collapsible .togglemain .readmore a:link{	
	color: #40055D;
	font-weight: normal;
	}
	
#contentcolumn div.section.collapsible .togglemain .readmore a:hover {
	color: #670099;
	}	
	
#contentcolumn div.section.collapsible .top p{	
	margin: 25px 10px 0 10px;
	}