body,html{
    	padding:0;
        margin:0;
        width:100%;
        height:100%;
        overflow:hidden;
    }
    body{
    	display:grid;
        grid-template-columns:1fr;
        grid-template-rows:auto 1fr;
        font-family:lato
    }
    input,legend button{
        font-size:16px;
    }
    nav{
        z-index:2;
    }
    #Container{
      width:100%;
      height:100%;
      overflow:auto;
    }
    #AuthForm{
    	display:grid;
        grid-template-columns:1fr;
        grid-gap:5px;
    }
    #AuthForm fieldset{
    	border:none;
    }
    .loginBtn{
    	color:white;
        font-weight:bold;
        background:#40015a;
        padding:5px;
        border:none;
    }
    .loginBtn:hover{
        cursor:pointer;
    }
#vdef{
  display:grid;
  grid-template-columns:auto 1fr;
  grid-gap:0;
  margin-left:-1px;
}
#v{
  padding: 10px;
    border-radius: 0 0 0 16px;
    margin-left: -1px;
    z-index: 3;
    background: lightgrey;
    max-height:300px;
    overflow-y:auto;
}
#vdefmenu{
  width:150px;
  border:none;
  padding-top: 5px;
  border-radius: 0 16px 0 0;
  margin-bottom: 10px;
  background: darkcyan;
}
#vdefmenu button{
  float:left;
  width:calc(100% - 16px);
  padding:7px;
  border:none;
  background: transparent;
  border-bottom:solid transparent 2px;
}
.cellular{
  display:grid;
  grid-template-columns:1fr;
}
.separator{
  display:grid;
  grid-template-columns: auto 1fr;
  margin-bottom:10px;
  margin-top:10px;
}
.separator b{
  margin-left:15px;
  margin-right:15px;
}
.separator hr{
  width:100%;
}
.selectedVariante{
  float:right;
  padding:7px;
  border:none;
  background: transparent;
  font-weight: bold;
  color:lightcyan;
  border-bottom:solid lightcyan 2px;
}
#vdefmenu button:hover{
  font-weight: bold;
  color:lightcyan;
  border-bottom:solid lightcyan 2px;
}
#vdefafter{

    position: absolute;
    top: 50%;
    height: 39%;
    width: 100%;
    background: darkcyan;

}
#AcceuilHead{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    grid-gap:5px;
}
#AcceuilHead div{
    width: 100%;
    text-align: center;
    font-size: 50px;
    border: none;
    border-radius: 30px;
    background: #024242;
    box-shadow: 0 0 5px black;
    color:lightblue;
}
#AcceuilHead p,#AcceuilHead ol{
    grid-column-start:1;
    grid-column-end:5;
}
textarea:focus-visible,input:focus-visible,select:focus-visible{
	outline-width:0px;
}
#grid,#Acceuil{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	grid-template-rows:1fr;
	background:rgba(0,0,0,.5);
	width:100%;
	height:100%;
	color:white;
	transition:background .5s;
}
#Acceuil{
	background:white;
	color:black;
	grid-gap:5px;
	padding:5px;
	grid-template-columns:1fr;
	width:fit-content;
	height:fit-content;
}
#Acceuil legend{
	font-weight: bold;
	font-size:30px;
}
#grid div:not(id="vmenu"){
	background:transparent;
}
#auth{
	display:grid;
	grid-template-columns:1fr;
	grid-gap:5px;
	height:fit-content;
	width:400px;
}
#auth span{
	padding-left:5px;
}
#auth fieldset,#entete fieldset{
	height:fit-content;
	border:solid white 1px;
}
#auth legend,#entete legend{
	color:white;
	float:left;
}
#auth input{
	width:100%;
	background:transparent;
	border:none;
	padding:5px;
	margin-top:5px;
	margin-left:-10px;
	color:white;
}
#auth input[type="image"]{
	margin-left:-1px;
}
.alertPanel td{
  color: black;
  font-size: 16px;
  text-align: center;
}
#grid button,#menu button,.alertPanel tfoot button{
  background: white;
    border: solid black 1px;
    color: black;
    cursor: pointer;
    width: 100px;
    height: 40px;
    margin: 5px;
}
#grid button:hover,#menu button:hover,.alertPanel tfoot button:hover,#menu input[type="button"]:hover{
	background:#00AB55;
	border:solid transparent 1px;
  cursor:pointer;
  color:white;
}
#grid input[type="image"]{
	width:25px;
	height:25px;
}
ul{
	list-style-type:none;
	padding:0;
	margin:0;
	margin-top:-10px;
	margin-bottom:-10px;
}
ul li{
	display:inline-block;
	vertical-align:middle;
	padding:0;
	margin:0;
}
td ul li{
	display:inherit;
}
#desc{
	display:table-cell;
	text-align:center;
	vertical-align:middle;
}
#menu{
	background:darkcyan;
	width:100%;
}
#vmenu{
	width:0px;
	transition:width 1s;
	overflow-x:hidden;
	overflow-y:auto;
	background:#024242;
}
#menu button,#vmenu button,#menu input[type="button"],#vmenu input[type="button"]{
	margin:0;
	border:solid transparent 1px;
	padding:7px;
	float:left;
	min-width:95px;
    width:fit-content;
	color:white;
	background:transparent;
}
#menu button:hover{
    background:#024242;
}
#vmenu button{
	width:200px;
	text-align:left;
}
#entete{
	transition:margin 1s;
}
.paragraph{
	padding:5px;
}
.paragraph p,.presentation,#AcceuilHead p,#AcceuilHead ol{
	float:left;
	text-align:justify;
	width:100%;
	text-indent:15px;
	letter-spacing: 2px;
	line-height: 30px;
	font-size:24px;
	font-family:Times New Roman;
}
.paragraph img{
	display:block;
	float:right;
	box-shadow:0 0 10px black;
	width:300px;
	height:300px;
}
body > ol li,.paragraph ol li{
	text-align:justify;
	width:100%;
	text-indent:15px;
	letter-spacing: 2px;
	line-height: 30px;
	font-size:24px;
	font-family:Times New Roman;
}
.paragraph dt{
	font-weight: bold;
}