#photoGallery {
  position:relative;
  background:wheat;
}
#photoGallery .featurePhotoBox {
  position: relative; width:100%;
  top: 0%;
  left: 0%;
}
#photoGallery .featurePhotoBox img {width:100%; border-radius:10px; height:100px; 
object-fit:fill;}


#photoGallery .featureBoxCaption {
  position: absolute; width:90%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size:18px; font-weight:bold; font-style:italic; line-height:130%;
  color:white;
  text-shadow: 2px 2px grey;
}
#photoGallery .featureBoxSummary {display:none;}

/* ---------- Photo Album listings ----------- */

.indexList li a, .photoList li a {
  font-size:14px; line-height:18px; font-weight:bold; 
}
ul.photoList {
  list-style-type: none;
  padding: 0;
  border: 1px solid #ddd;
}

ul.photoList li {
  padding: 8px 16px;
  background:coral;
  border-bottom: 1px solid #ddd;
}
ul.photoList li:hover {
  background:teal;
}
ul.photoList li a {
  display:inline-block; width:100%;
  color:white; font-weight:bold;
  text-decoration: none;
  font-size:14px;
}

ul.photoList li a:hover {
  text-decoration:none; color:white;
}

ul.photoList li:last-child {
  border-bottom: none
}

/* ---------- Photo Gallery listings ----------- */

.photoGallery ul.indexList {
  list-style-type: none;
  padding: 0;
  border: 1px solid #ddd;
}

.photoGallery ul.indexList li {
  padding: 8px 16px;
  background:coral;
  border-bottom: 1px solid #ddd;
}
.photoGallery ul.indexList li:hover {
  background:teal;
}
.photoGallery ul.indexList li a {
display:inline-block; width:75%;
  color:white; font-weight:bold;
  text-decoration: none;
  font-size:14px;
}

.photoGallery ul.indexList li a:hover {
  text-decoration:none; color:white;
}

.photoGallery ul.indexList li:last-child {
  border-bottom: none
}
/* ---------- Responsive ----------- */

@media only screen and (max-width: 600px) {
  ul.photoList li a   {font-size:20px; line-height:24px;}
  ul.indexList li a   {font-size:20px; line-height:24px;}
}


