body {
font-family: "Verdana", Arial, sans-serif;
}
table, th, td {
border: 0px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px 10px;
text-align: left;
}
.rangepaire {
background: #F2F2F2;
cursor: pointer;
}
.rangepaire:hover {
background-color: #ffff99;
}
.rangeimpaire{
background: #FAFAFA;
cursor: pointer;
}
.rangeimpaire:hover {
background-color: #ffff99;
}
a.one:link, a.one:visited {
background-color: #99ccff;
color: black;
padding: 4px 8px;
margin: 10px 0 0 0;
text-align: center; 
text-decoration: none;
display: inline-block;
}
a.one:hover, a.one:active {
background-color: red;
}

a.two:link, a.two:visited {
background-color: #cce6ff;
color: black;
padding: 4px 8px;
text-align: center; 
text-decoration: none;
display: inline-block;
}
a.two:hover, a.two:active {
background-color: red;
}

a.three:link, a.three:visited {
background-color: #e6f2ff;
color: black;
padding: 4px 8px;
text-align: center; 
text-decoration: none;
display: inline-block;
}
a.three:hover, a.three:active {
background-color: red;
}

a.four:link, a.four:visited {
background-color: #cce6ff;
color: black;
padding: 4px 8px;
text-align: center; 
text-decoration: none;
display: inline-block;
}
a.four:hover, a.four:active {
background-color: red;
}

a.five:link, a.five:visited {
background-color: #cce6ff;
color: black;
padding: 4px 8px;
text-align: center; 
text-decoration: none;
display: inline-block;
}
a.five:hover, a.five:active {
background-color: red;
}

#TableImages {
float: right;
}
		#la_grande_image {
		border-radius: 5px;
		cursor: pointer;
		transition: 0.3s;
		}

		#la_grande_image:hover {opacity: 0.7;}

		/* The Modal (background) */
		.modal {
		display: none; /* Hidden by default */
		position: fixed; /* Stay in place */
		z-index: 1; /* Sit on top */
		padding-top: 100px; /* Location of the box */
		left: 0;
		top: 0;
		width: 100%; /* Full width */
		height: 100%; /* Full height */
		overflow: auto; /* Enable scroll if needed */
		background-color: rgb(0,0,0); /* Fallback color */
		background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
		}

		/* Modal Content (image) */
		.modal-content {
		margin: auto;
		display: block;
		width: 80%;
		max-width: 700px;
		}

		/* Caption of Modal Image */
		#caption {
		margin: auto;
		display: block;
		width: 80%;
		max-width: 700px;
		text-align: center;
		color: #ccc;
		padding: 10px 0;
		height: 150px;
		}

		/* Add Animation */
		.modal-content, #caption {    
		-webkit-animation-name: zoom;
		-webkit-animation-duration: 0.6s;
		animation-name: zoom;
		animation-duration: 0.6s;
		}

		@-webkit-keyframes zoom {
		from {-webkit-transform:scale(0)} 
	to {-webkit-transform:scale(1)}
	}

	@keyframes zoom {
	from {transform:scale(0)} 
to {transform:scale(1)}
}

/* The Close Button */
.close {
position: absolute;
top: 15px;
right: 35px;
color: #f1f1f1;
font-size: 40px;
font-weight: bold;
transition: 0.3s;
}

.close:hover,
.close:focus {
color: #bbb;
text-decoration: none;
cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
.modal-content {
width: 100%;
}
}