html{font-family: Verdana, Geneva, Tahoma, sans-serif, sans-serif; 
  background:
  radial-gradient(300px circle at 73% 60%, rgba(167, 167, 167, 0.8),rgba(255, 255, 255, 0)),
  radial-gradient(280px circle at 52% 70%, rgba(216, 216, 216, 0.95),rgba(224, 224, 224, 0)),
  radial-gradient(421px circle at 82% 82%, rgba(168, 168, 168, 0.95),rgba(226, 226, 226, 0)),
  radial-gradient(450px circle at 42% 65%, rgb(134, 134, 134),rgba(248, 248, 248, 0)),
  radial-gradient(480px circle at 40% 75%, rgb(201, 201, 201),rgba(192,40,89,0)),
  radial-gradient(480px circle at 38% 95%, rgb(172, 172, 172),rgba(192,40,89,0)),
  radial-gradient(435px circle at 65% 73%, rgb(236, 236, 236), rgba(143, 143, 143, 0)),
  radial-gradient(850px circle at right top, rgb(168, 168, 168), rgba(129, 129, 129, 0.9), rgba(230, 230, 230, 0.4), rgba(209,64,97,0)),
  radial-gradient(422px circle at right 75%, rgba(190, 190, 190, 0.95), rgba(116, 116, 116, 0)),
  radial-gradient(350px circle at right 50%, rgb(146, 146, 146), rgba(204,116,96,0)),
  radial-gradient(300px circle at right bottom, rgb(190, 190, 190),  rgba(196, 196, 196, 0)),
  linear-gradient(to right bottom, rgba(202, 202, 202, 0), rgba(206, 206, 206, 0.95) 40%, rgba(209, 209, 209, 0.5) 60%, rgba(71,17,77, 0)),
  linear-gradient(to right, #d3d3d3, #dadada);
 background-size: 100%;
 background-size: contain;
 background-repeat: no-repeat;
 background-attachment: fixed;
}

#imglogo{height: 55px; margin:10px;}

.flex-container {
  display: flex;
  flex-flow: row;
  justify-content: center;
  padding: 0;
  margin: 0;
  list-style: none;
}

a{display: flex;text-decoration: none;color: rgb(255, 255, 255);border-bottom: 2px solid transparent;}
a:hover{color: rgb(117, 178, 235);}
.flex-item{border-right:20px;margin: 10px;padding: 10px 0px;}
.sous{display: none;box-shadow: 0px 1px 2px #08034ea1;background-color: rgba(0, 70, 145, 0.85);z-index: 1000;list-style-type: none;position: absolute;left:5%; right:5%;padding:10px}
.article{width: 250px;flex: 0 0 auto;font-size: 12px;color: rgb(231, 231, 231);}
.titre_cat{width : 100%; flex: 0 0 auto;font-size: 20px;color: rgb(255, 255, 255);font-style: italic; font-weight: bold;margin:10px}
nav{width: 100%;margin: 0 auto;background-color: rgba(255, 255, 255, 0);position: sticky;z-index:1;}
nav > ul div:hover .sous{display: flex;flex-flow: row wrap;}
.sous a{padding: 10px;border-bottom: none;}
.sous a:hover{border-bottom: none;background-color: RGBa(200,200,200,0.1);}
.flex-item > a::after{content:"▼";font-size: 12px;}

.entete{position: absolute;top:0px;left:0px;height: 100px;width: 100%;box-shadow: 0px 4px 4px #1c1a19;background-color: rgb(0, 70, 145);text-align: center;z-index:1;}

#liens{position:absolute;bottom:15px;;height:30px;left:10px; right:10px;color:gray;}


.corps_1{position:absolute; background-color: #fff;top:110; left: 5%;right:5%}
.titre{font-size: 20px;color: rgb(0, 0, 0); font-weight: bold;margin:10px}
.fieldset{margin : 20px;}
input {margin: 10px;}



.basdepage{position: absolute;top:1200px;left:0px;width:100%;box-sizing:border-box;height: 140px;background-color: whitesmoke; text-align: center;}
#footpage{position:relative;top: 20px;font-size: 20px; text-align: center; color: rgba(0, 65, 40, 1);}
a.mentions:link{color:whitesmoke;text-decoration: none;}
a.mentions:visited{color:whitesmoke;text-decoration: none;}
a.mentions:hover{color:seagreen;}
#mentions{position:relative;top: 40px;font-size: 10px; text-align: center; color: rgba(0, 65, 40, 1);font-style:italic}
#copyright{position:relative;top: 60px;font-size: 15px; text-align: center; color: rgba(0, 65, 40, 1);font-style:italic;}

.overlay {position: fixed;top: 0;bottom: 0;left: 0;right: 0;background: rgba(0, 0, 0, 0.7);transition: opacity 500ms;visibility: hidden;opacity: 0;}
.overlay:target {visibility: visible;opacity: 1;}

.popup {margin: 70px auto;padding: 20px;background: #fff;border-radius: 5px;position: relative;transition: all 5s ease-in-out;overflow-y: scroll;scrollbar-width: thin;}

.popup h2 {margin-top: 0;color: #333;font-family: Tahoma, Arial, sans-serif;}
.popup .close {position: absolute;top: 20px;right: 30px;transition: all 200ms;font-size: 30px;font-weight: bold;text-decoration: none;color: #333;}
.popup .close:hover {color: #06D85F;}
.popup .content {max-height: 1000%;overflow: auto;}
.box{width: 70%;}
.popup{width: 70%;height:70%;}