body{
  margin: 0.3em;
  font-family: Arial;
}

h3{
  text-align: right;
  right: 0.3em;
}

h2, h3{
  font-size: 2em;
  margin-top: 0em;
  float: left;
  width: 50%;
  font-size: 1em;
  font-weight: normal;
  position: fixed;
  z-index: 1;
}

.content{
  margin-top: 1.3em;
  position: absolute;
}


#left, #right{
    width: 45%;
	float: left;
}

#right{
  text-align: right;
  float: right;
  right: 0.3em;
  position: absolute;
}

#center{
	  text-align: center;
	  position:absolute;
	  width: 100%;
      margin: 0em;
}

img{
  width: 100%;
  margin: 0em;
}

#legende{
  margin-top: 0.2em;
  font-size: 0.7em;
}

#titre{
  font-weight: bold;
}

#en{
  font-style: italic;
}

a:link {
  color: black;
  text-decoration:none;
} 

a:hover {
  color: #7CFC00;
} 

a:visited{
  color: black;
}

.gallery, .gallery-2{
  font-size: 0.7em; 
  margin: 1em 0;
  text-align: center; 
}

.gallery img, .gallery-2 img{
  cursor: pointer;
}

.gallery .legende, .gallery-2 .legende-2{
  margin-top: 1em;
}

#prev, #next, #prev-2, #next-2{
  cursor: pointer;
}

@media only screen and (max-width: 550px) and (min-width: 0px) {
    #left, #right{
      width: 80%;
      position: relative;
      }

    #right{
      margin-top: 2em;
    }

    a{
      pointer-events: auto; 
      text-decoration: auto;
    }

    a:visited{
      color: blue;
    }
  }