/* fenetres pour saisie identifiants choristes */
#menu {								/* position et forme du menu */
	width: 98% ; /*1100px ; /* 1.12.14 900px; /* essai 7.2.111 725px;/*655px;*/
	height: 40px; /* 1.12.14 30px ; /* 31.1.11 40px;*/
	margin: 5px auto 0px auto ; /* 14.2.11 10px auto ; /* 7.2.11 0px auto; */
	-margin: 5px auto 0px auto ; /* 14.2.11 10px 0px 10px 200px; /* IE6 7.2.11 */
	text-align: center;
	z-index: +1; /* 31.1.11 */
}

#menu a {						/* aspect des titres du menu */
	text-decoration: none; /* 31.1.11 */
	display: block;
	float: left;
	width: 220px; /* 31.12.14 250px; /* 1.12.14 145px; /* 7.2.11 139px;/*107px;*/
	height: 40px; /* 1.12.14 20px;
	margin: 0;  /* 7.2.11  1px;*/
	padding-top: 10px; /* 30.1.11 20px; */
	text-align: center; /* 4.5.11 left; /* 31.1.11 center; */
	color:#CC0000;/* #FF6600;*/
	font-weight: bold;
	font-style: italic;
	font-size: 20px;
	background-image: url(../image_outil/boutons-2.superlarge.jpg) ; /* 1.12.14  .png remplac par superlarge.jpg */
	background-repeat: no-repeat;
	background-position: 0 5px;
}

#menu a:hover {					/* aspect au survol du menu */
	color: white;
	display: inline;
	height: 40px; /* 1.12.14 20px; /* 19.2.11 30px;*/
	padding-top: 10px;
	background-position: 0 -100px; 
	border-radius: 15px;
	border-shadow:  15px  15px 15px black ;
}

/* AP 11.1.11 il ne doit plus beaucoup servir,le menu-2*/
#menu-1 {
	float: left;
	width: 210px;
	margin-left: 30px;
}

#menu-1 ul, #menu-2 ul {
	list-style: none;	
}

#menu-1 li, #menu-2 li {
	display: inline; 
}

#menu-1 a, #menu-2 a {
	display: block;
	float: left;
	width: 207px;
	height: 30px;
	margin: 0 1px;
	padding-top: 20px;
	padding-right: auto ;  /* AP 14.1.11 */
	text-align: center;
	color: #CC0000;
	font-weight: bold;
	/* AP 14.1.11 font-style: italic; */
	font-style:normal ;
	font-size: 1.3em;
	/* AP 14.1.11 background: url(../images/boutons-2.png) 0 15px no-repeat; */
	background: url(../images/boutons-2.png) 0 30px no-repeat; /* AP 14.1.1 */
}

#menu-1 a:hover {
	display: block;
	height: 40px;
	background-position: 0% -100px;		
}

#menu-2 {
	float: right;
	width: 140px;
}

#menu-2 a {
	padding-left: auto;
	background: url(../images/boutons-2.png) 0 15px no-repeat;
}

#menu-2 a:hover {
	display: block;
	height: 20px;
	background-position: 0 -100px;		
}

/*  menu vertical */
#menuautour {
	width: 160px;  /* 16.2.15  280px; */
	float:left ;
	top: 0;
	left: 0;
	margin-top:20px;
}

#menu-g {
	/*  display:inline-block ; */
	float:left; /* // 24.1.17 AP  */
	vertical-align: top;
	/*float:left;   remplacé par inline-block*/
	max-width: 15% ; /*200px; */
	width: 15%/* 19.2.15 150px; /*250px; /*15%; */
	height:auto;
	min-height: 300px;
	margin-top: 1% ; /*  21.2.15 20px; */
	margin-left:3px; /* 23.2.15 */
	border:groove;
	word-wrap: border-word;
	
	background-color:#CCCCCC;
	border-radius: 10px;
	border-shadow: 10px 10px 10px black;
	/* overflow:hidden;   surtout pas   21.2.15*/
}

#menu-g  ul{
	padding: 3% 1%;
	clear:both;
}


#menu-gp {
	float:left; 
	max-width: 15% ; /*200px; */
	width: 15%/* 19.2.15 150px; /*250px; /*15%; */
	height:auto;
	min-height: 300px;
	margin-top: 1% ; /*  21.2.15 20px; */
	margin-left:  1px; /* 18.3.153px; /* 23.2.15 */
	border:groove;
	word-wrap;
	background-color:#CCCCCC;   /* // 16.1.17 AP#00CC33;  */
	border-radius: 10px;
	border-shadow: 10px 10px 10px black;
	/* overflow:hidden;   surtout pas   21.2.15*/
}

#menu-gxxl {
	float:left; 
	width:20%; /* 19.2.15 270px; /*15%; */
	height:auto;
	margin-top:20px;
	border:groove;
	background-color:#CCCCCC;
	border-radius: 5px;
	border-shadow: 5px 5px 5px black;
}

#menu-gxl {
	float:left; 
	width:18%; 
	height:auto;
	margin-top:20px;
	border:groove;
	background-color:#CCCCCC;
	border-radius: 5px;
	border-shadow: 5px 5px 5px black;
}
#menu-gxl ul {
margin-left:0;
}

#menupublic {
	width: 160px;
	float:left ;
	top: 0;
	left: 0;
}

/*
 @media (orientation:portrait)
  {
  		#menupublic {
			width:100%;
			float:none;
		}
  }	
  */
#menupublic a {color:#menupublic a {color:#FF0000}}

#menu-s {
	width:  260px; /* 16.2.15 300px*/
	float:left;
	top:0;
	left:0;
}

/* fond blanc pour le menu */ 
/* AP 18.1.11 #menu-s a {color:#000000} */
#menu-s a {color:#menu-s a {color:#FF0000}}

#menu-s ul {
	padding: 0;
	width:260px; /* 16.2.15 290px; /*12.6.11 300px; */
	border:1px solid;
	margin:0px;
	background: white;
	font-weight: bolder;
	font-size: 25px;
	border-radius: 5px;
	border-shadow: 5px 5px 5px;
}

/* fond different au survol de la souris pour les sous menu et les "basiques"*/ 
#menu-s li:hover {background: #EDD}
#menu-s li.sousmenu:hover {background: #EBB;}

/* Rajout d'une petite fleche pour les sous menu */ 
/*#menu-s li.sousmenu {background: url(/images/fleche.gif) 95% 50% no-repeat;} */



#menu-s ul li {position:relative; list-style: none; border-bottom:1px solid;}
/* 26.2.15 #menu-s ul ul {position: absolute; top: -1px; left: 300px; display:none} */
#menu-s ul ul {position: absolute; top: -1px; left: 300px; display:none

/* on rajoute une bordure a gauche et des padding, on doit donc rajuster la taille 100-(8 de bordure + 8 de padding) =84 */ 
#menu-s li a {text-decoration: none; padding: 4px 0 4px 8px; display:block; border-left: 8px solid #BBB; width:284px}
#menu-s ul.niveau1 li.sousmenu:hover ul.niveau2, 
#menu-s ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}

/* la bordure de chaque hauteur a une couleure de survol*/ 
#menu-s li a:hover {
	/*2.2.11_background:none ; /* 1.2.11  IE6 */
	border-left-color: red;
	font-weight:bold;  /*AP 16.1.11 */
	border-shadow: 10px 10px 10px black;
}
#menu-s ul ul li a:hover {
	border-left-color: #00FF00;
	/*2 2 11_background:none ; /* 1.2.11  IE6 */
	border-shadow: 10px 10px 10px black;
}

#menu-s ul ul ul li a:hover {
	border-left-color: #0000FF;
	_background:none ; /* 1.2.11  IE6 */
	background-color: #99CC99;
	border-shadow: 10px 10px 10px black;
}

#nav {
	background:url(../images/new/nav.gif);
	height:43px;
	width:1200px; /*847px;*/
	font-size:16px ;
	font-weight:bold;
}

#navperso {
	background:url(../images/new/nav.gif);
	height:43px;
	width:1200px; /*1200px;*/
	font-size:16px ;
	font-weight:bold;
}

/*********************   NAVIGATION            menu public ******************************
#navigation {
  width: 100%;/*19.2.15 150px; */
  list-style: none;
  /*margin-top: 20px; */
  padding: 0;
  float:left;
  box-shadow: 10px 10px 10px black;
}

#navigation li {
   background: #c00 ;
  color: #fff ;
  border: 1px solid #600 ;
  margin-bottom: 2px ;
  border-radius:5px;
}
/*
 @media (orientation:portrait)
  {
  		#navigation li {
			float:left;
		}
  }	
  */

#navigation li a {
  display: block ;

  font: 1.2em "Trebuchet MS",Arial,sans-serif ;
  line-height: 3em ;
  text-align: center ;
  text-decoration: none ;
  padding: 4px 0 ;
   /* background: #c00 ;
  color: #fff ;
    background: linear-gradient(to bottom, #c00 , #CCCC33);  */
}


#navigation li a:hover, #navigation li a:focus, #navigation li a:active {
  background:#6666CC; /* #900 ; */
  /* 2.3.15 text-decoration: underline ;*/
  box-shadow: 5px 5px 5px black inset;
}

#navigation  .vide {;
	/*background:#00CCFF ; */
	background-color:#00FFFF ;	
}

.sousmenu {
	border-radius: 5)x;
	border-shadow: 5px 5px 5px black;
}


ul#nav {
}
ul#nav li {
	display:inline;
}
ul#nav a {
	color:#FFFFFF;
	line-height:43px;
	padding:0 30px;
	border-right:#FFFFFF 1px solid;
}


ul#navperso {
}
ul#navperso li {
	display:inline;
}
ul#navperso a {
	color:#FFFFFF;
	line-height:43px;
	padding:0 25px;
	border-right:#FFFFFF 1px solid;
}

/* *****************   CSS3 MENU  ***********************/
// rajout AP 23.2.15
#css3menu1 {
	display:inline-block;
	vertical-align:top;
}

<!--<p class="_css3m"><a href="http://css3menu.com/">css menus</a> by Css3Menu.com</p>-->
ul#css3menu1,ul#css3menu1 ul{
	margin:0;
	list-style:none;
	padding:0;
	background-color:#dedede;
	border-width:1px;
	border-style:solid;
	border-color:#5f5f5f;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;}
	
ul#css3menu1 ul{
	display:none;
	position:absolute;
	left:100%;
	top:0;
	-moz-box-shadow:3.5px 3.5px 5px #000000;
	-webkit-box-shadow:3.5px 3.5px 5px #000000;
	box-shadow:3.5px 3.5px 5px #000000;
	background-color:#FFFFFF;
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-color:#d4d4d4;
	padding:0 10px 10px;}
	
ul#css3menu1 li:hover>*{
	display:block;}
	
ul#css3menu1 li{
	position:relative;
	display:block;
	white-space:nowrap;
	font-size:0;}
	
ul#css3menu1 li:hover{
	z-index:1;}
	
ul#css3menu1 ul ul{
	position:absolute;left:100%;top:0;}
	
ul#css3menu1{
	font-size:0;
	z-index:999;
	position:relative;
	display:block;
	float:left;
	padding:0;}
	
ul#css3menu1>li{
	margin:0;}
	
ul#css3menu1 a:active, ul#css3menu1 a:focus{
	outline-style:none;}
	
ul#css3menu1 a{
	display:block;
	vertical-align:middle;
	text-align:left;
	text-decoration:none;
	font:bold 14px Trebuchet MS;
	color:#000000;
	text-shadow:#FFF 0 0 1px;
	cursor:pointer;
	padding:10px;
	background-color:#c1c1c1;
	background-image:url(../image_outil/mainbk.png);
	background-repeat:repeat;
	background-position:0 0;
	border-width:1px 0 0 0;
	border-style:solid;
	border-color:#C0C0C0;}
	
ul#css3menu1 ul li{
	float:none;margin:10px 0 0;}
	
ul#css3menu1 ul a{
	text-align:left;
	padding:4px;
	background-color:#FFFFFF;
	background-image:none;
	border-width:0;
	border-radius:0px;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	font:14px Tahoma;
	color:#000;text-decoration:none;}
	
ul#css3menu1 li:hover>a,ul#css3menu1 li a.pressed{
	background-color:#0c97e2;
	border-color:#C0C0C0;
	border-style:solid;
	color:#000000;
	text-shadow:#FFF 0 0 1px;
	background-image:url(../image_outil/mainbk.png);
	background-position:0 100px;}
	
ul#css3menu1 span{
	display:block;
	overflow:visible;
	background-position:right center;
	background-repeat:no-repeat;
	padding-right:0px;}
	
ul#css3menu1 ul span{
	background-image: url(../image_outil/arrowsub.png);padding-right:12px;}
	
ul#css3menu1 > li.switch{
	display:none;
	cursor:pointer;
	width:25px;
	height:20px;
	padding:10px;}
	
ul#css3menu1 > li.switch:before{
	content:"";
	position:absolute;
	display:block;
	height:4px;
	width:25px;
	border-radius:4px;
	background:#000000;
	-moz-box-shadow:0 8px #000000, 0 16px #000000;
	-webkit-box-shadow:0 8px #000000, 0 16px #000000;
	box-shadow:0 8px #000000, 0 16px #000000;}
	
ul#css3menu1 > li.switch:hover:before{
	background:#000000;-moz-box-shadow:0 8px #000000, 0 16px #000000;-webkit-box-shadow:0 8px #000000, 0 16px #000000;box-shadow:0 8px #000000, 0 16px #000000;}
	
.c3m-switch-input{
	display:none;}
	
ul#css3menu1 li:hover>a,ul#css3menu1 li > a.pressed{
	background-color:#0c97e2;
	background-image:url(../image_outil/mainbk.png);
	background-position:0 100px;
	border-style:solid;
	border-color:#C0C0C0;
	color:#000000;
	text-decoration:none;
	text-shadow:#FFF 0 0 1px;}
	
ul#css3menu1 ul li:hover>a,ul#css3menu1 ul li > a.pressed{
	background-color:#FFFFFF;
	background-image:none;
	color:#0978b3;
	text-decoration:none;}
	
ul#css3menu1 li.topfirst>a{
	border-radius:5px 5px 0 0;
	-moz-border-radius:5px 5px 0 0;
	-webkit-border-radius:5px;
	-webkit-border-bottom-right-radius:0;
	-webkit-border-bottom-left-radius:0;}
	
ul#css3menu1 li.toplast>a{
	border-radius:0 0 5px 5px;
	-moz-border-radius:0 0 5px 5px;
	-webkit-border-radius:0;
	-webkit-border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;}
	
@media screen and (max-width: 1210px) {
	ul#css3menu1 > li {
		position: initial;}
		
	ul#css3menu1 ul .submenu,ul#css3menu1 li > ul {
		left: 0;
		 right:auto; 
		 top: 100%;}
		
	ul#css3menu1 .submenu,ul#css3menu1 ul,ul#css3menu1 .column {
		-webkit-box-sizing: border-box;
		 -moz-box-sizing: border-box; 
		 box-sizing: border-box;
		 padding-right: 0;
		 width: 100% !important;}
}
@media screen and (max-width: 1209px) {
	ul#css3menu1 {
		width: 100%;}
		
	ul#css3menu1 > li {
		display: none;
		position: relative;		
		width: 100% !important;}
		
	ul#css3menu1 > li.switch,.c3m-switch-input:checked + ul#css3menu1 > li + li {
		display: block;}
		
	ul#css3menu1 > li.switch > label {		
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;}}