@font-face {
	font-family: "mini-wakuwaku";
	src: url("mini-wakuwaku-maru.otf") format("opentype");
}

@font-face {
	font-family: "Cotham Sans";
	src: url("CothamSans.otf") format("opentype");
}

body {
	background: url("bgsplash.png");
	font: 1rem "mini-wakuwaku", sans-serif;
	color: #ff2d87;
}

.wrapper {
	background: white;
	padding: 1em;
	width: calc(40% - 1em);
	margin: auto;
	border-radius: 10px;
	border: 2px solid #ff2d87;
}

header.h-bg {
	background: center -10em / cover no-repeat url("outbg29.png");
	text-align: center;
	max-width: calc(35em - 1em);
	min-height: calc(25em - 1em);
	margin: auto;
}

header h1 {
	font-size: 2.5rem;
	margin: 0;
	background: white;
	padding: 1rem;
	border-radius: 0 0 50% 50%;
	border-bottom: 2px solid #ff2d87;
}

article#list {
	margin: 0;
	padding: 0;
}

dl {
	margin: 0 0 1em 0;
	padding: 0;
}

dt {
	font-size: 1.5rem;
	padding: 1rem 0 1rem 1rem;
	margin: 0;
}

dt:first-child {
	padding-top: 0;
	margin-top: 0;
}

dd {
	font-family: 'Cotham Sans', sans-serif;
	font-size: 1.2rem;
}

a:link, a:link:active, a:visited, a:visited:active {
	text-underline-offset: 3px;
	text-decoration-thickness: 2px;
	color: #1293ce;
}

a:not(:is(:hover, :focus)) {
  text-decoration-color: 
    color-mix(in srgb, currentColor, transparent 50%);
}


::selection {
	background: #30b4e9;
	color: white;
}