@charset "utf-8";
body  {
    	font: 100% Verdana, Arial, Helvetica, sans-serif;
		background:url(images/fond.gif) repeat-x;
    	background-color: #aaa9a7;
    	margin: 0px; 
    	padding: 0px;
    	/*color: #aaa9a7;*/
    }
	
	.rubparticulier {
		margin-left:20px;
		margin-right:20px;
		padding:20px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:1em;
		font-weight:bold;
		color:#FFFFFF;
		border:1px dashed #999999;
		background-color:#EBEBEB;
    } 
	.rubparticulier a, .rubparticulier a:visited{
		color:#cb3673;
		text-decoration: underline;
	}
	.rubparticulier a:hover{
		color:#352c1d;
		text-decoration: underline;
	}
	.rubentreprise {
		margin-left:50px;
		padding-top:10px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:1em;
		font-weight:bold;
		color:#FFFFFF;
    } 
	.rubentreprise a, .rubentreprise a:visited{
		color:#848484;
		text-decoration: underline;
	}
	.rubentreprise a:hover{
		color:#352c1d;
		text-decoration: underline;
	}
	.rubinter {
		margin-left:50px;
		padding-top:10px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:1em;
		font-weight:bold;
		color:#FFFFFF;
    } 
	.rubinter a, .rubinter a:visited{
		color:#318ec0;
		text-decoration: underline;
	}
	.rubinter a:hover{
		color:#352c1d;
		text-decoration: underline;
	}
	.rubmeubles {
		margin-left:50px;
		padding-top:10px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:1em;
		font-weight:bold;
		color:#FFFFFF;
    } 
	.rubmeubles a, .rubmeubles a:visited{
		color:#c4564d;
		text-decoration: underline;
	}
	.rubmeubles a:hover{
		color:#352c1d;
		text-decoration: underline;
	}
	
.courantpetit {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 11px;
	font-weight:normal;
}
.bleubig {
	color: #004699;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 16px;
	font-weight:bold;
   background-color: #F9F9F9;
}
    .twoColElsLt #container { 
    	width: 983px;  /* cette largeur crée un conteneur qui s'adaptera dans une fenêtre de navigateur */
    	margin: 0px; /* les marges automatiques (et dotées d'une largeur positive) centrent la page */
    	text-align: left; /* ce paramétrage annule le paramètre text-align: center de l'élément body. */
    } 
    
    .twoColElsLt #sidebar1 {
    	float: left; 
    	width: 255px; /* cet élément est flottant, il faut donc lui attribuer une largeur */
    	background: #EBEBEB; /* la couleur de l'arrière-plan est affichée sur la largeur du contenu de la colonne, mais pas au-delà */
    	padding: 0px; /* le remplissage en haut et en bas crée un espace visuel à l'intérieur de cet élément div */
		margin:0px;
		color:#ffffff;
    }
   /* .twoColElsLt #sidebar1 h3, .twoColElsLt #sidebar1 p {
    	/*margin-left: 10px; /* il est conseillé d'attribuer des valeurs pour les marges gauche et droite de chaque élément qui sera placé dans les colonnes latérales */
    	/*margin-right: 10px;
    }*/
	.menuhauticones {
		height:21px;
		width:255px;
		background:url(images/fondmenuhaut.jpg) top left no-repeat;
		padding-top:30px;
		padding-left:12px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#FFFFFF;
	}
	.menuhauticones, .menuhauticones a, .menuhauticones a:hover,.menuhauticones a:visited{
		color:#FFFFFF;
		text-decoration: none;
		padding-left:5px;
	}
	.flashactu {
		padding:0px;
		margin:0px;
		height:165px;
		width:255px;
		background: #666666;
		color:#ffffff;
	}    
	.menugauche {
	/* height à modifier en fonction de la longueur du texte des pages */
		height:718px;
		width:255px;
		/*color:#ffffff;*/
		background:url(images/fondmenugauche.jpg) top left repeat-y;
	} 
	.particulier {
		height:84px;
		width:255px;
		padding-left:50px;
		background:url(images/particulier.jpg) no-repeat;
	} 
	.particuliertexte {
		padding-left:50px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#352c1d;
		text-decoration: underline;
	}
	.particuliertexte a, .particuliertexte a:visited{
		color:#352c1d;
		text-decoration: underline;
	}
	.particuliertexte a:hover{
		color:#cb3673;
		text-decoration: underline;
	}
	.entreprise {
		height:70px;
		width:255px;
		padding-left:50px;
		background:url(images/entreprise.jpg) no-repeat;
	} 
	.entreprisetexte {
		padding-left:50px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#352c1d;
		text-decoration: underline;
	}
	.entreprisetexte a, .entreprisetexte a:visited{
		color:#352c1d;
		text-decoration: underline;
	}
	.entreprisetexte a:hover{
		color:#848484;
		text-decoration: underline;
	}
	.international {
		height:70px;
		width:255px;
		padding-left:50px;
		background:url(images/international.gif) no-repeat;
	} 
	.internationaltexte {
		padding-left:50px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#352c1d;
		text-decoration: underline;
	}
	.internationaltexte a, .internationaltexte a:visited{
		color:#352c1d;
		text-decoration: underline;
	}
	.internationaltexte a:hover{
		color:#318ec0;
		text-decoration: underline;
	}
	.meubles {
		height:70px;
		width:255px;
		padding-left:50px;
		background:url(images/garde-meubles.jpg) no-repeat;
	} 
	.meublestexte {
		padding-left:50px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#352c1d;
		text-decoration: underline;
	}
	.meublestexte a, .meublestexte a:visited{
		color:#352c1d;
		text-decoration: underline;
	}
	.meublestexte a:hover{
		color:#c4564d;
		text-decoration: underline;
	}
    .maincontent {
		position:absolute;
		top:325px;
		left:255px;
		padding:35px;
		color:#ffffff;
		height:800px;
		width:658px;
		background:url(images/fond-contenu-contact.gif) no-repeat;
		/*background-color: #F5F5F5;*/
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#352c1d;
    } 
    .maincontent2 {
		position:absolute;
		top:920px;
		left:255px;
		padding-left:35px;
		padding-right:35px;
		color:#ffffff;
		width:658px;
		background:url(images/fond-contenu2.gif) repeat-y;
		/*background-color: #F5F5F5;*/
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#352c1d;
    } 
	
	.logo {
		height:79px;
		margin-left:255px;
		width:374px;
		color:#ffffff;
		background: #666666;
		
    } 
	.fondicones {
		margin-left:255px;
		height:183px;
		width:374px;
		background:url(images/fondiconesindex.jpg) no-repeat;
	}
	.icones1 {
		height:32px;
		width:380px;
		padding-left:60px;
		padding-top:6px;
    } 
	.icones1texte {
		height:43px;
		width:380px;
		padding-left:55px;
		padding-top:20px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#352c1d;
    } 
	.icones1texte a, .icones1texte a:visited{
		color:#352c1d;
		text-decoration: underline;
	}
	.icones1texte a:hover{
		color:#cb3673;
		text-decoration: underline;
	}
	.icones2 {
		height:32px;
		width:380px;
		padding-left:50px;
    }	
	.icones2texte {
		height:43px;
		width:380px;
		padding-left:55px;
		padding-top:20px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:0.75em;
		color:#352c1d;
    }
.icones2texte a, .icones2texte a:visited{
		color:#352c1d;
		text-decoration: underline;
	}
	.icones2texte a:hover{
		color:#cb3673;
		text-decoration: underline;
	}
	.titreiconeicone {
		height:63px;
		display:inline; float:left;
		width:189px;
		background:url(images/trans-titre.gif) no-repeat;
    } 
	.titreiconetitre {
		height:63px;
		display:inline; float:left;
		width:185px;
		background-color:#FFFFFF;
    } 
	.imagerubrique {
		position:absolute;
		top:0px;
		left:629px;
		width:354px;
		height:325px;
		background:url(images/particulier-image.jpg) no-repeat;
    } 
	h1 {
		display: inline;
		font-family:Arial, Helvetica, sans-serif;
		font-size:15px;
		color:#575757;
		text-transform:uppercase;
	}
	h2 {
		display: inline;
		line-height:17px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;
		color:#cb3673;
		text-transform:uppercase;
	}
	h3 {
		padding-left:20px;
		display: inline;
		line-height:17px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;
		color:#575757;
	}
	.footer {
		width:983px;
		height:100px;
		background:url(images/footer.jpg) no-repeat;
		background-color: #F5F5F5;
	}
    /* Diverses classes à réutiliser */
    .fltrt { /* cette classe permet de rendre flottant le côté droit d'un élément dans la page. L'élément flottant doit précéder l'élément à côté duquel il doit se trouver dans la page. */
    	float: right;
    	margin-left: 8px;
    }
    .fltlft { /* cette classe permet de rendre flottant le côté gauche d'un élément dans la page */
    	float: left;
    	margin-right: 8px;
    }
    .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;
    }

