body {
    font-family:Verdana,Arial,Helvetica,sans-serif;
    font-size:100%;
    color:black;
    background-color:gray;
}

/* increase font-sizes and set margins */
h1 {
    font-size:2.5em;
    margin-bottom:0.5em;
}
h2 {
    font-size:2.0em;
    margin-bottom:0.5em;
}
h3 {font-size:1.25em;}
p {font-size:1em;}

a:link {color:mediumblue;}
a:visited {color:purple;}
a:hover {color:blue;}
a:active {color:red;}

/* center column */
.center {
    margin-left:auto;
    margin-right:auto;
    margin-top:1em;
    margin-bottom:1em;
    width:75%;
    min-width:550px;	/* change with image width */
    max-width:1000px;
    background-color:white;
    padding:5px 25px 25px 25px;
    border:1px solid black;
    border-radius:10px;
    -moz-border-radius:10px;	/* Firefox 3.6 and earlier */
}

p.subtitle {
}

.story {
    /*border:1px solid black;*/
}

.storybody {
    text-align:justify;
}

/* date story was posted */
.date {
    font-style:italic;
}

/* images in story */
.storybody img {
    display:block;
    margin-left:auto;
    margin-right:auto;
    margin-top:30px;
    margin-bottom:30px;
    /*border:1px solid black;*/
    border:1px solid gray;
    -moz-box-shadow: 11px 10px 20px #888888; /* Firefox 3.6 and earlier */
    box-shadow: 11px 10px 20px #888888;
}

/* container for img, link and optionally caption */
span.imgcontainer {
    display:block;
    margin-left:auto;
    margin-right:auto;
    width:502px;    /* adapt to image width */
    font-size:0.875em;
    font-style:italic;
    text-align:center;
}

.imgcontainer img:hover {
    -moz-box-shadow: 5px 5px 20px #888888; /* Firefox 3.6 and earlier */
    box-shadow: 5px 5px 20px #888888;
    border:1px solid black;
}

/* blog title link */
a.titlelink:link {color:black;text-decoration:none;}
a.titlelink:visited {color:black;text-decoration:none;}
a.titlelink:hover {color:black;text-decoration:none;}
a.titlelink:active {color:black;text-decoration:none;}

/* title of a story */
a.title:link {color:black;text-decoration:none;}
a.title:visited {color:black;text-decoration:none;}
a.title:hover {color:blue;text-decoration:none;}
a.title:active {color:red;}

/* horizontal navigation bar */
div.navbar {
    background-color:black;
    margin-bottom:1.75em;
}

.navbar ul {
    list-style-type:none;
    margin:0;
    padding:0;
    overflow:hidden;
}

.navbar li {
    float:left;
}

.navbar a:link, .navbar a:visited {
    display:block;
    color:white;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    padding:0.5em 1.625em;
}

.navbar a:hover, .navbar a:active {
    color:black;
    background-color:lightgray;
}

/* use div element as horizontal rule */
div.hrule {
    height:0.125em;
    color:black;
    background-color:gray;
}

a.seemore {
    font-weight:bold;
}

/* title image */
img.titleimg {
    display:block;
    width:100%;
    max-width:1000px;
}

/* hint that js should be enabled */
p.jsinfo {
    background-color:yellow;
    border:1px solid black;
    padding:0.25em 0.25em;
}

/* copyright statement */
p.copyright {
}