body { 
  margin: 0px; 
}
h1, h2, .main p.title { 
  font-weight: bold; 
  text-align: center; 
}
h1, .home, .contact, .archive, .links, .enter, .last-month, .next-month {
  font-size: xx-large;
  font-weight: bold; 
}
h2 { font-size: x-large; }

.main p.title, .main h1.title {
  font-size: 300%;
  filter: drop-shadow(0.2ex 0.2ex 0.1ex rgba(128,128,128,0.5));
/*  border: 2pt solid black; */
  margin-top: 5px;
  margin-bottom: 5px;
}

blockquote { margin-left: 40px; margin-right: 40px; }
.Dave  { font-family: serif;      font-style: normal; color: black; }
.Ann   { font-family: sans-serif; font-style: normal; color: rgb(128,0,0); }
.David { font-family: serif;      font-style: italic; color: blue; }
.Katy  { font-family: serif;      font-style: normal; color: green; }
.Emily { font-family: sans-serif; font-style: italic; color: magenta; }
.James { font-family: serif;      font-style: italic; color: rgb(64,64,0); }

/* <div class="main">...</div> contains the main part of the page. */
.main { 
  display: block;
  width: 800px; 
  position:relative; 
  border-width: 0px; border-color: rgb(0,0,0) ; border-style: solid; 
  margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 10px;
  padding: 1em;
  text-align: left; 
  box-shadow: 3px 5px 10px gray;
}
.main p { 
  line-height: 140%; 
  text-align: justify;
}

.image-center {
  margin-left: auto;
  margin-right: auto;
}
.image-right, .image-left {
  margin-top: 0px;
  margin-bottom: 10px;
}
.image-right { 
  float: right;
  margin-left: 20px;
  margin-right: 0px; 
}
.image-left { 
  float: left; 
  margin-left: 0px;
  margin-right: 20px;
}
p.image-border, td.image-border {
  border-left:   10px solid #ddd; 
  border-top:    10px solid #aaa; 
  border-bottom: 10px solid #777; 
  border-right:  10px solid #333;  
  padding: 0px;
  margin: 0px;
  line-height: 0px;  /* Needed to remove a small space under the image caused
                      * by the leading. */
}
a img.shadow {
  box-shadow: 5px 5px 10px rgba(50,50,50,0.5);
}
a:hover img.shadow {
  box-shadow: 5px 5px 10px rgba(0,0,128,0.5);
}
p.cap {
  font-weight: normal;
  text-align: center;
  margin-top: 5px;
}


/* These classes are used for the navigation buttons and for the Click to Enter
 * button on the entry page. */
.home, .contact, .archive, .links, .enter, .last-month, .next-month {
  border-style: none;
  border-width: 0px;
}
.home, .contact, .archive, .links {
  text-decoration: none;
}
.bshadow {
  filter: drop-shadow(0.2ex 0.2ex 0.1ex rgba(128,128,128,0.5));
}
a::hover.bshadow {
  filter: drop-shadow(0.2ex 0.2ex 0.1ex rgba(128,0,0,0.5));
}
.next-month { float: right; }
.main .enter {
  width: 334px;
  height: 57px;
  background-image: url("../images/ClickToEnter.png"); 
}
.main .enter:hover {
  background-image: url("../images/ClickToEnterHover.png"); 
}
.next-month {
  width: 153px;
  background-image: url("Archive/images/NextMonth.png"); 
}
.next-month:hover {
  background-image: url("Archive/images/NextMonthHover.png"); 
}
.last-month {
  width: 149px;
  background-image: url("Archive/images/LastMonth.png"); 
}
.last-month:hover {
  background-image: url("Archive/images/LastMonthHover.png"); 
}

/* This is for the table used to format the links to Archive pages. */
.archive-table {
  margin-left: auto;
  margin-right: auto;
}
.archive-table ul {
  list-style-type: none;
}

/* Font families */
h1, h2, h3, p.title, .home, .contact, .archive, .links, .enter, .last-month, .next-month {
/*  font-family: "Ubuntu", sans-serif; */
  font-family:  sans-serif;
  font-style: italic; 
}
.main {
  font-family: serif;
}
p.cap {
  font-family: serif;
  font-style: italic;
}

/* Colours */

body { 
  background: rgb(240,240,240);
}
.main,
.home,
.contact, 
.archive, 
.links, 
.enter, 
.last-month, 
.next-month { 
  background-color: rgb(255,255,255); 
}
h1, h2 {
  color: black
}
a:link, a:visited { 
  color: rgb(0,0,128);
  text-decoration: none;
}
a:hover, a:visited:hover { 
  color: blue 
  /* text-decoration: none; */
}