/* GENERAL ############################### */
body{
	background: url(./images/design/bg_suiv.jpg) #ffffff repeat-x;
	background-position: center 92px;
	margin:0;
	padding:0;

	font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	font-size:100%;

	text-align:left !important;
	text-align:center;
}

img{
	border:0;
}

h1{
	position:absolute;
	top:-800px;
}

/* Clear both */
.clearb{
	clear:both;
}

/* Corps du site */
#corps{
	position:relative;
	width: 988px;
	margin:auto;
	text-align:left;
}

/* Banniere haut ########################### */

#ban_top{
	position:relative;
	background-color: #ffffff;
	height:92px;
}

#ban_top .logo{
	position:absolute;
	left: 13px;
	top: 3px;
}

#ban_top .click2dial{
	position:absolute;
	right: 0;
}

/* Header ########################### */

#ban_header{
	position:relative;
	width:988px;
}

#menu_top{
	padding:0;
	margin: 0 0 0 5px;
	list-style: none;
}

#menu_top li{
	float: left;
}

#menu_top li a{
	color: #fff;
	text-decoration:none;
	font-size: 0.9em;
	font-weight:bold;

	display:block;

	height:32px;
	width:158px;
	text-align:center;
	line-height:29px;
	margin: 0 0 0 4px;

	background-repeat:no-repeat;
}

/* Etat initial des boutons */
#menu_top .bt_societe{ background-image: url(./images/design/la-societe_bt.png); }
#menu_top .bt_sites{ background-image: url(./images/design/sites-internet_bt.png); }
#menu_top .bt_mobile{ background-image: url(./images/design/services-sms_bt.png); }
#menu_top .bt_telephonie{ background-image: url(./images/design/telephonie_bt.png); }
#menu_top .bt_reseaux{ background-image: url(./images/design/systemes-reseaux_bt.png); }
#menu_top .bt_contact{ background-image: url(./images/design/contactez-nous_bt.png); }

/* Etat des boutons au survol ou selectionnes */
#menu_top .bt_societe.bt_selected, #menu_top li .bt_societe:hover{ color:#ffbe23; }
#menu_top .bt_sites.bt_selected, #menu_top li .bt_sites:hover{ color:#3fcafb; }
#menu_top .bt_mobile.bt_selected, #menu_top li .bt_mobile:hover{ color:#6ad14a; }
#menu_top .bt_telephonie.bt_selected, #menu_top li .bt_telephonie:hover{ color:#ed932f; }
#menu_top .bt_reseaux.bt_selected, #menu_top li .bt_reseaux:hover{ color:#ba35e8; }
#menu_top .bt_contact.bt_selected, #menu_top li .bt_contact:hover{ color:#dd3f2a; }


#menu_top li a:hover, #menu_top .bt_selected{
	background: url(./images/design/bt_over.png) no-repeat;
}

/* Contenu principal du bandeau */
#header_content{
	color:#ffffff;
	text-align:justify;
}
#header_content p{
	margin: 0 0 1em 0;
}

/* Images bandeau selon les sections */
.header_societe, .header_mentions{
	padding: 28px 15px 0 270px;
	height: 213px !important;
	height: 241px;
	background: url(./images/design/illus_societe.jpg) no-repeat;
}
.header_sites{
	height: 206px !important;
	height: 241px;
	padding: 35px 15px 0 270px;
	background: url(./images/design/illus_sites_internet.jpg) no-repeat;
}
.header_mobile{
	height: 196px !important;
	height: 241px;
	padding: 45px 15px 0 270px;
	background: url(./images/design/illus_communication_mobile.jpg) no-repeat;
}
.header_telephonie{
	height: 207px !important;
	height: 241px;
	padding: 33px 15px 0 235px;
	background: url(./images/design/illus_telephonie.jpg) no-repeat;
}
.header_reseaux{
	height: 207px !important;
	height: 241px;
	padding: 33px 15px 0 235px;
	background: url(./images/design/illus_reseaux.jpg) no-repeat;
}
.header_contact{
	height: 193px !important;
	height: 241px;
	padding: 47px 15px 0 275px;
	background: url(./images/design/illus_contact.jpg) no-repeat;
}

#header_content p{
	margin: 0 0 1em 0;
}

/* Presentation des clients ----- */

/* Position bloc */
#header_content .clients{
	position:absolute;
	top:180px;
}

/* Style texte */
#header_content .clients p{
	float:left;
	margin: 23px 0 0 0;
}

/* Style liste */
#header_content .clients ul{
	float:left;
	padding:0;
	margin: 0 0 0 35px;
	list-style: none;
}
#header_content .clients ul li{
	float:left;
	margin: 0 0 0 14px !important;
	margin: 0 0 0 11px;
	padding:0;
}



/* Contenu ########################### */

/* Presentation generale ------- */
/* Zone globale de contenu */
#ban_content{
	position:relative;
	margin: 20px 0 0 0;
	width:988px;
}

/* Zone de gauche */
#ban_content_left{
	float:left;
	width:555px;
}

/* Zone de droite */
#ban_content_right{
	float:right;
	width:367px !important;
	width:402px;
	background: url(./images/design/sep_vert.png) no-repeat;
	background-position: center left;
	padding: 0 13px 0 35px;
}

/* Debuts de mots en bleu */
.first_word{
	color:#247fe6;
}

/* Contenu zone gauche -------- */

/* Cadre des encarts */
#ban_content_left .encart .encart_top{
	background: url(./images/design/encart_top.png) no-repeat;
	background-position: bottom left;
	width:555px;
	height:20px;
	margin:0;
	padding:0;
}
#ban_content_left .encart .encart_cont{
	background: url(./images/design/encart_suiv.png) repeat-y;
	width:513px !important;
	width:555px;
	padding: 0 23px 0 23px;
	margin:0;
	color:#586065;
	overflow:hidden;
}
#ban_content_left .encart .encart_cont .slide_zone{
	margin-top:0.8em;
}
#ban_content_left .encart .encart_bottom{
	background: url(./images/design/encart_bottom.png) no-repeat;
	width:555px;
	height:20px;
	margin:0;
	padding:0;
}

/* Contenu des encarts */
#ban_content_left .encart_cont h2{
	margin:0 0 5px 0;
	font-size:1.3em;
}
#ban_content_left .encart_cont h2 a{
	text-decoration:none;
}
#ban_content_left .encart_cont h2 a:hover{
	text-decoration:underline;
}
#ban_content_left .encart_cont p, #ban_content_left .encart_cont li{
	text-align:justify;
	font-size:0.9em;
	margin:0;
}
#ban_content_left .encart_cont p a{
	color:#586065;
	text-decoration:none;
}
#ban_content_left .encart_cont p a:hover{
	color:#42484C;
}
.encart_pictos{
	float:left;
	margin-right:15px;
}

/* Formulaire contact : erreur saisie */
#ban_content_left .form_contact_msg_err{
	margin:14px 0 0 0;
	padding: 0 0 0 23px;
	background: url(./images/icons/error.png) no-repeat;
}
#ban_content_left .form_contact_msg_err ul{
	list-style:none;
	padding: 0;
}
#ban_content_left .form_contact_msg_err ul li{
	padding: 0 0 0 23px;
	background: url(./images/icons/arrow_right.png) no-repeat;
}

/* Contenu mentions legales */
#ban_content_left .mentions_legales p strong{
	float:left;
	width:150px;
	clear:both;
}

/* Styles contextuels h2 encarts */
#ban_content_left .encart_bleu		h2	{ color:#247fe6; }
#ban_content_left .encart_bleu		h2 a	{ color:#247fe6; }
#ban_content_left .encart_vert		h2	{ color:#3caf33; }
#ban_content_left .encart_vert		h2 a	{ color:#3caf33; }
#ban_content_left .encart_orange 	h2	{ color:#ff8400; }
#ban_content_left .encart_orange 	h2 a	{ color:#ff8400; }
#ban_content_left .encart_violet	h2	{ color:#b332e0; }
#ban_content_left .encart_violet	h2 a	{ color:#b332e0; }

/* Contenu zone droite -------- */
#ban_content_right h2{
	font-size:1.3em;
	color:#ff8c10;
}
#ban_content_right p{
	text-align:justify;
	font-size:0.9em;
	color:#586065;
}
#ban_content_right p a{
	color:#586065;
	text-decoration:none;
}
#ban_content_right p a:hover{
	text-decoration:underline;
}

/* Bloc temoignage */
#bloc_temoignage{
	background-color: #fafafa;
	border: solid 1px #dadada;
	padding: 6px;
}
#bloc_temoignage p{
	font-size:0.85em;
	margin:0 0 1em 0;
	text-align:justify;
}
#bloc_temoignage .temoignage_logo{
	float:right;
	margin: 5px 0 0px 15px;
}

/* Footer ########################### */
#ban_footer{
	position:relative;
	background: url(./images/design/footer.jpg) no-repeat;
	background-position:center top;
	height:37px;
	margin: 40px 0 0 0;
	width:988px;

	text-align:center;
	color:#ffffff;
}

#ban_footer p{
	margin:0;
	line-height:3.2em;
	font-size:0.8em;
}

#ban_footer a{
	text-decoration:none;
	color:#ffffff;
}
#ban_footer a:hover{
	text-decoration:underline;
}


/* Formulaire de contact ########################## */

.formcontact{
	font-size:0.9em;
	margin: 40px 0 20px 0;
}

/* Libelle des champs */
.formcontact label {	
	float: left;
	width: 140px;
	text-align: right;
	padding: 1px 4px 2px 2px;
	margin: 2px 0;
	clear: both;
}
.formcontact label strong {
	font-weight:normal;
}

/* Champs texte */
.formcontact .champ{
	margin: 2px 0;
	border: 1px solid #C2D6EE;
	width:280px;
	background-color: #fff;
}
.formcontact .champ:hover, .formcontact .champ:focus { /* Au survol ou sélectionné */
	border: 1px solid #51B7E8;
}

/* Champ textarea */
.formcontact textarea.champ{
	height:150px;
}

/* Erreurs de saisie (JS) */
.formcontact .champ.error{
	background-color: #FF9797;
}

/* Boutons */
.formcontact .button{
	border: 1px solid #abc3d7;
	background-color: #ecf1f4;
	color: #000;

	background-image: url(./images/css/submit.gif);
	background-repeat: repeat-x;
	background-position: center top;

	padding: 1px 13px;
	vertical-align: middle;
}
.formcontact .button:hover, .formcontact .button:focus{
	color: #ffffff;
	background-image: none;
	cursor: pointer;
	background-color: #4e8ccf;
}

/* Container bouton submit */
.formcontact .submit_form{
	margin: 10px 0 0 340px;
}

/* Click2Dial ########################## */

#click2dial_dialog {
	display:none;
	font-size:0.8em;
}

#click2dial_dialog p {
	margin:0 0 1em 0;
}

.ui-dialog .ui-dialog-titlebar{
	padding: .13em .5em .05em .5em;
}

.ui-dialog-title{
	font-size:1.1em;
}

.ui-dialog .ui-dialog-content {
	padding: 1em .75em;
	text-align:justify;
}

#click2dial_dialog label, #click2dial_dialog input {
	display:block;
}

#click2dial_dialog input.text {
	margin-bottom:12px;
	width:95%;
	padding: .3em;
}

#click2dial_dialog fieldset {
	padding:0;
	margin: 25px 0 0 0;
	border:0;
}

#click2dial_dialog .ui-dialog .ui-state-highlight, #click2dial_dialog .ui-dialog .ui-state-error {
	padding: .3em; 
}

.ui-dialog .ui-dialog-buttonpane {
	padding: .34em .27em .2em .4em;
}

.ui-dialog .ui-dialog-buttonpane button {
	font-size:0.8em;
	padding: .3em .6em .3em .6em;
}