@charset "UTF-8";
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* See "Chapter Website SetUp.txt"                                         */
/*     "Sample Color Schemes.txt"                                          */
/*     "Menu Setup.txt"                                                    */
/*     "http://www.w3schools.com/html/html_colorvalues.asp"                */
/*      Dallas - darkred                                                   */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
@import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700italic,700);
:root {
	--myFontColor:navy;
	--mySkinColor:darkred;
	--myImgBrdrColor:darkblue;
	--myH2Color:navy;
	/* myFontColor should be any dark color and may differ from the dark mySkinColor */
	/* myFontColor:darkblue; navy; black; */
	/* mySkinColor:darkred; darkslateblue; darkblue; forestgreen; #CC7700; */
	/* myImgBrdrColor:darkblue; navy; black; */
	/* As of Nov. 2017, the use of var(--myXXX) IS NOT supported by old Internet Explorer; YES Edge, Chrome, Firefox, Safari, Android Browsers */
	/* and that is why each use of var(--myXXX) is preceeded with a workable attribute.*/
}
body {
	background-color:lightgray;		/* for old browsers that don't support the --var usage */
	border:0px;
	color:navy;
	color:var(--myFontColor);
	font-family:Verdana, Geneva, Tahoma, sans-serif, serif;
	font-size:0px;				/* 0=removes top border */
	margin:0px auto;
	max-width:1366px;
	min-width:340px;			/* min smartPhone screen width */
	padding:0px;
	text-align:center;
}
/* Banner Container Styles - - - - - - - - - - - - - - - - - - - - - - - */
.bannerContainerRow1 {
	padding:2px;
	width:100%;
}
#bannerContainer {
	color:white;
	margin:0px auto;
	min-width:320px;
	text-align:center;
	width:100%;
}
#bannerAndMenu {
	background-color:darkred;
	background-color:var(--mySkinColor);
	background-image:url('../graphics/bkgrnd_deep_red_marbled.jpg');
	border-top:medium black solid;
	border-right:medium black solid;
	border-left:medium black solid;
	border-bottom:0px;
	font-size:16px;
	margin:0px;
	padding:.2%;
}
/* Content Styles - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.mainContentCenter,
.mainContentLeft,
.mainContentPicsPage,
.mainContentMinNews {
	background-color:snow;	/* white, ivory, oldlace, antiquewhite, lemonchiffon, seashell, snow, whitesmoke, ghostwhite */
	border:medium black solid;
	clear:both;
	font-size:16px;
	margin:0px;
	max-width:100%;
	padding-left:3%;
	padding-right:3%;
}
.mainContentCenter,
.mainContentPicsPage {
	text-align:center;
}
.mainContentMinNews,
.mainContentLeft {
	text-align:left;
}
.mainContentMinNews:before,
.mainContentMinNews:after,
.mainContentCenter:before,
.mainContentCenter:after,
.mainContentLeft:before,
.mainContentLeft:after {
	clear:both;
	content:" ";
	display:block;
}
p {
	margin:1%;
	vertical-align:top;
}
.mainContentLeft p,
p.paraLeft {
	text-align:left;
}
p.paraCenter {
	text-align:center;
}
p.adobe {
	clear:both;
	font-size:14px;
	font-style:italic;
	text-align:center;
}
p.firstLtr::first-letter {
	color:maroon;
	float:left;
	font-size:234%;
	font-weight:bold;
    margin-right:.1em;
    margin-top:-.2em;
	text-shadow: 2px 1px 2px darkgrey;
}
p.firstLtr::first-letter::after {
	clear:left;
}
.divCenter {
	margin:1% auto;
	padding:6px;
	text-align:center;
}
.divLine {
	padding:.5% 1%;
	text-align:center;
}
.divLine img {
	border-radius:6px;
}
/*  These .divFloatRightXXXXX styles are all the same, except:
	. divFloatRight - does NOT center on narrow screen
	. Kick1 and Kick2 - auto centers on narrow screens, see bottom at Narrow Device Styles
	. Suggest using divFloatRight when left is NOT an Ordered or Unordered list
	. Suggest using Kick1 or Kick2 when left is an Ordered or Unordered list
	. Suggest using Kick1 when right is < approx. width:192px
	. Suggest using Kick2 when right is >= approx. width:192px
	. Be sure to TEST and reTEST across several devices wide and narrow.
*/
.divFloatRightMinNews,
.divFloatLeft,
.divFloatLeftKick1,
.divFloatLeftKick2,
.divFloatRight,
.divFloatRightKick1,
.divFloatRightKick2 {
	clear:both;
	margin:.6% 3%;
	text-align:center;
}
.divFloatLeft,
.divFloatLeftKick1,
.divFloatLeftKick2 {
	float:left;
}
.divFloatRight,
.divFloatRightKick1,
.divFloatRightKick2,
.divFloatRightMinNews {
	float:right;
}
.divMyCurrDate {
	font-weight:bold;
	margin:auto;
	padding-top:4px;
	text-align:center;
	width:38px;
}
.divMyCurrDate p:first-child {
	background-color:darkred;
	border:2px navy solid;
	border-top-left-radius:6px;
	border-top-right-radius:6px;
	color:white;
	font-size:12px;
	margin:0px;
	padding:0px;
	text-shadow: 2px 1px 2px darkgrey;
}
.divMyCurrDate p:last-child {
	background-color:white;
	border:2px navy solid;
	border-top:0px;
	color:navy;
	font-size:12px;
	margin:0px;
	padding:0px;
}
.divSubMenu p {
	text-align:left;
	margin-left:12%;
}
.mainContentMinNews ol.pdf,
.mainContentMinNews ul.pdf {
	padding-left:12%;
}
ol,
ul {
	margin:.6% 3%;
	padding:0px 6px;
	text-align:left;
}
ol li,
ul li {
	margin:2% 1%;
}
ol li ol,
ul li ol,
ol li ul,
ul li ul {
	margin:.6%;
}
ol li ol li,
ul li ul li {
	margin:.6% 1%;
}
ul.htm,
ul li.htm {
	list-style-image:url('../graphics/icon16-htm.png');
	padding:0px 6px;
}
ul.doc,
ul li.doc {
	list-style-image:url('../graphics/icon16-doc.png');
	padding:0px 6px;
}
ul.pdf,
ul li.pdf {
	list-style-image:url('../graphics/icon16-pdf.png');
	padding:0px 6px;
}
ul.txt,
ul li.txt {
	list-style-image:url('../graphics/icon16-txt.png');
	padding:0px 6px;
}
ul.award,
ul li.award {
	list-style-image:url('../graphics/icon16-award.png');
	padding:0px 6px;
}
/*  By default:
	1. Normal section images are NOT set to have a border,
	2. Picture section images are set to have a border; add class="brd1" to force a thin border.
*/
img,
img.brd0,
img.brd1 {
	margin:0px;
	max-width:100%;
	padding:0px;
}
img,
img.brd0 {
	border:0px;
}
img.brd1 {
	border:thin navy solid;
	border:thin var(--myImgBrdrColor) solid;
}
hr {
	background-color:darkblue;
	background-color:var(--myImgBrdrColor);
	border:0px;
	border-top:medium navy solid;
	border-top:medium var(--myImgBrdrColor) solid;
	clear:both;
	padding:0px;
}
hr.hrLight,
hr.hrLightClear {
	background-color:gray;
	border:thin white dashed;
	border-style:none none dashed;
}
hr.hrLight {
	clear:none;
}
hr.hrLightClear {
	clear:both;
}
hr.hrRedWhtBlu {
	background:blue;
	background-image:linear-gradient (to bottom, red 33%, white 33%, white 67%, blue 67%, blue 100%);
	border:thin navy solid;
	border-radius:14px;
	clear:both;
	height:20px;
	width:96%;
}
h1,
h2,
h3,
h4,
h5 {
	font-style:italic; 
	font-weight:bold;
	margin:1% .6% .6% .6%;
	text-shadow: 2px 1px 2px darkgrey;
}
h1 span,
h2 span,
h3 span,
h4 span,
h5 span {
	white-space:nowrap;
}
h1 {
	color:navy;
	color:var(--myFontColor);
	text-align:center;
	font-size:24px;
}
h2 {
	color:navy;
	color:var(--myH2Color);
	text-align:center;
	font-size:22px;
}
h3 {
	color:maroon;
	color:var(--mySkinColor);
	text-align:left;
	font-size:18px;
}
h4,
h5 {
	color:navy;
	color:var(--myFontColor);
	text-align:center;
	font-size:16px;
}
h4.h4left,
h5.h5left {
	text-align:left;
}
/* Table Styles- - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.table346Left,
.table346LeftBrd1,
.table346Center,
.table346CenterBrd1 {
	border-collapse:collapse;
	margin:auto;
	min-width:346px;
}
.table346Left,
.table346Center {
	background-color:transparent;
}
.table346LeftBrd1,
.table346CenterBrd1 {
	background-color:whitesmoke;
}
.table346LeftBrd1 th,
.table346LeftBrd1 td,
.table346CenterBrd1 th,
.table346CenterBrd1 td {
	border:thin darkblue solid;
	border:thin var(--myImgBrdrColor) solid;
}
.table346Left th,
.table346Left td,
.table346LeftBrd1 th,
.table346LeftBrd1 td,
.table346Center th,
.table346Center td,
.table346CenterBrd1 td {
	margin:auto;
	padding:2px 6px;
}
.table346Left th,
.table346LeftBrd1 th,
.table346Center th,
.table346CenterBrd1 th {
	font-weight:bold;
}
.table346Left th,
.table346Left td,
.table346LeftBrd1 th,
.table346LeftBrd1 td {
	text-align:left;
}
.table346Center th,
.table346Center td,
.table346CenterBrd1 th,
.table346CenterBrd1 td {
	text-align:center;
}
/* anchor Styles - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
a.email,
a.phone {
	color:blue;
	text-decoration:none;
	white-space:nowrap;
}
a:hover {
	background-color:antiquewhite;
	color:darkslategrey;
	text-decoration:underline;
	transition:background .2s ease;
}
/* General Size Styles- - - - - - - - - - - - - - - - - - - - - - - - - */
.styleXXLarge,
.styleXXLargeBold,
.styleXXLargeMaroon,
.styleXXLargeMaroonBold {
	font-size:24px;
}
.styleXLarge,
.styleXLargeBold,
.styleXLargeMaroon,
.styleXLargeMaroonBold {
	font-size:22px;
}
.styleLarge,
.styleLargeBold,
.styleLargeMaroon,
.styleLargeMaroonBold {
	font-size:18px;
}
.styleSmall, 
.styleSmallBold, 
.styleSmallItalic,
.styleSmallMaroon {
	font-size:14px;
}
.styleItalic,
.styleSmallItalic {
	font-style:italic;
}
.styleSuperScript {
	font-size:12px;
	vertical-align:super;
}
.styleXXLargeBold,
.styleXXLargeMaroonBold,
.styleXLargeBold,
.styleXLargeMaroonBold,
.styleLargeBold,
.styleLargeMaroonBold,
.styleBold,
.styleMaroonBold,
.styleSmallBold {
	font-weight:bold;
}
.styleXXLargeMaroon,
.styleXXLargeMaroonBold,
.styleXLargeMaroon, 
.styleXLargeMaroonBold,
.styleLargeMaroon,
.styleLargeMaroonBold,
.styleMaroon,
.styleMaroonBold,
.styleSmallMaroon {
	color:maroon;
}
.styleGreen {
	color:darkgreen;
}
/* Misc Styles- - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.styleNowrap {
	white-space:nowrap;
}
.styleClear {
	clear:both;
} 
.styleBrd1 {
	border:thin navy solid;
	border:thin var(--myImgBrdrColor) solid;
}
.styleDate,
.styleLocation,
.styleName,
.stylePatriot,
.stylePlace,
.styleTime,
.styleTitle {
	font-weight:bold;
	white-space:nowrap;
}
.styleDate,
.stylePatriot,
.styleTime,
.styleTitle {
	color:maroon;
}
.stylePatriot {
	color:darkgreen;
}
.styleTitle {
	font-style:italic;
}
.styleShadow,
.MtgNext {
	font-weight:bold;
	text-shadow: 2px 1px 2px darkgrey;
}
.MtgNext {
	color:green;
	white-space:nowrap;
}
/* Sticky-menu - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.sticky-menu {
	background-color:#ffffe0;
	border-bottom:thin navy solid;
	border-bottom:thin var(--myImgBrdrColor) solid;
	line-height:22px;
	margin:0px;
	padding:0px; 
	position:relative;
	text-align:center;
	width:99.9%;
}
.sticky-menu a:hover {
	background-color:#e6e6e6;
	transition:background .2s ease;
}
.sticky-menu a img {
	border:0px;
}
.divAlert,
.divHoliday1,
.divHoliday2 {
	clear:both;
	width:98%;
}
.divAlert p, 
.divHoliday1 p,
.divHoliday2 p {
	border:medium darkgray dashed;
	border-radius:12px;
	display:inline-block;
	margin:auto;
	padding:6px 16px;
	text-shadow:2px 1px 2px lightgrey;
}
.divAlert p, 
.divHoliday1 p {
	background-color:#ffffcc;
}
.divHoliday2 p {
	animation-name: divHoliday2;
	animation-duration: 6s;
	animation-iteration-count: 40;
	background-color:crimson;
	color:white;
}
@keyframes divHoliday2 {
	0%		{background-color:crimson}
	10%		{background-color:crimson}
	40%		{background-color:#355e3b}	/* Hunter Green */
	60%		{background-color:#355e3b}
	90%		{background-color:crimson}
	100%	{background-color:crimson}
}
/* Anniversary Date Styles - - - - - - - - - - - - - - - - - - - - - - - */
.divAnnivDate {
	clear:both;
	margin: .5% 3%;
}
.divAnnivDate a {
	text-decoration:none;
}
.divAnnivDate p {
	background-color:darkred;
	background-color:var(--mySkinColor);
	background-image:url('../graphics/bkgrnd_deep_red_marbled.jpg');
/*	background-image:url('../graphics/bkgrnd_tumblr_navy.gif'); */
	border:medium silver solid;
	border-radius:12px;
   	color:white;
	font-family:Georgia, Times, "Times New Roman", serif;
	font-size:16px;
	font-weight:bold;
	margin:auto;
	padding:2px 10px 10px 10px;
	text-align:center;
	text-shadow: 2px 1px 2px darkgrey;
	white-space:nowrap;
}
.AnnivDateNum {
	font-family:Times, "Times New Roman", serif;
	font-size:38px;
	text-shadow: 2px 1px 2px darkgrey;
}
.AnnivDateYears {
	font-size:22px;
	position:relative;
	top:-7px;
}
/* Picture Page Styles - - - - - - - - - - - - - - - - - - - - - - - - - */
.divPicsRow {
	clear:both;
	margin:1%;
	width:100%;
}
.divPicsRow div {
	display:inline-block;
	margin:2% .5%;
	vertical-align:top;
}
.divPicsRow div img {
	border:thin navy solid;
	border:thin var(--myImgBrdrColor) solid;
	border-radius:12px;
	max-width:100%;
}
.divPicsRow div img.brd0 {
	border:0px;
	max-width:100%;
}
.divPicsRow p,
.divPicsRow div p {
	margin:0% 1%;
	text-align:center;
}
/* Calendar Table Styles - - - - - - - - - - - - - - - - - - - - - - - - */
.calTable {
	background-color:silver;
	border:2px navy solid;
	border-collapse:collapse;
	font-size:12px;
	margin:auto;
	min-width:136px;
}
.calTable th {			/* Days of the Week */
	background-color:maroon;
	border:0px;
	color:white;
	font-family:sans-serif, Tahoma, Geneva, Verdana;
	font-variant:small-caps;
	font-weight:normal;
	margin:auto auto;
	padding:0px; 
	text-align:center;
}
.calTable th.calHdr1,
.calTable th.calHdr2 {
	font-size:14px;
	font-weight:bold;
}
.calTable th.calHdr2 {
	color:gold;			/* Current Month of Year */
}
.calTable td {
	background-color:#EEE7D7;
	background-position:center;
	background-repeat:no-repeat;
	border:thin navy solid;
	color:navy;
	color:var(--myFontColor);
	font-weight:normal;
	text-align:center;
	vertical-align:middle;
}
.calTable td.calDayMtg {
	background-color:lime;
	background-image:url('../graphics/choose.png');
	border:2px navy solid;
	font-weight:bold;
}
.calTable td.calDayMtgMissed {
	background-color:#FF6666; 	/* bittersweet red */
	background-image:url('../graphics/choose.png');
	border:2px maroon solid;
}
.calTable td.calDayCurr {
	background-color:#ffe680; 	/* light yellow */
	color:purple;
	font-weight:bold;
}
.calTable td.calDayFill {
	background-color:#ECEEEC;	/* aqua spring */
}
/* Fading Division Styles- - - - - - - - - - - - - - - - - - - - - - - - */
#Images img,
#Images p {
	text-align:center;
}
.divHidden {
	display:none;
	opacity:0;
}
.divVisible,
.divVisibleAnimate {
	display:block;
}
@keyframes divVisible {
	0%		{opacity:0;}
	100%	{opacity:1;}
}
.divVisibleAnimate {
	animation:divVisible 1.5s;
}
#divVisible img,
#divVisibleAnimate img {
	border:thin navy solid;
	border-radius:12px;
}
/* Line Separator Styles - - - - - - - - - - - - - - - - - - - - - - - - */
.divRibbon {
	clear:both;
	margin:auto;
	padding:0%;
	text-align:center;
}
.divRibbon a img {
	border:0px;
	border-radius:12px;
	height:18px;
	margin:0px;
	max-width:99%;
}
/* Responsive iFrame for Google Calendar - - - - -*/
.calendar-iframe-container {
	margin:0px;
	padding:1%;
	position:relative;
} 
.calendar-iframe-container iframe,   
.calendar-iframe-container object,  
.calendar-iframe-container embed {
    width:99%;
}
/* Footer Styles - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#footer {
	background-color:darkred;
	background-color:var(--mySkinColor);
	background-image:url('../graphics/bkgrnd_deep_red_marbled.jpg');
	border-top:0px;
	border-right:medium black solid;
	border-bottom:medium black solid;
	border-left:medium black solid;
	font-size:12px;
	margin:0px;
	padding:0px;
}
#footer p {
	color:white;
	margin:0px;
	padding:4px;
}
#footer a {
	color:white;
	text-decoration:underline;
}
#footer a:hover {
	background-color:transparent;
	color:yellow;
	text-decoration:underline;
}
/* Narrow Device Styles - - - - - - - - - - - - - */
@media screen and (max-width:689px) { 
.divFloatLeftKick2,
.divFloatRightKick2 {float:none;clear:both;max-width:96%;margin-left:auto;margin-right:auto}
.mainContentCenter,
.mainContentLeft,
.mainContentPicsPage,
.mainContentMinNews {padding-left:1%;padding-right:1%}
.divSubMenu p {margin-left:6%;max-width:260px}
}
/* @media screen is also in menuStyle.css */
@media screen and (max-width:499px) {
.divFloatLeftKick1,
.divFloatRightKick1 {float:none;clear:both;max-width:96%;margin-left:auto;margin-right:auto}
.divFloatRight {height:auto}
.styleXLarge,
.styleXLargeBold,
.styleXLargeMaroon,
.styleXLargeMaroonBold {font-size:18px}
.styleLarge,
.styleLargeBold,
.styleLargeMaroon,
.styleLargeMaroonBold {font-size:16px}
.mainContentMinNews,
.mainContentCenter,
.mainContentPicsPage,
.mainContentLeft {font-size:14px}
}
@media screen and (max-width:439px) {
.styleName,
.styleLocation,
.stylePlace,
.stylePatriot,
.styleTitle {white-space:normal}
}