/******************************************************************/
/* CSS MAIN.                                                      */
/* DLM     By     Reason                                          */
/* 2020 12 05  KenR  First Version                                */
/* 2020 12 07  KenR                                               */
/* 2020 12 14 Kenr. Re-org - items moved to alternate newsNav.css */
/* 2020 12 17  KenR. Added Polaroid and modified bannerbox        */
/* 2021 01 18 KenR  Meeting css codes moved to meeting.css.       */ 
/* 2021 02 08 KenR  Added cImgCaption class for polaroids.        */
/* 2021 02 09 KenR  Updated Polaroid attributes.                  */
/******************************************************************/
body {
  	font-family: Arial;
  	font-size: 24px;
}
a {
	color: blue;	

}
	#topBanner{
        display: flex;
        background: #1f9ec4; 
        color: white; 
        text-decoration: none;
        font-size: 24px;
        letter-spacing: 2px;
        font-family: arial;
        text-shadow: 0 -1px 0 #49a0ba;
	   	 position: absolute;
		 top: 0px;
		 left: 0px;
	   	 height: 25px;
	   	 width:  100%;
        align-items : center;
        justify-content: center;	
		z-index: 1;
	}
	#bannerDate{
		display: flex;
        background: #1f9ec4; 
        color: white; 
        text-decoration: none;
        font-size: 24px;
        letter-spacing: 2px;
        font-family: arial;
        text-shadow: 0 -1px 0 #49a0ba;
	   	 position: absolute;
		 top: 0px;
		 left: 0px;
	   	 height: 25px;
	   	 width:  auto;
		 padding: 0px 10px;
        align-items : center;
        justify-content: center;
		 z-index: 2;
	}
	.imglogo{
			width: 200px;
			height: auto;
	}
	.imglogoText{
		color: blue;
		font-size: 28px;
		display: inline-block;
	    font-family: arial;
	    /* drop shadow color of font */
	    text-shadow: 0 -1px 0 #49a0ba;
		position: relative;
		left: -20px;
		top: -50px;
		text-align: center;
		
	}
	
	nav {    
  display: block;
  text-align: center;
}
.h2Centre{
	color: blue;
	font-size: 36px;
	text-align: center;
	align: center;
    font-family: arial;
		 overflow-y: auto;
    /* drop shadow color of font */
    text-shadow: 0 -1px 0 #49a0ba;
}

 /* end arrow style */
 
 /* table styles */
 td_1 {
	 color: black;
 }
 
 /* Pane Declaration */
 /* .leftPane{
	 overflow:hidden;	
	 float: left;
	 width: 20%;
	 vertical-align: top;
 }*/

 .croppedLeft{
	 height: 800px;
	  max-width: 800px; 
	  overflow: hidden; 
  
 }
 
 .croppedRight {
     # width: 1300px; /* width of container */
     # height: auto; /* height of container */
	 # margin-top: 0px;
     #margin-left: -500px;
	 height: 800px;
	 max-width: 800px;
	 overflow-x: scroll;

 }
 .threeCols{
	 width: 100%;
	 display: flex;
	 justify-content: space-around ;
 }
 
 .leftPane{
 	display: inline-block;
 	width: 15%;
 	height: 800px;
 	/* overflow: scroll; */
 	padding: 5px;
	vertical-align: top;
	background-size: cover;

 }
 .centrePane{
	 display: inline-block;
	 width: 70%;
	 height: 900px;
	 padding: 5px;
	 vertical-align: top;
	 background-color: white;
	 
 }
 .rightPane{
	 display: inline-block;
	 /* overflow: scroll; */
	 width: 15%;
	 height: 800px;
	 padding: 5px;
	 vertical-align: top;
	 background-position: right;
	 background-size: cover;

 }

 .underpane{
	 display: inline-block;
	 vertical-aligh: top;
	 width: 10%;
	 z-index: 1;
	 
 }

 .telephoneHelpLine{
     display: flex;
     /* background of menu block */
     background: #1f9ec4; 
     /* font color */
     color: white; 
     text-decoration: none;
     font-size: 24px;
     letter-spacing: 2px;
     font-family: arial;
     /* drop shadow color of font */
     text-shadow: 0 -1px 0 #49a0ba;
	 
	 /* bottom: 10px;*/
	 /* bottom: 70px; */
	 height: 30px;
	 width:  100%;
     align-items : center;
	 padding: 3px;
	 margin: 2px 2px;
     justify-content: center;
	 
 }
 .telephoneHelpLine a{
	 color: white;
 }
 
 .scrollCol {
	 display:inline-block;
	 vertical-align:  top;
	 /* height: 675px; */
	 height: 20%;
	 width: 20%;
	 border:1px solid #ccc;
	 font:24px/26px Georgia, Garamond, Serif;
	 overflow:auto;
	 white-space: nowrap; /* will prevent the default wrapping of text to next line */
	 overflow-x: auto;
 }


 .centreBigBlue{
	 width: 800px;
	 align: center;
	 position: relative;
	 
     background: #1f9ec4; 
     background-color: red; /* For browsers that do not support gradients */
     background-image: linear-gradient( red, #1f9ec4);
     color: white; 
     text-decoration: none;
     font-size: 28px;
     letter-spacing: 2px;
     font-family: arial;
     text-shadow: 0 -1px 0 #49a0ba;
	 text-align: center;
	 v-align: center;
	 
     width: 500px;
     height: auto;
     margin: 0 auto;
	 background-color: #ccc;
     padding: 10px;
     position: relative;
	 
 }
 .bigBlue{
     color: blue; 
     text-decoration: none;
     font-size: 28px;
     letter-spacing: 2px;
     font-family: arial;
     text-shadow: 0 -1px 0 #49a0ba;
 }
 .readingFontRight{
	 color: black;
	 font-size: 24px;
	 font-family: arial;
	 text-align: right;
 }
 .readingFont{
	 color: black;
	 font-size: 24px;
	 font-family: arial;
 }
 .readingItalic{
	 color: black;
	 font-size: 24px;
	 font-family: arial;
	 font-style: itaLic;
 }
 .readingItalicRight{
	 color: blue;
	 font-size: 24px;
	 font-family: arial;	
	 font-style: itaLic;
	 text-align: right;
 }
 .innerBlock{
	 overflow-y: auto;
	 padding:  10px 10px;
 }
 .donateButton {
 	display:inline-block;
 	box-shadow: 3px 4px 0px 0px #8a2a21;
 	background:linear-gradient(to bottom, #c62d1f 5%, #f24437 100%);
 	background-color:#c62d1f;
 	border-radius:30px;
 	border:1px solid #d02718;
 	cursor:pointer;
 	color:#ffffff;
 	font-family:Arial;
 	font-size:30px;
 	padding:7px 25px;
 	text-decoration:none;
 	text-shadow:0px 1px 0px #810e05;

	
 }
	 .donateButton:hover {
	 	background:linear-gradient(to bottom, #f24437 5%, #c62d1f 100%);
	 	background-color:#f24437;
	 }
	 .donateButton:active {
	 	position:relative;
	 	top:1px;
	 }
	 #arrowAnim {
	   display: inline-block;
	   width: 20px;
	   height: 20px;
	   display: flex;
	 }
	 .donateGroup{
		 display: flex;
		 justify-content: space-between;
	 }

	 .arrow {
		 display: inline-block;
	   width: 5px;
	   height: px;
	   border: 1px solid;
	   border-color: black transparent transparent black;
	   transform: rotate(-45deg);
	 }

	 .arrowSliding {
	   position: absolute;
	   -webkit-animation: slide 4s linear infinite; 
	           animation: slide 4s linear infinite;
	 }

	 .delay1 {
	   -webkit-animation-delay: 1s; 
	     animation-delay: 1s;
	 }
	 .delay2 {
	   -webkit-animation-delay: 2s; 
	     animation-delay: 2s;
	 }
	 .delay3 {
	   -webkit-animation-delay: 3s; 
	     animation-delay: 3s;
	 }

	 @-webkit-keyframes slide {
	     0% { opacity:0; transform: translateX(15px); }	
	    20% { opacity:1; transform: translateX(9px); }	
	    80% { opacity:1; transform: translateX(-9px); }	
	   100% { opacity:0; transform: translateX(-15px); }	
	 }
	 @keyframes slide {
	     0% { opacity:0; transform: translateX(15px); }	
	    20% { opacity:1; transform: translateX(9px); }	
	    80% { opacity:1; transform: translateX(-9px); }	
	   100% { opacity:0; transform: translateX(-15px); }	
	 }
	 
 .boxedBanner {
		 display: block;
		 width: 800px;
		 border: 1px solid red; 
	     height: auto;
	     margin: 0 auto;
	     padding: 10px;
	     position: relative;
	  	font-family: Arial;
	  	font-size: 24px;
	  	padding: 7px 25px;
	  	text-decoration: none;
		box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

 }
 .subBanner {
	 display: block;
	 border: 0; 
     height: auto;
     text-align: center;
     padding: 10px;
	 color: blue;

     position: relative;
  	font-family: Arial;
  	font-size: 24px;
  	padding: 7px;
  	text-decoration: none;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 }
 .midBanner {
	 display: block;
	 border: 1px solid red; 
     height: auto;
     text-align: center;
     padding: 10px;
	 color: blue;

     position: relative;
  	font-family: Arial;
  	font-size: 24px;
  	padding: 7px;
  	text-decoration: none;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 	
 }
 .textareaSubscribe{
	 color: black;
	 font-size: 24px;
	 font-family: arial;
	 height: 24px;
	 width: 400px;
 }
 .submitButton{
	 	display: inline-block;
	 	position: relative;
	 		box-shadow:inset 0px 0px 15px 3px #23395e;
	 		background:linear-gradient(to bottom, #2e466e 5%, #415989 100%);
	 		background-color:#2e466e;
	 		border-radius:24px;
	 		border:1px solid #1f2f47;
	 		cursor:pointer;
	 		color:#ffffff;
	 		font-family:Arial;
	 		font-size:24px;
	 		margin: 4px 5px; 5px 5px;
	 		padding:6px 13px;
	 	}
	 .submitButton:hover {
	 		background:linear-gradient(to bottom, #415989 5%, #2e466e 100%);
	 		color: yellow;
	 		background-color:#415989;
	 	}
 }
 .subTable{
	 display: inline-block;
	 border:1px solid #1f2f47;
 }
 .subButtonArea{
	 display: block;
	 position: relative;
	 v-align: center;
	 border:1px solid #1f2f47;
 }
 /* .polaroid {
   width: 450px;
   max-width: 450px;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
   text-align: center;

 }*/
 .polaroid {
   width: 450px;
   max-width: 450px;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
   text-align: center;

 }
 .cImgCaption{
 	color: black;
 	font-family:Arial;
 	font-size:18px;
 }
.polaImg{
	display: inline-block;
	height: 400px;
	max-width: 375px;
	width: auto;
	-o-object-fit: contain;
	object-fit: contain;	
}

 
 .topbox{
	 display: flex	;
     overflow: scroll;
	 height: 600px;
	 width: 100%;
 }
 .listTopbox{
	 display: block	;
     overflow: scroll;
	 height: 600px;
	 width: 100%;
 }
 
 .adBlock{
	 display: flex
	 width: 800px;
	 border: 3px solid red; 
     height: auto;
     margin: 0 auto;
     padding: 10px;
 }
 .height-animate {
   background: red;
   transform: scaleY(0);
    -webkit-transition: all 500ms ease;
   /* transform-origin: top; */
   max-height: 0;
 }
 .stdTwoCol{
	 display: flex;
	 justify-content: center;
	 align-items: flext-start;
	 flex: 1;
	 position: relative;
 }
 .leftSideCol{
	 display: inline-block;
	 margin: 20px;

 }
 .rightSideCol{
	 display: inline-block;
	 margin: 20px;	 
 }
 
 .pseudoTable {
	display: grid;
	grid-template-columns: 300px 300px;
	grid-gap: 3px;
	font-family: 'Arial';
	margin: 25px;
	border: 1px solid #eee;
	border-bottom: 2px solid gray;
	box-shadow: 0px 0px 20px #D8E3E5,
		0px 10px 20px #D8E3E5,
		0px 20px 20px #D8E3E5,
		0px 10px 10px #D8E3E5;
 }


 .execBox{
     border-radius: 5px;
     padding: 5px;
	 border: 1px solid gray;

 }
 .execName{
	 width: 300px;
       padding: 5px;
	   border: 1px solid black;

 }
 .execHead{
	 border-radius: 5px;
	 border: 1px solid black;
	 padding: 5px;
       background-color: #1f9ec4;
       border: 1px solid black;
       font-weight: normal;
       color: white;
 }
 .popup{
	 display: none;
	 border: 1px solid black;
  	box-shadow: 3px 4px 0px 0px #1564ad;
  	background:linear-gradient(to bottom, #79bbff 5%, #378de5 100%);
	 position: absolute;
	 top: 100px;
	 left: 100px;
	 height: 800px;
	 width: 800px;
	 opacity: 1;
 }
 .popupTarget{
	 display: block;	 
	 border: 1px solid black;
	 background-color: white;
	 font: arial;
	 font-size: 20px;
	 height: 700px;
	 width: 700px;
	 top: 50px;
	 left: 50px;
	 position: relative;
	 opacity: 1;
 	
 }

 .popupCloseMe {
 	box-shadow: 3px 4px 0px 0px #1564ad;
 	background:linear-gradient(to bottom, #79bbff 5%, #378de5 100%);
	float: right;
	position: relative;
 	background-color:#79bbff;
 	border-radius:5px;
 	border:1px solid #337bc4;
 	display:inline-block;
 	cursor:pointer;
 	color:#ffffff;
 	font-family:Arial;
 	font-size:20px;
 	font-weight:bold;
 	padding:12px 44px;
 	text-decoration:none;
 	text-shadow:0px 1px 0px #528ecc;
 }
 .popupCloseMe:hover {
 	background:linear-gradient(to bottom, #378de5 5%, #79bbff 100%);
 	background-color:#378de5;
 }
 .popupCloseMe:active {
 	position:relative;
 	top:1px;
 }
 .popupButton{
	 display: inline-block;
	 background: url("/images/COVIDPopup.png") no-repeat scroll 0 0 transparent;
	 background-size: cover;
	   color: #000000;
	   cursor: pointer;
	   font-weight: bold;
	   height: 80px;
	   width: 350px;
	 border: 1px solid black;
	 font: arial;
	 font-size: 20px;
	 padding: 10px;
	 margin: 10px;
	 color: white;
	 opacity: 1;
 }
 .logoAndText{
	 display: inline-block;
 }
 .topBanner0{
	 display: flex;
	 width: 100%;
	 justify-content: space-between;
 }