/* KHNAV */

/*******************************/
/* trucs pour mobiles et accessibilité, à pas voir en dehors de ces cas */

/*Menu spécial smartphone, invisible sinon */
#khnav_mobile div.khnav_menu-icon {
    display:none; 
}

/* lien d'évitement ; pour accessibilité */
.khnav_skip,
.khnav_skip a
{
	position: absolute;
	left:-1000px;
}

/*******************************/
/* Général */
.khnav_menu a,
.khnav_menu a:link,
.khnav_menu a:hover,
.khnav_menu a:visited
{
	text-decoration:none;
	color:#0D58A6;
	font-weight:normal;
	display:inline-block;
	width:100%;
}
.khnav_menu a:hover
{
	font-weight:bold;
}

#khnav
{
	/* position:absolute; enlevé pour éviter que les éléments des cms passent dessous*/
	margin-bottom:0;
	left:0px;right:0px;
	top:0px;height:35px;
	z-index:10000;
	padding-left:10%;
	
	background-color: rgba(255, 255, 255, 0.6);
	color:#0D58A6;

	font-size: 14px;
	-webkit-text-size-adjust: 100%;
	font-weight: normal;
	font-family: "Verdana","Arial","Helvetica",sans-serif;
}

ul.khnav_menu
{
	float:left;
	list-style: none;
	padding:0;
	margin-top:0px;
	text-decoration: none;
	padding-left:24px;
	z-index:10000;
}
ul.khnav_menu li
{
	float:left;
	line-height:0em;
	margin:0px 0px;
	padding-top:14px;
}

ul.khnav_menu li.khnav_logo
{
	margin-top:-8px;
	height:24px;
	margin-right:14px;
}
ul.khnav_menu li.khnav_menu
{
	margin-top:2px;
	/* position:relative; */

	margin-right:25px;
	padding-left:5px;
	padding-right:5px;

	height:20px;
}


/* Le triangle pour dire "dépliez moi" */

.kh_caret:before {
  content: '';
  position: relative;
  border-top: 6px solid #4188D3;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  
  margin-left:105%;
}
	/* parce que mozilla est tout crado pour ça */
@-moz-document url-prefix() 
{
    .kh_caret:before {
        top:8px
    }
}

/* La partie qui se déplie */

ul.khnav_dropdown
{
	/* En supprimant cette ligne et en ajoutant la largeur dans ul.khnav_menu li.khnav_menu
	   le menu s'agrandira a la taille du menu déroulant,
	   mais je trouve que c'est une mauvaise idée car cela déplace les autre menus
	   ce qui est, à mon avis, plus frustrant qu'utile quand celui ci-va fuir la souris
	   lorsque que le menu precédent va retrouver sa taille.
	   De plus, des menus qui bougent sans arrêt cela donne un resultat brouillon, moin lisible et moin agréable au final.
	   je préfere la stabilité, qui au final ne rend pas les choses si moche que ça.
	*/
	position:absolute;
	/* Pour les test/design, ne commenter/desactivé que cette ligne 
	   si vous voulez que le menu déroulant reste affiché sans devoir passer la souris dessus
	*/
	display:none;
	z-index:10000;
	
	padding:0;
	margin-top:20px; /* pose souci avec le triangle */
	list-style: none;
	left:inherit;margin-left:-5px;
	top:5px; /*pose souci suivant les cms... */
	background-color:#ffffff;
	width:auto;
	
	/* Adapter la largeur en fonction de l'entrée la plus longue
       pour eviter que le menu ne se redimensionne en passant dessus.
	   Inutile de se prendre la tête avec un systeme dynamique pour un menu qui
	   n'est pas destiné a changer dynamiquement voir même quasiment jamais.
	*/
	min-width:272px;
	padding-bottom:14px;
}
ul.khnav_menu li.khnav_menu:hover ul.khnav_dropdown
{
	display:block;
}
ul.khnav_dropdown li.khnav_menu:after
{
	float:none;position:absolute;
	margin:0;padding:0;
	content:'';

}
ul.khnav_dropdown li.khnav_menu:after
{
	content: '';
	width: 0; height: 0; 
	border-top: 10px solid transparent; 
	border-right: 20px solid #4188D3; 
	border-bottom: 10px solid transparent;

	line-height:0.8em;
	margin-right:-4px;
	right:0px;
	
    opacity: 0;
    transition: opacity 0.5s;
}
ul.khnav_dropdown li.khnav_menu:hover:after
{
	content: '';
	opacity: 1;
}

ul.khnav_dropdown li.khnav_menu
{
	float:none;
	clear:both;
	white-space:nowrap;

	font-weight:normal;
	display:block;

	height:auto;
	padding-right:14px;
	padding-left:14px;
	
	padding:5px 14px;
	padding:5px 0px;
	width:97%;
	padding-left:3%;
}

ul.khnav_menu li.khnav_menu:hover
{
	color:#0D58A6;

	background-color:#ffffff; 
	border-radius: 8px 8px 0px 0px;
}


ul.khnav_dropdown:hover li.khnav_menu:hover
{

	font-weight:bold;
	border-radius: 0px 0px 0px 0px;
	background-color:#ddddff; 
	
}

/* Séparation des liens dans le menu déroulant.
   On utilise simplement un <hr /> dans un "khnav_menu".
*/

ul.khnav_dropdown li.khnav_hr:after,
ul.khnav_dropdown li.khnav_hr:hover:after
{
	content:'';
	border:none;
}

ul.khnav_dropdown li.khnav_hr
{
	border:none;
}
ul.khnav_dropdown:hover li.khnav_hr:hover
{
	background-color:#ffffff;
}


.khnav_tooltip
{
	position:absolute;
	
	line-height:1.3em;
	margin:0;padding:0px;
	left:272px;
	top:inherit;margin-top:-20px;

	width:100%;height:auto;
	white-space:normal;
	
	
}
.khnav_tooltip header
{
	background-color:#4188D3;
	color:#ffffff;
	padding:6px;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	border-radius:5px 5px 0px 0px;
	
    opacity: 0;
    transition: opacity 1.0s ease-in;
    transition: opacity 0.5s ease-out;
}
.khnav_tooltip p
{
	margin:0;
	background-color:#ffffff;
	color:#0D58A6;
	padding:14px;
	border-radius:0px 0px 5px 5px;
	border:solid 1px #0D58A6;
	
    opacity: 0;
    transition: opacity 1.8s ease-in;
    transition: opacity 0.5s ease-out;
}
ul.khnav_menu li.khnav_menu ul.khnav_dropdown li.khnav_menu:hover .khnav_tooltip,
ul.khnav_menu li.khnav_menu ul.khnav_dropdown li.khnav_menu:hover .khnav_tooltip p,
ul.khnav_menu li.khnav_menu ul.khnav_dropdown li.khnav_menu:hover .khnav_tooltip header
{
	display:block;
    opacity: 1;
}
ul.khnav_dropdown:hover .khnav_tooltip
{
	font-weight:normal;	
}



li.khnav_menu hr 
{
	padding:0px;
	padding-bottom:-1.2em;
	margin:0px;
	
	padding-left:2px;
	padding-right:2px;
	
	height:1px;
	
	border:none;
	border-top:solid 1px #000;
	border-color: #e5e5e5;

    overflow: hidden;
}

li.khnav_menu img
{
	height:14px;
	margin-right:4px;
}

/*******************************/

/* SEARCH */
.khnav_search,
.khnav_search iframe
{
	margin:0;padding:0;
	height:35px;
	float:right;
	margin-right:25px;
}
.khnav_search input[type="text"]
{
	margin:0px;padding:0 4px;
	margin-top:0.5em;
	font-size:1em;
	
	border-top-left-radius: 5px 5px;
	border-bottom-left-radius: 5px 5px;
	border:solid 1px #ffffff;
}

.khnav_search input[type="submit"]
{
	margin:0;padding:0 4px;
	margin-left:-4px;
	font-size:1em;
	
	border-top-right-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
	border:none;
	
	background-color:#4188D3;
	color:#ffffff;
	
	font-family: "Verdana","Arial","Helvetica",sans-serif;
}


/*******************************/

/* KHFOOTER - style du module khfooter.php */
#khfooter {
	clear:both;
	margin : 1em auto 2em auto; 
	bottom:0;
	
	text-align: center;
	background-color: rgba(255, 255, 255, .6);
	border-radius:10px;
	width:70%;
	font-weight:normal;
	letter-spacing:.15em;
	font-size:7pt;
	padding:3px;
	
}
#khfooter a {
	font-weight:normal;
	letter-spacing:.15em;
	font-size:7pt;
	text-decoration:none;
}

#khfooter a:link, a:visited {
    color: #2b73b7;
    text-decoration: none;
}