
:root {
	--font-base: 'Inter', sans-serif;
	--font-heading: 'Inter', sans-serif;
	/* Drawer Menu */
	--drawerColourAccent: rgba(0,0,0,0.1); /* Lines, close button etc. */
	--drawerColourBackground: #fff;
	--drawerColourText: #666;
	--drawerColourLink: #555;
	--overlayColour: rgba(0,0,0,0.8); /* Background property for overlays */

	--top-sticky-offset-sm: 1rem;
	--top-sticky-offset-md: 1rem;
	--top-sticky-offset-lg: 6rem;
	--top-sticky-offset-xl: 10rem;

	--border-radius: 1.25rem;

	--light-green: #f2efa6;
	--ice: #edf3f5;
}

/**
* Base Styling
*/

body {
	font-family: var(--font-base);
	overflow-x: hidden;
	line-height: 1.7;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
	font-family: var(--font-heading);
}

h1 small, .h1 small,
h2 small, .h2 small,
h3 small, .h3 small,
h4 small, .h4 small,
h5 small, .h5 small,
h6 small, .h6 small {
	color: var(--primary);
	display: inline-block;
	transform: translateY(.8rem);
	font-size: 50%;
}

h5 {
	font-size: 1.3rem;
	font-weight: 600;
}

a {
	transition: all .2s;
}

em {
	font-weight: 600;
	font-style: normal;
	color: var(--primary);
}

img { max-width: 100%; height: auto; }
iframe { max-width: 100%; }

ul > li ul { list-style-type: circle; }
ol > li > ol { list-style-type: lower-alpha; }
ol > li > ol > li > ol	{ list-style-type: lower-roman; }

/* Site List Marker */

section li::marker {
	color: var(--primary);
}

/* Basic Blockquote */

blockquote {
	font-size: 130%;
	font-weight: 300;
	font-style: normal;
	color: var(--dark);
	line-height: 1;
}

blockquote {
	padding: .8rem 1.4rem;
	margin-left: 1rem;
	margin-right: 1rem;
	margin-bottom: 3.5rem;
	line-height: 1.3;
	border-left: 10px solid var(--primary);
	max-width: 900px;
}

blockquote p {
	line-height: 1.3;
}

blockquote *:last-child {
	margin-bottom: 0;
}

/* Site Columns (Readability) */

@media (min-width: 1200px) {
	.columns {
		columns: 2;
		column-gap: 2rem;
	}

	.columns:not(:last-child) {
		margin-bottom: 2rem;
	}

	.columns p,
	.columns div {
		break-inside: avoid-column;
	}
}

/* Container Widths (Narrower) */

.narrow-width,
.standard-width {
	margin-left: auto;
	margin-right: auto;
}

.narrow-width {
	max-width: 900px;
}

.standard-width {
	max-width: 1200px;
}

/* Section Background Image */

.bg-image {
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* Section Parallax Effect */


.bg-parallax {
	background-attachment: fixed;
}

@supports (-webkit-touch-callout: none) {
	.bg-parallax {
		background-position: center;
		background-attachment: initial;
	}
}

/* Buttons */

.btn {
	transition: all .2s;
}

.btn:hover,
.btn:focus {
	transform: scale(1.1);
	outline: 1rem solid var(--primary);
	animation: pulse-outline 1.25s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
	outline: 1rem solid var(--secondary);
}

.btn-danger:hover,
.btn-danger:focus,
.btn-outline-danger:hover,
.btn-outline-danger:focus {
	outline: 1rem solid var(--danger);
}

.btn-success:hover,
.btn-success:focus,
.btn-outline-success:hover,
.btn-outline-success:focus {
	outline: 1rem solid var(--success);
}

.btn-dark:hover,
.btn-dark:focus,
.btn-outline-dark:hover,
.btn-outline-dark:focus {
	outline: 1rem solid var(--dark);
}

.btn-light:hover,
.btn-light:focus,
.btn-outline-light:hover,
.btn-outline-light:focus {
	outline: 1rem solid var(--light);
}

@keyframes pulse-outline {
	0% {
		outline-width: 0;
	}
	80%, 100% {
		outline-color: transparent;
	}
}

@keyframes pulse-outline-2 {
	0% {
		outline-offset: 0;
	}
	80%, 100% {
		outline-color: transparent;
		outline-offset: 1rem;
	}
}

.btn {
	display: inline-flex;
	align-items: center;
}

.btn-sm {
	padding-top: .1rem;
	padding-bottom: .1rem;
}

.btn svg {
	width: 20px;
	margin-left: 1rem;
}

.btn-sm svg {
	width: 17px;
}

.btn .rect {
	fill: var(--dark);
}

.btn .arrow,
.btn-primary .arrow {
	fill: var(--primary);
}

.btn-secondary .rect {
	fill: #fff;
}

.btn-secondary .arrow {
	fill: var(--secondary);
}

.btn-sucecss .arrow {
	fill: var(--success);
}

.btn-info .arrow {
	fill: var(--info);
}

.btn-danger .arrow {
	fill: var(--danger);
}

.btn-warning .arrow {
	fill: var(--warning);
}

.btn-light .arrow {
	fill: var(--light);
}

.btn-dark .rect {
	fill: var(--primary);
}

.btn-dark .arrow {
	fill: var(--dark);
}


/* Social Icons */

a.social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	--aspect-ratio: 1 / 1;
	aspect-ratio: 1 / 1;
	width: 2rem;
	background-color: var(--primary);
	color: var(--light) !important;
	border-radius: 5rem;
}

a.social-icon:not(:last-child) {
	margin-right: .35rem;
}

a.social-icon:hover,
a.social-icon:focus {
	background-color: #f0a109;
	text-decoration: none;
	color: var(--light);
	outline: 1rem solid #f0a109;
	animation: pulse-outline 1.25s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
}

a.social-icon svg {
	width: auto;
	height: auto;
	max-width: 60%;
	max-height: 60%;
	line-height: 0;
}

a.social-icon svg * {
	fill: #fff !important;
}


/* Site Header */

header.main {
	position: absolute;
	top: 0;
	width: 100%;
	transition: all .2s ease-in-out;
	border-bottom: 1px solid transparent;
	color: #fff;
	z-index: 10;
}

header.main.text-invert {
	color: #333;
}

header.main:hover,
header.main.squid-sticky-active,
header.main.bottom-border {
	background-color: #fff;
	border-bottom-color: #ccc;
	color: inherit;
}

header.main .container {
	position: relative;
}

@media (min-width: 1440px) {
	header.main .container {
		max-width: 1900px;
	}
}


/* Sticky Header */

@media (min-width: 1200px) and (min-height: 800px) {
	header.main {
		position: fixed;
		top: 0;
	}
}


/* SVG Logo Styling */

header.main .logo {
	display: inline-block;
	padding: 2rem 0rem 1rem;
	width: 200px;
}

header.main .logo svg {
	width: auto;
	max-width: 100%;
	height: auto;
}

header.main .logo .letters path {
	fill: #fff;
	transition: all .2s ease-in-out;
}

header.main .logo .lines path {
	fill: transparent;
	transition: all .2s ease-in-out;
}

header.main:hover .logo .letters path {
	fill: #121212;
}
header.main:hover .logo .line-purple {
	fill: #a17ad3;
}
header.main:hover .logo .line-gold {
	fill: #f8be4e;
}
header.main:hover .logo .line-red {
	fill: #e45245;
}
header.main:hover .logo .line-green {
	fill: #b2c442;
}

header.main.text-invert .logo .letters path {
	fill: #333;
}

/* Scrolled / Sticky Combination */

@media (min-width: 1200px) and (min-height: 700px) {
	header.main.squid-sticky-active {
		background-color: #fff;
	}
	/* SVG Logo Styling */
	header.main.squid-sticky-active .logo .letters path {
		fill: #121212;
	}
	header.main.squid-sticky-active .logo .line-purple {
		fill: #a17ad3;
	}
	header.main.squid-sticky-active .logo .line-gold {
		fill: #f8be4e;
	}
	header.main.squid-sticky-active .logo .line-red {
		fill: #e45245;
	}
	header.main.squid-sticky-active .logo .line-green {
		fill: #b2c442;
	}
}


/* Site Search Bar */
/* Search Bar (One Line / Collapsible) */

.search-toggle input {
	border-color: #fff;
	transition: all .3s;
}

.search-toggle:not(.visible) input {
	width: 0;
	padding: 0;
	border-width: 0;
}

.search-toggle.visible input {
	width: 100%;
}

.search-toggle-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.search-toggle.visible .search-toggle-overlay {
	pointer-events: none;
}


/**
* Main Dropdown Menu
*/

/* Site effect while interacting with menu */
.unblur > *:not(header):not(.notifications):not(.sticky-confines),
.unblur .sticky-confines > *:not(header):not(.notifications) {
	transition: filter .3s;
}

.blur > *:not(header):not(.notifications):not(.sticky-confines),
.blur .sticky-confines > *:not(header):not(.notifications) {
	filter: blur(4px) grayscale(80%);
}

@media (min-width: 1200px) {
	.blur header.main {
		position: absolute;
	}
}

.ddmenu {
	position: unset;
	display: flex;
	align-items: stretch;
	z-index: 9;
}

.ddmenu nav {
	display: none;
}

.ddmenu nav ul {
	display: inline-flex;
	align-items: stretch;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ddmenu nav li {
	display: inline-flex;
	align-items: stretch;
}

.ddmenu nav div.nav-item {
	display: flex;
	align-items: stretch;
}

.ddmenu nav a {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	padding: 1rem 1.5rem;
	line-height: 1.2;
	text-decoration: none;
	transition: all .2s ease;
	font-size: 18px;
	font-weight: 600;
	color: inherit;
}

.ddmenu nav a:hover,
.ddmenu nav a:focus,
.ddmenu nav a.active {
	text-decoration: none;
}

.ddmenu nav a span {
	position: relative;
}

.ddmenu nav a span::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 1px;
	display: block;
	width: 0;
	height: 3px;
	background-color: #fff;
	transition: all .2s ease-in-out;
}

.ddmenu nav a:hover span::after,
.ddmenu nav a:focus span::after,
.ddmenu nav a.active span::after,
.ddmenu nav > ul > li:hover > div > a span::after {
	width: 80%;
}

.ddmenu nav ul ul a span::after {
	height: 2px;
}

header.main:hover .ddmenu nav a span::after,
header.main.squid-sticky-active .ddmenu nav a span::after,
header.main.text-invert .ddmenu nav a span::after {
	background-color: #373d42;
}

.ddmenu nav a .arrow-down {
	margin-left: .5rem;
}

/* Level 1 Link ONLY */

.ddmenu nav > ul > li > div a:hover,
.ddmenu nav > ul > li > div a:focus,
.ddmenu nav > ul > li:hover > div > a {
	color: inherit;
}

/* Level 2+ Default State */

.ddmenu nav li li {
	display: flex;
	flex-direction: column;
	align-self: baseline;
	flex: 0 0 25%;
}

@media (min-width: 1440px) {
	.ddmenu nav li li {
		flex: 0 0 20%;
	}
}

.ddmenu nav > ul > li > ul {
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: flex-start;
	width: 100%;
	max-width: 1440px;
	border-top: 1px solid #ccc;

	min-width: 350px;
	background-color: #fff;
	padding-top: 3rem;
	padding-bottom: 2rem;

	/* Styles for transition / hover */
	position: absolute;
	top: 150%;
	transform: translateX(-50%);
	left: -10000px;
	pointer-events: none;
	opacity: 0;
	transition: opacity .3s, top .3s, left 0s ease-in-out .3s; /* transition OUT, left position to remove from viewport entirely MUST be done last after the transition */
}

.ddmenu nav > ul > li > ul::after {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	display: block;
	width: 100vw;
	height: 100%;
	background-color: inherit;
	border-bottom: 1px solid #ccc;
	z-index: -1;
}

/* Show / Visibility of Level 2 */

.ddmenu nav > ul > li:hover > ul {
	top: 100%;
	left: 50%;
	transition: opacity .3s, top .3s, left 0s ease-in-out 0s;
	pointer-events: all;
	opacity: 1;
}

/* Level 2+ Link Styling */

.ddmenu nav li > ul a {
	padding: 1rem .5rem;
}

.ddmenu nav li > ul a:hover,
.ddmenu nav li > ul a:focus,
.ddmenu nav li > ul a.active,
.ddmenu nav ul ul li:hover > div > a {
	text-decoration: none;
}

.ddmenu nav > ul > li > ul > li > div a {
	text-transform: uppercase;
	font-weight: 800;
	font-size: 1rem;
}

/* Show / Visibility of Level 3 */

.ddmenu nav > ul > li > ul > li {
	margin-bottom: 2rem;
}

.ddmenu nav > ul > li > ul > li > ul {
	display: flex;
	flex-direction: column;
}

.ddmenu nav > ul > li > ul > li > ul li {
	flex: 0 0 100%;
	width: 100%;
}

.ddmenu nav > ul > li > ul > li > ul a {
	padding: .3rem .5rem;
	font-weight: 400;
	font-size: 16px;
}

.ddmenu nav > ul > li > ul > li > span a {
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 700;
	padding: .7rem .5rem .3rem;
	color: #555;
}


/* Responsive Menu Toggle Buttons */

.ddmenu-toggler,
.ddmenu .close-btn {
	visibility: hidden;
	pointer-events: none;
	font-size: 1.2rem;
	display: none;
	position: relative;
}

.ddmenu .submenu_toggler {
	display: none;
	visibility: hidden;
}

@media (min-width: 1200px) {
	.ddmenu nav {
		display: flex;
		align-items: stretch;
	}

	.ddmenu [data-squidyToggle] {
		display: none;
	}
}


/**
* Carousel (Slideshow)
*/

.carousel-overlay {
	position: absolute;
	top: 65%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	font-size: 1.3rem;
	line-height: 1.4;
	z-index: 1;
}

.carousel-overlay *:not(.btn) {
	color: inherit;
}

.carousel-overlay-inner {
	max-width: 700px;
}

section.main .page-title h1,
.carousel-overlay h1 {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 3rem;
}

.carousel-overlay h1 {
	filter: drop-shadow(0px 0px 15px rgb(0,0,0,.4));
}

.carousel-overlay p {
	filter: drop-shadow(0px 0px 4px rgb(0,0,0,.4));
}

@media (min-width: 768px) {
	.carousel-overlay {
		top: 65%;
		font-size: 1.3rem;
	}
	section.main .page-title h1,
	.carousel-overlay h1 {
		font-size: 2.8rem;
	}
}

@media (min-width: 992px) {
	section.main .page-title h1,
	.carousel-overlay h1 {
		font-size: 4.1rem;
	}
	.carousel-overlay {
		top: 55%;
		font-size: 1.3rem;
	}
}

@media (min-width: 1200px) {
	.carousel-overlay {
		top: 60%;
	}
}

@media (min-width: 1440px) {
	section.main .page-title h1,
	.carousel-overlay h1 {
		font-size: 4.1rem;
	}
	.carousel-overlay {
		top: 50%;
		font-size: 1.4rem;
	}
	.carousel-overlay-inner {
		max-width: 60%;
	}
}

@media (min-width: 1920px) {
	section.main .page-title h1,
	.carousel-overlay h1 {
		font-size: 6.1rem;
	}
	.carousel-overlay {
		font-size: 1.7rem;
	}
	.carousel-overlay.container {
		max-width: 1720px;
	}
	.carousel-overlay-inner {
		max-width: 50%;
	}
}

.carousel-inner picture img {
	width: 100%;
}

@media (max-width: 992px) {
	.acknowledgment {
		display: none;
	}
}

.acknowledgment {
	position: absolute;
	bottom: 2rem;
	left: 2rem;
	max-width: 600px;
	font-size: .8rem;
	font-weight: 300;
	color: #fff;
	z-index: 2;
}

.acknowledgment strong {
	font-weight: 700;
}

.acknowledgment p {
	margin: 0;
}


/* Page Title */

.page-title {
	--aspect-ratio: 2.22 / 1;
	aspect-ratio: 2.22 / 1;
	padding-top: 16rem;
	padding-bottom: 8rem;
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.page-title:not(.bg-image) {
	--aspect-ratio: 3.1 / 1;
	aspect-ratio: 3.1 / 1;
}

.page-title + .container:not(:empty) {
	padding-top: 0;
}

.page-title h1 {
	line-height: 1;
}

.page-title.bg-image h1 {
	filter: drop-shadow(0px 0px 15px rgb(0,0,0,.4));
}

.page-title.bg-image .breadcrumb,
.page-title.bg-image p {
	filter: drop-shadow(0px 0px 4px rgb(0,0,0,.4));
}

.page-title.bg-image.text-invert {
	color: #282828;
}

.page-title.bg-image.text-invert h1 {
	filter: drop-shadow(0px 0px 15px rgb(255,255,255,.4));
}

.page-title.bg-image.text-invert .breadcrumb,
.page-title.bg-image.text-invert p {
	filter: drop-shadow(0px 0px 4px rgb(255,255,255,.4));
}

@media (min-width: 1920px) {
	.page-title h1 {
		max-width: 60%;
	}
	.page-title p {
		max-width: 50%;
	}
}

.page-title a {
	color: inherit;
}

.page-title p {
	color: inherit;
	font-size: 1.7rem;
	line-height: 1.4;
}

.breadcrumb {
	color: var(--primary);
}

.breadcrumb-item.active {
	color: inherit;
}

.breadcrumb-item + .breadcrumb-item::before {
	color: inherit;
	content: "/";
}


/* Background Colors */

.bg-gold {
	background-color: var(--primary);
}

.bg-gold a:not(.btn) {
	color: inherit;
}

.bg-gold a:not(.btn):hover,
.bg-gold a:not(.btn):focus {
	color: rgba(0,0,0,0.6);
}

strong {
	font-weight: 700;
}

.bg-gold strong {
	color: var(--dark) !important;
}

.bg-gold .breadcrumb {
	color: #fff;
}

.bg-deep-forest {
	background-color: var(--green);
	color: #fff;
}

.bg-light-green {
	background-color: var(--light-green);
	color: #333 !important;
}

.bg-cyan {
	background-color: var(--cyan);
}

.bg-cyan strong,
.bg-cyan .breadcrumb,
.bg-forest strong,
.bg-forest .breadcrumb {
	color: var(--light-green);
}

.bg-forest strong,
.bg-forest .breadcrumb {
	color: var(--dark) !important;
}

.bg-black {
	background-color: #232323;
	color: #fff;
}

.bg-terracott {
	background-color: var(--danger);
	color: #fff;
}

.bg-purple {
	background-color: var(--purple);
	color: #fff;
}

.bg-forest {
	background-color: var(--teal);
}

.bg-image {
	color: #fff;
}

.bg-image .breadcrumb {
	color: inherit !important;
}

.bg-image strong {
	color: var(--primary) !important;
}


/* General Sections */

section:not(.main):not(:empty):not(section section) {
	padding: 4rem 0;
}


/**
* Main Section
*/

section.main > .container:not(:empty) {
	padding-top: 4rem;
	padding-bottom: 4rem;
}

section.main > .container:last-child:not(:empty) {
	padding-bottom: 4rem;
}

section.main > .container.subpage-container:first-child {
	padding-top: 0;
}

@media (min-width: 1200px) {
	.container.narrow-container {
		max-width: 900px;
	}
	section.main .container.legal-container {
		max-width: 800px;
		background-color: #f8f8f8;
		padding: 4rem 3rem !important;
		margin-bottom: 6rem;
	}
}


/**
* General Slider
*/

body .slick-track {
	display: flex;
	align-items: stretch;
}

body .slick-initialized .slick-slide {
	display: inline-flex;
}

body .slick-slide {
	float: initial;
	height: initial;
	min-height: 1px;
}

section .slick-slider {
	padding: 0;
}

section .slick-track {
	display: flex;
	align-items: stretch;
}

section .slick-initialized .slick-slide {
	display: inline-flex;
	justify-content: center;
	padding: 1rem;
	float: none;
}

section .slick-initialized .slick-slide a {
	text-align: center;
}

section .slick-initialized ul,
section .slick-initialized li {
	margin: 0;
	padding: 0;
}

/**
* Slider Arrows
*/

section .slick-prev,
section .slick-next {
	display: block;
	padding: 0 4rem;
	width: auto;
	height: 100%;
	transition: all .3s;
	z-index: 3;
}

section .slick-next {
	right: unset;
	left: 100%;
	transform: translate(-100%, -50%);
}

section .slick-prev {
	left: unset;
	right: 100%;
	transform: translate(100%, -50%);
}

section .slick-next svg *,
section .slick-prev svg * {
	stroke: #fff !important;
	stroke-width: 2px !important;
	transition: all .3s;
}

section .slick-prev:hover,
section .slick-prev:focus,
section .slick-next:hover,
section .slick-next:focus {
	background-color: rgba(59,65,57,0.25);
}


@media (min-width: 768px) {
	section .slick-next,
	section .slick-prev {
		transform: translate(0, -50%);
	}
}

section .slick-next::before {
	content: unset;
}

section .slick-prev::before {
	content: unset;
}


/**
* Slider Dots
*/

section .slick-dots {
	bottom: -30px;
}

section .slick-dots li {
	margin: 0;
}

section .slick-dots li button:hover::before,
section .slick-dots li button:focus::before {
	opacity: 1;
	color: var(--primary);
}

section .slick-dots li button::before {
	font-size: 9px;
	opacity: 1;
	color: #a1a1a1;
	transition: all .3s;
}

section .slick-dots li.slick-active button::before {
	opacity: 1;
	color: var(--primary);
}

section a:not(.btn):not(.social-icon) {
	font-weight: 700;
	text-decoration: underline;
}


/* Intro Section */

.intro {
	background-color: var(--green);
	padding: 0 !important;
	color: #fff;
	font-weight: 300;
	font-size: 1.3rem;
}

.page-title strong,
.intro strong,
section.extended-intro strong {
	font-weight: 700;
	color: var(--primary);
}

.intro .lead {
	font-size: 125%;
}

.half-width-image img {
	border-radius: calc(var(--border-radius) / 3);
	width: 100%;
}

@media (min-width: 992px) {
	.intro {
		font-size: 1.6rem;
	}
	.half-width-image img {
		float: left;
		width: 50vw;
		max-width: none;
		height: 100%;
		object-fit: cover;
		object-position: center;
		border-radius: 0;
	}
}

@media (min-width: 1200px) {
	.intro {
		font-size: 1.8rem;
	}
}

@media (min-width: 1440px) {
	.intro {
		font-size: 1.9rem;
	}
}

@media (min-width: 1920px) {
	.intro {
		font-size: 2.4rem;
	}
}

/* Extended Intro Section */

section.extended-intro {
	background-color: var(--danger);
	color: #fff;
	font-size: 18px;
}

.rounded-img img {
	border-radius: 50rem;
	--aspect-ratio: 1 / 1;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center;
	width: 100%;
	height: auto;
}

/* Aside / Featured Section */

aside.feature {
	position: relative;
	font-size: 1.2rem;
	margin-bottom: 3rem;
	font-weight: 300;
}

aside.feature::before {
	content: "";
	position: absolute;
	top: 0;
	right: 50%;
	transform: translateX(50%);
	display: block;
	width: 100vw;
	height: 100%;
	background-color: inherit;
}

@media (min-width: 1200px) {
	aside.feature::before {
		right: 100%;
		transform: unset;
	}
}

aside.feature .lead {
	font-size: 125%;
}

aside.feature .text-col {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

aside.feature .half-width-image {
	padding-bottom: 3rem;
}

@media (min-width: 992px) {
	aside.feature .text-col {
		padding-top: 6rem;
		padding-bottom: 6rem;
		padding-left: 2rem;
	}
	aside.feature .half-width-image {
		padding-bottom: 0;
	}
}

aside.feature .text-col img {
	border-radius: calc(var(--border-radius) / 3);
	margin-bottom: 1.5rem;
	--aspect-ratio: 2.2 / 1;
	aspect-ratio: 2.2 / 1;
	object-fit: cover;
	width: 95%;
	margin-bottom: 1rem;
}

aside.feature .text-col h2 {
	max-width: 450px;
	font-weight: 600;
}


/**
* Events Section
*/

.event-list > div {
	display: flex;
	flex-direction: column;
}

a.event-card {
	flex: 1;
	display: flex;
	flex-direction: column;
	padding: 1rem;
	width: 100%;
	border-radius: calc(var(--border-radius) * .6);
	background-color: var(--ice);
	color: inherit;
	text-decoration: none !important;
	margin-bottom: 2rem;
	transition: background-color .2s ease-in-out, color .2s ease-in-out;
}

.event-card-lower {
	flex: 1;
	display: flex;
	justify-content: space-between;
}

.event-card-text *:last-child {
	margin-bottom: 0;
}

.event-card-text {
	font-weight: 400;
	font-size: .9rem;
	padding-right: .7rem;
	flex: 1;
	display: flex;
	flex-direction: column;
}
a.event-card h3 {
	font-weight: 700;
	font-size: 1.2rem;
	margin-bottom: .5rem;
}

.event-card-text p {
	line-height: 1.3;
}

a.event-card {
	font-weight: 400 !important;
}

a.event-card:hover,
a.event-card:focus {
	color: #fff;
	background-color: var(--secondary);
}

.event-card-img {
	position: relative;
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: calc(var(--border-radius) / 2);
	overflow: hidden;
	margin-bottom: 1rem;
}

.event-card-img img {
	--aspect-ratio: 1.47 / 1;
	aspect-ratio: 1.47 / 1;
	width: 100%;
	object-fit: cover;
}

.event-card-date {
	position: absolute;
	top: 1rem;
	left: 1rem;
	display: inline-block;
	background-color: #fff;
	color: #232323;
	padding: 1rem;
	border-radius: calc(var(--border-radius) * .3);
	text-align: center;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 1.1;
	font-size: .9rem;
}

.event-card-date span {
	display: block;
	font-weight: 300;
	text-transform: initial;
	font-size: 150%;
}

.event-card-arrow .arrow {
	fill: #231f20;
	transition: all .2s;
}

.event-card-arrow .rect {
	fill: var(--primary);
	transition: all .2s;
}

a.event-card:hover .event-card-arrow .arrow,
a.event-card:focus .event-card-arrow .arrow,
a.event-card.featured .event-card-arrow .arrow {
	fill: var(--primary);
}

a.event-card:hover .event-card-arrow .rect,
a.event-card:focus .event-card-arrow .rect,
a.event-card.featured .event-card-arrow .rect {
	fill: #231f20;
}


/* Event Listing */

.event {
	padding-top: 10rem;
}

.event h1,
.event-dates h3 {
	padding-bottom: .5rem;
	border-bottom: 2px solid var(--primary);
}

.event p:first-of-type {
	font-size: 135%;
	font-weight: 300;
}

.event h3 {
	font-size: 1.9rem;
	font-weight: 500;
}

.event h4 {
	font-size: 1.5rem;
	font-weight: 500;
}

.event h5 {
	font-size: 1.2rem;
	font-weight: 700;
}

.event p + h1,
.event p + h2,
.event p + h3,
.event p + h4,
.event p + h5,
.event p + h6 {
	padding-top: 1.4rem;
}

.event-image {
	border-radius: calc(var(--border-radius) / 3);
}

.event-info {
	padding-top: 2rem;
}

.event-info .row {
	border-top: 1px solid var(--primary);
	padding: .9rem .3rem;
}

.event-info .row:last-child {
	border-bottom: 1px solid var(--primary);
}

.event-info-label {
	font-weight: 600;
}

.event-info a {
	font-weight: 400 !important;
}

.event-info a:not(:hover):not(:focus) {
	color: inherit;
}

.event-info-value.preformatted {
	white-space: break-spaces;
}

.event-dates {
	padding-top: 3rem;
}



/**
* Blog Sidebar
* Post List Categories, Tag Cloud, & Popular Posts List
*/

.post-list-categories,
.post-list-tag-cloud,
.post-list-popular-posts {
	margin-bottom: 3rem;
}

.post-list-category,
.post-list-tag {
	margin-right: .4rem;
	margin-bottom: .4rem;
}

.post-list-popular-post {
	display: block;
	margin-bottom: .4rem;
}


/**
* Blog Post List View
*/

.post-list-item {
	padding: 1rem 1rem 2rem;
	display: flex;
	align-items: stretch;
}

.post-list-item a {
	color: inherit;
	text-decoration: none;
	background-color: #fff;
	display: block;
	flex-basis: 100%;
	box-shadow: 0 0 8px -5px #777;
}

.post-list-item a:hover,
.post-list-item a:focus {
	box-shadow: 0 0 11px -3px #777;
}

.post-list-item img {
	width: 100%;
	height: 20rem;
	object-fit: cover;
}

.post-list-item .post-item-text {
	padding: 1.5rem;
	font-size: .85rem;
}


/**
* Blog Post Article View
*/

article.blog-post {
	margin-bottom: 1rem;
	color: #333;
	padding-top: 10rem;
}

article.blog-post img {
	border-radius: .5rem;
}

.article-details {
	color: #444;
	font-size: 90%;
	font-weight: 500;
}

.article-details h6 {
	font-size: 70%;
	font-weight: 400;
	color: #444;
	margin-bottom: .2rem;
}

.post-image {
	max-width: 90rem;
	margin: 0 auto 4rem;
}

.post-image img {
	width: 100%;
	max-height: 500px;
	object-fit: cover;
}

.post-inner {
	margin: 0 auto;
	max-width: 70rem;
}

.post-title {
	text-align: center;
	font-size: 2.5rem;
}

@media (min-width: 1200px) {
	.post-title {
		margin-left: -3rem;
		margin-right: -3rem;
		font-size: 3.7rem;
	}
}

.post-summary {
	text-align: center;
}

.post-share {
	text-align: center;
	font-size: .9rem;
}

.post-share-upper {
	margin-bottom: 4rem;
}

.post-share-end {
	padding-top: 1rem;
	padding-bottom: 4rem;
}

.post-next-article {
	font-size: 110%;
	text-align: center;
}

.post-comments-link {
	padding-left: .3rem;
	padding-top: 1rem;
	font-weight: bold;
}

.post-article p {
	line-height: 1.9;
	margin-bottom: 3.5rem;
}

.post-article .full-width-image {
	margin-bottom: 3.5rem;
}

.post-article .full-width-image img {
	width: 100%;
	max-width: initial;
}

@media (min-width: 1200px) {
	.post-article .full-width-image img {
		margin-left: -2rem;
		margin-right: -2rem;
		width: calc(100% + 4rem);
	}
}

article.blog-post blockquote *:last-child {
	margin-bottom: 0;
}

/* Blog/Post Comments */
.post-comments {
	max-width: 60rem;
	margin: 0 auto;
	border-top: 4px solid var(--cartColourBackgroundAccent);
	padding: .3rem;
	padding-top: 4rem;
}

.post-comment p {
	margin-bottom: .4rem;
}

.post-comment header {
	font-size: .9rem;
}

.post-comment-name,
.post-comment-name a {
	font-weight: bold;
	color: inherit;
}

.post-comment-date {
	color: #999;
}

.post-comment-avatar div {
	width: 45px;
	height: 45px;
	background-color: var(--cartColourBackgroundAccent);
	color: #fff;
	font-size: 1.6rem;
	text-align: center;
	border-radius: .2rem;
	line-height: 45px;
	margin-right: 1rem;
}

.post-comment-replies {
	color: inherit;
	font-size: .9rem;
	margin-top: 1.5rem;
	margin-left: 1rem;
	flex: 0 0 auto;
}

@media (min-width: 1200px) {
	.post-comment-replies {
		margin-left: 4rem;
	}
}

.post-comment-form {
	margin-bottom: 2rem;
	padding-bottom: 4rem;
	border-bottom: 4px solid var(--cartColourBackgroundAccent);
}


/* Base Image Styling */

.outerpair1 { background: url("../../images/upperrightfade.png") no-repeat right top; }
.outerpair2 { background: url("../../images/lowerleftfade.png") no-repeat left bottom; padding-top: 8px; padding-left: 8px; }
.shadowbox { background: url("../../images/shadow.png") bottom right; }
.innerbox { position: relative; left: -8px; top: -8px; }
.shadowbox img { border: 1px solid #333; vertical-align: bottom; }

.pageimagecenter { text-align: center; margin: 0 auto; padding: 0; max-width: 100%; }
.pageimageright { float: right; margin: .7rem 0 .7rem .7rem; padding: 0; max-width: 100%; }
.pageimageleft { float: left; margin: .7rem .7rem .7rem 0; padding: 0; max-width: 100%; }
.pageimagenone img { margin: .7rem; padding: 0; }


/**
* Page Gallery
*/

.pagegallery {
	margin-bottom: 3rem;
}

.pagegalleryheading {
	font-family: var(--font-heading);
	font-size: 2rem;
	font-weight: 500;
	margin-bottom: 1rem;
}

.pagegalleryinner {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: flex-start;
	margin: 0 -.25rem;
}

.pagegalleryimage {
	flex: 0 0 50%;
}

@media (min-width: 768px) {
	.pagegalleryimage {
		flex: 0 0 33.3333%;
	}
}

@media (min-width: 1200px) {
	.pagegalleryimage {
		flex: 0 0 25%;
	}
}

.pagegallery img {
	--aspect-ratio: 5 / 3.5;
	aspect-ratio: 5 / 3.5;
	object-fit: cover;
	object-position: center;
	width: 100%;
}

.pagegalleryinner a {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border: .5rem solid #fff;
	position: relative;
	z-index: 1;
}

.pagegalleryinner a:hover,
.pagegalleryinner a:focus {
	transform: scale(1.1);
	box-shadow: .25rem .25rem .75rem rgba(0,0,0,0.4);
	z-index: 3;
}


/* Subpage Link Cards */
/* Directory List Cards */

.main-category{
	border-bottom: 2px solid var(--primary);
	padding-bottom: 0;
}

.main-category:not(:last-child) {
	margin-bottom: 2rem;
}

a.main-category-title {
	display: flex;
	/* border-bottom: 2px solid var(--primary); */
	padding-bottom: .35rem;
	/* margin-bottom: 2.5rem; */
	color: inherit !important;
	font-weight: 300 !important;
	text-decoration: none !important;
}

.main-category-title h2 {
	margin-bottom: 0;
}

@media (max-width: 576px) {
  .main-category {
    padding-bottom: 1.5rem;
  }
}

@media (min-width: 992px) {
	.directory-list {
		margin-left: -1.8rem;
		margin-right: -1.8rem;
	}
}

.filter-search{
	border: 1px solid #ccc !important;
}

.filter-sort {
	background-color: #e9e9e9;
	border: 1px solid #ccc;
	border-radius: 20px;
	padding: 10px 16px;
	width: 170px;
	/* text-align: center; */
	cursor: pointer;
	appearance: none;
	background-image: url("data:image/svg+xml;utf8,<svg fill='%23333' height='20' viewBox='0 0 20 20' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M5 7l5 5 5-5z'/></svg>");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 24px;
}

.filter-sort:focus {
  box-shadow: none;
  outline: none;
}

a.directory-card {
	flex: 1;
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 1.3rem 1rem 1rem;
	border-radius: calc(var(--border-radius) * .6);
	margin-bottom: 2rem;
	background-color: transparent;
	color: inherit;
	text-decoration: none !important;
	transition: background-color .2s ease-in-out, color .2s ease-in-out;
}

a.subpage-card {
	padding: 1rem;
	background-color: var(--ice);
}

a.directory-card.featured {
	background-color: var(--primary);
}

a.directory-card:hover,
a.directory-card:focus,
a.directory-card.featured:hover,
a.directory-card.featured:focus {
	background-color: var(--secondary);
	color: #fff;
}

.directory-card-tags {
	position: absolute;
	top: 0;
	left: 1rem;
	transform: translateY(-50%);
}

.directory-card-tag {
	display: inline-block;
	padding: .2rem .4rem;
	border-radius: .3rem;
	font-size: .6rem;
	text-transform: uppercase;
	background-color: var(--light-green);
	color: #231f20;
}

.directory-card-upper {
	display: flex;
	justify-content: space-between;
}

.directory-card-text *:last-child {
	margin-bottom: .8rem;
}

.directory-card-text {
	font-weight: 400;
	font-size: .9rem;
	padding-right: .7rem;
}

.directory-card-text h3 {
	font-weight: 700;
	font-size: 1.2rem;
	margin-bottom: 0;
}

.directory-card-text p {
	margin-bottom: .8rem;
	line-height: 1.2;
	font-size: .8rem;
}

.directory-card-img {
	margin-top: auto;
	background-color: rgba(0,0,0,.1);
	border-radius: calc(var(--border-radius) / 2);
	overflow: hidden;
}

.directory-card-img img {
	--aspect-ratio: 6 / 4;
	aspect-ratio: 6 / 4;
	width: 100%;
	object-fit: cover;
}

.subpage-card-img img {
	--aspect-ratio: 6 / 4;
	aspect-ratio: 6 / 4;
}

.subpage-card svg {
	width: 26px;
	height: 26px;
	vertical-align: top;
}

.directory-card-arrow .arrow {
	fill: #231f20;
	transition: all .2s;
}

.directory-card-arrow {
	margin-bottom: .5rem;
}

.directory-card-arrow .rect {
	fill: var(--primary);
	transition: all .2s;
}

a.directory-card:hover .directory-card-arrow .arrow,
a.directory-card:focus .directory-card-arrow .arrow,
a.directory-card.featured .directory-card-arrow .arrow {
	fill: var(--primary);
}

a.directory-card:hover .directory-card-arrow .rect,
a.directory-card:focus .directory-card-arrow .rect,
a.directory-card.featured .directory-card-arrow .rect {
	fill: #231f20;
}




/**
* Contact Page
*/

#ContactFormUserEmail {
	display: none!important;
}

#contactform #contact_thanks {
	padding: 1rem;
	margin: 0 auto;
	width: 100%;
	text-align: center;
	background: var(--primary);
}

#contactpage {
	margin-bottom: 4rem;
	border-radius: var(--border-radius);
}

section.main .contactright h5 {
	margin-bottom: .5rem;
	font-size: .9rem;
	font-weight: 700;
}

.contact-map {
	margin: 0;
	height: 350px;
	width: 100%;
}

.contact-map iframe {
	height: 100%;
}

iframe {
	width: 100%;
	border: none;
}

#contact-us iframe {
	height: 400px;
	padding-top: 2.5rem;
}


/**
* Site Forms
*/

.form .error {
	color: #721c24;
	background-color: #f8d7da;
	border-color: #f5c6cb;
}

section.main .form-col {
	background: #efece6;
	padding: 6rem 3rem;
}

.form {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -1rem;
}

.form p {
	width: 100%;
}

.form > div {
	flex: 0 1 100%;
	margin: 0;
	padding: 0 1rem;
}

/* Submit button has a submit text label, hide it */
.form > div:last-of-type label {
	display: none;
	visibility: hidden;
	pointer-events: none;
}

.form .form-control {
	margin-bottom: 1rem;
}

textarea.form-control {
	border-radius: 1.5rem;
}


/**
* CGMap (Custom Google Map) Styling
*/

.CGMapCanvas {
	background-color: lightblue;
	height: 700px;
	max-height: 100vh;
}


/**
* General UBC Google Map Styling
* Including Content of Popups when icons are clicked
*/

.location-map.large-map {
	background-color: #e5e3df;
	height: 450px;
}

/* Required for lightbox popup (enlarge map) */
.location-map.ubcmap-big {
	position: fixed !important; /* Needs !important to override javascript controlled styles */
	top: 6%;
	left: 0;
	margin: 0 10%;
	width: 80%;
	height: 80vh;
	z-index: 99;
}

.location-map .mappopup {
	display: flex;
	height: 100%;
}

.location-map .mapimage {
	flex-basis: 45%;
	padding-right: 1rem;
}
.location-map .mapimage img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.location-map .mapcontent {
	flex-basis: 55%;
	font-size: .65rem;
}


/* Animation https://animate.style */
.animate__animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

@-webkit-keyframes fadeInUp {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

.animate__fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}


/**
* Footer
*/

footer.main {
	clear: both; /* Don't like it, but provides a little layout protection where floats are used larger than the document flow */
	background-color: var(--green);
	color: #fff;
}

footer.main .graphic {
	position: relative;
	padding: 8rem 0 12rem;
	background-color: var(--secondary);
}

footer.main .graphic .logo {
	margin-left: -15px;
}

footer.main .graphic::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%,-100%);
	display: block;
	width: 100%;
	height: 129px;
	background: url('../../images/thread-footer.svg') top center no-repeat;
	background-size: cover;
	z-index: 1;
}

footer.main .social-icons {
	margin-bottom: 2rem;
}

footer.main h3 {
	font-size: 1.7rem;
	color: var(--yellow);
	margin-bottom: 0;
}

footer.main h5 {
	font-weight: 700;
	font-size: inherit;
}

footer.main .lead {
	max-width: 450px;
	font-size: .9rem;
	line-height: 1.3;
	color: var(--light-green);
}

footer.main a:not(.social-icon):not(.btn) {
	color: inherit;
}

footer.main a:not(.social-icon):not(.btn):hover,
footer.main a:not(.social-icon):not(.btn):focus {
	color: var(--primary);
}

footer.main ul.quick-menu {
	padding: 2rem 0;
	margin: 0;
	text-transform: uppercase;
}

footer.main .quick-menu ul {
	padding: 0;
	margin: 0;
}

footer.main .quick-menu li {
	list-style: none;
	margin: 0 0 .7rem 0;
	padding: 0;
	line-height: .8;
}

footer.main .quick-menu.horz li {
	position: relative;
	display: inline-block;
	margin: 0;
}

footer.main .quick-menu.horz li:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 25%;
	right: 0;
	display: block;
	width: 1px;
	height: 50%;
	background-color: rgba(255,255,255,0.3);
}

footer.main .quick-menu a {
	display: inline-flex;
	align-items: baseline;
	padding: .25rem;
	margin-left: -.25rem;
}

footer.main .quick-menu:not(.horz) a {
	color: var(--primary);
	font-weight: 600;
}

footer.main .quick-menu.horz a {
	padding: .25rem .7rem;
	margin: 0;
}

footer.main .quick-menu a i {
	display: flex;
	width: 1.5rem;
	flex: 0 0 1.5rem;
}

footer.main .acknowledge {
	color: var(--light-green);
	font-size: 14px;
}

/* Footer Form */

footer .form-control:not(:focus)::placeholder {
	color: #fff;
	opacity: .8;
}

footer .form-control {
	color: #fff;
	background-color: transparent;
	border: 1px solid #fff;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}


/* Legal Notices Bar */

footer.main .legal {
	font-size: .7rem;
	padding: 5rem 0 2rem;
}

.footersponsor {
	position: relative;
	display: inline-block;
	margin: 0 auto;
	width: 100%;
	text-align: center;
	margin-top: 5px;
}


/**
* Drawer Styling
* Menu, Fancy Cart, and other stuff
*/

.drawer-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--overlayColour);
	opacity: 0;
	z-index: 91;
	transition: opacity .3s ease-in-out;
	visibility: hidden;
}

.drawer-overlay.visible {
	opacity: 1;
	visibility: visible;
}

.drawer {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	transform: translateX(-110%);
	width: 350px;
	max-width: 95%;
	height: 100%;
	background-color: #fff;
	color: inherit;
	box-shadow: 0 0 2rem -1rem rgba(0,0,0,1);
	z-index: 91;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: opacity .3s ease, transform .3s ease;
}

.drawer.visible {
	transform: translateX(0);
}

.drawer-header {
	padding: .8rem .4rem;
	margin: 0;
}

.drawer-header .drawer-title {
	margin: 0;
	color: var(--drawerColourText);
	font-weight: 300;
	letter-spacing: 1px;
}

.drawer-header .drawer-close {
	color: var(--drawerColourText);
	font-size: 130%;
	padding: 0 .8rem;
}

.drawer-content {
	overflow: hidden;
	overflow-y: auto;
	flex: 1 1 auto;
	padding-bottom: 3rem;
}


/**
* Drawer Menu
*/

.drawer nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.drawer nav div {
	display: flex;
}

.drawer nav a {
	display: flex;
	justify-content: space-between;
	flex: 1 1 auto;
	text-decoration: none;
	line-height: 1.2;
	font-size: 18px;
	font-weight: 600;
	color: inherit;
}

.drawer nav a span {
	display: inline-block;
	padding: .8rem 1rem;
}

.drawer nav li li {
	display: flex;
	flex-direction: column;
	align-self: baseline;
	flex: 0 0 25%;
}

.drawer nav > ul > li > ul > li > div a {
	text-transform: uppercase;
	font-weight: 800;
	font-size: 1rem;
}

.drawer nav > ul > li > ul > li > span a {
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 700;
	color: #555;
}

.drawer nav ul li .toggler {
	display: flex;
	align-items: center;
	padding: 0 1.2rem;
	font-size: 120%;
	cursor: pointer;
}

.drawer nav ul li ul .toggler {
	border-left: transparent;
	background-color: transparent;
	font-size: 100%;
}

.drawer nav li ul li a {
	text-transform: initial;
	padding-left: .5rem;
}

.drawer nav li ul li ul li a span {
	padding: .2rem 1rem;
}

.drawer nav > ul > li > ul > li > ul a {
	font-weight: 400;
	font-size: 16px;
}

/* Submenu (Closed State) */
.drawer nav > ul > li > ul {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: max-height 0.5s ease-out, opacity .2s ease-out;
}

/* Submenu (Open State) */
.drawer nav > ul > li > ul.visible {
	max-height: 3000px;
	padding-bottom: 1rem;
	margin: 0;
	opacity: 1;
}


/* Debug */

#debug { position: relative; padding: 10px 15px; text-align: left; background: #cfdaff; border-top: 12px solid #c4d2ff; border-bottom: 12px solid #c4d2ff; }
#debug h1 { border: none; color: #001b51; text-transform: none; text-decoration: none; }
#debug pre { color: #000d27; }
