/*.jd Image Preloader */

@media screen {
	div#preloader {
		position: absolute;
		left: -9999px;
		top: -9999px;
	}

	div#preloader img {
		display: block;
	}
}

/* @media print {

	div#preloader,
	div#preloader img {
		visibility: hidden;
		display: none;
	}
}*/

@media print {
	.print-hide {
		display: none;
	}
}

/* @media print {
	body * {
		visibility: hidden;
	}*/
	.print-only, .print-only * {
		visibility: visible;
	}
}
@media print {
	.print-this-only {
		visibility: visible;
	}
}
@media screen {
	.screen-hide {
		visibility: hidden;
}


html,
/* button, */
/* input, */
select,
textarea {
	color: black;
}//color: #fcc289;

.px3Bk {
	border-top: 3px solid black !important;
}
.px1Bk {
	border-top: 1px solid black !important;
}
.px3Gr {
	border-top: 3px solid grey !important;
}

.px2Gr {
	border-top: 2px solid grey !important;
}

.px2GrDsh {
	border-top: 2px dashed grey !important;
}

.thepotty {
	display: none;
}

.thehide {
	display: none;
}

form {
	height: auto;
}

/* This was used early-on and should be changed to jd-wrap850w*/
.jd-form850w {
	max-width: 850px !important;
	margin: auto
}
.jd-wrap700w {
	max-width: 700px !important;
	margin: auto
}
/* This is the best centering for all articles */
.jd-wrap750w {
	max-width: 750px !important;
	margin: auto
}
.jd-wrap750wAutoH {
	max-width: 750px !important;
	margin: auto;
	height: auto !important;
}/*fails don't use */
.jd-wrap800w {
	max-width: 800px !important;
	margin: auto
}
/* This is the best centering for all articles */
.jd-wrap850w {
	max-width: 850px !important;
	margin: auto
}
/* These the best centering for Narrow items */
.jd-wrap550w {
	max-width: 550px !important;
	margin: auto
}
.jd-wrap560w {
	max-width: 560px !important;
	margin: auto
}
.jd-wrap600w {
	max-width: 600px !important;
	margin: auto
}
.jd-wrap650w {
	max-width: 650px !important;
	margin: auto
}
.jd-wrap380w {
	max-width: 380px !important;
	margin: auto
}
.jd-wrap350w {
	max-width: 350px !important;
	margin: auto
}
.jd-wrap300w {
	max-width: 300px !important;
	margin: auto
}
.jd-wrap315w {
	max-width: 315px !important;
	margin: auto;
	padding: 10px
}
.jd-wrap310w {
	max-width: 310px !important;
	margin: auto
}
.jd-wrap330w {
	max-width: 330px !important;
	margin: auto
}
.jd-wrap280w {
	max-width: 280px !important;
	margin: auto
}
.jd-wrap270w {
	max-width: 270px !important;
	margin: auto
}

.jd-flexContain {
  display: flex;
	height: auto;
  flex-direction: row;
  flex-wrap: nowrap;
}
@media (max-width: 600px) {
  .jd-flexContain {
	flex-direction: column;
	flex-wrap: wrap;
  }
}

/* Responsive layout - makes a one column layout instead of a two-column layout VERY IMPORTANT FOR SIDE BY SIDE BOXES WITH iPhone VVVVVVVVVV*/
.jd-flexContain2 {
	display: flex;
	flex-direction: row;
}
@media (max-width: 600px) {
.jd-flexContain2 {
		flex-direction: column;
	}
}

moreLink {
	color: teal
}

lessLink {
	color: teal
}

input[type=text] {
	padding: 5px 10px;
	/*     margin: 8px 0; */
	border-radius: 4px;
	box-sizing: border-box;
	width: 95%;
	border: 1px solid #008080;
	/* Teal (web colors) */
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
}

input[type=text]:hover {
	padding: 5px 10px;
	/*     margin: 8px 0; */
	border-radius: 4px;
	box-sizing: border-box;
	width: 95%;
	border: 1px solid red;
	/* Teal (web colors) */
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
}


input[type=email] {
	padding: 5px 10px;
	border-radius: 4px;
	box-sizing: border-box;
	width: 95%;
	border: 1px solid #008080;
	/* Teal (web colors) */
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
}

input[type=email]:hover {

	padding: 5px 10px;
	border-radius: 4px;
	box-sizing: border-box;
	width: 95%;
	border: 2px solid #008080;
	/* Teal (web colors) */
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
}

/* input[type="file"] {
	display: none;
} */
.jd-custom-file-upload {
	border: 1px solid #ccc;
	display: inline-block;
	padding: 6px 12px;
	cursor: pointer;
}

#noprint {
	display: none;
}

#print {
	display: block;
}

/* Red border */
hr.new1 {
	border-top: 1px solid red;
}

/* Dashed red border */
hr.new2 {
	border-top: 1px dashed red;
}

/* Dotted red border */
hr.new3 {
	border-top: 1px dotted red;
}

/* Thick red border */
hr.new4 {
	border: 1px solid red;
}

/* Large rounded Azure border */
hr.new5 {
	border: 10px solid #ccffff !important;
	border-radius: 2px;
}


textarea {
	width: 100%;
	color: black;
	padding: 12px 20px;
	box-sizing: border-box;
	border: 1px solid #008080;
	border-radius: 4px;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
}

textarea:hover {
	width: 100%;
	color: black;
	padding: 12px 20px;
	box-sizing: border-box;
	border: 1px solid red;
	border-radius: 4px;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
}

.jd-textarea {
	width: 100% !important;
	color: black !important;
	padding: 4px 10px !important;
	box-sizing: border-box !important;
	border: 1px solid #008080 !important;
	border-radius: 4px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

.jd-textarea:hover {
	width: 100% !important;
	color: black !important;
	padding: 4px 10px !important;
	box-sizing: border-box !important;
	border: 1px solid red !important;
	border-radius: 4px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

.jd-textarea3 {
	width: 45px !important;
	color: black !important;
	padding: 4px 6px !important;
	box-sizing: border-box !important;
	border: 1px solid #008080 !important;
	border-radius: 4px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

.jd-textarea3:hover {
	width: 45px !important;
	color: black !important;
	padding: 4px 6px !important;
	box-sizing: border-box !important;
	border: 1px solid red !important;
	border-radius: 4px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

.jd-textarea4 {
	width: 45px !important;
	color: black !important;
	padding: 2px 6px !important;
	box-sizing: border-box !important;
	border: 1px solid #008080 !important;
	border-radius: 3px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

.jd-textarea4:hover {
	width: 45px !important;
	color: black !important;
	padding: 2px 6px !important;
	box-sizing: border-box !important;
	border: 1px solid red !important;
	border-radius: 3px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}
.jd-textarea55px {
	width: 55px !important;
	color: black !important;
	padding: 2px 6px !important;
	box-sizing: border-box !important;
	border: 1px solid #008080 !important;
	border-radius: 3px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

.jd-textarea55px:hover {
	width: 55px !important;
	color: black !important;
	padding: 2px 6px !important;
	box-sizing: border-box !important;
	border: 1px solid red !important;
	border-radius: 3px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

.jd-textarea5 {
	//width: 45px !important;
	color: black !important;
	padding: 4px 6px !important;
	box-sizing: border-box !important;
	border: 1px solid #008080 !important;
	border-radius: 4px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

.jd-textarea5:hover {
	//width: 45px !important;
	color: black !important;
	padding: 4px 6px !important;
	box-sizing: border-box !important;
	border: 1px solid red !important;
	border-radius: 4px !important;
	-webkit-transition: 0.5s !important;
	transition: 0.5s !important;
	outline: none !important;
}

jd-textarea1 {
	width: 200px;
}

jd-textarea50 {
	width: 50px !important;
}

.jd-input1 {
	padding: 8px;
	display: block;
	border: 1px solid black;
	border-bottom: 1px solid #ccc;
	width: 100%
}

.jd-input1:hover {
	padding: 8px;
	display: block;
	border: 1px solid red;
	border-bottom: 1px solid #ccc;
	width: 100%
}

.jd-input2 {
	padding: 2px 0px !important;
	/*
	display: block !important;
	border: none !important;
	width: 100% !important;
*/
}

/*
.jd-input2:hover {
	padding: 2px 0px;
	display: block;
	border: none;
	width: 100%
}
*/

#input-text {
	height: 28px;
	resize: none;
	white-space: pre;
	overflow-wrap: normal;
	overflow: hidden;
	padding: 5px;
}

input[type="submit"] {

	margin: 8px 0;
	border-radius: 4px;
	box-sizing: border-box;
	width: 50%;
	background-color: teal;
	color: white;
	border: 1px solid #008080;
	/* Teal (web colors) */
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
}

input[type="submit"]:hover {

	margin: 8px 0;
	border-radius: 4px;
	box-sizing: border-box;
	width: 50%;
	background-color: red;
	color: white;
	border: 1px solid #008080;
	/* Teal (web colors) */
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
}

input[type=file] {

	padding: 5px 10px;
	margin: 8px 0;
	border-radius: 4px;
	box-sizing: border-box;
	width: 95%;
	border: 1px solid #008080;
	/* Teal (web colors) */
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
	font-size: x-small;
}

input[type=file]:hover {

	padding: 5px 10px;
	margin: 8px 0;
	border-radius: 4px;
	box-sizing: border-box;
	width: 95%;
	border: 1px solid #008080;
	/* Teal (web colors) */
	-webkit-transition: 0.5s;
	transition: 0.5s;
	outline: none;
	font-size: smaller;
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
/* Read More or Read Less */
#more {
	display: none;
}

#jdBtn {
	border: none;
	background: none;
	color: grey;
	font-size: medium;
	font-style: italic;
	cursor: pointer;
	float:right;
	padding-right: 5%	
}//display: inline-block;

#jdBtn:hover {
	color: green;
}
/* !ReadMore START*/
/* Pure CSS read more toggle https://codepen.io/Idered/pen/AeBgF  THIS IS THE BEST*/
.read-more-state {
	  display: none;
	}
	
	.read-more-target {
	  opacity: 0;
	  max-height: 0;
	  font-size: 0;
	  transition: .25s ease;
	}	
	.read-more-state:checked ~ .read-more-wrap .read-more-target {
	  opacity: 1;
	  font-size: inherit;
	  max-height: 999em;
	}
	
	.read-more-state ~ .read-more-trigger:before {
	  content: '...read the story';
	}
	.read-more-state:checked ~ .read-more-trigger:before {
	  content: 'read less';
	}
	.read-more-trigger {
	  cursor: pointer;
	  display: inline-block;
	  padding: 0 0 20px 0;
	  color: #202020;
	  font-size:  medium;
	  font-style: italic;
	  line-height: 1;
	  border: none;
	 float:right;
	 padding-right: 10%	
	}
	.read-more-trigger:hover {
		color: green;
	}
/* ReadMore END∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/ /* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.jd-menu {
	padding: 5px
}

.jd-menu:hover {
	color: red !important; 
}

/*! TABLE */
jd-table {
	border: none;

}



/* The following table will need <table id="jdt1"> as the start of the table to link it to this css*/
jd-table1 {
	width: 100%;
	border: none;
	font-size: medium !important;
}

jd-table1 tr td {
	border: none !important;
	padding-bottom: 5px;
	padding-top: 5px
	}
jd-table1 th {
	font-weight: 100
	}
	
	
	
table#jdt2 {
	width: 100%;
	border: 1px solid black !important;
	font-size: small !important;
}

table#jdt2 tr td {
	border: 1px solid black !important;
}

.jdt2 {
	width: 100%;
	border: 1px solid grey !important;
	border-collapse: separate;
	font-size: small !important;
}

.jdt2 tr td {
	border: 1px solid grey !important;
	padding: 1em !important
}

/*END table */



jd-caption1 {
	display: table-caption;
	caption-side: bottom;
	text-align: center;
}

/*! Images */
.jd-transparent {
	zoom: 1;
	filter: alpha(opacity=90);
	opacity: .2;
}
.jd-column33 {
	float: left;
	width: 33%;
	padding: 5px;
}
.jd-column66 {
	float: right;
	width: 33%;
	padding: 5px;
}
}
.jd-column40 {
	float: left;
	width: 40%;
	padding: 5px;
}
/* Three image containers (use 25% for four, and 50% for two, etc) */
.jd-column4 {
	float: left;
	width: 25%;
	padding: 5px;
}

.jd-column4 img {
	opacity: 0.8;
	cursor: pointer;
}

.jd-column4 img:hover {
	opacity: 1;
}

.jd-column5 {
	float: left;
	width: 20%;
	padding: 5px;
}

.jd-column5 img {
	opacity: 0.8;
	cursor: pointer;
}

.jd-column5 img:hover {
	opacity: 1;
}

.jd-column6 {
	float: left;
	width: 16.66%;
	padding: 5px;
}

.jd-column6 img {
	opacity: 0.8;
	cursor: pointer;
}

.jd-column6 img:hover {
	opacity: 1;
}

/* Clear floats after image containers */
.jd-row::after {
	content: " ";
	clear: both;
	display: table;
}

.jd-centerPIC {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 50%;
}
.jd-centerPIC70 {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 70%;
}
.jd-centerBOX50 {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 50%;
}
.jd-centerBOX65 {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 65%;
}
.jd-centerBOX75 {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 75%;
}
.jd-centerBOX {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

.jd-PicSizeMax500 {
	width: 500px !important;
	height: auto
}

.jd-PicSizeVVsml {
	width: 10% !important;
	height: auto
}

.jd-PicSizeVsml {
	width: 30% !important;
	height: auto
}

.jd-PicSizeSml {
	width: 80% !important;
	height: auto
}

.jd-PicSizeMed {
	width: 120% !important;
	height: auto
}

.jd-PicSize {
	width: 100% !important;
	height: auto
}

.jd-PicSizeBig {
	width: 200% !important;
	height: auto
}

.jd-PicSize182 {
	width: 182px !important;
	height: auto
}

/* used on colors page DON'T CHANGE*/
.jd-PicSize50 {
	width: 50% !important;
	height: auto
}
.jd-corners10 {
	border-radius: 10px;
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 414px) {
	.jd.column4 {
		width: 100%;
	}
}

/*
@media screen and (max-width: 1084px) {
  .jd.column4 {
    width: 50%;
  }
}
*/
.jd-textAlignJst {
	text-align: justify !important;
	font: .85em Arial, sans-serif;
}

.jd-textAlignRt {
	text-align: right: font:1 .5em Arial, sans-serif;
}
.jd-textOnlyAlignRt {
	text-align: right !important;
}
.jd-display-bottomright {
	position: absolute;
	right: 0;
	bottom: 30
}
.jd-display-topright {
	position: fixed;
	right: 0;
	top: 30
}
.jd-display-t18emright {
	position: fixed;
	right: 0;
	top: 18em
}
.jd-display-topright2 {
	position:  relative;
	right: -10px;
	top: 3px
}
.jd-display-topright3 {
	position: absolute;
	top: 2%;
	right: 0%;
	transform: translate(0%, -2%);
	-ms-transform: translate(0%, -2%)
}

body {			/* Hide vertical scrollbar */
	/* overflow-y: scroll;
	scrollbar-width: none*/
}
/* Hide scrollbar for Chrome, Safari and Opera */
/* body::-webkit-scrollbar {
  display: none;
  scrollbar-width: none;  /* Firefox */
}
*/
/* Hide scrollbar for IE, Edge and Firefox */
/* body {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}*/
::-moz-selection {
	background: #b3d4fd;
	text-shadow: none;
}

::selection {
	background: #b3d4fd;
	text-shadow: none;
}



hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid;
	border-color: grey;
	margin: 1em 0;
	padding: 0;
}

/* horizontal rule line jd  modified 8-18*/



img {
	vertical-align: middle;
	max-width: 100%;
	/* added jd————12/15/17 */
	height: auto;
	margin: 0;
}

fieldXset {
	border: 0;
	margin: 0;
	padding: 0;
}



.chromeframe {
	margin: 0.2em 0;
	background: #ccc;
	color: #000;
	padding: 0.2em 0;
}


/* ---------------------------------------------------------- */


html,
body {
	height: 100%
}

/*gets rid of white space around body  margin:0;*/
/* WARNING removed for PDF */
body {
	font: 16px/26px Arial, Verdana, Helvetica, Helvetica;
}

#wrap {
	min-height: auto
}

#main {
	overflow: auto;
	padding-bottom: 100px;
}

#footer {
	position: relative;
	margin-top: -130px;
	height: 130px;
	clear: both;
	background-color: teal;
}
@media screen (min-width: 600px) {
	#footer {
	background-color: teal/* rgba(7, 92, 83, 1);*/
	height: 500px;
	overflow-y: hidden;
	}}
.jd-footer {
	background-color: teal;
	/* Teal (name colors) */
	color: white;
	font-weight: 300;
	font-size: small;
	text-align: center;
	padding: 5px;
	/* width: 80%;*/
	/* margin: 0 15%;*/
}
@media only screen and (max-width: 600px) {
.jd-footer {
background-color: teal;
}}

@media only screen and (max-width: 600px) {
	.jd-hidePhone {
	display: none;
	}
}

/* !DEPRECTATED */
.wrapper {
	width: 90%;
	margin: 0 5%;
}

#sticky {
	width: 100%;
	height: 100px;
	margin: 10px;
	padding-top: 0px;
	background: #008080;
	/* Teal (name colors) */
	color: white;
	font-weight: 300;
	font-size: small;
	text-align: center;
	position: absolute;
	/*Here's what sticks it*/
	bottom: 0;
	/*to the bottom of the body/page*/
	left: 0;
	/*and to the left of the body/page.*/
}

/* ---------------------------------------------------------- */



.header-container2 {
	background-color: black;
}

.footer-container .main {
	border-top: 20px solid black;
	background: black;
}

.main aside {
	border-top: 20px solid black;
	background: black;
}


/* ---------------------------------------------------------- */


/*
.clearfix {
    overflow: auto;
 }  jd added then removed later */

.title {
	color: white;
	font-weight: 400;
}

.fntLigt {
	font-style: italic;
	font-weight: 100;
	text-align: center;
}

/* addedfor footer jd */

/* ---------------------------------------------------------- */


@media only screen and (min-width: 768px) {

	/* ====================
    WIDE: CSS3 Effects
   ==================== */


	/* ============
    WIDE: Main
   ============ */

	.main article {
		float: left;
		width: 57%;
	}

	.main aside {
		float: right;
		width: 28%;
	}
}

/*.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
} added by me jd */

/*   padding: 5px;
  background-color: #cae8ca;
  border: 2px solid #4CAF50; jd————12/21/17############################### */


/*! FONTS */
/* font-family: 'Barlow Condensed', sans-serif;*/
font-family: 'Pathway Gothic One', sans-serif;
/*font-family: 'Satisfy', cursive;
font-family: 'Cabin Condensed', sans-serif;
font-family: 'Neucha', cursive;
font-family: 'IM Fell English', serif;

font-family: 'Roboto', sans-serif;
font-family: 'Cabin Condensed', sans-serif;
font-family: 'Hammersmith One', sans-serif; jd————12/16/17

font-family: 'Cinzel Decorative', cursive;
font-family: 'Fredericka the Great', cursive;
font-family: 'Great Vibes', cursive;
font-family: 'Henny Penny', cursive;
font-family: 'Irish Grover', cursive;
font-family: 'Libre Barcode 128 Text', cursive;
font-family: 'Libre Barcode 39', cursive;
font-family: 'Marck Script', cursive;
font-family: 'Medula One', cursive;
font-family: 'Overlock SC', cursive;
font-family: 'Patrick Hand SC', cursive;
font-family: 'Rancho', cursive; */

font-family: 'Antonio',
sans-serif;
font-family: 'Barlow Condensed',
sans-serif;
font-family: 'Cabin Condensed',
sans-serif;
font-family: 'Fredericka the Great',
cursive;
font-family: 'Great Vibes',
cursive;
font-family: 'Hammersmith One',
sans-serif;
font-family: 'IM Fell English',
serif;
font-family: 'IM Fell English SC',
serif;
font-family: 'Neucha',
cursive;
font-family: 'Pathway Gothic One',
sans-serif;
font-family: 'Roboto Condensed',
sans-serif;
font-family: 'Satisfy',
cursive;

.CondnsdFont1 {
	/* font-family: 'IM Fell English', serif; jd————12/18/17 */
	font: 20px/30px 'Barlow Condensed', sans-serif;
	line-height: 115%;
}

.CondnsdFont2 {
	/* font-family: 'Cabin Condensed', sans-serif; jd————12/18/17 */
	font: 18px/25px 'Barlow Condensed', sans-serif;
	line-height: 105%;
}

.CondnsdFont3 {
	/* font-family: 'Cabin Condensed', sans-serif; jd */
	font: 14px/16px 'Barlow Condensed', sans-serif;
	line-height: 100%;
}

.oldFont1 {
	/* font-family: 'Barlow Condensed', serif; jd————12/18/17 */
	font: 20px/30px 'IM Fell English', sans-serif;
	line-height: 125%;
}

.jd-oldFont1 {
	font: 40px/50px 'IM Fell English', sans-serif !important;
	line-height: 125%;
}
.jd-oldFont2 {
	font: 26px/30px 'IM Fell English', sans-serif, bold !important;
	line-height: 100%;
}
.oldFont2 {
	font: 20px/30px 'IM Fell English', sans-serif, bold !important;
	line-height: 120%;
}

.cursvFont1 {
	font: 20px/30px 'Satisfy', cursive;
	line-height: 115%;
}

.jd-cursvFont1LigtShdo {
	font: 20px/30px 'Satisfy', cursive;
	line-height: 115%;
	text-shadow: 2px 2px 3px rgb(20, 10, 10)
}
.cursvFont2 {
	font: 20px/30px 'Neucha', cursive !important;
	line-height: 115%;
}

.jd-cursvFont2 {
	font: 15px/25px 'Neucha', cursive;
	line-height: 115%;
}
.jd-NeuchaFont {
	font-family: 'Neucha', cursive !important;
}
/* 	font-family: 'Hammersmith One', sans-serif; */
.jd-robotoFont {
	font-family: 'Roboto', sans-serif;
}

/*font:16px/30px 'Catamaran', sans-serif;   Roboto */
.jd-hammerFont {
	font-family: 'Hammersmith One', sans-serif;
}

.jd-FrederickaFont {
	font-family: 'Fredericka the Great', cursive;
}
.jd-GothicOneFont {
	font-family: 'Pathway Gothic One' cursive !important
}
.jd-GreatVibesFont {
	font-family: 'Great Vibes', cursive !important
}
.jd-SatisfyFont {
	font-family: 'Satisfy', cursive !important;
}
.jd-fntXsml {
	font-size: 13px !important
}

.jd-fntSml {
	font-size: smaller !important
}

.jd-fntSmlMed {
	font-size: 2em !important
}

.jd-fntMed {
	font-size: 50pt !important
}

.jd-fntMedPlus {
	font-size: 70pt !important
}

.jd-fntBig {
	font-size: 100pt !important;
	line-height: 0;
	text-shadow: 3px 3px 5px grey !important;
}

.jd-txtShadow {
	text-shadow: 3px 3px 5px grey !important;
}
.jd-txtShadowVLt {
	text-shadow: 2px 2px 3px lightgray !important;
}
.jd-txtShadowLt {
	text-shadow: 2px 2px 3px grey !important;
}
.jd-txtShadowDrk {
	text-shadow: 4px 4px 5px black !important;
}

.jd-strike {
	text-decoration: line-through;
}

.jd-animate-zoom {
	animation-iteration-count: animatezoom 1; 
	 animation: animatezoom 1s !important;
	 animation-timing-function:animatezoom ease-out;
}

.jd-animate-zoomSml {
	animation: animatezoom 8s;
	animation-iteration-count: animatezoom 5 !important;
}
@keyframes animatezoom {
	from {transform: scale(90%)}
	to {transform: scale(100%)}
}
.jd-animate-opacity {
	animation: opac 1s!important
}

@keyframes opac {
	from {opacity: 0}
	to {opacity: 1}
}

.jd-spin {
	animation: w3-spin .5s infinite linear;
	animation-iteration-count: 10;
}

@keyframes jd-spin {
	0% {
		transform: rotate(0deg)
	}
	100% {
		transform: rotate(359deg)
	}
}
.jd-animate-colorChange {
	color: yellow;
	  //animation-name: swapColor;
	  //animation-duration: 3s;
	  //animation-iteration-count: 8;
	  //animation-direction: alternate;
	  animation: swapColor 5s infinite alternate;
}
@keyframes swapColor {
  from {color: yellow;}
  to {color: red;}
}
/* not used */
.jd-animate-fading-slo {
	animation: fading 5s 3
}

.jd-animate-fading {
	animation: fading 3s infinite left
}

.jd-animate-sideToside {
	animation: 5s infinite alternate slidein;
}

@keyframes slidein {
	from {
		margin-left: 60%;
		width: 150%
	}

	to {
		margin-left: 20%;
		width: 90%;
	}
}
.jd-animate-sideTosideShorter {
	animation: 8s infinite alternate slidein2;
}

@keyframes slidein2 {
	from {
		margin-left: -20%;
		width: 0%
	}

	to {
		margin-right: -3%;
		width: -10%;
	}
}


/* animation: fadeout 10s[how long no change] 13s[how long to fadeout] ease-out forwards[stop looping];*/
.jd-fadeaway {
	  animation: fadeout 10s 13s ease-out forwards;
	}	
	@keyframes fadeout {
	  from {opacity: 100;}
	  to {opacity: 0;}
	}
.jd-fadeaway20s {
	  animation: fadeout 20s 13s ease-out forwards;
	}	
	@keyframes fadeout {
	  from {opacity: 100;}
	  to {opacity: 0;}
	}
	
	/* ∞∞∞∞∞∞∞∞∞∞∞END ANIMATIONS∞∞∞∞∞∞∞∞∞∞∞∞  */
	

.jd-boxshadow {
	box-shadow: 0px 0px 35px red;
	animation: fadeout 3s;
	animation-iteration-count: 5;
animation-direction: alternate-reverse;	
animation-duration: 2s;	
}
/* @keyframes jd-boxshadow {
	from {opacity: 100;}
	to {opacity: 10;}
}*/

/*
#BreathfntBig {
	font-size: 70pt !important;
	line-height: 0;
	text-shadow: 3px 3px 5px grey  !important;
	-webkit-animation: breath 5s infinite;
	animation: breath 5s infinite;
} 
@-webkit-keyframes breath {
	50% {font-size: 70pt;}}
@keyframes breath {50% {font-size: 70pt;}}
*/
.jd-pointer {
	cursor: pointer
}

.txtwht {
	color: white;
}

.txtblk {
	color: black;
}

.txtaq {
	color: aqua;
}

.jd-texttagItalicSml {
	color: blue;
	font-style: italic;
	font-size: medium;
	cursor: pointer
}

.jd-texttagLtBlue {
	color: deepskyblue !important;
	cursor: pointer
}
.jd-texttagLtBlue:hover {
	color: red !important;
	cursor: pointer
}
.jd-texttagSand {
	color: #fdf5e6!important;
	cursor: pointer
}
.jd-texttagSand:hover {
	color: red!important;
	cursor: pointer
}
.jd-texttagBlond {
	color: #FAF0BE!important;
	cursor: pointer
}
.jd-texttagBlond:hover {
	color: red!important;
	cursor: pointer
}
.jd-texttagDarkGreen {
	color: darkgreen
}

.jd-teal,
.jd-hover-teal:hover {
	color: #fff !important;
	background-color: #009688 !important
}

.jd-texttagBlk {
	color: #130a0a;
	/* 	font-style: italic; */
	text-decoration: underline;
	font-weight: 500;
	cursor: pointer
}

.jd-texttagBlk:hover {
	color: red;
	cursor: pointer
}

.jd-texttagGrey {
	color: #666464;
	text-decoration: underline;
	font-weight: 500;
	cursor: pointer
}

.jd-texttagGrey:hover {
	color: red;
	font-style: italic
}

.jd-textUnderLn {
	text-decoration: underline
}
.jd-texttag {
	color: blue !important;
	cursor: pointer
}
.jd-texttag:hover {
	color: red !important;
	cursor: pointer
}
.jd-texttagYelHov {
	color: blue !important;
	cursor: pointer
}
.jd-texttagYelHov:hover {
	color: yellow !important;
	cursor: pointer
}
.jd-texttag3 {
	font-weight: 800;
	color: #FF1493;
	/* DeepPink (web colors) */
	cursor: pointer
}

.jd-texttag3:hover {
	color: red;
	cursor: pointer
}

.jd-texttagWhite {
	color: #FFFFFF;
	/*font-weight: 800; White (web safe colors) */
	cursor: pointer
}

.jd-texttagWhite:hover {
	color: red;
	cursor: pointer
}

.jd-texttag2 {
	color: inherit;
	border-bottom: 1px dotted blue;
	cursor: pointer
}

.jd-texttag2:hover {
	color: red;
	cursor: pointer
}

.jd-texttagHotPink {
	font-weight: 800;
	color: #FF1493;
	/* DeepPink (web colors) */
}

.jd-texttagLtBlu {
	color: deepskyblue !important;
	text-decoration: underline;
}

.jd-texttagLtBlu:hover {
	color: #aa231f !important;
	/* red 60 (ibm design colors) */
	font-style: italic !important;
}

.jd-texttagDrkBlu {
	color: #1d3458
		/* blue 80 (ibm design colors) */
}

.jd-texttagDrkBlu:hover {
	color: #aa231f !important;
	/* red 60 (ibm design colors) */
	font-style: italic !important;
}

.jd-texttagMedBlu {
	color: #0000FF
		/* Blue (web colors) */
}

.jd-texttagMedBlu:hover {
	color: red !important;
	/* red 60 (ibm design colors) */
	font-style: italic !important;
	
}

.jd-texttagRed {
	color: red;
	text-decoration: underline !important;
}

.jd-texttagRed:hover {
	color: pink;
	text-decoration: underline !important;
}

.jd-textBrightGreen {
	color: #66FF00 !important
}

.jd-texttagBrightGreen {
	color: #66FF00 !important
}

.jd-texttagBrightGreen:hover {
	color: red !important;
	font-style: italic !important, bold !important;
}

.jd-textVeryGrey, 
.jd-text-VeryGrey {
	color: #253529
}
.jd-text-white {
	color: white
} 
.jd-text-Ivory {
	color: #FFFFF0
} 
.jd-text-darkturquoise {
color:darkturquoise
}
.jd-text-sky {
	color: #336699
}
.jd-text-Silver {
	color: #C0C0C0
}
.jd-text-LightYellow  {
	color: #FFFFE0
}
/* Black leather jacket (name colors) */
.jd-textDecorStrike {
	text-decoration: line-through
}

.jd-textDecorUnder {
	text-decoration: underline
}

.jd-textSmlItalic {
	font-size: small !important;
	font-style: italic !important
}

.jd-textSmlItalicSuper {
	font-size: small !important;
	font-style: italic !important;
	vertical-align: super !important
}

.jd-text11 {
	font-size: 11px !important
}

.jd-text12 {
	font-size: 12px !important
}

.jd-text13 {
	font-size: 13px !important
}

.jd-text14 {
	font-size: 14px !important
}
.jd-text15 {
	font-size: 15px !important
}
.jd-text16 {
	font-size: 16px !important
}

.jd-text18 {
	font-size: 18px !important
}

.jd-text20 {
	font-size: 20px !important
}
.jd-text24 {
	font-size: 24px !important
}
.jd-text28 {
	font-size: 28px !important
}
.jd-text30 {
	font-size: 30px !important
}
.jd-text32 {
	font-size: 32px !important
}
.jd-text36 {
	font-size: 36px !important
}
.jd-text40 {
	font-size: 40px !important
}

.jd-text50 {
	font-size: 50px !important
}

.jd-text60 {
	font-size: 60px !important
}
.jd-text70 {
	font-size: 70px !important
}
.jd-text80 {
	font-size: 80px !important
}



.jd-select {
	padding: 9px 0;
	width: 100%;
	border: none;
	border-bottom: 1px solid #ccc;
	color: black
}

.jd-select2 {
	padding: 9px 5px;
	width: 90%;
	border: none;
	border-bottom: 1px solid #ccc;
	color: black
}



.jd-back1 {
	background-color: cornsilk
}

.jd-back2 {
	background-color: whitesmoke
}
.jd-backCremO75 {
	background:rgba(250, 241, 216, 0.75);
}
.jd-back3 {
	background-color: lightcyan
}

.jd-back4 {
	background-color: honeydew
}

.jd-back5 {
	background-color: lightgoldenrodyellow
}

.jd-back6 {
	background-color: seashell
}

.jd-back7 {
	background-color: linen
}

.jd-back8 {
	background-color: mediumspringgreen
}

.jd-back9 {
	background-color: BurlyWood
}

.jd-back10 {
	background-color: LightYellow
}

.jd-back11 {
	background-color: PaleGoldenRod
}

.jd-back12 {
	background-color: NavajoWhite
}
/*!Gradiant Backgrounds ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-back-grad-RedYel {
	  background-image: linear-gradient(red, yellow);
	}
.jd-back-grad-LtYelRed {
	  background-image: linear-gradient(lightgreen, lightyellow, lightyellow, lightyellow, lightyellow, lightyellow, lightgreen);
	}
.jd-back-grad-LightSeaGreen {
		background-image: linear-gradient(yellowgreen,#20B2AA );
	}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-back-Transparent {
	background-color: transparent!important
}
.jd-back-LightSeaGreen {
	background-color: #20B2AA
}
.jd-back-Cornsilk {
	background-color: Cornsilk
}
.jd-back-Cornsilk2 {
	background-color: #fff5cc
}
.jd-back-BurlyWood  {
	background-color: #DEB887
}
.jd-back-WhiteSmoke {
	background-color: WhiteSmoke
}

.jd-back-LightYellow {
	background-color: #FFFFE0
}

.jd-back-LightCoral {
	background-color: #F08080
}

.jd-back-Thistle {
	background-color: #D8BFD8
}

.jd-back-Violet {
	background-color: #EE82EE
}

.jd-back-AliceBlue {
	background-color: AliceBlue
}

.jd-back-AliceBlue2 {
	background-color: #e6f3ff
}

.jd-back-HoneyDew {
	background-color: HoneyDew
}

.jd-back-Cornsilk22 {
	background-color: #e6ffe6
}

.jd-back-MediumSpringGreen {
	background-color: #00FA9A
}
.jd-back-YellGreen {
	background-color: #bfff00
} {
	background-color: #00FA9A
}
.jd-back-beige2 {
	background-color: #eeeec3
}

.jd-back-Gainsboro {
	background-color: Gainsboro
}

.jd-back-CadetBlue {
	background-color: #5F9EA0
}

.jd-back-LightBlue {
	background-color: LightBlue
}

.jd-back-OldLace {
	background-color: OldLace
}
@media print {
	   .jd-back-OldLace {
		background-color: white; 
	  }
	}

.jd-back-Moccasin {
	background-color: Moccasin
}

.jd-back-NavajoWhite {
	background-color: #FFDEAD
}

.jd-back-PaleGreen {
	background-color: PaleGreen
}
.jd-back-DustyGreen {
	background-color: #476b6b
}
.jd-back-Silver {
	background-color: Silver
}

.jd-back-Linen {
	background-color: Linen
}

/* This is use in ComNEWc good look*/

.jd-back-LightYellow {
	background-color: LightYellow
}
.jd-back-LightRed {
	background-color: ff99ff !important
}
.jd-back-PeachPuff {
	background-color: FFDAB9 !important
}

.jd-back-Azure {
	background-color: Azure
}

.jd-back-Azure2 {
	background-color: #ccffff;
}

.jd-back-PaleGoldenRod {
	background-color: PaleGoldenRod
}

.jd-back-FloralWhite {
	background-color: FloralWhite
}

.jd-back-PaleTurquoise {
	background-color: PaleTurquoise
}

.jd-back-Cerulean {
	background-color: #9BB7D4
}

.jd-back-GreenAsh {
	background-color: #A0DAA9
}

.jd-back-PowderBlue {
	background-color: PowderBlue
}

.jd-back-LemonChiffon {
	background-color: LemonChiffon
}

.jd-back-Khaki {
	background-color: Khaki
}

.jd-back-Coral {
	background-color: #FF7F50
}

.jd-back-Yellow {
	background-color: #FFFF00
}
.jd-back-close2blk {
	background-color: rgb(15,15,15) !important
}
.jd-backDiagBlkpOptmz {
	background: url("/img/DiagBlkpOptmz.jpg") repeat-y center scroll;
	background-size: fixed !important;
}
.jd-back-TwoGreyDarkVert {
	//background: DarkSlateGray url("/img/TwoGreyVertStripeBack.jpg") repeat cover;	
	background-color: darkslategray;
	background-image: url("/img/TwoGreyVertStripeBack.jpg"); 
}
.jd-back-BrownTextureBack {
	/* background: url("/img/TwoGreyVertStripeBack.jpg") cover;	*/
    background-color: darkslategray;
	background-image: url("/img/BrownTextureBack.jpg");
	background-size: repeat-y;
}
.jd-back-PinapplePattern {
	/* background: url("/img/TwoGreyVertStripeBack.jpg") cover;	*/
	/* background-color: darkslategray;*/
	background-image: url("/img/PinapplePatternBackSml.jpg");
	background-repeat: repeat;
}
.jd-back-PinapplePattern {
	background-image: url("/img/PinapplePatternBackSml.jpg");
	background-repeat: repeat;
}
.jd-back-questionMark {
	background-image: url("/img/Backgrnd-FAQ.png");
	/* opacity must be done in image*/
	background-repeat: repeat;
}
.jd-back-StPatsGif {
	background-image: url("/img/StPatsBack.gif");
	background-repeat: cover;
}
.jd-back-Pickleball-Sml{
	background-image: url("/img/PickleballLogo.png");
	background-repeat:  no-repeat;
	background-position: right
}
.jd-backLocomotive {
	background-image: url("/img/LocomotiveWorked.jpg");
	background-repeat: no-repeat;
}
.jd-backMoney {
	background-image: url("/img/Money.jpg");
	background-repeat: repeat;
}
.jd-backMoney60op {
	opacity: 0.30;
	background-image: url("/img/Money.jpg");
	background-repeat: repeat;
}
.jd-backMoney40opctyPNG {
	background-image: url("/img/Money40opacity.png");
	background-repeat: repeat;
}
.jd-backMoney40opcty {
	background-image: url("/img/Money40opacity.jpg");
	background-repeat: repeat;
}
.jd-back-NewsprntVintg {
background-image: url("/img/NewsprintVintage.jpg");

}
.jd-back-NewsprntVintg25 {
background-image: url("/img/NewsprintVintage25.jpg");

}
.jd-back-Roses {
	background-image: url("/img/roses.png");
	background-size: 25%;
	background-repeat: no-repeat;
}

.jd-backDiagPatrn {
	background-image: url("/img/CommentNationBackground.gif");
	background-repeat: repeat;
	opacity: 50%
}

.jd-backWood {
	background-image: url("/img/WoodBackground.png");
	background-repeat: repeat;
	opacity: 100%
}

.jd-JungleCreep1 {
	background-image: url("/img/JungleCreep.png");
	background-size: cover;
	background-repeat: no-repeat;
}

.jd-JungleCreep2 {
	background-image: url("/img/JungleCreep2.png");
	background-size: cover;
	background-repeat: no-repeat;

}

.jd-backStPats {
	background-image: url("/img/NE7.gif");
	background-repeat: cover;
}

.jd-backStPats80 {
	background-image: url("/img/NE7.gif");
	background-repeat: cover;
	opacity: 80%
}
.jd-backVoteOvrBoy{
	background-image: url("/img/VotingOverBoy.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.jd-backFlag {
	background-image: url("/img/AmericanFlagBackground.jpg");
	background-repeat: no-repeat;
}

.jd-backXmas {
	background-image: url("/img/Xmas-Back.jpg");
	background-repeat: repeat;
	background-size: contain;
}

.jd-backXmas2 {
	background-image: url("/img/Xmas-background-fir-branches-balls-twigs.png");
	background-repeat: no-repeat;
	background-size: cover;
}

.jd-backFancyCushion {
	background-image: url("/img/fancy-cushion.png");
	background-repeat: repeat;
	background-size: auto;
}
.jd-backFancyCushionLight {
	background-image: url("/img/fancyCushionLight.jpg");
	background-repeat: repeat;
	background-size: contain;
}
.jd-backFancyCushionOp50 {
	background-image: url("/img/fancy-cushionOp50.png");
	background-repeat: repeat;
	background-size: contain;	
}
.jd-backFAQ {
	background-image: url("/img/FAQback.jpg");
	background-repeat: repeat;
	background-size: contain;
}
.jd-backpadded {
	background-image: url("/img/padded.png");
	/*  opacity:1  */
	background-repeat: repeat;
	background-size: inherit;
}

.jd-backpadded2 {
	background-image: url("/img/padded2.png");
	/*  opacity:1  */
	background-repeat: repeat;
	background-size: inherit;
}
.jd-backPumpkin {
	background-image: url("/img/pumpkin-clipart.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.jd-backPumpkin30opac {
	background-image: url("/img/pumpkin-clipart30.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.jd-backPumpkins {
	background-image: url("/img/halloween-Pumpkins.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.jd-backPumpkins40opac {
	background-image: url("/img/halloween-Pumpkins40opac.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.jd-backTurkey40opac {
	background-image: url("/img/Turkey40opac.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.jd-backHauntedHouse {
	background-image: url("/img/holloween/HauntedHouseBack.jpg");
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: top;
	background-size:  1000px contain;
	background-color: black;
}
/* 	background-image: url("/img/holloween/HauntedHouseBack.jpg");
	background-repeat: no-repeat;
	background-size:  1000px;
	background-color: black;*/
	

.jd-backHauntedHouse2 {
	background-image: url("/img/HauntedHouse2.jpg");
	background-repeat: no-repeat;
	background-size:  contain;
	background-color: black
}
.jd-backHauntedHouse2fade {
	background-image: url("/img/HauntedHouse2.jpg");
	background-repeat: no-repeat;
	background-size:  contain;
	background-color: black;
	animation: fadeout 20s 13s ease-out forwards;
	}	
	@keyframes fadeout {
	  from {opacity: 100;}
	  to {opacity: 0;}
	}

}
/* Eerie black (name colors) */
.jd-backFlag2 {
	background-image: url("/img/AmericanFlagBackground2.jpg");
	background-repeat: no-repeat;
}

.jd-backFlag2sml {
	background-image: url("/img/AmericanFlagBackgroundSmalr.jpg");
	background-repeat: no-repeat;
	background-size: cover
}
.jd-backFlag2smlOp50 {
	background-image: url("/img/AmericanFlagBackgroundSmalrOp50.png");
	background-repeat: no-repeat;
	background-size: cover
}

.jd-backFireworks {
	background-image: url("/img/firework64.gif");
	background-repeat: no-repeat;
	background-size: cover
}

.jd-backPig2 {
	background-image: url("/img/Wild_Boar.png");
	background-repeat: no-repeat;
	background-size: 25%
}

.jd-backSHLogo15 {
	background-image: url("/img/SH-Logo1opac15.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
}

.jd-backSHLogo30 {
	background-image: url("/img/SH-Logo1opac30.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
}
.jd-backSHLogo30dark {
	background-image: url("/img/SH-Logo1opac30.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-color: black;
	background-position: center center;
}//Halloween

.jd-backSHLogo50 {
	background-image: url("/img/SH-Logo1opac50.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
}

.jd-backSHLogo100 {
	background-image: url("/img/SH-Logo1.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
}

.jd-ontop {
	position: relative;
	top: 4.7em;
	text-fill-color: black
}

.jd-backOctbr {
	background-image: url("/img/halloween-jack-o-lantern2.jpg");
	color: #000000;
	font-weight: 600
}

.jd-backTnxgiv {
	background-image: url("/img/Turkey.png");
	background-size: contain;
	background-repeat: no-repeat;
}

/* failed */
.jd-backGatekeeper {
	background-image: url("/img/keeper.gif");
	background-repeat: no-repeat;
	/* 	background-position-x: 50% */

}

.jd-ItalicDkGreenTxt {
	color: darkgreen;
	font-style: italic
}
.jd-ItalicGreenTxt {
	color: green;
	font-style: italic
}
/* .jd-ItalicDkGreenTxt {
	color:  darkgreen;
	font-style: italic
}*/
.whtBack {
	background-color: white;
}

.offwhtBack {
	background-color: #fff1d3;
}

.AntiqueWhiteBack {
	background-color: #faebd7;
}

.blkBack {
	background-color: black ;
}



.pad2em {
	padding: 2em;
}

.pad2emL {
	padding-left: 2em;
}

.pad1em {
	padding: 1em;
}


.jd-BoxShadow1 {
	box-shadow: 10px 10px 5px grey !important
}

.jd-BoxShadow2 {
	box-shadow: 6px 6px 10px grey !important
}

.jd-BoxShadow3 {
	box-shadow: 2px 2px 8px grey !important
}

.jd-BoxShadow4 {
	box-shadow: 0 2px 5px 0 dimgray !important
}
.jd-BoxShadow2Black {
	box-shadow: 6px 6px 10px black !important
}
.jd-container {
	padding: 0.01em 16px
}

.jd-marg1emTop {
	margin-top: 1em
}

.jd-marg1em {
	margin: 1em
}

.jd-marg2em {
	margin: 2em
}

.jd-marg2emTop {
	margin-top: 2em
}

.jd-marg3emTop {
	margin-top: 3em
}

.jd-marg5emTop {
	margin-top: 5em
}

.jd-marg8emTop {
	margin-top: 8em
}

.jd-marg10pTB {
	margin-top: 10px;
	margin-bottom: 10px
}
.jd-marg10pxAll{
	margin: 10px
}
.jd-marg5pxAll{
	margin: 5px!important
}
@media screen and (max-width: 600px) {
	.jd-mediaMarg1emB {
	margin-bottom: 1em !important
	}
}

.jd-padding1em {
	padding: 1em !important
}
.jd-padding1emT {
	padding-top: 1em !important
}
.jd-padding2emT {
	padding-top: 2em !important
}
.jd-pad1emB {
	padding-bottom: 1em !important
}

.jd-pad2emB {
	padding-bottom: 2em !important
}
.jd-padding1emTB {
	padding: 1em 0 !important
}
.jd-padding2emTB {
	padding: 2em 0 !important
}
.jd-padding8 {
	padding: 8px !important
}

.jd-padding2 {
	padding: 2px !important
}
.jd-padding2-4 {
	padding: 0px 12px !important;
}

.jd-padding14 {
	padding: 14px !important
}

.jd-padding2em {
	padding: 2em !important
}
.jd-padding3em {
	padding: 3em !important
}
.jd-padding3emLR {
	padding: 0em 3em !important
}

.jd-padding16pxTB {
	padding: 16px 0 !important
}

.jd-pad3pxB {
	padding-bottom: 3px !important;
}

.jd-pad6pxB {
	padding-bottom: 6px !important;
}

.jd-pad12pxB {
	padding-bottom: 12px !important;
}

.jd-pad25pxB {
	padding-bottom: 25px !important;
}
.jd-pad1emT {
	padding-top: 1em !important
}
.jd-pad1emR {
	padding-right: 1em;
}

.jd-pad1emL {
	padding-left: 1em;
}
.jd-pad2emR {
	padding-right: 2em;
}
.jd-pad2emL {
	padding-left: 2em;
}
.jd-pad3emL {
	padding-left: 3em!important;
}
.jd-pad2pxR {
	padding-right: 2px;
}

.jd-pad2pxL {
	padding-left: 2px;
}

.jd-pad2pxT {
	padding-top: 2px;
}
.jd-pad8pxT {
	padding-top: 8px!;
}
.jd-pad2pxRL {
	padding-right: 2px;
	padding-left: 2px;
}
.jd-pad2emRL {
	padding-left: 2em!important;
	padding-right: 2em!important
}

.jd-padZpxALL {
	padding: 0px !important;
}

.jd-pad5pxALL {
	padding: 5px !important;
}
.jd-pad5pxTB5 {
	padding: 5px 0px 5px !important;
}

.jd-pad8pxR {
	padding-right: 8px;
}

.jd-pad8pxL {
	padding-left: 8px;
}

.jd-pad8prcntR {
	padding-right: 8% !important;
}
.jd-pad5prcntR {
	padding: 4% !important;
}
.jd-pad8prcntL {
	padding-left: 8% !important;
}

.jd-pad8pxRL {
	padding-right: 8px;
	padding-left: 8px;
}

.jd-pad16pxRL {
	padding-right: 16px;
	padding-left: 16px;
}

.jd-pad80pxRL {
	padding-right: 80px;
	padding-left: 80px;
}

.jd-pad10emB {
	padding-bottom: 10em;
}
.jd-pad5emB {
	padding-bottom: 5em;
}
.jd-pad3emB {
	padding-bottom: 3em;
}

.jd-pad16pxTop {
	padding-top: 16px
}

.jd-pad10pxTop {
	padding-top: 10px
}

.jd-padbot0 {
	padding-bottom: 0 !important
}

.jd-padtopNeg {
	padding-top: 0 !important
}

.jd-padTB4Neg {
	padding-top: -8px !important;
	padding-bottom: -8px !important
}

.jd-padT8Neg {
	padding-top: -8px !important;
	
}
.jd-padbotNeg {
	padding-bottom: -1em !important
}
.jd-container {
	padding: 0.01em 8px
}
/* .w3-half,
.w3-third,
.w3-twothird,
.w3-threequarter,*/

.jd-image-phone {
	width: 200px
}
@media (max-width: 600px) {
	.jd-image-phone {
		width:200px!important}
}
.jd-quarter {
	float: left;
	width: 100%
}
.jd-quarter {
	width: 23.5%!important;
	padding: 0 3px	
}
@media (max-width:767px) {
	.jd-quarter {
		width: 47%!important;
		float: left; 
	}
}
@media (max-width:600px) {
	.jd-quarter {
		width: 100%!important
	}
}
/* fails*/
.jd-halfRight {
	float: right;
	width: 100%
}/* fails*/
.jd-halfLeft {
	float: left;
	width: 100%
}/* fails*/

.colCnt2 {
	column-count: 2;
	-webkit-column-count: 2;
	/* Chrome, Safari, Opera */
	-moz-column-count: 2;
	/* Firefox */
}

.colCnt3 {
	column-count: 3;
	-webkit-column-count: 3;
	/* Chrome, Safari, Opera */
	-moz-column-count: 3;
	/* Firefox */
}

/* Creates 2 column text class and converts it to 1 with larger text for phone */
.jd-columnX2 {
	column-count: 2;
	column-gap: 20px;
	-webkit-column-count: 2;
	/* Chrome, Safari, Opera */
	-moz-column-count: 2;
	/* Firefox */
}

@media screen and (max-width: 414px) {
	.jd-columnX2 {
		column-count: 1;
		font-size: larger;
		-webkit-column-count: 1;
		/* Chrome, Safari, Opera */
		-moz-column-count: 1;
		/* Firefox */
	}
}

.jd-columnX3 {
	column-count: 3;
	column-gap: 30px;
	-webkit-column-count: 2;
	/* Chrome, Safari, Opera */
	-moz-column-count: 2;
	/* Firefox */
}

@media screen and (max-width: 414px) {
	.jd-columnX3 {
		column-count: 1;
		font-size: larger;
		-webkit-column-count: 1;
		/* Chrome, Safari, Opera */
		-moz-column-count: 1;
		/* Firefox */
	}
}

@media screen and (max-width: 320px) {
	.jd-textRmvSmlPhn {
		display: none
	}
}

/* Used in refresh-update button depreciated*/

.jd-cell-row {
	display: table;
	width: 100%
}

@media screen and (max-width: 414px) {
	.jd-cell-row {
		display: block;
		font-size: medium;
	}
}

.jd-cell {
	display: table-cell
}

@media screen and (max-width: 414px) {
	.jd-cell {
		display: block;
		font-size: medium;
	}
}

@media only screen and (max-width: 600px) {
  /* For mobile phones: */
  .jd-phone {
	width: 100%;
	padding: none;
	margin: none
  }
}


.cenTxt {
	align-content: center;
}

.NoPad {
	padding: 0;
}

.NoPanel {
	margin-top: 0;
	margin-bottom: 0;
}

.footer1 {
	border-top: 20px #fff1d3
}

.clearUl {
	list-style-type: none;
}

/*
.p1 {
    text-indent: 10px;
}
*/
.jd-p1 {
	text-indent: 10px !important;
}
.jd-p2 {
	text-indent: 15px !important;
}
.jd-p0 {
	text-indent: 0px !important;
}

p0 {
	display: block;
	margin: none;
	text-indent: 10px !important;
}
.jd-hide{
	visibility: hidden;
}
.jd-hideCollapse{
	display: none;
}
.jd-scroll{
	overflow: scroll !important;
	height: 200px;
}
.jd-scroll300{
	overflow: scroll !important;
	height: 300px;
}
.jd-scroll400{
	overflow: scroll !important;
	height: 400px;
}
.jd-scroll500{
	overflow: scroll !important;
	height: 500px;
	overflow-x: hidden;
	  overflow-y: scroll;
	  scroll-snap-type: y mandatory;
		scroll-padding-block: 20px;
	
	padding: 0 10px;
}
.jd-scroll700{
	overflow: scroll !important;
	height: 700px;
	overflow-x: hidden !important;
	 overflow-y: scroll;
	  scroll-snap-type: y mandatory;
		 /*scroll-padding-block: 20px;	
	padding: 0 10px;*/
}
/*https://developer.mozilla.org/en-US/docs/Web/CSS/::-webkit-scrollbar*/
.jd-webkitscroll::-webkit-scrollbar {
	  width: 10px;
	}/* width */	
.jd-webkitscroll::-webkit-scrollbar-track {
	  box-shadow: inset 0 0 3px grey; 
	  border-radius: 10px;
	}/* Track */	
.jd-webkitscroll::-webkit-scrollbar-thumb {
	  background: cadetblue; 
	  border-radius: 10px;
	}/* Handle */
.jd-webkitscroll::-webkit-scrollbar-thumb:hover {
	  background: darkcyan; 
	}/* Handle on hover */

.jd-scroll800{
	overflow: scroll !important;
	height: 800px !important;
}
.jd-scroll1000{
	overflow: scroll !important;
	height: 1000px !important;
}
.jd-scroll2000{
	overflow: auto !important;
	height: 2000px !important;
}
.jd-scrollMarg10{
	scroll-padding-block: 20px;
}
.jd-BorderTop4px {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px
}

.jd-BorderBot4px {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px
}
.jd-Border5px {
	border: 5px !important;
	border-color: antiquewhite !important;
	padding: 5px !important
}
.jd-boxAllLineSquar {
	border: 1px solid gray !important;
	height: auto
}
.jd-boxAllLine {
	border: 1px solid gray !important;
	border-radius: 10px;
	height: auto
}
.jd-boxAllLine350w {
	border: 1px solid gray !important;
	border-radius: 10px;
	height: auto;
	width: 350px

}
.jd-boxAllLineHt150 {
	border: 1px solid gray !important;
	border-radius: 10px;
	box-sizing: border-box;
	height: 150px !important;
	//padding-top: 1em !important;   USE H3 IN FIRST LINE
	padding-bottom: 1em !important;
	overflow: hidden;
}
.jd-boxAllLineHt130 {
	border: 1px solid gray !important;
	border-radius: 10px;
	height: 130px !important;
	//padding-top: 1em !important;   USE H3 IN FIRST LINE
	padding-bottom: 1em !important;
	overflow: hidden;
}
.jd-boxAllLineHt100 {
	border: 1px solid gray !important;
	border-radius: 10px;
	height: 100px !important;
	margin: 10px;
	padding-bottom: 1em !important;
	overflow: hidden;
}
.jd-boxHt350 {House P
	height: 350px !important;
	overflow: auto
}
.jd-boxAllLineHt150blank {//USE AS RIGHT ARTICLE FILLER BLANK
	border: 1px solid transparent !important;
	border-radius: 10px;
	height: 150px !important;	
	padding-bottom: 1em !important;
	overflow: hidden;
}
.jd-boxAllLine1red {
	border: 1px solid firebrick !important;
	border-radius: 10px;
	height: auto
}
.jd-boxAllLine2red {
	border: 2px solid firebrick !important;
	border-radius: 10px;
	height: auto
}
.jd-boxAllLine4redGreenDoubled {
	border: 4px double  !important;
	border-color: red SpringGreen red SpringGreen !important;
	border-radius: 10px;
	height: auto
}
.jd-boxAllLineMed {
	border: 2px solid gray !important;
	border-radius: 10px
}

.jd-boxAllLineBLK {
	border: 2px solid black !important;
	border-radius: 10px
}

.jd-boxAllLineYel {
	border: 3px solid yellow !important;
	border-radius: 10px
}
.jd-boxAllLineOrng {
	border: 3px solid darkorange !important;
	border-radius: 10px
}
.jd-boxAllLineOrng10emRLmarg {
	border: 3px solid darkorange !important;
	border-radius: 10px;
	margin-right: 10em;
	margin-left: 10em
}
.jd-boxAllLineOrng6emRLmarg {
	border: 2px solid darkorange !important;
	border-radius: 10px;
	margin-right: 6em;
	margin-left: 6em
}
.jd-boxAllLineNone500pxh {
	border: 0 !important;
	box-sizing: border-box;
	width: 100%;
	height: 500px;
	padding: 1em
}

jd-boxAllLineNone400pxh {
	border: 0 !important;
	box-sizing: border-box;
	width: 100%;
	height: 400px;
	padding: 1em
}
jd-boxAllLineOneAutopxh {
	border: 1px solid black !important;
	box-sizing: border-box;
	width: 600px;
	height: 50px;
	padding: none
}
.jd-boxAllLine2 {
	border: 8px solid #FF4500 !important;
	border-radius: 66px
}
.jd-boxAllLine3 {
	border: 8px ridge turquoise !important;
	border-radius: 66px
}
.jd-boxAllLine4red {
	border: 8px ridge firebrick !important;
	border-radius: 10px
}
.jd-boxAllLine3rDrk {
	border: 1px solid darkgray !important;
	border-radius: 3px
}
.jd-boxNoLine10r {
	border: 1px solid darkgray !important;
	border-radius: 10px
}
.jd-boxNoLine7r {
	border-radius: 7px !important;
}
.jd-boxAllLineSLOW {
	border-color: orange;
	border-width: .5em;
	border-style: groove;
	border-radius: 2em;
	background-color: yellow
}
.jd-biggerFont {
	font-size: 2em;
	font-weight: bolder;
	line-height: 1
}

.jd-hugeFont {
	font-size: 3em;
	font-weight: bolder;
	line-height: 1
}

.jd-monsterFont {
	font-size: 5em;
	font-weight: bolder;
}
.jd-boxsizingFull {
	box-sizing: border-box;
	width: 200px
}
.jd-boxsizing275 {
	box-sizing: border-box;
	width:45%;
	height: 100px;
	margin-inline: 20px;	
}/* border: 1px solid red;*/
.jd-boxAllLineSq {
	border-color: gray;
	border-width: thin;
	border-style: solid;
}

.jd-boxAllLineSqRED {
	border-color: red;
	border-width: medium;
	border-style: solid;
}

.jd-boxBottomLine {
	border-bottom: solid;
	border-bottom-color: gray;
	border-bottom-width: thin;
}
.jd-boxTopLine {
	border-top: solid;
	border-top-color: gray;
	border-top-width: thin;
}

.jd-boxRightLine {
	border-right: solid;
	border-right-color: grey;
	border-right-width: thin;
}

.jd-textAlignLft {
	text-align: left
}

.jd-displayLeftCentr {
	position: fixed;
	top: 50%;
	left: 0%;
	transform: translate(0%, -50%);
	-ms-transform: translate(-0%, -50%)
}

.jd-displayMiniPageLinkBox30 {
	position: fixed;
	top: 30%;
	right: 0%;
	writing-mode: vertical-lr;
	border-radius: 8px 0px 0px 8px;
	margin: none;
	padding: 4px;
	color: #fff !important;
	background-color: #009688 !important;
}

.jd-displayMiniPageLinkBox30 {
	position: fixed;
	top: 30%;
	right: 0%;
	writing-mode: vertical-lr;
	border-radius: 8px 0px 0px 8px;
	margin: none;
	padding: 4px;
	color: yellow !important;
	background-color: #009688 !important;
}

.jd-displayMiniPageLinkBox50 {
	position: fixed;
	top: 50%;
	right: 0%;
	writing-mode: vertical-lr;
	border-radius: 8px 0px 0px 8px;
	margin: none;
	padding: 4px;
	color: #fff !important;
	background-color: #009688 !important;
}

.jd-displayMiniPageLinkBox50:hover {
	background-color: red !important;
}

.jd-displayMiniPageLinkBox60 {
	position: fixed;
	top: 60%;
	right: 0%;
	writing-mode: vertical-lr;
	border-radius: 8px 0px 0px 8px;
	margin: none;
	padding: 4px;
	color: #fff !important;
	background-color: #009688 !important;
}

.jd-displayMiniPageLinkBox60:hover {
	background-color: red !important;
}

.jd-displayMiniPageLinkBox70 {
	position: fixed;
	top: 70%;
	right: 0%;
	writing-mode: vertical-lr;
	border-radius: 8px 0px 0px 8px;
	margin: none;
	padding: 4px;
	color: #fff !important;
	background-color: #009688 !important;
}

.jd-displayMiniPageLinkBox70:hover {
	background-color: red !important;
}

@media screen and (max-width: 600px) {
	div.jd-mediaScreenHide {
		display: none;
	}
}

.jd-displayLeftCentr2 {
	position: fixed;
	top: 50%;
	left: 0%;
	transform: translate(0%, -50%);
	-ms-transform: translate(-0%, -50%);
	-ms-transform: rotate(-90deg);
	/* IE 9 */
	-webkit-transform: rotate(-90deg);
	/* Safari prior 9.0 */
	transform: rotate(-90deg);
	/* Standard syntax */
}

.jd-displayLeft {
	position: absolute;
	left: 0%;
	transform: translate(0%, -5);
	-ms-transform: translate(-0%, -5%)
}
.jd-displayRight {
	position: absolute;
	right: 0%;
	transform: translate(0%, -5);
	-ms-transform: translate(-0%, -5%)
}

.jd-boxRtTopBot6px {
	border: black;
	border-bottom-right-radius: 6px;
	border-top-right-radius: 6px
}

/* rounds left-only box corners*/

	.jd-print-button{

	background-color: none;
	color: grey;
	border: none;
	cursor: pointer;
}

@media print {
	#printPageButton {
		display: none;
	}
}

.jd-text-red,
.jd-hover-text-red:hover {
	color: red !important;
	cursor: hand !important
}

.jd-fontStyl-SmlGryItal {
	color: rgba(0, 0, 0, 0.5);
	font-style: italic;
	font-size: small
}

.jd-button1:hover {
	color: teal;
	background-color: inherit !important;
	/* PapayaWhip (web colors)#FFEFD5 */
	border-color: red;
	font-style: italic;
	cursor: pointer
}

.jd-button1:active {
	color: red;
	background-color: inherit;
	/* PapayaWhip (web colors)#FFEFD5 */
	font-style: italic;
}

.jd-button0:hover {
	color: red;
}

.jd-button {
	border: none;
	display: inline-block;
	outline: 0;
	padding: 8px 16px;
	vertical-align: middle;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	background-color: white;
	text-align: center;
	cursor: pointer;
	white-space: nowrap
}

.jd-button:hover {
	border: none;
	display: inline-block;
	outline: 0;
	padding: 8px 16px;
	vertical-align: middle;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	background-color: #fbf17d;
	text-align: center;
	cursor: pointer;
	white-space: nowrap
}

.jd-button30 {
	border: none;
	display: inline-block;
	outline: 0;
	//padding: 8px 16px;
	vertical-align: middle;
	overflow: hidden;
	text-decoration: none;
	color: #fdf5e6!important;
	background-color: transparent!important;
	text-align: center;
	cursor: pointer;
	white-space: nowrap
}

.jd-button30:hover {
	border: none;
	display: inline-block;
	outline: 0;
	//padding: 8px 16px;
	vertical-align: middle;
	overflow: hidden;
	text-decoration: none;
	color: red!important;
	background-color: black!important;
	text-align: center;
	cursor: pointer;
	white-space: nowrap
}

.jd-display-bottommiddle {
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translate(-50%, 0%);
	-ms-transform: translate(-50%, 0%);
	background-color: teal !important;
	width: 100%;
	padding: 8px 16px;
	vertical-align: middle;
	text-align: center;
}

.jd-CursrPt {
	cursor: pointer
}



.jd-button2 {
	background-color: #009688;
	font-style: normal;
	color: white;
/* box-shadow: 7px 7px 5px grey !important*/
}

.jd-button2:hover {
	background-color: red;
	font-style: italic;
	cursor: pointer;
	box-shadow: 10px 10px 15px grey !important;
}

.jd-buttonMENU {
	background-color: none;
	font-style: normal;
	color: white;
/* box-shadow: 7px 7px 5px grey !important*/
}

.jd-buttonMENU:hover {
	background-color: none;
	font-style: bold;
	color: lime!important;
	cursor: pointer;
	/* box-shadow: 10px 10px 15px grey !important;*/
}

.jd-button6 {
	background-color: dodgerblue !important;
	font-style: normal;
	color: white !important
}

.jd-button6:hover {
	background-color: red !important;
	font-style: italic;
	cursor: pointer;
	color: white !important
}

.jd-button7 {
	background-color: DarkGreen !important;
	font-style: normal;
	color: white !important
}

.jd-button7:hover {
	background-color: red !important;
	font-style: italic;
	cursor: pointer;
	color: white !important
}

.jd-button80 {
	background-color: DarkGreen !important;
	font-style: normal;
	font-size: small;
	display: inline-block;
	padding-block: 1px 1px;
	margin: 14px 8px;	
	color: white !important
}

.jd-button80:hover {
	background-color: red !important;
	font-style: italic;
	cursor: pointer;
	color: white !important
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/ /* !FIXME:*/
.jd-button3 {
	background-color: LightYellow !important;
	font-style: normal;
	color: white;
	box-shadow: 7px 7px 5px black !important
}

.jd-button3:hover {
	background-color: Yellow !important;
	font-styl: italic;
	cursor: pointer;
	box-shadow: 10px 10px 15px black !important;
	-webkit-transition-duration: 0.8s;
	/* Safari */
	transition-duration: 0.8s;
}
/* !FIXME:Too Many*/
.jd-button3 {      
	background-color: white;
	font-style: normal;
	color: black;
	border-color: grey;
	border-width: thin;
	border-style: solid;
	border-radius: 18px;
}

.jd-button3:hover {
	border-color: #c80000;
	font-style: bold;
	cursor: pointer;
	color: red !important
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-button4: {
	color: #ffffff !important;
	/* 	background-color: teal!important; */
	width: 100%;
	padding: 8px 16px;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
}
.jd-button4:hover {
	color: #000 !important;
	background-color: #ccc !important;
	width: 100%;
	padding: 8px 16px;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-button5 {
	border: 1px solid black !important;
	border-radius: 7px !important;
	cursor: pointer;
	box-shadow: 5px 5px 4px gray,
	-2px -2px 3px  gray inset !important;
	
}		

.jd-button5:hover {
	color: firebrick !important;
	font-style: italic;
	cursor: pointer;
	border: 1px solid red !important;
}

.jd-button5:active {
	color: firebrick;
	font-style: italic;
	box-shadow:-2px -2px 3px  gray inset !important;
	transform: translateY(4px);
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-button8 {
	border: none !important;
	cursor: pointer;
	}		

.jd-button8:hover {
	color: firebrick !important;
	cursor: pointer;
	border: 1px solid red !important;
}

.jd-button8:active {
	color: firebrick;
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-button6 {
	border: 1px solid black !important;
	border-radius: 7px !important;
	cursor: pointer;
	box-shadow: 5px 5px 4px gray,
	-2px -2px 3px  gray inset !important;
	font-size: medium;
	background-color: teal !important;
}		

.jd-button6:hover {
	color: black !important;
	font-style: italic;
	cursor: pointer;
	border: 1px solid red !important;
}

.jd-button56:active {
	color: gray;
	font-style: italic;
	box-shadow:-2px -2px 3px  gray inset !important;
	transform: translateY(4px);
}

/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-btn-group button {
  background-color: white; /* white background */
  border: 1px solid green; /* Green border */
  border-radius: 6px;
  width: 120px;
  height: 120px;
  box-sizing: border-box;
  color: black; /* White text */
  padding: 10px; /* Some padding 24px*/
  Margin: 5px;
  cursor: pointer; /* Pointer/hand icon */
  float: left; /* Float the buttons side by side */
}

/* Clear floats (clearfix hack) */
.jd-btn-group:after {
  content: "";
  clear: both;
  display: table;
}

/* Add a background color on hover */
.jd-btn-group button:hover {
  background-color: Teal;
  color: white;
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-btn-group1 button {
  background-color: lightslategrey; /* white background */
  border: 1px solid red; /* Green border */
  border-radius: 6px;
  width: 100px;
  height: 100px;
  box-sizing: border-box;
  color: white; /* White text */
  padding: 10px; /* Some padding 24px*/
  Margin: 5px;
  cursor: pointer; /* Pointer/hand icon    margin 5px*/
  float: left; /* Float the buttons side by side */
}

/* Clear floats (clearfix hack) */
.jd-btn-group1:after {
  content: "";
  clear: both;
  display: table;
}

/* Add a background color on hover */
.jd-btn-group1 button:hover {
  background-color: darkred;
  color: white;
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-btn-group2 button {
	background-color: rgb(142, 140, 140); /* white background */
	border: 2px solid red; /* Green border */
	border-radius: 6px;
	width: 90%;
	height: 20%;
	box-sizing: border-box;
	color: white; /* White text */
	padding: 10px; /* Some padding 24px*/
	Margin: 10px 10px 10px 23px;
	cursor: pointer;
}

/* Clear floats (clearfix hack) */
.jd-btn-group2:after {
	content: "";
	clear: both;
	display: table;
}

/* Add a background color on hover */
.jd-btn-group2 button:hover {
	background-color: darkred;
	color: white;
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
//display: flex !important;
//color: white !important;
//background-color: teal !important;
/*border-color: gray;
border-width: thin;
border-style: solid;*/

//background-color: white !important;

//background-color: red;

/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-round-large {
	border-radius: 8px
}

/*
.jd-button2:active {
	color:red;
	background-color: #FFF000;
	font-style:italic;
}
*/
/*
.jd-button2:visited {
	color:white;
	background-color: white;
	display: none
}
*/
.jd-text-Blond {
	color: #FAF0BE
}
.jd-text-LightGray {
	color: #D3D3D3
}
.jd-text-DimGray {
	color: #696969
}
.jd-text-Gray {
	color: #808080
}
.jd-text-orange {
	color: darkorange !important
}
.jd-text-redDrk {
	color: #c31a0d !important
}
.jd-text-HotPink {
	color: #FF0099 !important
}
.jd-text-PinkPink {
	color: #FF99FF !important
}
.jd-backLtRed {
	background-color: #ffe3e3
}

.jd-back-LtRed {
	background-color: #ffe3e3
}

.jd-backWhite {
	background-color: white
}

.jd-backAlmostBlack {
	background-color: rgb(9, 9, 4) !important

}

.jd-red {
	background-color: #f44336 !important
}

.jd-back-paleYel {
	background-color: #FFFFCC
}

.jd-back-xtraLightYellow {
	background-color: #ffffe6
}

.jd-back-paleTurq {
	background-color: #AFEEEE
}

.jd-back-hotYel {
	background-color: #FFFF66
}

/* #FFFF66 (hot yellow) */
.jd-back-cadmYel {
	background-color: #FFF600
}

/* Cadmium yellow (name colors) */
.jd-back-infraRed {
	background-color: #FF496C
}

.jd-back-cyan {
	background-color: #22b8cf
}


.jd-back-tealWhtTxt {
	background-color: teal;
	color: white
}

.jd-back-grnWhtTxt {
	background-color: green;
	color: white
}

.jd-lemon {
	background-color: #ffff6d
}

.jd-back-Linen {
	background-color: #FAF0E6
}

.jd-back-Khaki {
	background-color: #F0E68C
}

/* Khaki (web colors) */
.jd-back-GrnYel {
	background-color: #ADFF2F
}

.jd-back-PaleGoldRd {
	background-color: #EEE8AA
}

.jd-back-Cornsilk {
	background-color: #FFF8DC
}

.jd-back-Ivory {
	background-color: #FFFFF0
}
.jd-back-LightIvory {
	background-color: #fcfcf3
}
.jd-back-OldLace {
	background-color: #FDF5E6
}
.jd-back-Bisque {
	background-color: #FFE4C4
}

.jd-back-BlanchedAlmond {
	background-color: #FFEBCD
}

.jd-back-BlanchedAlmond2 {
	background-color: #ffe0b3
}

.jd-back-SkyBlue {
	background-color: SkyBlue
}

.jd-back-Blond {
	background-color: #FAF0BE
}

/* Blond (name colors) */
.jd-back-MintCream {
	background-color: #F5FFFA
}

/* Mint cream (name colors) */
.jd-back-Peach {
	background-color: #FFDAB9
}

.jd-back-LightGrn {
	background-color: LightGreen
}

.jd-back-PaleGreen {
	background-color: PaleGreen
}

.jd-back-seaFoam {
	background-color: #96ceb4
}

.jd-back-MediumAquaMarine {
	background-color: #66CDAA
}

.jd-back-DarkOrange {
	background-color: #FF8C00
}

.jd-back-Magenta {
	background-color: #FF00FF
}

.jd-back-Violet {
	background-color: #EE82EE
}

.jd-back-White {
	background-color: #06342b;
	color: white
}

.jd-back-DarkGrey {
	background-color: #A9A9A9
}
.jd-back-MedGrey {
	background-color: #C8C8C8
}
.jd-back-DarkSlateGray {
	background-color: #2f4f4f
}

.jd-back-grad1 {
	background: linear-gradient(to bottom, #96ceb4 0%, #66ff99 100%);
}

/*no name - */
.jd-back-grad2 {
	background: linear-gradient(to bottom, #DC143C 0%, #228B22 100%);
}
.jd-back-gradRedYel {
	background: linear-gradient(to bottom, #DC143C 0%, yellow 100%);
}

/* ForestGreen (web colors) */
.w3-teal,
.w3-hover-teal:hover {
	color: #fff !important;
	background-color: #009688 !important
}

.jd-fontArtical {
	font-weight: 300;
	line-height: 1.2 !important
}

.jd-fontArtical2 {
	font-weight: 200;
	line-height: 1.1 !important
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-font-LnHt1 {
	line-height: 1 !important
}

.jd-font-LnHt1o5 {
	line-height: 1.5
}

.jd-font-LnHt75 {
	line-height: .75 !important
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/


.jd-font-wt400 {
	font-weight: 400;
	line-height: 1.3;
}

.jd-font-wt600 {
	font-weight: 500;
	line-height: 1.3;
}

.jd-font-wt700 {
	font-weight: 700;
	line-height: 1.3;
}

.jd-font-wtSmal {
	font-weight: small;
	line-height: 1.3;
}

.jd-text-dark-green {
	color: #006400
}
.jd-text-green {
	color: ForestGreen
}
.jd-text-SpringGreen {
	color: SpringGreen
}
/* gold text  */
.jd-text-gold {
	color: #fcc289
}

/* gold text 2 */
.jd-text-gold2 {
	color: #FFD700
}
/* gold text 3*/
.jd-text-gold3 {
	color: #FFCC00
}/* Gold (web colors) */
.jd-text-navy {
	color: navy
}


/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-lineHtsml {
	line-height: 0.8 !important
}

/* .jd-lineHt1 {
	line-height: 1.2 !important
}*/

/* .jd-lineH {
	line-height: 1.7
}*/

/* .jd-lineH1 {
	line-height: 1.4 !important
}*/
.jd-lineH0 {
	line-height: 1 !important
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
 .jd-lineHtsml {
	line-height: 0.8 !important
}
.jd-lineHinh {
	line-height: inherit !important
}
.jd-lineH110 {
	line-height: 110% !important
}
 /* .jd-lineH1 {
	line-height: 120% !important
}*/
.jd-lineH1 {
	line-height: 1.4 !important
}  /* THIS IS BEST∞∞∞∞∞∞∞∞∞∞∞∞∞BEST*/
.jd-lineH120 {
	line-height: 120% !important
}
.jd-lineH20px {
	line-height: 20px !important
}
.jd-lineH22px {
	line-height: 22px !important
}
.jd-lineH25px {
	line-height: 25px !important
}
.jd-lineH125 {
	line-height: 125% !important
}
.jd-lineHt130 {
	line-height: 130% !important
}
.jd-lineH140 {
	line-height: 140% !important
}
.jd-lineH145 {
	line-height: 145% !important
}
.jd-lineH150 {
	line-height: 150% !important
}
.jd-lineH170 {
	line-height: 170%  !important
}
.jd-lineH200 {
	line-height: 200%  !important
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.jd-BiLineName {
	padding: 0;
	text-align: center;
	font-family: Barlow Condensed;
	font-size: small
}

.jd-boldNo {
	font-weight: 100
}

.jd-bold {
	font-weight: 900;
	font-size: large;
	background-color: #66CCCC
}
.jd-bold-back-black {
	font-weight: 900;
	font-size: large;
	background-color: #000000;
	padding: 1px 5px
}
.jd-bold1 {
	font-weight: 800;
}

.jd-bold-BigCream-Shadow {
	color: antiquewhite !important;
	font-size: large;
	text-shadow: 2px 2px 3px black !important;
}

.jd-bold900 {
	font-size: x-large;
	font-weight: 900
}

.jd-keepAll {
	word-break: keep-all !important;
}

.jd-bar .jd-bar-item {
	padding: 5px 8px;
	float: left;
	width: auto;
	display: block
}

.jd-bar1 .jd-bar-item1 {
	padding: 1px 8px !important;
	float: left;
	width: auto;
	display: block;
	border-radius: 15px;
	/*must be here */
	/* 	border-color: teal; */
	color: teal !important;
	border: 1px solid teal !important;
	background-color: white !important;
	margin: 3px !important;
	font-size: small;
	font-weight: 800
}

.jd-bar1 .jd-bar-item1:hover {
	padding: 1px 8px !important;
	float: left;
	width: auto;
	display: block;
	border-radius: 15px;
	/*must be here */
	color: red !important;
	border: 1px solid teal !important;
	background-color: white !important;
	margin: 3px !important;
	font-size: small;
	font-weight: 800;
	font-style: italic;
}

/* .jd-bar2 .jd-bar-item2 {
	padding: 1px 8px !important;
	float: left;
	width: auto;
	display: block;
	 border-radius: 15px	; 
	color: teal !important;
	border: 1px solid teal !important;
	background-color: lightcoral !important; 
	 margin: 3px !important;
	font-size: small;
	font-weight: 800
}
.jd-bar2 .jd-bar-item2:hover {
	padding: 1px 8px !important;
	float: left;
	width: auto;
	display: block;
	 border-radius: 15px	; 
	color: red !important;
	border: 1px solid teal !important;
	background-color: lightcoral !important; 
	 margin: 3px !important;
	font-size: small;
	font-weight: 800;
	font-style:italic;
} FAILED */

.jd-bar .jd-bar-item {
	padding: 5px 8px;
	float: left;
	width: auto;
	display: block
}



.bottombar1 {
	border-bottom: 6px solid #008080 !important
		/* Teal (name colors) */
}

.jd-bottombar2 {
	border-top: 2px solid black !important;
	border-bottom: 2px solid black !important
}


.jd-float-left {
  float: left;
}
.jd-float-right {
  float: right;
}
.jd-margin8 {
	margin: 8px !important
}

.jd-margin5pTB {
	margin-top: 5px !important;
    margin-bottom: 5px !important
}

.jd-margin1 {
	margin: 1px !important
}
.jd-txWrap {text-wrap: balance
	!important
}
.jd-txWrapPrety {text-wrap: pretty
	!important
}
.jd-margin1em {
	margin: 1em !important
}
.jd-margin5em {
	margin: 5em !important
}
.jd-margin1emB {
	margin-bottom: 1em !important
}

.jd-marginTB {
	margin-top: 18px !important
}
.jd-marginTB8 {
	margin-top: 18px !important
}
.jd-marginT10em {
	margin-top: 10em !important
}

.jd-margin-LR30px {
	margin-left: 30px !important;
	margin-right: 30px !important
}

.jd-margin-LR8px {
	margin-left: 8px !important;
	margin-right: 8px !important
}
.jd-margin-LR4px {
	margin-left: 4px !important;
	margin-right: 4px !important
}
.jd-margin-LR10em {
	margin-left: 10em !important;
	margin-right: 10em !important
}
.jd-margin-LR2em {
	margin-left: 2em !important;
	margin-right: 2em !important
}
.jd-margin-bot1em {
	margin-bottom: 1em !important
}

.jd-margin-bot4px {
	margin-bottom: 4px !important
}

.jd-TopBotMargin {
	margin-top: 1em !important;
	margin-bottom: 1em !important
}

.jd-margin-left {
	margin-left: 1em !important
}

.jd-margin-right {
	margin-right: 1em !important
}

.jd-margin-left {
	margin-left: 30px !important
}

.jd-margin-right {
	margin-right: 30px !important
}

.jd-margin-right60 {
	margin-right: 60px !important
}

.jd-textShadow0 {
	text-shadow: none !important
		/* removes text shadow in children */
}

.jd-textShadow1 {
	text-shadow: 3px 1px 2px gray !important
}

.jd-textShadow2 {
	text-shadow: 1px 2px 3px black !important
		/* Aqua (web colors) */
}

.jd-textShadow3 {
	text-shadow: 1px 1px 1px #00FFFF !important
		/* Aqua (web colors) */
}

.jd-textShadow4 {
	text-shadow: 2px 2px 3px #00FFFF !important
		/* Aqua (web colors) */
}

.jd-textShadow5 {
	text-shadow: 2px 2px 3px grey !important
}

.jd-textShadow6 {
	text-shadow: 2px 2px 3px #b07843 !important
}

.jd-textShadow7 {
	text-shadow: 2px 2px 3px #553d26 !important
}

.jd-textShadow8 {
	text-shadow: 1px 1px 1px rgba(245, 56, 56, 0.75) !important
}

.jd-textShadow9 {
	text-shadow: 2px 2px 9px #FF7E00 !important
		/* Amber (SAE/ECE) (name colors) */
}

.jd-textShadow10 {
	text-shadow: 1px 1px 14px #AF002A !important
}

/* Alabama crimson (name colors) */
.jd-textShadow11 {
	text-shadow: 1px 3px 7px #7FFFD4 !important
}

.jd-textShadow12 {
	text-shadow: 2px 2px 3px darkgreen, 0 0 25px black !important
}

.jd-textShadow13 {
	text-shadow: 2px 2px 3px darkorange !important
		/* Aqua (web colors) */
}

/* Aquamarine (web colors) */

.jd-undConstBkgrnd1 {
	background-image: url("/img/Baustelle.svg.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: right center;
}

.jd-beachBackgnd {
	/* SHCH original */
	background-image: url("/img/beach-horizon-cropped2-60o.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -1em;
}

.jd-beachBackgnd1 {
	background-image: url("/img/SunriseBeachOptmz.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -1em;
}

.jd-sunsetBackgnd1 {
	background-image: url("/img/SugarhillSunset1.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -1em;
}

.jd-sunsetBackgnd2 {
	background-image: opacity: 0.4url("/img/SugarhillSunset1.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -1em;

}

.jd-sunRiseBackgnd1 {
	background-image: url("/img/SunriseBeachOptmz.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -1em;
}

.jd-diagBackgnd3 {
	background-image: url("/img/DiagonalBack.jpg");
	background-repeat: repeat;
	background-size: auto;
}

.jd-diagBackgnd4 {
	background-image: url("/img/DiagonalBack3.jpg");
	background-repeat: repeat;
	background-size: auto;
}

.jd-tealBackgnd {
	background-color: #009688;
}

.jd-sandBackgnd {
	background-color: #F6EABE;
	/* Lemon meringue (name colors) */
}

/*
.jd-tealBackgnd {
	background-color: #00968;
	background-size: cover;
	text: teal;
}
*/
.jd-ulSpacing {
	padding-bottom: 18px
}

.jd-ulSpacing4px {
	padding-bottom: 4px;
	list-style-position: outside
}

.jd-ulSpacingO {
	list-style: circle;
	padding-bottom: 18px
}

.jd-ulSpacing[] {
	list-style: square;
	padding-bottom: 18px
}

.jd-ulCircle {
	list-style: circle;
}

.jd-ulBulit {
	list-style: disc;
}

.jd-ulNmbr {
	list-style-type: decimal;
	line-height: 2px
}

.jd-ulNmbr1 {
	list-style-type: decimal;
	line-height: normal
}

.jd-opacity100 {
	opacity: 100 !important;
	filter: alpha(opacity=100) !important;
	/* For IE8 and earlier */
}
.jd-opacity95 {
	opacity: 0.95;
	filter: alpha(opacity=95);
}
.jd-opacity90 {
	opacity: 0.9;
	filter: alpha(opacity=90);
}

.jd-opacity80 {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

.jd-opacity75 {
	opacity: 0.75;
	filter: alpha(opacity=75);
}

.jd-opacity70 {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

.jd-opacity60 {
	opacity: 0.6;
	filter: alpha(opacity=60);
}

.jd-opacity50 {
	opacity: 0.5;
	filter: alpha(opacity=50);
}
.jd-opacity30 {
	opacity: 0.3;
	filter: alpha(opacity=30);
}
.jd-opacity0 {
	opacity: 0;
	filter: alpha(opacity=0);
}

.jd-footer {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 0px 15px !important;
	height: 200px !important;
	background-color: #005c53;
	/*#00827F Teal green (name colors) */
	color: white;
	font-weight: 100;
	font-size: small;
	font-family: sans-serif;
	line-height: 1.5
}

.jd-footerColumns {
	column-count: 3;
	column-gap: 0px;
	column-width: 200px !important;
}

.jd-2Columns {
	column-count: 2;
	column-gap: 0px;
	column-width: 200px !important;
}

.jd-2Columns2 {
	column-count: 2;
	column-gap: 0px;
	column-width: 100% !important;
}

/* failed */

.jd-leftColumn {
	column-width: 200px;
	left: 10;
	align: left
}

.jd-midColumn {
	column-width: 200px;
	center;
}

.jd-RightColumn {
	column-width: 200px;
	right: 80;
}

.jd-97wide {
	width: 97% !important
}

.jd-95wide {
	width: 95% !important
}

.jd-90wide {
	width: 90% !important
}

.jd-85wide {
	width: 85% !important
}

.jd-80wide {
	width: 80% !important
}

.jd-75wide {
	width: 75% !important
}

.jd-70wide {
	width: 70% !important
}

.jd-65wide {
	width: 65% !important
}

.jd-60wide {
	width: 60% !important
}

.jd-55wide {
	width: 55% !important
}

.jd-50wide {
	width: 50% !important
}

.jd-48wide {
	width: 48% !important
}

.jd-45wide {
	width: 45% !important
}

.jd-40wide {
	width: 40% !important
}

.jd-35wide {
	width: 35% !important
}

.jd-30wide {
	width: 30% !important
}

.jd-20wide {
	width: 20% !important
}

@media (max-width: 600px) {
	.jd-97wide {
		width: 100% !important;
		padding: none
	}

	.jd-95wide {
		width: 100% !important;
		padding: none
	}

	.jd-90wide {
		width: 100% !important;
		padding: none
	}

	.jd-85wide {
		width: 100% !important;
		padding: none
	}

	.jd-80wide {
		width: 100% !important;
		padding: none
	}

	.jd-75wide {
		width: 100% !important;
		padding: none
	}

	.jd-70wide {
		width: 100% !important;
		padding: none
	}

	.jd-65wide {
		width: 100% !important;
		padding: none
	}

	.jd-60wide {
		width: 100% !important;
		padding: none
	}

	.jd-55wide {
		width: 100% !important;
		padding: none
	}

	.jd-50wide {
		width: 100% !important;
		padding: none
	}

	.jd-48wide {
		width: 100% !important;
		padding: none
	}

	.jd-45wide {
		width: 100% !important;
		padding: none
	}

	.jd-40wide {
		width: 100% !important;
		padding: none
	}

	.jd-35wide {
		width: 100% !important;
		padding: none
	}

	.jd-30wide {
		width: 100% !important;
		padding: none
	}

	.jd-20wide {
		width: 100% !important;
		padding: none
	}
}

.jd-justifyTxt {
	text-align: justify!important
}
.jd-left-alignTxt {
	text-align: left!important
}

.jd-right-alignTxt {
	text-align: right!important
}

.jd-centerTxt {
	text-align: center!important
}

/* Advanced Image Gallery via Modal*/
/* The Image Box */

/* div.jd-img {
}*/

.jd-img:hover {
	opacity: 0.8;
}

/* The BIG Image */
/* div.jd-img img {
	width: 100%;
	height: auto;
	cursor: pointer;
}*/

 .jd-responsive {
	padding: 2px;
	float: left;
	
}


/* The Modal (background) */
/* .modalX {
	display: none; /* Hidden by default */
	/* position: fixed;*/ /* Stay in place */
	/* z-index: 1; *//* Sit on top */
	/* padding-top: 100px;*/ /* Location of the box */
	/* left: 0;
	top: 0;
	width: 100%;*/ /* Full width */
	/* height: 100%;*/ /* Full height */
	/* overflow: auto; *//* Enable scroll if needed */
	/* background-color: rgb(0,0,0);*/ /* Fallback color */
	/* background-color: rgba(0,0,0,0.9);*/ /* Black w/ opacity */
}*/

/* Modal Content (image) */
/* .modalX-content {
	margin: auto;
	display: block;
	width: 80%;
	max-width: 700px;
}*/

/* Caption of Modal Image */
/* #captionX {
	margin: auto;
	display: block;
	width: 80%;
	max-width: 700px;
	text-align: center;
	color: #ccc;
	padding: 10px 0;
	height: 150px;
}*/

/* Add Animation */
/* .modalX-content, #caption {    
	-webkit-animation-name: zoom;
	-webkit-animation-duration: 0.6s;
	animation-name: zoom;
	animation-duration: 0.6s;
}*/

/* @-webkit-keyframes zoom {
	from {transform:scale(0)} 
	to {transform:scale(1)}
}

@keyframes zoom {
	from {transform:scale(0.1)} 
	to {transform:scale(1)}
}*/

/* The Close Button */
/* .close {
	position: absolute;
	top: 15px;
	right: 35px;
	color: #f1f1f1;
	font-size: 40px;
	font-weight: bold;
	transition: 0.3s;
}

.close:hover,
.close:focus {
	color: #bbb;
	text-decoration: none;
	cursor: pointer;
}*/
/* Clear floats (clearfix hack) */
 .jd-clearfix:after {
  content: "";
  clear: both;
  display: table;
}
/* END OF ADVANCED */


/* Multi Image Modal
https://codepen.io/r3dg3cko/pen/ZLryQG */
/* .modal {
z-index:1;
display:none;
padding-top:10px;
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
overflow:auto;
background-color:rgb(0,0,0);
background-color:rgba(0,0,0,0.8)
}*/
 //controls big pic

/* .modal-content{
margin: auto;
display: block;
	position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}*///controls big centering


/* .modal-hover-opacity {
opacity:1;
filter:alpha(opacity=100);
-webkit-backface-visibility:hidden
}*/

/* .modal-hover-opacity:hover {
opacity:0.60;
filter:alpha(opacity=60);
-webkit-backface-visibility:hidden
}*/


/* .close {
text-decoration:none;float:right;font-size:34px;font-weight:bold;color:white
}*/
/* .container1 {
width:60px;
display:inline-block;
}
.modal-content, #caption {   
  
	-webkit-animation-name: zoom;
	-webkit-animation-duration: 0.6s;
	animation-name: zoom;
	animation-duration: 0.6s;
}*/


/* @-webkit-keyframes zoom {
	from {-webkit-transform:scale(0)} 
	to {-webkit-transform:scale(1)}
}
*/
/* @keyframes zoom {
	from {transform:scale(0)} 
	to {transform:scale(1)}
}
*/
/* END  Multi Image Modal*/




/* /* TabGallery W3schools
https://www.w3schools.com/howto/howto_js_tab_img_gallery.asp*/
* {
  box-sizing: border-box;
}
/* The grid: Four equal columns that floats next to each other */
.column1 {
  float: left;
  width: 65px;
  padding: 5px;
}

/* Style the images inside the grid */
.column1 img {
  opacity: 0.8; 
  cursor: pointer; 
width: 60px;
}

.column1 img:hover {
  opacity: 1;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* The expanding image container (positioning is needed to position the close button and the text) */
.container1 {
  position: relative;
  display: none;
}

/* Expanding image text */
#imgtext {
  position: absolute;
  bottom: 15px;
  left: 15px;
  color: white;
  font-size: 20px;
}

/* Closable button inside the image */
.closebtn {
  position: absolute;
  top: 10px;
  right: 15px;
  color: white;
  font-size: 35px;
  cursor: pointer;
	z-index: 0
}


/*END TabGallery W3schools*/







/* !IMAGE GALLERY */
/* The grid: Four equal columns that floats next to each other */



/* Style the images inside the grid */

/* .column img:hover {
  opacity: 1;
}*/

/* Clear floats after the columns */
/* .row:after {
  content: "";
  display: table;
  clear: both;
}*/

/* The expanding image container */
/* .container {
  position: relative;
  width: 80%;*/ /*added by jd */
 /*  display: none;
}*/

/* Expanding image text  relative puts text under image*/
/* #imgtext {
  position: relative;
  top: 5px;
  left: 15px;
  color: gray
  font-size: 20px;
}*/

/* Closable button inside the expanded image */
/* .closebtn {
  position: absolute;
  top: 10px;
  right: 15px;
  color: gray;
  font-size: 35px;
  cursor: pointer;
}*/

/* !JD-MODAL
USED FOR MANY MODALS - DON'T REMOVE*/
 .jd-modal {
	z-index: 5;
	display: none;
	padding-top: 50px;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0, 0, 0);
	background-color: rgba(0, 0, 0, 0.9)
}

.jd-modal-content {
	margin: auto;
	background-color: #fff;
	position: relative;
	padding: 0;
	outline: 0;
	width: 700px
}/* original 75%*/

.jd-modal-content-N {
	margin: auto;
	background-color: #fff;
	position: relative;
	padding: 0;
	outline: 0;
	width: 250px
}

//MODAL 2 News Stories  BROKE MODAL??
/* .jd-modal2 {
	z-index: 3;
	display: none;
	padding-top: 100px;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0, 0, 0);
	background-color: rgba(0, 0, 0, 0.4)
}

.jd-modal2-content {
	margin: auto;
	background-color: #fff;
	position: relative;
	padding: 0;
	outline: 0;
	width: 75%
}*/
/* This Breaks Modal */



/* more text   https://justmarkup.com/log/2017/01/truncating-and-revealing-text-the-show-more-and-read-more-patterns/*/

.fulltext p,
.less {
	display: none;
}

.fulltext:target p,
.fulltext:target .less {
	display: block;
}


.fulltext:target .more {
	display: none;
}
/* Collapsible/content  used in FAQ and FirstTimeHere on front page*/
/* Collapsible Content https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_collapsible_symbol */
.collapsible1 {
	background-color: ivory;
	color: DimGray;
	cursor: pointer;
	padding: 8px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	font-size: 16px;
}

.active1,
.collapsible1:hover {
	background-color: ivory;
	color: black;
	font-weight: bolder;
}

.collapsible1:after {
	content: '...show more';
	font-style: italic;
	color: gray;
	font-weight: lighter;
	float: right;
	margin-left: 5px;
}

.active1:after {
	content: "...show less";
	font-style: italic;
	color: red;
}

.content {
	padding: 0px 18px 0px 18px;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	background-color: inherit;
}
/*  Collapsible/content 2 used in board.html AnulMeeting.html */
.collapsible2 {
	background-color: teal;
	color: whitesmoke;
	cursor: pointer;
	padding: 6px;
	width: 100%;
	border-radius: 0px 0px 0px 0px;
	border: none;
	text-align: left;
	outline: none;
	font-size: 15px;
}

.active2,
.collapsible2:hover {
	background-color: DarkCyan;
}

.collapsible2:after {
	content: '';
	/* text like more ok \002B*/
	color: whitesmoke;
	font-weight: normal;
	float: right;
	margin-left: 5px;
	
}

.active2:after {
	content: "\2212";
		/*background-color: cadetblue
 text like less ok */
}

.content2 {
	padding: 0 18px;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	 /* background-color: cornsilk;*/
}
/*  Collapsible/content 3 */
.collapsible3 {
	background-color: greenyellow;
	color: black;
	cursor: pointer;
	padding: 8px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	font-size: 15px;
}

.active3,
.collapsible3:hover {
	background-color: lawngreen;
}

.collapsible3:after {
	content: '\002B';
	/* text like more ok */
	color: black;
	font-weight: normal;
	float: right;
	margin-left: 5px;
}

.active3:after {
	content: "\2212";
	/* text like less ok */
}

.content3 {
	padding: 0 18px;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	background-color: cornsilk;
}
/* */
.collapsible4 {
	background-color: inherit;
	color: black;
	cursor: pointer;
	padding: 8px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	font-size: 16px;
}

.active4,
.collapsible4:hover {
	background-color: inherit;
	color: black;
}

.collapsible4:after {
	content: '...show more';
	/* text like more ok \002B*/
	font-style: italic;
	color: FireBrick;
	font-weight: normal;
	float: right;
	margin-left: 5px;
}

.active4:after {
	content: "...show less";
	font-style: italic;
}

.content {
	padding: 0px 18px 0px 18px;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	background-color: inherit;
}
/* */
/* READ MORE READ LESS dummy */
.dummy {

	padding: inherit;
	background: inherit;
	border: none;
	margin-bottom: none;

}

.dummy p {
	font-family: inherit;
	font-size: inherit;
}

.dummy span {
	padding: none;
}

/* ArticleSLIDER */
.carousel1 {
  width: 100%;
  overflow: hidden;
}

.slide1 {
  float: left;
  width: 100%;
}

.article1 {
  width: 100%;
  padding: 1em;
  background-color: #f2f2f2;
}

/* */
/* READ MORE READ LESS codingartistweb.com */
.jd-RMRL{
   background-color: white;
   padding: 5;
   margin: 0;
}
section{
   padding: 10px;
}
/*h1{
   margin: 0 0 15px 0;
   color: black;
   font-size: 28px;
   font-weight: 700;
   font-family: 'Poppins',sans-serif;
   text-transform: uppercase;
   letter-spacing: 1.2px;
}*/
.more{
   display: none;
}
.post{
   color: black;
   font-size: 16px;
   text-align: justify;
   line-height: 18px;
   font-family: 'Work Sans',sans-serif;
}
.post:not(:last-child){
   margin-bottom: 30px;
}
button{
   margin-top: 5px;
   display: block;
   background-color: tan;
   color: black;
   border:none;
   outline: none;
   padding: 4px 10px;
   text-transform: capitalize;
   cursor: pointer;
   font-size: 14px;
}

/* SLIDESHOW1 */
/* SLIDESHOW */
/* SLIDESHOW */
/* SLIDESHOW */
* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
  max-width: 750px;
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.jdSlides {
  display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}
/* END SLIDESHOW1*/
/* END SLIDESHOW*/
/* END SLIDESHOW*/
/* END SLIDESHOW*/

/* SLIDESHOW2 */
/* SLIDESHOW */
/* SLIDESHOW */
/* SLIDESHOW */
* {box-sizing: border-box;}

.slideshow-container {
		position: relative;
		max-width: 1000px;
		margin: auto;
}

.slide {
		display: none;
}

img {
		vertical-align: middle;
}

.fade {
		animation: fade 1.5s;
}

@keyframes fade {
		from {opacity: .4} 
		to {opacity: 1}
}

.prev, .next {
		cursor: pointer;
		position: absolute;
		top: 50%;
		width: auto;
		padding: 16px;
		margin-top: -22px;
		color: white;
		font-weight: bold;
		font-size: 18px;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
}

.next {
		right: 0;
		border-radius: 3px 0 0 3px;
}

.prev:hover, .next:hover {
		background-color: rgba(0,0,0,0.8);
}

.dot {
		cursor: pointer;
		height: 15px;
		width: 15px;
		margin: 0 2px;
		background-color: #bbb;
		border-radius: 50%;
		display: inline-block;
		transition: background-color 0.6s ease;
}

.active, .dot:hover {
		background-color: #717171;
}
/* END SLIDESHOW2*/
/* END SLIDESHOW*/
/* END SLIDESHOW*/
/* END SLIDESHOW*/

.jd-tooltipICON {
	position: relative;
	display: inline-block;
	right: 8px; /*Moves icon closer to the left text*/
}
.jd-tooltipICON .jd-tooltiptextICON {
	visibility: hidden !important;
	 width: 1000%; /*% bigger than the icon for the tip box */
	  top: -100%;
	  right: -500%; 	/* moved to left with lower %*/
	  /*margin-left: -60px; 	60px = (120px/2)*/
	background-color: DimGray;
	color: white;
	text-align: start;
	font-size: medium !important;
	border-radius: 6px;
	padding: 3px 1em;
	position: absolute;
	z-index: 1;	
    opacity: 0;
	transition: opacity 0.3s;
}
.jd-tooltipICON:hover .jd-tooltiptextICON {
	visibility: visible !important;
    opacity: 1;
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
/* JD-TOOLTIP -- TAG UNDERNEATH with no pointer*/
.jd-tooltip {
	position: relative;
	display: inline-block;
	/*   border-bottom: 1px dotted black;     (if you want an indicator in a text block)*/
}
.jd-tooltip .jd-tooltiptext {
	visibility: hidden !important;
	width: 120px;
	  top: 100%;
	  left: 30%; 	/* moved to left with lower %*/
	  margin-left: -60px; 	/*60px = (120px/2)*/
	background-color: #555;
	color: #fff;
	text-align: center;
	font-size: small !important;
	border-radius: 6px;
	padding: 3px 0;
	position: absolute;
	z-index: 1;	
	opacity: 0;
	transition: opacity 0.3s;  
}
.jd-tooltip:hover .jd-tooltiptext {
	visibility: visible !important;
	opacity: 1;
}
/*THIS MAKES THE TAG ARROW if wanted*/
.jd-tooltip .jd-tooltiptext::after {
	content: " ";
	position: absolute;
	bottom: 100%;		/* <-PUTS ARROW AT THE TOP OF THE TAG, CHANGE TO top: 100%; FOR BOTTOM ARROW*/
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
}
/* END ICONED jd-tooltip*/
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.jd-ACoff {
	autocomplete="false"
}

#drop_zone {
	border: 1px solid blue;
	width: auto;
	/*   height: 100px; */
	padding: 1em
}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
/*.top-link {
	  transition: all .25s ease-in-out;
	  position: fixed;
	  bottom: 0;
	  left: 0; //right
	  display: inline-flex;
	   
	 cursor: pointer;
	 align-items: center;
	 justify-content: center;
	 margin: 0 0 13em 0; //changed  from margin: 0 3em 3em 0;
	 //border-radius: 50%;
	 padding: .25em;
	 width: 40px;
	 //height: 80px;
	 //background-color: #F8F8F8;

&.show {
	  visibility: visible;
	  opacity: 1;
	}
	 
&.hide {
	  visibility: hidden;
	  opacity: 0;
	}
	
svg {
		 fill: #000;
		 width: 24px;
		 height: 12px;
		}
		 
		&:hover {
		 background-color: hotpink;//#E8E8E8
		 
			svg {
			 fill: #000000;
			}
		} */
		

#ToTopBtn {
	  display: none; /* Hidden by default */
	  position: fixed; /* Fixed/sticky position */
	  bottom: 210px; /* Place the button at the bottom of the page (was 20) */
	  left: 5px; /* Place the button 30px from the right */
	  z-index: 4; /* Make sure it does not overlap      was 99*/
				//  border: none; /* Remove borders */
				//  outline: none; /* Remove outline */
				//  background-color: red; /* Set a background color */
				//  color: white; /* Text color */
	  cursor: pointer; /* Add a mouse pointer on hover */
	  				//padding: 15px; /* Some padding */
	  				//border-radius: 10px; /* Rounded corners */
	  				// font-size: 18px; /* Increase font size */
					  //background-image: url("/img/ToTop1Cream.svg");
					  //background-size: 100%;
					  //background-repeat: no-repeat;			  
	}
	
	 #ToTopBtn:hover {
		 scale: 1.05;
		 transform: rotate(8deg);
	}
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞INLINE INFO TIP*/
.help-tip{
	
	position: relative;
	display: inline-block;
	top: 18px;
	right: 18px;
	text-align: center;
	background-color: #BCDBEA;
	border-radius: 50%;
	width: 24px;
	height: 24px;
	font-size: 14px;
	line-height: 26px;
	cursor: default;
}

.help-tip:before{
	content: "&#128712;";
	font-weight: bold;
	color:#fff;
}

.help-tip:hover p{
	display:block;
	transform-origin: 100% 0%;

	-webkit-animation: fadeIn 0.3s ease-in-out;
	animation: fadeIn 0.3s ease-in-out;

}

.help-tip p{    /* The tooltip */
	display: none;
	text-align: left;
	background-color: #1E2021;
	padding: 20px;
	width: 300px;
	position: relative;
	border-radius: 3px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
	right: -4px;
	color: #FFF;
	font-size: 13px;
	line-height: 1.4;
}

.help-tip p:before{ /* The pointer of the tooltip */
	position:  relative;
	content: '';
	width:0;
	height: 0;
	border:6px solid transparent;
	border-bottom-color:#1E2021;
	right:10px;
	top:-12px;
}

.help-tip p:after{ /* Prevents the tooltip from being hidden */
	width:100%;
	height:40px;
	content:'';
	position: relative;
	top:-40px;
	left:0;
}

/* CSS animation */

@-webkit-keyframes fadeIn {
	0% { 
		opacity:0; 
		transform: scale(0.6);
	}

	100% {
		opacity:100%;
		transform: scale(1);
	}
}

@keyframes fadeIn {
	0% { opacity:0; }
	100% { opacity:100%; }
}
/* DROPCURTAIN∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
.button-Azure2 {background-color:#ccffff}
.button-Bisque {background-color:#FFE4C4}
.button-PaleGoldenRod {background-color:PaleGoldenRod}
.button-LightCoral {background-color:#F08080}
.button-MediumSpringGreen {background-color:#00FA9A}
.button-beige2 {background-color:#eeeec3}
.button-YellGreen {background-color:#bfff00}
.button-seaFoam {background-color:#96ceb4}
.button-Thistle {background-color:#D8BFD8}
.button-Violet {background-color:#EE82EE}
.button-MediumAquaMarine {background-color:#66CDAA}
.button-SkyBlue {background-color:SkyBlue}
.button-BurlyWood {background-color:#DEB887}

.button-Gainsboro {background-color:#DCDCDC}
.button-WhiteSmoke  {background-color:#F5F5F5}
.button-Ivory {background-color:#FFFFF0}
.button-OldLace {background-color:#FDF5E6}

.dropcurtain {
	  //background-color:  #b0ecf0;
	  color: #444;
	  cursor: pointer;
	  padding: 5px;
	  width: 100%;
	  border-style: solid;
	  border-color: black black transparent black;
	  border-width: 1px;
	  border-radius: 15px 15px 0px 0px;
	  box-shadow: 3px -3px 5px lightgrey;
	  text-align: left;
	  outline: none;
	  font-size: 18px;
	  transition: 0.4s;
	}	
	.active, .dropcurtain:hover {
	  background-color: #FFFACD;
	}	
	.panel {
	  padding: 0 8px;
	  background-color:; //white;
	  border-style: solid;
	  border-color:  transparent black transparent black;
	  border-width: 1px;
	  box-shadow: 3px -3px 5px lightgrey;
	  max-height: 0;
	  overflow: hidden;
	  transition: max-height 0.6s ease-out;
	}
	/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
	/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
	/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
	/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ dropcurtain 2*/
.dropcurtain2 {
	  color: white;
	  cursor: pointer;
	  border-style: none;
	  box-shadow: none;
	  padding: 0px;
	  width: 75%;
	  border-radius: 5px 5px 5px 5px; 
	  background-color: transparent!important;
	  //text-align: center;
	  //outline: transparent;
	  font-size: 18px;
	  transition: 0.4s;
	}	//box-shadow: 3px -3px 5px lightgrey;
	
	.active, .dropcurtain2:hover {
	  color: red !important;
	}	
	.panel2 {
	  //padding: 0 8px;
	  //background-color:; //white;
	  //border-style: solid;
	  //border-color:  transparent;
	  //border-width: 1px;
	  //box-shadow: 3px -3px 5px lightgrey;
	  max-height: 0;
	  overflow: hidden;
	  transition: max-height 0.6s ease-out;
	}	
/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.flip-card {
	  background-color: transparent;
	  width: 600px;
	  height: 300px;
	  perspective: 1000px;
	}
	
	.flip-card-inner {
	  position: relative;
	  width: 100%;
	  height: 100%;
	  text-align: center;
	  transition: transform 0.6s;
	  transform-style: preserve-3d;
	}
	
	.flip-card:hover .flip-card-inner {
	  transform: rotateY(180deg);
	}
	
	.flip-card-front, .flip-card-back {
	  position: absolute;
	  width: 100%;
	  height: 100%;
	  -webkit-backface-visibility: hidden;
	  backface-visibility: hidden;
	}
	
	/* .flip-card-front {
	  background-color: #bbb;
	  color: black;
	}*/
	
	.flip-card-back {
	  opacity: 0;
	  transform: rotateY(180deg);
	}

/* ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/
#dvImage {
	background-repeat: no-repeat;
	background-size:  100%;
	background-attachment: scroll;
	background-position:  top 100%;
	z-index:-1	
}
.zindex100{
	z-index: 100
}
		
/* Validation of form field 
input + span {
  padding-right: 30px;
}

input:invalid+span:after {
  position: relative; content: '✖';
  padding-left: 5px;
  color: #8b0000;
}

input:valid+span:after {
  position: relative;
  content: '✓';
  padding-left: 5px;
  color: #009000;
}*/