/*----------------- CSS CIRCE-INFORMATIQUE.COM ----------------------*/

/*------------------- Copyright AG CREATIONS ------------------------*/

/*---------------------------- 2007 ---------------------------------*/



* {margin: 0;padding:0;border: 0;}

html, body {margin:0;padding:0;text-align: center;color:#023B66;}

.hide {	display: none;}

img {border:0;}



a {color:#023B66; text-decoration:none; font-weight:bold;}

a:hover {color:#023B66; text-decoration: underline;}

p { font-size:12px; text-align:justify;}

p a {color:#023B66; text-decoration:none; font-weight:bold;font-variant: small-caps; font-size:12px;}

p a:hover {color:#023B66; text-decoration: underline;}







body{

	font-family: Verdana, Helvetica, sans-serif; font-size:11px;

	text-align:center;

	background :#023B66 url("../gfx/background.jpg") repeat-x;

}	



.conteneur{

	position:relative;

    width:920px; padding-left:78px; 

    margin-left: auto; 

    margin-right: auto;

    text-align: left;

}



/*partie du haut--------------------------------------

-----------------------------------------------------*/



#header{float:left; width:843px; height: 97px; background :#016AB3 url('../gfx/fond_header.jpg') right no-repeat; 	}



#header h1 {

	position: relative; float:left;

	width:564px; height:97px;

	background : url('../gfx/circe-logo.jpg') no-repeat;	}

#header h1 a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;height:78px;

	background : url('../gfx/circe-logo.jpg') no-repeat;	}

#header h1 a:hover{background: transparent none;}





  

/*consctruction page----------------------------

-----------------------------------------------------*/

#gauche{float:left; position:relative;

width:203px; height:503px;

background:#016AB3 url('../gfx/haut-menu.jpg') top left no-repeat;}



#droite{float:left; position:relative; 

width:637px; height:503px;

background: url('../gfx/centre.jpg') top left no-repeat;}





/*menu-----------------------------------------------

-----------------------------------------------------*/

#menu{

float:left;

margin-top:133px;

width:203px; 

}



#menu li ul{ visibility:hidden; list-style: none; }

#menu ul{list-style:none;}



#menu-mission, #menu-objectif, #menu-competence, #menu-offre, #menu-implantation, #menu-humour, #menu-contact  {

float:left; 

font-size: 1px;  text-indent: -9000px;

width:203px;

}



#menu-mission {background : url('../gfx/menu2_mission.jpg') no-repeat;height:47px;	}

#menu-mission a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu1_mission.jpg') no-repeat;}

#menu-mission a:hover{background: transparent none;}



#menu-objectif {background : url('../gfx/menu2_objectif.jpg') no-repeat;height:35px;	}

#menu-objectif a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu1-objectif.jpg') no-repeat;}

#menu-objectif a:hover{background: transparent none;}



#menu-competence {background : url('../gfx/menu2_competence.jpg') no-repeat;height:34px;}

#menu-competence a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu1_competence.jpg') no-repeat;}

#menu-competence a:hover{background: transparent none;}



#menu-offre { background : url('../gfx/menu2_offre.jpg') no-repeat;	height:36px;}

#menu-offre a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu1_offre.jpg') no-repeat;}

#menu-offre a:hover{background: transparent none;}



#menu-implantation {background : url('../gfx/menu2_implantation.jpg') no-repeat;height:35px;	}

#menu-implantation a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu1_implantation.jpg') no-repeat;}

#menu-implantation a:hover{background: transparent none;}



#menu-humour {background : url('../gfx/menu2_humour.jpg') no-repeat;height:38px;}

#menu-humour a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu1_humour.jpg') no-repeat;}

#menu-humour a:hover{background: transparent none;}



#menu-contact {	background : url('../gfx/menu2_contact.jpg') no-repeat;height:50px;}

#menu-contact a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu1_contact.jpg') no-repeat;}

#menu-contact a:hover{background: transparent none;}







/*Contenu--------------------------------------------

-----------------------------------------------------*/



h2 {font-size: 1px;

 text-indent: -9000px;

 margin-top:12px;

 margin-left:80px;

 height:78px;

 width:437px;

 background :#fff url('../gfx/titre.jpg') no-repeat;

 }



/*Page accueil---------------------------------------*/

#accueil{ background :#fff url('../gfx/01page-accueil.jpg') no-repeat; width:593px;

height:341px;font-size: 1px;  text-indent: -9000px; margin-top:4px;}



/*Pages---------------------------------------*/

h3 {font-weight:bold; font-size:17px; color:#023B66; text-align:center; margin-left:70px; margin-top:10px;  }

h3 a { text-decoration:underline;font-size:16px; }

h3 a:hover { text-decoration:none; }

h3 em{ font-size:14px; font-style:normal;}

h4 {font-weight:bold; font-size:15px; color:#023B66; text-align:center;margin-left:70px;margin-top:5px;}

#mission{ background:#fff url("../gfx/img_mission.jpg") no-repeat bottom; width:593px; height:200px; margin-left:2px; 

margin-top:70px; }



#mission dt{margin-left:20px;font-size:15px;}



#menu1, #menu2, #menu3 {margin-top:10px;margin-left :30px;}



#menu1 ul , #menu2 ul,#menu3 ul{ list-style: none;}

#menu1 ul li , #menu2 ul li{

  display: block;

  height: 17px;

  margin: 10px 0 0 20px;

  padding: 0 0 0 25px;

  background: url('../gfx/fleche1.jpg') left no-repeat;

font-size:13px;  line-height:15px;

vertical-align:middle;

}



#menu3 ul li {

  display: block;

  height: 17px;

  margin: 5px 0 0 20px;

  padding: 0 0 0 25px;

  background: url('../gfx/fleche1.jpg') left no-repeat;

font-size:13px;  line-height:15px;

vertical-align:middle;

}





#objectif{ background:#fff url("../gfx/img_objectif.jpg") no-repeat bottom; 

width:593px; height:244px; margin-left:2px; 

margin-top:48px; }



#objectif dt{margin-left:20px;font-size:15px; text-align:justify; margin-right:15px; }

#objectif dt strong {font-weight:bold;}



#objectif dl{margin-top:10px;}





#competence{ background:#fff url("../gfx/img_competence.jpg") no-repeat bottom; 

width:593px; height:300px; margin-left:2px; 

margin-top:15px; }

#objectif dt{margin-left:20px;font-size:15px; text-align:justify; margin-right:15px; }



#implantation{ background:#fff url("../gfx/img_implantation.jpg") no-repeat bottom; 

width:593px; height:290px; margin-left:2px; 

margin-top:25px;}

#implantation dt {padding-top:37px; padding-left:50px;font-size:12px;}

#implantation dd {margin-left:50px; font-size:10px;}

dd#ico-tel {background: url("../gfx/ico-telephone.gif") left no-repeat; padding-left:30px; width:150px; padding-top:3px; }

#implantation a{background: url("../gfx/fleche2.gif") left no-repeat; padding-left:10px; font-size:12px;}

#imp_contact{margin-top:5px;}



#contact{ background:#fff url("../gfx/img_contact.jpg") no-repeat bottom; 

width:593px; height:300px; margin-left:2px; padding-top:15px;

}




/*humour---------------------------------------*/

#humour1, #humour2,  #humour3,  #humour4, #humour5, #humour6, #humour7, #humour8, #humour9, #humour10{ 

height:364px; width:590px;

margin-top:35px; font-size:1px;

text-indent:-9000px;}



#humour1{ background:#fff url("../gfx/humour1.jpg") no-repeat; }

#humour2{ background:#fff url("../gfx/humour2.jpg") no-repeat; }

#humour3{ background:#fff url("../gfx/humour3.jpg") no-repeat; }

#humour4{ background:#fff url("../gfx/humour4.jpg") no-repeat; }

#humour5{ background:#fff url("../gfx/humour5.jpg") no-repeat; }

#humour6{ background:#fff url("../gfx/humour6.jpg") no-repeat; }

#humour7{ background:#fff url("../gfx/humour7.jpg") no-repeat; }

#humour8{ background:#fff url("../gfx/humour8.jpg") no-repeat; }

#humour9{ background:#fff url("../gfx/humour9.jpg") no-repeat; }

#humour10{ background:#fff url("../gfx/humour10.jpg") no-repeat; }



#humour1 dt a, #humour2 dt a, #humour3 dt a, #humour4 dt a, #humour5 dt a, #humour6 dt a, #humour7 dt a, #humour8 dt a{ 

display: block;font-size:1px;

text-indent:-9000px;width: 100px; height: 30px;

position: relative;

}



#humour1 dt a{top: 330px; left:410px;}

#humour2 dt a{top: 330px; left:210px;}

#humour3 dt a, #humour4 dt a, #humour5 dt a, #humour6 dt a{top: 330px; left:28px; }

#humour7 dt a, #humour8 dt a{top: 330px; left:475px;}

#humour9 dt a{top: 330px; left:300px; 
display: block;font-size:1px;

text-indent:-9000px;width: 270px; height: 30px;

position: relative;}


#humour10 dt a{top: 5px; left:230px; 
display: block;font-size:1px; 

text-indent:-9000px;width: 270px; height: 30px;

position: relative;}



#suivant{position:absolute;

margin-left:505px; padding-top:5px; 

height:17px; vertical-align:middle; margin-top:5px;

 }

#suivant_img{position:absolute;

margin-left:563px; padding-top:3px; 

height:17px; vertical-align:middle; margin-top:5px;

 }






#precedent{position:absolute; margin-left:17px;

padding-left:20px; margin-top:5px;

height:17px; vertical-align:middle;

padding-top:5px; }

#precedent_img{position:absolute;

margin-left:16px; padding-top:3px; 

height:17px; vertical-align:middle; margin-top:5px;

 }


#suivant2{ position:absolute;margin-left:505px;

height:17px; vertical-align:middle;margin-top:5px;

padding-top:5px; padding-right:20px;}



/*offre---------------------------------------*/

#offre{ background:#fff url("../gfx/img_offre.jpg") no-repeat bottom; width:593px; height:300px; margin-left:2px; 

margin-top:15px; }



#offre dt{margin-left:20px;font-size:15px;}



#offre dd{margin-left:20px;  font-size:13px; margin-top :10px;

background: url('../gfx/fleche1.jpg') left top no-repeat; padding-left:25px;}



#offre em{font-style:normal; text-decoration:underline;}

#offre em a{text-decoration:underline;}

#offre em a:hover{font-style:normal; text-decoration:none;background-color:#023B66; color:#fff;}



#offre ul { list-style: none;  clear: both;margin-bottom:30px; }

#offre ul li {

  display: block;

  height: 17px;

  padding: 0 0 0 10px;

  background: url('../gfx/fleche2.gif') left no-repeat;

font-size:13px; 

vertical-align:middle;

}

#offre dd li{text-decoration:none;}

/*contrat---------------------------*/

#menu_contrat {

float:left; width:590px; font-size:12px;

margin-top:20px;margin-bottom:20px; text-align:center;

}

#menu_contrat2 {float:left; width:590px; padding-top:90px; }



#menu_contrat dt, #menu_contrat2 dt{margin-bottom:5px;}

#menu_contrat dd, #menu_contrat2 dd {margin-left:35px;}



#menu_contrat li ul, #menu_contrat2 li ul{ visibility:hidden; list-style: none; }

#menu_contrat ul, #menu_contrat2 li ul{list-style:none;}



#menu-simp, #menu-stan, #menu-ren, #menu-adm {

float:left; font-size: 1px; text-indent: -9000px;height:19px;

}



#menu-simp {background : url('../gfx/menu_contrat2a.jpg') no-repeat;  width:110px;	}

#menu-simp a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu_contrat1a.jpg') no-repeat;}

#menu-simp a:hover{background: transparent none;}



#menu-stan {background : url('../gfx/menu_contrat2b.jpg') no-repeat; width:114px;	}

#menu-stan a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu_contrat1b.jpg') no-repeat;}

#menu-stan a:hover{background: transparent none;}



#menu-ren {background : url('../gfx/menu_contrat2c.jpg') no-repeat;  width:112px;	}

#menu-ren a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu_contrat1c.jpg') no-repeat;}

#menu-ren a:hover{background: transparent none;}



#menu-adm {background : url('../gfx/menu_contrat2d.jpg') no-repeat;  width:188px;	}

#menu-adm a{

  display: block;position: relative;

  font-size: 1px;  text-indent: -9000px;

width: 100%;height : 100%;

	background : url('../gfx/menu_contrat1d.jpg') no-repeat;}

#menu-adm a:hover{background: transparent none;}




.condition, .condition2 { width:580px;padding-left:40px;padding-bottom:10px;}
.condition dt{ margin-top:5px; font-size:12px;}

.condition dd{ padding-left:30px; margin-top:3px; font-size:12px; width:220px; float:left;}





.condition2 dt{margin-top:20px; font-size:12px;}

.condition2 dd{ padding-left:30px; margin-top:3px; font-size:12px; width:220px; float:left; }





#simplifie{ background:#fff url("../gfx/img_simplifie.jpg") no-repeat bottom; 

width:593px; height:275px; margin-left:2px; margin-top:40px; }

#simplifie dt{margin-left:20px;font-size:15px; text-align:justify; margin-right:15px; }



#standard{ background:#fff url("../gfx/img_standard.jpg") no-repeat bottom; 

width:593px; height:275px; margin-left:2px; margin-top:40px; }

#standard dt{margin-left:20px;font-size:15px; text-align:justify; margin-right:15px; }



#renforce{ background:#fff url("../gfx/img_renforce.jpg") no-repeat bottom; 

width:593px; height:275px; margin-left:2px; margin-top:40px; }

#renforce dt{margin-left:20px;font-size:15px; text-align:justify; margin-right:15px; }



#admin{ background:#fff url("../gfx/img_admin.jpg") no-repeat bottom; 

width:593px; height:275px; margin-left:2px; margin-top:40px; }

#admin dt{margin-left:20px;font-size:15px; text-align:justify; margin-right:15px; }







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

-----------------------------------------------------*/



#contact input, #contact textarea,  #contact select {

background-color:#016AB3;

color: #FFF;

font-family: 'Trebuchet MS', Arial, Verdana, sans-serif !important;

font-size: 12px; margin-top:2px;

}



fieldset{  border: 0;margin-top:40px;}



#contact textarea {

width: 350px;

height: 70px;

}



.form p{

  float: left;

  width: 100%;

}



#contact label{

	float:left;

	text-align:right; width: 20%;

	padding: 0 2px 0 0;margin:3px 0px; }

input#nom, input#societe, input#ville, input#email, input#tel {width: 170px;}



.envoyer {

	 cursor:pointer;

     width: 89px;

     height: 24px;

	 border: 0px none; margin:10px 0 0 382px;

	 background:#fff url('../gfx/envoyer.gif') bottom  no-repeat;

}



.erreur_box {

font-size:10px; color:#333; text-align :center; margin-bottom:10px;

width: 470px; border: 1px solid #FF0000;background-color: #fff0cc;padding: 3px;}







/*footer-----------------------------------------------*/

#contenu {float:left; height:447px; width:503px;}



#footer{float:left; height:39px;width:503px; color:#FFFFFF;}



#footer_adr {position:absolute;padding-left:40px;  }



#footer_adr p{background:url(../gfx/ico_adresse.jpg) left no-repeat;

 padding-left :28px; padding-top:5px; height:21px; font-size:12px;}

 

#footer_rea {position:absolute;padding-left:570px;}



p#agc_detail{

display: none;

background-color:#000000;

}

#agc_logo a{

  width: 23px; 

  height: 28px;

  display: block;

  background: url('../gfx/realisation_agcreations.fr.jpg') no-repeat;

  text-indent: -9000px;

}







/* Pour les infobulles */

#dhtmltooltip{

  position: absolute;

  width: 110px; height:45px;

  border: 1px solid black;

  visibility: hidden;

  z-index: 100;

}





/*-----------------------------------------------------*/











