/*
Couleurs : ocre : #b2ad00; jaune pâle : ffff7c 
*/
html {border: 0px solid black;margin:auto;padding:none;	height:100%;}
body {	margin: 0px;	padding: 0px;	padding-top:0px;background-color: white;border: 0px solid red;
	font-family: Arial,Cambria, "Times New Roman", Times, serif;margin:auto;font-size:small;
	margin-left:none;/*min-height:700px;*/	height:100%;position:relative;display:table;width:100%;}
.corps {border: 0px solid lime;background-color:white;padding-left:0px;width:100%;}
section {background-color:white;}
container-fluid {border: 0px solid teal;}

.a0 {display:inline;}
.a1 {font-weight:normal;background-color:#ccc;color:black;text-decoration:none;
	text-align:center;margin:0px;padding:0px; }
.a1:hover {color:#fff;background-color:#444;text-decoration:none;}

.accueil {text-align:center;font-size:large;/*width:400px;*/border: 0px solid blue;margin:auto;
	color: #ccc;text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px; font-size:20px;}
.anime_bato2 {    width: 100px;    height: 20px;    color: white;    position: relative;
    -webkit-animation-name: bato_mobile2; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 45s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
    animation-name: bato_mobile2;    animation-duration:45s;    animation-iteration-count: infinite;
    text-align:center;	animation-timing-function: linear;
	border-radius: 5px;}
@keyframes bato_mobile2 {
    0%    {left:-150px; bottom:100px;}
    100%  {left:1300px; bottom:100px;}
	}
.bloc1 {margin:auto;background-color:white;width:100%;border: 1px solid black;/*min-height:200px;*/margin-top:3px;
	overflow:hidden;	max-width:300px;}
.body_droite {background-color:#;border: 0px solid black;floatx:left;margin:5px;padding:3px;margin-top:15px;margin-left:10px;
	margin-top:30px;}
.body_droite1 {width:96%;background-color:#;border: 1px solid green;float:left;margin:5px;padding:3px;}
.body_droite1 a {text-decoration:none;color:#444;font-weight:bold;background-color:#ddd;}
.body_droite1 a:hover {background-color:black;color:#bbb;}
/*.body_droite1 table th,tr,td {border: 1px solid black;}*/
.body_gauche {background-color: powderblue;border: 0px solid orange;float:left;padding:0px;margin-top:15px;
	margin-left:0px;border-radius: 3px;background: linear-gradient(to bottom right, powderblue, cornflowerblue);padding-top:0px;
	box-shadow:0px 8px 16px 0px black;color:#888;width:97%;max-width:320px;margin-bottom:50px;}
.body_gauche a {text-decoration:none;}
.body_gauche a:hover {opacity:0.6;}
.body_gauche h3 {margin:0px;padding:0px;}
.body_gauche1 {width:98%;background-color: none;border: 0px solid aqua;float:left;margin:3px;padding:3px;
	overflow:auto;}
.body_table table {border: 1px solid black;}
.boite_menu {border: 1px solid aqua;}
input#bouton {background-color:#ddd;color:#333;}
input#bouton:hover {background-color:#555;color:#ccc;}

.cadre {border: 1px solid orange;}
.contact_analyse {background-color:#ddd;}
.container {background-color:white;}
.diapo {width:95%;background-color:#;border: 0px solid black;}
.diapo_photo {float:left;width:30%;border: 0px solid red;margin-right:10px;}
/*.diapo1A {floatx:left;background-color:aqua;}*/
.diapo1B {float:left;background-color:white; border: 2px solid blue;margin:3px;padding:0px;margin-top:5px;margin-right:5px;padding-bottom:0px;
	width:65%;height:155px;}
a.encadre {padding:none;	border: 1px solid black; background-color:white; color:black;padding-left:3px;padding-right:3px; 
	margin-right:5px;text-decoration:none;}		/* utilisé pour le retour */
a.encadre:hover {background-color:black; color:white;}
a.encadre1 {border: 1px solid #888;background-color:#ddd;padding:3px;color:#333;margin-bottom:3px;}
a.encadre1:hover {background-color:#555;color:#ccc;}
.encadre2 {border: 1px solid black;margin:5px;color:black;font-size:small;background: linear-gradient(to bottom right, #ffff7c, #b2ad00);margin:0px;padding:5px;}
.encadre2 td {padding:5px;}
.entete1 {float:left;text-align:left;padding-left:10px;}
.entete11 {float:left;width:70%;}
.entete12 {float:left;width:30%;}
.evit {border: 0px solid blue;}
.evit_nb {float:left;border: 2px solid lime;font-size:xx-large;margin-top:80px;background-color:white;margin-left:25px;}
.formulaire {background-color:#ffff7c;border: 4px outset #b2ad00;padding-right:3px;}
.formulaire p {font-weight:normal;}
.formulaire .cadre2 {border: solid 1px #333;font-size:0.9em;padding:3px;margin:3px;}
.formulaire .cadre2 p {font-size:1.2em;}
.formulaire .q1 {float:left;margin-left:2%;width:4%;font-weight:bold;}
.formulaire .q2 {float:left;width:40%;margin-left:2%;font-size:1em;padding-left:2%;}
.formulaire .q3 {float:left;width:7%;margin-left:1%;margin-top:-3px;background-color:yellow;}
.formulaire .q3 {float:left;}
.formulaire .titref {float:left;margin-left:44%;width:55%;font-size:1.2em;font-weight:bold;}
.formulaire .titref1 {float:left;margin-left:7%;width:7.5%;padding-left:2%;}
.float_clear {clear:both;}
.fond_fonce {background-color:#222;color:#ccc;font-family: "Courier";font-size:1.2em;font-weight:bold;}
.footer {background-color:black; color:#ddd;min-height:40px;margin:auto;margin-top:100px;padding:5px;position:relative;bottom:0px;position: absolute; bottom: 0px; left: 0; right: 0;-moz-box-sizing: border-box; box-sizing: border-box;display : table-row;}
.footer_content {font-size:1em;font-weight:normal;text-align:left;}
.footer_espace {height:-100px;width:100%;border: 0px solid lime;}
.footer_titre {height:80px;border: 0px solid red; text-align:center;font-size:1.3em;
	font-weight:bold;border-bottom: 1px solid #ccc;}
form p {font-weight:bold;font-size:large;}
.forum {border: 2px solid black; margin-top:25px;margin-bottom:25px;box-shadow: 0px 8px 16px 0px black;
	background: linear-gradient(to bottom right, #ffff7c, #9eff39);padding:5px;border-radius: 3px;}
/*.forum1 {width:95%;  border: 0px solid blue;margin:auto;padding:5px;padding-top:px;font-size:small;
	margin-top:0px;margin-bottom:2px;background-colorf:#;}	 */
.forum2 {background-color:white; border: 1px solid #333;margin:auto;padding:5px;padding-top:0px;margin-top:0px;}	 
.forum21 {background-color:white; border: 1px solid #333;margin:auto;padding:5px;padding-top:0px;margin-top:2px;margin-left:50px;}	 
.forum_nb {float:left;font-size:small;border: 1px solid #333;background-color:white;padding:5px;}
.forum_comment {float:right;font-size:small;color:black;border: 0px solid black;
	margin:2px;margin-top:8px;background-color:#eee;}
.forum_comment:hover {color:white;background-color:#444;}
.forum_dispo {font-size:small;background-color:#teal;text-decoration:none;}
.forum_dispo a {background-color:#; border: 0px solid green;text-decoration:none;}
.forum_entete {background-color:#; border: 0px solid green;}
.forum_messages {background-color:#; border: 0px solid green;padding-bottom:20px;}
.forum_nom1 {margin-left:0px;background-color:white; border: 0px solid orange;font-size:small;font-weight:bold;
	padding-left:2px;padding-right:2px;margin-top:30px;}
.forum_nom2 {margin-left:50px;background-color:white; border: 0px solid orange;font-size:small;font-weight:bold;padding-left:2px;padding-right:2px;}
.forum_page {background-color:#eee;color:black;padding-left:2px;padding-right:2px;margin-left:2px;text-decoration:none;}
.forum_page:hover {color:white;background-color:#444;text-decoration:none;}
.forum_petit1 {font-size:small;}
.forum_repondre {float:right;font-size:small;color:black;border: 0px solid black;background-color:#eee;
	text-decoration:none;margin-bottom:-20px;margin-right:5px;}
.forum_repondre:hover {color:white;background-color:#444;}
.gradient1 {    /* gradient diagonal */
    background: #349bb8; /* For browsers that do not support gradients */    
    background: -webkit-linear-gradient(left top, #349bb8, #9ddef0); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom right, #349bb8, #9ddef0); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom right, #349bb8, #9ddef0); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom right, #088a85, #9ddef0); /* Standard syntax (must be last) */}
.gradient3 {
    /*height: 100%;*/
    width: 100%;overflow-x:hidden;
    background: aqua; /* For browsers that do not support gradients */    
    background: -webkit-radial-gradient(aqua, yellow, green); /* Safari 5.1 to 6.0 */
    background: -o-radial-gradient(red, yellow, green); /* For Opera 11.6 to 12.0 */
    background: -moz-radial-gradient(aqua, yellow, green); /* For Firefox 3.6 to 15 */
    /*background: radial-gradient(aqua, yellow, green); /* Standard syntax (must be last) */
	background: radial-gradient(#0174df, #58d3f7, #0174df, #58d3f7, #0174df, #58d3f7, #0174df, #58d3f7, #0174df, #58d3f7);
	background: radial-gradient(turquoise, steelblue, springgreen, steelblue, turquoise, steelblue, springgreen, steelblue, turquoise, steelblue);
	background: radial-gradient(turquoise, steelblue, #00d67f, steelblue, turquoise, steelblue, #00d67f, steelblue, turquoise, steelblue);
	/*background: radial-gradient(#3F8FDB, #58d3f7, #3F8FDB, #58d3f7, #3F8FDB, #58d3f7, #0174df, #58d3f7, #0174df, #58d3f7);*/
}
.gradien1 {    /* gradient diagonal */
    background: #349bb8; /* For browsers that do not support gradients */    
    background: -webkit-linear-gradient(left top, #349bb8, #9ddef0); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom right, #349bb8, #9ddef0); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom right, #349bb8, #9ddef0); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom right, #faf9f3, #c8c37e); /* Standard syntax (must be last) */}
.graph1 {min-height:304px;border: 2px solid green;}
.graph2 {min-height:504px;border: 2px solid green;}
.gras_rouge {color:red;font-weight:bold;}
.gras_bleu {color:blue;font-weight:bold;}
.gras_aqua {color:aqua;font-weight:bold;}
.gras_lime {color:lime;font-weight:bold;}
.gras_navy {color:navy;font-weight:bold;}
.gras_vert {color:green;font-weight:bold;}
.gras_orange {color:orange;font-weight:bold;}
.gros {font-size:1.3em;font-weight:bold;margin-left:20px;}
h1 {font-size:1.8em;}
h2 {font-size:1.5em;}
h3 {font-size:1.1em;font-weight:bold;}
h4 {font-size:1.2em;font-weight:normal;}
.intro dl {color:#666;font-size:1.2em;}
.haut {}
.haut:hover {opacity:0.5;background-color:#888;}
#header {	border: 0px solid gray;background-color: white;margin:auto;margin-top:0px;
	background-position:center;overflow:visible;
	background-repeat:no-repeat;text-align:center;	font-size:X-large;position:relative;background-color:#ffff7c;background-color:#bef474;background: linear-gradient(to bottom right, #b2ad00, #ffff7c);}
.header_text {border: 0px solid yellow;color: white;text-shadow: 0px 1px 2px red, 0 0 25px #155a08, 0 0 5px; font-size:1.2em; 
	margin-bottom:0px;}
.header_logo {background-color: none;border: 0px solid yellow; display:block;margin:10px;max-height:100px;	}
.html_garde_old{background-image: url(../../img/fond.png);	background-position:center;width:100%;
	height:600px;border: 1px solid red;}
.image1 {display:block;margin:auto;margin-left:30px;float:left;border: 0px solid red;margin-top:0px;padding-top:0px;
	/*position:absolute;bottom:0px;*/}
.image2 {height:100px;width:300px; background-size:contain;background-repeat:no-repeat;
	margin-top:50px;}
.img_responsive {display:block; max-width:100%; height:auto;margin:auto;}
.img_responsive1 { max-width:100%; height:auto;margin:auto;}
.index {padding:10px;background-position:center;font-size:small;margin-top:15px;}
.index h1 a {text-decoration:none;color:#ccc;border: 0px solid green;font-weight: bold;}
.index h1 a:hover {text-decoration:none;color:white;border: 0px solid green;font-weight: bold;}
.langue {position:absolute;right:30px;top:10px;background:lime;border: 1px solid black;font-size:small;width:100px;}
.langue_choix {}
.lien {border:0px black solid;font-size:1.2em;}
.lien a{color:#999;}
.lien:hover {border:0px blue solid;background-color:black;color:white;}
.lien a:hover {text-decoration:none;color:white;}
a.lien2  {color:#222;background-color:#ddd;display:inline;}
a.lien2:hover {text-decoration:none;color:white;background-color:#222;}
.lien3 {color:#333;background-color:#ddd;font-weight:bold;}
.lien3:hover {color:#ddd;background-color:#333;}
.livre_01 {border: 0px solid black;}
.livre_02 {border: 1px solid #bbb;background-color:#ddd;max-width:700px;}
.livre_03 {border: 0px solid blue;}
.livre_04 {float:left;border: 0px solid yellow;background-color:#;width:60%;padding:5px;}
.livre_05 {border: 0px solid aqua;}
.livre_06 {float:right;border: 0px solid lime;overflow:hidden;width:35%;margin:5px;padding-bottom:5px;}
.logo1 {float:right;width:100px;max-height:150px;overflow:hidden;background-size:cover;}
.logo_eolus {background-position:center;margin:auto;width:100px;}
.marpad_55x {margin:20px;}
/*pour les balises menu, allez-voir en bas */
.menu_bloc {border: 0px solid red;/*height:100%;*/padding-left:0px;}
	/* boite de menu déroulant */
.menu_deroul {/*position:absolute;*/display:inline-block;top:0px;right:10px;border: 0px solid black;float:right;}
	/* items du menu déroulant */
.menu_deroul_bouton {/*position:absolute;*/position:relative;right:0px;border: 0px solid green;float:right;
	font-size:16px;cursor:pointer;padding:0px;font-size:16px;}
.menu_deroul_item {display:none;position:relative;background:white;
	min-width:60px;box-shadow: 0px 8px 16px 0px black;border: 0px solid red;z-index:1;font-size:medium;/*top:35px;*/
	text-align:center;overflow:hidden;}
.menu_deroul_item a {display:block;color:black;border: 1px solid black;text-decoration:none;}
.menu_deroul_item a:hover {color:white;padding: 0px;border: 0px solid red;background-color:#222;}
.menu_deroul:hover .menu_deroul_item {display:block;}
.menu_deroul:hover .menu_deroul_bouton {color:yellow;background:#222;}
p {font-size:small;font-weight:normal;}
.petit1 {font-size:0.8em;}
.petit2 {font-size:0.8em;background-color:#fff;}
.retour {margin-top:20px;}
.retour1 {border: 0px solid green;margin-bottom:10px;clear:both;padding:25px;}
.rouge {color:red;}
.rouge_gras {color:red;font-weight:bold;}
.route_text {background:lime;border: 1px solid black;}
.saisie_nom {width:60%;margin:auto;margin-top:40px;}
.saisie_nom form {font-weight:bold;}
table  {   margin: auto; border-collapse: collapse;    border: 0px solid black;margin-left:0px;	}
table  th,tr {border: 1px solid black; }
table .pas_cadre {border: 0px solid black;}
.table1 {border: 0px solid black;}
.table2 th {background: linear-gradient(to bottom right, #ffff7c, #b2ad00);} 
.table2  tr td, tr th{border: 1px solid black;text-align:center;background-color:#eee;}
.table_bouton {width:100px;margin-top:10%;}
.table_col12 {border-collapse: collapse; border: 1px solid black;width:30px;padding-left:3px;}
.table_col12a {border-collapse: collapse; border: 2px solid black;border-right: 1px solid black;width:30px;padding-left:3px;text-align:center;}
.table_col12b {border-collapse: collapse; border: 1px solid black;border-right: 1px solid black;width:30px;padding-left:0px;text-align:center;}
.table_col12_label {border-collapse: collapse; border: 1px solid black;width:30px;padding-left:3px;font-size:large;text-align:center;}
.table_col12_vert { border-collapse: collapse; border: 1px solid black;
	font-weight:bold;width:50px;height:100px;text-align:center;text-decoration:none;font-size:1.2em;}
.table_col12_vert a {text-decoration:none;}
.table_col3 {border: 1px solid black;padding-right:3px;text-align:right;width:120px;font-size:em;}
.table_col31 {border: 1px solid black;border-top: 2px solid black;padding-right:3px;text-align:right;width:120px;font-size:em;}
.table_col3a {border: 1px solid black;padding-right:33px;text-align:right;width:90px;font-size:em;}
.table_col3a1 {border: 1px solid black;border-top: 2px solid black;padding-right:33px;text-align:right;width:90px;font-size:em;}
.table_col3a2 {border: 1px solid black;border-bottom: 2px solid black;padding-right:3px;text-align:right;width:90px;font-size:em;}
.table_col3b {border: 1px solid black;border-top: 2px solid black;padding-right:33px;text-align:right;width:90px;font-size:em;}
.table_col4 {border: 1px solid black;padding-right:3px;text-align:left;width:90px;font-size:em;}
td.table_col5_l, th.table_col5_l {border: 1px solid black;padding-right:3px;text-align:left;width:15%;font-size:em;}
td.table_col5_c, th.table_col5_c {border: 1px solid black;padding-right:3px;text-align:center;width:15%;font-size:em;}
td.table_col5_r, th.table_col5_r {border: 1px solid black;padding-right:3px;text-align:right;width:15%;font-size:em;}
.table_fond tr td{background-color:#bbb;}
.table_foot {border: 2px solid yellow;}
.table_head {border: 2px solid navy;}
.table_id {background:none;border: 1px solid black;}
.table_note {margin-left:10px;width:100%;}
.table_msg {width:100%;}
.table_msg  td:first-child {border: 0px solid red;margin-left:0px;width:25%;}
.table_msg tr td input {width:80%;}
td a{font-weight:normal;background-color:#ccc;color:black;display:block;text-decoration:none;
	text-align:center;margin:0px;padding:0px;border-collapse: collapse; }
td a:hover {font-weight:normal;background-color:white;color:navy;text-decoration:none;}
th a:hover {text-decoration:none;}
.texte_centre {text-align:center;font-size:2em;}
.texte_gauche0 {float:left;width:280px;border: 0px solid navy;}
.texte_gauche {width:200px;border: 0px solid navy;}
textarea {width:95%;}
th {font-weight:normal;background-color:#9dd0de;}
th a{font-weight:normal;background-color:#088a85;color:white;display:block;text-decoration:none;
	text-align:center;margin:0px;padding:0px;border-collapse: collapse; }
th a:hover {font-weight:normal;background-color:white;color:navy;}
.tha {font-weight:normal;background-color:#088a85;color:white;text-decoration:none;
	text-align:center;margin:0px;padding:0px;border-collapse: collapse; }
.titre {font-size:1.1em;font-weight:normal;margin-left:20px;}
.titre_italic {font-size:0.9em;font-weight:bold;margin-left:20px;font-style:italic;}
.tooltip_a /*ATTENTION À NE PAS UTILISER tooltip QUI EST RÉSERVÉ DANS BOOTSTRAP */{position: relative;display: inline-block;}		
.tooltip_a .tooltiptext {visibility: hidden;width: 200px;background-color: #b2ad00;color: white;text-align: left;
    border-radius: 6px;padding: 5px 0;position: absolute;z-index: 1;top: 100%;left: 100%;padding:5px;
    margin-left: -130px;opacity: 0;transition: opacity 0.5s;font-size:small;}
.tooltip_a:hover .tooltiptext {visibility: visible;opacity: 1;}
.tooltip_a1 /*ATTENTION À NE PAS UTILISER tooltip QUI EST RÉSERVÉ DANS BOOTSTRAP */{position: relative;
	border-bottom: 0px dotted black;color:navy;font-style: italic;	font-weight:bold;}		
.tooltip_a1 .tooltiptext1 {visibility: hidden;width: 500%;background-color: #666;color: #fff;text-align: left;
    border-radius: 6px;padding: 5px 0;position: absolute;z-index: 1;top: 100%;left: 100%;padding:5px;
    margin-left: -10px;margin-top: -200px;opacity: 0;transition: opacity 0.5s;font-size:0.8em;}
.tooltip_a1:hover .tooltiptext1 {visibility: visible;opacity: 0.9;}
	/* trans ou transp correspond initialement à transporteur; le terme a évolué est est + général... */
.tooltip_b /*ATTENTION À NE PAS UTILISER tooltip QUI EST RÉSERVÉ DANS BOOTSTRAP */{position: relative;display: inline-block;
	border-bottom: 0px dotted black;color:white;font-style: italic;	font-weight:normal;}		
.tooltip_b .tooltiptext {visibility: hidden;width: 350px;background-color: #666;color: #fff;text-align: left;
    border-radius: 6px;padding: 5px 0;position: absolute;z-index: 1;top: 100%;left: 100%;padding:5px;
    margin-left: -30px;opacity: 0;transition: opacity 0.5s;font-size:small;}
.tooltip_b:hover .tooltiptext {visibility: visible;opacity: 0.9;}
.transp {/*width:600px;width:98%;height:500px;overflow:hidden;*/border: 1px solid black;background-color:white;margin:auto;padding:10px;
	overflow:auto;box-shadow: 0px 8px 16px 0px black;border-radius:5px;}
.transp_err {width:600px;height:100px;overflow:hidden;border: 1px solid black;background-color:white;margin:auto;padding:10px;}
.trans_A {width:65%;height:110px;overflow:hidden;border: 0px solid red;background-color:#;float:left;}
.trans_nom {width:100%;height:25px;overflow:hidden;border: 0px solid red;background-color:#;font-size:medium;
	font-weight:bold;margin-left:5px;}
.trans_adr {width:100%;height:80px;overflow:hidden;border: 0px solid green;background-color:#;margin-top:0px;
	margin-left:5px;font-size:small;}
.trans_txt {width:98%;/*height:250px;*/overflow:auto;border: 0px solid #222;background-color:#eee;margin-top:10px;padding:3px;
	color:#333;margin-left:5px;}
.trans_web {/*width:150px;*/height:30px;overflow:hidden;border: 0px solid yellow;background-color:#;float:right;
	/*margin-top:90px;*/text-align:right;}
.trans_logo {/*width:150px*/;height:50px;overflow:hidden;border: 0px solid blue;background-color:#;float:right;text-align:right;
	background-size:contain;}
.trans_logo1 {background-size:contain;right:10px;}
a.transp_loupe {position:relative;float:left;}
a.transp_loupe span {display:none;}
a.transp_loupe:hover span {display:block;position:absolute;/*top:-355px;left:00px;*/border: 0px solid #222;background-color:#;background-size:contain;
	width:350px;height:250px;box-shadow: 10px 10px 5px #444;background:linear-gradient(to bottom right, #777, #eee);
	background-position:center; overflow:hidden;position:fixed;top:50px;right:10px;z-index:150;  }	
.trans_photo {/*width:450px;height:100px;*/background-color:#;float:left;margin-top:10px;margin-left:5px;}
.trans_photo1 {width:50px;height:40px;overflow:hidden;background-color:#;margin:3px;float:left;margin-left:0px;}
.trans_photo1:hover .trans_loupe {display:block;}
.version {text-align:right;font-size:small;font-size:x-small;float:right;margin-right:15px;bottom:10px;}

/*  
     MM      MM     EEEEEEEEE     NN    MM     UU      UU
     MMM    MMM     EE            NNN   NN     UU      UU
     MMMM  MMMM     EE            NNNN  NN     UU      UU
     MM MMMM MM     EEEEEE        NN NN NN     UU      UU
     MM  MM  MM     EE            NN  NNNN     UU      UU
     MM      MM     EE            NN   NNN      UU    UU
     MM      MM     EEEEEEEEE     NN    NN        UUUU

code css pour le menu; pour les z-index il faut les indiquer dans le menu sur les li en ordre décroissant pour éviter l'effet de
superposition

*/
.niveau2 {position:absolute;left:0px;top:34px;width:100%;}	/* position du niveau 2 par rapport au niveau 1  */
.niveau3 {top:-4px;}
.niveau4 {top:-6px;}

#monmenu {margin:auto;	padding-left:0px;	FONT-WEIGHT: normal; FONT-SIZE: small;border:0px solid red ;height:28px;
	float:left;bottom:0px;background-color:none;
	/*z-index:100;*/}
#monmenu ul {LIST-STYLE-TYPE: none;	margin:0;padding:0;}
	/* Texte menu 1er niveau */
#monmenu ul li{background-color:green;color:black;margin:0px;padding:0px;text-align:center;list-style:outside;
	LIST-STYLE-TYPE: none;	padding:0;padding-left:5px;/*z-index:110;*/height:35px; line-height:35px; font-size:1.0em;
	background: linear-gradient(to bottom right, #ffff7c, #b2ad00);
	/*background: linear-gradient(to bottom right, #bef474, #9eff39);*/
	border-top: 0px solid #666;}
#monmenu LI:hover {	background-color:lime;color:white;font-weight:bold;background: linear-gradient(to bottom right, #b2ad00, #ffff7c);
	border-bottom: 2px solid #666;border-bottom: 0px solid #666;border-left: 0px solid black;border-top: 0px solid black;}

	/* listes niveau 2 à vide : pas d'affichage de tout le reste par défaut*/
#monmenu UL  UL{
	BORDER-RIGHT: #bbb 0px solid; PADDING-RIGHT: 0px; BORDER-TOP: #bbb 0px solid; 
	DISPLAY: none; text-align:left; font-size:1em;
	margin-left:0px;padding:0;/*position:relative;*/}
	
	/* items niveau 2 (1er sous menu) */
#monmenu li li{ 	border    : 0px solid red;width:100%;overflow-x:visible;height:28px;line-height:28px;/*z-index:101;*/
	text-align:left;font-weight:normal;	/*font-size:0.9em;*/}
	/* item niveau 2 survolé - fond */
#monmenu li li:hover { 	BACKGROUND-COLOR: #4c97ac; color:white; /*z-index:120;*/ border-bottom: 1px solid #666; }
	
#monmenu LI A {		color : black;	
	TEXT-DECORATION: none	}
#monmenu LI A:hover {	TEXT-DECORATION: none;color : white;	}
	/* survol de niveau 1 => affiche les items de niveau 2 */
#monmenu LI:hover UL.niveau2 {DISPLAY: block;	}
#monmenu LI LI:hover UL.niveau3 {DISPLAY: block;border: 0px solid black;margin-top:0px;	margin-left:0px;}

#monmenux ul LI ul li a /* liens du niveau 2 => sert à rien ??? */	{	DISPLAY: block; 	}
	/* liste niveau 3 à vide */
#monmenu UL UL ul{display:none;color:black;left:40%;/*top:0px;*/position:relative;/*z-index:130;*//*display:block;*/
	/*height:28px;*/}
	/* item niveau 3 survolé fond -> sert pas à grand-chose... */
	/* items niveau 3 (2ème sous menu) */
#monmenu li li li {height:26px;/*z-index:135;*//*position:relative;*/}	/* hauteur des boîtes li niveau 3 */
#monmenu li li li.niveau3{ 	BACKGROUND-COLOR: orange; overflow-y:hidden;left:0px;
	top:0px;height:15px;}
#monmenu li li li:hover { 	BACKGROUND-COLOR: red; color:white;/*z-index:150;*/ }
	/*	items niveau 4 */
#monmenu li li li:hover ul.niveau4 {display:block;}	
#monmenu li li li li {height:24px;min-width:100px;/*z-index:170;*/}
#monmenu li li li li.niveau4_choix {background-color:lime; color:blue;height:10px; }	

.niveau3_choix {max-height:220px;overflow-y:auto;overflow-x:hidden;background-color:#;box-shadow: 0px 8px 16px 0px gray;
	border: 2px solid aqua;}	
.niveau4_choix {max-height:300px;overflow-y:auto;overflow-x:hidden;display:block;border: 1px solid navy;}

/* menu mobile*/
.menu_icone {width:27px;height:26px;border: 0px solid aqua;float:right;margin-right:0px;padding-left:3px;}
.menu_icone2 {width:20px; border: 1px solid black;margin-top:5px;}

/* media queries par défaut */
.menu_mobile {display:none;width:200px;min-height:150px;max-height:400px;
	border: 1px solid #222;margin-leftx:-180px;margin-leftx:-80%;
	background-color:#eee;padding:0px;overflow:auto;overflow-y:scroll;overflow-x:hidden;position:absolute;right:20px;}
.section_gauche2 {display:none;margin-top:25px;}
.menu_hamb1 {display:none;list-style-type:none;position:absolute;right:0px;z-index:1000;}
.listnone {list-style-type:none;}


@media (max-width: 767px) 		/* format smartphone */
	{
	body {padding:0px;}
	body_droite {margin:0px;padding:0px;}
	/*.display_class {display:block;}*/
	.niveau2 {		font-size:xx-small;		}
	.niveau1 {		font-size:x-small;		}
	.header_text {font-size:0.9em;}
	.section_gauche1 {display:none;}
	.section_gauche2 {display:block;}
	monmenu li li {width:120%;}
		/* activation de .menu_hamb dans les 3 cas hover, active, focus */
	.menu_hamb2 {display:none;}
	.menu_hamb1:hover .menu_mobile, .menu_hamb1:active .menu_mobile, .menu_hamb1:focus .menu_mobile {display:block;}
	.menu_icone:hover {background-color:white;}
	.menu_deroul {display:none;}
	.menu_hamb1 {display:block;list-style-type:none;font-size:small;}
	.menu_fixe {display:none;}
	/*.menu_lang {text-decoration:none;text-align:left;margin-left:-35px;}*/
	.menu_trait1 {width:95%; border: 1px solid #ccc;margin:5px;margin-left:-10px;}
	.menu_trait2 {width:85%; border: 1px solid #ccc;margin:3px;}
	#menu_mob_ana {display:none;}
	#menu_mob_has {display:none;}
	#menu_mob_ech {display:none;}
	#menu_mob_aut {display:none;}
	#menu_mob_rien1 {display:none;}
	#menu_mob_rien2 {display:none;}
	.menu_mobile_titre1 {list-style-type:none;text-decoration:none;text-align:left;margin-left:-25px;}
	.menu_mobile_titre2 {list-style-type:none;text-decoration:none;text-align:left;margin-left:-5px;}
	.menu_mobile_titre3 {list-style-type:none;text-decoration:none;text-align:left;margin-left:0px;}
	.menu_mobile ul ul {margin-left:-20px;}
	.menu_mobile a {text-decoration:none;}
	.menu_mobile:hover ul ul li a {font-weight:bold;color:black;}
	.menu_mobilex:hover ul li a {font-weight:bold;color:black;}
	.menu_mobile_survol {background-color:#ddd;font-size:1.1em;border-bottom: 1px solid #888;}
	.menu_mobile_survol:hover {background-color:#ccc;color:white;font-weight:bold;}
	
	.cadre1 {color:#088a85; border: 0px solid red;background-color:#ddd;}
	.cadre1:hover {color:#ddd;border: 0px solid green; background-color:#088a85;}
	}