.clearfloat { /* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement un élément flottant */
    	clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    }
body
{
	background:url(../images/bg_03.gif) repeat-x;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:0;
	padding:0;
}
/*-----------conteneur----------*/
#wrapper
{
	width:900px;
	margin:auto;
}
#wrap_ref
{
	height:137px;
	width:100%;
	background-image: url(../images/fond_ref.gif);
	background-repeat:repeat-x;
	clear:both;
	padding-top:10px;
}	
#ref
{
	/*color:#dcdcdc;*/
	/*margin-top:11px;*/
	margin:auto;
	width:850px;
	height:147px;
	background-image:url(../images/bg_nos_ref.gif);
	background-repeat:repeat-x;
	padding-left:55px;
}
/*.content_references{
	width:100%;
	margin:0;
	padding:0;
	background-image: url(../images/fond_ref.gif);
	background-repeat: repeat-x;
	height: 148px;
}*/
/*#ref
{
	width:850px;
	height:147px;
	margin-top:11px;
	float:left;
	
	
	
	
}*/
/*--------logo---------*/

#logo
{
	width:168px;
	height:132px;
	float:left;
	background-image:url(../images/logo.gif)
}

/*---------- en-tête----*/
#header
{	
	height:120px;
	width:100%;
	margin:0;
	padding:0;
	padding-top:6px;
}
#header h1
{
	font-size:18px;
	color:#747474;
	float:right;
	display:block;
	margin-top:27px;
	margin-right:-10px;
}
#menu
{
	margin:0;
	padding:0;
	height:40px;
	width:660px;
	float:left;
	margin-top:-47px;
	margin-left:259px;
}
#menu li
{
	display:block;
	float:left;
	padding:5px 7px 5px 7px;
	margin-right:18px;
	font-weight:bold;
	font-size:14px;
	list-style-type:none;
}

#menu a, #menu a:hover
{
	cursor:pointer;
	text-decoration:none;
	color:#fff;
}
#menu li:hover
{
	background-color:#972d0c;
}
#menu li.active
{
	background-color:#972d0c;
}
/*==========================================ne change pas============================*/
/*--------------banniere-----------*/
#banniere
{
	margin-top:11px;
}
/*--------------contenu ------------*/

#content1 , #content2
{
	margin-top:35px;
	height:371px;
}
#content1 h1, #content2 h1
{
	color:#972d0c;
	font-size:14px;
}
#content1
{
	/*float:left;*/
	/*background-image:url(../images/contenu_gauche.gif);*/
	width:550px;
}
.bloc_accueil{
	float:left;
	background-image:url(../images/accueil_cadre_gauche.gif);
	width:550px;
	background-repeat: no-repeat;
	background-position: top;
}
#content2
{
	background-image:url(../images/contenu_droit.gif);
	float:right;
	width:339px;
}

/*--------présentation-----------*/
#pre
{
	width:465px;
	/*height:179px;*/
	margin:10px 10px 3px 25px;
	float:left;
}

#imgsesame
{
	float:left;
	width:92px;
	height:117px;
	border:#999999 thin solid;
	background-color:#FFFFFF;
	padding:5px;
	margin-right:15px;
}
/*----------actualités----------*/
#actus
{
	width:475px;
	/*height:179px;*/
	padding:10px 5px 3px 25px;
	float:left;
}
#actus ul
{
	margin:0;
	padding:0;
}

#actus li
{
	list-style-image:url(../images/picto_news.gif);
	margin:0 0 10px 20px;
	padding-bottom:10px;
	padding-right:10px;
	border-bottom:#CCCCCC thin dashed;
}
#actus a
{
	color:#990000;
	text-decoration:none;
}
#actus a:hover
{
	text-decoration:underline;
}

#rss
{
	float:right;
	font-size:10px;
}
#rss img
{
	border:none;
}
#rss a , #rss a:hover
{
	color:#000000;
}
#rss a:hover
{
	text-decoration:underline;
}
/*-----------nos expertises-------*/
#expert
{
	width:280px;
	float:left;
	padding-top:10px;
}
#expert h1
{
	margin-left:15px;
}
.offres
{	
	width:280px;
	color:#333333;
	margin-left:96px;
}
.offres h2
{
	font-size:12px;
	margin-top:15px;
}
.offres ul
{
	margin:0;
	padding:0;
}
.offres li
{
	list-style-image:url(../images/picto_fleche.gif);
}
a.bt_offre
{
	display:block;
	float:right;
	margin-right:60px;
	margin-top:-20px;
	background-image:url(../images/bt_voir_offre.gif);
	background-repeat:no-repeat;
	background-position:left;
	width:71px;
	height:35px;
	text-indent:-9999px;
}
a.bt_offre2
{
	display:block;
	float:right;
	margin-right:60px;
	margin-top:-28px;
	background-image:url(../images/bt_voir_offre2.gif);
	background-repeat:no-repeat;
	background-position:left;
	width:71px;
	height:32px;
	text-indent:-9999px;
}
a.bt_offre:hover
{
	background-image:url(../images/bt_voir_offre_over.gif);
	background-repeat:no-repeat;
	background-position:top;
	width:71px;
	height:32px;
	cursor:pointer;
}
a.bt_offre2:hover
{
	background-image:url(../images/bt_voir_offre2_over.gif);
	background-repeat:no-repeat;
	background-position:top;
	cursor:pointer;
}
#pointilles
{
	border-bottom:#CCC dashed thin;
	margin-left:20px;
	width:300px;
}
#offre_strat
{
	height:100px;
}
#offre_strat h2
{
	margin-top:0;
}
#offre_reputation
{
	height:80px;
	margin-bottom:5px;
}
#offre_dev
{
	height:120px;
	padding-top:15px;
}


/*--------nos références------*/

#ref h2
{
	color:#972d0c;
	font-size:14px;
	display:block;
	margin-left:-35px;
	margin-bottom:-5px;
}


/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 112px;
    height: 78px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}
/*--------skin-----*/
.jcarousel-skin-sesame .jcarousel-container {
   	/*background:#FFFFFF;
    border: 1px solid #346F97;*/
}

.jcarousel-skin-sesame .jcarousel-container-horizontal {
    width: 720px;
    padding: 20px 40px;
}

.jcarousel-skin-sesame .jcarousel-clip-horizontal {
    width:  720px;
    height: 78px;
}

.jcarousel-skin-sesame .jcarousel-item {
    width: 112px;
    height: 78px;
}

.jcarousel-skin-sesame .jcarousel-item-horizontal {
    margin-right: 10px;
}

.jcarousel-skin-sesame .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/**
 *  Horizontal Buttons
 */
.jcarousel-skin-sesame .jcarousel-next-horizontal {
    position: absolute;
    top: 22px;
    right: 5px;
    width: 20px;
    height: 75px;
    cursor: pointer;
    background: transparent url(../images/bt_ref_droite.gif) no-repeat 0 0;
}

.jcarousel-skin-sesame .jcarousel-next-horizontal:hover {
    background: transparent url(../images/bt_ref_droite_over.gif) no-repeat 0 0;
}

.jcarousel-skin-sesame .jcarousel-next-horizontal:active {
    background: transparent url(../images/bt_ref_droite_over.gif) no-repeat 0 0;
}

.jcarousel-skin-sesame .jcarousel-next-disabled-horizontal,
.jcarousel-skin-sesame .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-sesame .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background: transparent url(../images/bt_ref_droite.gif) no-repeat 0 0;
}

.jcarousel-skin-sesame .jcarousel-prev-horizontal {
    position: absolute;
    top: 22px;
    left: 5px;
    width: 20px;
    height: 75px;
    cursor: pointer;
    background: transparent url(../images/bt_ref_gauche.gif) no-repeat 0 0;
}

.jcarousel-skin-sesame .jcarousel-prev-horizontal:hover {
    background: transparent url(../images/bt_ref_gauche_over.gif) no-repeat 0 0;
}

.jcarousel-skin-sesame .jcarousel-prev-horizontal:active {
    background: transparent url(../images/bt_ref_gauche_over.gif) no-repeat 0 0;
}

.jcarousel-skin-sesame .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-sesame .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-sesame .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background: transparent url(../images/bt_ref_gauche.gif) no-repeat 0 0;
}


/*==========================================ne change pas============================*/
/*---------------pied de page------------*/
#wrap_footer
{
	height:225px;
	width:100%;
	background-image:url(../images/bg_footer.gif);
	background-repeat:repeat-x;
	clear:both;
	padding-top:10px;
}	
#footer
{
	color:#dcdcdc;
	margin-top:70px;
	margin:auto;
	width:900px;
	height:225px;
}
#footer a
{
	color:#dcdcdc;
	text-decoration:none;
}
#footer a:hover
{
	color:#666666;
	text-decoration:none;
}
#footer h2
{
	font-size:12px;
}
#footer div
{
	float:left;
	margin-left:30px;
}
#copy
{
	width:100%;
	height:30px;
	color:#FFF;
	background-color:#972d0c;
	padding-top:15px;
}
#text_copy
{
	display:block;
	margin:auto;
	width:325px;
	height:30px;
}
/*---------nos offres---------------*/
#nosoffres
{
	width:130px;
}
#nosoffres ul 
{
	margin:0;
	padding:0;
}
#nosoffres li 
{
	list-style-image:url(../images/puce_footer.gif);
	padding-bottom:5px;
	padding-top:5px;
}
#offre1
{
	border-bottom:#dcdcdc thin solid;
}
/*--------------le plan---------------*/
#plan 
{
	width:130px;
}

#plan ul 
{
	margin:0;
	padding:0;
}
#plan li 
{
	list-style-image:url(../images/puce_footer.gif);
	border-bottom:#dcdcdc thin solid;
	padding-bottom:5px;
	padding-top:5px;
}

/*-----------------la societe---------------*/
.coord
{
	color:#afa574;
}

/*-------------------contactez nous------------*/
#contact
{
	width:270px;
}
input, textarea
{
	margin-bottom:5px;
	background-color:#d1d1d1;
	border:#fff thin solid;
	float:left;
}

textarea
{
	overflow:hidden;
}
#nom , #mail
{
	width:281px;
}

#envoi
{
	float:right;
	width:66px;
	height:26px;
	cursor:pointer;
	background-image:url(../images/bt_envoyer.gif);
	border:none;
	margin-right:-10px;
}
#envoi:hover
{
	background-image:url(../images/bt_envoyer_over.gif);
}