body {
  width:716px; /* total width of everything*/
  margin-left:auto;
  margin-right:auto;
  font-family:sans-serif;
}

div {
  text-align:center;
  margin:auto;
}
a {
  text-decoration:none;
  color:black;
}

#header {
  /* put the URL to your source image between the '' for header background image
     (144px by 696px or larger [it'll crop the bottom and sides if larger];
     smaller images will repeat) */
  background:url('http://www.jenxer.com/siteimages/headerw.jpg') center top;
  padding:0 15px 0 15px;
  margin:20px 10px 12px 10px;
  height:144px;
}
#headtitle {
  font-size:4em;
  font-weight:700;
  display:block;
  position:relative;
  top:20px;
}
#subtitle {
  font-size:2em;
  font-weight:600;
  line-height:1.5em;
  position:relative;
  bottom:-20px;
  display:block;
}

/*change the filenames to reflect correct content*/
/*see html source for where these items link*/

#box1 { background:url('http://www.jenxer.com/siteimages/paintingw.jpg') center center; }
#box1:hover { background:url('http://www.jenxer.com/siteimages/paintinghover.jpg') center center; }

#box2 { background:url('http://www.jenxer.com/siteimages/sculpturew.jpg') 60% 87%; }
#box2:hover { background:url('http://www.jenxer.com/siteimages/sculpturehover.jpg') 60% 87%; }

#box3 { background:url('http://www.jenxer.com/siteimages/drawingw.jpg') 61% 18%; }
#box3:hover { background:url('http://www.jenxer.com/siteimages/drawinghover.jpg') 61% 18%; }

#box4 { background:url('http://www.jenxer.com/siteimages/blogw.jpg') center center; }
#box4:hover { background:url('http://www.jenxer.com/siteimages/bloghover.jpg') center center; }

#box5 { background:url('http://www.jenxer.com/siteimages/comicsw.jpg') 75% 35%; }
#box5:hover { background:url('http://www.jenxer.com/siteimages/comicshover.jpg') 75% 35%; }

#box6 { background:url('http://www.jenxer.com/siteimages/contactw.jpg') 45% 20%; }
#box6:hover { background:url('http://www.jenxer.com/siteimages/contacthover.jpg') 45% 20%; }

#box7 { background:url('http://www.jenxer.com/siteimages/Avatarsw.jpg') 45% 20%; }
#box7:hover { background:url('http://www.jenxer.com/siteimages/Avatarshover.jpg') 45% 20%; }

#box8 { background:url('http://www.jenxer.com/siteimages/aboutw.jpg') center center; }
#box8:hover { background:url('http://www.jenxer.com/siteimages/abouthover.jpg') center center; }

#box9 { background:url('http://www.jenxer.com/siteimages/placeholder.jpg'); }

.row {
  display:block;
  height:168px;
}

.box {
  display:inline-block;
  overflow:auto;
  width:216px;
  height:144px;
  margin:10px;
}

/* comment out to display third row */
/* #row3 { display:none } */

#footer {
  font-size:.65em;
  color:gray;
  position:relative;
  bottom:-50px;
}