* {
	box-sizing: border-box;
}

:root {
  --bg-a: #0b0e11;
  --bg-a-rgb: 11,14,17;
  --bg-b: #1c1e21;
  --bg-b-rgb: 28,30,33;
  --bg-c: #22262f;
  --bg-c-rgb: 34,38,47;
  --bg-d: #4b4b59;
  --bg-d-rgb: 75,75,89;
  --fg-a: #fff;
  --fg-a-rgb: 255,255,255;
  --fg-b: #dfe1e9;
  --fg-b-rgb: 223,225,233;
  --fg-c: #c3c4c7;
  --fg-c-rgb: 195,196,199;
  --fg-d: #acacb4;
  --fg-d-rgb: 172,172,180;
  --brand-a: #216f95;
  --brand-a-rgb: 33,111,149;
  --brand-b: #ffcc8b;
  --brand-b-rgb: 255,204,139;
  --brand-c: #ff8ba9;
  --brand-c-rgb: 255,139,169;
}

html,
body {
	padding: 0;
	margin: 0;
	min-width: 320px;
}

body {
	background: var(--bg-a);
	font-family: 'Inter', 'Open Sans', 'Helvetica Neue', sans-serif;
	font-size: 16px;
	line-height: 26px;
	color: var(--fg-b);
}

a {
	color: var(--fg-d);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

label {
	cursor: pointer;
	color: var(--fg-d);
}

h1,
h2,
h3,
h4 {
	font-weight: 400;
}

.section {
	margin-bottom: 45px;
}

input[type='text'],
input[type='email'],
select {
  background-color: var(--bg-a);
	padding: 10px 15px;
	border-radius: 3px;
	width: 100%;
	border: 1px solid var(--bg-d);
	font-size: 1em;
  color: var(--fg-a);
  transition: border-color 0.2s;
}

input:focus {
	border-color: var(--brand-a);
  outline: none;
}

input:focus::placeholder {
	color: transparent;
}

input[disabled] {
	opacity: 0.5;
}

label:has(input),
label:has(textarea),
label:has(select) {
	display: block;
	text-align: left;
}

label > :not([hidden]) {
	margin-top: 8px;
}

.center {
	text-align: center;
}

.right {
	text-align: right;
}

.button {
	background: var(--brand-a);
	padding: 15px 30px;
	border-radius: 3px;
	border: 0;
	cursor: pointer;
	text-decoration: none;
	color: var(--fg-a);
	display: inline-block;
	min-width: 150px;
	font-size: 1.1em;
	text-align: center;
  transition: all 0.2s;
}

.button:hover {
	filter: brightness(1.2) contrast(1.2);
  text-decoration: none;
}

.button.button-outline {
	background: transparent;
	border: 2px solid var(--brand-a);
  border-radius: 5px;
}

.button.button-outline:hover {
	background-color: var(--brand-a);
}

.container {
	margin: 60px auto 15px auto;
	max-width: 550px;
}

.wrap {
	background: var(--bg-b);
	padding: 40px;
	border-radius: 8px;
}

.header {
	border-bottom: 1px solid var(--bg-d);
	padding-bottom: 15px;
	margin-bottom: 30px;
}

.header .logo {
  margin: 0 auto;
  width: fit-content;
}

.header .logo img {
	max-width: 150px;
}

.unsub-all {
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px solid #eee;
}

.row {
	margin-bottom: 20px;
}

.lists {
	list-style-type: none;
	padding: 0;
}

.lists li {
	margin: 0 0 5px 0;
}

.lists .description {
	margin: 0 0 15px 0;
	font-size: 0.875em;
	line-height: 1.3rem;
	color: var(--fg-b);
	margin-left: 25px;
}

.form .nonce {
	display: none;
}

.form .captcha {
	margin-top: 30px;
}

.archive {
	list-style-type: none;
	margin: 25px 0 0 0;
	padding: 0;
}

.archive .date {
	display: block;
	color: #666;
	font-size: 0.875em;
}

.archive li {
	margin-bottom: 15px;
}

.feed {
	margin-right: 15px;
}

.home-options {
	margin-top: 30px;
}

.home-options a {
	margin: 0 7px;
}

.pagination {
	margin-top: 30px;
	text-align: center;
}

.pg-page {
	display: inline-block;
	padding: 0 10px;
	text-decoration: none;
}

.pg-page.pg-selected {
	text-decoration: underline;
	font-weight: bold;
}

#btn-back {
	display: none;
}

footer.container {
	margin-top: 15px;
	text-align: center;
	color: var(--fg-c);
	font-size: 0.775em;
	margin-top: 30px;
	margin-bottom: 30px;
}

@media screen and (max-width: 650px) {
	.wrap {
		margin: 0;
		padding: 30px;
		max-width: none;
	}
}

hr {
  border-color: var(--fg-b);
}

.br-sm {
	height: 1rem;
}

.br {
    height: 2rem
}