/* class selector */   
.past {
    text-align: center;
}
/* element selector */
body {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-image: url("images/yes.jpg");
}
.present {
    text-align: center;
}
/* id selector */
#second {
    color: violet;
}
/* I turned the img into a block so I would be able to move it around the page easier. */
img {
    display: block;
    margin-right: auto;
    margin-left: auto;
    width: 500px;
    height: 500px;
}
.future {
    text-align: center;
}
/* This is the code for the box model */
.box {
    width: 200px;
    height: 100px;
    padding: 20px;
    border: 5px solid blue;
    margin: auto;
    background-color: grey;
}
h1 {
    background-color: grey;
}
p {
    background-color: black;
}
article {
    background-color: blueviolet;
}
#first {
    color: violet;
}
#third {
    color: violet;
}