/* CSS Document */
body{
	background-color:#FFF;
	overflow:hidden;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-image:url(../images/common/bkg3.jpg);
	background-position:top;
}


p {
	margin : 0 0 1em 0;
}

img { border : none; }

form { display : block; margin : 0; padding : 0; }

h1 { font-size : 36px; margin : 0.67em 0; }

h2 { font-size : 24px; margin : 0.83em 0; }

h3 {
	font-size : 18pt;
	font-style: normal;
	margin : 0em 0;
}

h4 {
	font-size : 14px;
	font-style: normal;
	margin: 0.1em 0 0.1em 0;
	font-weight: bold;
}

h5 {
	font-size : 12px;
	font-style: normal;
	font-weight: normal;
	margin :0.1em 0 0.1em 0;
	text-align:left;
	line-height: 14px;
}

h6 {
	font-size : 9px;
	margin : 0em 0;
	font-weight: normal;
	color: #FF6600;
}

code,pre { font-family : "Courier New",monospace; font-size : 1em; }

q { font-style : italic; } 
/* fin des élements de base */
#corner_tl, #corner_tr, #corner_bl, #corner_br{
	position:absolute;
	z-index:1000;
	height:24px;
	width:24px;
	background-repeat:no-repeat;
}

#corner_tl{
	float:left;
	left:0px;
	background-image: url(../images/common/topleft.png);
}

#corner_tr{
	float:right;
	right:0px;
	background-image: url(../images/common/topright.png);
}

#corner_bl{
	float:left;
	left:0px;
	bottom:0px;
	background-image: url(../images/common/bottomleft.png);
}

#corner_br{
	float:right;
	right:0px;
	bottom:0px;
	background-image: url(../images/common/bottomright.png);
}

#global {
	position:absolute;
	left: 50%;
	top: 50%;
	width: 1000px;
	height: 650px;
	margin-left: -500px; /* moitié de la largeur */
	margin-top: -325px; /* moitié de la hauteur */
}

#mask1, #mask2, #mask3, #mask4 {
	position:absolute;
	background-image:url(../images/common/bkg50.png);
	height:100%;
	overflow:hidden;
	z-index: 1000;
}

#mask1, #mask2, #mask4 {
	float:left;
}

#mask1{
width:300%; top:-100%; left:-100%;}

#mask2{
width:100%; top:0%; left:-100%;}

#mask3{
width:100%; top:0%; right:-100%; float:right;}

#mask4{
width:300%; bottom:-100%; left:-100%;}

#titre{
	position:absolute;
	float:left;
	height:30px;
	top:-35px;
	left:20px;
	width:960px;
	z-index: 10000;
	font-family: Arial Black, Arial, Helvetica, sans-serif;
	color:#FF9900;
	font-weight:bold; 
	font-size:26px; 
	z-index:1000;
}

#titre .tm{
	font-size:1em;
}

#titre .accroche{
	font-family: Arial, Helvetica, sans-serif;
	font-weight:normal; 
	font-style:italic; 
	font-size:24px; 
	color:#ccc;
}

#titre .skin{
	float:right; 
	position: absolute; 
	right:0px;
	bottom: 0px;
}

#titre .skin img{
	margin-left:5px;
}

img {
	border:none;
}

#conteneur{
	height:700px;
	width:1000px;
	overflow:visible;
}

#contenu{
	height:100%; 
	width:100%; 
	margin:0; 
	z-index:1; 
	position: absolute;
}

#wrapper {
	float:left;
	width:1000px;
	max-width:1000px;
	margin:0px;
	height: 32px;
	min-height: 40px;
	overflow: hidden;
	top: 5px;
	position:absolute;
	} 
	
#Menu{
	float:left;
	position:relative;
	margin:0px auto 0px auto;
	width:1000px;
	padding: 0px;
	display:block;
	overflow: hidden;
	height: 40px;
	left: 20px;
	z-index: 50000;
	font-family: Arial, Helvetica, sans-serif;
	font-size:16px;
	font-style:normal;
	top:5px;
	font-weight: normal;
}

/* All LIs */
#Menu li {
	cursor:pointer;
	float:left;
	width:157px;
	text-align:left;
	list-style-type:none;
	font-weight:bold;
	text-indent: 5px;
	height:30px;
	max-height:30px;
	margin:0px;
	margin-right: 4px;
}

#Menu li a{
color:black;
text-decoration:none;
}

#Menu li a:hover{
	color:#FFCC00;
	text-decoration: underline;
	font-weight: bolder;
}

.home, .about, .services, .my, .the, .contact, .error{
 background-image:url(../images/common/signet1.png);
 background-repeat:no-repeat;
}

.home{
	background-position:10px 0px;
}

.about{
	background-position:171px 0px;
}

.services{
	background-position:332px 0px;
}

.my{
	background-position:493px 0px;
}

.the{
	background-position:654px -0px;
}

.contact{
	background-position:815px 0px;
}

.error{
	background-image:none;
}

#gen{
	float:left; 
	position:absolute;
	left:16px; 
	top:0px; 
	width:970px; 
	height:500px; 
}

#gen1{
	float:right;
	position:absolute;
	right:-12px;
	top:200px;
	z-index:0;
	visibility: visible;
	display: block;
	background-image:url(../images/common/moi2.png);
	background-repeat:no-repeat;
	height:896px;
	width:630px;
}

#gen2{
}

#gen3{
}

#moi{
	position:absolute; 
	float: left; 
	top:50px; 
	left:-50px;
	background-image:url(../images/common/worker.png);
	background-repeat:no-repeat;
	width:378px;
	height:750px;
	z-index:0;
}

#article{
	left:16px; 
	top:0px; 
	width:970px; 
	float:left;
	height:550px; 
	position:absolute;
}

#cases{
	float:left;
	position:absolute;
	top:85px;
	left:250px;
	width:720px;
	height:550px;
	max-height:550px;
	padding-left:4px;
	display: block;
	overflow:auto;
	z-index:100;
}

#page{
	position: absolute;
	float:left;
	font-size:20px;
	color:#333333;
	max-width:900px;
	text-align:right;
	left:-10px;
	top:90px;
	z-index:5000;
}

#page .style1{
	color:#666666;
	font-size: 30px;
}

#page .style1_1{
	color:#999999;
	line-height:0px;
	font-size: 30px;
}

#page .style2{
	font: bold 54px/25px "Arial Black", Arial, Helvetica, sans-serif;
}

#page .style2 a{
	color:#FF9900;
	text-decoration:none;
}

#page .style2 a:hover{
	color:#FFDD00;
	text-decoration:none;
}

#page .style3{
	color:#FF9900;
	text-decoration:none;
	font-weight:bold;
	font-size:36px;
}

#page .style3 a{
	color:#FF9900;
	text-decoration:none;
	font-weight:bold;
	font-size:36px;
}

#page .style3 a:hover{
	color:#FFDD00;
	text-decoration:none;
}

#page2{
	position: absolute;
	float:right;
	font-size:30px;
	font-family:"Arial Black", Arial, Helvetica, sans-serif;
	color:#333333;
	width:540px;
	text-align:left;
	right:30px;
	top:75px;
	z-index:5000;
}

#page2 .style1{
	font-size:20px;
	color:#000000;
}

#page2 .style2{
	font: bold 36px/25px "Arial Black", Arial, Helvetica, sans-serif;
}

#page2 .style2 a{
	color:#FF9900;
	text-decoration:none;
}

#page2 .style2 a:hover{
	color:#FFDD00;
	text-decoration:none;
}

#page2 .style3{
	color:#FF9900; 
	text-decoration:none;
	font-weight:bold;
	font-size:22px; 
}

#page2 .style3 a{
	color:#FF9900;
	text-decoration:none;
	font-weight:bold;
	font-size:22px; 
}

#page2 .style3 a:hover{
	color:#FFDD00;
	text-decoration:none;
}

#statik{
	position:relative;
	float:left;
	display:block;
	background: none;
	color:#FF9900;
	font-size:16px;
	font-style: normal;
	font-weight: bold;
	text-align: justify;
	top: 80px;
	left:20px;
	width: 200px;
	padding:15px;
	z-index: 100;
}

.newstext{
	color:#000;
	font-size:16px;
	font-style: normal;
	font-weight: normal;
	text-align: justify;
	top: -15px;
	margin-bottom:30px;
	padding:15px;
}

.newstext a{
	font-weight:bold;
	color:#FF9900;
	text-decoration:none;
}

.newstext a:hover{
	color:#FFCC00;
	text-decoration:none;
}

.newstext p{
	float:left;
	position:relative;
	margin:0px 0px 10px 20px;
	width:90%;
	padding: 0px;
}

.newstext ul{
	position:relative;
	float:left;
	display:block;
	margin:0px 0px 10px 0px;
	top:-10px;
}

.newstext ul li{
	list-style-position: outside;
	list-style-type: square;
	text-align: justify;
	float: left;
	width: 100%;
}

.newstext ul li a{
	text-decoration:none;
	color:#FF9900;
	font-weight:bold;
}

.newstextmenu{
	float:left;
	position:absolute;
	left:-10px;
	top:95px;
	font-size:16px;
	font-weight:bold;
	width:250px;
	color:#FFCC00;
	z-index:1;
	text-align: right;
	right: 30px;
	font-weight: bold;
}

.newstextmenu ul{
	position:relative;
	float:right;
	top:-18px;
	right:0px;
}

.newstextmenu ul li{
	text-align:right;
	list-style-type:none;
	position:relative;
	z-index: 5000;
	height: 20px;
	width: 100%;
}

.newstextmenu ul li a{
	color:#FF9900;
	text-decoration:none;
	font-weight: normal;
	height: 20px;
}

.newstextmenu ul li a:hover{
	color:#FFCC00;
	font-weight: bold;
	height: 20px;
}

.newstext .para{
	width:670px;
}

.newstext .title{
	background-image:url(../images/common/bkg_w50.png);
	font-size : 14px;
	font-style: normal;
	top:0px;
	font-weight: bold;
	float:left;
	position:relative;
	width: 306px;
	display: block;
	z-index: 100;
	padding: 1px 5px;
}

.newstext .newsimg{
	float:left;
	position:absolute;
	top:17px;
	width:308px;
	height:308px;
	margin-right:0px;
	background-color:#FFFFFF;
	z-index: 10;
}

.newstext .texte{
	display:block;
	float:left;
	position:absolute;
	bottom:0px;
	background-image:url(../images/common/bkg_w75.png);
	color:#000000;
	font-size : 12px;
	font-style: normal;
	font-weight: normal;
	text-align:justify;
	padding:1px 5px;
	width:auto;
	height:auto;
	z-index: 100;
	display: block;
}

.newstext .plus{
	position:absolute;
	float:right;
	right:0px;
	background-color:#ffcc00;
	padding:2px;
	display:block;
	height:auto;
	width:12px;
	display:block;
	bottom: 0px;
	height: 12px;
	z-index: 10000;
	margin-left: 4px;
	padding-top: 2px;
}

.pimg2{
	background-image:none;
	float:left;
	position:relative;
	height:212px;
	width:242px;
	margin: 0px 60px 20px 0px;
	overflow: hidden;
	background-color: #FFFFFF;
	color: #FFFFFF;
}

.para{
	float:left;
	position:relative;
	height:212px;
	width:595px;
	margin: 0px 0px 10px 50px;
	background-image:none;
	overflow:hidden;
	background-image:none;
	text-align:justify;
}

.para .blah{
	color: #000;
	padding-right:5px;
}

.para a{
	text-decoration:none;
	font-weight:bold;
	color:#FF9900;
}

.para img{
	float:left;
	position:relative;
	height:212px;
	width:242px;
	background-image:none;
	overflow:hidden;
	background-image:none;	
	background-color: #FFF;
	color: #FFF;
	margin-right:5px;
}

.txtarea1{
	position:relative;
	float:left;
	top: -15px;
	margin-left:10px;
}

.txtarea{
	position:relative;
	float:left;
	top: -15px;
	height:300px;
	max-height:300px; 
	width:650px; 
	max-width:650px; 
	margin-left:10px;
}

.section{
	float:left;
	position:relative;
	width:655px; 
	height:25px; 
	background-image:url(../images/common/bkg_w75.png); 
	color:#FF9900; 
	font-weight:bold; 
	font-size:16px; 
	margin-bottom:20px; 
	padding-left:15px;
	line-height:28px;
	border:#CCCCCC thin solid;
}

.disp{
	display:block; 
	height:auto; 
	float:left; 
	position:relative; 
	margin-bottom:20px;
}

#error404{
	left:16px; 
	top:0px; 
	width:1300px; 
	height:600px; 
	float:left; 
	position:absolute;
	overflow:visible;
}

#error404 .txt{
	position:absolute;
	float:left;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	color:#FF6600;
	width:550px;
	left:-250px;
	top:0px;
	z-index:5000;
}

#error404 .txt .base{
	font-weight:bolder; 
	font-size:60px; 
	line-height:60px;
}

#error404 .txt .base2{
	color:#000; 
	font-weight:bolder; 
	font-size:60px; 
	line-height:60px;
}

#error404 .txt .base3{
	font-family:Arial, Helvetica, sans-serif;
	font-size:17px; 
	font-weight:normal; 
	line-height:18px; 
	top:-20px;
}

#errorstar{
	float:right; 
	position:absolute;
	display:block;
	right:-50px; 
	top:-50px;
	background-image:url(../images/common/star.png);
	background-repeat:no-repeat;
	height:587px;
	width:600px;
}

#errorcaisse{
	float:right; 
	z-index:100; 
	position:absolute; 
	width:689px; 
	right:0px; 
	top:50px;
	z-index:10;
}

#errorsearch{
	width:298px; 
	position:absolute; 
	float:left;  
	padding: 0px; 
	font-family: Arial, Helvetica, sans-serif;
}

#errtext, #errsubmit{
	font-family: Arial, Helvetica, sans-serif;
}

#footer{
	float:left;
	position:absolute;
	top: 655px;
	left:0px;
	color:#CCC;
	z-index:20000;
	width:1000px;
	height:20px;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}

#footer .vers{
	float:left;
	position: absolute;
	left:650px;
}

#footer .cop{
	float:right;
	right:0px;
}

#footer .w3c{
	float:left;
	position: absolute;
}

#footer .css{
	float:left;
	position: absolute;
	left:90px;
}

#footer .w3c a, #footer .css a{
	color:#FFFFFF;
	text-decoration:none;
}

#footer .w3c a:hover, #footer .css a:hover{
	color:#FFCC00;
	font-weight:bold;
}

/**************************************************************
	MultiBox
	v1.3
**************************************************************/
.MultiBoxContainer {
	position: absolute;
	border: 20px solid #666666 ;
	background-color: #FFF;
	display: none;
	z-index: 2000000;
	text-align: left;
	/*overflow: hidden;*/
}

.MultiBoxLoading {
	background: url(../images/multibox/loader.gif) no-repeat center;
}

.MultiBoxContent {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.MultiBoxClose {
	position: absolute;
	top: -26px;
	right: -26px;
	background: url(../images/multibox/close.png) no-repeat;
	width: 24px;
	height: 24px;
	cursor: pointer;
}


.MultiBoxControlsContainer {
	overflow: hidden;
	height: 0px;
	position: relative;
}

.MultiBoxControls {
	width: 100%;
	height: auto;
	position: relative;
	background-color: #666666;
}


.MultiBoxPrevious {
	position: absolute;
	background: url(../images/multibox/left.png) no-repeat;
	width: 24px;
	height: 24px;
	left: 0px;
	margin-top: 5px;
	cursor: pointer;
}

.MultiBoxNext {
	position: absolute;
	background: url(../images/multibox/right.png) no-repeat;
	width: 24px;
	height: 24px;
	right: 0px;
	margin-top: 5px;
	cursor: pointer;
	display:block;
	z-index:1;
}

.MultiBoxNextDisabled {
	cursor: default;
	background: url(../images/multibox/rightDisabled.png) no-repeat;
}

.MultiBoxPreviousDisabled {
	cursor: default;
	background: url(../images/multibox/leftDisabled.png) no-repeat;
}

.MultiBoxTitle {
	position: relative;
	margin: 10px 0 0 35px;
	float: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFF;
	font-weight: bold;
	text-align: left;
}

.MultiBoxNumber {
	position: relative;
	width: 50px;
	margin: 10px 35px 0 0;
	float: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFF;
	text-align: right;
}

.MultiBoxDescription {
	clear: left;
	position: relative;
	margin: 0 35px 0 35px;
	padding-top: 5px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFF;
	text-align: justify;
}

.MultiBoxDescription a{
	color:#FFCC00;
	font-weight:bold;
}


/* Scroll Bar Master Styling Starts Here */
/* All comments can be freely removed from the css */


#scroll{
	position: relative;
	left:230px;
	top:88px;
	width:720px;
	max-width:720px;
	height: 520px;
	max-height: 520px;
	overflow:auto;
	z-index:100;
	color:#333333;
	font-size:16px;
	font-style: normal;
	font-weight: normal;
	text-align: justify;
	padding:0px 15px 15px 15px;
	display: block;
}

#lipsum{
	height:auto;
	font-size: 11px;
	font-style: normal;
	text-align: justify;
	display: block;
	margin:0px;
	width:680px;
	position:relative;
}

.bkg{
	background-image:url(../images/common/bkg_w75.png);
}

#lipsum .new{
	overflow:hidden;
	width:680px;
	max-height:100%;
	min-height:0px;
	display: block;
	z-index:10000;
}

#scroll .section{
	position:relative;
	width:655px; 
	height:25px; 
	background-image:url(../images/common/bkg_w75.png); 
	color:#FF9900; 
	font-weight:bold; 
	font-size:16px; 
	margin-bottom:20px; 
	padding-left:15px;
	line-height:28px;
	border:#CCCCCC thin solid;


}

#scroll .pimg{
	position:inherit;
	float:left;
	width:160px;
	max-width:160px;
	height:160px;
	margin-right: 10px;
	margin-bottom: 10px;
	font-size:0px;
	color:#FFFFFF;

	/*	
	overflow:hidden;
	background-color: #990000;
	color: #990000;
	border: 0px;
	padding: 0px;
	top:0px;
	display: block;
	position: relative;
	float: left;
	margin-top: 0px;
	margin-left: 0px;
	*/
}

#scroll .pimg img{
	height:160px;
	max-height:160px;
	width:160px;
	max-width:160px;
	overflow:hidden;
	z-index:100000;
}

#scroll .para{
	position: relative;
	float:left;
	left:-50px;
	width:660px;
	max-width:660px;
	min-width:242px;
	height:212px;
	margin-bottom: 10px;
	color:#FFFFFF;
}

#scroll .para img{
	height:212px;
	width:242px;
	background-color: #fff;
	color: #fff;
	overflow:hidden;
}

#scroll .para .blah{
	position: relative;
	color: #333333;
	top:0px;
	left:0px;
	padding-right:5px;
	min-height:212px;
	width:400px;
	font-size:14px;
}

#scroll .para .blah a{
	text-decoration:none;
	font-weight:bold;
	color:#FF9900;
}

#scroll a{
	font-weight:bold;
	color:#FF9900;
	text-decoration:none;
}

#scroll a:hover{
	color:#FFCC00;
	text-decoration:none;
}

#scroll p{
	float:left;
	position:relative;
	margin:0px 0px 10px 20px;
	text-align: justify;
	width:650px;
	padding: 0px;
	display: block;
	font-size:16px;
}

#scroll ul{
	font-size:14px;
	font-style:italic;
	position:relative;
	left:10px;
	margin:0px 0px 10px 0px;
	top:-10px;
}

#scroll ul li{
	left:0px;
	list-style-type: square;
	width: 600px;
	list-style-position: inside;
}

#scroll ul li a{
	font-style:normal;
	text-decoration:none;
	color:#FF9900;
	font-weight:bold;
}



/*  scrollgeneric is used for corrective styling of elements, and should not be modified or removed */ 
.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}

.vscrollerbar {
width: 20px;
background: #FFF url(../images/common/scroll1.png) -20px 0px repeat-y;
/* do not forget to put colors for backgrounds for before image(s) can load , this is more important for
the scrollV itself than the scrollbase, as user can live without an image on the base but cannot see
any scrollV when images cannot load. */
}

.vscrollerbarbeg {
/* height of this element is normally auto set to fit the scrollbase, to cover the base... */
height: 12px !important;
/* ...unless we force the size using an !important decleration */
/* forcing would not be required if Webkit-Safari did not have a background-repeat bug*/
/* this may be fixed by the time Safari 3.0 is released. */
width: 20px;
background: url(../images/common/scroll1.png) -60px -8px no-repeat;
}

.vscrollerbarend {
/* height of this element should be set */
height: 12px;
width: 20px;
background: url(../images/common/scroll1.png) -60px -20px no-repeat;
}

.vscrollerbase {
width: 20px;
background: #fff url(../images/common/scroll1.png) 0px 0px repeat-y;
}
.vscrollerbasebeg {
/* height of this element is auto set to fit the scrollbase, to cover the base */
/* this element can be used to place a faux top arrow image */
width: 20px;
height: 20px !important; /*Again, the safari fix, normally this line is not needed.*/
background: url(../images/common/scroll1.png) -40px -20px no-repeat;
}
.vscrollerbaseend {
/* height of this element should be set */
/* this element can be used to place a faux bottom arrow image */
height: 20px;
width: 20px;
background: url(../images/common/scroll1.png)  -40px 0px no-repeat;
}

/* do not forget to give horizontal scrollVs some color properties even if you don't plan on using them */
.hscrollerbase {
height: 20px; background-color: white;
}
.hscrollerbar {
height: 20px; background-color: white;
}

.vscrollerbar, .hscrollerbar {
/* paddings of these elements will decide how far the scrollV will stop in both ends, and are not actually
used for styling, and are set to 0 by the script, here we will set them the size of our faux arrows */
padding: 20px;
z-index: 2;
}

/* Scroll Bar Master Styling Ends Here */