@import url('https://fonts.googleapis.com/css?family=Playfair+Display&display=swap');
@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');

@font-face {font-family: 'Apple Chancery';
    font-style: normal;  font-weight: normal;
    src: local('Apple Chancery'), url('Apple Chancery.woff') format('woff');}

@media screen and (min-width: 600px)  {
        .mobile-break { display: none; }
}
html body {
	margin: auto; padding: 0;
    background: #f2f4f8 url(images/bgn2.jpg) top repeat;
    color: #003366;
}
#padding0 {
	position: absolute;
	width: 99%; text-align: right;
	padding: 0 12px 2px 0;
}
#topspot {
    position: relative; top: 45px;
    width: 100%; z-index: 3;
    background: #f2f4f8; color: #003366;
    border-top: 2px solid #003366;
    border-bottom: 2px solid #003366;
}
p, ol, ul, li {
	font-family: Raleway, sans-serif;
	line-height: 22px;
	list-style: none;
	text-shadow: 0 1px 2px rgba(0,0,0,0.3), 0px -2px 2px rgba(255,255,255,0.7);
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Playfair Display', serif;
	padding-left: 1.5%; line-height: 120%;
	text-shadow: 0 5px 10px rgba(0,00,0,0.3), 0px -5px 10px rgba(255,255,255,0.7);
}
a:link {
	color: #993300;
}
a:visited {
	color: #614105;
}
a.dark:link {
	color: #003366;
}
a.dark:visited {
	color: #003366;
}
a.red:link {
	color: #bb3140;
}
a.red:visited {
	color: #bb3140;
}
a.other:link {
	color: #614105;
}
a.other:visited {
	color: #614105;
}
a.yell:link {
	color: #f2f4f8;
}
a.yell:visited {
	color: #f2f4f8;
}

#menuToggle {
	display: block;
	position: relative;
	top: 9px; left: 40px;
	z-index: 9;
	-webkit-user-select: none;
  	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
#menuToggle a.hamb {
	text-decoration: none;
	color: #003366;
	transition: color 0.3s ease;
}
#menuToggle a.hamb:hover {
	color: #006699;
	transition: color 0.3s ease;
}
#menuToggle input {
	display: block;
	width: 32px; height: 32px;
	position: absolute;
	top: -1px; left: -5px;
	cursor: pointer;
	opacity: 0;
	z-index: 10;
	-webkit-touch-callout: none;
  	-moz-touch-callout: none;
	-ms-touch-callout: none;
	-o-touch-callout: none;
}
#menuToggle span {
	display: block;
	width: 32px; height: 2px; margin-bottom: 5px;
	position: relative;
	background: #003366;
	border-radius: 3px;
	z-index: 9;
	transform-origin: 4px 0px;
	transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}
#menuToggle span:first-child {
  transform-origin: 0% 0%;
}
#menuToggle span:nth-last-child(2) {
  transform-origin: 0% 100%;
}
#menuToggle input:checked ~ span {
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: #003366;
}
#menuToggle input:checked ~ span:nth-last-child(3) {
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}
#menuToggle input:checked ~ span:nth-last-child(2) {
  transform: rotate(-45deg) translate(0, -1px);
}
#menu {
	position: absolute;
	width: 200px;
	margin: -30px 0 0 -50px;
	padding: 50px; padding-top: 75px;
	background: #b5cefb;
	list-style-type: none;
	-webkit-font-smoothing: antialiased;
  	-moz-font-smoothing: antialiased;
	-ms-font-smoothing: antialiased;
	-o-font-smoothing: antialiased;
	transform-origin: 0% 0%;
	transform: translate(-100%, 0);
	transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}
#menu li {
	font-family: "Playfair Display", serif;
	text-shadow: 0 5px 10px rgba(0,00,0,0.3), 0px -5px 10px rgba(255,255,255,0.7);
	padding: 8px 0; font-size: 22px;
}
#menuToggle input:checked ~ ul {
	transform: none;
}

#scroller {
	position: relative; left: 6px; top: 30px;
    width: 99%; overflow-y: scroll;
}

@keyframes slidy {
	0% { left: 0%; }
	15% { left: 0%; }
	20% { left: -100%; }
	35% { left: -100%; }
	40% { left: -200%; }
	55% { left: -200%; }
	60% { left: -300%; }
	75% { left: -300%; }
	80% { left: -400%; }
	95% { left: -400%; }
	100% { left: -500%; }
}
div#captioned-gallery {
	width: 100%;
    padding 0;
	overflow: hidden;
}
figure {
	margin: 0; padding: 0;
}
figure.slider {
	position: relative;
	width: 600%;
	font-size: 0;
	text-align: left;
	animation: 35s slidy infinite;
}
figure.slider figure {
	width: 16.66%;
	height: auto;
	display: inline-block;
	position: inherit;
}
figure.slider img {
	width: 100%;
	height: auto;
}
figure.slider figure figcaption {
	position: absolute;	width: 60%;
	font-family; "Apple Chancery", cursive;
	bottom: 8px; left: 16px;
	color: #f2f4f8; font-size: 2rem;
	padding: .6rem;
}
@media screen and (max-width: 500px) {
	figure.slider figure figcaption {
		font-size: 1.2rem;
	}
}
.wrapper {
	display: block; text-align: center;
	width: 100%; background: none;
}
.Col {
	width: 100%; min-width: 600px;
	float: left;
	padding-right: 2px; padding-left 2px;
	padding-bottom: 20%; margin-bottom: -20%;
}
.Col1 {
	width: 67%; min-width: 350px;
	float: left; text-align: left;
	padding-right: 2px; padding-left 2px;
	padding-bottom: 20%; margin-bottom: -20%;
}
.Col2 {
	width: 30%; min-width: 350px;
	float: left; text-align: center;
	padding-right: 2px; padding-left 2px;
	margin-left: 20px;
	padding-bottom: 120%; margin-bottom: -120%;
}
#footer {
	position: absolute; bottom: -40px;
	border-top: 2px solid #003366;
	padding: 0 0 2px 0;
	background: #f2f4f8; color: #003366;
}

img.left {
	float: left;
	margin-right: 6px;
}
img.rite {
	float: right;
	margin-left: 6px;
}
.imgclr {
	clear: both;
	height: 0;
	margin: 0;
	line-height: 0;
}
hr.hblue {
	border: 1px solid #003366;
	width: 100%;
}
.dkblu {
	color: #006699;
}
.green {
	color: #006600;
}
.sien {
	color: #614105;
}
.red {
	color: #bb3140;
}
.yell {
	color: #614105;
}
.black {
	color: #000;
}
.white {
	color: #f2f4f8;
}
.lite {
	font-weight: light;
}
.b {
	font-weight: bold;
}
.u {
	text-decoration: underline;
}
.none {
	text-decoration: none;
}
.emboli {
	font-family: "Apple Chancery", Yellowtail, cursive;
	background-color: rgba(0,0,0,0.3);
}
.emin {
	word-spacing: -.3em;
	font-style: italic;
}
.nmin {
	word-spacing: -.2em;
}
.em {
	font-style: italic;
}
.hide {
	display: none;
}
.close {
	margin: 0;
	line-height: normal;
}
.close2 {
	margin-top: 5px; margin-bottom: 0px;
	line-height: normal;
}
.hg {
	font-size: 170%;
}
.big {
	font-size: 150%;
}
.lg {
	font-size: 120%;
}
.sm {
	font-size: 80%;
}
.sml {
	font-size: 80%;
	font-weight: lighter;
}
.smb {
	font-size: 80%;
	font-weight: bold;
	line-height: 140%;
}
.tin {
	font-size: 70%;
}
.blck {
	margin-right: 36px;
}
.blck1 {
	margin-right: 18px;
  margin-left: 18px;
}
.blck2 {
	margin-left: 36px;
}
.blck3 {
	width: 50%;
	margin: auto;
}
.blck4 {
	margin-right: 72px;
	margin-left: 72px;
}
.just {
	text-align: justify;
}
.wind {
	line-height: 25px;
}
.numb {
	line-height: 170%;
}
.cent {
	text-align: center;
}
.left {
	text-align: left;
}
.rite {
	text-align: right;
}
.back {
	background: #003366;
	padding: 6px;
}
.whtbck {
	background: #f2f4f8;
	padding: 12px;
}
/* (A1) CONTAINER - BIG SCREEN */
.thegrid {
  display: inline-grid;
  grid-template-columns: 20% 30% 20% 30%;
  /* OR SPECIFY WIDTH
  grid-template-columns: 40% 20% 20% 20%;
  */
  grid-gap: 3px;
}
/* (A2) CONTAINER - SMOL SCREEN */
@media screen and (max-width:768px) {
  .thegrid { grid-template-columns: auto auto; }
}
/* (B) CELLS */
.thegrid .head, .thegrid .cell {
  padding: 10px;
}
/* (C) HEADER CELLS */
.thegrid .head {
  font-weight: bold;
  color: white;
  background: #003366;
}
/* (D) DATA CELLS */
.thegrid .cell {
  background: #b5cefb;
  color: #003366;
}