/*
Title:      Atlas Fueling Systems - feuille de styles principale
Author:     Bernard Bélanger, design[at]bernardbelanger.com 
Updated:    Mai 2007
Notes:		http://www.bernardbelanger.com
*/

body {
	margin: 0;
	padding: 0;
	font-family: "Lucida Grande", Verdana, "Trebuchet MS", sans-serif;
	font-size: 11px;
	line-height: 15px;
	font-weight: normal;
	text-align: left;
	color: #333333;
	background: #364370;
	border-top: solid #000 1px;
	}
	
/* _____  structure  ________________________ */

#wrap {
	border-top: solid #4fbb00 3px;
	background: transparent;
	text-align: center;
	width: 100%;
	margin: 0;
	padding: 0 0 0 0;
	}

#page {
	text-align: left;
	background: transparent;
	margin: 0 auto 0 auto;
	padding: 0 0 0 0;
	width: 750px;
	}

#header {
	background: transparent url("../img/eco_header_ani.gif") no-repeat right top;
	color: #fff;
	text-align: left;
	margin: 0;
	padding: 0;
	width: 750px;
	height: 114px;
	}

#main {
	background: #fff url("../ico/fnd_top.gif") no-repeat 0 top;
	text-align: left;
	margin: 0;
	padding: 0 0 0 0;
	width: 750px;
	border: #000 solid 0px;
	display: block;
	}


#col_1 {
	margin: 20px 0 0 0;
	padding: 0;
	width: 500px;
	background: transparent;
	border: #ddd solid 0;
	float: left;
	}

#mosaic {
	margin: 0 0 0 50px;
	padding: 0;
	}

#mosaic img {
	margin: 3px 3px 0 0;
	padding: 0;
	}

#col_2, #col_2b, #col_2c {
	color: #555;
	margin: 20px 0 0 0;
	padding: 0;
	width: 250px;
	background: transparent url("../ico/sep.gif") repeat-y top 4px;
	float: right;
	}
#col_2b, #col_2c {
	width: 240px;
	float: left;
	}
#col_2 img, #col_2b img {
	margin: 0 0 0 14px;
	padding: 0;
	background: transparent;
	}
#col_2 p img, #col_2b p img {
	margin: 0 0 0 0;
	padding: 0;
	background: transparent;
	}

#col_750 {
	text-align: center;
	color: #AEC4FE;
	margin: 0;
	padding: 0;
	width: 750px;
	background: transparent;
	clear: both; /* ----- good ? ----- */
	}
.border {
	margin: 0 0 0 0;
	border-top: #364370 dotted 1px;
	clear: both;
	}
#col_film {
	text-align: center;
	color: #AEC4FE;
	margin: 60px auto 0 auto;
	padding: 0;
	width: 600px;
	background: transparent;
	}
	
#col_3 {
	margin: 0;
	padding: 0 45px;
	text-align: center;
	background: transparent url("../ico/fnd_bottom.gif") no-repeat bottom;
	width: 660px;
	clear: both;
	}

#footer {
	background: transparent;
	color: #959fc0;
	font-size: 9px;
	line-height: 11px;
	text-align: center;
	width: 750px; 
	height: 60px; 
	padding: 10px 0 0 0;
	margin: 0 0 0 0;
	clear: both;
	}

#sig {
	color: #FFFFFF;
	padding: 0;
	margin: 0;
	width: 500px; 
	height: 55px; 
	position: relative;
	top: 25px; left: 0;
	background: transparent url("../ico/atlas_logo_500.gif") no-repeat center;
	}

#sig a {
	text-decoration: none;
	width: 500px; 
	height: 55px; 
	display: block;
	background: transparent;
	}
#sig a:hover {
	background: transparent url("../ico/atlas_logo_500_on.gif") no-repeat center;
	}

/* _____  typo  ________________________ */

p {
	padding: 0;
	margin: 2px 15px 6px 50px;
	}

h2 {
	font-size: 20px;
	line-height: 24px;
	font-weight: bold;
	padding: 0;
	margin: 0 15px 4px 50px;
	text-transform: uppercase;
	}
h3 {
	color: #BC6F00;
	font-size: 14px;
	line-height: 18px;
	font-weight: bold;
	padding: 0;
	margin: 0 15px 4px 50px;
	}
h3 em {
	font-size: 18px;
	line-height: 22px;
	font-family: "Times New Roman", Times, serif;
	font-weight: normal;
	}

h4 {
	font-size: 12px;
	line-height: 17px;
	font-weight: bold;
	color: #BC6F00;
	padding: 0;
	margin: 12px 15px 0 50px;
	clear: both;
	}

.bullet {
	padding: 0 0 0 15px;
	background: transparent url("../ico/bullet.gif") no-repeat 0 4px; 
	}
.arrow {
	padding: 0 0 0 15px;
	background: transparent url("../ico/link.gif") no-repeat 0 3px; 
	}

#col_2 p, #col_2b p, #col_2c p, #col_2 h2, #col_2b h2, #col_2c h2, #col_2 h3, #col_2b h3, #col_2c h3, #col_2 h4, #col_2b h4, #col_2c h4 {
	margin-left: 14px;
	padding: 0 0 0 15px;
	}
#col_2 p strong, #col_2b p strong, #col_2c p strong {
	color: #333;
	}

#col_3 h4 {
	font-size: 11px;
	line-height: 15px;
	font-weight: bold;
	color: #333;
	clear: none;
	float: left;
	width: 220px;
	margin: 0 0 0 0;
	padding: 10px 0;
	border-top: solid #909fd4 1px;
	}
#col_3 img {
	margin: 0;
	padding: 0 0 10px 0;
	}

#col_750 p, #col_film p {
	margin-left: 0;
	}

ul, ol {
	padding: 0;
	margin: 4px 0 10px 70px;
	}
ul {
	list-style-type: square;
	}
ol {
	list-style-type: lower-roman;
	}

.eco {
	font-weight: bold;
	color: #009900;
	text-transform: uppercase;
	}

.tm {
	font-weight: normal;
	color: #666;
	}

p .eco_tm {
	font-weight: normal;
	color: #666;
	}
h2 .eco_tm, h2 .tm {
	font-weight: normal;
	color: #444;
	vertical-align: super;
	font-size: 10px;
	line-height: 12px;
	}

.red {
	color: #ff0000;
	}

hr {
	border-top: #ddd solid 1px;
	border-width: 1px 0 0 0;
	color: #FFFEF7;
	background-color: #ddd;
	height: 1px;
	margin: 10px 20px 10px 40px;
	padding: 0;
	}

/* _____  links  ________________________ */

#col_1 a:link, #col_2 a:link, #col_2b a:link, #col_2c a:link, #col_1 a:visited, #col_2 a:visited, #col_2b a:visited, #col_2c a:visited {
	color: #333;
	text-decoration: none;
	border-bottom: solid #81b3ff 1px;
	padding: 0 1px 0 1px;
	} 
#col_1 a:hover, #col_2 a:hover, #col_2b a:hover, #col_2c a:hover { color: #FFFFFF; background: #364370; } 
#col_1 a:active, #col_2 a:active,  #col_2b a:active, #col_2c a:active { background: #6B6658; } 


#col_750 a:link, #col_750 a:visited, #col_film a:link, #col_film a:visited {
	color: #AEC4FE;
	text-decoration: none;
	border-bottom: solid #236EC7 1px;
	padding: 1px 4px 1px 4px;
	}
#col_750 a:hover, #col_film a:hover { color: #364370; background: #CDE1FE; border-bottom: solid #CDE1FE 1px;} 
#col_750 a:active, #col_film a:active { color: #fff; background: #364370;  border-bottom: solid #364370 1px;} 


#footer a:link, #footer a:visited {
	color: #959fc0;
	text-decoration: none;
	border-bottom: solid #4e5d8e 1px;
	}
#footer a:hover {
	color: #fff;
	border-bottom: solid #7581A9 1px;
	}

/* _____  menu  ________________________ */

#menu {
	margin: 0 0 0 0;
	padding: 0 0 0 50px;
	background: transparent;
	width: 700px;
	height: 23px;
	}

#menu a {
	display: block;
	height: 16px;
	float: left;
	margin: 4px 1px 0 0;
	padding: 1px 10px 0 10px;
	text-decoration: none;
	color: #09153c;
	text-align: center;
	background: #c8cddc url("../ico/fnd_menu.gif") repeat-x 0 0;
	border-top: #fff solid 1px;
	border-left: #fff solid 1px;
	border-right: #98a1bd solid 1px;
	border-bottom: #364370 solid 1px;
	}
#menu #eco_tab {
	font-weight: bold;
	width: 88px;
	background: #e9ebf4;
	}

#menu a:hover {
	height: 16px;
	background: #f0f2f9;
	color: #000;
	}
#menu a:active {
	background: #fff;
	color: #09153c;
	}
#menu #on a {
	font-weight: bold;
	color: #1c5f00;
	height: 18px;
	background: #fff;	
	border-bottom: #eee solid 1px;
	margin: 0 1px 0 0;
	padding: 3px 10px 0 10px;
	}
#menu #on_eco a {
	width: 88px;
	font-weight: bold;
	color: #1c5f00;
	height: 18px;
	background: #fff;	
	border-bottom: #eee solid 1px;
	margin: 0 1px 0 0;
	padding: 3px 10px 0 10px;
	}
#menu #on a:hover, #menu #on_eco a:hover {
	color: #1c5f00;
	border-bottom: #c8cddc dotted 1px;
	}

#menu #lang a {
	font-weight: bold;
	color: #B8C9E3;
	height: 16px;
	background: transparent;	
	padding: 4px 0 0 0;
	margin: 0;
	float: right;
	border-top: #fff solid 0;
	border-left: #fff solid 0;
	border-right: #fff solid 0;
	border-bottom: #364370 solid 0;
	}
#menu #lang a:hover {
	color: #fff;
	}

#menu2_wrap {
	margin: 20px 0 0 0;
	padding: 0 0 0 34px;
	background: transparent;
	width: 716px;
	height: 25px;
	}
#menu2 {
	font-size: 11px;
	line-height: 13px;
	text-align: center;
	margin: 0 0 0 0;
	padding: 0 0 0 17px;
	background: transparent url("../ico/fnd_menu2.gif") no-repeat 0 0;
	height: 17px;
	width: 670px;
	display: block;
	}
#menu2.menu2off {
	background-image:  url("../ico/fnd_menu2off.gif");
	}
#menu2 a {
	width: 108px;
	height: 14px;
	margin: 1px 0 0 0;
	padding: 1px 0 0 0;
	text-decoration: none;
	color: #fff;
	text-align: center;
	background: transparent;
	border-right: #fff solid 1px;
	display: block;
	float: left;
	}
#menu2 .fea a {
	width: 92px;
	}
#menu2 .config a {
	width: 126px;
	}
#menu2 .adv a {
	width: 95px;
	}
#menu2 .faq a {
	width: 50px;
	}
#menu2 .vid a {
	width: 60px;
	}
#menu2 a:hover {
	background: transparent url("../ico/fnd_menu2on.gif") repeat-x 0 0;
	color: #000;
	}
#menu2 a:active {
	background: #fff;
	color: #1c5f00;
	}
#menu2 .on2 a {
	font-weight: bold;
	color: #111;
	height: 14px;
	background: transparent url("../ico/fnd_menu2on.gif") repeat-x 0 0;
	margin: 1px 0 0 0;
	padding: 1px 0 0 0;
	}
#menu2 .on2 a:hover {
	color: #1c5f00;
	}

#switch_btn1, #switch_btn2 {
	font-size: 11px;
	line-height: 13px;
	color: #000;
	text-align: center;
	width: 90px;
	height: 16px;
	margin: 0 auto;
	padding: 1px 1px 0 1px;
	display: block;
	background: #aaa;
	}
#switch_btn1 a:link, #switch_btn1 a:visited, #switch_btn2 a:link, #switch_btn2 a:visited {
	width: 100%;
	height: 15px;
	margin: 0;
	padding: 0 0 0 0;
	color: #444;
	text-decoration: none;
	text-align: center;
	border-right: #fff solid 0;
	border-bottom: solid #666 0;
	display: block;
	background: transparent url("../ico/fnd_menu2on.gif") repeat-x 0 0;
	}

#switch_btn1 a:hover, #switch_btn2 a:hover {
	background: #fff;
	color: #000;
	border-right: #fff solid 0;
	border-bottom: solid #666 0;
	}