/* L'image est positionnée en fond et est centrée */
  html{
    align-items: center;
    justify-content: center;
  font-family: Comic Sans Ms, sans-serif;
    background: linear-gradient(30deg, #8abff5 20%, #c2ddfa 65%);
background-repeat:no-repeat;
height:100%;
  }

}
.txt{
font-style: italic;
font-size: 14px;
}
.txt2{
color:yellow;
font-size: 26px;
}
a .txt2 
{
color:yellow;
font-size: 20px;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
}
.tab{
	
	margin-top:30px;
	margin-left:40px;
}
a:hover,a:active,a:focus{
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	color: white;
}

.cadre { position: relative;
margin: auto ;
top:50px;
width:100%;

border-radius:25px;
}
.cadre img{
border-radius:25px;
box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;}

#nav {margin-top:-0px;
 padding:6px;	margin-left: auto;
	margin-right: auto;
     background: linear-gradient(30deg, #8abff5 20%, #c2ddfa 65%);
 background-repeat: no-repeat;
background-size: cover;
	line-height: 100%;
	border-radius: 2em;
    box-shadow: 0 1px 3px rgba(0,0,0, .4);
    font-size:15px;
width:99%;}
#nav li {margin: 0 5px;padding: 0 0 8px;float: left;position: relative;list-style: none; color: #7f5537}

/* main level link */
#nav a { color: #7f5537;text-decoration: none;display: block; padding:  8px 20px;margin: 0;font-size:15px;
    border-radius: 1.6em;
	}
#nav a:hover {color: #7f5537;}

/* main level link hover */
#nav .current { color: #7f5537;text-decoration: none;display: block; padding:  8px 20px;margin: 0;font-size:15px;
    border-radius: 1.6em;
	} 

#nav li:hover > a {color: #9f6324;border-top: solid 2px #8bb2d6;
    
	box-shadow: 0 1px 1px rgba(0,0,0, .2);
	}

/* sub levels link hover */
#nav ul li:hover a, #nav li:hover li a {background: none;border: none;
box-shadow: none;
}
#nav ul a:hover {
	color: white !important;
border-radius: 0;
	}

/* dropdown */
#nav li:hover > ul {display: block;}

/* level 2 list */
#nav ul {display: none;margin: 0;padding: 0;width: 185px;position: absolute;top: 35px;left: 0;
	background:white ;
	border: solid 1px #b4b4b4;
    border-radius: 10px;

box-shadow: 0 1px 3px rgba(0,0,0, .3);
}

#nav ul li {float: none;margin: 0;padding: 0;}

#nav ul a {font-weight: normal;}

/* level 3+ list */
#nav ul ul {left: 181px;top: -3px;}

/* rounded corners of first and last link */
#nav ul li:first-child > a {
border-top-left-radius: 9px;
border-top-right-radius: 9px;
}
#nav ul li:last-child > a {
border-bottom-left-radius: 9px;
border-bottom-right-radius: 9px;

}

/* clearfix */
#nav:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
#nav {display: inline-block;} 

a{

text-decoration: none;
border:none ;
color: #2e8c04;
}
a:hover,a:active,a:focus{
border:none!important;
	color:  #fff;
}

.top {
  vertical-align: middle;
}
h1 {
  text-align: center;

  color: #c9e2d7;
  margin: 80px 0;
}
h2 {
  color: #7f5556;

}

.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
z-index:20;
}
.overlay:target {
  visibility: visible;
  opacity: 1;

}

.popup {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
   border-radius: 10px;
  width: 100%;
  position: relative;
  transition: all 5s ease-in-out;
  background: linear-gradient(30deg, #8abff5 20%, #c2ddfa 65%); 
}
.popup0 {
  position: absolute;
  background: white;
  width: 50%;
  margin: auto;
  padding: 20px;
  height: 50%;

  @media( max-width: 640px ){
			position: relative;
      width: 100%;
	}
.popup h2 {
  margin-top: 0;
  color:#2e8c04;
font-weight: normal;
  font-size: 14px;
}
.popup .close {
  position: absolute;
  top: 20px;
  right: 10%;
  transition: all 200ms;
  font-size: 16px;
  text-decoration: none;
  color: #333;
}
.popup .close:hover {
  text-decoration: none;
}
.popup .content {
  max-height: 30%;
  overflow: auto;
}
@media screen and (max-width: 700px){
  .box{
    width: 70%;
  }
  .popup{
    width: 70%;
  }
}

.box {
  width: 40%;
  margin: 0 auto;
  background: rgba(255,255,255,0.2);
  padding: 35px;
  border: 0px solid #fff;
  border-radius: 20px/50px;
  background-clip: padding-box;
  text-align: center;
}