html, body
{
    color: rgb(110,123,139);
    /* Background colour */
    background-color:#999999;
}
br.header_gap
{
    color:#999999;
}
/* Defines the actual page paraters */
.page
{
    background-color: white;
    font: 0.95em Verdana, Arial, Helvetica, sans-serif;
    margin-left: auto;
    margin-right: auto;
    width:758;
    // ensure right scroll bar so as pages are always the same width
    height:2048;
}

/* default link formatting.  How the links are styled unless otherwise defined. */
a:link      { color: rgb(37,66,255); text-decoration: underline;}
a:visited   { color: rgb(91,91,91);  text-decoration: underline;}
a:focus     { color: rgb(91,91,91);  }
a:hover     { color: rgb(91,91,91);  }
a:active    { color: rgb(91,91,91);  }

/* Heading styles */
h1
{
    font-size: 2em;
    font-weight: normal;
    font-family: Platino, "Times New Roman", "Times Roman", Serif;
    color: rgb(110,123,139);
}

/* p styles */
p
{
    margin:0.1em;
    margin-left:5%;
    font-size: 1.1em;
    font-weight: normal;
    font-family: Platino, "Times New Roman", "Times Roman", Serif;
    color: rgb(110,123,139)
}
p.version
{
   display:none;
}
/* The area containing the banner image with name and logo. */
div.header
{
   padding:0;
   margin:0;
   width:100%;
   height:200px;
   clear:both;
}

/* This forces the images to scale to fit their div containers. */
div.header img
{
    width:100%;
    height:100%;
}

/* A container for the vertical columns which hides the extra height beyond the height required to accommodate the text. */
div.container
{
   margin: 0;
   padding: 0;
   overflow: hidden;
   background-color:white;
}

/* The main column that contains the text. */
div.midcol
{
  color: rgb(50,50,50);
  background-color:white;
  line-height: 1.1em;
  width:95%;
  margin-left:2%;
  margin-right:0%;
  padding-top: 0;
  float:left;
  padding-bottom: 2000px;
  margin-bottom: -2000px;
}

/* Give style to the unordered list (called navlist) that makes the navigation. */

.navbar ul
{

    margin: 0;
    list-style: none;
    padding-left: 2.2em;
    background-color: rgb(176,196,222); /* This is the colour of the full width bar. */
    font-size: 0.85em;
    font-weight: 500;
    font-family: Platino, "Times New Roman", "Times Roman", Serif;
    color: rgb(110,123,139);
    height: 2.4em;
}


.navbar ul li, .container ul li
{
    display: inline;
}


.navbar ul li a
{
    text-decoration: none;  /* Prevents the underline showing on the navigation links. */
    padding: 1.2em 2.3em;  /* Controls how big the buttons look. */
    color: rgb(110,123,139);
    background-color: rgb(230,230,250);
    border-left: 0.2em solid white;
    border-top: 0.2em solid white;
    border-right: 0.2em solid white;
}

.navbar ul li a:hover
{
    color: rgb(110,123,139);
    background-color: white;
}



/* Give style to the unordered list (called crumbs) that makes the breadcrumb trail. */

.crumbs ul
{
    margin: 0;
    padding: 0;
    list-style: none;
    float: left;
}

.crumbs li
{
    /*font-size: 8pt;*/
    font-size: 0.7em;
    display: inline;
    float: left;
    padding-left: 1em;
}

.crumbs li a
{
    /*font-size: 0.6em;*/
    text-decoration: none;  /* Prevents the underline showing on the navigation links. */
    background:url(crumb.png) no-repeat right center;
    padding-right: 3em;
}


/* Style the "tab" for the current page. */
#photos .photos, #contact .contact, #index .index
{
   background-color: white;
}


/* Hide the skip navigation link. */
.hide a, .hide a:hover, .hide a:visited
{
   position: absolute;
   left: 0;
   top: -500px;
   width: 0;
   height: 0;
   overflow: hidden;
}

div.photo
{
   margin: 10%;
}
img.photo{
    width: 220px;
    height: 138px;
}

table.photo {
    border-width: 1px;
    border-spacing: 2px;
    border-style: outset;
    border-color: gray;
    border-collapse: separate;
    background-color: white;
}
th.photo
{
    border-width: 1px;
    padding: 1px;
    border-style: inset;
    border-color: gray;
    background-color: white;
    -moz-border-radius: 0px 0px 0px 0px;
}
td.photo
{
    border-width: 1px;
    padding: 1px;
    border-style: inset;
    border-color: gray;
    background-color: white;
    -moz-border-radius: 0px 0px 0px 0px;
    width=25%;
}

.main_section
{
    width:          100%;
    cellspacing:    15;
}
td.main_section_menue
{
    cellpadding:    0;
    cellspacing:    0;
    width:          20%;
    vertical-align: top;
    padding: 0px;
    border-style: inset;
    border-color: blue;
    background-color: white;
    -moz-border-radius: 10px 10px 10px 10px;
    border-width: 1px;
}
td.main_section_content
{
    // width define by the menue and the tight borare
    // not minium width controlled by something else
    // not sure what????????
    width:          80%;
    vertical-align:         top;
    padding: 1px;
    border-width: 1px;
    border-style: inset;
    border-color: blue;
    background-color: white;
    -moz-border-radius: 10px 10px 10px 10px;
}
td.main_section_right
{
   width:          0%;
   background-color: white;
}
p.main_section_menue_header
{
    padding:2px;
    margin:0;
    font-size: 2em;
    font-weight: normal;
    font-family: Platino, "Times New Roman", "Times Roman", Serif;
    background-color: blue;
    color: white;
    -moz-border-radius: 10px 10px 10px 10px;
}
p.photo_title
{
    text-align: center;
}
a.index_2
{
    font-size: 11px;
    margin:20px;
}
td.image
{
    border-color: white;
}
a.image
{
    vertical-align:right;
    border-color: white;
    margin-left: auto;
    margin-right: auto;
}
.centeredImage
{
    text-align:center;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
    background-color: white;
}