/* apply a natural box layout model to all elements */


/* reset rules */
/* html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
   vertical-align: baseline;
} */

/* HTML5 display-role reset for older browsers */
/* article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
   display: block;
}

html {
   display: flex;
   height: 100%;
}

body {
   background-color: white;
   line-height: 1;
   width: 960px;
   margin: 0 auto;
   font-family: arial, helvetica, sans-serif;
}

ol, ul {
   list-style: none;
}

table {
   border-collapse: collapse;
   border-spacing: 0;
}

a:link, a:visited {
   text-decoration: none;
   color: inherit;
}

a:hover {
   text-decoration: none;
   color: inherit;
}

a:active {
   text-decoration: none;
   color: inherit;
}

body {
   display: flex;
   flex-flow: column nowrap;
   height: 100%;
}

header {
   background-color: white;
   box-shadow: 5px 0 20px #000000, -5px 0 20px rgb(120, 120, 120);    
}

header > img {
   display: block;
   margin: 0 auto;
}

section {
   background-color: white;
   box-shadow: 5px 0 20px #000000, -5px 0 20px rgb(120, 120, 120);   
   flex: 1;
}

section > h1 {
   text-align: center;
   padding-top: 20px;
   font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
   font-size: 2.3em;
   color: rgba(91,155,213,1.00);
   letter-spacing: 0.08em;
}

span.plusminus img {
   display: inline-block;
   width: 30px;
   margin: -5px 30px -5px 10px;
}
dl#faq {
   display: block;
   width: 85%;
   margin: 0 auto;
   padding-bottom: 10px;
   font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
}

dl#faq dt {
   background: url("/images/minus.png") left center/25px no-repeat ;   
   font-size: 1.4em;
   display: block;
   margin: 10px 0 10px;
   text-indent: 60px;
   color: rgba(91,155,213,1.00); 
   cursor: pointer;
   user-select: none;
}




dt + dd {
   display: none;
}

dl#faq dd p {
   font-size: 1.2em;
   line-height: 1.2;
   margin: 0 0 15px 65px;
   font-family: "Gill Sans", Helvetica, Arial, sans-serif;
   text-align: justify;
}

footer {
   background-color: rgba(91,155,213,1.00);
   box-shadow: 5px 0 20px #000000, -5px 0 20px rgb(120, 120, 120);   
   height: 50px;
}
footer p {
   color: ivory;
   text-align: center;
   line-height: 3;

}

footer p span {
   color: #ffab00;
}

footer p em {
   font-family: "Times", "Times New Roman", "serif";
   font-style: italic;
   letter-spacing: 0.08em;
}
 */

 body {
    background-color: #212931; 
 }
 /* General container styling */
section {
   max-width: 1000px;
   margin: 0 auto;
   padding: 20px;
   background-color: #ffffff; /* White background */
   border-radius: 10px;
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
 }
 
 /* Styling for the section title */
 section h1 {
   font-size: 28px;
   font-weight: 600;
   color: #333333; /* Dark grey for the title */
   text-align: center;
   margin-bottom: 20px;
 }
 
 /* Styling for the introductory paragraph */
 section p {
   font-size: 16px;
   color: #555555; /* Medium grey */
   line-height: 1.6;
   text-align: center;
   margin-bottom: 30px;
 }
 
 /* Styling for the description list */
 #faq {
   list-style-type: none;
   padding: 0;
 }
 
 /* Styling for the FAQ question (definition term) */
 #faq dt {
   font-size: 18px;
   font-weight: 600;
   color: #333333; /* Dark grey */
   cursor: pointer;
   background-color: #f2f2f2; /* Light grey background */
   padding: 10px 15px;
   border: 1px solid #ddd; /* Light grey border */
   border-radius: 5px;
   margin-bottom: 5px;
   transition: background-color 0.3s ease;
 }
 
 #faq dt:hover {
   background-color: #212931; /* Brown background on hover */
   color: white; /* White text on hover */
 }
 
 /* Styling for the FAQ answer (definition description) */
 #faq dd {
   font-size: 16px;
   color: #666666; /* Medium grey */
   padding: 10px 20px;
   margin: 0 0 20px 0;
   display: none; /* Hidden by default */
   border-left: 3px solid #18bfef; /* Brown accent line */
   background-color: #f9f9f9; /* Light grey background for answers */
   border-radius: 5px;
 }

 /* dl#faq dt.hiddenAnswer {
   background: url("/images/plus.png") left  no-repeat ;
}   */

/* Styling for the FAQ question (definition term) */
#faq dt {
   font-size: 18px;
   font-weight: 600;
   color: #333333; /* Dark grey */
   cursor: pointer;
   background-color: #f2f2f2; /* Light grey background */
   padding: 10px 15px;
   border: 1px solid #ddd; /* Light grey border */
   border-radius: 5px;
   margin-bottom: 5px;
   transition: background-color 0.3s ease;
   position: relative; /* To position the plus/minus sign */
   padding-left: 40px; /* Space for the icon */
}


#faq dt::before {
   content: "";
   position: absolute;
   left: 10px;
   top: 50%;
   transform: translateY(-50%);
   width: 20px;
   height: 20px;
   background-image: url("/images/plus.png"); /* Path to  plus image */
   background-size: contain;
   background-repeat: no-repeat;
   display: block;
}

/* Change the plus sign to the minus sign when active */
#faq dt.active::before {
   background-image: url("/images/minus.png"); /* Path to  minus image */
   transform: translateY(-50%) rotate(45deg); /* Rotating to form a minus sign */
}

  
 /* Showing the answer when the question is clicked */
 #faq dt.active + dd {
   display: block;
 }
 
 /* Styling for the strong elements (for emphasis) */
 #faq dd strong {
   color: #18bfef; /* Brown color */
 }
 
 /* Responsive behavior */
 @media (max-width: 1024px) {
   section {
     padding: 15px;
   }
 
   section h2 {
     font-size: 24px;
   }
 
   section p {
     font-size: 15px;
   }
 
   #faq dt {
     font-size: 16px;
     padding: 8px 12px;
   }
 
   #faq dd {
     font-size: 14px;
     padding: 8px 18px;
   }
 }
 
 @media (max-width: 768px) {
   section {
     padding: 10px;
   }
 
   section h2 {
     font-size: 22px;
   }
 
   section p {
     font-size: 14px;
   }
 
   #faq dt {
     font-size: 14px;
     padding: 6px 10px;
   }
 
   #faq dd {
     font-size: 13px;
     padding: 6px 15px;
   }
 }
 
 @media (max-width: 480px) {
   section {
     padding: 10px;
   }
 
   section h1 {
     font-size: 20px;
   }
 
   section p {
     font-size: 13px;
   }
 
   #faq dt {
     font-size: 14px;
     padding: 5px 10px;
   }
 
   #faq dd {
     font-size: 12px;
     padding: 5px 12px;
   }
 }

 #copyright {
   color: #212931;
   position: relative;
   color: rgba(255, 255, 255, 0.25);
   cursor: default;
   font-family: "Source Sans Pro", Helvetica, sans-serif;
   font-size: 0.8rem;
   font-weight: 900;
   letter-spacing: 0.075em;
   line-height: 1.5;
   text-align: center;
   text-transform: uppercase;
   margin: 4rem auto 8rem auto;
   width: calc(100% - 4rem);
   max-width: 72rem;
   z-index: 2;
}

   #copyright input, #copyright select, #copyright textarea {
      color: #212931;
   }

   #copyright a {
      color: #212931;
      border-bottom-color: rgba(255, 255, 255, 0.5);
   }

      #copyright a:hover {
         border-bottom-color: transparent;
         color: #18bfef !important;
      }

   #copyright strong, #copyright b {
      color: #212931;
   }

   #copyright h1, #copyright h2, #copyright h3, #copyright h4, #copyright h5, #copyright h6 {
      color: #212931;
   }

   #copyright blockquote {
      border-left-color: #212931;
   }

   #copyright code {
      background: rgba(255, 255, 255, 0.075);
      border-color: #212931;
   }

   #copyright hr {
      border-bottom-color: #212931;
   }

   #copyright a {
      color: inherit;
      border-bottom-color: inherit;
   }

   #copyright ul {
      list-style: none;
      margin: 0;
      padding-left: 0;
   }

      #copyright ul li {
         border-left: solid 2px;
         display: inline-block;
         line-height: 1;
         margin-left: 1rem;
         padding-left: 1rem;
      }

         #copyright ul li:first-child {
            border-left: 0;
            margin-left: 0;
            padding-left: 0;
         }

   @media screen and (max-width: 1280px) {

      #copyright {
         margin: 4rem auto;
      }

   }

   @media screen and (max-width: 480px) {

      #copyright ul li {
         border-left: 0;
         margin: 1rem 0 0 0;
         padding-left: 0;
         display: block;
      }

         #copyright ul li:first-child {
            margin-top: 0;
         }

   }

   #navPanelToggle {
		text-decoration: none;
		-moz-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
		-webkit-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
		-ms-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
		transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
		display: none;
		position: fixed;
		top: 0.75rem;
		right: 0.75rem;
		border: 0;
		color: #ffffff;
		font-family: "Source Sans Pro", Helvetica, sans-serif;
		font-size: 0.9rem;
		font-weight: 900;
		letter-spacing: 0.075em;
		padding: 0.375rem 1.25rem;
		text-transform: uppercase;
		z-index: 10001;
	}

		#navPanelToggle:before {
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			display: inline-block;
			font-style: normal;
			font-variant: normal;
			text-rendering: auto;
			line-height: 1;
			text-transform: none !important;
			font-family: 'Font Awesome 5 Free';
			font-weight: 900;
		}

		#navPanelToggle:before {
			content: '\f0c9';
			margin-right: 0.5rem;
		}

		#navPanelToggle.alt {
			background-color: rgba(255, 255, 255, 0.875);
			box-shadow: 0 0.125rem 0.75rem 0 rgba(30, 37, 45, 0.25);
			color: #212931;
		}

			#navPanelToggle.alt:hover {
				background-color: #ffffff;
			}

		@media screen and (max-width: 980px) {

			#navPanelToggle {
				display: block;
			}

		}

		@media screen and (max-width: 736px) {

			#navPanelToggle {
				font-size: 0.8rem;
				padding: 0.25rem 1rem;
			}

		}

	#navPanel {
		-moz-transform: translateX(20rem);
		-webkit-transform: translateX(20rem);
		-ms-transform: translateX(20rem);
		transform: translateX(20rem);
		-moz-transition: -moz-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;
		-webkit-transition: -webkit-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;
		-ms-transition: -ms-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;
		transition: transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;
		display: none;
		-webkit-overflow-scrolling: touch;
		background: #ffffff;
		box-shadow: none;
		color: #212931;
		height: 100%;
		max-width: 80%;
		overflow-y: auto;
		padding: 3rem 2rem;
		position: fixed;
		right: 0;
		top: 0;
		visibility: hidden;
		width: 20rem;
		z-index: 10002;
	}

		#navPanel .links {
			list-style: none;
			padding-left: 0;
		}

			#navPanel .links li {
				border-top: solid 2px #eeeeee;
			}

				#navPanel .links li a {
					border-bottom: 0;
					display: block;
					font-family: "Source Sans Pro", Helvetica, sans-serif;
					font-size: 0.9rem;
					font-size: 0.9rem;
					font-weight: 900;
					letter-spacing: 0.075em;
					padding: 0.75rem 0;
					text-transform: uppercase;
				}

				#navPanel .links li:first-child {
					border-top: 0;
				}

		#navPanel .close {
			text-decoration: none;
			-moz-transition: color 0.2s ease-in-out;
			-webkit-transition: color 0.2s ease-in-out;
			-ms-transition: color 0.2s ease-in-out;
			transition: color 0.2s ease-in-out;
			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			border: 0;
			color: #909498;
			cursor: pointer;
			display: block;
			height: 3.25rem;
			line-height: 3.25rem;
			padding-right: 1.25rem;
			position: absolute;
			right: 0;
			text-align: right;
			top: 0;
			/*vertical-align: middle;*/
			width: 7rem;
		}

			#navPanel .close:before {
				-moz-osx-font-smoothing: grayscale;
				-webkit-font-smoothing: antialiased;
				display: inline-block;
				font-style: normal;
				font-variant: normal;
				text-rendering: auto;
				line-height: 1;
				text-transform: none !important;
				font-family: 'Font Awesome 5 Free';
				font-weight: 900;
			}

			#navPanel .close:before {
				content: '\f00d';
				font-size: 1.25rem;
			}

			#navPanel .close:hover {
				color: #212931;
			}

			@media screen and (max-width: 736px) {

				#navPanel .close {
					height: 4rem;
					line-height: 4rem;
				}

			}

		@media screen and (max-width: 980px) {

			#navPanel {
				display: block;
			}

		}

		@media screen and (max-width: 736px) {

			#navPanel {
				padding: 2.5rem 1.75rem;
			}

		}

	@media screen and (max-width: 980px) {

		body.is-navPanel-visible #wrapper {
			opacity: 0.5;
		}

		body.is-navPanel-visible #navPanel {
			-moz-transform: translateX(0);
			-webkit-transform: translateX(0);
			-ms-transform: translateX(0);
			transform: translateX(0);
			box-shadow: 0 0 1.5rem 0 rgba(0, 0, 0, 0.2);
			visibility: visible;
		}

	}

   #nav {
		color: #ffffff;
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-transition: -moz-transform 1s ease, opacity 1s ease;
		-webkit-transition: -webkit-transform 1s ease, opacity 1s ease;
		-ms-transition: -ms-transform 1s ease, opacity 1s ease;
		transition: transform 1s ease, opacity 1s ease;
		background: rgba(255, 255, 255, 0.175);
		height: 4rem;
		line-height: 4rem;
		margin: -4rem auto 0 auto;
		overflow: hidden;
		padding: 0 2rem 0 0;
		position: relative;
		width: calc(100% - 4rem);
		max-width: 72rem;
		z-index: 2;
	}

		#nav ul.divided li {
			border-top-color: #ffffff;
		}

		#nav ul.icons li a.icon:hover:before {
			color: #18bfef;
		}

		#nav ul.icons.alt li .icon:before {
			box-shadow: inset 0 0 0 2px #ffffff;
		}

		#nav ul.icons.alt li a.icon:hover:before {
			box-shadow: inset 0 0 0 2px #18bfef;
		}

		#nav input, #nav select, #nav textarea {
			color: #ffffff;
		}

		#nav a {
			color: #ffffff;
			border-bottom-color: rgba(255, 255, 255, 0.5);
		}

			#nav a:hover {
				border-bottom-color: transparent;
				color: #18bfef !important;
			}

		#nav strong, #nav b {
			color: #ffffff;
		}

		#nav h1, #nav h2, #nav h3, #nav h4, #nav h5, #nav h6 {
			color: #ffffff;
		}

		#nav blockquote {
			border-left-color: #ffffff;
		}

		#nav code {
			background: rgba(255, 255, 255, 0.075);
			border-color: #ffffff;
		}

		#nav hr {
			border-bottom-color: #ffffff;
		}

		#nav ul.links {
			display: -moz-flex;
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
			-moz-flex-grow: 1;
			-webkit-flex-grow: 1;
			-ms-flex-grow: 1;
			flex-grow: 1;
			-moz-flex-shrink: 1;
			-webkit-flex-shrink: 1;
			-ms-flex-shrink: 1;
			flex-shrink: 1;
			font-family: "Source Sans Pro", Helvetica, sans-serif;
			font-weight: 900;
			letter-spacing: 0.075em;
			list-style: none;
			margin-bottom: 0;
			padding-left: 0;
			text-transform: uppercase;
		}

			#nav ul.links li {
				display: block;
				padding-left: 0;
			}

				#nav ul.links li a {
					-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
					-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
					-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
					transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
					display: block;
					font-size: 0.8rem;
					outline: none;
					padding: 0 2rem;
				}

					#nav ul.links li a:hover {
						color: inherit !important;
						background-color: rgba(255, 255, 255, 0.1);
					}

				#nav ul.links li.active {
					background-color: #ffffff;
				}

					#nav ul.links li.active a {
						color: #1e252d;
					}

						#nav ul.links li.active a:hover {
							color: #18bfef !important;
						}

		#nav ul.icons {
			-moz-flex-grow: 0;
			-webkit-flex-grow: 0;
			-ms-flex-grow: 0;
			flex-grow: 0;
			-moz-flex-shrink: 0;
			-webkit-flex-shrink: 0;
			-ms-flex-shrink: 0;
			flex-shrink: 0;
			margin-bottom: 0;
		}

		@media screen and (max-width: 980px) {

			#nav {
				display: none;
			}

		}


      #header {
         color: #ffffff;
         -moz-align-items: center;
         -webkit-align-items: center;
         -ms-align-items: center;
         align-items: center;
         display: -moz-flex;
         display: -webkit-flex;
         display: -ms-flex;
         display: flex;
         -moz-flex-direction: column;
         -webkit-flex-direction: column;
         -ms-flex-direction: column;
         flex-direction: column;
         -moz-justify-content: -moz-flex-end;
         -webkit-justify-content: -webkit-flex-end;
         -ms-justify-content: -ms-flex-end;
         justify-content: flex-end;
         pointer-events: none;
         -moz-user-select: none;
         -webkit-user-select: none;
         -ms-user-select: none;
         user-select: none;
         height: 20rem;
         padding-bottom: 8rem;
         position: relative;
         text-align: center;
         z-index: 2;
      }
   
         #header input, #header select, #header textarea {
            color: #ffffff;
         }
   
         #header a {
            color: #ffffff;
            border-bottom-color: rgba(255, 255, 255, 0.5);
         }
   
            #header a:hover {
               border-bottom-color: transparent;
               color: #18bfef !important;
            }
   
         #header strong, #header b {
            color: #ffffff;
         }
   
         #header h1, #header h2, #header h3, #header h4, #header h5, #header h6 {
            color: #ffffff;
         }
   
         #header blockquote {
            border-left-color: #ffffff;
         }
   
         #header code {
            background: rgba(255, 255, 255, 0.075);
            border-color: #ffffff;
         }
   
         #header hr {
            border-bottom-color: #ffffff;
         }
   
         #header .logo {
            -moz-transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out, opacity 0.5s ease, -moz-transform 0.5s ease, visibility 0.5s;
            -webkit-transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out, opacity 0.5s ease, -webkit-transform 0.5s ease, visibility 0.5s;
            -ms-transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out, opacity 0.5s ease, -ms-transform 0.5s ease, visibility 0.5s;
            transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out, opacity 0.5s ease, transform 0.5s ease, visibility 0.5s;
            pointer-events: auto;
            border-style: solid;
            border-color: #ffffff;
            border-width: 5px !important;
            font-family: "Source Sans Pro", Helvetica, sans-serif;
            font-size: 2.25rem;
            font-weight: 900;
            letter-spacing: 0.075em;
            line-height: 1;
            padding: 1rem 1.75rem;
            text-transform: uppercase;
            visibility: visible;
         }
   
            #header .logo:hover {
               border-color: #18bfef !important;
               color: #18bfef !important;
            }
   
         @media screen and (max-width: 980px) {
   
            #header {
               height: 14rem;
               padding-bottom: 4rem;
            }
   
         }
   
         @media screen and (max-width: 736px) {
   
            #header {
               padding-bottom: 3rem;
            }
   
               #header .logo {
                  font-size: 1.75rem;
                  border-width: 3px !important;
               }
   
         }
   