/*	-------------------------------------------------------------
	
	CARGOLUTION

	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
	
	Description:	Screen Cascading Style Sheet
	Nom:			screen.css
	Version:		1
	Date:			2 Fev, 2009
	By:				Simon Bouchard [www.simonbouchard.com]
	
	-------------------------------------------------------------	*/


/*	-------------------------------------------------------------
	BODY 
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

	body{
		margin:0;
		color:#1b2861;
		font:11px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
		background:#fff url(/images/bg_body.jpg) top left no-repeat;
		border-top:4px #1c2961 solid;
		min-width:910px; }

/*	-------------------------------------------------------------
	RESET
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

	img {
		border-style:none; }

	input,
	textarea,
	select {
		font:100% arial,sans-serif;
		vertical-align:middle; }
		
	form,fieldset {
		margin:0;
		padding:0;
		border:none; }

	.clearfix {
		clear:both;
	font-size:0;
	height:10px;
	line-height:0;
	position:relative; }


/*	-------------------------------------------------------------
	ANCHOR
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

	a{
		text-decoration:none;
		color:#000;
		outline:none;}
		
	a:hover {
		text-decoration:underline; }

/*	-------------------------------------------------------------
	TYPOGRAPHY
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

	p, div.imageblock p, div.textblock p { line-height:140%; font-size:12px;}

	ul li { margin:3px 0; }

.textbg ul {
	margin:10px 0 0 40px;
	font-size:12px;}

/*	-------------------------------------------------------------
	INTERFACE
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/


	/*	Container	*/
	#container {
		width:942px;
		padding:0 24px;
		margin:0;
		position:relative; }

	/*	Header	*/
	#header {
		margin:0 auto;
		width:910px;
		height:228px;
		position:relative;}

	#header .lang {
		position:absolute;
		z-index:5000;
		left:0px;
		background: #1c2961;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius-topleft: 0px;
		-webkit-border-top-left-radius: 0px;
		-moz-border-radius-topright: 0px;
		-webkit-border-top-right-radius: 0px;
		padding:2px 9px 5px 9px; }

	#header .lang a {
		color:#fff;
		padding:0 0 0 23px;}

	#header .lang a.en {
		background: url("/images/gb.png") no-repeat 0 3px; }

	#header .lang a.fr {
		background: url("/images/fr.png") no-repeat 0 3px; }

	#header .lang a:hover {
		text-decoration:none;}

	/* Flash Block */
	#header .flash{
		position:absolute;
		left:0;
		top:0px;
		width:902px;
		height:195px;
		overflow:hidden; }
		
	#header .flash img{
		vertical-align:top; }
		
	/* Slogan Block */
	#header .slogan {
		position:absolute;
		left:2px;
		top:202px;
		height:25px;
		padding:0 16px; }
	
	#header .bande {
		position:absolute;
		left:-13px;
		top:229px;
		height:21px;
		padding:0 16px; }
		
	#header .slogan span {
		float:left;
		display:inline;
		margin-left:-16px;
		height:25px;
		width:16px;
		background:url(../../images/slogan-leftbg.png) no-repeat; }
	
	#header .slogan div {
		float:left;
		height:25px;
		width:100%;
		background:#1c2961; }
		
	#header .slogan em{
		float:left;
		display:inline;
		margin-right:-16px;
		width:16px;
		height:25px;
		background:url(../../images/slogan-rightbg.png) no-repeat; }
		
	#header .slogan h2{
		font:italic 12px/25px Arial, Helvetica, sans-serif;
		color:#fff;
		margin:0 -6px;
		float:left;
		text-align:center;
		display:inline;
		position:relative;
		width:250px;
		background:transparent; }
		
	/* Main Menu */
	div.menu {
		position:absolute;
		top:202px;
		right:0; }

		ul#nav {
			float: right;
			margin: 0;
			padding: 0;
			z-index:500;
			width:100%; }
	
		ul#nav li,
		ul#nav li a {
			display: block;
			float: left;
			text-transform:uppercase;
			outline:none;
			width:auto;}
		
		ul#nav li {
			position: relative; }
		
		ul#nav li a {
			text-decoration: none;
			font-weight: lighter;
			color: #666;
			padding: 4px 6px;
			background: none;
			width:auto;}

		ul#nav li a:hover {
			color:#1c2961;
			background:transparent;}

			ul#nav li.active a {
				color:#1c2961;
				background:transparent;}
			
		/*-- Dropdowns --*/
		ul#nav li .dropdown {
			display:none;
			position: absolute;
			z-index: 500 !important;
			width: 208px;
			top: 22px;
			left:1px;
			overflow: hidden;
			clear: left;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			background:transparent url("/images/dropdown.gif") no-repeat top left;
		}
		
		ul#nav li ul {
			width: 100%;
			overflow: hidden;
			margin: 0;
			padding: 0;
		}
		
		ul#nav li:hover .dropdown,
		ul#nav li.over .dropdown {
			display: block;
			padding:25px 0 10px;
		}
		
		/* FIX: add styling? */
		ul#nav li:hover a,
		ul#nav li.over a {
			color: #1c2961;
			background:transparent;
		}
		
		ul#nav li:hover ul li a,
		ul#nav li.over ul li a {
			color: #fff;
			background:transparent;
		}
		
		/* get a clean slate for the dropdowns */
		ul#nav li ul li,
		ul#nav li ul li a {
			float:none;
			height: 1%;
			width:auto;
			background: none;
			margin: 0;
			padding: 0;
			text-transform: none;
			font-weight: normal;
		}
		
		ul#nav li ul li {
			padding: 0;
			margin: 0 5px 0 5px; }
		
			ul#nav li ul li.last { 
				background: none;
				padding-bottom: 1px; }
		
			ul#nav li ul li a {
				line-height: 12px;
				padding: 7px 0 10px 7px;
				color: #666; }
			
			ul#nav li ul li a:hover {
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
				color: #1c2961;
				background:#ffb500}

			ul#nav li ul li a sup {
				font-size:9px;
				color:#000;
				margin:0 0 0 3px;}


	/*		Content		*/
	#content {
		margin:21px auto 0;
		width:910px;
		overflow:hidden; }

	#content .col-left { 
		float:							left;
		width:							31%; }
		
	#content .col-mid { 
		float: 							left;
		width: 							31%; }

	#content .col-right { 
		float: 							left;
		width: 							31%; }

	#content .col-left, #content .col-mid, #content .col-right {
		padding:0 0 0 15px;
		}

	#content .column1 span, #content .column2 span, #content .col-left span, #content .col-mid span, #content .col-right span {
		font-weight:bold;
		}

	#content .column1 { 
		float:							left;
		width:							50%;  }
		
	#content .column2 { 
		float: 							left;
		width: 							47%;
		margin:							0; }

	#content .column1 span, #content .column2 span {
		font-weight:bold;
		}

	p#wfg {
		background:url("/images/logo_wfg.png") no-repeat 28px 0;
		padding:5px 0 15px 150px !important;
		margin:20px 0 10px 0; }

	p#wbn {
		background:url("/images/logo_wbn.png") no-repeat 28px 0;
		padding:5px 0 15px 150px !important;
		margin:20px 0 20px 0; }
	
	p#bdm {
		background:url("/images/logo_bdm.gif") no-repeat 28px 0;
		padding:12px 0 15px 150px !important;
		margin:20px 0 0 0; }

	p#xe {
		background:url("/images/logo_xe.gif") no-repeat 28px 0;
		padding:5px 0 15px 150px !important;
		margin:20px 0 0 0; }

	p#chamber {
		background:url("/images/logo_chamber.gif") no-repeat 28px 0;
		padding:0 0 10px 150px !important;
		margin:30px 0 0 0; }

	p#canada {
		background:url("/images/wmms.gif") no-repeat 28px 0;
		padding:0 0 10px 150px !important;
		margin:20px 0 0 0; }


	.textblock{
		width:910px;
		overflow:hidden; }
		
	.textblock .texttopbg{
		display:block;
		width:910px;
		height:19px;
		background:url(../../images/texttopbg-bg.png) no-repeat; }
	
	.textblock .textbg{
		width:910px;
		background:url(../../images/textblock-bg.png) repeat-y;
		padding-bottom:42px;
		padding-top:10px;
		overflow:hidden; }

	.textblock h1{
		margin:3px 30px 0;
		font:Italic 12px/21px Arial, Helvetica, sans-serif;
		color:#5a5b5e;
		text-transform: uppercase; }

	.textblock h2{
		margin:3px 30px 20px 30px;
		font:Italic 22px/21px Arial, Helvetica, sans-serif;
		color:#a70a25;
		text-transform: uppercase; }
		
	.textblock h2 strong{
		font-size:22px;
		padding:0 0 15px 0;
		font-weight:normal;
		color:#a70a25; }
		
	.textblock h3{
		margin:0 28px 5px 28px;
		clear:left;
		font:italic 14px/18px Arial, Helvetica, sans-serif;
		color:#5a5b5e; }

	.textblock p,
	.textblock h4 {
		margin:20px 30px 0;
		font-size:11px;
		line-height:12px; }

	.textblock p{
		margin-top:11px; }

	.textblock h5 {
		margin:20px 0 0 28px;
		font:italic 14px/18px Arial, Helvetica, sans-serif;
		color:#5a5b5e; }
	
	/* Image Block */
	.textblock .imageblock{
		width:100%;
		overflow:hidden; }
		
	.textblock .imageblock .image{
		margin:15px 17px 0 29px;
		float:left;
		display:inline;
		width:auto;}

	.textblock .imageblock .image2 {
		margin:0px 29px 0 17px;
		float:right;
		display:inline;
		clear:both;
		width:auto;}

	.textblock .imageblock .image img, .textblock .imageblock .image2 img {
		vertical-align:top; }
		
	/* Orange Text Block */
	.textblock .orangeblock{
		margin:35px 0 0 27px;
		width:585px;
		overflow:hidden;
		background:url(../../images/orangeblock-bg.gif) repeat-y; }

		.textblock .orangeblock-large{
			margin:25px 0 0 27px;
			width:855px;
			overflow:hidden;
			background:url(../../images/orangeblock-large-bg.gif) repeat-y; }

	.textblock .orangeblock .topbg,
	.textblock .orangeblock .botbg{
		width:585px;
		overflow:hidden;
		background:url(../../images/orangeblock-topbg.gif) no-repeat; }

		.textblock .orangeblock-large .topbg,
		.textblock .orangeblock-large .botbg{
			width:855px;
			overflow:hidden;
			background:url(../../images/orangeblock-large-topbg.gif) no-repeat; }


	.textblock .orangeblock .botbg{
		padding-bottom:24px;
		background:url(../../images/orangeblock-botbg.gif) no-repeat 0 100%; }

		.textblock .orangeblock-large .botbg{
			padding-bottom:24px;
			background:url(../../images/orangeblock-large-botbg.gif) no-repeat 0 100%; }

	.textblock .orangeblock h4,
	.textblock .orangeblock-large h4{
		margin:20px 25px 0; }
		
	.textblock .orangeblock p,
	.textblock .orangeblock-large p{
		margin:14px 25px 0; }

	/* Worldmap */
	.textblock .worldmap {
		text-align:center;
		margin:20px auto 10px auto; }


	/* Subpage Styles */
	.subholder{
		width:100%;
		overflow:hidden; }
		
	/* Subpage Text Block */
	.subholder .textblock{
		width:634px;
		float:right; }
		
	.subholder .textblock .texttopbg{
		width:634px;
		background:url(../../images/texttopbg-bg2.png) no-repeat; }
	
	.subholder .textblock .textbg{
		width:634px;
		padding-bottom:22px;
		background:url(../../images/textblock-bg2.png) repeat-y; }
		
	.subholder .textblock h2{margin:3px 22px 0;}
	.subholder .textblock h3{margin:0 22px;}
	.subholder .textblock .imageblock .image{margin-left:23px;}
	.subholder .textblock h4,
	.subholder .textblock p{margin:20px 24px 0; line-height:150%;}
	.subholder .textblock p{margin-top:11px;}
	.subholder .textblock .orangeblock{margin:30px 0 0 22px;}

	/* Track & Trace */
	.tracktrace {
		width:855px;
		margin:20px auto;}

	.tracktrace .login {
		float:left;
		margin:0 0 20px 0;}

	.tracktrace .img {
		width:220px;
		padding:22px 0 0 15px;
		float:left;
		background:#fff;}

	.tracktrace p {
		padding:15px 15px 0 0;
		margin:0;
		float:left;
		text-align:center}

	.tracktrace form {
		float:left;
		width:600px;
		margin:15px 0;border:#d6d4d4 2px solid; background:#efeeee;padding:0 0 15px 0}

	.tracktrace div#content {
		float:left;
		width:585px;
		margin:15px 0;
		border:#d6d4d4 2px solid; 
		background:#efeeee;
		padding:0 0 15px 15px}

	.tracktrace form ul {
		list-style:none;
		margin:0;
		padding:5px 0 0 15px;}

	.tracktrace form ul li {
		clear:both;}

	.tracktrace form ul label {
		display:block; float:left; width:160px; padding:10px 0;}

	.tracktrace form .txtField {
		float:left; 
		padding:5px; 
		width:260px; 
		margin:5px 0 0 0;
		font: 1em "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
		color:#383838;
		border:1px solid #d6d4d4;
		outline:none;}

	.tracktrace form .submit {
		float:left; 
		padding:5px; 
		width:100px; 
		margin:5px 0 0 0;
		font: 1em "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
		color:#383838;
		border:1px solid #d6d4d4;
		background:#fff;
		outline:none;}

	.tracktrace form .submit:hover {
		color:#383838;
		background:#d6d4d4;
		outline:none;
		cursor:pointer;}


	/* Left Column */
	.column{
		width:271px;
		float:left; }

	.column .textblock{
		width:271px;
		overflow:hidden; }
		
	.column .textblock .texttopbg {
		display:block;
		width:271px;
		height:19px;
		background:url(../../images/texttopbg-small-bg.png) no-repeat; }

	.column .textblock .textbg {
		width:271px;
		background:url(../../images/textblock-small-bg.png) bottom;
		padding-bottom:42px;
		padding-top:10px;
		overflow:hidden; }

	.column .nouvelles {
		width:230px;
		overflow:hidden;
		margin:0 auto; }
		
	.column .nouvelles h3{
		margin:3px 0 10px 0;
		font:Italic 22px/21px Arial, Helvetica, sans-serif;
		color:#a70a25;
		text-transform: uppercase;
		background:transparent;}

	.column .nouvelles ul{
		margin:15px 0 0;
		padding:22px 0 0;
		list-style:none;
		border-top:2px #1c2961 solid;
		width:263px;
		overflow:hidden; }
		
	.column .nouvelles ul li{
		width:263px;
		float:left; }
		
	.column .nouvelles ul li .image{
		margin-top:12px;
		float:left;
		width:auto;}
		
	.column .nouvelles ul li .image img{
		vertical-align:top; }
		
	.column .nouvelles ul li .text{
		width:192px;
		float:right; }

	.column .nouvelles h1.title {
		margin:20px 0 0 0;
		font:italic 14px/18px Arial, Helvetica, sans-serif;
		color:#5a5b5e; }

	.column .nouvelles h1.title a {
		color:#5a5b5e;
		background:transparent; }
	
	.column .nouvelles p.date {
		margin:2px 0 11px 0;
		line-height:12px; }

	.column .nouvelles p {
		margin:0;
		line-height:16px; }


	.textbg #left, .textbg #mid, .textbg #right {
		float:left;
		width:175px;
		margin:20px 30px 0;}

	.textbg #mid {
		float:left;
		padding:0 0 0 30px;
		width:auto; }

	.textbg #right {
		float:left;
		width:400px;
		padding:0; }

	/* Nouvelles */
	h1.title {
		margin:20px 0 0 28px;
		font:italic 14px/18px Arial, Helvetica, sans-serif;
		color:#5a5b5e; }

	p.date {
		margin:0 0 0 28px;
		font-size:11px !important;
		font-style:italic;
		color:#5a5b5e;
		}

	/* Footer */
	#footer {
		width:100%;
		margin:0 auto;
		text-align:center;
		border-top:4px #1c2961 solid;
		background:#fff;
		overflow:hidden; }
		
	#footer .footer {
		width:982px;
		margin:0;
		padding:5px 0 20px 0;
		overflow:hidden; }
		
	#footer ul{
		margin:0;
		padding:0;
		list-style:none; }
		
	#footer ul li{
		padding:0 6px 0 8px;
		display:inline;
		font-size:12px;
		line-height:14px;
		background:url(../../images/footer-sep.gif) no-repeat 0 2px; }
	
		#footer ul.lang {
				margin:10px 0; }
	
		#footer ul.lang li{
				padding:0 6px 0 8px;
				display:inline;
				font-size:12px;
				line-height:14px;
				background:none; }

	#footer ul li:first-child{
		background:none; }
		
	#footer ul li a{
		color:#51504e; }
		
	#footer ul li.active a,
	#footer ul li a:hover {
		text-decoration:none;
		color:#003263; }