<!--

/**
* CSS selector attribute order
* -- dimensions (wxh)
* -- display type (visible/hiddle,block/inline)
* -- position (absolute,relative,top,left)
* -- floating
* -- borders
* -- content margin
* -- content padding
* -- background
* -- font & text properties (text-align, font, line-height)
* -- other decoration
*/

/**
* Global element styles
*/
body {
  width: 794px;
  margin: 3px auto 0 auto;
  padding: 0;
  background-color: #e3e3e3;
  color: #303030;
}

img {
  border: 0;
}

/**
* ID Definitions
*/
div#header {
  width: 755px;
  height: 46px;
  border: 3px solid white;
  background-image: url('../images/header_bg.jpg');
  background-repeat: repeat-x;
}

div#header #headerimg {
  display: inline;
  float: left;
  margin-top: 2px;
}

div#header #headertext {
  margin-right: 30px;
  text-align: right;
  font: 12px/14px sans-serif;
  line-height: 46px;
  color: #000000;
}

/* Top Of Page Navigation Bar */
div#nav {
  width: 755px;
  height: 27px;
  border: 3px solid white;
  margin: 5px 0 0 0;
  padding: 0;
  background-image: url('../images/nav_bg.jpg');
  background-repeat: repeat-x;
  line-height: 1.5em;
}

div#nav ul {
  margin: 0 0 0 15px;
  padding-top: 2px;
}

div#nav>ul {
  padding: 0;
}

div#nav li {
  display: inline;
}

div#nav li img {;
  vertical-align: middle;
  padding-top: 5px;
}


div#nav li>img {;
  vertical-align: middle;
  padding-top: 3px;
}

div#nav a {
  font: 10px/12px sans-serif;
  color: #000000;
}

div#nav a:link, div#nav a:visited {
  text-decoration: none; 
  color: #000000; 
}

div#nav a:hover, div#nav a:active {
  text-decoration: underline;
  color: #2f8cba;
}

.active_topnav {
  color: #2f8cba;
  font: 16px verdana;
}

/* End of Navigation Bar Definitions */


/**
 * The banner div comprised 3 image elements
 * a base image, the postcards which overhang the edge of the image
 * and a 'hotspot' link.
 *
 * @todo This can be optimised by making a much smaller overhang image
 * rather than overlaying two largish images which are otherwise the same ...
 */

div#banner {
  width: 747px;
  position: relative;
  border: 7px solid white;
  margin: 5px 0 0 0;
  background-color: #fff;
}

div#banner #background {
}

div#banner #postcards {
  position: absolute;
  top: 1px;
  left: 429px;
}

div#banner #hotspot {
  position: absolute;
  top: 200px;
  left: 631px;
}

/* contains the of blocks */
div#blocks {
  width: 745px;
  height: 105px;
  border: 7px solid white;
  padding-left: 2px;
  background-color: #fff;
  font: 10px/12px sans-serif;
  color: #485d51;
}

div#blocks a:link, div#blocks a:visited, div#blocks a:hover, div#blocks a:active {
  text-decoration: underline;
  color: #485d51;
}

/* contains the left of the three blocks */
div#block_l {
  width: 236px;
  height: 95px;
  float: left;
  padding-top: 5px;
  background-image: url('../images/block_tour.png');
  background-repeat: no-repeat;
}

div#block_l #block_l_text {
  margin-top: 65px;
  margin-left: 18px;  
}

/* centre block */
div#block_c {
  width: 236px;
  height: 95px;
  float: left;
  padding: 5px 0 0 0;
  margin: 0 0 0 20px;
  background-image: url('../images/block_gethere.png');
  background-repeat: no-repeat;
}

div#block_c #block_c_text {
  margin: 65px 0 0 16px;
}

/* right block */
div#block_r {
  width: 236px;
  height: 95px;
  float: right;
  padding: 5px 0 0 0;
  background-image: url('../images/block_kids.png');
  background-repeat: no-repeat;
}

div#block_r #block_r_text {
  margin-top: 65px;
  margin-left: 16px;
}

div#footer {
  width: 751px;
  padding: 5px;
  margin: 0;
  background-color: #fff;
  font: 8px/12px sans-serif;
  color: #b0b0b0;
}

div#footer a {
  font: 8px/12px sans-serif;
  color: #b0b0b0;
}

div#footer a:link, div#footer a:visited {
  text-decoration: none;  
}

div#footer a:hover, div#footer a:active {
  text-decoration: underline;
}

div#footer_content {
  height: 25px;
  border: 1px solid #ccc;
  padding: 6px;
}

div#footer_content #footer_content_left {
  float: left;
  margin-right: 105px;
  padding-top: 5px;
  line-height: 175%;
}

div#footer_content_left img {
  float: left; 
  padding-right: 15px;
}


div#footer_content #footer_content_center {
  float: left;
  padding-top: 5px;
  line-height: 175%;
}

div#footer_content #footer_content_right {
  float: right;
  margin-right: 15px;
  text-align: center;
}

div#footer_content_right img {
  display: block;
}