html, body {
height:100%;
}
html {

	background-color: #ffffff;
}
body {
	margin-top: 10px;
	margin:auto;
	font-family: 'Trebuchet MS', Arial, sans-serif;
	font-size: 0.8em;
	border-radius: 0 0px 15px 0px;
}
.grid {
        display : table;
      	height: 100%;
      	width:100%;
		behavior: url(display-table.min.htc);
		}
		
header {
	display : table-row;
	background-color:#183152;
	height: 43px;	
	z-index:4;
}
nav {
	height:25px;
	z-index:15;
	position:relative;
background-color:#C4D7ED;	
	/*padding-right: 5px;*/
}

.content {
        display : table-row;
        background: #ffffff;
      }
	  
section{
display : table-row;
	border-radius: 0px 15px 2px 2px;
	background-color:#ffffff;
	/*padding-bottom:10px;
			
	min-height:500px;*/
}
footer {
	display : table-row;
	text-align:right;
	height:27px;
}
#cadreg {
	float:left; 
	border-radius:5px;
	border:1px solid #e6e6fa;
	background-color:white;
}
#cadreg p, h1, h2, h3 {
	padding	: 0px 10px;
}

#cadred {
	float:right;

	border-radius:5px;
	border:1px solid #e6e6fa;	
	background-color:white;
}
#cadred p, h1, h2, h3 {
	padding	: 0px 10px;
}

#cadrecl {
	width:100%;
	border-radius:5px;
	border:1px solid #e6e6fa;
	background-color:white;
	position: absolute;
}

#cadrec {
	width:1050px;
	border-radius:5px;
	border:1px solid #e6e6fa;
	background-color:white;
	margin:5px auto;
}
#cadrec p, h1, h2, h3 {
	padding:0px 10px;
}
.petitre {
	font-family:monospace;
	font-size:1.5em;
	font-weight:bold;
	text-align:center;
	background-color:#DDDDDD;
	margin-bottom:5px;
}

.titre_cadre {
	background-color:#E1E6FA;
	min-height:23px;
	text-align:center;
	padding-top:5px;
	font-weight:bold;
	border-bottom:1px solid #e6e6fa;
}

#conteneur
{
    display: flex;
    flex-wrap: wrap;
	justify-content: space-evenly;
	align-content:flex-start;
	column-gap: 10px;
	width:95%;
	margin:auto;
}
.boite
{
	border:2px solid #e2ebdb;
	background-color:white;	
	margin-top:10px;
}
.colonne {
	display: flex;
	flex-direction: column;
}

.boite p {
	margin-top:5px;
	margin-bottom:5px;
}

.bloc {
	width:400px;
	min-height:120px;
	border-radius:5px;
	border:1px solid #e6e6fa;
	background-color:white;
	margin:5px auto;
	text-align:center;
}

p {
	margin-top:0px;
}

h1 {
	color:#828263;
	font-size:14px
	margin:10px 0px 10px 0px;
}
h2 {
	color:#828263;
	Font-size:12px;
	margin:9px 0px 9px 0px;
}
h3 {
	color:#828263;
	margin:8px 0px 8px 0px;
}

a {
	text-decoration:none;
	color:black;
	cursor:pointer;
}
img {
	vertical-align:bottom;
}
a img {
	border:none;
	cursor: pointer;
}

image {
	cursor: pointer;
}


/* ---------- infobulle ---------------------------------------*/
.info{
position:relative;
z-index:10;
color : #2B3856;
text-decoration:none
}
a.info:hover{
cursor: help;
z-index:11;
}
a.info span{
display: none;
}
a.info:hover span{
display:block;
position:absolute;
top:0em; left:20em; width:20em;
border:1px solid #000;
background-color:#d2f2b5;
color:#000;
text-align: left;
font-weight:none;
padding:5px;
}
/* --------------------------------------------------------------- */
.bouton {
	border-radius:3px 3px 3px 3px;
	padding: 2px 5px 2px 5px;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 100%;
	text-align: center;
	color: black;
	text-decoration: none;
	margin-top: 5px;
	margin-bottom: 0px;
	margin-left: 4px;
  border-top: 1px solid #9BD6B1;
  border-bottom: 2px solid #9BD6B1;
  border-left: 1px solid #9BD6B1;
  border-right: 2px solid #9BD6B1;
  background:#ffffff;
}
.bouton:hover {
  border-bottom: 1px solid #9BD6B1;
  border-top: 2px solid #9BD6B1;
  border-right: 1px solid #9BD6B1;
  border-left: 2px solid #9BD6B1;
  background-image:radial-gradient(white, gold);
}
/* -------------------------- */
.bouton2 {
	border:1px solid grey;
	border-radius:5px;
	padding: 2px 5px 2px 5px;	
	background-color: #E1E6FA;
	font-size:small;
}
.bouton2:hover {
	background-image:radial-gradient(white, gold);
}
.bouton2s {
	font-size:1.2em;
	font-weight:bold;
	border:1px solid grey; 
	border-radius:5px;
	padding: 2px 5px 2px 5px;
	background-image:radial-gradient(white, gold);
}


/* Tableaux */
.floatingHeader {
  position: fixed;
  top: 0;
  visibility: hidden;
}
table {
	border-collapse:collapse;
}
th {
	background-color: #375D81;
	color:white;
	height:25px;
}
.niveau1 {
	background-color:#375D81;
	border-top:5px solid #375D81;
	color:white;
}
.niveau2 {
	background-color:#ABC8E2;
	border-top:5px solid #ABC8E2;
	color:white;
}
.niveau3 {
	background-color:#C4D7ED;
	border-top:2px solid grey;
}
.niveau4 {
	background-color:#E1E6FA;
	border-top:1px solid lightgrey;
}

.pale {
	background-color:#ffffff;
}
/* formulaires */
input {
	margin-top:0;
	vertical-align:middle;
}
label {
	vertical-align:middle;
}
textarea {
	font-family: trebuchet, helvetica, sans-serif;
	font-size: 1em;
}
.cible button[type=submit]{	
	background:url(../images/cible.png) top right no-repeat;
	width:23px;
	height: 21px;
	padding: 0px;
	cursor: pointer;
	border:0;
}
.modifier button[type=submit]{	
	background:url(../images/modif.png) top right no-repeat;
	width:23px;
	height: 21px;
	padding: 0px;
	cursor: pointer;
	border:0;
}

.fond1 {
	background-color:#e6e6fa;
}
.fond2 {
	background-color:#ffffff;
}
.titre {
	font-family:monospace;
	font-size:2.3em;
	font-weight:bold;
	color:#828263;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:20px;
	margin:2px;
}

.tabligne {
border-top:1px solid lightgrey;
}
.tabligne tr:first-child{ 
border:0; 
}

.tabligneb {
border-bottom:1px solid grey;
}

.modif input[type=text], .modif input[type=email], .modif input[type=password], .modif input[type=number], .modif textarea, .modif select , .modif checkbox {
	background-color:#ffffe0;
}

.modif input:focus, textarea:focus, select:focus {
	background-color:white;
}
.modif image {
	background-color:black;
}

/* liste 1 : utilisé pour affichage recommandations aide mémoire 
.liste1{
	font-size:0.9em;
	margin-left:10px;
	margin-right:10px;
	background-color:white;
}
*/
.liste1 ul {
	padding-left:5px;
	list-style-type:none; 
}
.liste1 li {
	border-top:1px solid lightgrey;
	padding:2px 5px;
}

/* ------------------------------------------------------------- */

.gauche {
	float: left;
}
.droite {
	float: right;
}
.dessous {
	clear: both;
}
.choisi {
	background-color:#EEF2D0;
}
a.aide{
position:relative;
z-index:10;
color : #2B3856;
text-decoration:none
}
a.aide:hover{
cursor: help;
z-index:11;
}
a.aide span{
display: none;
}
a.aide:hover span{
display:block;
position:absolute;
top:1.5em; left:-50em; width:50em;
border-radius:5px;
border:3px solid #e6e6fa;
background-color:#FFFACD;
color:#000;
text-align: left;
font-weight:none;
padding:5px;
}

/*  MENU ******************************************************** 

    a#trans { background: #fff; color: #aa0000; padding: 3px; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;}
    a#trans:hover { background: #220077; color: #fff; } */
    #trans-nav { list-style-type: none; height: 40px; padding: 0; margin: 0; }
    #trans-nav li { float: left; position: relative; padding: 0; line-height: 23px; background: white ; border:thin solid #d3d3d3; width: 10em; text-align:center; }
    #trans-nav li:hover { background-position: 0 -40px; }
    #trans-nav li a { display: block; padding: 0 5px; color: #4682b4; text-decoration: none; font-weight:bold;}
    #trans-nav li ul { opacity: 0; position: absolute; left: -1px; width: 17em; background: white; list-style-type: none; padding: 0; margin: 0; }
    #trans-nav li:hover ul { opacity: 1; }
    #trans-nav li ul li { float: none; position: static; height: 0; line-height: 0; background: none; border:thin solid #d3d3d3; width: 17em; text-align:left;}
    #trans-nav li:hover ul li { height: 40px; line-height: 40px; }
	#trans-nav li ul li a { background: white;  padding: 0 0 0 5px ;}
    #trans-nav li ul li a:hover { background: #e6e6fa; }
    #trans-nav li { -webkit-transition: all 0.3s;  -moz-transition: all 0.3s linear;}
    #trans-nav li a { -webkit-transition: all 0.3s;  -moz-transition: all 0.3s linear;}
    #trans-nav li ul { -webkit-transition: all 0.3s;  -moz-transition: all 0.3s linear;}
    #trans-nav li ul li { -webkit-transition: height 0.3s;  -moz-transition: all 0.3s linear;}
	#trans-nav {z-index:20;}
	#trans-nav ul {z-index:21;}
	#trans-nav ul ul {z-index:22;}

/* ******************************************************************* */
	
.myCheckbox input {display: none;}
.myCheckbox span {width: 20px;height: 20px; display: block; background: url("../images/supprim.png"); cursor:pointer; }

/**************** MENU 2 */
#menu, #menu ul {
	list-style:none;
	padding:0;
	margin:0;
}
#menu li {
	float:left;
	position:relative;
	line-height:1em;
	width:12em;
	padding-right:3px;
	
}
#menu li ul {
	position:absolute;
	margin-top:-.1em;
	margin-left:0em; /* for IE */
	display:none;
}
#menu li ul li {
	padding-top:0px;
}
#menu ul li ul {
	margin-top:-3.1em;
	margin-left:12em;
}
/* ******************************************************************* */
/* sous menu 1 */
#menu li:hover ul, #menu li.over ul {
	display:block;
}
#menu li:hover ul ul, #menu li.over ul ul {
	display:none;
}
/* sous menu 2 */
#menu ul li:hover ul, #menu ul li.over ul {
	display:block;
}
/* ******************************************************************* */
/* STYLING UP THE LINKS */
#menu a {
	display:block;
	border-radius: 0 0 5px 5px;
	background-image:linear-gradient(white,lightgrey);
	/*background-color:whitesmoke;*/
	color:black;
	border:1px solid grey;
	text-decoration:none;
	text-align:center;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:5px;
	padding-right:5px;
	font-size:1em;
	font-weight:bold;
}
#menu a:hover {
	background-image:linear-gradient(white,#E1E6FA);
	/*background-color:white;*/
	color:black;
}
#menu ul {
	
}
#menu ul a {
	border-right:none;
	border-right:1px solid #E1E6FA;
	border-bottom:1px solid #E1E6FA;
	border-left:1px solid #E1E6FA;
	/*background-image:linear-gradient(lightgrey,white);*/
	padding-top:8px;
	padding-bottom:8px;
}

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

#menu {
	z-index:20;
}
#menu ul {
	z-index:21;
}
#menu ul ul {
	z-index:22;
}
    #menu li { -webkit-transition: all 0.3s;  -moz-transition: all 0.3s linear;}
    #menu li a { -webkit-transition: all 0.3s;  -moz-transition: all 0.3s linear;}
    #menu li ul { -webkit-transition: all 0.3s;  -moz-transition: all 0.3s linear;}
    #menu li ul li { -webkit-transition: height 0.3s;  -moz-transition: all 0.3s linear;}

/* ******************************************************************* */
.myCheckbox input:checked + span {background: url("../images/valid.png"); cursor:pointer;}