 // Get the modal
 var modal = document.getElementById('myModal1');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg1');
 var modalImg = document.getElementById("img01");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close1")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
   modal.style.display = "none";
 }

 //////////////////////////////////////////////////////////

 // Get the modal
 var modal = document.getElementById('myModal2');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg2');
 var modalImg = document.getElementById("img02");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close2")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
   modal.style.display = "none";
 }

 //////////////////////////////////////////////////////////

 // Get the modal
 var modal = document.getElementById('myModal3');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg3');
 var modalImg = document.getElementById("img03");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close3")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
   modal.style.display = "none";
 }

 //////////////////////////////////////////////////////////
 // Get the modal
 var modal = document.getElementById('myModal4');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg4');
 var modalImg = document.getElementById("img04");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close4")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
     modal.style.display = "none";
   }
   //////////////////////////////////////////////////////////
   // Get the modal
 var modal = document.getElementById('myModal5');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg5');
 var modalImg = document.getElementById("img05");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close5")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
     modal.style.display = "none";
   }
   //////////////////////////////////////////////////////////
   // Get the modal
 var modal = document.getElementById('myModal6');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg6');
 var modalImg = document.getElementById("img06");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close6")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
   modal.style.display = "none";
 }


 //////////////////////////////////////////////////////////
 // Get the modal
 var modal = document.getElementById('myModal7');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg7');
 var modalImg = document.getElementById("img07");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close7")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
     modal.style.display = "none";
   }
   //////////////////////////////////////////////////////////
   // Get the modal
 var modal = document.getElementById('myModal8');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg8');
 var modalImg = document.getElementById("img08");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close8")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
     modal.style.display = "none";
   }
   //////////////////////////////////////////////////////////
   // Get the modal
 var modal = document.getElementById('myModal9');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg9');
 var modalImg = document.getElementById("img09");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close9")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
   modal.style.display = "none";
 }


 //////////////////////////////////////////////////////////
 // Get the modal
 var modal = document.getElementById('myModal10');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg10');
 var modalImg = document.getElementById("img10");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close10")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
     modal.style.display = "none";
   }
   //////////////////////////////////////////////////////////
   // Get the modal
 var modal = document.getElementById('myModal11');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg11');
 var modalImg = document.getElementById("img11");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close11")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
     modal.style.display = "none";
   }
   //////////////////////////////////////////////////////////// Get the modal
 var modal = document.getElementById('myModal12');

 // Get the image and insert it inside the modal - use its "alt" text as a caption
 var img = document.getElementById('myImg12');
 var modalImg = document.getElementById("img12");
 img.onclick = function () {
   modal.style.display = "block";
   modalImg.src = this.src;
   modalImg.alt = this.alt;
   captionText.innerHTML = this.alt;
 }

 // Get the <span> element that closes the modal
 var span = document.getElementsByClassName("close12")[0];

 // When the user clicks on <span> (x), close the modal
 span.onclick = function () {
   modal.style.display = "none";
 }
