@import url("https://static.omg.lol/type/font-honey.css");
@import url("https://static.omg.lol/type/font-lato-regular.css");

@font-face {
	font-family: 'omg.lol';
	src: url('data:font/woff2;charset=utf-8;base64,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') format('woff2');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

* {
	box-sizing: border-box;
}
:root {
	--foreground: #1e2030;
	--background: #e9e9e9;
	--link: #0b7285;
	--accent: #868e96;
	--sidebar: 13em;
	--sidepadding: 3em;
	--card-bg: #f8f9fa;

	--card-gap: 1rem;
}

@media (prefers-color-scheme: dark) {
	:root {
	--foreground: #cad3f5;
	--background: #4a4c5e;
	--link: #99e9f2;
	--accent: #ced4da;
	--card-bg: #1e2030;
	}
}

html {
	min-height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

body {
	font-size: 1.2em;
	margin: 0;
	padding: 2em;
	font-family: 'Mint Grotesk', sans-serif;
	/*background: linear-gradient(0deg, #3fb6b6 0%, #d56b86 100%);*/
	background-attachment: fixed;
	height: 100%;
	overflow-wrap: break-word;
	background: var(--background);
	color: var(--foreground);
	font-family: "Lato", sans-serif;
	font-size: 120%;
	line-height: 160%;
}

main {
	max-width: 700px;
	display: block;
	border-radius: 1em;
	margin: 0 auto;
	text-align: center;
	padding: 2em;
	box-shadow: 0 6px 12px -2px rgba(50, 50, 93, 0.25), 0 3px 7px -3px rgba(0, 0, 0, 0.3);
	background: var(--card-bg);
}

body.legal main {
	max-width: 1200px;
	text-align: left;
}

h1 {
    margin-top: 0.5em;
    margin-bottom: 1.5em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "VC Honey Deck", serif;
}

a,
a:link,
a:visited {
	color: var(--link) ;
	text-decoration: none;
}
a:hover,
a:active {
	color: var(--foreground);
}

ul {
	list-style: none;
}
.directory ul {
	margin: 0;
	padding: 0;
}
.directory ul li {
	display: flex;
	align-items: center;
	--image-width: 150px;
	--spacing: 50px;

    
    background: var(--background);
    border-radius: 10px;
    padding: var(--card-gap);
    margin-bottom: var(--card-gap);
}
.directory ul li:last-child {
	margin-bottom: 0;
}
.services ul li .about,
.directory ul li .about {
	width: calc(100% - var(--image-width) - var(--spacing));
	margin-right: var(--spacing);
}
.directory ul li .about :last-child {
	margin-bottom: 0;
}
.services ul li .image,
.directory ul li .image {
	width: var(--image-width);
	flex-grow: 0;
	height: var(--image-width);
}
.directory ul li .image a {
	display: block;
	width: var(--image-width);
	height: var(--image-width);
}
.directory ul li .image img {
	display: block;
    object-fit: cover;
    width: 100%;
    height: 100%;
	border-radius: 100%;
}

.directory .links a::after {
		content: ' · ';
}
.directory .links a:last-of-type::after {
	display: none;
}

.services {
	display: block;
	text-align: center;

	position: fixed;
    top: 2em;
    right: 2em;
	text-wrap: nowrap;
}

.services ul {
	margin: 0;
	padding: 0;
	display: flex;
}
.services ul li {
	width: calc(50% - calc(var(--card-gap) / 2));
}
.services ul li:first-of-type {
	margin-right: calc(var(--card-gap) / 2);
}
.services ul li:last-of-type {
	margin-left: calc(var(--card-gap) / 2);
}
.services ul li a {
	display: flex;
	align-items: center;
	text-align: left;
	color: inherit;

	box-shadow: 0 6px 12px -2px rgba(50, 50, 93, 0.25), 0 3px 7px -3px rgba(0, 0, 0, 0.3);
    
    background: var(--card-bg);
    border-radius: 10px;
    padding: var(--card-gap) calc(2* var(--card-gap));
	margin-bottom: var(--card-gap);


    font-size: 50%;
    --image-width: 20px;
    padding: 0em 0.85em;
    --spacing: 10px;
}
.services ul li .image svg {
	display: block;
	width: 100%;
	height: 100%;
    fill: var(--foreground);
}
.services h2 ,
.directory h2 {
	margin: 0;
}
.directory .byline,
.directory .links {
	margin: 0.6em 0;
}

@media (max-width: 720px) {
	body {
		font-size: 1em;
		padding: 0;
		background: var(--card-bg);
	}
	main {
		padding: 1.5em;
		box-shadow: none;
	}
	h1 {
		margin-top: 0;
		/* margin-bottom: 2em; */
	}

	.directory ul li {
		--image-width: 100px;
		--spacing: 20px;
	}
	.services {
		display: block;
		text-align: center;

		position: fixed;
		top: auto;
		bottom: 1em;
		right: auto;
		left: 50%;
		transform: translateX(-50%);
		text-wrap: nowrap;
	}
	
	.services ul li {
		width: auto;
		margin-bottom: var(--card-gap);
		margin-bottom: 0 !important;
	}
	.services ul li a {
		margin: 0;
	}
	.byline {
		display: none;
	}
}