/* (A) GALLERY WRAPPER */
*,html,body {
font-family:sans-serif, Arial, Helvetica;
font-size:1em;
background-color: rgb(180, 180, 180);
}

a:link, a:active, a:visited {
	text-decoration-line: none;
	text-decoration-color: black;
	color:black;
	}
	
a:hover{
font-weight:bold;
font-size:1em;
color:yellow;
}

input[type=button]{
background-color: white;
color:black;
}
figcaption {
/*  background-color: black; */
/* background-color: rgb(200, 200, 200); */
/*  color: white; */
  font-style: bold;
  font-size: 1em;
  padding: 4px;
  text-align: center;
}

.title {
font-size:2em;
font-weight:bold;
text-align:center;
content-align:center;
color:white;
text-shadow: 2px 2px black;
}
.subtitle {
/* color:yellow; */
color:black;
text-align:center;
content-align:center;
font-size:1.2em;
/* text-shadow: 1px 1px black; */
}
.detail {
margin-left:25px;
margin-top:25px;
font-size:1.2em;
}
.detail tr>td {
border-bottom: 1px solid red;
}
.gallery {
  /* (A1) GRID LAYOUT - 3 IMAGES PER ROW */
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 15px;
 
  /* (A2) OPTIONAL WIDTH RESTRICT */
  max-width: 1000px;
  margin: 0 auto;
  overflow: hidden;
}
 
/* (B) GALLERY IMAGES */
.gallery img {
  /* (B1) DIMENSION */
  width: 100%;
 height: 33% /* optional */ 
  padding: 10px;
 
  /* (B2) COLORS */
  border: 1px solid #ddd;
  background: #fff;
 
  /* (B3) IMAGE RESIZE */
  /* cover | contain | fill | scale-down */
  object-fit: cover;
}
 
/* (C) ON SMALL SCREENS - 2 IMAGES PER ROW */
@media only screen and (max-width: 600px) {
  .gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
 
/* (D) OPTIONAL ZOOM ON HOVER */
.gallery img:hover {
  z-index: 9;
  transform: scale(1.3);
  /* linear | ease | ease-in | ease-out | ease-in-out */
  transition: transform ease 0.5s;
}
 
/* (E) FULLSCREEN MODE */
.gallery img.full {
  position: fixed;
  top: 0; left: 0; z-index: 999;
  width: 100vw; height: 100%;
  object-fit: contain;
  background: rgba(0, 0, 0, 0.7);
}
.gallery img.full:hover {
  z-index: 999;
  transform: none;
}