@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@font-face {
  font-family: "Bender Regular";
  font-style: normal;
  font-weight: normal;
  src: local("Bender Regular"),
	url("https://eft-ammo.b-cdn.net/fonts/Bender.woff") format("woff");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: normal;
  src: local("Bender Regular"), url("Poppins-ExtraBold.woff") format("woff");
}
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: normal;
  src: local("Bender Regular"), url("Geist-Regular.woff") format("woff");
}


* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
  font-family: Bender Regular, Poppins, Geist, san-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  margin-left: var(--side-spacing-normal);
  margin-right: var(--side-spacing-normal);
  margin-top: 50px;
  background: var(--body-bg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  color: var(--body-fg);
}

a:hover { color: var(--link-hover-fg); }
nav ul { margin-bottom: 1rem; }
nav li { list-style-type: none; }
p { margin-top: 10px; }
.note-content { font-size: 1.2rem; line-height: 2.4rem }
.note-content li { margin-left: 3rem; }
.note-content ul { margin-bottom: 15px }
.note-content h1 { margin-top: 2rem; margin-bottom: 2rem; }
.note-content img { margin-bottom: 30px; }
a { color: var(--link-fg); text-decoration: none; }
hr { margin-top: 20px }
.footer-top { margin-bottom: 10px; }
p img { width: 50%; margin: 0 auto 0 auto; display: block }

iframe { width: 100% }

pre[class="language-_html_"] {
	background: none !important;
	text-align: center !important;
}

.footer-top a:first-child::before {
	color: black;
	content: "♦ ";
}

.footer-top a::after {
	color: black;
	content: " ♦ ";
}

nav { font-size: 1.2rem; }

nav h1, nav h2 {
	font-size: 2rem;
	font-weight: 400;
}

footer {
	text-align: center;
	border-top: 1px solid var(--border-color);
	margin-top: 1rem;
	padding-top: 1rem;
	margin-bottom: 10%;
}

.note-title { text-align: center; margin-bottom: 5rem; font-size: 4rem; }

code { word-wrap: break-word; }

.flex-col-1 { flex-basis: 20%; }
.flex-col-2 { flex-basis: 70%; padding: 0 20px 0 20px; }

@media (max-width: 800px) {
	body {
		margin-left: var(--side-spacing-mobile);
		margin-right: var(--side-spacing-mobile);
	}

	.flex-col-2 { width: 100% }
	.flex {
		flex-direction: column;
	}

.flex-col-2 { padding: 0 }
}