/* Tout le document */ 
html{
    max-width: 800px;
    margin: auto;
}

/* Menu principal */

#primary_nav_wrap
{
    margin-top: 15px;
    display: block;
    height: 50px;
    width: 800px;
    flex-wrap: nowrap;
    justify-items: center;
    padding: auto;
}


#primary_nav_wrap ul
{
	list-style: none;
	position: relative;
	float: left;
    flex-wrap: nowrap;
    justify-items: center;
    padding: auto;
    width: 800px;  
}


#primary_nav_wrap ul a
{
	display:block;
	color:#57cc99;
	text-decoration:none;
	font-weight:700;
	font-size:13px;
	line-height:50px;
	padding: auto;
	font-family:"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
}


#primary_nav_wrap ul li
{
	position:relative;
	float:left;
	margin:0;
	padding: 10px;
    flex-wrap: nowrap;
    justify-items: center;
}

#primary_nav_wrap ul li:hover
{
	background:#ddd;
    border-radius: 50px;
}

#primary_nav_wrap ul a:hover
{
    color: #3e6a40;
}
/* Corps de texte */

body{
    color:grey;
}

h2{
    font-family: monospace;
    font-size:large;
	letter-spacing: 3px;
    line-height: 50px;
	color:#3e6a40;
}

h3{
    font-family: monospace;
    font-size:large;
    line-height: 20px;
    color:darkgreen;
}

pre{
    font-family: cursive; 
    background-color: inherit;
}

p{
    font-family: monospace;
    font-size: medium;
}

p.question{
    font-weight: bold;
}

a
{
    color:#57cc99;
    text-decoration: none;
}

a:hover{
color:#bde6ff;
}
.title{
    color:grey;
}

tr{
	margin-top: 6px;
  	margin-bottom: 12px;
}

/* Images et médias */

video {
    border-radius: 50%;
    max-width: 100%; 
    margin: 12px 12px;
}

figure{
    margin:auto;
    float: center;
    text-align:center;
}

figcaption{
   color: darkslateblue;
   font-style: italic;
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   font-size: xx-small;
}

iframe{
    margin: 15px 0;
}

a.sssoulignement:link {
    text-decoration: none;
}

.bouton{
    outline: none;
    border: 0.125rem solid #000;
    border-radius: 0.5rem;
    background: #f4f4f4;
    color: #292929;
    font-size: 14pt;
    text-align: center;
    padding: 1% 3% 1% 3%;
    margin: 4% 5% 2% 5%;
    transition: all 1s ease-in-out;
    cursor: pointer;
}
.bouton:hover{
    color: #17520f;
    background: #9bbcdd;
    border: 0.125rem solid #17520f;
    transition: all 1.0s ease-in-out;
}

/* En-tête */ 

h1{
    font-family: monospace;
    font-size:large;
    color:rgb(68, 66, 66);
	/*text-shadow: darkslateblue 3px 3px 20px;*/
	letter-spacing: 3px;
    line-height: 50px;
}

#logo{
    max-width: 800px;
    float: left;
}

/*Galerie d'images*/
.photos {
    display:inline-block;
    justify-content: center;
    align-items: center;
    align-content:center;

}
.photos-image>a>img {
height: 230px;
width: 230px;
object-fit: cover;
border-radius: 2px;
margin-top: 6px;
margin-bottom: 6px;
}
.photo-caption {
    margin-bottom: 12px;
    margin-top: 6px;
    text-align: center;
}

/* Pied de page */

footer{
    display: block;
    text-align: center;
    margin-top: 2cm;
}
a.footer:hover{
    color:#17520f;
}
