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

* {
	 margin:0;
	 padding:0;
}

a, p
{
position: relative;
z-index: 1;
}

img{
	border:none 0

}

body{
	margin:0;
	background: #780000 url(../images/bg.jpg)  top fixed no-repeat;
	font-family: "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif;
	font-size:12px;
	line-height:1.5em;
}

.clearer { clear:both }

#hd{}

.oetw{
		width:180px;
		height:60px;position:relative;
		top:50px;
		left:60px

}

	#logo{
		background:url(../images/logo1.png);
		width:950px;
		height:98px;
		margin:0 auto;
	}

	#menu{
		margin:0 auto;
		/*margin-bottom:10px;*/
		padding-bottom:1s2px;
		padding-left:2px;
		width:720px;
	}
				#menu ul {
					list-style:none;
				}

				#menu ul li {
					float: left;
					border-right: 1px solid #d1c4c4;
				}

				#menu ul li.latest {
					border-right:0px;
				}

				#menu a {
					color: #666;
					text-decoration:none;
					/*text-transform:uppercase;*/
					font-weight:bold;
					display:block;
					padding-left: 20px;
					padding-right: 20px;
				}

				#menu .active a{
					color:red;
				}

				#menu a:hover {
					text-decoration:none;
					color: #fff;
					background:#8A1213;
				}


/*----- acceuil -----*/

				#menu_acceuil a {
					color:#888888;
					text-decoration:none;
					/*text-transform:uppercase;*/
					font-weight:bold;
					display:block;
					padding-left: 20px;
					padding-right: 20px;
				}

				#menu_acceuil.active a{
					color:#FFFFFF;
					background:#999999


				}

				#menu_acceuil a:hover {
					text-decoration:none;
					color: #fff;
					background:#888888;
				}

/*----- prestations -----*/

				#menu_prestations a {
					color:#888888;
					text-decoration:none;
					/*text-transform:uppercase;*/
					font-weight:bold;
					display:block;
					padding-left: 20px;
					padding-right: 20px;
				}

				#menu_prestations.active a{
					color:#FFFFFF;
					background:#0500D8;
				}

				#menu_prestations a:hover {
					text-decoration:none;
					color: #fff;
					background:#4332E8;
				}

/*----- technologies -----*/

				#menu_technologies a {
					color:#888888;
					text-decoration:none;
					/*text-transform:uppercase;*/
					font-weight:bold;
					display:block;
					padding-left: 20px;
					padding-right: 20px;
				}

				#menu_technologies.active a{
					color:#FFFFFF;
					background:#89A0C2;
				}

				#menu_technologies a:hover {
					text-decoration:none;
					color: #fff;
					background:#89A0C2;
				}

/*----- references -----*/

				#menu_references a {
					color:#888888;
					text-decoration:none;
					/*text-transform:uppercase;*/
					font-weight:bold;
					display:block;
					padding-left: 20px;
					padding-right: 20px;
				}

				#menu_references.active a{
					color:#FFFFFF;
					background:#14AE00;
				}

				#menu_references a:hover {
					text-decoration:none;
					color: #fff;
					background:#14AE00;
				}

/*----- contact -----*/

				#menu_contact a {
					color:#888888;
					text-decoration:none;
					/*text-transform:uppercase;*/
					font-weight:bold;
					display:block;
					padding-left: 20px;
					padding-right: 20px;
				}

				#menu_contact.active a{
					color:#FFFFFF;
					background:#D6000F;
				}

				#menu_contact a:hover {
					text-decoration:none;
					color: #fff;
					background:#D6000F;
				}

.secteur {
	list-style-type:none

}


#container{
	background:url(../images/bgcontainer.png) top repeat-y;
	width:856px;
	margin:0 auto;
	padding-left:50px;
	padding-right:44px;
	padding-top:30px;
	/*height:400px*/
}

	#flash{
		width:854px;
		height:400px;
	}

#flash_banner{
		margin:0 auto;
		width:718px;
		height:185px;
		padding-top:45px;
	}

p {
	padding:0px 20px 10px 0px;
	color:#888888;
	font-weight:normal;




}
#square{ margin-bottom: 20px;}

#square ul li {
	display:inline;



}

#presentation {
		width:718px;
		text-align:left;
		margin:0 auto;
		margin-top:20px;
		line-height:16px;
	}

.left_size {

	float:left;
	width:320px;
}

.right{
	float:right;
	width:320px;
	}

#presentation a { color:#888888; text-decoration:none; font-weight:bold}

.sup{

	color:#990000;
	font-size:1.1em;
	margin-bottom:10px;/*color:#CC0033;*/
}

.sous { color:#990000;
		font-size:1.1em;
}

/*------  formulaire  -----*/

#contactform {
	padding-left:70px;
}

#contactform em {
  color:#990000;
  font-style: normal;
}

.cssform{
	margin-top:80px;
}

.cssform p{
width: 357px;
_width:200px;
clear: left;
margin: 0;
padding: 5px 0 8px 15px;
/*padding-left: 15px; width of left column containing the label elements*/
/*border-top: 1px dashed gray;*/
height: 1%;
}

.cssform label{
font-weight: bold;
float: left;

width: 108px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
}

.cssform textarea{
width: 234px;
height: 150px;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

/* -- end -- */
#footer{
	background:url(../images/footer.png);
	width:950px;
	height:130px;
	margin:0 auto;
}
.gallery { width:760px;}
.thumb { display:block; width:235px; height:290px}
.thumbsite {
	font-size:1.1em;
	font-family:Verdana, Geneva, sans-serif;
	font-weight:100;
	color:#333;
	margin:0;
	text-align:center;
	}
div.thumbsite p { padding:4px 0; margin:0}
div.thumbsite h3 { margin:0; padding:0}
div.thumbsite span { font-weight:bold}
.gallery .thumb .thumbsite a { color:#999 !important;}
.visit { color:#444444}
ul.portfolio { list-style-type:none; margin:0; padding:0}
ul.portfolio li{ display:inline;float:left;width:253px;}
ul.portfolio li a img { border:5px #353535 solid}
ul.portfolio li a:hover img { border:5px #14AE00 solid}