body {font-family: Calabri, "Trebuchet MS", Verdana, Geneva, Helvetitca, san-serif;}
body  /* body-tag */ { font-size: 14pt; background-color: white; }

body#photopage { background-color: white; text-align: center; width: 805px; margin-left: 45px; }
body#homepage { font-size: 12pt; background-color: white; text-align: center; width: 805px;}
p { font-size: 14pt; }
body#homepage p { font-size: 12pt;}

.button { background-color: #f0f0f0; padding: 6pt; border: outset 2px gray; font-size: 12pt; width: 95%; margin-bottom: 10px;}

.button > a {text-decoration: none;}

.tab > p { background-color: #f0f0f0; padding: 6pt; border: outset 2px gray; font-size: 12pt; margin-bottom: 10px;}

.tab {padding: 6pt; text-decoration: none; font-size: 12pt;}

cite { font-size: 11pt; }

/* bread crumb (navigation) styles */

.breadcrumb {
	display:inline-block;
	clear: both;
	margin-left: 20px;
}

.breadcrumb hr {   /* horz. rule */
  margin-left: 0px;
}

.breadcrumb ul {
  padding: 5px 5px;
  list-style: none;
  background-color: #eee;
}

/* Display list items side by side */
.breadcrumb ul li {
  display: inline;
  font-size: 18px;
}

/* Add a slash symbol (/) before/behind each list item */
.breadcrumb ul li+li:before {
  padding: 8px;
  color: black;
  content: ">\00a0";
}

/* Add a color to all links inside the list */
.breadcrumb ul li a {
  color: #0275d8;
  text-decoration: none;
}

/* Add a color on mouse-over */
.breadcrumb ul li a:hover {
  color: #01447e;
  text-decoration: underline;
}

/* End of bread crumb styles */


table  /* fix or remove after photopage update */ {  }
td { font-size: 12pt; }

h1 { font-size: 28pt; font-weight: normal; }
h2 { font-size: 22pt; font-weight: bold; }
h3 { font-size: 18pt; font-weight: bold; }
h4 { font-size: 15pt; font-weight: bold; }
h5 { font-size: 12pt; font-weight: bold; }

/* Column based layout with device sizing code */

body#sectionhead {
  box-sizing: border-box;
}

  /* For mobile phones: */
[class*="col-"] {
    width: 100%;
  }


@media only screen and (min-width: 750px) {
  /* For tablet / desktop: */

.col-1 {width: 14%;}
.col-2 {width: 20%;}
.col-3 {width: 30%; min-width: 185px;}
.col-4 {width: 40%;}
.col-5 {width: 50%;}
.col-6 {width: 60%;}
.col-7 {width: 70%;}
.col-8 {width: 80%;}
.col-10 {width: 100%; }

}

.row {
  clear: both;
  display: block;
}

.row::after {
  content: "";
  clear: both;
  display: block;
}


[class*="col-"] {
  float: left;
  padding: 15px;
}




body#homepage h2 { font-size: 18pt; font-weight: bold; }
body#homepage h3 { font-size: 15pt; font-weight: bold; }
body#homepage h4 { font-size: 12pt; font-weight: bold; }
body#landingpage h1 { color: gray; font-size: 28pt; font-weight: normal; }
body#landingpage h2 { color: gray; font-size: 22pt; font-weight: bold; }
a:link { color: blue }
a:visited { color: purple }
a:hover { color: purple }
a:active { color: red }
.footer { font-size: 11pt; margin-left: 28pt; background-color: white; text-align: left; width: 480px; padding: 2pt 2pt 2pt 3pt; }
.indent { text-align: left; margin-left: 28pt; }
.offset { text-align: left; margin-left: 60pt; }
.center { text-align: center; margin-left: 30pt; width: 720px; }

.msg { font-size: 11pt; background-color: #f0f0f0; text-align: left; padding: 2pt; }

.msghead { color: white; font-size: 11pt; font-weight: bold; font-stretch: wider; background-color: maroon; text-align: center; word-spacing: 2pt; letter-spacing: 1.5pt; margin: 0; padding: 2pt; }
.newpage {page-break-before: always}
