/* photos2.css - Feb 2022 version. Has variable picture size & all thumbs 135 x 81, tested on individual image page and thumbnails pages. In previous (2021) version site shifted when scroll bars were needed; this overcome by changing .default to have widths (including margins) in vw rather than %
Nov 2023 - reduced/eliminated bottom padding & margin in default to make it less likely that unnecessary scroll bar appears */

.default {
  width: 90vw;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 5px;
  font-family: Verdana,Arial,sans-serif;
  font-size: small;
  float: left; 
  margin-top: 10px; margin-left: 5vw; margin-right: 5vw; margin-bottom: 0px;
  }
a:link {
  color: navy;
  text-decoration: none;
}
a:visited {
  color: #993399;
  text-decoration: none;
}
a:hover {
  color: red;
  text-decoration: underline;
}
.titlespace {
  height: 85px;
  width: 60%;
  min-width: 600px;
  margin: auto;
  text-align: center;
}
.titlepic {
  border: none;
  width: 553px;
  height: 70px;
  }
.navbar {
  margin: 15px 10px;
  width: 68%;
  height: 30px;
}
.breadcrumb {
  float: left;
  color: navy;
}
.prevnext {
  float: right;
  color: #cccccc;
}
.picbox {
  width: 68%;
  text-align: center;
  float: left;
  z-index: 1;
  margin-left: 10px;
  margin-right: 10px;
}
.subhead {
  margin: 0px 10px 0px 9px;
  width: 100%;
  height: 30px;
  float: left;
  text-align: left;
  font-family: Verdana,Arial,sans-serif;
  font-size: medium;
  color: navy;
  font-weight: normal;
}

/* normal picture size is 800 x 480 (5:3) or 600 x 600; max-width in .pic class should work with any size image, shrinking on smaller displays. .picns allows for non-standard cases where size must be specified on each image (& is fixed) */

.pic {
  border: 1px solid navy;
  max-width: 100%;
  height: auto;
}
.picns {
  border: 1px solid navy;
}
.thumb {
  width: 155px;
  height: 135px;
  text-align: center;
  float: left;
  color: navy;
}

/* ALL thumbs to be 135 x 81 (5:3) regardless of shape of main photo (ie cropped if necessary). If exceptionally another size is needed use .picns class and set size per image */

.thpic {
  border: 1px solid navy;
  width: 135px;
  height: 81px;
}
.textbox {
  float: left;
  background-color: white;
  z-index: 2;
  padding-top: 0px;
  padding-left: 5px;
  width: 28%;
}
.maintext {
  margin: 0px 10px 5px 10px;
}
.largertext {
  font-family: Verdana,Arial,sans-serif;
  font-size: medium;
  color: navy;
  font-weight: normal;
}
.smallertext {
  font-family: Verdana,Arial,sans-serif;
  font-weight: normal;
  font-size: x-small;
}
.italic {
  font-style: italic;
}
.bold {
  font-weight: bold;
}