@import url(./wet.reset.css);

#www2 { background: red; height: 5px; }

body {
	margin: 0;
	padding: 0;
	font: normal 76% Calibri, Arial, Helvetica, Tahoma, Arial, sans-serif;
	background: #fff;
	/* color: #bebebd; */
	/* color: #959595; */
	color: #797979;
	background: #303122;
}
img {
	border: 0;
}

.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }

.breaker {
	display: block;
	clear: both;
	overflow: hidden;
	height: 0;
	font-size: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
}
.hidden {
	display: none;
	visibility: hidden;
}
#messagebox {
	margin: 10px 0;
	padding: 10px;
	font-size: 14px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	font-weight: bold;
	color: #000;
	visibility: hidden;
	display: none;
	border: 1px solid #9c0;
}


.wrapper {
	width: 935px;
	padding: 0 15px;
	margin: 0 auto;
	position: relative;
}

/* **** HEADER **** */
#header {
	height: 72px;
	background: #303122;
	border: 1px solid #3b3c2e;
	border-right: 0;
	border-left: 0;
	overflow: hidden;
	position: relative;
}
	#header #upline {
		position: absolute;
		width: 935px;
		bottom: 0;
		text-align: left;
		font-size: 11px;
	}
	#upline a {
		color: #9ab310;
		text-decoration: none;
	}
	#logo {
		float: left;
		width: 40%;
		padding-top: 18px;
		height: 54px;
	}
		#logo h1 {
			text-indent: -9999px;
		}
	#navigation {
		float: left;
		width: 60%;
		height: 72px;
		font: normal 10px Arial, sans-serif;
		color: #5b5e4a;
		text-transform: uppercase;
	}
		#navigation ul {
			float: right;
			padding-top: 27px;
			padding-right: 30px;
		}
		#navigation ul li {
			display: inline;
			height: 18px;
			line-height: 18px;
			color: #5b5e4a;
		}
		#navigation ul li a {
			display: block;
			float: left;
			color: #5b5e4a;
			padding: 0 10px;
			margin-left: 2px;
			text-decoration: none;
		}
		#navigation ul li a:hover,
		#navigation ul li a.current {
			color: #fff;
			border: 1px solid #41432f;
			background: #3b3c2a;
		}
/**/
		

/* **** ANNOUNCE **** */
#announcehome {
	width: 100%;
	height: 261px;
	padding-bottom: 1px;
	padding: 0;
	overflow: hidden;
	background: white url(../images/bg_home.jpg) -20em center repeat-x;
}
#announcehome .wrapper div.announcement {
	width: 916px;
	height: 228px;
	text-indent: -9999px;
	padding: 0;
	overflow: hidden;
	background-image: url(../images/announce_home.png) !important; 
	background-image: url(no-image);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='../images/announce_home.png');
	margin-top: 30px;
}
#announce {
	width: 100%;
	height: 94px;
	padding-bottom: 1px;
	padding: 0;
	overflow: hidden;
	background: transparent url(../images/bg_announce.jpg) 4em center repeat-x;
}
#announce .wrapper div.announcement {
	width: 482px;
	height: 94px;
	text-indent: -9999px;
	padding: 0;
	background-image: url(../images/announce_ethique.png) !important; 
	background-image: url(no-image);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='../images/announce_ethique.png');
	overflow: hidden;
}
#announce .wrapper div.announcementWebetic {
	width: 521px;
	height: 94px;
	text-indent: -9999px;
	padding: 0;
	background-image: url(../images/announce_webetic.png) !important; 
	background-image: url(no-image);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='../images/announce_webetic.png');
	overflow: hidden;
}
#announce .wrapper div.announcementServices {
	width: 490px;
	height: 94px;
	text-indent: -9999px;
	padding: 0;
	background-image: url(../images/announce_services.png) !important; 
	background-image: url(no-image);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='../images/announce_services.png');
	overflow: hidden;
}
#announce .wrapper div.announcementReferences {
	width: 360px;
	height: 94px;
	text-indent: -9999px;
	padding: 0;
	background-image: url(../images/announce_references.png) !important; 
	background-image: url(no-image);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='../images/announce_references.png');
	overflow: hidden;
}
#announce h2 {
	margin: 0;
	padding: 0;
}
/**/



/* **** GENERAL **** */
#general {
	padding-bottom: 40px;
	min-height: 100px;
	background: white url(../images/bg_general.gif) 0 0 repeat-x;
}
	#quality {
		width: 71px;
		height: 72px;
		position: absolute;
		right: 0;
		top: 0;
		background-image: url(../images/certifie_qualite.png) !important; 
		background-image: url(no-image);
		filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='../images/certifie_qualite.png');
		background-repeat: no-repeat;
	}
	#general .wrapper {
		padding-top: 10px;
	}
	.wetText {
		float: left;
		width: 67%;
		padding: 0 3%;
		padding-right: 0;
		padding-bottom: 30px;
		text-align: justify;
	}
		.wetText h3 {
			font: bold italic 18px Calibri, Arial, sans-serif;
			height: 18px;
			line-height: 18px;
			color: #373928;
			margin: 20px 0;
		}
		.wetText h3 a {
			color: #373928;
		}
		.wetText h3 em {
			padding-left: 20px;
			font: normal 10px Calibri, Arial, sans-serif;
			/***font: normal 10px Calibri, Arial, sans-serif;*/
			text-transform: uppercase;
			height: 18px;
			line-height: 18px;
			background: white url(../images/puce_text.gif) 10px 0 no-repeat;
			/***color: #a8cc19; */
			color: #bebebd;
		}
		.wetText a {
			color: #9ab310;
		}
		.wetText p {
			text-indent: 36px;
		}
		.wetText p strong {
			color: #444;
		}
		.quicklinks {
			width: auto;
			overflow: hidden;
		}
		.quicklinks ul {
			width: 250px;
			border-top: 1px solid #e7e7e7;
		}
			.quicklinks ul li {
				width: 250px;
				height: 45px;
				border-bottom: 1px solid #e7e7e7;
				color: #a2a2a2;
				overflow: hidden;
			}
			.quicklinks ul li a {
				/***font-size: 14px;*/
				width: 215px;
				display: block;
				text-decoration: none;
				/* color: #a2a2a2; */
				color: #797979;
				height: 29px;
				padding: 8px;
				padding-left: 25px;
				background: white url(../images/puce_left_list_green.gif) 6px center no-repeat;
				overflow: hidden;
			}
			.quicklinks ul li a:hover {
				background: #eee url(../images/puce_left_list_grey.gif) 6px center no-repeat;
			}
			.quicklinks ul li a strong {
				white-space: nowrap;
				font-size: 10px;
				/***font-size: 10px;*/
				color: #cecece;
				text-transform: uppercase;
			}
			.quicklinks .current {
				background-color: #fdfff3;
			}
			
	.wetServices {
		border: 1px solid #dfdfdf;
		padding: 10px;
		display: block;
		color: #aaaaaa;
		margin-bottom: 18px;
	}
		.servicesIdentite {
			padding-left: 145px;
			background: white url(../images/services_identite.gif) 10px center no-repeat;
		}	
		.servicesCommerce {
			padding-left: 145px;
			background: white url(../images/services_commerce.gif) 10px center no-repeat;
		}	
		.servicesExtranet {
			padding-left: 145px;
			background: white url(../images/services_extranet.gif) 10px center no-repeat;
		}	
		.servicesMaintenance {
			padding-left: 145px;
			background: white url(../images/services_maintenance.gif) 10px center no-repeat;
		}	
		
		.wetServices h4 {
			/* font: bold italic 18px Calibri, Arial, sans-serif; */
			font: bold italic 17px Calibri, Arial, sans-serif;
			height: 18px;
			line-height: 18px;
			/* color: #373928; */
			color: #9ab310;
			margin-bottom: 18px;
		}
		.wetServices h4 a {
			/* color: #373928; */
			color: #9ab310;
		}
		.wetServices h4 em {
			font: normal 10px Calibri, Arial, sans-serif;
			text-transform: uppercase;
			height: 10px;
			line-height: 10px;
			color: #bebebd;
		}
		.wetServices p {
			text-indent: 0;
			/* color: #959595; */
			color: #797979;
		}
		.quickservices {
				width: auto;
			}
			.quickservices ul {
				width: 250px;
				/* border-top: 1px solid #e7e7e7; */
				border: 0;
			}
				.quickservices ul li {
					width: 250px;
					/* height: 45px; */
					height: 65px;
					/* border-bottom: 1px solid #e7e7e7; */
					border: 1px solid #e7e7e7;
					color: #a2a2a2;
					overflow: hidden;
					margin-bottom: 18px;
				}
				/*
				.quickservices ul li a {
					/***font-size: 14px;* /
					width: 175px;
					display: block;
					text-decoration: none;
					/* color: #a2a2a2;  * /
					color: #444;
					/* height: 29px; * /
					height: 49px;
					/* padding: 8px; * /
					padding: 18px;
					padding-left: 65px;
					overflow: hidden;
				}*/
				.quickservices ul li a {
					text-decoration: none;
					width: 175px;
					display: block;
					padding: 18px;
					padding-left: 65px;
					font: bold italic 15px Calibri, Arial, sans-serif;
				}
				.quickservices ul li h4 {
					/***font-size: 14px;*/
					width: 258px;
					display: block;
					text-decoration: none;
					/* color: #a2a2a2; */
					color: #444;
					/* height: 29px; */
					height: 85px;
					/* padding: 8px; */
					overflow: hidden;
				}
				.quickservices ul li a:hover {
				}
				.quickservices ul li a strong {
					white-space: nowrap;
					font-size: 10px;
					/***font-size: 10px;*/
					/* color: #cecece; */
					color: #959595;
					text-transform: uppercase;
				}
				.quickservices ul li a.referencement { background: #fff url(/images/services_referencement.gif) 6% 18px no-repeat; padding-left: 65px; }
				.quickservices ul li a.graphisme { background: #fff url(/images/services_graphisme.gif) 6% 18px no-repeat; padding-left: 65px; }
				.quickservices ul li a.identite { background: #fff url(/images/services_identite_s.gif) 5% 20px no-repeat; padding-left: 65px; }
				.quickservices ul li a.flash { background: #fff url(/images/services_flash.gif) 7% 18px no-repeat; padding-left: 65px; }
				.quickservices ul li a.video { background: #fff url(/images/services_video.gif) 7% 18px no-repeat; padding-left: 65px; }
				.quickservices ul li a.securite { background: #fff url(/images/services_securite.gif) 6% 18px no-repeat; padding-left: 65px; }
		#refContainer {
		width: 624px;
		height: auto;
		overflow: hidden;
		position: relative;
		padding: 0px;
		margin: 0px;
	}
	#references {
		width: 624px;
		overflow: none;
		padding: 0px;
		margin: 0px;
		position: relative;
		top: 0px;
		left: 0px;
	}
	.wetReferences {
		display: block;
		overflow: hidden;
		float: left;
		width: 194px;
		height: 150px;
		margin: 0px 5px 30px 5px;
		color: #888;
	}
		.wetReferences a {
			display: block;
			width: 192px;
			height: 80px;
			border: 1px solid #f0f0f0;
			overflow: hidden;
		}
			.wetReferences a:hover {
				border: 1px solid #9c0;
			}
		.wetReferences div.wref {
			display: block;
			width: 194px;
			height: 70px;
			overflow: hidden;
			margin: 0px;
			margin-top: 3px;
			padding: 0px;
		}
		.wetReferences div.wref .tc {
			height: 35px;
			overflow: hidden;
			background: #fff url(/images/references/bg_ref.gif) 0 0 repeat-x;
			border-bottom: 1px solid #cccccc;
			margin: 0px;
			padding: 6px;
			text-indent: 0px;
		}
		p.webrefsite {
			float: right;
			margin: 0px;
			margin-top: 3px;
			text-indent: 20px;
			padding: 0px;
		}
		.webrefonline {
			background: #fff url(/images/bullet/bullet_online.gif) 0 0 no-repeat;
		}
		.webrefoffline {
			background: #fff url(/images/bullet/bullet_offline.gif) 0 0 no-repeat;
		}
		
	.wetContact {
		border: 1px solid #dfdfdf;
		padding: 10px;
		display: block;
		color: #aaaaaa;
	}
		.wetContact h4 {
			font: normal 12px Calibri, Arial, sans-serif;
			height: 12px;
			line-height: 12px;
			color: #858585;
			margin-bottom: 10px;
			text-transform: uppercase;
		}
		.wetContact p {
			text-indent: 0;
			font: normal 11px Calibri, Arial, sans-serif;
			color: #b5b5b5;
		}
		
		
	.wetForm {
		display: block;
		color: #aaaaaa;
	}
		.wetForm h4,
		.wetForm label {
			font: normal 12px Calibri, Arial, sans-serif;
			height: 12px;
			line-height: 12px;
			color: #858585;
			margin-bottom: 10px;
			text-transform: uppercase;
		}
		.wetForm .textfield {
			width: 96%;
			font: normal 18px Calibri, Arial, sans-serif;
			padding: 4px;
			height: 20px;
			border: 1px solid #dfdfdf;
			color: #797979;
			background: #fff;
		}
		.wetForm .textselect {
			width: 40%;
			font: normal 18px Calibri, Arial, sans-serif;
			padding: 4px;
			border: 1px solid #dfdfdf;
			color: #797979;
			background: #fff;
		}
		.wetForm .textselect option {
			overflow: hidden;
		}
		.wetForm .textarea {
			font: normal 18px Calibri, Arial, sans-serif;
			width: 96%;
			padding: 4px;
			height: 150px;
			border: 1px solid #dfdfdf;
			color: #797979;
			background: #fff;
		}
		.wetForm p {
			text-indent: 0;
			margin-bottom: 18px;
		}
		
		.wetForm ul {
			margin: 15px 0;
			margin-left: 120px;
		}
		.wetForm ul li {
			float: left;
			width: 198px;
			height: 32px;
			overflow: hidden;
			margin-left: 4px;
			margin-bottom: 4px;
		}
		.wetForm ul li.special {
			width: 132px;
			margin-left: 2px;
		}
		.wetForm .send,
		.wetForm .prev,
		.wetForm .next {
			width: 123px;
			height: 26px;
			border: 0;
			padding: 0;
			margin: 0;
			text-indent: -9999px;
			cursor: pointer;
		}
		.wetForm .next {
			background: white url(/images/button_next.gif) 0 0 no-repeat;
		}
		.wetForm .prev {
			background: white url(/images/button_previous.gif) 0 0 no-repeat;
		}
		.wetForm .send {
			background: white url(/images/button_contact.gif) 0 0 no-repeat;
		}
/**/



/* **** FOOTER **** */
#footer {
	font: normal 9px Arial, sans-serif;
	background: #e4e4e4;
	color: #838383;
	height: 68px;
	background: white url(../images/bg_footer.gif) 0 0 repeat-x;
	text-align: center;
}
	#company {
		float: left;
		width: 40%;
		height: 48px;
		padding-top: 20px;
		color: #b6b6b6;
		text-align: left;
	}
		#company em {
			font: normal 12px Calibri, Arial, sans-serif;
			color: #838383;
		}
	#menu {
		float: left;
		width: 60%;
		text-transform: uppercase;
	}
		#menu ul {
			float: right;
			height: 68px;
			overflow: hidden;
		}
		#menu ul li {
			display: inline;
			font-size: 10px;
			height: 68px;
			line-height: 68px;
			color: #838383;
			background: transparent url(../images/puce_footer.gif) right center no-repeat;
		}
		#menu ul li a {
			text-decoration: none;
			color: #838383;
			padding: 0 10px;
			padding-right: 14px;
		}
/**/

#companyaddress {
	font: normal 9px Arial, sans-serif;
	/* background: #303122; */
	border: 1px solid #3b3c2e;
	border-right: 0;
	border-left: 0;
	border-bottom: 0;
	text-align: center;
	color: #5b5e4a;
	margin-bottom: 0;
	padding-bottom: 0;
}
	#companyaddress a {
		color: #9ab310;
	}
	#companyaddress .wetText {
		margin-bottom: 0;
		margin-bottom: 8px;
		padding-bottom: 0;
	}
	#companyaddress .wetText h3 {
		color: #fff;
		margin-bottom: 6px;
		margin-top: 6px;
	}
	#companyaddress .wetText h3 em {
		background: transparent url(../images/puce_text.gif) 10px 0 no-repeat;
	}
	#companyaddress .wetText ul {
		color: #5b5e4a;
	}
	#companyaddress .wetText ul li a {
		color: #5b5e4a;
		text-decoration: none;
		border-bottom: 1px dotted #fff;
	}
	#companyaddress .wetText ul li a {
		color: #5b5e4a;
		border-bottom: 1px dotted #5b5e4a;
	}
div#tutorial {
	width:auto;
	margin:auto;
	overflow:hidden;
	padding-bottom:4px;
}

div#tutorial div.step {
	overflow:hidden;
}

div#tutorial div.step div {
	margin:auto;
}

.demo label{display:block;padding:0.5em;padding-left:32px;background-position:8px center;background-repeat:no-repeat;border:1px solid #252525;clear:both;cursor:pointer}

div#tutorial span.floater {
	display: block;
	height: 22px;
	overflow: hidden;
}
.checked{cursor: pointer; font-size: 14px; padding: 4px; padding-left: 24px; height: 22px; line-height: 22px; color: #9ab310; border: 1px solid #c9e04a; background-color:#222;background: #fdfff3 url(/images/arrow_active.gif) 4px 8px no-repeat;}
.unchecked{cursor: pointer; padding: 4px; padding-left: 24px; height: 22px; line-height: 22px; background-color:#1c1c1c;background: #fff url(/images/arrow_inactive.gif) 4px 8px no-repeat;}
.selected{cursor: pointer; font-size: 14px; padding: 4px; padding-left: 20px; height: 22px; line-height: 22px; color: #9ab310; border: 1px solid #c9e04a; background: #fdfff3 url(/images/bullet_green.gif) 4px 8px no-repeat;}
.unselected{cursor: pointer; padding: 4px; padding-left: 20px; height: 22px; line-height: 22px; background: #fff url(/images/bullet_gray.gif) 4px 8px no-repeat;}

.leftcol{float:left;clear:left;width:50%}
.rightcol{float:left;clear:right;width:50%}