@import url('https://fonts.googleapis.com/css2?family=McLaren&family=Quicksand|Shadows+Into+Light&display=swap');
body {
	font-family: 'Quicksand', sans-serif;
	margin: 0; /* Remove all body margins */
	font-size: 120%;
	background-image: url(https://imgur.com/NDL9DsY.jpg);
}
header{
	display: flex;
	align-items: center;
	background: #000000;
}
header h1{
	font-family: 'Shadows Into Light', cursive;
	font-size: 400%;
	font-weight: lighter;
	color: orange;
}
a {
  margin-left:10px;
  color: Black;
}
a:visited {
  color: orange;
}
a:hover {
  color: black;
}
nav{
	background-color: #919191;
	border-top: solid black 1px;
	border-bottom: solid black 1px;
	border-right: solid black 1px;
	border-left: solid black 1px;
	display: flex; /* Display the children of this element as flexible box */
	align-items: center; /* Align child flexible boxes in the vertical center*/
}
nav p{
	text-align: center;
	flex-basis: 100px; /* Give each paragraph the same basic width */ 
	flex-grow: 1; /* Allow each paragraph to grow evenly to fill up the parent nav element */
	margin-left:10px;
}
nav a {
	color: white;
	text-decoration: none;
	font-weight: bold;
}
nav a:hover{
	color: black;
}
ul {
  list-style: none; /* Remove default bullets */
}

ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: red; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}
p {
	margin-left:10px;
}
footer{
	background-color: #919191; /* background or background-color both work */
	position:fixed; /* fix to the viewport */
	bottom: 0; /* Start 0 pixels from the bottom of the viewport */
	left: 0; /* Start 0 pixels from the left of the viewport */
	width: 100%; /* Set the width to 100% of the viewport */
	height: 3em; /* Set the footer elements height to 3 times larger than its current font size */
	border-top: solid black 1px; /* Have to put the unit, e.g. px or %, if not zero */
}
h1, h2 {
	color: #000000;				
	font-family: 'McLaren', cursive; 
	margin-left:10px;
}
h3 {
	margin-left:10px;
}
.main {
	margin-left: 1em;
	margin-right: 1em;
	margin-bottom: 4em;
}
.center {
	text-align: center;
}
.wrap{
	float: right;
}
.caption {
	font-style: italic;
	font-size: small;
}