@media all and (min-width: 600px) and (max-width: 3000px) {
.survol .legende  {
	opacity: 0; /*pour qu'on ne le voit pas, tant que ce n'est pas survollé*/
	align : center;
    transition: all 0.6s ease; /*temps d'apparition au survol*/
	}
}

@media all and (min-width: 600px) and (max-width: 3000px) {
.survol:hover .legende  {
    opacity: 0.9; /*opicité du fond lorsqu'il apparaît, si y a 0.9 c'est qu'il est un peu transparent*/
} 
}

#repro1 {
background: url('images/pt/quentin-spohn-documentsdartistes-saigon.jpg');
display: block;
}

#repro1:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-saigon-2.jpg');
display: block;
}

#repro2 {
background: url('images/pt/quentin-spohn-documentsdartistes-borne.jpg');
display: block;
}

#repro2:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-borne-2.jpg');
display: block;
}

#repro3 {
background: url('images/pt/quentin-spohn-documentsdartistes-frondaison.jpg');
display: block;
}

#repro3:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-frondaison-2.jpg');
display: block;
}

#repro4 {
background: url('images/pt/quentin-spohn-documentsdartistes-Art-Absolument.jpg');
display: block;
}

#repro4:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-Art-Absolument-2.jpg');
display: block;
}

#repro5 {
background: url('images/pt/quentin-spohn-documentsdartistes-tracts.jpg');
display: block;
}

#repro5:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-tracts-2.jpg');
display: block;
}

#repro6 {
background: url('images/pt/quentin-spohn-documentsdartistes-moon.jpg');
display: block;
}

#repro6:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-moon-2.jpg');
display: block;
}

#repro7 {
background: url('images/pt/quentin-spohn-documentsdartistes-carambolage.jpg');
display: block;
}


#repro7:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-carambolage-2.jpg');
display: block;
}

#repro8 {
background: url('images/pt/quentin-spohn-documentsdartistes-vence2018.jpg');
display: block;
}

#repro8:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-vence2018-2.jpg');
display: block;
}

#repro9 {
background: url('images/pt/quentin-spohn-documentsdartistes-figurations.jpg');
display: block;
}

#repro9:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-figurations-2.jpg');
display: block;
}

#repro10 {
background: url('images/pt/quentin-spohn-documentsdartistes-estienne2017.jpg');
display: block;
}

#repro10:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-estienne2017-2.jpg');
display: block;
}

#repro11 {
background: url('images/pt/quentin-spohn-documentsdartistes-ropac2017.jpg');
display: block;
}

#repro11:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-ropac2017-2.jpg');
display: block;
}

#repro12 {
background: url('images/pt/quentin-spohn-documentsdartistes-yishu8.jpg');
display: block;
}

#repro12:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-yishu8-2.jpg');
display: block;
}

#repro13 {
background: url('images/pt/quentin-spohn-documentsdartistes-dojo.jpg');
display: block;
}

#repro13:hover {
background: url('images/pt/quentin-spohn-documentsdartistes-dojo-2.jpg');
display: block;
}

@media all and (min-width: 200px) and (max-width: 1200px) {
.responsive img {
  width: 800px;
}

}

@media all and (min-width: 1200px) and (max-width: 1250px) {
.responsive img, .responsive_tableau {
  width: 850px;
}

}


@media all and (min-width: 1250px) and (max-width: 1300px) {
.responsive img, .responsive_tableau {
  width: 900px;
}

}


@media all and (min-width: 1300px) and (max-width: 1350px) {
.responsive img, .responsive_tableau {
  width: 950px;
}

}

@media all and (min-width: 1350px) and (max-width: 1400px) {
.responsive img, .responsive_tableau {
  width: 1000px;
}

}


@media all and (min-width: 1400px) and (max-width: 1450px) {
.responsive img, .responsive_tableau {
  width: 1050px;
}
}

@media all and (min-width: 1450px) and (max-width: 1500px) {
.responsive img, .responsive_tableau {
  width: 1100px;
}
}

@media all and (min-width: 1500px) and (max-width: 1550px) {
.responsive img, .responsive_tableau {
  width: 1150px;
}
}

@media all and (min-width: 1550px) and (max-width: 3000px) {
.responsive img, .responsive_tableau {
  width: 1200px;
}
}

