/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*Create a mobile website about the past, present, and future you.

SITE REQUIREMENTS

Create a new folder for this site
Create an images folder inside of this folder
Open the folder in VS Code (should only see this folder and its contents)
Website will be 1 page:
me.html will include 3 sections (past, present, future)
Include comments in both html and css files
Use correct doctype
Use the following html 5 semantic tags
header
article
section
footer
Images
At least 1 image in the content -  must include alt attribute
At least 1 background image (can be on body or other element)
All images must be relative links
External style sheet that uses the following selectors
element (tag)
class
id
Show use of box model css properties 
padding
margin
border
Web site must be readable with appropriate color scheme
Validate your html and css code
Submission

You will submit a link to your site after uploading to the server

We will set up web servers on Thursday, August 22, so that  you can upload site for testing and grading.*/


body 
{
background-color: azure;
}
/*having a bar of color with words at the top looks good*/
header {
    text-align: center;
    background-color: rgb(107, 129, 255);
	padding: 2%;
}
/*bigger font helps the visualy impaired*/
h1 {
    font-size: 35;
}
/*having big words on the header hust looks better*/
#dingus{
	font-size: xx-large;
}
/*this helps distinguish from the rest of the paragraph*/
#bungus{
	font-size:larger

}
/*puts image at center*/
.image {
    width: 25%;
    border: 10px solid rgb(30, 5, 90);
    padding: 10px;
    margin: 0px;
	text-align: center;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
/*the background image is a solid color :3*/

footer {
	background-image: url("Images/darkblue.jpg");
    width: 100%;
	padding: 2%;
	text-align: center;
    color: aliceblue;
}
/*just adds detail that does not compare(extra border)*/
.thing {
    width: 96;
    border: 10px solid rgb(30, 5, 90);
    padding: 2%;
}
/*contains the words and images that are in the section*/
article {
    border: 2px solid black;
    padding: 1%;
}
section{
	background-color: rgb(255, 255, 255);
}
/*put the images in here because reasons*/
p2 {
	text-align: center;
}