/**
 * Owner: Yamelyn Oropesa
 * Summary : mediaScreen CSS for the site.
 * ________________________________________
 *
 * TABLE OF CONTENT :
 *   TYPOGRAPHY
 *      LINKS
 *      TITLES
 *      INPUT
 *   STRUCTURE
 *   HEADER LAYOUT 
 *		HOME HEADER LAYOUT
 *	 CONTENT AREA LAYOUT  
 *   LOGIN CONTENT
 *   GENERAL CONTENT
 *      CLEAR FLOAT
 *   SPLIT RIGHT CONTENT
 *      HOME PAGE LAYOUT
 *		JOB OFFERS PAGE LAYOUT
 *		NEWS PAGE LAYOUT
 *		PUBLICATION
 *		CAREER
 *			MULTILINGUAL TABS
 *		FULL PAGE LAYOUT
 *			ERROR PAGE LAYOUT
 *			POPUP PAGE LAYOUT 
 *			SITE MAP PAGE LAYOUT
 *   FOOTER LAYOUT
 *	 SPECIAL CASES
 */

/**  TYPOGRAPHY
 * _______________________________________________________________*/	
	
	
	body {margin: 0; padding: 0; color:#908F8F; font-family:Verdana,Helvetica,sans-serif; text-align: center;}
	

	/**
	 *  Pour ne pas avoir de bordure sur les images-liens.
	 */
	a img {border: 0;}	
	
		
	/**  LINKS
	* _______________________________________________________________*/

	/** 
	 * Toujours garder cet ordre de déclaration
	 * pour les liens, sinon il y aura un bug d'affichage
	 * dans Safari, sous MAC.           
	 */
	a:link, a:visited, a:active {color: #008B7A; text-decoration: none;}
	a:hover {text-decoration: underline;}
	a.InactiveLink {color: #999;}
	a.linkblack:link, a.linkblack:visited, a.linkblack:active, a.linkblack:hover {color: #434A44; font-weight: 700; text-decoration: none;}
	a.orangeLink:link, a.orangeLink:visited, a.orangeLink:active, a.orangeLink:hover {color: #C84A00; font-size:12px; font-weight: 700; text-decoration: none;}		
		
	a.greenLink:link{ font:12px Verdana,Helvetica,sans-serif; color:#008b7a; text-decoration:none;}
    a.greenLink:visited{ font:12px Verdana,Helvetica,sans-serif; color:#008b7a; text-decoration:none;}
    a.greenLink:hover{ font:12px Verdana,Helvetica,sans-serif; color:#008b7a; text-decoration:underline;}
    a.greenLink:active{ font:12px Verdana,Helvetica,sans-serif; color:#008b7a; text-decoration:none;}

    a.greenSmallLink:link{ font:11px Verdana,Helvetica,sans-serif; color:#008B7A; text-decoration:none;}
    a.greenSmallLink:visited{ font:11px Verdana,Helvetica,sans-serif; color:#008B7A; text-decoration:none;}
    a.greenSmallLink:hover{ font:11px Verdana,Helvetica,sans-serif; color:#008B7A; text-decoration:underline;}
    a.greenSmallLink:active{ font:11px Verdana,Helvetica,sans-serif; color:#008B7A; text-decoration:none;}
    
    a.grayLink:link{ font:Verdana,Helvetica,sans-serif 9px normal; color:#6D6F71; text-decoration:none;}
    a.grayLink:visited{ font:Verdana,Helvetica,sans-serif 9px normal; color:#6D6F71; text-decoration:none;}
    a.grayLink:hover{ font:Verdana,Helvetica,sans-serif 9px normal; color:#6D6F71; text-decoration:underline;}
    a.grayLink:active{ font:Verdana,Helvetica,sans-serif 9px normal; color:#6D6F71; text-decoration:none;}
  
	
	/**  TITLES
	* _______________________________________________________________*/


	.h1, h1 {padding-bottom:10px; color:#008B7A; font:2.18em Verdana,Helvetica,sans-serif;}
	.h2, h2 {margin-bottom:10px; color:#008B7A; font:bold 1.27em Verdana,Helvetica,sans-serif;}
	
	/**  INPUT
	* _______________________________________________________________*/
	
	.fieldWidthStandard{width:140px; /*140px approximativement la grandeur d'un champs par default dans .net*/}
	.fieldWidth1{width:10px;}
	.fieldWidth2{width:20px;}
	.fieldWidth3{width:30px;}
	.fieldWidth4{width:40px;}
	.fieldWidth5{width:50px;}
	.fieldWidth6{width:60px;}
	.fieldWidth7{width:70px;}
	.fieldWidth8{width:80px;}
	.fieldWidth9{width:90px;}
	.fieldWidth10{width:100px;}
	.fieldWidth11{width:110px;}
	.fieldWidth12{width:120px;}
	.fieldWidth13{width:130px;}
	.fieldWidth14{width:140px;}
	.fieldWidth15{width:150px;}
	.fieldWidth16{width:160px;}
	.fieldWidth17{width:170px;}
	.fieldWidth18{width:180px;}
	.fieldWidth19{width:190px;}
	.fieldWidth20{width:200px;}
	.fieldWidth21{width:210px;}
	.fieldWidth22{width:220px;}
	.fieldWidth23{width:230px;}
	.fieldWidth234{width:234px;}
	.fieldWidth24{width:240px;}
	.fieldWidth25{width:250px;}
	.fieldWidth26{width:260px;}
	.fieldWidth265{width:265px;}
	.fieldWidth27{width:270px;}
	.fieldWidth28{width:280px;}
	.fieldWidth29{width:290px;}
	.fieldWidth30{width:300px;}
	.fieldWidth35{width:350px;}
	.fieldWidth40{width:400px;}
	.fieldWidth45{width:450px;}
	.fieldWidth50{width:500px;}
	
	/**
     *  Habillage des boutons.
     */
	.btn, input.btn {font-family: Verdana,Arial,Helvetica,sans-serif; border: solid 1px #6D6C6C; margin: 0; padding: 0 14px 1px 14px; background-image: url(../../images/common/bg_btn.gif); font-weight: 700; font-size: 90%; color: #787878; text-align: center;}

	/* Hack pour l'affichage du bouton en IE seulement, 
	/* puisque l'affichage d'un bouton est différent dans IE*/	

	* html .btn, input.btn {padding: 0;}
	

/**  STRUCTURE
 * _______________________________________________________________*/

/** 
 *  Ce sont les DIV structurelles defini dans les XML
 *  Ne pas les ajouter dans votre code, ils y sont déjà!
 */

/**
 *  Div englobant tous les autres div du site.
 */	
div#total { width: 996px; margin:0 auto; padding:0; background:#FFF repeat-y url(../../images/common/bg_bodyBorders.gif) 50%; }

/**
 *  Div format les pages de popUp.
 */
div#popup {padding: 24 0 0 35px;text-align:left; background-color:#FFF;}

/**
 *  Div formant le header.
 */	
div#Header {width: 974px; margin: 0 11px; padding: 0;}

/**
 *  Div englobant la zone du contenu.
 */
div#ContentArea {width: 974px; margin: 0 11px; padding:0;}

/**
 *  Div formant la zone contenu 
 *  pour les pages sans menu de gauche ou de droite.
 */	
div#Zone1Full {width: 878px; margin:0; padding:0;}

/**
 *  Div formant la zone de contenu lorsque SliptLeft.
 *  La zone de contenu se place donc à droite.
 */
div#Zone2 {width:616px; clear:none; margin: 0; padding:0;}

/**
 *  Div formant la zone pour une colonne à droite lorsque SplitRight et/ou Tier.
 */
div#Zone3 {width:760px; background-image: url(../../images/common/bg_double.gif); background-position:left top; background-repeat:repeat-y;}

/**
 *  Div formant la zone du menu de gauche lorsque SplitLeft et/ou Tier.
 */
div#Zone1 {float:left; clear:none; width:357px; margin: 0; padding: 0 0 30px 0;}

/** 
 *  Div formant le footer.
 */
div#Footer {width:974px; margin:0 auto; padding:0; background:#FFF url(../../images/common/footerBottomShadow.gif) no-repeat bottom;}

/**
 *  Utiliser pour cacher ces 2 elements  
 *  Pour ne pas voir un espace visible en haut des pages
 *  CSS for the dhtml tooltips used for hyperlinks and divs
 */
#dhtmlpointer { display: none; }
#dhtmltooltip {	position: absolute; width: 150px; border: 2px solid black; padding: 2px; background-color: lightyellow; visibility: hidden; z-index: 100;
				/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
				filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
			  }
	
/**  HEADER LAYOUT
 * _______________________________________________________________*/
		
/**
 *  Div englobant les éléments du Header.
 */			
td#logoMissionPadding{margin:0; padding:24px 0 0 35px; }
td#headerLogo {margin: 0; padding:24px 0 0 35px; vertical-align:top;}
td#homeHeaderLogo {vertical-align:top;}	
div#headerLogoOnly {margin: 0; padding:24px 0 24px 35px; text-align:left;}

div#Header table.width {width: 100%; border-collapse: collapse; background-color: #FFF;}
div#Header table.headerLinks {width: 485px; margin-right: 0; border-collapse: collapse;}

.headerSectionBg {margin:0; padding:0; width:616px;height:174px; vertical-align:top; text-align:right; background:url('../../images/common/header/bg_headerProfessionSection.jpg') top left no-repeat;}
.headerSectionTitle{display:none;}


	/**  HOME HEADER LAYOUT
	 * _______________________________________________________________*/

	td#missionContent{ margin:0; padding: 0; width:329px; vertical-align:middle; background:url(../../images/common/header/header_separator.gif) left top no-repeat;}
	div#missionContentPadding{ margin:0; padding:0 33px 0 25px;}
	td#searchLeftBorder{margin:0; padding:0;text-align:right;}
	td#searchContent{ height:60px; margin:0; padding:0; background-color:#dd1A21;}
	div#searchContentPadding{margin:0; padding:5px 0 5px 20px;}
	td#bannerZone {margin:0; padding:0; width:652px; height:133px; text-align:center; vertical-align:middle;}
	td#bannerZone span table {margin:0; padding:0; width:612px; height:133px; text-align:center; vertical-align:middle;}
	td#rightCornerContent { margin:0; height:45px; width:267px; vertical-align:middle; }
	.headerSectionBg{text-align:right;}	
	
	
	/* Survey Box*/
	div#yourOpinionSection{ margin:0; padding:0; }
	div#yourOpinionContent{ margin:3px 0 0; padding:0; border:solid 1px #DD1A21;width:224px;}
	div#yourOpinionPadding{ display:block; padding:5px;}	



/**  CONTENT AREA LAYOUT
 * _______________________________________________________________*/		
		
div#ContentAreaTable Table.ContentAreaTable { width: 100%; margin: 0; padding:0; border-collapse:collapse; }
div#ContentAreaTable Table.ContentAreaTable tr td.ContentAreaLeft {width:357px; margin: 0; padding:0; vertical-align:top; }
div#ContentAreaTable Table.ContentAreaTable tr td.ContentAreaRight {width: 616px; margin: 0; padding:0; vertical-align: top;}
div#ContentAreaTable .mainContent {width:540px;}
div#ContentMargin { width: 582px; margin: 15px 0 15px 15px;}
div#contentWidthSplit 
{
	margin: 0px; 
	padding:25px 50px 40px 26px; 
	_padding:25px 50px 40px 10px; 
}
div#contentWidthFull {margin: 0px; padding:25px 50px 40px 26px; }
div#PopupContent { width: 616px; margin: 0; padding: 10px; }

/* Ceci enlève les filtres sur le site */
.ListHeaderFilter img { display:none; }
	
	/**  MAIN CONTENT LAYOUT
	 * _______________________________________________________________*/		
	
	/** Ceci sert augmenter et diminuer la taille de police **/
	div.Content100,div.Content100 table td,div.Content100 table th { font-size:.69em; }

	div.Content200,div.Content200 table td,div.Content200 table th { font-size:.9em; }

	div.Content300,div.Content300 table td,div.Content300 table th { font-size:1em; }	
		
		
/**  lOGIN CONTENT
 * _______________________________________________________________*/	
		
div#login {margin: 0; padding: 10px 20px 50px 270px;}
div#login div#mandatory {margin: 0; padding: 0; text-align : right;}
div#login h1 {margin: 30px 0 10px; color:#008B7A!important;}
div#login table {margin: 0; padding: 0; width:70%; _width:65%;}
div#Login table tr td, div#Login table tr th {font-weight :700; margin: 0; padding: 0 0 5px 0; text-align:left;}
div#Login input.ImageButton  {margin: 10px 0 25px 100px;}

/* Change password page */
div#divChangePassword {width:100%;}
div#divChangePassword table {width:100%;}



/**  GENERAL CONTENT
 * _______________________________________________________________*/

	td#pageTitle{margin:0; padding:25px 0 0;}

    /**  CLEAR FLOAT
     * _______________________________________________________________*/

		div#clearfloat { clear:both; font-size:1px;}

/**  SPLIT RIGHT CONTENT
 * _______________________________________________________________*/

	/*** styles pour le contenu CMS ***/
	table.cmsContentList { border-left:1px solid #D9DBDA; border-right:1px solid #D9DBDA; border-bottom:1px solid #D9DBDA;}

	
	/**  HOME PAGE LAYOUT
	* _______________________________________________________________*/
        
	/** 
	*  Classe ou Id pour le design particulier
	*  d'une page d'accueil
	*/
    div#homeContent{margin:0; padding:32px 0 0;}
    div#homeContent table td{vertical-align:top;}
    
    .sectionTitle{margin:0; padding:4px 0 2px 6px; font:20px Verdana,Helvetica,sans-serif; text-transform:uppercase;}
    .sectionTitle a:link{color:#FFF;}
    .sectionTitle a:visited{color:#FFF;}
    .sectionTitle a:hover{color:#FFF;}
    .sectionTitle a:active{color:#FFF;}
    .titleSpacer{margin:0; padding:0; width:110px; height:33px; background-color:#FFF;float:right;}    
    .sectionSeparator{width:8px;}
    .sectionIntro{margin:0; padding:0; width:100%;}
    .sectionIntroPadding{margin:0; padding:19px 53px 59px 29px;}
    .sectionIntro span{ color:#fefefe;}
    .btnWhite{background-color:#FFF; color:#008B7A; font:.90em Verdana,Helvetica,sans-serif;}

    /*** Profession Section ***/
    td#professionSection{margin:0; padding:0; width:319px; background-color:#008B7A;color:#FFF;}
    
    /*** Public Section ***/
    td#publicSection{margin:0; padding:0; width:319px; background-color:#0062A4;color:#FFF;}
    
    /*** Media Section ***/
    td#mediaSection{margin:0; padding:0; width:320px; background-color:#DD1A21;color:#FFF;}
    td#mediaSectionImage{text-align:right;}
    
    

	/**  JOB OFFERS PAGE LAYOUT
	 * _______________________________________________________________*/

	table.tableJobOpportunities { width: 600px; border-bottom: 1px solid #416592; border-left: 1px solid #416592; border-collapse: collapse; background-color: #E9D2BB; }
	table.tableJobOpportunities th { padding: 7px 0; font-size: 14px; border-top: 1px solid #416592; border-right: 1px solid #416592; background-color: #B1BED7; }
	table.tableJobOpportunities td { padding: 7px; border-top: 1px solid #416592; border-right: 1px solid #416592; }

	/**  NEWS PAGE LAYOUT
     * _______________________________________________________________*/

	table.newsList { width: 100%; border-collapse: collapse; }
	table.newsList td.newsTD { padding: 3px 0; border-bottom: 1px solid #CCC; }
	
	/**  PUBLICATION
     * _______________________________________________________________*/
	
	div#divPubContent table {margin:0 0 15px 0; border-left:1px solid #D9DBDA;  border-right:1px solid #D9DBDA;}
	div#divPubContent table tr.listHeader {background-color:#DD1A21;}
	div#divPubContent table tr.listHeader th {padding:5px;}
	div#divPubContent table tr.listLine th {padding:5px; border-bottom:1px solid #D9DBDA; font-weight:normal; }
	div#divPubContent table tr.listHeader td, tr.listLine td {display:none;}
	div#divPubList table tr td div {height:0px; border-top:1px solid #D9DBDA; padding:0; margin:0 0 5px 0;}
	div#publicationDetails table.pubHeaderDetails tr td {padding:5px 2px; }
	
	/*** List Navigator ***/
	.listNavigator,.gridNavigator
	{		
		width:100%;
		border:none!important;
	}
	
	.listNavigator td
	{		
		text-align: center;
		height: 26px;
		border:none!important;							
	}	
	
	/**
	*  Pour le lien Consulter archives
	**/	
	div#archiveLink table{width:100%; border-collapse:collapse; margin:0 0 5px 0;}
	
	/**  FORUM
     * _______________________________________________________________*/

	div#sharedSpaceSubjectList table {margin:0 0 15px 0; border-left:1px solid #D9DBDA;  border-right:1px solid #D9DBDA;}
	div#sharedSpaceSubjectList table tr.listHeader th {padding:5px; text-align:left; background-color:#0062A4;}
	div#sharedSpaceSubjectList table tr.listLine th {padding:5px; text-align:left; border-bottom:1px solid #D9DBDA; font-weight:normal; }
	div#sharedSpaceSubjectList table tr.listHeader td, tr.listLine td {display:none;}
	
	/**
	*  Poser une question
	**/		
	div#askQuestion {width:100%; margin:10px 0; padding:10px; background-color:#f5f5f5; border:1px solid #D9DBDA}
	
	#sharedSpaceSubjectList {margin:20px 0 0 0;}
	#divAskQuestion{margin-bottom:5px;}
		
	/* Question answered section */
	#divShowAnsweredQuestionOnly{text-align:right; margin:10px 0 0 0;}
	#sharedSpaceSubjectDetails table tr.listLine th {border-top:solid 2px #D9DBDA;padding-top:15px;vertical-align:top;font-weight:normal;}
	
	#divAnswersList { padding-bottom:5px;text-align:right;}
	#divAnswersList table {width:525px;float:right;}
	#divAnswersList table tr.childListLine th {padding:15px 0 15px 0; text-align:left; border-top:1px solid #D9DBDA; font-weight:normal;vertical-align:top; }
	#divNoForumAnswers { text-align:center; padding:5px;}

	/**  CAREER
     * _______________________________________________________________*/

	div#careerList {width:100%;}
	div#careerList table {margin:0 0 15px 0; border-left:1px solid #D9DBDA;  border-right:1px solid #D9DBDA;}
	div#careerList tr.listHeader th {text-align:left;padding:5px; background-color:#f5f5f5; border-bottom:1px solid #D9DBDA; border-top:1px solid #D9DBDA;}
	div#careerList table tr.listLine th {padding:5px; text-align:left; border-bottom:1px solid #D9DBDA; border-top:1px solid #D9DBDA;font-weight:normal;}
	div#careerList table tr.listHeader td, tr.listLine td {display:none;}
	
	/**
	*  Pour le détail d'une carrière
	**/	
	div#careerInfo {width:100%; margin:10px 0; padding:10px; background-color:#f5f5f5; border:1px solid #D9DBDA;}
	div#careerInfo table {width:100%; border-collapse:collapse;}
	div#careerInfo table tr td, div#careerInfo table tr th {text-align:left;vertical-align:top; /*padding:5px;*/}
	
	/* Création d'une carrière */
	div#divCareerCreation {width:100%; margin:10px 0; padding:10px;}
	div#divCareerCreation table {width:100%;}
	
	.detailItems{/*width:540px;*/}
	
	.detailItems th,.detailItems td {text-align:left;height:26px;}
	
		/**  MULTILINGUAL TABS
		 * _______________________________________________________________*/
		
			.DefaultTab { background-color:#f5f5f5;border:solid 1px #CCC;}
			
			.DefaultTabHover { background-color:#f5f5f5;text-decoration:underline; cursor:pointer;border:solid 1px #CCC;}
			
			.SelectedTab{background-color:#0062A4; color:#FFF;}
			
			.multilingualContainer{border:solid 2px #0062A4; padding:10px 3px;}
	

/**  FULL PAGE LAYOUT
 * _______________________________________________________________*/


	/**  ERROR PAGE LAYOUT
	 * _______________________________________________________________*/

	div#errorPageContent {padding: 40px 50px; text-align:left;border-top:solid 1px #908F8F;}
	
	/**  POPUP PAGE LAYOUT
	 * _______________________________________________________________*/
		div#popupContent{padding:20px 0 0 10px;}
		
	/**  SITE MAP PAGE LAYOUT
	 * _______________________________________________________________*/
	
	div#siteMapContent{text-align:left;padding:0 0 0 40px;}
	

/**  FOOTER LAYOUT
 * _______________________________________________________________*/


div#footerShadow {width:996px; height:12px; margin:0 auto; padding:0; background:#FFF url(../../images/common/footerBottomShadow.gif) no-repeat top;}
div#divControlPannel{display:inline;}
div#Copyright { margin: 0; padding: 10px 0px 13px; font:9px Verdana,Helvetica,sans-serif; text-align: center; background-color: #FFF; border-top:solid 1px #908F8F;}

div#CopyrightOnly {margin: 0; padding: 10px 0px 13px; text-align: right;border-top:solid 1px #908F8F;} 
div#CopyrightOnly table {width: 100%; border-collapse: collapse;} 
div#Copyright table td {padding: 0 5px; font:9px Verdana,Helvetica,sans-serif; color:#6D6F71;} 
div#CopyrightOnly span{font-size:9px;}
div#CopyrightOnly a{font-size:9px;margin-left:20px;}

div#footerPopup {margin: 0; padding: 6px 0; text-align: right; background-color: #D9DBDA;}
div#footerPopup table {width: 100%; border-collapse: collapse;} 
div#footerPopup table td {padding: 0 20px;}

div#ContentAreaTable Table.ContentAreaTable tr td.ContentAreaFooter {margin: 0; padding:0; vertical-align:top;}

/**  SPECIAL CASES
 * _______________________________________________________________*/
 
.fullWidth {width: 100%;margin:0; padding:0;}		
.spacer {height: 1px; border-bottom: 1px dashed #CCD0CE;}
.spacerTD {padding-bottom:20px!important;}
.spacerTopTD { padding-top:20px!important;}
.spacerTitle {height:30px!important;}
.paddingLeft {padding-left: 10px;}
.paddingRight {padding-right: 15px;}
td.paddingBottom {padding-bottom: 15px;}
.paddingTop {padding-top: 15px;}
.error {font-size: 11px; color: #dd1A21; font-weight: 700;}
.checkboxMargin {margin-left: -3px;}
.alignRight {width:100%;text-align:right;}
.emptyList {padding-top:20px;}



.employerName{ font-size:125%;}

/** textbox of datepicker **/
.picker input {width:80px;}

/** Text in dropdown list **/
.RadEWrapper td {font-size:11px!important;height:auto;}


/*class for list sorting*/
a.ascending {color: #C84A00; text-decoration:underline; font-weight:700; margin: 0;	padding:0 10px 0 0; background-image: url(../../images/common/icons/ico_descending_white.gif); background-position:right top; background-repeat:no-repeat; }
a.descending {color:#C84A00; text-decoration:underline; font-weight:700; margin: 0;	padding:0 10px 0 0;	background-image: url(../../images/common/icons/ico_ascending_white.gif); background-position:right top; background-repeat:no-repeat; }
a.noSort:link,a.noSort:active,a.noSort:Hover,a.noSort:visited {color:#C84A00; text-decoration: underline; font-weight:700; margin: 0; padding:0 10px 0 0; background-repeat:no-repeat;}
.noSort {color:#C84A00;	text-decoration:none; font-weight:700; margin: 0; padding:5px 0 0 0;}
/*class for list sorting*/

/** Mandatory Star **/
.mandatoryStar {font-size: 100%; color: #dd1A21; margin: 0; padding: 0;}
div#mandatory {float:right; clear:right; font-weight: 700; font-size: 100%;	margin: 20px 5px 0 0; padding: 0;}
/** End Mandatory Star **/

/** From OCQ Website **/
.bgcolor1 {background-color: #085040;}
.bgcolor2 {background-color: #AAC5BE;}
.bgcolor3 {background-color: #E6EEEA;}
.bgcolor4 {background-color: #666666;}
.bgcolor5 {background-color: #F6F9F3;}
.bgcolor6 {background-color: #E3E6E0;}

.bgcolor7 {background-color: #BC5E1B;}
.bgcolor8 {background-color: #BC5E1B;}
.bgcolor9 {background-color: chocolate}
.bgcolor10 {background-color: brown}

.bgfond {background-color: #F6F9F3}
.bgtableau {background-color: darkkhaki}
.bgblanc {background-color: #FFFFFF}
.bgnoir {background-color: #000000}
.bggris {background-color: #666666;}