/* Inheriting Box Sizing */

html {
	box-sizing: border-box;
}

*,
*:before,
*:after {
	box-sizing: inherit;
}

/* Makes footer always be at bottom of pages, even on short pages */
html,
body {
	min-height: 100vh;
	box-sizing: border-box;
	scroll-behavior: smooth;
}

body {
	display: flex;
	flex-direction: column;
}

iframe {
	max-width: 100%;
}

/* https://remysharp.com/links/2020-08-26-9d483db3 */
:focus:not(:focus-visible) {
	outline: none;
}

/* https://piccalil.li/quick-tip/add-scroll-margin-to-all-elements-which-can-be-targeted */
/* You can use calc() on this to offset the height of your fixed menu. */
[id] {
	scroll-margin-top: 103px;
	/* height of header */
}

/* https://frontendmasters.com/blog/inset-auto-for-popovers/ */
[popover] {
	inset: auto;
}