@import "newsletter.css";
@import "actualites.css";
@import "lightbox.css";

 /*------------------------------------------------------*
  *---------    ICARE-NET.COM - agence web ---  CSS  ----*
  *------------------------------------------------------*/
  
html, body 
                {
	height: 100%;
	margin: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
.hide           {display: none;}

body {
	margin: 0;
	padding: 0;
	background-color: #C3C3C3;
	font: 90% "Trebuchet Ms", Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	background-image: url(../images/deco/fond_body.gif);
	background-repeat: repeat-x;
	background-position: left top;
}
a       {color:#C22E1D;text-decoration:none;}
a:hover {
	color:#C22E1D;
	text-decoration: underline;
}
/* On met le padding à 0 pour le navigateur Opera qui définit des padding par défaut pour le body*/
img             {border:0 none}
hr              {visibility: hidden;text-align:center;height:30px;width:100px}
ol, ul, li      {margin: 0; padding: 0;}
/* ------------ CONTENEUR GLOBAL ------------------------*/
#home
{
	min-height: 100%;
	width: 900px;
	padding: 0 auto;
	margin: 0 auto;
	text-align: center;
  }
  
#general{
	margin:0 auto;
	padding:0;
	width:100%;
}



/*------Titre*/

#header{
	margin:0 auto;
	padding:0;
	width:890px;
	height:170px;
	background-image: url(../images/deco/header.jpg);
	background-repeat: no-repeat;
	color: #999999;
	background-position: 1px top;
}

#liens_header{
	margin: 0;
	padding: 152px 26px 0 0;
	text-align: right;
	font-size: 10px;

}

#liens_header a{
	color: #999999;
	text-decoration: none;

}

#liens_header a:hover{
	color: #C22E1D;
}

#header img     {border:0;margin:0;padding:0;}
/*-----Contenu de page*/
  
#center 
{
	padding-bottom: 50px; 
	overflow: auto;
	}
#center li     {list-style-type: none}

/*-----barre gauche*/
#left {
	padding: 0px;
	float: left;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

#menu{
	font: 90% "Trebuchet Ms", Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	padding:0;
	width: 196px;
	background-image: url(../images/deco/menu.gif);
	background-repeat: no-repeat;
	background-position: center top;
}
#menu ul{
	list-style-type: none;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	width: 130px;
	height: 330px;
	padding-top: 20px;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 33px;	
}
#menu li {
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #EEE;
}
#menu li a{
	text-decoration: none;
	color: #666;
	font-size: 11px;
	font-weight: bold;
	padding: 0.px;
	display: block;
	width: 120px;
	margin-top: 2;
	margin-right: auto;
	margin-bottom: 2;
	margin-left: auto;
	padding-top: 9px;
	padding-right: 4px;
	padding-bottom: 9px;
	padding-left: 4px;
}

#menu li a:hover{
	color: #C22E1D;
	background-color: #EEE;

}

#menu ul ul {
	margin:0;
	padding:0;
	height:25px;
	border:none;
}
#menu ul ul li {
	margin:0;
	padding:0;
	border:none;
}
#menu ul ul li a {
	margin:0px;
	padding:2px 0 2px 30px;
	font-weight:normal;
	border:none;
	display: block;
	width: 100px;
	background:url(../images/deco/puce_sous_menu.gif) no-repeat 20px 2px;
}
#menu ul ul li a:hover {
	background:url(../images/deco/puce_sous_menu.gif) no-repeat 20px -18px #eee;
}

/*-----contenu droite*/
#right {
	float: left;
	margin: 0px;
	width: 669px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#right ul {
	margin: 0px;
	padding: 5px;
	list-style-type: none;
}
#right li {
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
}


/*-----content*/
#content {
	width: 890px;

	margin-right:40px
	font: Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-image: url(../images/deco/fondcontent.gif);
	background-repeat: repeat-y;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	}
#content p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding: 0px;
	margin: 0px;
}
	
#content h1 {
	font-size: 20px;
	padding: 0px;
	color: #666666;
	text-align: right;
	margin: 0px;
	font-family: "Trebuchet Ms", Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
}

#content #right .bspi-infos {
	text-align:center;
}


#content h2     {
	color: #643A4C;
	font-size: 14px;
	background-image: url(../images/deco/fleche1.gif);
	background-repeat: no-repeat;
	background-position: left 1px;
	padding-top: 0px;
	padding-right: 25px;
	padding-bottom: 0px;
	padding-left: 20px;
	background-color: #EEEEEE;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CDCDCD;
	line-height: 20px;
	margin: 0px;
	font-family: "Trebuchet Ms", Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
}

#content #right .bspi-edito {
	text-align:left;
	background-color:#ff0000;
}

#content h3     {
	font-family: "Trebuchet Ms", Verdana, Arial, Helvetica, sans-serif;
	color: #643A4C;
	font-size: 12px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 2px;
	background-color: #DDDDDD;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CDCDCD;
	line-height: 20px;
	margin: 0px;
}

#content_contact {
	float: left;
	width: 646px;
	margin-left:40px;
	margin-right:40px
	font: Verdana, Arial, Helvetica, sans-serif;
	background: url(../images/deco/fondcontent.jpg) no-repeat center bottom;
	}
	
#content_contact img.images_plans {
	padding-left: 0px;
	border-right-width: 5px;
	border-right-style: solid;
	border-right-color: #444444;
}


ul#content li     {
	list-style-image: url(../images/deco/puce.gif);
}

form, input     {margin: 0px;padding: 0px;}
select          {color: #000;background-color: #fff;}
p               {margin: 0px;padding: 0px;}

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

a.lien_texte{
	color:#c00;
	font-weight:bold;
	text-decoration:none;
}

a.lien_texte:hover{
	color:#c00;
	font-weight:bold;
	text-decoration:underline;
}
a.lien_texte:active{
	color:#c00;
	font-weight:bold;
	text-decoration:underline;
}

a.lien_texte:visited{
	color:#c00;
	font-weight:bold;
	text-decoration:none;
}
.encart {
	background-color: #EEEEEE;
	margin: 0px;
	border: 1px solid #DDDDDD;
	color: #666666;
}

 /*------------------------------------------------------*
  *-------------------------------     CSS BLOCS     ----*
  *------------------------------------------------------*/
div#leftbar h3, div#footer p, div#leftbar p  {
	padding: 0 10px;
	}

#flash{
	width:900px;
	height:460px;
}

.img_left {
	float:left;
	margin:0;
	padding: 0px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 2px;
	margin-left: 0px;
}
.img_right {
	float:right;
}
.filigrane {
	background-image: url(../images/deco/bspi_filigrane.gif);
	margin: 0px;
	padding: 0px;
}

/********** Liste Menu Top horizontal ************************/

ul#x_menu         {
	height: 60px;
	list-style-type: none;
	overflow:auto;
	margin-left: 67px;
}
/* On donne une hauteur au menu, correspondant a la taille de l'image utilisée en fond*/
ul#x_menu li      {
	text-align: center;
	float: left;
	margin: 0 auto;
}
/* On rend les li en flottant pour pouvoir les afficher horizontalement, on cache les puces, et on centre le texte */
ul#x_menu li a    {border-right:1px solid #c30;font-size: 8pt;width: 127px;line-height: 30px;letter-spacing: 0px ;
                  color: #fff;background-color: #333333;display: block ;text-decoration: none ;}
/* C'est sur les liens que le gros du travail est effectué, largeur, hauteur de ligne, taille de police, graisse de police, espacement des lettres, couleur, bordure et decoration du texte. Nous pouvons dimensionner les a grâce à la propriété display: block ; */
ul#x_menu a:hover {color: #CCCCCC;}

#menu_centrage      {
	text-align: center;
	margin: 0 auto;
}

 
/*Bas de page*/

#footer {
	width: 890px;
	color: #999999;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-image: url(../images/deco/footer.gif);
	background-repeat: no-repeat;
	height: 40px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	line-height: 18px;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
	}
	
#footer a       {color:#999999;text-decoration:none;}
#footer a:hover {
	color:#C22E1D;
	text-decoration: none;
}

/*clear*/

.clear {
   clear: both;
   overflow: hidden;
   width: 1px;
   height: 1px;
   margin: 0 -1px -1px 0;
   border: 0;
   padding: 0;
   font-size: 0;
   line-height: 0;
}

 /*------------------------------------------------------*
  *-----------------------  CSS FORMULAIRE CONTACT  -----*
  *------------------------------------------------------*/
.input_champs {
	padding: 0px;
	width: 275px;
	background-color: #EEEEEE;
	border: 1px solid #CDCDCD;
	height: 20px;
	margin: 0px;
}

.input_message {
	margin: 0px;
	padding: 0px;
	width: 275px;
	background-color: #EEEEEE;
	border: 1px solid #CDCDCD;
}
.envoyer {
	background-color: #EEEEEE;
	padding: 0px;
	border: 1px solid #CDCDCD;
	margin-top: 10px;
	margin-right: 2px;
	margin-bottom: 0px;
	margin-left: 0px;
}

.table_form {
	margin: 0px;
	padding: 0px;
	border: 1px solid #CDCDCD;
	background-color: #FFFFFF;
}
  

 /*------------------------------------------------------*
  *-------------------------------     CSS PLANS     ----*
  *------------------------------------------------------*/
  
/*page plans*/
#divmail{
  float:right;
  background: #205daa;
  margin:0;
  padding-size:0;
  text-align:center;
  width:560px;
  height:500px;
}
#divmail p    {font-size:1.5em;color:#efefef;text-align:left;margin-left:50px}

#divplan {
   
  background: #444 url(../images/produits/fond_element.jpg) no-repeat bottom;;
  margin:0;
  padding-size:0;
  text-align:center;
  width:650px;
  height:100%;
}
#divplan span {float:left;color:white;}
#divplan p    {color:#efefef;text-align:center;margin: 0;padding:o}
#divplan h3   {color:#ff9d19;margin: 0;padding: 0;}

#plan   {
	width: 240px;
}

#plan img {
 margin-top: 10px;
	margin-bottom: 10px;
}

/*pop up plans*/
#popup_plan {
  background:#444444;
  margin-top:20px;
	width: 570px;
	position: absolute;
	left: 50%;
	margin-left: -285px;
}

#popup_plan a {
	color:#efefef;
	text-decoration:none;
}

#popup_plan a:hover {
	color:#666;
}

#popup_plan img {
	border: 1px solid #333;
}

.table_plan {
	background-color: #EEEEEE;
	border: 1px solid #DDDDDD;
	color: #666666;
	padding: 0px;
	margin-top: 78px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
} 

 /*-----------------------------------------------------------*
  *-----------------------------------     CSS EFFETS     ----*
  *-----------------------------------------------------------*/

#zone {
	margin:5px;
	width: 300px;
	height: 250px;
	overflow: auto;
	}


.transparence {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;
	}

#general #content #left .sommaire {
	background-color: #999999;
	text-align: center;
	color: #ff0000;
	margin:20px 10px 10px 10px;
	border: 2px solid #333;
	width:175px;

}

#general #content #left .sommaire p{
	text-align: center;
	font-size: 13px;
	margin:10px;
	font-family: Arial, Helvetica, sans-serif;
	color: #fff;
}
#general #content #left .sommaire p.titre-sommaire{
	text-align: center;
	font-size: 15px;
	margin:5px 10px 20px 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-variant: small-caps;
	border-bottom: 2px solid #fff;
	color: #ff0000;
	padding: 3px;
}
.sommaire .sous-titre {
	font-style: italic;
	font-size: 11px;
	font-variant: small-caps;
	font-weight: bold;
	color: #ff0000;
	
}
#content #left .archives {
	color: #ff0000;
	background: #777;
	border: 2px solid #333;
	margin: 15px 10px;
	width:175px;
}
#general #content #left .archives p.titre-archives {
	font-size: 14px;
	font-variant: small-caps;
	color: #FFFFFF;
	text-align: center;
	margin: 10px 10px 20px 10px;
	padding: 5px;
	background:#5c5c5c;
}
#content #left .archives ul{
	color: #ff0000;
	list-style-position: inside;
	margin: 0 0 10px 10px;
	
}
#content #left .archives li{
	color: #ff0000;
	font-size: 12px;
	
}
#general #content #left .archives li a{
	color: #ff0000;
	font-size: 12px;
	text-decoration:none;	
}
#general #content #left .archives li a:hover{
	color: #fff;
	text-decoration:none;
	
}

#general #content #right .date {
	font-size: 12px;
	font-weight: bold;
	margin: 5px 10px;
	background:#C0C0C0;
	padding:3px;
}