body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.7em;
margin: 0;
padding: 0;
}
#textehaut {
height: 14px;
}
#header {
height: 168px;
}
#haut {
height: 30px;
}
#conteneur {
position: relative;
width: 950px;
margin: 0 auto;
margin-top:0px;
background-image:url(../image/sites-internet-chambery.gif);
}
#centre {
margin-left: 20px;
margin-right: 20px;
}
#centrereference {
margin-left: 40px;
margin-right: 40px;
}
#gauche {
position: absolute;
left:0;
width: 150px;
}
#droite {
position: absolute;
right:0;
width: 150px;
}
#pied {
background-image:url(../image/site-web-chambery.gif);
height: 30px;
}

.h1 {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; line-height:16px; margin-top:5px; margin-bottom:5px; color:#355a87; font-weight: normal; font-variant: normal; text-align: left;}
 
.h2 {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height:30px; color:#983116; font-weight:normal; font-variant: normal; text-align: left;}

.texte {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:15px; color:#666666; font-weight: normal; font-variant: normal; text-align: left;}
.textebleugras { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; line-height:16px; color:#355a87; font-weight:bold; text-align: left;}
.textebleugrasgros { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; line-height:16px; color:#355a87; font-weight:bold; text-align: left;}
.texteorange {font-family:Geneva, Arial, Helvetica, sans-serif; font-size: 12px; line-height:16px; color:#FF6600; font-weight: bold; font-variant: normal; text-align: left;}
 
.textenews { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:15px; color:#333333; font-weight: normal; font-variant: normal; text-align: left;}
 
.pointorange {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:15px; color:#FF6600; font-weight: normal; font-variant: normal; text-align: left;}
 
.titreorange {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 16px; line-height:15px; color:#FF6600; font-weight: bold; font-variant: normal;}

.titrereference { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 22px; line-height:16px; color:#FF6600; font-stretch:condensed; text-align: left;}
.textebleugrasref { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; line-height:16px; padding-top:20px; margin-top:18px; color:#355a87; font-weight:bold; text-align: left;}

.titrecontact {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:15px; color:#FFF; font-weight: bold; font-variant: normal; text-align: left;}
.textecontact {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:15px; color:#000; font-weight: bold; font-variant: normal; text-align: left;}
 
.textehaut {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9px; line-height:12px; color:white;}

.textebas {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height:12px; color:white;}

.menu_linkstexte:link {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:15px; color:#355a87; font-weight: normal; font-variant: normal;  text-align: left; text-decoration:underline;}
.menu_linkstexte:visited {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:15px; color:#355a87; font-weight: normal; font-variant: normal;  text-align: left; text-decoration:underline;}
.menu_linkstexte:hover {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:15px; background-color:#7193bf; color:#FFF; font-weight: normal; font-variant: normal;  text-align: left; text-decoration:none;}

.menu_linksclient:link {font-family:font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; line-height:16px; color:blue; font-weight: normal; font-variant: normal;  text-align: left; text-decoration:underline;}
.menu_linksclient:visited {font-family:font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; line-height:16px; color:blue; font-weight: normal; font-variant: normal;  text-align: left; text-decoration:underline;}
.menu_linksclient:hover {font-family:font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; line-height:16px; color:#FF6600; font-weight: normal; font-variant: normal;  text-align: left; text-decoration:none;}
	
.menu_linksbas:link { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height:12px; color:white; font-weight:normal; text-align:left; text-decoration:none;}
.menu_linksbas:visited {
font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height:12px; color:white; font-variant:normal; text-align:left; text-decoration:none;}
.menu_linksbas:hover {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height:12px; color:#CCCCCC; font-weight:normal; text-align:left; text-decoration:none;}
		
.menu_linksretour:link {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height:15px; color:#FF6600; font-weight: normal; font-variant: normal; text-align: left; text-decoration:underline;}
.menu_linksretour:visited {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height:15px; color:#FF6600; font-weight:normal; font-variant:normal; text-align:left; text-decoration:underline;}
.menu_linksretour:hover {font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height:15px; color:#FF6600; font-weight: normal; font-variant: normal; text-align: left; text-decoration:underline;}

/*Bordure accueil */
	div.expandable_note_box {width: 290px; min-height: 100px; background-image: url("../image/top.gif"); background-position: top left;	background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box div.middle { width: 290px; height: 280px; background-image: url("../image/middle.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box div.inside {padding-left: 20px; padding-right:15px; width: 255px;}

/*Bordure création site - grand */	
	div.expandable_note_box2 {width: 600px; min-height: 100px; background-image: url("../image/top2.gif"); background-position: top left; background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box2 div.middle { width: 600px; height: 490px; background-image: url("../image/middle2.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box2 div.inside {padding-left: 20px; padding-right:15px; width: 560px;}
	
/*Bordure création site - petit */
	div.expandable_note_box4 {width: 290px; min-height: 100px; background-image: url("../image/top.gif"); background-position: top left;	background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box4 div.middle { width: 290px; height:490px; background-image: url("../image/middle.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box4 div.inside {padding-left: 20px; padding-right:15px; width: 255px;}

/*Bordure reprise site - grand */	
	div.expandable_note_box7 {width: 600px; min-height: 100px; background-image: url("../image/top2.gif"); background-position: top left; background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box7 div.middle { width: 600px; height: 406px; background-image: url("../image/middle2.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box7 div.inside {padding-left: 20px; padding-right:15px; width: 560px;}
	
/*Bordure reprise site - petit */
	div.expandable_note_box8 {width: 290px; min-height: 100px; background-image: url("../image/top.gif"); background-position: top left; background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box8 div.middle { width: 290px; height:406px; background-image: url("../image/middle.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box8 div.inside {padding-left: 20px; padding-right:15px; width: 255px;}
	
/*Bordure hébergement - grand */	
	div.expandable_note_box5 {width: 600px; min-height: 100px; background-image: url("../image/top2.gif"); background-position: top left; background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box5 div.middle { width: 600px; height: 582px; background-image: url("../image/middle2.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box5 div.inside {padding-left: 20px; padding-right:15px; width: 560px;}
	
/*Bordure hébergement - petit */
	div.expandable_note_box6 {width: 290px; min-height: 100px; background-image: url("../image/top.gif"); background-position: top left;	background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box6 div.middle { width: 290px; height:58	2px; background-image: url("../image/middle.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box6 div.inside {padding-left: 20px; padding-right:15px; width: 255px;}

/*Bordure référencement - grand */	
	div.expandable_note_box9 {width: 600px; min-height: 100px; background-image: url("../image/top2.gif"); background-position: top left; background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box9 div.middle { width: 600px; height: 500px; background-image: url("../image/middle2.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box9 div.inside {padding-left: 20px; padding-right:15px; width: 560px;}
	
/*Bordure référencement - petit */
	div.expandable_note_box10 {width: 290px; min-height: 100px; background-image: url("../image/top.gif"); background-position: top left;	background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box10 div.middle { width: 290px; height:500px; background-image: url("../image/middle.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box10 div.inside {padding-left: 20px; padding-right:15px; width: 255px;}

/*Bordure contact - grand */	
	div.expandable_note_box11 {width: 600px; min-height: 100px; background-image: url("../image/top2.gif"); background-position: top left; background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box11 div.middle { width: 600px; height: 365px; background-image: url("../image/middle2.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box11 div.inside {padding-left: 20px; padding-right:15px; width: 560px;}
	
/*Bordure contact - petit */
	div.expandable_note_box12 {width: 290px; min-height: 100px; background-image: url("../image/top.gif"); background-position: top left;	background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box12 div.middle { width: 290px; height:365px; background-image: url("../image/middle.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box12 div.inside {padding-left: 20px; padding-right:15px; width: 255px;}
	
	/*Bordure reprise site - grand */	
	div.expandable_note_box13 {width: 600px; min-height: 100px; background-image: url("../image/top2.gif"); background-position: top left; background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box13 div.middle { width: 600px; height: 436px; background-image: url("../image/middle2.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box13 div.inside {padding-left: 20px; padding-right:15px; width: 560px;}
	
/*Bordure reprise site - petit */
	div.expandable_note_box14 {width: 290px; min-height: 100px; background-image: url("../image/top.gif"); background-position: top left; background-repeat: no-repeat; padding-top: 20px; font-size: 80%;}
	div.expandable_note_box14 div.middle { width: 290px; height:436px; background-image: url("../image/middle.gif"); background-position: center; background-repeat: repeat-y;}
	div.expandable_note_box14 div.inside {padding-left: 20px; padding-right:15px; width: 255px;}

/*	Vertical Accordions page référence	*/
		
		.accordion_toggle {
			display: block;
			height: 26px;
			width: 850px;
			background: url(images/accordion_toggle.jpg) no-repeat top right #c0dcec;
			padding: 0 8px 0 8px;
			line-height: 26px;
			color: #ffffff;
			font-weight: normal;
			text-decoration: none;
			outline: none;
			border-bottom: 1px solid #ffffff;
			cursor: pointer;
			margin: 0 0 0 0;
		}
		
		.accordion_toggle_titre { font-size: 12px;
			color: black;
			font-weight:bold;
		}
		.accordion_toggle_titre_petit { font-size: 12px;
			color:#333333;
		}
		
		.accordion_toggle_voir { font-size: 12px;
		text-decoration:underline;
			color:#a64301;
		}
		
		.accordion_toggle_active {
			background: url(images/accordion_toggle_active.jpg) no-repeat top right #e99754;
			color: #ffffff;
			border-bottom: 1px solid #f68263;
		}
		
		.accordion_content {
			background-color: #ffffff;
			color: #444444;
			overflow: hidden;
			width: 850px;
			height: 100%;
		}
			
			.accordion_content h2 {
				margin: 15px 0 5px 10px;
				color: #0099FF;
			}
			
			.accordion_content p {
				line-height: 150%;
				padding: 5px 10px 15px 10px;
			}
			
		.vertical_accordion_toggle {
			display: block;
			height: 30px;
			width: 600px;
			background: url(images/accordion_toggle.jpg) no-repeat top right #a9d06a;
			padding: 0 10px 0 10px;
			line-height: 30px;
			color: #ffffff;
			font-weight: normal;
			text-decoration: none;
			outline: none;
			font-size: 12px;
			color: #000000;
			border-bottom: 1px solid #cde99f;
			cursor: pointer;
			margin: 0 0 0 0;
		}

		.vertical_accordion_toggle_active {
			background: url(images/accordion_toggle_active.jpg) no-repeat top right #e0542f;
			color: #ffffff;
			border-bottom: 1px solid #f68263;
		}

		.vertical_accordion_content {
			background-color: #ffffff;
			color: #444444;
			overflow: hidden;
		}

			.vertical_accordion_content h2 {
				margin: 15px 0 5px 10px;
				color: #0099FF;
			}

			.vertical_accordion_content p {
				line-height: 150%;
				padding: 5px 10px 15px 10px;
			}
  			
		/*
			Horizontal Accordion
		*/
		
		.horizontal_accordion_toggle {
			/* REQUIRED */
			float: left;	/* This make sure it stays horizontal */
			/* REQUIRED */

			display: block;
			height: 100px;
			width: 30px;
			background: url(images/h_accordion_toggle.jpg) no-repeat top left #a9d06a;
			color: #ffffff;
			text-decoration: none;
			outline: none;
			border-right: 1px solid #cde99f;
			cursor: pointer;
			margin: 0 0 0 0;
		}
		
		.horizontal_accordion_toggle_active {
			background: url(images/h_accordion_toggle_active.jpg) no-repeat top left #e0542f;
			border-right: 1px solid #f68263;
		}
		
		.horizontal_accordion_content {
			/* REQUIRED */
			height: 100px;	/* We need to define a height for the accordion as it stretches the width */
			float: left;	/* This make sure it stays horizontal */
			/* REQUIRED */
			
			overflow: hidden;
			background-color: #ffffff;
			color: #444444;
		}
			
			.horizontal_accordion_content p {
				width: 450px;
				line-height: 150%;
				padding: 5px 10px 15px 10px;
			}
					
					
    /* Container styling*/
    #horizontal_container {
      margin: 5px auto 20px auto;
      width: 850px;   
      height: 180px;    
    }
    
    #vertical_nested_container {
      margin: 20px auto 20px auto;
      width: 620px;
    }

	</style>