p {
	color: black;
	line-height: 1.5;
	text-align: left;
	background-color: transparent;
	margin-left: 100px;
	margin-right:100px;
	padding: 20px;
}

a {
	color: purple;
	font-weight: bold;
	border-style: dashed;
	border-width: 3px;
	border-left-width: 5px;
	border-right-width: 5px;
	border-color: white;
	padding: 5px;
	line-height: 1.5
	
	/* By the way, that makes something that looks ugly as fuck, fwiw. */
	
	}
	
	body {
		font-size: 18px;
		color: #7c50ba;
		background-color: #e1e8ed;
		font-family: "Times New Roman"
	}
/*The above establishes what font the website should display in, in order of preference. Not all computers/browsers have the same fonts installed; while there are very common options, and there are other methods that you can use, but for now this is straightforward. */

/*font-style states whether the font is italic or not. It can have a value of "italic" or "normal". */
	
	
	ul {
		color: navy;
		font-style: italic;
		margin-left: 100px;
		margin-right: 100px;
	}
	
		
h1 {
	color: #5a417a; /*Color display is a little odd but I think it depends on what tags are containing what. My header text color wasn't working here until I removed the <p> tags that it was also contained by, but now it works. */
	background-color: #bdb6e3; 
	font-variant: small-caps;
	/* There are a few font-weight and similar options. You have font-weight: bold and font-weight: normal, as well as font-style: italic, font-variant: small-caps, and text-transform: uppercase. */
	font-size: 2em;
	text-align: center;
	margin-left: 50px;
	margin-right: 50px;
	padding: 5px;
	
}
	
h2 {
	font-size: 1.5em;
	background-color: transparent;
	margin-left: 100px;
	margin-right: 100px;
	padding: 5px;
	
	/*Margins, padding, and borders are a part of something called the "box model". This refers to the matroyshka doll that is the element box inside the padding box inside the border box inside the margin box. "Box model" is a much easier way to think about it. 
	
	Most importantly, the box model can be applied to *every* element on the page, not just text. */
	
	}
	
/* Welcome to CSS! This has a different way to add comments compared to HTML. If you're adding them while in the HTML doctype, you stash them within <style> tags so that the browser understands how to interpret them. Cool stuff!  */

/* Here are some general units used in CSS.
px (such as font-size: 12px) is the unit for pixels. It's also a soft property because of browser zoom and adaptability. It's kinda more "in relation to other text" than anything.

em (such as font-size: 2em) is the unit for the calculated size of a font. "2em" is two times the current font size. What does this do? Not sure. I'll have to mess around with it.
pt (font-size: 12pt) is the unit for points, and is mainly relevant for printed media. 
% (such as width: 80%) is for percentages.

Other units include pc (picas), cm (centimeters), mm (millimeters), and in (inches)

When a value is ZERO, no unit is needed. i.e. if you want to specify "no border", it would be border: 0. */

.item {
  border: 2px solid rgb(95 97 110);
  border-radius: 0.5em;
  padding: 20px;
  width: 10em;
}

.container {
  border: 2px solid rgb(75 70 74);
  border-radius: 0.5em;
  font: 1.2em sans-serif;
  text-align: center;

  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 500px;
  margin-right: 500px;
}