/**********************************************************************************************

	Date: 2010

***********************************************************************************************
	
	1. General Elements
	
	2. Layout
		2.1 Header
		2.2 Content
		2.3 Footer
		2.4 Forms
		
	3. Buttons, Icons, & Headers
		3.1 Buttons
		3.2 Icons
		3.3 Headers
		
***********************************************************************************************/


/* 1. General Elements
-----------------------------------------------------------------------------------------------
===============================================================================================*/	
	
html {
}

body {
	font-family: Arial, Helvetica, Verdana, sans-serif;
	color:#000000;
	font-size: 12px;
}

hr {
	display: none;
}

strong {
	font-weight: bold;
}
	
em {
	font-style: italic;
}

address {
	font-style: normal;
}

input, textarea, select {
	font: 14px Arial, Helvetica, Verdana, sans-serif;
}

a {
	color:#ba0307;
	text-decoration: underline;
}
	a:hover {
		color: #4a71a4;
	}

a:visited {}
a:active {}

h1, h2, h3, h4, h5{
	font-family:Helvetica, Arial, Trebuchet, Verdana, sans-serif;
}

h1 {
	font-size:24px;
	font-weight:bold;
	line-height:30px;
}
h2 {
	font-size:18px;
	font-weight:bold;
	line-height:24px;
	color:#30445d;
}
h3 {
	font-size:16px;
	font-weight:bold;
	line-height:22px;
	color:#4a71a4;
}
h4 {
	font-size:14px;
	font-weight:bold;
	line-height:20px;
}
h5{
	font-size:12px;
	font-weight:bold;
	color:#ba0307;	
}

p {
	margin-top:12px;
	margin-bottom:12px;
}
	p.first {
		margin-top:0;
	}
	p.last {
		margin-bottom:0;
	}

.float_left {
	float:left;
}
.float_right {
	float:right;
}

.margin_top_12{
	margin-top:12px;	
}
.margin_top_24{
	margin-top:24px;
}
.margin_top_36{
	margin-top:36px;
}

.margin_bottom_12{
	margin-bottom:12px;	
}
.margin_bottom_24{
	margin-bottom:24px;
}
.margin_bottom_36{
	margin-bottom:36px;
}

.margin_left {
	margin-left:10px;
}
.margin_right {
	margin-right:10px;
}

.margin_50{
	margin-left:50px;
	margin-right:50px;
}

.margin_none {
	margin: 0;
}

.color-red {
	color:#ba0307;
}
.color-green {
	color:#a9b93c;
}
.color-orange {
	color:#f68428;
}
.color-blue {
	color:#4a71a4;
}	
.color-brown {
	color:#019dd8;
}
.color-yellow{
	color:#eaa614;
}
.color-gray {
	color:#616161;
}

.text_center{
	text-align:center;
}
.text_right{
	text-align:right;
}
.clearer {
	clear:both;
}

/* 2. LAYOUT
----------------------------------------------------------------------------------------------
===============================================================================================*/	

html {
	background:#30445C;
}

#container {
	position:relative;
	margin: 20px auto;
	width:960px;
	text-align: left;
	background:url("../images/bg-container.png") no-repeat scroll left top #ffffff;
}

/* 2.1 SITE HEADER
------------------------------------------------------------------------------------------------ */

#header{
	position:relative;
	height:150px;
}
	#header #logo ,
	#header #logo a {
		display: block;
		width:200px;
		height:84px;
	}
	
	#header #logo {
		position:absolute;
		top:13px;
		left:15px;
		text-indent:-9999em;
		background:url(../images/logo-site.png) left top no-repeat; 		
	}
		
	/* 2.1.1 NAVIGATION
	---------------------------------------------------------------- */
	
	#navigation {
		position:absolute;
		top:120px;
		left:0px;
		overflow:hidden;
		width:960px;
		height:22px;
		padding:8px 0 0 0;
		list-style-type:none;
		color:white;
		font-size:14px;
		background:url('../images/bg-navigation.png') top left repeat-x;
	}		
		#navigation li {
			float:left;
			height:22px;
		}
		#navigation a {
			border-right:1px solid #4b6383;
			float:left;
			display:block;
			height:22px;
			padding:0px 16px;
			text-decoration:none;
			color:white;
		}
			#navigation .last a{
				border-right:0px;
			}
		
		#navigation a:hover{
			text-decoration:underline;
		}
		#navigation li.selected a {
			font-weight:bold;
		}
	
	/* 2.1.2 QUOTE
	---------------------------------------------------------------- */
	
	#quote {
		position:absolute;
		top:43px;
		right:20px;
		width:400px;
		text-align:right;
		font-style:italic;
	}
		
	/* 2.1.3 LINKS
	---------------------------------------------------------------- */
	
	#links{
		position:absolute;
		top:4px;
		right:10px;
		font-size:12px;
		color:#30445d;
	}
		#links h2{
			display:inline;
		}
		#links a{
			color:#4c71a2;
			text-decoration:none;
		}
			#links a:hover{
				text-decoration:underline;
			}
	
	
	
/* 2.2 CONTENT
------------------------------------------------------------------------------------------------ */

#content {
	margin:10px;
	line-height:16px;
	font-size:12px;
}
	#content ul {
		padding-left:20px;
		list-style-type:disc;
	}

.column_left{
	float:left;
	margin-right:10px;
	width:620px;
}

.column_right{
	float:left;
	width:300px;
}

ul#featured_pages{
	list-style-type:none;
	padding-left:0px;
}
	#featured_pages li {
		float:left;
		list-style-type:none;
		border:1px solid #dddddd;
		border-top:1px solid #4a71a4;
		padding:10px;
		width:205px;
		margin-right:10px;
		margin-bottom:10px;
		background:#f5f5f5;
	}
	#featured_pages li h3{
		margin-bottom:12px;
	}
	#featured_pages li a{
		font-weight:bold;
	}
	#featured_pages li .image{
		padding:1px;
		border:1px solid #cecece;
		background:white;
	}
	#featured_pages li .description{
		margin-top:10px;
	}
	#featured_pages li.last {
		margin-right:0px;		
	}

/* 2.3 FOOTER
------------------------------------------------------------------------------------------------ */

#footer{
	clear:both;
	margin:0 10px;
	margin-top:160px;
	border-top:1px solid #dddddd;
	padding:20px;
	font-size:12px;
	text-align:center;
}

#copyright{
	position:relative;
	margin: 20px auto;
	width:960px;
	font-size:10px;
	color:#aaaaaa;	
}

/* 2.4 FORMS
------------------------------------------------------------------------------------------------ */

.input-text-white{
	border:0 none;
	width:139px;
	height:20px;
	padding:5px 5px 5px 10px;
	font-size:10px;
	background:url("../images/input-text-white.png") no-repeat scroll left top transparent;
}
		

/* 2.5 BLOCKS
------------------------------------------------------------------------------------------------ */

.block_blue_top{
	color:black;
	font-family:Arial,Verdana;
	font-size:12px;
	line-height:16px;
	margin:20px 0 0;
	padding:30px 15px;
	background:url("../images/block-blue-top.png") repeat-x scroll left top transparent;
}

.block_gray{
	border:1px solid #dddddd;
	padding:20px;
}
	
/* 3. Buttons, Icons, & Headers
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

/* 3.1 BUTTONS
------------------------------------------------------------------------------------------------ */

.button-preview,
.button-close,
.button-download,
.button-back,
.button-submit{
	padding:0;
	border:0;
	text-indent:-9999px;	
}

.button-preview{
	width:54px;
	height:22px;
	background:url('../images/button-preview-en.png') top left no-repeat;
}
	#sitelang_fr .button-preview{
		width:70px;
		background:url('../images/button-preview-fr.png') top left no-repeat;
	}

.button-close{
	width:54px;
	height:22px;
	background:url('../images/button-close-en.png') top left no-repeat;
}
	#sitelang_fr .button-close{
		background:url('../images/button-close-fr.png') top left no-repeat;
	}

.button-download{
	width:63px;
	height:22px;
	background:url('../images/button-download-en.png') top left no-repeat;
}
	#sitelang_fr .button-download{
		width:65px;
		background:url('../images/button-download-fr.png') top left no-repeat;
	}

.button-back{
	width:56px;
	height:24px;
	background:url('../images/button-back-en.png') top left no-repeat;
}
	#sitelang_fr .button-back{
		width:82px;
		background:url('../images/button-back-fr.png') top left no-repeat;
	}

.button-submit{
	display:block;
	width:54px;
	height:22px;
	background:url('../images/button-submit-en.png') top left no-repeat;
}
	#sitelang_fr .button-submit{
		width:62px;
		background:url('../images/button-submit-fr.png') top left no-repeat;
	}


/* 3.2 ICONS
------------------------------------------------------------------------------------------------ */

.icon-loading{
	width:157px;
	height:40px;
	text-indent:-9999px;
	background:url('../images/icon-loading-en.png') top left no-repeat;
}
	#sitelang_fr .icon-loading{
		width:210px;
		background:url('../images/icon-loading-fr.png') top left no-repeat;
	}

/* 3.3 HEADERS
------------------------------------------------------------------------------------------------ */

.h1-participaction_toolkit{
	width:358px;
	height:31px;
	padding:0;
	margin:0;
	border:0;
	text-indent:-9999px;
	background:url('../images/h1-participaction_toolkit-en.png') top left no-repeat;
	position:relative;
}
	#sitelang_fr .h1-participaction_toolkit{
		background:url('../images/h1-participaction_toolkit-fr.png') top left no-repeat;		
	}
.h1-participaction_toolkit a{
	position:absolute;
	top:0px;
	left:0px;
	display:block;
	width:358px;
	height:31px;
}