@charset "utf-8";
/* set correct box model */
* {
    box-sizing:border-box;
}

/* flexbox container */
.holy-grail-flexbox {
    display:flex;
    flex-wrap:wrap;
}

div.banner img {
	height: auto !important;
	width: auto !important;
	max-width: 100%;
	margin: 0 auto auto auto !important;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

@font-face {
  font-family: "Revival565BT";
  src: url("/fontlibrary/Revival565BT.woff2") format("woff2"),
       url("/fontlibrary/Revival565BT.woff") format("woff");
  font-weight: 800;
  font-style:italic;
  font-display: swap;
}
.revival {
  font-family: "Revival565BT", "Georgia", serif;
}

/* columns (mobile) */
.holy-grail-flexbox > * {
    width:100%;
    /*padding:1rem;*/
}

/* background colors */
/*.holy-grail-flexbox > .header {background:#f97171}
.holy-grail-flexbox > .main-content {background:#fff}
.holy-grail-flexbox > .left-sidebar {background:#f5d55f}
.holy-grail-flexbox > .right-sidebar {background:#c5ed77}
.holy-grail-flexbox > .footer {background:#72c2f1}*/

/*.holy-grail-flexbox > .header {background:#ffffff}*/
.holy-grail-flexbox > .header {background: var(--bg);}
.holy-grail-flexbox > .main-content {background: var(--bg);
    border-bottom: none;    
    border-left: none;
    border-right: none;
}
.holy-grail-flexbox > .left-sidebar {
    background: var(--bg);
    border-right: medium solid #666666;
}
.holy-grail-flexbox > .right-sidebar {background: var(--bg);
    border-left: medium solid #666666;}
.holy-grail-flexbox > .footer {background: var(--bg);
    border-top: medium solid #666666;
    border-bottom: medium solid #666666;
    background: #566676;
    color: white;
}

/* tablet breakpoint */
@media (min-width:768px) {
    .holy-grail-flexbox > .left-sidebar {
        width:22%;} 
    .holy-grail-flexbox > .right-sidebar {
        width:18%;
        display: block;
        margin-left: auto;
        margin-right: auto;} 

/* desktop breakpoint */
@media (min-width:1024px) {
    .holy-grail-flexbox > .header {
        order:-2; /* header first */
    }
    .holy-grail-flexbox > .left-sidebar {
        /* left sidebar second (first in second row) */
        order:-1;
    }
    .holy-grail-flexbox > .main-content {width: 60%;}
    .holy-grail-flexbox > .left-sidebar {
        width:22%;} 
    } 
    .holy-grail-flexbox > .right-sidebar {
        width:18%;} 
    }
    
h1.welcome {
    font-family: "Revival565 BT, sans-serif";
    font-size: 2.5rem;
    color: forestgreen;
    text-shadow: 1px 1px 2px gray; 
    text-align: center;
}
h2.welcome {
    font-family: "Revival565 BT, sans-serif";
    font-size: 2rem;
    color: forestgreen;
    text-shadow: 1px 1px 2px gray; 
    text-align: center;
}
.hearttoheart {
    font-family: "Revival565 BT, sans-serif";
    /*font-size: 250%;*/
    color: green;
    text-shadow: 0px 1px 0px gray; 
}
.50yrs {
    font-family: "Revival565 BT, sans-serif";
    font-size: 225%;
    font-size: 2.25rem;
    font-style: italic;
    color: #b66a60;
    text-shadow: 1px 1px 1px gray; 
    text-align: center;
}
.burlywood {
    color: #b37a31;
    text-align: center;
}    
.darkgreen {
    color: darkgreen;
    text-align: center;
}    
.seagreen {
    color: seagreen
}    
.forestgreen {
    color: forestgreen;
}
.green {
    color: green;
}
.red {
    color: red;
}
.crimson {
    color: #CB0C32;
}


html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: Arial, "sans-serif";
    font-size: 1rem;
    font-style: normal;    
    text-align: left;
    background-color: #E4E4E4;
    color: #222222;
        border-left: medium hidden;
        border-right: medium hidden;
    font-size: var(--base-font-size);    
    line-height: 1.1;
}
p {
	/*font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";*/
	font-family:Arial, "sans-serif";
	font-size: 100%;
    font-size: 1rem;
	line-height: 100%;
    margin-top: 0;
	padding-top: 0.5vw;
	padding-bottom: 0.75vw;
	font-style: normal;
}
main .p {
    padding: 0 2em 0 2em;    
}
div.desk-font p {
	font-family:Arial, "sans-serif";
	font-size: 100%;
	font-size: 1rem;
	line-height: 100%;
}

h1 {
	font-family:Arial, "sans-serif";
	font-size: 165%;
	/*font-size: 1.65rem;*/
	font-weight: bold;
    font-style: normal;
    padding: 0 2.5vw 0 2.5vw;
}

h2 {
	font-family:Arial, "sans-serif";
	font-size: 155%;
	font-size: 1.55rem;
	font-weight: bold;
    font-style: normal;
    margin-left: 1vw;
    padding: 0 2.5vw 0 2.5vw;
}

h3 {
	font-family:Arial, "sans-serif";
	font-weight: bold;
	font-size: 140%;
	font-size: 1.40rem;
    font-style: normal;
    padding: 0 2.5vw 0 2.5vw;
}

h4 {
	font-family:Arial, "sans-serif";
	font-size: 125%;
	font-size: 1.25rem;
	font-weight: bold;
    font-style: normal;
    margin-left: 1vw;
    margin-right: 1vw;
    padding: 0 2.5vw 0 2.5vw;
}
h5 {
	font-family:Arial, "sans-serif";
	font-size: 110%;
	font-size: 1.10rem;
	font-weight: bold;
    font-style: normal;
    margin-left: 1vw;
    margin-right: 1vw;
    padding: 0 2.5vw 0 2.5vw;
}
.imgage-row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	font-size: 75%;
	font-size: 0.75rem;
	margin: 0.25vw 1vw 0 0.5vw;
}

.highslide {
	margin-bottom: 0.75vw;
}

img.imgshadow {
	border: 1px solid #222222;
	-webkit-box-shadow: 2px 3px 6px grey;
	        box-shadow: 2px 3px 6px grey;
	margin-bottom: -0.5vw;
}
    
img.scalable {
	height: auto;
	width: auto;
	display: block;
	max-width: 100%;
}

div.highslide-caption p {
	font: Arial, "sans-serif";
	font-size: 1rem;
	font-weight: normal;
	padding: 5px;
	margin-bottom: -0.1vw;
}

.centered {
    text-align:center;
}
.center-img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.copyr {
    margin-top: 0.5vw;
    margin-bottom: 0;
    font-weight: normal;
}
.floatR {
    float: right;
    margin-top: 0.5vw;
}
.floatL {
    float: left;
    margin-top: 0.5vw;
}
.othersimg {
    float: right;
    padding-right: 18vw;
}
.lessspacebelow {
    margin-bottom: -0.25vh;    
}    
.lessspaceabove {
    margin-top: -0.50vw;    
}
.lessspaceaboveplus {
    margin-top: -1.50vw;    
}
.lessspace {
    margin-top: -1vw;
    margin-bottom: 0;
}
.morebelow {
    padding-bottom: -1vh;
}
.leftimg2 {
	/*float:none;
	font-size: 65%;
	text-align: center;
	padding: 0.5vw 1vw 0.5vw 0vw;
	padding-right: 1vw;
	padding-top: 0.8vw;
	align-self: center;*/
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.opc {
    opacity: 100%;
}    
.divider {
  border: none;              /* remove default look */
  height: 1px;               /* thickness */
  background-color: #333;    /* line color */
  width: 100%;                /* length */
  margin: 0 auto;         /* spacing + centering */
}
.divider1 {
  border: none;              /* remove default look */
  height: 1px;               /* thickness */
  background-color: #000;    /* line color */
  width: 100%;                /* length */
  margin: 0 auto;         /* spacing + centering */
}
.tears {
    padding-left: 1vw;
}

.padl {
    padding-left: 1vw;
}
    
.padr {
    padding-right: 2vw;
}
    
.intro:first-letter {
    font-size : 180%;
    font-size: 1.8rem;
    font-weight : bold;
    float: left;
    margin-top: -0.4vh;
}
.footer {
    background: #566676;
    color: ghostwhite;
    font-size: 0.85rem
}

.dropcap:first-letter {
/*font-size: 180%;
line-height: 0.9;*/
margin: 0 0.12em 0 0;
-webkit-initial-letter: 1.5;
initial-letter: 1.5;
font-weight: 700;
}    
    
/* Accessibility toolbar */

.accessibility-toolbar {
      position: sticky;
      top: 0;
      z-index: 100;
      display: flex;
      align-items: center;
      gap: 0.75rem;
      padding: 0.5rem 1rem;
      background: var(--color-toolbar-bg);
      color: var(--color-toolbar-text);
      border-bottom: 1px solid #111827;
    }

.accessibility-toolbar__label {
      font-size: 0.875rem; /* 14px @ default */
      white-space: nowrap;
    }

.accessibility-toolbar__buttons {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      flex-wrap: wrap;
    }

.accessibility-toolbar button {
      font: inherit;
      border-radius: 999px;
      border: 1px solid var(--color-border);
      padding: 0.25rem 0.75rem;
      background: #111827;
      color: var(--color-toolbar-text);
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.25rem;
      transition: background 0.15s ease, border-color 0.15s ease,
                  transform 0.1s ease;
    }

.accessibility-toolbar button:hover {
      background: #030712;
      border-color: #4b5563;
    }

.accessibility-toolbar button:active {
      transform: translateY(1px);
    }

.accessibility-toolbar button:focus-visible {
      outline: 2px solid #facc15;
      outline-offset: 2px;
    }

.accessibility-toolbar__value {
      font-size: 0.875rem;
      color: #9ca3af;
      min-width: 4ch;
      text-align: right;
    }

/* CSS Document */

