body {
	background-color: var(--main-bg);
	background-image: var(--main-bg-img);
	background-attachment: local;
}

/* --------- General styling ------------ */

/* Setting the max width of everything to be an accessible size */
footer, main {margin: 0 auto; padding: 0em; max-width: 100%;}

/* Font settings */
body {
	font-family: var(--body-font), sans-serif;
	font-size: 1em;
	line-height: 1.5em;
	overflow-x: hidden;
	color: var(--body-text);
	padding: 0em;
	height: 100%;
}

main p {margin: .5em;}

ul li{display: block; font-weight:bold;}
ul li:before {content: "☞ ";}
ul ul li{font-weight: normal; font-style: italic;}

/* Creating stylized segments */
.block {
  margin: 0 0 .5em 0;
  border: solid;
  border-width: 0 0 0 4px;
  border-color: var(--border-color);
  padding: .5em;
}
.block h3{margin: 0; font-family: var(--title-font);}
.block h3:before {content: "☞ ";}
.block p{font-style: italic;}
.block a:hover{background: white; transition-duration: .5s;}

.imgwrapper {width: 100%; margin: .2em auto .2em auto; text-align: center}
.imgwrapper p{margin: 0; font-style: italic}

main {
	margin: 0;		/* Keep main flush to header */
	overflow-x: hidden;	/* No horizontal scrollbar, though */
}

/* Color links */
main a:link {color: var(--link-text);}
nav a:link {color: var(--link-text);}
main a:visited {color: var(--link-text);}
nav a:visited {color: var(--link-text);}

/* -------- Hover and focus ------------- */
nav a:hover, header a:hover, p a:hover, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, li a:hover, sup a:hover {background-color: white; transition-duration: .5s;}/* Makes link background white on hover. This is so long because I had to name everything in order to keep images out. If a link in a new bracket won't look right on hover, you probably just need to add it to this! */	
a:hover img{background-color: transparent; opacity: 0.5; transition-duration: .5s;}/* Dim images on hover */
*:focus {outline: 2px solid var(--focus-outline);}	/* Outline focused items */

img {max-width: 100%;}	/* Keep images inside main! */

/* Horizontal rule / the line */
main hr{background: var(--border-color); height: 3px; padding: 0; border: none; margin: 0.5em 0;}