/*
@layer standard;
*/
/*
 * A few things have to go outside the @layer because they
 * must take precedence (like !important but better).
 */

body { /* This must be outside the layer because TinyMCE borks the font otherwise. */
  font-family: Poppins, Nunito, Arial, Helvetica, sans-serif;
  color: #000046;
  font-size: 12pt;
  margin: 0;
  border: 0;
  padding: 8px;
  width: 100%;
  background: #fff;
  box-sizing: border-box;
  position:relative;
  overflow-y:scroll;
}

/* These focus highlights need to override the UA stylesheet. */
.editable[contenteditable]:focus {
  background-color:#c0ffc0;
}
.editable[contenteditable]:focus-visible {
  outline:1px solid #00c00060;
}

/*
@layer standard {
*/

.no-drop-cursor, .no-drop-cursor * {
  cursor: no-drop;
}
.copy-cursor, .copy-cursor * {
  cursor: copy;
}
html,body {
  min-height:100vh;
}
sup, sub {
  vertical-align: baseline;
  position: relative;
  top: -0.3em;
  line-height: 0;
}
sub { 
  top: 0.3em; 
}

a, a * {
  cursor: pointer;
}

.clearfix {
  margin-top:1px;
  overflow: visible;
  position: relative;
}
.clearfix::after {
  content:"";
  display:table;
  clear:both;
}
.clearfix p::before {
  display:block;
  width:8em;
  overflow:hidden;
  content:'';
}
span.vcenter {
  display:inline-block;
  vertical-align:middle;
  height:100%
}

dl::before {
  content:"";
  display:table;
  clear:both;
}

#masthead {
  width: 100%;
  margin: 0;
  padding: 0;
  position: relative;
  background: #fff;
}

#masthead-image {
  padding: 0;
  margin: 0;
  border-width: 0;
  border-bottom: 2px solid white;
  width:100%;
  display:block;
}
#masthead-image::after {
  content:"";
  display:table;
  clear:both;
}
#masthead-image a {
  vertical-align: top;
  padding: 0;
  margin: 0;
  border: none;
  display:inline-block;
}
#masthead-image a img {
  margin:0;
  width:100%;
  position: relative;
  left:0;
  top:0;
}

#content {
  padding: 20px min(2%,20px);
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  overflow: visible;
  background-color: white;
  position: relative;
  z-index: 0;
}

body * {
  box-sizing: border-box;
}

.imagestrip-container {
  width:100%;
  padding: 0 5px 6px 0;
  border:none;
  margin:10px auto;
  position:relative;
  font-size:14pt;
  z-index:10;
}
.imagestrip-container.single {
  width:360px;
  max-width:100%;
}
.imagestrip-container.has-caption {
  border:1px solid black;
  margin-top:calc(10px + 0.7em);
}
p.imagestrip-container-legend {
  border:none;
  padding: 0 4px;
  margin: 0 0 -0.6em 6px;
  position: relative;
  top: -0.7em;
  left: 0;
  color: rgb(2,103,142);
  background-color:white;
  font-size: inherit;
  z-index:5;
  width:fit-content;
}
.imagestrip-row {
  text-align:center;
  margin: 0;
  padding:0;
  line-height:0;
}
.imagestrip-thumb {
  margin: 0 -5px -5px 0;
  padding: 0;
  border: 5px solid white;
  border-radius: 12px;
  box-sizing: content-box;
  position:relative;
  z-index:0;
}
.imagestrip-thumb.selected {
  border-color:white;
  z-index:5;
}
.imagestrip-thumb:hover {
  border-color:yellow;
  z-index:10;
}

#lightbox {
  display:flex;
  flex-direction:column;
  border:none;
  border-radius:15px;
  overflow:hidden;
  position:fixed;
  width:calc(100% - 10px);
  height:calc(100% - 10px);
  left:5px;
  top:5px;
  z-index:1000;
  background-color: rgba(80,80,80,0.92);
  box-shadow: 3px 3px 6px 4px #808080;
}
#lightbox-galleryname-container {
  position:relative;
  flex-grow:0;
  flex-shrink:0;
  width:100%;
  background-color: rgba(2, 103, 142,0.8);
  left:0;
  color:white;
  font-size:20px;
  text-align:center;
  padding:0;
  margin:0;
  border:none;
  border-radius:15px;
}
#lightbox-galleryname {
  display: inline-block;
  padding: 2px 5px;
  width:calc(100% - 164px);
}
#lightbox-caption-container {
  position:relative;
  flex-grow:0;
  flex-shrink:0;
  width:100%;
  background-color: transparent;
  left:0;
  padding:0;
  margin:0;
  border:none;
}
#lightbox-caption {
  display:inline-block;
  vertical-align:middle;
  height: auto;
  width:100%;
  background-color: transparent;
  color:white;
  font-size:16px;
  text-align:center;
  padding:3px;
  margin:0;
  border:none;
}
#lightbox-close, #lightbox-download {
  font-family:inherit;
  background-color:#e0e0e0;
  border:3px outset #ffffff;
  border-radius:12px;
  color:black;
  font-size:16px;
  height:26px;
  padding:0;
  width:80px;
  position:absolute;
  text-align:center;
  top:2px;
}
#lightbox-close {
  right:2px;
}
#lightbox-download {
  display:none;
  left:2px;
}
#lightbox-download:hover {
  text-decoration:none;
}
button.lightbox-skip {
  position:absolute;
  height:100%;
  width:30px;
  padding:0;
  font-size:20px;
  background-color:#e0e0e0;
  border:3px outset #ffffff;
  color: black;
}
button.lightbox-skip:focus {
  outline:none;
}
button#lightbox-goLeft {
  bottom:0;
  left:0;
  border-radius:12px 0 0 12px;
}
button#lightbox-goRight {
  bottom:0;
  right:0;
  border-radius:0 12px 12px 0;
}
#lightbox-contactStrip {
  position:relative;
  overflow:hidden;
  width:100%;
  left:0;
  border:0px solid #e0e0e0;
  background-color:rgba(0,0,0,0.4);
  min-height:60px;
  height:15%;
  max-height:100px;
  flex-grow:0;
  flex-shrink:0;
}
#lightbox-contactImageArea{
  left:30px;
  width:calc(100% - 60px);
  height:100%;
  overflow:hidden;
  position:absolute;
  padding:0;
  margin:0;
}
#lightbox-contactRoll{
  position:absolute;
  overflow:visible;
  white-space:nowrap;
  height:100%;
  top:0;
  left:0;
  border:none;
  background-color:transparent;
  transition: left 1s;
  -webkit-transition: left 1s;
}
#lightbox-contactStrip .imagestrip-thumb {
  box-sizing:border-box;
  height:100%;
  border-color:#a0a0a0;
  border-width:3px;
  margin: 0 -3px 0 0;
  border-radius:0;
  opacity:0.6;
}
#lightbox-contactStrip .imagestrip-thumb.selected {
  border-color:white;
  z-index:5;
  opacity:1;
}
#lightbox-contactStrip .imagestrip-thumb:hover {
  border-color:yellow;
  opacity:0.9;
  z-index:10;
}
#lightbox-image-area {
  position:relative;
  flex-grow:1;
  width:100%;
  left:0;
  background-color: transparent;
  text-align:center;
  margin: 0; padding: 0;
  white-space: nowrap;
  overflow:auto;
}
#lightbox-image, #lightbox-image-placeholder {
  position:relative;
  vertical-align:middle;
  font-size:150%;
  color:white;
}
#lightbox-image {
  border:4px solid white;
}
#lightbox-image-placeholder {
  border:none;
}

#footer {
  background-color: #02678e;
  clear: both;
  text-align: center;
  padding: 5px;
  width:100%;
  margin: 0;
}
#footer p {
  color: #fff;
  font-weight: bold;
  font-size: 0.8em;
  margin: 0;
  padding: 0;

}
#footer p.white {
  color: #000045;
  background-color:white;
  font-weight: normal;
  font-size: 1em;
  margin-bottom:0.5em;
  padding:0.5em;
}

aside {
  width: 250px;
  max-width: 50%;
  min-width: 30%;
  float: right;
  padding: 5px;
  margin-right: 0;
  margin-left: calc(5% - 10px);
  margin-bottom: 10px;
  margin-top: 10px;
  background-color: #fff;
  border: 1px #00aeef solid;
  -moz-border-radius: 15px;
  border-radius: 15px;
  overflow:visible;
  position:relative;
  right:-20px;
  z-index: 3;
}
aside.inline {
  max-width:800px;
  width:100%;
  float:none;
  position:initial;
  margin:10px auto;
}
aside.inline.alert {
  border:2px solid red;
  background-color:yellow;
}

aside h5 {
  margin: 0;
  padding: 0px 10px;
  font-size: 12pt;
  text-align: center;
  color: #00aeef;
}
/* Avoid need for enclosing <p> around standalone link */
aside > a {
  display: block;
}
aside p, aside > a {
  margin: 0;
  padding: 5px 10px;
  font-size: 11pt;
  text-align: center;
}
aside p {  
  color: #000046;
}
aside.inline p {
  font-size:100%;
}

.map {
  width: calc(50% - 15px);
  height: 40vw;
  float: right;
  margin-top: 0;
  margin-right: 0;
  margin-left: 15px;
  margin-bottom: 10px;
  border:4px outset #c0c0c0;
  border-radius:10px;
  background-color:white;
  height:auto;
  overflow:auto;
  position: relative; /* just for z-index */
  z-index: 1;
}

.offset {
  margin-left: 120px;
}

.photoright {
  width: 50%;
  margin: 5px;
  padding: 5px;
  border: 1px #ccc solid;
  float:right;
  text-align: center;
  position:relative;
  z-index:1;
}
.cameo {
  width:150px;
  max-width:50%;
  border-radius:50%;
  border:none;
  margin:0;
}

a {
  color: #00f;text-decoration:none  
}
a:visited
{
  color: #00f;text-decoration:none 
} 
a:active 
{
  color: #00f;text-decoration:none
}
a:hover
{ 
  color: #00f;text-decoration:underline
}


h1 
{
  width: 100%;
  margin: 0;
  margin-bottom: 6pt;
  border-radius:1.5em;
  padding: 2px;
  background-color: #80dfff;
  color: #000046;
  font-size: 20pt;
  font-family:parkinsans,Nunito,sans-serif;
  font-weight:bold;
}

#content>h1, #content>div.clearfix>h1 {
  /* bleed over 20px L/R padding of #content */
  width: calc(100% + 40px);
  position: relative;
  left: -20px;
  overflow: visible;
  /* align text with margins of #content */
  padding: 3px 20px 2px 20px;
}

h2 {
  margin-top: 36pt;
  margin-bottom: 4pt;
  padding: 2px 10px;
  max-width: calc(100% + 20px);
  min-width: calc(67% + 10px);
  width: 400px;
  position: relative;
  left: -10px;
  overflow: visible;
  color: #000045;
  background-color: #ededed;
  font-size: 18pt;
}
h2 .hot {
  top: -2px;
  right: -10px;
  border-radius: 0 0 0 0.3em;
}
h2.tight {
  margin-top:12pt;
}
h2.very-tight, .foldable>h2:first-of-type {
  margin-top:0;
}

h3 
{
  margin-top: 18pt;
  margin-bottom: 2pt;
  color: #00aeef;
  font-size: 16pt;
  background-color: inherit;
}
h3 .hot {
  display: inline;
  float:none;
  margin: 0;
}
h3.very-tight, .foldable>h3:first-of-type {
  margin-top:0;
}

h4
{
  margin-top: 0;
  margin-bottom: 0;
  color: #000045;
  font-size: 13pt;
  background-color: inherit;
}

h5
{
  margin-top: 0;
  margin-bottom: 0;
  color: #00aeef;
  font-size: 12pt;
  background-color: inherit;
}

h6
{
  margin-top: 0;
  margin-bottom: 0;
  color: #00aeef;
  font-size: 10pt;
  background-color: inherit;
}



p {
  font-size: 12pt;
  font-weight: normal;
  font-style: normal;
  color: #000046;
  line-height: normal;
  margin-bottom: 5px;
  margin-top: 0px;
  padding: 3px 5px 3px 0;
  /*width: 100%; max-width: 36em;*/
}

p.caption {
  font-size:11pt;
  color:#000090;
  text-align:right;
  margin:0;
  padding:3px 5px;
  font-style:italic;
}

dl {
  width: auto;
  overflow:hidden;
  text-align: left;
  margin: 0.75em 0;
}
.headlines-container dl {
  width: 90%;
  margin-left: 5%;
}
dt .hot {
  padding-bottom: 0;
  padding-left: 0.4em;
  border-radius: 0 0 0 0.6em;
  top: -0.2em;
  right: -0.5em;
}
dt {
  border: 0;
  color: white;
  background-color: #02678e;
  font-size: 120%;
  font-weight: bold;
  overflow: hidden;
  padding: 0;
  width:100%;
  position:relative;
  left:0;
  padding: 0.2em 0.5em;
}
dt a, dt a:link, dt a:visited, dt p {
  color: white;
  text-decoration: none;
  width: calc(100% + 1em);
  display: block;
  margin: -0.2em -0.5em -0.2em -0.5em;
  padding: 0.2em 0.5em;
}
dt a:hover {
  background-color: #00aeef;
  text-decoration: none;
}
dd {
  border: 2px solid rgb(229,247,253);
  background-color: rgb(229,247,253);
  border-top-width: 0;
  margin: 0 0 0.5em 0;
  padding: 0.4em 0.5em;
  width:100%;
  position: relative;
  overflow: visible;
  left:0;
}
dd::after { /*clearfix on all dd*/
  content:"";
  display:table;
  clear:both;
}
dt:hover + dd {
  border-color: #00aeef;
}
dd:last-of-type {
  margin-bottom: 0;
}

dl.wide-spacing>dt {
  margin-top:1.0em;
}
dl.wide-spacing>dd {
  margin-bottom:2.5em;
}

dl.flow>dt {
  font-weight:normal;
  font-size:120%;
  text-align:center;
  float:left;
  margin:0.5em 0 0 0;
  padding:0.2em 0.5em 0.4em 0.5em;
  border-radius:10px;
  width:40%;
  z-index:1;
}
dl.flow>dd {
  overflow:visible;
  border:2px solid #02678e;
  width:80%;
  padding-left:calc(20% + 1em);
  margin-left:20%;
}
dl.flow>dd::after {
  content:"";
  display:table;
  clear:both;
}
dl.flow>dt:hover + dd {
}

.hot {
  float: right;
  padding: 0 0.3em 0.1em 0.3em;
  color: white;
  background-color: red;
  border-radius: 0.3em;
  position: relative;
  overflow: visible;
  top: 0;
  right: 0;
  margin-left:0.4em;
  text-align:center;
  flex:0 1 auto; /* useful on labels */
}

li {
  margin-top: 0.2em;
}
li .hot {
  float:none;
  display:inline-block;
  margin-right:1em;
  margin-left: 0;
}

ul {
  margin:0 0 0.5em 0;
  box-sizing: border-box;
}
ul ul {
  margin: 0;
}
ul li
{
  color: #000046;
  margin-top:0.1em;
  margin-bottom:0.1em;
  padding-top: 0;
  padding-bottom: 2px;
}
ul ul li {
  padding-bottom:0;
  margin-bottom:0;
}
.justify {
  text-align: justify;
}
.centertext {
  text-align:center;
}
.line {
  color: #00aeef;
  width: 875px;
  height: 1px;
}

td,th {
  padding: 3px 6px;
}
th {
  background-color: #707070;
  color: white;
}
tbody>tr>th:first-child {
  text-align: right;
}
tbody>tr>th:last-child {
  text-align: left;
}
tr:nth-of-type(odd)>td:nth-of-type(even) {
  background-color: #e0e0e0;
}
tr:nth-of-type(odd)>td:nth-of-type(odd) {
  background-color: #e8e8e8;
}
tr:nth-of-type(even)>td:nth-of-type(even) {
  background-color: #f0f0f0;
}
tr:nth-of-type(even)>td:nth-of-type(odd) {
  background-color: #f8f8f8;
}
tr.highlighted {
  outline:2px solid #00aeef;
}
tr.highlighted>td:nth-of-type(even) {
  background-color: #e0ffff;
}
tr.highlighted>td:nth-of-type(odd) {
  background-color: #f0ffff;
}
tbody+tbody>tr:first-of-type>td, tbody+tbody>tr:first-of-type>th {
  border-top-width: 4px;
  border-top-style: solid;
  border-top-color: white;
}
table {
  margin: 6px 5px 10px 5px;
  border-spacing:2px;
  border-collapse:separate;
}
th.sorttable_sorted::after {
  content:"\00A0\0025BE";
  display:inline;
}
th.sorttable_sorted_reverse::after {
  content:"\00A0\0025B4";
  display:inline;
}
@media screen and (max-width: 600.5px) {
  table {
    margin: 6px 0 10px 0;
  }
}

div.scrollable-table-container {
  display:block;
  overflow-y:auto;
  scroll-behavior:smooth;
}
div.scrollable-table-container>table {
  margin: 0px auto 10px auto;
  position:relative;
  display:table;
  width:100%;
}
div.scrollable-table-container>table thead {
  position:sticky;
  top:2px;
}

.TOC ol {
  list-style-type: none;
  padding-left: 10px;
  margin-bottom:5px;
}
.TOC ol>li>a {
  padding-left:0.5em;
  padding-right:0.5em;
  display:inline-block;
}
.TOC>ol {
  margin-bottom:15px;
  margin-top:0;
}
.TOC>ol>li>a {
  font-size: 120%;
  background-image: linear-gradient(180deg, #ffffff, #ffffff30);
  border-radius:10px;
}

.TOC>ol>li li {
  font-size: initial;
}

/* Navigation Start */
/* Main menu settings */
.centeredmenu {
   overflow:visible; /* allow go-to-top to appear */
   margin: 4px 0;
   padding:0 0 2px 0;
   background-color: white;
   border-top:1px solid #02678e; /* line above menu */
   border-bottom:1px solid #02678e; /* line below menu */
   width:100%;
   font-size:90%; /* Menu text size */
   position: sticky;
   top:0;
   z-index:10;
}
.centeredmenu.empty {
  padding:0;
}
.centeredmenu:hover { z-index: 20;}

#go-to-top {
  position: absolute;
  top:100%;
  right: 0;
  display: block;
  margin: 0;
  border: 0.2em solid white;
  border-top-width: 0;
  border-radius: 0 0 0.7em 0.7em;
  padding: 0.4em;
  background-color: rgba(2, 103, 142, 0.7);
  color: white;
  font-weight: bold;
  font-size: 90%;
  width: fit-content;
  z-index:5; /* under the menus */
  opacity: 0;
}

.centeredmenu::after {
  content:"";
  display:table;
  clear:both;
}
/* Top menu items */
.centeredmenu ul {
   margin:0;
   padding:0;
   list-style:none;
   float:right;
   position:relative;
   right:50%;
}
.centeredmenu ul li {
   margin:3px 0 0 4px;
   padding:0;
   float:left;
   position:relative;
   left:50%;
   top:0px;
}
.centeredmenu ul li a {
   display:block;
   margin:0;
   padding:.6em .5em .4em;
   font-size:1em;
   line-height:1em;
   background:#02678e;
   text-decoration:none;
   color:#fff;
   font-weight:bold;
   border-bottom:1px solid white;
}

.centeredmenu ul li a:hover,
.centeredmenu ul li a:active,
.centeredmenu ul li:hover a,
.centeredmenu ul li:active a {
   background:#014c69; /* Top menu items background colour */
   color:#fff;
   border-bottom:1px solid white;
   z-index: 20; /* lift above page content */
}

/* Submenu items */
.centeredmenu ul ul {
   display:none; /* Sub menus are hidden by default */
   position:absolute;
   top:2em;
   left:0;
   right:auto; /*resets the right:50% on the parent ul */
   width:12.5em; /* width of the drop-down menus */
   z-index:20; /* This makes the dropdown menus appear above the page content below */
   border-width: 1px 2px 1px 2px;
   border-color: white;
   border-style: solid;
   background-color:#ffffff80;
   box-shadow: 8px 8px 18px 10px #40404080;
}
.centeredmenu ul ul li {
   left:auto;  /*resets the left:50% on the parent li */
   margin:3px 0 0 0;
   clear:left;
   width:100%;
}
.centeredmenu ul ul li a,
.centeredmenu ul li.active li a,
.centeredmenu ul li:hover ul li a,
.centeredmenu ul li:active ul li a {
   font-size:1em;
   font-weight:bold; /* resets the bold set for the top level menu items */
   background: rgba(2, 103, 142, 0.9); /*#02678e;*/
   color:#fff;
   line-height:1.4em; /* overwrite line-height value from top menu */
   border-bottom:1px solid rgba(255,255,255,0.9);
}
.centeredmenu ul ul li a:hover,
.centeredmenu ul ul li a:active,
.centeredmenu ul li:hover ul li a:hover,
.centeredmenu ul li:active ul li a:active {
   background:#014c69; /* Sub menu items background colour */
   color:#fff;
}

/* Flip the last submenu so it stays within the page */
.centeredmenu ul ul.last {
   left:auto; /* reset left:0; value */
   right:0; /* Set right value instead */
}

/* Make the sub menus appear on hover */
.centeredmenu ul li:hover ul,
.centeredmenu ul li:active ul {
   display:block; /* Show the sub menus */
}

/* Special appearance for various special links */
.centeredmenu ul li.private a {
  background-color: rgb(229,247,253);
  color: #02678e;
  font-weight: normal;
}
.centeredmenu ul li.pro a {
  background-color: rgb(255,100,100);
  color: white;
  font-weight: normal;
}

/* Divider for use between things that have no margin */
div.divider {
  position: relative;
  margin: 4px 0;
  padding: 6px;
  background-color: #e0e0e0;
}
div.bled {
  left: -20px;
  width: calc(100% + 40px);
}

a.headline-tile {
  flex: 0 0 370px;
  max-width:100%;
  min-height:unset;
  display: inline-block;
  background-image:linear-gradient(to bottom, #00adf0 25%, #ebebeb 75%);
  background-blend-mode:normal;
  margin:4px;
  padding:4px;
  border:0 solid;
  border-radius:16px;
  cursor:pointer;
  background-position:center;
  background-size:cover;
  text-align:center;
  vertical-align:top;
  transition:transform 0.5s,box-shadow 0.5s;
}
a.headline-tile:hover {
  box-shadow:0 0 20px 20px #000000b0;
  text-decoration:none;
  transform:scale(1.05,1.05);
  z-index:2;
}
a.headline-tile>header {
  color:white;
  text-shadow:0 0 4px black;
  font-size:24pt;
  font-weight:bold;
  margin:0;
  padding:3px 10px;
  border-radius:10px 10px 0 0;
  background-color:#00adf0;
}
a.headline-tile>p {
  font-size:14pt;
  color:#000046;
  padding:4px 10px;
  margin:0;
  line-height:1.1;
  text-shadow:none;
  background-color:#ebebeb;
}
a.headline-tile>img+p {
  padding-top:10px;
  font-weight:bold;
}
a.headline-tile>img {
  display:block;
  width:100%;
  margin:0 auto;
  padding:0;
  background-color:white;
}
a.headline-tile>img.border {
  width:calc(100% - 10px);
}
div.headline-tile-container {
  display:flex;
  flex-flow:row wrap;
  align-content:stretch;
  justify-content:center;
}

/* Headline with thumbnail */
.headline {
  font-size: 110%;
  background-color: rgb(229,247,253);
  display: inline-block;
  width: 18em;
  height: 3.3em;
  border:0.2em solid rgb(229,247,253);
  position: relative;
  margin: 0.1em;
  padding: 0;
  white-space: normal;
}
.headline:hover, a.headline:active {
  border:0.2em solid #02678e;
}
.headline > img {
  position: absolute;
  left:0; top:0;
  max-height: 100%;
  max-width: 3.0em;
  padding: 0;
  display: inline-block;
  vertical-align: middle;
}
.headline > p {
  font-size: inherit;
  text-align: left;
  vertical-align: middle;
  background-color: transparent;
  font-weight: bold;
  color: #202020;
  padding: 0.1em;
  border:0;
  margin:0;
  position: absolute;
  top:0; left:3.3em; right: 0; bottom: 0;
  display: block;
}
.headline .hot {
  top: -0.1em;
  right: -0.1em;
  padding: 0em 0.2em 0em 0.2em;
  border-radius: 0;
  font-size: 90%;
  margin-bottom: 0;
}
.headlines-container {
  width: calc(100% + 40px);
  position: relative;
  left: -20px;
  border: 2px solid #02678e;
  padding: 4px;
  text-align: center;
}
.headlines-container h1 {
  text-align: center;
  background-color: #02678e;
  border: 0;
  width: calc(100% + 8px);
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 8px;
  padding-right: 8px;
  margin: -4px;
  margin-bottom: 4px;
}
.headlines-container .gsearch {
  width: calc(100% - 40px);
}
.headlines-container .gsearch .gsc-control-cse {
  border-width: 0;
  padding: 0 1em;
}

.ticker-container {
  display: inline-block;
  white-space: nowrap;
  margin:0;
  padding:0;
  border: none;
  height: 3.87em;
  width: 100%;
  overflow: hidden;
  position: relative;
}
.ticker-container > *.ticker-item {
  transition: transform 1s, left 1s;
}

.ticker-nav-button {
  border:0;
  border-radius: 0.5em;
  background-color: rgba(0,0,0,0.4);
  color: white;
  position: absolute;
  top: 0.7em;
  line-height: 2.5em;
  width: 2em;
  text-align: center;
  visibility: hidden;
}



/* Containers for calendar events */
div.post-it {
  min-width: calc(50%  - 15px);
  max-width: calc(100% - 15px);
  width: 30em;
  min-height: 8em;
  padding: 0.5em 1em;
  margin: 0.5em 10px 1em 5px;
  background: -moz-linear-gradient(-45deg, #ffffb0 calc(100% - 70px), #ffffe0 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right bottom, color-stop(calc(100% - 70px),#ffffb0), color-stop(100%,#ffffe0)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-45deg, #ffffb0 calc(100% - 70px),#ffffe0 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(-45deg, #ffffb0 calc(100% - 70px),#ffffe0 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(-45deg, #ffffb0 calc(100% - 70px),#ffffe0 100%); /* IE10+ */
  background: linear-gradient(135deg, #ffffb0 calc(100% - 70px),#ffffe0 100%); /* W3C */
  border: 0px solid #f3f390;
  border-bottom-right-radius: 80px 18px;
  position: relative;
  z-index: auto;
}
div.post-it:before {
  content: "";
  position:absolute;
  top:20px;
  left:20px;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  box-shadow: 1px 2px 10px 18px #909090;
  z-index:-1;
}
div.post-it.agenda {
  min-height: 12em;
}
div.post-it>h3:first-of-type {
  margin-top:0.3em;
}
div.agenda > .event-timings {
}
div.agenda > .event-summary-location {
}
div.agenda  .event-summary {
  font-weight: bold;
  color: #00aeef;
}
div.agenda > .event-location {
}
div.agenda > .event-description {
}
div.post-it.meetings {
}
div.meetings > .event-timings {
}
div.meetings > .event-summary-location {
  display: none;
}
div.meetings > .event-summary {
  font-weight: bold;
  color: #00aeef;
}
div.meetings > .event-location {
}
div.meetings > .event-description {
}

/*---------------- Folding text stuff --------------*/
.foldable {
  position:relative;
  margin-top:6pt;
  left:-10px;
  padding-left:10px;
}
.foldable .fold-button {
  display: block;
  float:right;
  background-color: #00ADEF;
  color:white;
  padding:1pt;
  padding-left:3pt;
  margin:0;
  margin-top:0.2em;
  margin-left: 1em;
  font-weight: bold;
  font-family: inherit;
  font-size: 90%;
  border:none;
  line-height:1.1em;
  position:relative;
  z-index:2;
  overflow:hidden;
  top:-3px;
  right: 0;
}
.foldable .fold-button:hover {
  cursor:pointer;
}
.foldable.fold-state-open .fold-button::after {
 content: "hide \0025B2";
}
.foldable.fold-state-closed .fold-button::after {
 content: "read more \0025BC";
}
.foldable.fold-state-closed {
  height: 45pt;
  overflow: hidden;
}
.foldable.fold-state-closed .truncate-on-closed {
  overflow-y: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.foldable.fold-state-open {
}
.foldable > .fold-shade {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-image:linear-gradient(to bottom, transparent, transparent 60%, white);
}
.foldable.fold-state-open > .fold-shade {
  display:none;
}
.foldable.fold-state-closed aside {
  display:none;
}

/* ------------- Quote boxes -------------- */
blockquote {
  margin:1vw 0;
  padding:0.8em 1em 0.4em 1em;
  background-color: rgb(229,247,253);
  border-radius: 12px;
  border: 2px solid #02678e;
  background-image:    url("/images/lquo.jpg"), url("/images/rquo.jpg");
  background-position: left top, right bottom;
  background-size:   1.5em;
  background-repeat: no-repeat;
}
blockquote+blockquote {
  margin-top:calc(1vw + 1.5em);
}
blockquote::before {
  display: inline;
  height: 1.5em;
  width: 1em;
  float: left;
  content: "";
}
blockquote::after {
  position:relative;
  bottom:1vw;
  display: table;
  clear: both;
  height: 2.5em;
  width: 1em;
  float: right;
  content: "";
}
blockquote.no-decoration {
  background-image:none;
}
blockquote.no-decoration::before {
  content:none;
}
blockquote.no-decoration::after {
  width:0;
}
blockquote.no-clear::after {
  clear:none;
}
blockquote h2 {
  background-color: white;
}
blockquote aside {
  width: 30%;
  margin-right: 1em;
  margin-left: 1em;
}
blockquote.foldable .fold-button {
  right: 1em;
}
blockquote > table {
  margin: 10px 0;
}

h1 > form {
  height: 1.2em;
  display: block;
  float: right;
}
h1 > form > input {
  height: 100%;
  font-size: 70%;
  
}

/* Content gallery */
.item-set-container {
  position:relative;
  text-align:center;
  background-color:rgb(0,174,239);
  margin-top:20px;
  margin-bottom:40px;
  box-shadow:0 0 10px 10px rgb(0,174,239);
  border-radius:10px;
  display:flex;
  flex-flow:wrap row;
}
.item-set-container-banner {
  border-radius:10px;
}
.item-set-caption {
  margin:0;
  width:80%;
  position:absolute;
  top:10px;
  left:10%;
  font-weight:bold;
  font-size:1.5em;
  color:white;
  text-align:center;
  background-color:rgba(0,0,70,0.8);
  border:2px solid transparent;
  border-radius:10px;
  opacity:1;
  display:block;
  z-index:1000;
  transition: left 0.5s, top 0.5s, opacity 1s;
}
svg.item-set-svg {
  position:absolute;
  top:0;
  left:0;
  pointer-events:none;
  width:100%;
  height:100%;
  z-index:200;
}
.item-set-connector-line {
  stroke:transparent;
  stroke-width:4;
  stroke-linecap:round;
  vector-effect=non-scaling-stroke;
  transition:stroke 2s;
}
.item-thumb-wrapper {
  flex:0 0 0; /*will be overridden*/
  position:relative;
  margin:3px;
}
.item-caption-wrapper {
  container-type:inline-size;
  flex:1 0 0;
  position:relative;
  margin:3px;
  text-align:right;
}
.item-caption-wrapper .hot {
  float:left;
  margin-left:0;
  margin-right:0.5em;
}
.item-thumb-image {
  border-radius:8px;
  border:3px solid transparent;
  transition:border-color 1s;
  width:100%;
  height:auto;
  margin:auto 0;
  display:inline-block;
  vertical-align:middle;
}
.item-thumb-image[src=""] {
  visibility:hidden;
}
.item-element {
  flex:1 0 230px;
  position:relative;
  background-color:#ebebeb;
  box-shadow:0 0 3px 3px #ebebeb;
  border-radius:10px;
  margin:6px;
  display:flex;
  cursor:pointer;
  transition:transform 0.5s,box-shadow 0.5s;
}
.item-element-placeholder {
  flex:1 0 230px;
  margin:0 6px;
}
.item-element * {
  cursor:pointer;
}
.item-element:hover {
  box-shadow:0 0 20px 20px #000000b0;
  text-decoration:none;
  transform:scale(1.05,1.05);
  z-index:2;
}
.item-caption {
  display:inline-block;
  vertical-align:middle;
  text-align:left;
  padding-right:0.5em;
  padding-left:0.5em;
}
@container (min-width:30em) {
  .item-caption {
    text-align:justify;
  }
}
p.content-caption-element {
  width:100%;
  margin:0;
  margin-top:1em;
  color:white;
  font-size:16pt;
  font-weight:bold;
  text-align:center;
}
p.content-caption-element:first-child {
  margin-top:0;
}
.item-set-content-container.visible {
  display:flex;
}
.item-set-content-container {
  flex-flow:column;
  border-radius:8px;
  box-shadow:0 0 20px 20px rgba(100,100,100,0.95);
  position:fixed;
  left:5vmin;
  top:5vmin;
  width:calc(100vw - 10vmin);
  height:calc(100vh - 10vmin);
  display:none;
  z-index:10;
  background-color:rgba(100,100,100,0.95);
}
.item-set-content-caption {
  border:3px solid rgb(0,0,70);
  border-radius:8px 8px 0 0;
  margin:0;
  width:100%;
  background-color:rgb(229, 247, 253);
}
.item-set-content-caption p {
  width: fit-content;
  display:inline-block;
  color:rgb(0,0,70);
  margin:0;
  text-align:left;
  font-weight:bold;
  padding:3px 0.5em 3px 0.5em;
}
.item-set-content-frame {
  flex:1 1 auto;
  width:100%;
  border:3px solid rgb(0,0,70);
  border-top:none;
  border-radius:0 0 8px 8px;
  overflow:auto;
}
.item-set-content-controls {
  float:right;
  top:0;
  display:block;
  margin-left:1em;
}
.item-set-content-controls button {
  margin: 3px;
  border-radius: 8em;
  border: 0px solid transparent;
  padding: 0.2em 0.5em;
  background-color:#d8d8d8;
  font-family: inherit;
  font-weight:bold;
  font-size:90%;
}
.item-set-content-controls button:hover {
  transform:scale(1.05);
}
.item-set-content-controls button.close {
  background-color:red;
  color:white;
}
.item-set-content-controls button.disabled {
  opacity:0.3;
}

/* Poetry */
div.poem {
  font-family: charter, georgia, serif;
  -webkit-column-width: 25em;
  -moz-column-width: 25em;
  column-width: 25em;
  -webkit-column-gap: 2;
  -moz-column-gap: 0;
  column-gap: 0;
  -webkit-column-rule: 1px solid #ddd;
  -moz-column-rule: 1px solid #ddd;
  column-rule: 1px solid #ddd;
  border-width: 3px 0;
  border-style: solid;
  border-color: #ddd;
  background-color:#f0ffff;
}
div.poem > div.stanza {
  font-family: inherit;
  max-width: 25.5em; /* mysteriously needs to be 0.5em bigger than column width */
  width: 100%;
  padding: 1em;
  display: inline-block;
}
div.poem p {
  font-family: inherit;
  padding: 0.5em;
}
div.poem > div.stanza > p {
  padding: 0 2em 0 2.5em;
  text-indent: -2em;
}
div.poem > div.stanza > p > span.keyletter {
  font-weight: bold;
  background-color: yellow;
}

@media screen and (max-width: 600.5px) {
  .not-for-small-screen { display: none; }
}
@media screen and (min-width: 600.5px) {
  .not-for-large-screen { display: none; }
}
@media screen and ((max-device-width:700px) or (max-device-height:700px)) {
  .desktop-only { display: none; }
}

/*forms*/
/*whoa, fieldsets are freaky*/
fieldset aside.inline {
  width:unset;
}
form button, button.large {
  margin:10px;
  padding:0.5em 1em;
  border:none;
  border-radius:2em;
  font-size:13pt;
  font-family:Poppins,Nunito;
  font-weight:bold;
  background-color:#ebebeb;
  color:#000045;
  cursor:pointer;
}
button:hover {
  transform:scale(1.05);   
}
button[disabled]:hover {
  transform:scale(1);   
}
form button:hover, button.large:hover {
  background-color:#e0f0ff;
}
form button[disabled], button[disabled].large {
  color:#b8b8b8;
  cursor:initial;
}
form button[disabled]:hover, button[disabled].large:hover {
  background-color:#ebebeb;
}
div.button-set {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
}
div.button-set>button {
  flex: 1 0 auto;
  max-width:calc(100% - 20px);
}
label.button-holder {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
}
label.button-holder button {
  background-color:white;
  border:1px solid #303030;
}
div.wide-radio-label, label {
  display:flex;
  flex-flow:nowrap row;
  align-items:center;
  justify-content:space-between;
  background-color:#ebebeb;
  padding:4px;
  margin:4px 0;
  text-align:left;
}
label.wrap {
  flex-wrap:wrap;
}
div.wide-radio-label {
  padding:0
}
label input {
  flex:1 0 auto;
  max-width:-webkit-fill-available;
}
label select, label input[type="checkbox"], label input[type="radio"] {
  flex:0 0 auto;
}
label>*, div.wide-radio-label>label {
  flex:1 1 auto;
  margin:0 0.5em;
}
div.wide-radio-label>label {
  margin:0;
}
div.wide-radio-label>input[type="radio"]~label::before {
  background-color:#ebebeb;
  border-radius:1.6em;
  border:1px solid black;
  content:"";
  width:1.6em;
  height:1.6em;
  margin:auto 0.5em auto 0;
  vertical-align:middle;
  flex:0 0 1.6em;
}
div.wide-radio-label>input[type="radio"]:checked~label::before {
  content:"\002714";
  color:black;
  font-weight:bold;
  text-align:center;
}
div.wide-radio-label>input[type="radio"]:checked~label {
  background-color:#008000;
  color:white;
}
div.wide-radio-label>input[type="radio"] {
  width:0;
  margin:auto 0;
  opacity:0;
}
label textarea {
  font-family:Poppins, Nunito, Arial, Helvetica, sans-serif;
  font-size:11pt;
  border:2px solid black;
  border-radius:5px;
}
label span.right-align-small {
  display: inline-block;
  margin-left: auto;
  text-align: right;
  width: 100%;
  font-size:80%;
}
.fullwidth {
  display:block;
  width:100%;
}
label.fullwidth>input {
  width:100%;
  margin:0;
  display:block;
}
label.fullwidth textarea {
  margin:0 !important;
  min-height:4em;
  width:100% !important;
}
label input, label select {
  font-family:Poppins, Nunito, Arial, Helvetica, sans-serif;
  padding:5px;
}
fieldset {
  margin: 1em 0;
  min-inline-size:0;
  border-radius:0.4rem;
}
fieldset>legend {
  font-weight:bold;
  font-size:120%;
  color:rgb(0,174,239);
}

.merge-labels label {
  margin:0;
}
.merge-labels.stripe label:nth-of-type(even) {
  background-color:#c0c0c0;
}
select {
  font-family:Poppins, Nunito, sans-serif;
}
input, select, textarea {
  background-color:#ffffff;
}
input, select {
  font-size:100%;
  border-radius:10px;
  padding: 0.1em 0.5em;
}
input:invalid, select:invalid, textarea:invalid {
  background-color:#ffff80;
}

@keyframes fader {
  from {opacity:0}
  to {opacity:1}
}
div.chunked-progress {
  position:relative;
  transition:opacity 1s;
}
div.chunked-progress>progress {
  display:block;
  width:100%;
}
div.chunked-progress>progress:last-of-type {
  position:absolute;
  top:0;
  animation:fader 1s infinite alternate linear;
}
div.file-list-container>p {
  padding:0.1em 10px;
  font-size:10pt;
  margin-bottom:2px;
  border:1px solid #000045;
}
div.file-list-container>p input[type=checkbox] {
  float:right;
}
div.file-list-container>p.completed {
  opacity:0.6;
}
div.file-list-container>p.disabled input {
  visibility:hidden;
}

.video-container {
  margin-bottom:2em;
  margin-top:5px;
  width:100%;
  max-width:800px;
  position:relative;
  overflow:clip;
  box-shadow:0 0 10px 0 #606060;
}
.video-container video {
  width:100%;
  display:block;
}
.video-container .thumbnail {
  position:absolute;
  opacity:0;
  transition: opacity 2s;
}
.video-container .thumbnail.visible {
  opacity:1;
  transition: opacity 0.2s;
}

.slideshow-container {
  position:relative;
  overflow:hidden;
}
.slideshow-container .slide img {
  margin:0.3em;
  max-width:calc(100% - 0.6em);
  max-height:calc(100% - 0.6em);
  display:block;
}
.slideshow-container.fade .slide {
  transition:opacity 2s;
}
.slideshow-container.shift .slide {
  transition:right 2s;
}
.slideshow-container * {
  position:absolute;
}
.slideshow-container .slide {
  height:100%;
  width:100%;
  opacity:0;
  visibility:hidden;
  z-index:0;
}
.slideshow-container p {
  text-align:left;
  z-index:5;
  padding:0 0.5em 0.4em 0.5em;
  margin:0;
}
.slideshow-container.fade .slide.prev {
  z-index:1;
  visibility:visible;
}
.slideshow-container.fade .slide.curr {
  z-index:2;
  opacity:1;
  visibility:visible;
}
.slideshow-container.fade .slide.next {
  z-index:1;
  visibility:visible;
}
.slideshow-container.shift .slide.prev {
  z-index:1;
  visibility:visible;
  opacity:1;
  right:100%;
}
.slideshow-container.shift .slide.curr {
  z-index:2;
  opacity:1;
  visibility:visible;
  right:0;
}
.slideshow-container.shift .slide.next {
  z-index:1;
  visibility:visible;
  opacity:1;
  right:-100%;
}

.slideshow-container.artwork {
  background-color:#8A8E5C;
  
}
.slideshow-container.artwork * {
  font-family:Charter, times, serif;
  font-size:clamp(18pt,5vw,28pt);
  color:white;
  background-color:#8A8E5CA0;
}
.slideshow-container.artwork p {
  border-radius:0.2em;
}
.slideshow-container.artwork p.caption {
  width:100%;
  text-align:right;
  right:0;
  bottom:0;
  background-image: linear-gradient(0,#8A8E5CB0,#8A8E5CB0 80%,#8A8E5C00);
  background-color: transparent;
  padding-top: 10px;
  border-radius:0;
}
.slideshow-container.artwork .slide img {
top:0;
right:0;
}
.item-set-container.artwork {
  border:10px solid #8A8E5C;
  background-color: #8A8E5C;
  border-radius:0;
  box-shadow:unset;
}

.drop-target {
  padding:0;
  border-radius:20px;
  border: 5px dashed transparent;
}
.drop-target>fieldset {
  margin-top:5px;
  margin-bottom:5px;
}
.drop-target.dragmiss {
  border-color: #e0e0e0;
}
.drop-target.dragover {
  border-color: black;
}
.loading-in-progress {
  background-color:#404040 !important;
  text-align:center !important;
}
.loading-in-progress::before {
  content: "loading... ";
  color: white;
}

span.check, span.cross, span.query {
  font-weight:bold;
  padding-left:0.2em;
  padding-right:0.2em;
}
span.check {
  background-color:#60ff60;
}
span.check::before {
  content: "\2713";
}
span.cross {
  background-color:#ff8080;
}
span.cross::before {
  content: "\2717";
}
span.query {
  background-color:#ffff00;
}
span.query::before {
  content: "?";
}

/*
}
*/