Footer CSS

Well I am new to CSS so forgive any coding faux pas. I wanted to customize the fonts and font styles and seem to have messed things up a bit. First, the footer text (my copyright) suddenly got huge. Have no idea how that happened. Tried to fix it with CSS code from another thread, but it did nothing. I also want bulleted lists to be the same size as body text (paragraph) but can’t seem to get that either. I want all text to be black instead of default grey, but that also seems inconsistent. Here is my custom CSS. Help would be appreciated.

Also: I am just editing custom CSS — should I have created a child first? Told you, I am new to this…

body {
	font-size: 100%;
}

h1 {
	font-family: "Century gothic", "Avant Garde", Arial, Tahoma, sans-serif;
	color: black;
	font-size: 2.7em;
}

h2 {
	font-family: "Century gothic", "Avant Garde", Arial, Tahoma, sans-serif;
	color: black;
	font-size: 2.3em;
}

h3 {
	font-family: "Century gothic", "Avant Garde", Arial, Tahoma, sans-serif;
	color: black;
	font-size: 2em;
}

p {
	font-family: "Century gothic", "Avant Garde", Arial, Tahoma, sans-serif;
	color: black;
	font-size: 1.5em;
}

ul {
	font-family: "Century gothic", "Avant Garde", Arial, Tahoma, sans-serif;
	color: black;
	font-size: 1em;
}

.entry-content img {
 	 	-webkit-box-shadow: none;
 	 	box-shadow: none;
}	 	}

/* Footer */
#footer-widgets .widget .widget-title {
	font-size: 1em !important;
	}