/*
This file determines what the page looks like 
This section at the top is a comment - it is ignored by the browser.
*/

/* This will contain our main content. */
div.main {
    background-color:white;
    width:800px;
    margin-left:auto;
    margin-right:auto;
}

div.footer
{
    padding:0.5em;
    color:gray;
    background-color:#ADD8E6;
    /*opacity:0.2;*/
    clear:left;
}

div.header
{
    width:800px;
    height:160px;
    background-image:url("http://lh5.ggpht.com/_lewp47C9PZI/SxokALE-EiI/AAAAAAAAAto/tJam5JGU2ek/s800/Another%20Panorama%20of%20Lake%20Te%20Anau.jpg");
    background-repeat:no-repeat;
    background-position: top center;
}

h1.header
{
    padding:0;
    margin:0;
    color:black;
    font-family: "Helvetica", sans-serif;
    /*background-color:gray;*/
}

/* Usually a div like this is used for the navigation bar. */
div.nav
{
    float:left;
    width:100%;
    padding:0;
    margin-left:auto;
    margin-right:auto;
    list-style-type:none;
}
/* This references that same div by ID, this allows for style inheritance. */
#nav a
{
    
    width:6em;
    text-decoration:none;
    color:white;
    background-color:black;
    padding:0.2em 0.6em;
    border-right:1px solid white;
}
#nav a:hover {background-color:#ff3300}
#nav li {display:inline}

div.content{
    display:none;
    font-family: "Helvetica", sans-serif;
    padding-left: 15px;
    width:785px;
}

/* The body contains everything else, so if we wanted to apply something to everything
on the site - we could do so here. */
body {
    /*background-image:url("http://www.post-gazette.com/images4/20070207ho_ArtBrush_230.jpg");
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:right;
*/
    /*background-image:url("http://static3.grsites.com/archive/textures/dgren/dgren016.jpg");*/
    background-image:url("http://static1.grsites.com/images/fadestrip2.png");
    background-repeat:repeat-x;

}

/* This is a horizontal line, here we simply say what color it will be. */
hr {color:gray;}  

/* This defines all paragraph styles. */
p {
    margin-left:20px;
    font-family:"Helvetica", sans-serif;
}

/* This defines a particular paragraphs style. 
Only <p class="two"> paragraphs will use this.
*/
p.two
{
    border-style:groove;
    border-width:medium;
    margin:10px; /* This is the margin (outside of the box). */
    padding:20px; /* This is the internal padding (inside the box).*/
}

/* This defines the heading three tag as red, 30% across to the right and size 8pt. */
h3{
    color:red;
    margin-left:30%;
    font-size:8pt
}
/* This defines all sub-headings as green. (Will over-rule the red due to order on page). */
h2,h3,h4,h5,h6
{
    color:green
}
/* Define style of lists... Try change in the content class square to circle... */
ul.circle {list-style-image:url('http://www.stilwellgray.co.uk/assets/images/small_circle.gif');}
ul.square {list-style-type:square}