@charset "utf-8";
@-o-viewport {
    zoom: 1.0; width: extend-to-zoom;}
@viewport {
    zoom: 1.0; width: extend-to-zoom;}
@-ms-viewport {
	width: extend-to-zoom; zoom: 1.0;}

/*CSS Resets */
body {
	color:#222;
	margin:0 !important;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
html, body {
	height: auto;
}
html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scroll-behavior: smooth;
}
body {
	line-height: 1;
	font-family: Nunito, Calibri, Verdana, sans-serif;
	font-size:16px;
}
ul {
	list-style: square;
	margin:0 2em;
	font-size: 1.2em;
	text-align: left;
}
ul li {
	margin-bottom: .4em;
}
ol {
	list-style:decimal;
	margin-left: 4em;
	text-align: justify;
	line-height: 1.2em;
	max-width: 850px;
	font-size: 1.1em;
	margin:0 auto 2em auto;
}
ol li {
	margin:1em;
}
strong {
	font-weight: 700;
}

.alt-bg, .alt-bg li {
	background: #222;
	color: #FFF;
}

.sticky-menu {
  position: fixed;
  top: 0;
  width: 100%;
  background-color: #333;
  color: white;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease-in-out;
  z-index: 1000;
}

.sticky-menu nav ul.menu {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  justify-content: space-around;
  position: relative;
}

.sticky-menu nav ul.menu > li {
  position: relative;
}

.sticky-menu nav ul.menu > li a {
  color: white;
  text-decoration: none;
  margin: 10px 5px 0 5px;
  display: block;
}

.sticky-menu nav ul.menu > li a:hover {
  background-color: #444;
}

.sticky-menu nav ul.dropdown-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: -100%;
	min-width:max-content;
	background-color: #444;
	padding: 10px;
	list-style: none;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.sticky-menu nav ul.dropdown-menu li {
  border-bottom: 1px solid #555;
}

.sticky-menu nav ul.dropdown-menu li a {
  padding: 10px 15px;
  color: white;
  text-decoration: none;
  display: block;
}

.sticky-menu nav ul.dropdown-menu li a:hover {
  background-color: #555;
}

.sticky-menu nav ul.menu > li:hover .dropdown-menu {
  display: block;
}

.hidden {
  transform: translateY(-100%);
}

blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
:root {
	--main-color: #51aaff;
	--second-color: #ff931e;
	--third-color:  #46b870;
}
.second-color { 
	color: var(--second-color);
}
.third-color { 
	color: var(--third-color);
}


/* Dark Mode Styles */
.dark {
    background-color: #121212 !important; /* Dark background */
    color: #ffffff !important; /* Light text */
    transition: all 0.3s ease-in-out;
}

/* Prevent images and videos from being inverted */
.dark .dark_exempt {
    filter: invert(0) !important;
}
.dark .dark_important {
	filter: invert(1) hue-rotate(180deg) brightness(1.7);
	filter:
}

/* Ensure the sticky menu is always visible in dark mode */
.sticky-menu {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 1); /* Dark menu */
    transition: top 0.3s ease-in-out;
    z-index: 1000;
}

/* Fix menu hiding in dark mode */
.dark .sticky-menu {
    background-color: rgba(30, 30, 30, 1) !important;
}
.dark-mode-btn {
	background: none;
	border:none;
	margin-top:-0.5em;
}

/* Ensure links remain visible */
.dark a {
    color: #ff931e !important; /* Adjusted for contrast */
}
.dark p {
	color:#fff !important;
}
#tagline {
	position: absolute; bottom: 10vh; left:0; right: 0;
}

.error { 
	color: red; text-align: center;
}
.success { 
	color: green; text-align: center; 
}
.grecaptcha-badge { 
	visibility: hidden; 
}
p {
	color:#000;
	max-width:1080px;
	margin:1em auto 0 auto;
	font-size:1.25em;
	line-height: 1.25em;
	text-align:justify;
    -ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;
	-moz-hyphens: auto;
	hyphens: auto;
}
a {
	color: var(--second-color);
	text-decoration: none;
	font-weight: 600;
}
h1, h3, h4, h5, h6 {
	text-transform: uppercase;
}
h1, h2 {
	
}
.tagline, h3, h4, h5, h6 {
	font-family: Nunito, sans-serif;
}
h1 {
	font-size:1em;
	font-style: italic;
	font-weight: 900;
	text-shadow: 0 0 1px #fff, 0 0 2px #fff
}

#logo-splash {
	width: 75%; 
	position: relative; 
	z-index: 100;
}
.tagline {
	max-width: 640px; 
	margin: 0 auto; 
	text-align: center;
}
.content-text {
	padding: 1.5em;
}
.content-text-side {
	width: 50%;
	display: inline-block;
	vertical-align: top;
	margin-top: 4em;
}

.media-vids {
	margin:0 auto;
	position: relative;
	text-align: center;
	background-color: #333;
	}
.media-vids > div {
	max-width: 560px;
	width: 100%;
	display: inline-block;
	margin: 0 auto 2em auto;
	padding:0 2em;
	color: #FFF;
}
.media-vids .iframe-container {
	display: inline-block;
	margin:1em 0;
	text-align: center;
   
}

/* Parent container styling */
.iframe-container {
  position: relative; 
  width: 100%; /* Full width of the parent */
  padding-top: 56.25%; /* Aspect ratio: 16:9 (height / width * 100%) */
  overflow: hidden; /* Hide any overflow */
}

/* Responsive iframe styling */
.iframe-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none; /* Optional: removes iframe border */
}


#faq_questions {
	max-width: 1080px;
	margin:0 auto;
}
#faq_questions p {
	padding:.5em 10%;
	font-size:1.15em;
}
#faq_questions h3 {
	text-transform: none;
	color:#ff931e;
	font-size: 1.5em;
	padding: 1em 1em 0 1em;
	cursor: pointer;
}
#guides_accordion div {
	max-height: 80vh;
	overflow-y: auto;
}


@media all and (max-width: 500px) {
	body {
		font-size: 14px;
	}
	.content-text {
		padding:.5em;
	}
	.content-text-side {
		display: block;
		width: 100%;
		margin: 0 auto;
	}
}
@media all and (max-height: 600px) {
	#logo-splash {
		width: 60%;
	}
	.short-hide {
		display: none;
	}
}