/* 
    Document   : style.css
    Created on : 08-Jun-2009, 11:59:40
    Author     : David Johnson
    Description:
        Test for New 6th and Lucas Site (amended)
*/

body {
    background:url('twirl.gif');
    margin:0;   /*Remove default margin*/
    padding:0
}
/*This is the containing div against the body background.
The auto margin balances space between left and right = centered.*/
div#wrap {
    position:relative;
    width:800px;
    height:700px;
    margin:auto;
    background:url('bg.jpg') repeat-x;
}
/*The header contains the logo, address and site menu*/
div#header {
    position:relative;    
}
/*The logo image. Position info not really needed as it will be
automatically top left, but just to show you can put it anywhere!*/
div#header img {
    position:absolute;
    top:0px;
    left:0px;
    width:258px;
}
/*Address block to right of logo. (Logo is 0 to 257 px = 258px wide so start
address block at 258px. A useful tip when positioning is to give the block a
temporary background to make it show up, commented out below.*/
div#address {
    width:542px; /*From 800-258*/
    position:absolute;
    top:10px;
    left:258px;
    /*background:#999;*/
}
/*This formats the text in the address block*/
div#address p {
    color:#800000;
    text-align:center;
    font-family:Arial, sans-serif;
    font-style:normal;
    font-weight:bold;
    font-size:1em;
    margin:0;
    padding:0.1em;
}
/*The site menu block*/
div#menu {
    width:542px;
    position:absolute;
    background:transparent;
    top:100px;
    left:258px;
}
/*This formats the text in the menu block*/
div#menu p {
    color:black;
    text-align:center;
    font-family:Arial, sans-serif;
    font-style:normal;
    font-weight:bold;
    font-size:1.2em;
}
/*The behaviour of the links in menu block*/
div#menu a:link, div#menu a:visited, div#menu a:active {
    text-decoration: none;
    color: black;
}
div#menu a:hover {
    text-decoration: underline;
}
/*To control spacing of the vertical bars*/
div#menu span {
    padding-left:0.2em;
    padding-right:0.2em;
}
/*We make this sidebar align under the logo. The position
165px is just under the black bar of bg.jpg*/
div#sidebar {
    position:absolute;
    top:165px;
    width:258px;
    background:transparent;
    text-align:justify;
    padding-top:15px;
}
/*This formats the text in the sidebar*/
div#sidebar p {
    font-family: Arial, sans-serif;
    font-size:1em;
    color:black;
    padding-left:15px;
    padding-right:15px;
    margin-bottom:10px;
}
/*This block is where the slideshow etc is placed*/
div#content {
    width:542px;
    position:absolute;
    left:258px;
    top:165px;
    background:transparent;
}
/*For the slideshow images.
Positioned (0,0) in content block*/
div#content img {
    width:100%; /*of content block*/
    position:absolute;
    padding:0;
    top:0;
    left:0;
    border:none;
}
/*The iframe used for the location map*/
div#content iframe {
    width:80%;  /*of content block*/
    height:450px;
    margin-left:10%;
    margin-top:20px;
}
/*The link below the map on location page*/
div#content a {
    color:#0000FF;
    font-size:90%;
    margin-left:10%;
}
/*The following is layout for contact form*/
div#content table {
    width:450px;
    margin:auto;
    margin-top:20px;
}
/*The LH td has been given a class=label so that
it can be styled independently*/
div#content td.label {
    width:8em;
    text-align:right;
    vertical-align:top;
    font-size:1.2em;
    color:#800000;
    height:3em;
}
/*This is for the RH td with the input elements*/
div#content td {
    vertical-align:top;
    height:3em;
}
/*The input for text and textarea*/
div#content input {
    margin-left:1em;
    background:#ddeaf8;
    padding:0.4em 0 0.4em 0;
}
div#content textarea {
    margin-left:1em;
    background:#ddeaf8;
    padding:0.4em 0 0.4em 0;
}
div#content input.button {
    width:5em;
    height:2.5em;
    font-size:1.2em;
    margin:0.2em 0 0.2em 1em;
}
/*The sidebar contact information*/
div#sidebar p.contact {
    color:#800000;
    font-size:1.2em;
    font-weight:bold;
    text-align:center;
}






ul {
  padding: 0;
  margin: 0;
  list-style: none;
  }
li {
  float: left;
  position: relative;
  width: 10em;
  }
li ul {
  display: none;
  position: absolute; 
  top: 1em;
  left: 0;
  }
li > ul {
	top: auto;
	left: auto;
	}
li:hover ul { display: block; }





/*This is the email link in the sidebar*/
div#sidebar a {
    font-family: Arial, sans-serif;
    color:#800000;
}
/*ENDS*/