/* The Modal (background) */
		.modal {
		  display: none;
		  position: fixed;
		  z-index: 1;
		  left: 0;
		  top: 0; 
		  width: 100%;
		  height: 100%;
		  overflow-x: hidden ;
		  background-color: #ffffff;
		  margin: auto; 
		}
 

		.modal-content {
			display: flex;
			border: 0px solid red;
		  	margin: auto;
		  	overflow: hidden;
		}

		#horizontal { width: 67%; max-width: 1200px; min-width: 500px; }

		#vertical { width: 30%; max-width: 1100px; min-width: 400px; }

		.legende {
			border: 0px solid red; z-index: 1; font-size: 13px; padding: 10px 0 0 0;
			color: #292428;  text-decoration: none;
			text-align: right; display : flex; justify-content: space-between;
		}

		.legende a { text-decoration: none; color: #292428; }

		/* The Close Button */
		.close {
		  color: #292428;
		  position: absolute;
		  top: 10px;
		  right: 25px;
		  font-size: 40px;
		}

		.close:hover,
		.close:focus {
		  color: #aaaa55;
		  cursor: pointer;
		}	

		.mySlides {
		  display: none;
		}
 
		.cursor {
		  cursor: pointer;
		}

		/* Next & previous buttons */
		.prev,
		.next {
		  cursor: pointer;
		  position: absolute;
		  bottom: 130px;
		  width: auto;
		  padding: 27px;
		  color: #292428;
		  font-size: 18px;
		}

		/* Position the "next button" to the right */
		.next {
		  right: 0;
		}

		/* On hover, add a black background color with a little bit see-through */
		.prev:hover,
		.next:hover {
		  color: #aaaa55;
		}

		img.hover {
		  transition: 0.3s;
		}

		video.hover {
		  transition: 0.3s;
		}

		.hover:hover {
		  opacity: 0.7;
		}