/* Start of CMSMS style sheet 'Barrallon' */
/* CSS Document */
	/* Orange : #e89c39; RVB = 232 156 57 */
	/* Vert : #72b220; RVB = 114 178 32 */
	/* Bleu texte : #0076ab; RVB = 0 118 171 */
	/* Bleu fond : #b0c3e0; RVB = 176 195 224 */
/* ***************************************************************************** */
/* *************************    PRESENTATION GENERALE    *********************** */
/* ***************************************************************************** */
html, body  {
	width:100%;
	height:100%;
}
body  {
/* on definit l'arriere plan du site */
	width:100%;
	height:90%;
	background: #ffffff url(images/barrallon/fondbody.gif) top left repeat;
/* on supprime toutes les valeurs par defaut des marges et bordures de l'elements BODY*/
	margin:0px;
	padding:0px;
	border:0px;
}
div#index {
/* on definit les caracteristiques principales de la PAGE */
	width:760px; /* largeur fixe 780px ou 980px */
	height:560px;
	margin:30px auto;/* pour centrer le contenu */
	background: #fff url(images/barrallon/index.jpg) top left no-repeat;
	border: 1px solid #bdbdbd; /* bordure de la page */
	position:relative;
}
div#index a {
	position: relative;
	top: 120px;
	left: 500px;
	display: block;
	width: 200px;
	height: 35px;
	line-height: 35px;
	font-family: verdana;
	font-size: 18px;
	color: #00763a;
	font-weight: bold;
	text-decoration: underline;
	font-style: italic;
}
div#index a:hover {
	color:#e89c39;
}
div#global {
/* on definit les caracteristiques principales de la PAGE */
	width:760px; /* largeur fixe 780px ou 980px */
	margin:30px auto;/* pour centrer le contenu */
	font-family:Arial, Helvetica, serif;/* choix de la police */
	font-size:12px;
	background: #fff url(images/barrallon/fond.jpg) top left no-repeat;
	border: 1px solid #bdbdbd; /* bordure de la page */
}
#global img, p, ul, li, h1, h2, h3, div {
/* on supprime toutes les valeurs par defaut des marges et bordures des elements BLOCS */
	border:0px;
	padding:0px;
	margin:0px;
}
#global h2, h3 {
/* on applique la couleur tonique aux TITRES */
	font-weight:bold;
	color:#00763a;
	margin:20px 0px;
	font:Arial, Helvetica, sans-serif;
	font-size:18px;
	text-align:justify;
}
#global h1 {
	color:#00763a;
	font-size:20px;
        border-bottom: 2px #6eb21e solid;
        width:460px;
        padding-bottom: 10px;
        margin-bottom: 10px;
}
#global a {
/* on definit la presentation des LIENS */
	font-weight:bold;
	text-decoration:underline;
	color:#0076ab;  /* generalement couleur tonique */
}
#global a:hover {
/* on definit l'effet sur les LIENS SURVOLES */
	color:#72b220;
}
#global .trait {
	position:relative;
	top:180px;
	left:235px;
	width:460px;
	height:2px;
	background-color:#6eb21e;
	font-size:2px;
}
.clear {
	clear:both;
}
/* ****************************************************************************** */
/* ********************               STRUCTURE PAGE             ****************** */
/* ****************************************************************************** */


/* ####### ZONE 2 - GAUCHE ######## */
div#gauche{
/* position */
	position:relative;
	float:left;
	left:0px;
	top:50px;
/* dimension */
	width:200px;
	height:500px;
}
#gauche ul{
	margin-top:120px;
	margin-left:0px;
	list-style-type:none;/* on supprime les puces */
	font-size:16px;  /* taille de la police du menu */
	font-weight:bold;
}
#gauche li a {
	display:block;
	width:180px;
	height:30px;
	line-height:30px;
	text-decoration: underline;
	color:#fff;
	padding-left:20px;
        margin-bottom: 10px;
}
#gauche li a:hover {
	text-decoration: underline;
	background-color:#fff;
}
#gauche br {
	height:10px;
	line-height:10px;
}

/* #######  DIV CONTENU   ######## */
#contenu {
	position:relative;
	float:left;
	top:180px;
	left:35px;
	padding-right:20px;
	width:520px; /* occupe toute la largeur du div droite */
	line-height:20px;
	background-color:transparent;
	text-align:justify;
	padding-bottom:200px;
}
#contenu p {
	margin-right:25px;
}
#contenu h3 {
	margin: 25px 0px 5px 0px;
	text-indent: 50px;
	font-size: 18px;
	height:40px;
	line-height:40px;
	background:transparent url(images/barrallon/produits/babet.jpg) top left no-repeat;
}
#contenu p.contact {
	height:20px;
	line-height:20px;
	margin-left:70px;
	font-size:16px;
}
#contenu p.contact2 {
	height:20px;
	line-height:20px;
	margin-left:70px;
	font-size:20px;
}

#contenu div {
	float:left;
}
#contenu ul {
	margin-left: 40px;
	width: 420px;
	list-style-type: disc; /* on supprime les puces */
}
em {
	color:#6eb21e;
	font-style:italic;
	font-size:16px;
	font-weight:bold;
}
em.rha {
	font-size: 12px;
	vertical-align: 5px;
}

/* #######  IMAGE CENTREE DANS LE CONTENU   ######## */
#contenu div.imgcentre {
	text-align:center;
	margin-top:10px;
	width:500px; /*(520px - padding-right:20 px = 500px ) */
}
#contenu img.imggauche {
	float:left;
	margin:5px 30px 10px 0px;
}

#contenu img.imgdroite {
	float:right;
	margin:5px 20px 10px 30px;
}

#contenu a:hover {
	color:#e89c39;
}
#contenu div.espace {
	clear:both;
	width:400px;
	height:32px;
	margin :0px auto;
	background-color:transparent;
}
#contenu div.petitespace {
	clear:both;
	width:400px;
	height:16px;
	margin :0px auto;
	background-color:transparent;
}
#contenu br {
	height:20px;
	line-height:20px;
}
#contenu br.petit {
	height:10px;
	line-height:10px;
}

#pied {
	clear:both;
}

#ref a {
        color: #00763a;
        font-size: 11px;
}
# ref a:hover {
        color:#e89c39;
}
/* End of 'Barrallon' */