:root
{
  --globalSiteHue: 196;
  --eglantineBack:hsla(var(--globalSiteHue), 50%, 50%,  100%);
}

body
{
  background-position: top; 
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url('../images/engagements.jpg');
  background-color: hsl(var(--globalSiteHue), 50%, 50%);
  min-height: 100vh;
}


.whitePage
{
  background-color: hsla(var(--globalSiteHue), 50%, 90%,  90%);
  height: 100%;
  width: 100%;
  padding: 8em min(6em, 10%);
}

.site-section 
{
  padding: 3em 0; 
}

h3
{
  margin-bottom: 1em;
  text-align: center;
}

h1
{
  margin-bottom: 1em;
}

h2
{
  margin-top: 1em;
  margin-bottom: 1em;
}

p
{
  text-align: justify;
  margin-bottom: 1em;
}

.textZone
{
  padding: 1em;
}

.textZone img
{
  width: 60%;
  margin-bottom: 2em;
  margin-top: 2em;
}



#Eglantine
{ 
  background-color:  hsl(var(--globalSiteHue), 60%, 70%);
}

#apropos
{
  padding: 1em;
  border: solid  hsl(var(--globalSiteHue), 60%, 70%);
}

#Engagements
{
  padding-top : 3em;
  background-color: hsl(var(--globalSiteHue), 40%, 80%);
}

.whitePage
{
  padding-bottom: 6em;
}

#Ecologie
{
  padding: 1em;
  border: solid  #76b101;
  border-radius: 0.5em;
}

#Hospitalite
{
  padding: 1em;
  border: solid  hsl(var(--globalSiteHue), 50%, 50%);
  border-radius: 0.5em;
}