@charset "utf-8";
/* CSS Document */


/*
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	opacity: .5;

*/

body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #294d5f;
	background-color: #737f87;
	background-image: url(../images/bkg_body.jpg);
	background-repeat: repeat-x;
	background-position: center top;
	font-size: 100%
}
.oneColFixCtrHdr #container {
	width: 840px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #737f87;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	border: 0px solid #000000;
	text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColFixCtrHdr #header {
	height: 145px;	
	text-align:center;
	background-image:url(../images/logo.jpg);
}
.oneColFixCtrHdr #mainContent {
	padding: 0 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background: #737f87;
}
.oneColFixCtrHdr #footer {
	font-size: 70%;
	color:#FFFFFF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	text-align:center;	
}
.oneColFixCtrHdr #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}


/* the usual stuff ----------------------------------------------------------------------------------------*/
* {
	margin:0px;
	padding:0px;
}
p,li  {
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
	font-size: 90%;
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
}
.fltclr { 
	clear:both;
    height:0;
    font-size: 10px;
    line-height: 0px;
}
#twocols #col1 {
	float:left;
	padding: 0 20px 0 0;
	width: 275px;
}
#twocols #col1.border {
	border-right-width: 1px;
	border-right-style: dotted;
	border-right-color: #EBEBEB;
	width: 274px;
}
#twocols #col2 {
	float:left;
	padding: 0 0 0 20px;
	width: 275px;
}
#twocols #col2.border {
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #EBEBEB;
	width: 274px;
}
#threecols #col1 {
	float:left;
	padding: 0 20px 0 0;
	width: 170px;
}
#threecols #col1.border {
	border-right-width: 1px;
	border-right-style: dotted;
	border-right-color: #EBEBEB;
	width: 169px;
}
#threecols #col2 {
	float:left;
	padding: 0 20px 0 20px;
	width: 170px;
}
#threecols #col2.border {
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #EBEBEB;
	width: 169px;
}
#threecols #col3 {
	float:left;
	padding: 0 0 0 20px;
	width: 170px;
}
#threecols #col3.border {
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #EBEBEB;
	width: 169px;
}
#threecols #col23 {
	float:left;
	padding: 0 0px 0 20px;
	width: 380px;
}
#threecols #col23.border {
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #EBEBEB;
	width: 379px;	
}
h1, h2, h3 {
	padding: 10px 0px;
	margin: 0px;
	font-family:"Trebuchet MS", "Times New Roman", serif;
}
h4 {
	padding: 5px 0px;
	margin: 0px;
	font-family:"Trebuchet MS", "Times New Roman", serif;
}
h1 {font-size: 200%;}
h2 {font-size: 150%;}
h3 {font-size: 120%;}
h4 {font-size: 110%;}
a, a:visited, a:active, .orange {text-decoration:none;color:#d96723}
a.underline  { text-decoration:underline}
a:hover {text-decoration:underline;}
div { /* par defaut toutes les images de background sont comme ca */
	background-repeat: no-repeat;
	background-position: left top;	
}
em {
	color: #993366;
	font-weight: bold;
}
a img {
	border: 0px;
}
ul, li {
margin: 0px;
padding: 0px;
}
#col2 ul {
	margin: 0 0 0 20px;
}
span.small {
font-size:80%;
}
#mainContainer {
	background-color: #737f87;
	background-image: url(../images/bkg_main.jpg);
	height: 605px;
	width: 660px;
}
#menuItem ul {
	margin: 0px 0px 0px 0px;
	list-style-type: none;
}
#menuItem li {
	width:180px;
	height:115px;
	background-repeat: no-repeat;
	background-position: left top;
	/*position:relative;*/

}
#menu_sp_t {
	background-image: url(../images/menu_sp_t.jpg);
	width:180px;
	height:20px;
}
#menu_sp_b {
	background-image: url(../images/menu_sp_b.jpg);
	width:180px;
	height:10px;
}
#sheet {
	background-image: url(../images/bkg_sheet.png);
	height: 605px;
	width: 600px;
	margin: 0px 0px 0px 1px;
	background-repeat: no-repeat;
	background-position: right top;
}
#sheet.p_0 {width: 360px;}
#sheet.p_1 {width: 660px;}
#sheet.p_2 {width: 660px;}
#sheet.p_3 {width: 660px;}
#sheet.p_4 {width: 350px;}

#sheet_bkg.p_0 {	background-image: url(../images/bkg_sheet_hdr_0.jpg);}
#sheet_bkg.p_1 {	background-image: url(../images/bkg_sheet_hdr_1.jpg);}
#sheet_bkg.p_2 {	background-image: url(../images/bkg_sheet_hdr_2.jpg);}
#sheet_bkg.p_3 {	background-image: url(../images/bkg_sheet_hdr_3.jpg);}
#sheet_bkg.p_4 {	background-image: url(../images/bkg_sheet_hdr_4.jpg);}

div.page {
	padding: 130px 50px 0px 20px;
	font-size:80%;
/*	text-align: justify;*/
}
#msg {
	margin-top: 50px;
	border: 1px dotted #CCCCCC;
	padding: 10px;
}
#msg.ok {
	border-color:#00CC33;
	color:#009900;
}
#msg.nok {
	border-color:#FF3333;
	color:#CC0000;

}
#msg img {
	margin: 0px 10px 0px 0px;
}
table.form,table.form2 {
	font-size:80%;
}
/* accordion styles */
.toggler {
	color: #737f87;
	margin: 0;
	padding: 5px 5px;
	border-bottom: 1px solid #737f87;
	font-size: 100%;
	font-weight: normal;
	font-family: "Trebuchet MS", "Times New Roman", serif;
	background-image: url(../images/icon_arrow_l_n.png);
	background-repeat: no-repeat;
	background-position: right center;
}
.toggler:hover {
	cursor:pointer;
 	background-color: #E3E7E8;
}
.element {
}
.element p {
	margin: 0;
	padding: 4px;
}
#idSiteMenuList {
	margin: 0px;
	padding:0px;
}
#idSiteMenuList li {
	margin: 0px;
	padding: 0px;
	color: #000;
	list-style-image: none;
	list-style-type: none;
}
.svccnt {
	background-color:#FFFFFF;
	width: 410px;
	height: 330px;
	margin:3px;
	font-size: 95%;
	

/*	filter: opacity(80);
	border: 1px dotted #CCCCCC;
	margin: 10px 0px 0px 0px;
	padding: 5px; */
}
.abs {
	position: absolute;
}
.rel {
	position:relative;
}
#service_content {
	width: 420px;
	height: 330px;
}
#service_content.site {
	background-image:url(../images/service_content_site.jpg);
}
#service_content.formation {
	background-image:url(../images/service_content_formation.jpg);
}
#service_content.creation {
	background-image:url(../images/service_content_creation.jpg);
}
#service_content.photo {
	background-image:url(../images/service_content_photo.jpg);
}
#services_leftmenu {
	font-size:90%;
	text-align:right;
	margin: 0 20px 0 0;
	width: 150px;
	height:330px;
}
#realisation_leftmenu {
	font-size:90%;
	text-align:right;
	margin: 0 0 0 0;
}

table.form3 tr td {
	border-bottom: 1px dotted #d96723;
}
table.form input, table.form textarea {
	margin: 0;
	padding:0;
	height:14px;
}
.mandat {
	color:#d96723;
}
.marg5 {
	padding: 0 5px 0 0;
}
.contentRealisation {
	width: 400px;
	height:430px;
	overflow:hidden;
	font-size: 12px;
}
div#bigpage
{
	width:6000px;
	height:6000px;
/*	position:relative;
	background-color:#CC9999;*/
}
div.contentRealisation h1 {
	margin:0;
	padding:0;
}
a.accordheader {
	text-decoration:none;
	color: #737f87;
}
div.dateRea {
	margin:10px 20px 0px 0px;
}
div#img_real {
	margin:10px 0px;
}
#threecols #col23 .contentRealisation .contentRealisation #threecols #col2 {
	width:149px;
}
.w100 {
	width:100px;
	margin: 10px 0 0 0;
}
#filter
{
	display: none;
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: #000000;
	z-index:10;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	opacity: .5;
	overflow:hidden;
	min-height: 800px;

}
#box, #content, #image
{
	display: none;
	position: absolute;
	padding: 0;
	margin:0;
	z-index:11;
}
#box {
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background: url(../images/glass.png) repeat-x repeat-y;
}

#image {	
	top: 10%;
	left: 10%;
	width: 80%;
	height: 80%;
}
#content {
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;

	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	filter: alpha(opacity=60);
	opacity: .6;
	overflow:hidden;
	background: url(../images/img_frameb.png) no-repeat center center;
}
#image {	
	background: no-repeat center center;
}

.active:hover {
	cursor:pointer;
}
ul.pros {
	list-style-image: url(../images/icon_check.png);
}