/* Flex Website main Styles
/* v1.2
/* 2025 FEB 09
*/

:root {
	--white: #FFF;
	--dark: rgb(26, 35, 90);
	--bs-card-color: rgb(26, 35, 90);
	--bs-body-color: rgb(26, 35, 90);
	--danger: rgb(188, 1, 23);
	--offwhite: #9EA7A9;
	--gradient-1: linear-gradient(90deg, #079de0, #3aecba);
	--background: #fff;
	--lighten: rgba(255, 255, 255, 0.2);
	--darken: rgba(0, 0, 0, 0.2);
	--indigo-dark-rgb: 72, 12, 170;
	--gold: rgb(209, 158, 7);
	--bs-border-color: transparent;
	--bs-btn-color: white;
	--bs-card-cap-padding-y: 2rem !important;
	--bs-card-cap-padding-x: 1rem !important;
	--bs-breadcrumb-item-active-color: #9EA7A9;
	--bs-list-group-color: #000;
	--primary: #0d6efd;
	--info: #7fbff4;
	--success: #049f30;
	--danger: rgb(188, 1, 23);
	--bs-success-rgb: 71,157,64;
	--bs-danger-rgb: 188, 1, 23;
	--bs-info-rgb: 82,132,204;
	--font-headline: -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
	--font-standard: -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
	--wp--preset--font-family--heading: "Avenir", -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
	--font-awesome: "Font Awesome 6 Pro";
	--card-border-radius: 1.5rem;
	--bg-footer: #0d2148;
	--bs-btn-hover-bg: #DDD;
	--bs-navbar-nav-link-padding-x: 1rem;
	--bs-nav-link-padding-y: 0;
	--bs-nav-link-padding-x: 0;
	--bs-backdrop-opacity:0.65 !important;
	--shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(16, 24, 40, 0.04) 0px 0px 7px 0px;
	--bs-card-spacer-y: 1.25em !important;
	--bs-card-spacer-x: 1.25em !important;
	--bs-card-spacer: 1.25em !important;
	--navbar-height:100px;
	--letter-spacing: -0.01em;
	--border-radius-sm: 0.5em;
	--bs-btn-border-radius: 0.65em;
	--font-headline-letter-spacing: -0.03em;
	--bs-dropdown-item-border-radius: 1rem;
	--border-radius: 1rem;
	--bs-border-radius: 1rem;
	--bs-border-radius-sm: 0.5rem;

}	

/* for accessibility */
@media (prefers-reduced-motion) {
  :root {
    --scale: 0;
  }
}

* {
	text-rendering: optimizeLegibilility;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
}

/* Page */
body {
	font-family: var(--font-standard);
	background-color: #FFFFFF; 
	color: var(--dark);
	line-height: 1.5;
	font-size: 18px;
	font-weight: 400;
	letter-spacing: var(--letter-spacing);
	color-scheme: light dark;
}
.text-normal {
	font-family: var(--font-standard);
	color: var(--dark);
	font-weight: 400;
	letter-spacing: var(--letter-spacing);
	color-scheme: light dark;
}

#page {
	overflow: visible;
	height: auto;
	position: relative;
	display: block;
	padding: calc(var(--navbar-height) + 2rem) 0 0 0;
	min-height: calc(100vh - 300px);
}
#page-content {
	overflow: visible
}
@media print { 
	#page {
		padding: 0 0 0 0;
		zoom: 75%
	}
}
.text-reset,
a > .card-body {
	color: var(--dark) !important;
	font-weight: 400;
}


header .navbar {
	background-size: cover;
	background-position: center bottom;
	align-content: flex-start!important;
	box-sizing: content-box;
	border-radius: 1rem;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	padding: 0.75rem 0.85rem;
	min-height: 50px;
	font-size: 19px !important;
	margin: 2rem 0;
	box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}
header .navbar-light {
	background-color: rgba(255, 255, 255, 0.6);
}
header .navbar-dark {
	background-color: rgba(0, 0, 0, 0.6);
}
.navbar .container-fluid {
	align-self: flex-start;
}

/* to allow for non javascript bootstrap navbar menu */
#navbar-toggle-checkbox:checked ~ .collapse {
    display: block;
}

/* FlexSite Style 1 formatting */

.page-container-1 h1,
.page-container-1 h2,
.page-container-1 h3,
.page-container-1 h4,
.page-container-1 h5,
.page-container-1 h6 {
	text-align: center
}
.page-container-1 .btn, 
header .navbar-container .nav-link,
#footer .btn {
	border-radius: 0.65rem 
}

header .navbar-brand {
	height: 50px;
	content: none;
	display: inline-block;
	padding: 0; /* leave at 0, allows for circular logos, adjust square logos correctly before adjusting this pad */
	overflow: hidden;
	max-width: calc(100vw - 120px); /* to prevent navigation bar overflow */
	margin-right: 0;
}
.nav-pills {
	width: 100%
}
.nav-pills .nav-link {
	border-radius: 0.65rem !important;
	padding: 0.4rem 0.5rem 0.4rem 0.5rem
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {

}
.nav-pills .nav-link:hover {
	background: var(--primary);
	background-color: var(--primary);
	color: white !important;
}
/*
 .nav-pills *[class^="fa-"] {
	top: 0.13em;
	position: relative;
}
*/
.nav-underline .nav-item {
	margin-right: 0.75em
}
.nav-underline .nav-item .nav-link {
	border-radius: 0 !important;
	padding: 0 !important;
	text-decoration: none
}
#nav-sidebar {
	width: 200px;
	line-height: 1
}
#nav-sidebar .btn {
	line-height: 1;
	padding: 0.5rem 0.5rem 0.5rem 0.3rem;
	border: solid 1px transparent;
	outline: solid 1px transparent;
}
#nav-sidebar .btn.active {
	background-color: var(--bs-primary);
	color: white
}
#nav-sidebar .btn.active:hover {
	color: var(--bs-btn-hover-color);
	background-color: var(--bs-btn-hover-bg);
	border-color: var(--bs-btn-hover-border-color);
}
#nav-sidebar .btn:active {
	border: solid 1px transparent;
	outline: solid 1px transparent;
}
#nav-sidebar hr {
	margin: 0.2em 0
}
#nav-sidebar .nav-sidebar-item {
	min-height: 2rem;
	margin-bottom: 0.5rem;
	width: 100%
}
#nav-sidebar li a {
	color: var(--dark);
}
#nav-sidebar li a.active {
	font-weight: 800;
	background-color: rgba(0,0,0,0.075);
	border-radius: 0.5rem;
}
header .navbar-nav .nav-link.dropdown-toggle {
	outline: none !important
}
header .navbar-nav .nav-link {
	font-family: var(--font-headline);
	color: black;
	padding-top: 0.4rem;
	padding-bottom: 0.5rem;
	padding-left:  1rem !important;
	padding-right: 1rem;
	margin: 0;
	font-weight: bold;
	width: auto
}
header .navbar-expand-xl .navbar-nav .nav-link {
	padding-right: 1rem;
	padding-bottom: 0.4rem;
}

header .navbar-light header .navbar-nav .nav-link.active,
.navbar-nav .nav-item.active {
	background-color: rgba(0,0,0,0.1);
}
header .navbar-dark .navbar-nav .nav-link.active {
	background-color: rgba(255,255,255,0.1);
}
header .navbar-nav .nav-link.profile-icon {
	padding-left:  0 !important;
	padding-right: 0 !important;
	padding: 0.25rem !important;
	margin: 0 !important;
	width: auto
}
header .navbar-dark .navbar-nav .nav-link {
	color: white
}
header .navbar-light .navbar-nav .nav-link {
	color: var(--dark);
}
header .navbar-light .navbar-nav .nav-link:hover {
	background-color: var(--darken);
	color: white !important;
	text-decoration: none !important
}
header .navbar-dark .navbar-nav .nav-link:hover {
	background-color: var(--lighten);
	color: white !important;
	text-decoration: none !important
}
.navbar-nav .nav-item {
	border-radius: var(--border-radius-sm);
	margin-right: 0.5em
}
.navbar .dropdown-menu-lg {
	/* width: 30vw;
	min-width: 300px; */
}
.navbar .dropdown-menu {
	max-height: 21em;
	overflow-y: scroll;
	margin-bottom: 1em;
}
header .navbar-toggler {
	border: 0
}
header .navbar-toggler:focus {
	box-shadow: none !important; /* removes box around icon */
	background-color: rgba(255,255,255,0.2);
	padding: 0.35rem;
}

#footer {
	margin-top: 5em;
	width: 100%;
	background-color: rgb(var(--bs-secondary-rgb));
}
#footer-waves {
	box-sizing: content-box !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	position: relative;
	bottom: -1px; /* for some reason there's a gap, get rid of it */
}
#footer,
#footer-container {
	color: white
}
#footer a {
	color: white
}
.container {
	margin: auto
}

.lead {
	font-size: 1.5em;
	font-weight: inherit
}
.display-1, .display-2, .display-3, .display-4, .display-5,
.footer-title{
	font-family: var(--font-headline);
}
.display-1 {
	font-weight: 600;
	font-size: 6rem;
}
.display-2 {
	font-size: 4rem;
}
.display-3 {
	font-size: 3rem;
}
.display-4 {
	font-size: 2rem;
}
.display-5 {
	font-size: 1.5rem;
}
.breadcrumb {
	margin-bottom: 1em;
	font-size: 1.25rem
}
.text-white .breadcrumb-item+.breadcrumb-item::before {
	color: white
}

.jumbotron {
	padding: 2rem;
	margin-bottom: 3rem;
	height: 75vh;
	min-height: 500px;
	background-size: cover;
	background-color: transparent
}

/* text */
h1, h2, h3, h4, h5, .card-title, .display-1, .display-2, .display-3, .display-4, .display-5 {
	margin-top: 0em;
	font-family:  var(--font-headline);
	font-weight: 600;
	letter-spacing: var(--font-headline-letter-spacing);
	line-height: 1.1;
}
h5, .footer-title {
	font-size: 1.4rem;
}
h1 {
	margin-bottom: 0.25em
}
h2, h3, h4, h5, h6 {
	margin-bottom: 0.15em
}

h1, .display-1 {
	line-height: 1 !important;
	font-size: 6.5vw;
	margin-top: 0 !important
}
h2, .display-2 {
	font-size: 3.25rem;
}
h3 {
	font-size: 2rem;
}
h4 {
	font-size: 1.75rem;
}
h5, h6 {
	font-size: 1.5rem;
}
h2, h3, h4, h5,
.display-2, .display-3, .display-4, .display-5 {
	line-height: 1em;
}
h2, h3, h4, h5 {
	margin-top: 3rem
}

/* resets letter spacing for any fs in headers */
h1 div[class^="fs-"],
h2 div[class^="fs-"],
h3 div[class^="fs-"],
h4 div[class^="fs-"],
h5 div[class^="fs-"] {
	letter-spacing: var(--font-headline-letter-spacing);
}

.footer-title {
	font-weight: 600;
	margin-bottom: 0.25em;
	color: white;
}
.lh-1 {
	line-height: 1;
}
.fw-normal {
	font-weight: 400;
}
strong, .fw-bold {
	font-weight: bold
}
.fw-bolder {
	font-weight: bolder !important
}
.fw-heavybold {
	font-weight: 700 !important
}
.fw-extrabold {
	font-weight: 800 !important
}
.fs-smaller {
	font-size: 0.5em
}
.fs-bigger {
	font-size: 1.2em
}
.fs-normal {
	font-size: 1rem !important
}
.text-sm {
	font-size: 0.8rem
}
.ls-normal {
	letter-spacing: var(--letter-spacing);
}


span[class^='text-gradient-'] {
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	font-weight: bold
}
.text-gradient-amber {
	background-image: linear-gradient(90deg, #f79750 25%, #c82c1d 87%);
}
.text-gradient-blue {
	background-image: linear-gradient(90deg, #079de0, #3aecba);
}
.text-gradient-green {
	background-image: linear-gradient(90deg, #3dd875 23%, #0eb3a0 87%)
}
.text-gradient-white {
	background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.75) 23%, rgba(255, 255, 255, 0.5) 87%)
}
.text-orange {
	color: orangered
}
.text-gold {
	color: var(--gold);
}
.text-navy {
	color: rgb(24, 49, 83) !important;
}
.text-white {
	color: white !important
}
a:hover .text-white {
	color: red !important
}
.bg-gold {
	background-color: var(--gold);
}
.badge {
	z-index: 999;
	position: relative;
	top: -0.05em;
	padding-top: 0.55em;
	padding-bottom: 0.55em;
	display: inline-flex;
	width: auto;
	align-items: center;
}
.bg-background {
	background-color: var(--background);
}
.bg-footer {
	background-color: var(--bg-footer) !important;
}
.bg-black {
	background-color: black
}
.bg-indigo, .btn-indigo {
	background-color: rgb(var(--indigo-dark-rgb)) !important;
	color: white
}
.bg-indigo-subtle, .btn-indigo-subtle {
	background-color: rgba(var(--indigo-dark-rgb),0.5) !important;
	color: white
}
.bg-cover-small {
	background-size: cover;
	background-position: center center;
	background-color: lightgray
}
.bg-info {
	color: white
}
.bg-section-1 {
	background-color: rgba(var(--secondary), 0.4);
}
.btn {
	font-weight: bold;
}
.btn-xl {
	/* for large call-to-action */
	font-size: 2rem;
	font-weight: 700;
	padding-left: 2rem;
	padding-right: 2rem;
}

.btn-white {
	background-color: white;
	color: var(--bs-primary);
}
.btn-white:hover {
	background-color: var(--bs-blue) !important;
	color: white !important;
	opacity: 1
}

.btn-light a,
.btn-light {
	color: var(--dark);
}
.btn-close {
	background-color: transparent;
	border: 0;
	position: absolute;
	right: 0;
	top: 0;
	color: white;
	font-size: 2rem;
	opacity: 0.8;
	background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFF'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/23px auto no-repeat
}
.btn-close:hover {
	opacity: 1
}
.nav-link .btn {
	color: white;
	font-weight: bold;
	display: inline-flex;
	align-items: center;
	padding: 0.5rem 0;
	background-color: transparent;
	border: 0;
}
.nav-link,
.btn,
.wp-element-button {
	line-height: 1.5;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border-radius: 5rem;
	display: inline-block
}

.btn-sm {
	
}
.btn-toggle::after {
	font-family: var(--font-awesome) !important;
	content: '\f0da' !important;
	font-size: 20px;
	opacity: 0.6;
	position: relative;
	right: -0.2em;
	display: inline-block;
}
.btn-toggle[aria-expanded="true"] {
	/* color: rgba(0, 0, 0, .85); */
}
.btn-toggle[aria-expanded="true"]::after
{
	-webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
	transform-origin: 50% 50%;
}

.btn-white.btn-toggle:hover::after {
	filter: none;
}
.btn-toggle-nav a {
	display: inline-flex;
	padding: 5px 9px;
	margin-top: 5px;
	margin-left: 20px;
	color: white;
	font-weight: 500;
	width: calc(100% - 20px);
}
.btn-toggle-nav a [class^='fa-'] {
	font-size: 1.1em;
	margin-top: 0.13em
}

.btn-outline-danger:hover {
	color: white !important
}


.nav-link .btn:hover, .nav-link .btn-toggle-nav a:hover, .nav-link .btn-toggle-nav a:focus {
	background-color: var(--darken);
	color: white !important
}

.btn-wide {
	padding-left: 5em !important;
	padding-right: 5em !important;
}

/* for wordpress media popup editing */
.media-router button,
.media-router button.media-menu-item {
	color: var(--dark) !important;
	font-weight: bold !important
}

.bg-lighten {
	background-color: var(--lighten);
}
.bg-indigo-dark {
	background-color: rgb(var(--indigo-dark-rgb));
}
.bg-cover {
	min-height: 900px;
	background-size: cover;
	background-position: center center;
	padding: 300px 0 0 0; /* this provides a buffer against any of the interior content, if we dont include this then a long title will oclude the background image  */
}

.bg-hero h1 {
	color: rgba(255,255,255,0.4);
}

.bg-hero {
	background-color: rgba(0,0,0,0.25);
	background: linear-gradient(to bottom, transparent 0%, transparent 40%, black 100%);
	position: relative;
	display: block;
	filter: contrast(1.2);
	background-size: cover;
	background-position: center center;
	padding: 200px 0 10vw 0; /* this provides a buffer against any of the interior content, if we dont include this then a long title will oclude the background image  */
	color: white;
	overflow: hidden;
	z-index: -9
}
.bg-blurred-1, .bg-blurred-yellow {
	background-image: url("/assets/images/gradients/gradient-1.png");
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat
}
.bg-blurred-yellow {
	background-image: url("/assets/images/gradients/gradient-yellow.png");
}
.nav-link {
	font-weight: 600;
	border-radius: var(--border-radius-sm);
	height: auto
}
.dark-overlay {
	background-color: rgba(0, 0, 0, 0.5);
	background: linear-gradient(transparent 5%, rgba(0,0,0,0.5) 90%);
}
.opacity-100-hover:hover {
	opacity: 1 !important
}
.opacity-75 {
	opacity: .75
}
.opacity-50 {
	opacity: .5
}
.opacity-25 {
	opacity: .25
}

/* cards */
.card {
	border: none;
	border-radius: var(--card-border-radius);
	box-shadow: rgba(103, 113, 133, 0.1) 0rem 0rem 1rem 0rem;
	margin-bottom: 1.5rem;
}
.card-body {
	padding: var(--bs-card-spacer);
}
.modal-backdrop.show {
	opacity: 0.7 !important;
}
.modal-content {
	box-shadow: 0 0 20vw rgba(0, 0, 0, 1);
}
.card-footer, .card-header,
.modal-footer, .modal-header {
	background-color: rgba(0, 0, 0, 0.1);
	font-weight: bold;
	padding: 0.85rem 1rem !important;
	font-size: 1rem;
	border: none;
}
.card-footer, .modal-footer {
	background-color: rgba(0, 0, 0, 0.05);
}

.card-header:first-child {
	border-radius: calc(var(--card-border-radius) - .2em) calc(var(--card-border-radius) - .2em) 0 0;
}
.card-footer:last-child {
	border-radius: 0 0 calc(var(--card-border-radius) - .2em) calc(var(--card-border-radius) - .2em);
}
.card-img-top {
	border-radius: calc(var(--card-border-radius) - .2em) calc(var(--card-border-radius) - .2em) 0 0 !important
}
.card-hover:hover {
	color: var(--dark);
	background-color: rgba(0, 0, 0, 0.023);
	cursor: pointer
}
.card-dark {
	background-color: rgba(255, 255, 255, 0.05);
}
.card-horizontal .card-img-top {
	border-radius: var(--card-border-radius) 0 0 var(--card-border-radius);
	width: 50%
}

.card .card-title {
	margin-top: 0 !important;
	font-size: 1.35rem;
	font-weight: 700
}
.popover-header {
	margin: 0 !important
}
.round, .round img {
	border-radius: 100% !important
}
.round .wp-element-caption {
	text-align: center;
	padding: 0;
	margin: 1rem 0.5rem 2rem 0.5rem
}

/* forms */
input,
textarea,
.form-control,
.form-select,
.tinymce-container {
	font-size: 1.05em;
	padding: 1.5rem 1rem;
	min-height: 3rem;
	font-weight: bold;
	color: black;
	background-color: #FFF;
	border: solid 1px #AAA;
	border-radius: var(--bs-border-radius)
}
input[type=checkbox],
input[type=radio] {
	min-width: 1rem;
	min-height: 1rem;
}
.form-select,
select {
	padding: 0 2rem 0 0.7rem;
	line-height: 2;
	color: var(--dark);
}
.input-group-lg input, 
.input-group-lg textarea,
.input-group-lg .form-control {
	font-size: 1.75em;
	min-height: calc(1.75em + 1rem + calc(var(--bs-border-width) * 2));
}
.input-group .btn {
	border-radius: 1.5rem
}
::placeholder {
	color: rgba(0, 0, 0, 0.2) !important;
}
input:active,
textarea:active,
input:focus,
textarea:focus,
.form-control:focus {
	background-color: white;
	box-sizing: border-box;
	border-color: #66afe9;
	outline: none !important;
	outline-width: 2px !important;
	box-shadow: inset 0 0 0 .25rem rgba(13,110,253,.25);
}
.form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label {
	color: rgb(204, 204, 204);
}
::placeholder {
	color: rgba(0,0,0,0.3) !important
}
.input-group-text {
	background-color: #CCC;
	font-size: 2.5rem;
	width: 4rem;
	text-align: center;
}
.input-group-text span {
	margin: auto
}

.form-check-input {
	border-radius: 100% !important;
	background-color: white;
	background: white;
	border: none;
	padding: 0;
}
.form-check-input:checked {
	background: var(--bs-form-check-bg-image);
	background-repeat: no-repeat;
	background-position: center center;
	border: none;
	background-color: var(--success);
}
.form-floating > .form-control, .form-floating > .form-control-plaintext, .form-floating > .form-select {
	min-height: calc(4rem + calc(var(--bs-border-width) * 2));
}
.form-floating>label {
	padding: 1em .75rem;
}
.form-floating>label,
label {
	font-weight: 600;
	font-size: 16px;
	color: rgb(204, 204, 204);
	background-color: transparent
}
.input-group-sm .btn {
	border-radius: var(--bs-border-radius-sm);
}
.input-group-lg>.form-floating >label {
	font-size: 1.5em;
}
.input-group-lg>.form-floating>.form-control:focus~label,
.input-group-lg>.form-floating>.form-control:active~label,
.input-group-lg>.form-floating>.form-control:not(:placeholder-shown)~label {
	font-size: 16px;
}
/*
.input-group-lg .form-floating>.form-control::placeholder {
	opacity: 0
} */
.input-group>.form-control, .input-group>.form-floating, .input-group>.form-select {
	overflow: hidden
}
.form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after {
	background-color: transparent;
}
.form-floating > input::placeholder,
.form-floating > textarea::placeholder,
.form-floating > select::placeholder {
	color: transparent  !important
}
.form-floating>label {
	z-index: 99
}
.fade-in, .fade-in-1, .fade-in-2, .fade-in-3, .fade-in-4, .fade-in-5, .fade-in-6, .fade-in-7, .fade-in-8, .fade-in-9, .fade-in-10 {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.6s ease-out, transform 1.2s ease-out;
	will-change: opacity, visibility;
}
.fade-up {
	transform: translateY(500px);
	opacity: 0;
	transition: 2.5s all ease;
}

.fade-in.active,
.fade-in-1.active, .fade-in-2.active, .fade-in-3.active, .fade-in-4.active, .fade-in-5.active, .fade-in-6.active, .fade-in-7.active, .fade-in-8.active, .fade-in-9.active, .fade-in-10.active {
	opacity: 1;
  	transform: none;
  	visibility: visible;
}

.fade-up.active,
.fade-up-1.active, .fade-up-2.active, .fade-up-3.active, .fade-up-4.active, .fade-up-5.active, .fade-up-6.active, .fade-up-7.active, .fade-up-8.active, .fade-up-9.active, .fade-up-10.active {
	transform: translateY(0);
	opacity: 1;
}

.fade-in-1 {	transition: 1s all ease; }
.fade-in-2 {	transition: 2s all ease; }
.fade-in-3 {	transition: 3s all ease; }
.fade-in-4 {	transition: 4s all ease; }
.fade-in-5 {	transition: 5s all ease; }
.fade-in-6 {	transition: 6s all ease; }
.fade-in-7 {	transition: 7s all ease; }
.fade-in-8 {	transition: 8s all ease; }
.fade-in-9 {	transition: 9s all ease; }
.fade-in-10 {	transition: 10s all ease; }

.fade-up-1 {	transition: 1s all ease; }
.fade-up-2 {	transition: 2s all ease; }
.fade-up-3 {	transition: 3s all ease; }
.fade-up-4 {	transition: 4s all ease; }
.fade-up-5 {	transition: 5s all ease; }
.fade-up-6 {	transition: 6s all ease; }
.fade-up-7 {	transition: 7s all ease; }
.fade-up-8 {	transition: 8s all ease; }
.fade-up-9 {	transition: 9s all ease; }
.fade-up-10 {	transition: 10s all ease; }




.list-group-item {
	background-color: transparent;
	border: 1px solid rgba(0, 0, 0, .125);
}
.text-large-hero {
	font-size: 20vw;
	margin: auto
}
*[class^="fa-"] {
	width: 1.1em;
	text-align: center;
	display: inline-block;
	margin-right: 0.4em;
}
/* for headers */
h1 *[class^="fa-"],
h2 *[class^="fa-"],
h3 *[class^="fa-"],
h4 *[class^="fa-"],
h5 *[class^="fa-"] {
	width: auto;
	text-align: start;
	display: inline-block;
	margin-right: 0.25em
}
.fa-stack {
	width: 2.1em
}
.fa-stack *[class^="fa-"] {
	width: 100%
}
blockquote {
	font-family: var(--font-headline);
	position: relative;
	color: rgba(0, 0, 0, 0.5);
	display: block;
	font-weight: 600;
	letter-spacing: 0em;
	font-size: 2rem !important;
	width: 65%;
	margin: 5rem auto;
	line-height: 1.1;
	opacity: 0.8
}
blockquote::before, blockquote::after {
	font-family: var(--font-awesome);
	content: '\f10e';
	font-size: 6rem;
	color: var(--light);
	position: absolute;
	top: -1rem;
	font-weight: 800
}
blockquote::before {
	left: -1em;
	transform: scaleX(-1);
}
blockquote::after {
	right: -1em;
	bottom: 0rem
}
.blockquote-footer {
	color: rgba(0, 0, 0, 0.5);
	font-size: 1.5rem !important
}
video {
	width: 75%;
	margin: auto;
	height: auto;
	background-color: lightgray;
}
.wp-element-caption {
	font-size: 0.8em;
	color: rgba(0, 0, 0, 0.5);
	text-align: center
}
.wp-block-gallery {
	/* we have to do this as it's stupidly difficult just to make a block in WP a container, within a container fluid block */
	max-width: 1320px;
	margin: auto;
	left: 1.5rem; /* to centre properly */
}
#platform-alert {
	margin: 0;
	padding: 0;
	margin-bottom: -1em;
	opacity: 1;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: 1.2s;
}
.alert {
	font-weight: 500;
	border: 0;
	padding: 1.5rem 4rem 1.5rem 2rem;
	/* border-radius: 0; */
	font-size: 1.3rem
}
.alert-danger {
	background-color: var(--danger);
	color: white;
}
.alert-danger a { 
	color: white !important;
	font-weight: bolder
}
.alert-danger a:hover { 
	color: black !important;
}

.alert-success {
	background-color: rgba(var(--bs-success-rgb),1);
	color: white
}
.alert-info {
	background-color: rgba(var(--bs-info-rgb),1);
	color: white
}
.alert-light {
	background-color: rgba(var(--bs-light-rgb),1);
	color: var(--dark);
}

.alert {
	border: none;
	border-radius: var(--border-radius-md);
	font-size: 1.3rem;
	margin-bottom: 1rem;
	font-weight: 500;
	display: block;
	align-items: center;
	padding: .75rem 1rem .75rem 0
}
.alert h1, .alert h2, .alert h3, .alert h4, .alert h5 {
	color: inherit !important;
	display: block
}
.alert strong {
	font-weight: bold !important 
}

.alert.alert-danger {
	background-color: var(--danger) !important;
	color: #FFF
}
.alert.alert-danger::before {
    content: "\f071";
}
.alert.alert-success,
.bg-success {
	background-color: #39d05b !important;
	color: #FFF
}
.bg-success-dark {
	background-color: #238339 !important;
}
.alert.alert-success::before {
    content: "\f058";
}
.alert.alert-info {
	background-color: #1eade0 !important;
	color: #FFF !important
}
.alert.alert-warning::before {
	content: "\f05a";
}
.alert.alert-light::before,
.alert.alert-info::before,
.alert.alert-secondary::before {
    content: "\f05a";
}
.alert.alert-promo::before {
    content: "\f762";
	
}
.alert.alert-danger::before,
.alert.alert-warning::before,
.alert.alert-success::before,
.alert.alert-info::before,
.alert.alert-light::before,
.alert.alert-secondary::before,
.alert.alert-promo::before {
    font-family: var(--font-awesome);
	font-size: 1.5rem;
	font-weight: 700;
	position: absolute;
	left: 0;
	top: 0;
	background-color: rgb(0,0,0,.4);
	height: 100%;
	padding: 10px;
	color: #fff;
	border-radius: calc(var(--border-radius-md) - 1px) 0 0 calc(var(--border-radius-md) - 1px);
}
.alert.alert-danger,
.alert.alert-warning,
.alert.alert-success,
.alert.alert-light,
.alert.alert-info,
.alert.alert-secondary,
.alert.alert-promo {
	padding-left: 60px
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes fadeOut {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

.navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgb%28 0,0,0 %29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='3' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}
.navbar-dark .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgb%28 255,255,255 %29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='3' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}
.navbar-toggler span {
	display: block;
	height: 5px;
	width: 33px;
	margin-top: 5px;
	margin-bottom: 5px;
	position: relative;
	left: 0;
	opacity: 1;
	transition: all 0.35s ease-out;
	transform-origin: center left;
    border-radius: 10px;

}
.navbar-toggler span:nth-child(1) {
	margin-top: 0.3em;
}
.navbar-toggler:not(.collapsed) span:nth-child(1) {
	transform: translate(15%, -33%) rotate(45deg);
}
.navbar-toggler:not(.collapsed) span:nth-child(2) {
	opacity: 0;
}
.navbar-toggler:not(.collapsed) span:nth-child(3) {
	transform: translate(15%, 33%) rotate(-45deg);
}
.navbar-toggler span:nth-child(1) {
	transform: translate(0%, 0%) rotate(0deg);
}
.navbar-toggler span:nth-child(2) {
	opacity: 1;
}
.navbar-toggler span:nth-child(3) {
	transform: translate(0%, 0%) rotate(0deg);
}

.navbar-icon {
	font-size: 28px;
	width: 49px;
	text-align: center;
	margin: 0 6px 0 0;
}
.nav-link:hover .navbar-icon {
	font-weight: 800
}
.nav-link {
	width: 100%;
}
.nav-link .btn {
	padding: 10px 10px 10px 0;
	width: 100%
}

.navbar .btn-close {
	padding: 17px
}

.overflow-scroll-y {
	overflow-y: scroll
}

.mb-0 {
	margin-bottom: 0 !important	
}
.vh-75 {
	height: 75vh!important;
}
a, .text-link, .list-group-item-action,
.accordion-button {
	color: var(--bs-primary);
	outline: none !important;
	font-weight: bold;
	text-decoration: none;
}
a:hover,
a:hover div,
a.text-link:hover,
.text-link:hover,
.accordion-button:hover,
.clickable:hover,
a.link-dark:hover,
.pe-link:hover { 
	color: rgb(var(--bs-danger-rgb)) !important;
	cursor: pointer !important;
}
tr.clickable:hover {
	background-color: var(--bs-primary-bg-subtle)!important;
}
.text-hover-dark:hover,
.text-hover-dark:hover div,
.text-hover-dark:hover span {
	color: var(--dark) !important
}
.accordion-button {
	font-size: 1.2em
}
.accordion-button:not(.collapsed) {
	background-color: var(--bg-theme);
}
.cf-turnstile {
	/* for cloudflare captcha positioning */
	min-height: 65px;
	text-align: center
}
.cf-turnstile #content {
	border-radius: 1em !important;
}
.cf-turnstile iframe {
	width: 100% !important
}
 a:hover .icon {
	font-weight: 800
}
a:focus-visible,
.nav-line:focus-visible {
	outline: none !important;
	border-color: transparent!important;
  	-webkit-box-shadow: none !important;
 	 box-shadow: none !important;
}
header .navbar-fixed-bottom header .navbar-collapse, header .navbar-fixed-top header .navbar-collapse {
    max-height: none;
}

.dark-overlay,
.white-overlay {
	height: 100%;
	width: 100%;
	display: block;
	position: absolute !important;
	top: 0;
	left: 0;
	z-index: 99
}

.blockquote-footer {
	margin-top: 1em
}

.dropdown-menu a {
	color: var(--dark) !important;
	font-weight: bold
}
.dropdown-menu {
	border-radius: var(--border-radius);
	padding: 1rem 0;
	background-color: white;
	color: black;
	border: 0;
	min-width: 300px;
	box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
	font-size: 1rem
}
.dropdown-menu-wide {
	min-width: 500px;
}
.dropdown-menu-right {
	right: 0;
	left: auto !important;
}
.dropdown-item:focus, .dropdown-item:hover {
	background-color: transparent;
	color: var(--danger) !important;
}
.dropdown-item:hover a {
	text-decoration: underline
}
.dropdown-divider {
	border-top: 1px solid rgba(255, 255, 255, 0.23);
}
.dropdown-menu .card {
	flex-direction: row;
	background-color: transparent;
	margin-bottom: 0;
}
.dropdown-menu .card.card-body {
	padding: 0.5em
}
.dropdown-menu .card .card-title {
	font-size: 1.3rem;
	font-weight: bold;
	margin-bottom: 0;
	line-height: 1.1
}
.dropdown-menu .card:hover {
	background-color: var(--lighten);
}
.dropdown-toggle,
.dropdown-toggle:hover,
.dropdown-toggle:active,
.dropdown-toggle:focus-visible,
.dropdown-toggle .show:focus-visible,
.show:focus-visible {
	outline: none !important;
	border: none !important;
}
.dropdown-toggle::after {
	font-family: var(--font-awesome) !important;
	content: '\f0da' !important;
	font-size: 20px;
	border: 0;
	position: absolute;
	opacity: .65;
	line-height: 1.6 !important;
}
header .navbar .nav-item .dropdown-toggle::after {
	line-height: 1.4
}
.profile-link .dropdown-toggle::after {
	line-height: 1.9;
}
.dropdown-toggle.show::after {
	transform: rotate(90deg);
    transition: all .3s ease-out;
}
.nav-link.dropdown-toggle,
.dropdown-toggle {
	padding-right: 1.4rem !important;
}
.dropdown-menu a:hover, .dropdown-menu a:hover, .dropdown-item:hover {
	color: red !important
}
.profile-link .dropdown-toggle {
	padding: 0.1rem 1.5rem 0.1rem 0.75rem !important;
}
.profile-link .profile-link-text {
	position: relative
}
.round {
	border-radius: 100%;
}

header .navbar-container {
	background-color: rgba(var(--colour-theme-rgb),0.85);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}
#hero {
	z-index: 0;
	overflow: hidden
}
#hero h1 {
	color: rgba(255,255,255,0.75)
}
#footer {
	background-color: rgb(var(--colour-theme-rgb));
}

h1, h2, h3, h4, h5, h6 {
	color: rgb(var(--colour-theme-header-rgb));
}

.bg-section-1 {
	background-color: var(--colour-theme-subtle-rgb);
}

.prevent-select {
	/* prevents dirty selecting of text */
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

.table-responsive {
	overflow-x: scroll
}

table th {
	background-color: var(--bs-gray-300) !important;
}

table tr.even td {
	background-color: var(--bs-gray-100) !important;
}
.table>:not(caption)>*>* {
	background-color: transparent
}
.btn-active:hover {
	background-color: lightgray !important
}
.btn-nohover:hover {
	background-color: transparent !important
}

/*== FORMATTING OF DATES ============*/
.datetime-calendar {
	padding: 0;
	text-align: center;
	overflow: hidden;
	border-radius: 0.5em;
	width: 7em;
    margin: auto;
    font-size: 1.05rem;
}
.datetime-calendar .datetime-calendar-date,
.datetime-calendar .datetime-calendar-year {
	padding: 0.2em 0 0 0.1em;
	font-weight: bold;
	color: #FFF;
	background-color: var(--danger);
	font-size: 1.55em;
	line-height: 1.2;
}
.datetime-calendar .datetime-calendar-time {
	font-weight: 700;
	color: #343a40;
	font-size: 1.45em;
	padding: 0.3em .1em .4em .1em;
	background: rgba(255,255,255,0.75);
	line-height: 1
}
.datetime-calendar .datetime-calendar-year {
	background-color: var(--dark);
	font-size: 2em;
}
.datetime-calendar .datetime-calendar-day {
	font-weight: bold;
	font-size: .7em
}
.datetime-calendar.datetime-calendar-sm {
	font-size: 0.6rem;
}
.datetime-calendar.datetime-calendar-lg {
    font-size: 1.5rem;
}

/* The switch - the box around the slider */
.switch_container {
	display: table;
	margin: 0;
	padding: 0;
	position: relative;
	line-height: 0;
	width: 100%;
	text-align: inherit;
	padding-right: 60px;
	height: 2em
}
.switch_tag {
	display: table-cell;
	padding-left: 0.5rem;
	top: -0.3rem;
	position: relative;
	vertical-align: middle;
}

.switch input {display:none;} /* Hide default HTML checkbox */

/* The slider */
.slider {
  	position: absolute !important;
  	top: 0 !important;
  	left: 0 !important;
  	right: 0 !important;
  	bottom: 0 !important;
  	background-color: #ccc !important;
  	-webkit-transition: .1s !important;
  	transition: .1s !important;
	opacity: 1 !important;
	width: 60px !important;
	height: 34px !important;
	line-height: 1.3 !important;
}
.slider:hover{
	cursor: pointer !important;
}
.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .1s;
  transition: .1s;
}

input:checked + .slider {
  background-color: #95df85 !important;
}
.slider:after {
    content: '\f00d';
	right: 38px;
}
input:checked + .slider:after,
.slider:after {
	font-weight: 900;
	font-size: 19px;
	color: #666;
	font-family: var(--font-awesome);
	position: absolute;
	bottom: 0.25em;
	transition: opacity 2s linear;
	transform: translate(0);
	opacity: 1;
	left: 0.6em
}  

input:checked + .slider:after {
	content: '\f00c';
	right: 7px;
	left: auto !important;
} 
input:focus + .slider {
  box-shadow: 0 0 1px #95df85 !important;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px) !important;
  -ms-transform: translateX(26px) !important;
  transform: translateX(26px) !important;
}

/* Rounded sliders */
.slider.sliderround {
	border-radius: 2em !important;
}

.slider.sliderround:before {
	border-radius: 2em !important;
}
.anchor {
	/* used to account for the navbar height and jumping to #anchors */
	display: inline-block;
	height: var(--navbar-height);
	margin-top: calc(-1 * var(--navbar-height));
	z-index: -999
}
.disabled {
	opacity: .3;
}
.grid-size {
	display: none
}
.dropdown-menu hr,
#nav-sidebar hr {
	margin: 0.5rem 0 !important
}
hr {
	opacity: 0.5;
	border-top: 2px solid #e4e4e4;
	margin: 2rem 0 !important
}

.parallax-mirror {
	top: -10px !important /* cleans the top missing bar section as we overflow in the js to prevent tearing */
}

.is-vertically-aligned-top {
	vertical-align: top;
}

/* to handle wordpress bootstrap oddities with rounded images */
.rounded-1 img {
	border-radius: var(--bs-border-radius);
}
.rounded-2 img {
	border-radius: var(--bs-border-radius-md);
}
.rounded-3 img {
	border-radius: var(--bs-border-radius-lg);
}
.rounded-4 img {
	border-radius: var(--bs-border-radius-xl);
}
.rounded-5 img {
	border-radius: var(--bs-border-radius-xxl);
}

.ui-sortable-handle:hover {
	cursor: grab
}

@media (prefers-color-scheme: dark) {
  	.email {
  		color: white;
	}
	.email > .text-muted	{
		color: rgba(255,255,255,0.5) !important
	}
	.email > hr {
		 border-top: 2px solid #FFFFFF;
	}
	.email > .card-body {
		background-color: transparent
	}
}

pre {
	margin-top: 200px;
	margin-bottom: 100px
}

a:hover {
  transition: transform 0.25s ease-out;
}
.btn:hover {
	text-decoration: none !important
}