@charset "utf-8";

/* FONTS
--------------------------------------------------*/
@font-face {
	font-family: 'Ubuntu';
	font-weight: 400;
	font-style: normal;
	src: local('Ubuntu-Regular.ttf') format('ttf');
}
@font-face {
	font-family: 'Ubuntu';
	font-weight: 400;
	font-style: italic;
	src: local('Ubuntu-Italic.ttf') format('ttf');
}
@font-face {
	font-family: 'Ubuntu';
	font-weight: 700;
	font-style: normal;
	src: local('Ubuntu-Bold.ttf') format('ttf');
}
@font-face {
	font-family: 'Ubuntu';
	font-weight: 700;
	font-style: italic;
	src: local('Ubuntu-BoldItalic.ttf') format('ttf');
}


/* RESETS
--------------------------------------------------*/
*,
*:before,
*:after {
	box-sizing: border-box;
}
img, svg {
	display: block;
	height: auto;
	max-width: 100%;
}
iframe {
	display: block;
	max-width: 100%;
}
nav ul,
.list-reset {
	list-style: none;
	padding: 0;
}
blockquote {
	margin: 2em 0;
}
blockquote p:last-of-type {
	margin: 0;
}


/* STYLING
--------------------------------------------------*/
:root {
	--fnt-sans: 'Ubuntu', sans-serif;
	--clr-accent: #FFD23F;
	--clr-white: #FFF;
}

html {
	scroll-behavior: smooth;
	background-color: #002438;
}
body {
	/*background-color: #EE4266;*/
	/*background-color: #006192;*/
	background-color: #0069AD;
	margin: 0;
	font-family: var(--fnt-sans);
	line-height: 1.5;
	min-height: 100vh;
	position: relative;
	color: var(--clr-white);
}
.align-center,
.header,
.footer {
	text-align: center;
}
a {
	color: var(--clr-white);	
}
a:hover {
	color: var(--clr-accent);	
}
.wrapper {
	display: flex;
	flex-flow: column;
	min-height: 100vh;
}
.container {
	padding: clamp(14px, 2.5vw, 26px);
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	flex: 1;
}
.header {
	text-align: center;
}
.logo {
	display: block;
	margin: 0 auto;
	width: 50vw;
	max-width: clamp(120px, 50vw, 375px);
}
.tagline {
	display: block;
	font-size: clamp(16px, 4vw, 23.5px);
	color: var(--clr-white);
	font-weight: 600;
	margin-block: 1rem;
}
.nity {
	position: sticky;
	max-width: 120px;
	left: calc( 50% - 300px );
	top: 50px;
	max-height: 0;
}
.nity img {
	position: relative;
	bottom: 100px;
	left: -6px;
}
#appstore-button {
	display: inline-block;
	width: clamp(170px, 40vw, 220px);
	height: auto;
	border: 10px solid transparent;
	margin-bottom: 20px;
}
#appstore-button:hover {
	scale: 105%;
}
footer {
	display: flex;
	flex-flow: column;
	gap: 1rem;
	font-size: 1rem;
	opacity: 0.3;
	text-align: center;
	padding: 2em;
	transition: opacity 0.2s ease-in-out;
}
footer:hover {
	opacity: 1;
}
small {
	font-size: 12px;
}


/* SCOPING
--------------------------------------------------*/
.page-presskit main {
	text-align: left;
}
@media (min-width: 760px) {
	.page-presskit main {
		text-align: left;
		display: flex;
		flex: column nowrap;
		gap: 2em;
	}
	.page-presskit .sidebar {
		position: relative;
		flex: 0 0 20%;
	}
	.page-presskit .sidebar ul {
		position: sticky;
		top: 2em;
	}
	.page-presskit .content {
		flex: 0 1 inherit;
	}
}
.page-presskit section {
	border-top: 3px solid #00000033;
	margin-block: 0 2em;
}
.page-presskit h2 {
	color: var(--clr-accent);
	margin-block: 2em 8px;
	scroll-margin-top: 1.5em;
}
.page-presskit nav a {
	display: block;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: .5px;
	padding: 2px 0;
	font-size: 85%;
	white-space: nowrap;
}
@media (max-width: 759px) {
	.page-presskit nav ul {
		text-align: center;
	}
	.page-presskit nav li {
		display: inline-block;
		padding-inline: 6px;
	}
}
.page-presskit nav a:hover {
	color: var(--clr-accent);
}
.page-presskit .gallery {
	display: flex;
	flex-flow: row wrap;
	gap: 1em;
}
.page-presskit .gallery li {
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid #00000022;
	width: 100%;
	height: 100%;
	aspect-ratio: 3 / 2;
	max-width: calc(50% - 0.5em);
}

.colored-text {
	color: var(--clr-accent);
}


.page-support main p {
	font-size: 130%;
}