/* Style sheet for the main document */

/* Make all body text dark grey, with no top margin */
body {font-family: Verdana, Arial, sans-serif;
      font-size: 76%; /* Results in 12 pixel text when the base size is 16 pixels */
      color: #333333; /* Dark grey text */
      margin: 0 0.5em 0.5em 0.5em;
      padding: 0;
      width: 56em;} /* 50em = Less than 800 pixels wide (for 800x600 screen resolution) */

/* Format text size links */
#textSize {
      float: left;
      width: 30%;
      font-size: 0.8em;
      text-align: left;
      margin: 0 0 0 1em;
      line-height: 1.6em;}

/* Format top sign-in message */
#signed-in {
      font-size: 0.8em;
      text-align: right;
      line-height: 1.6em;
      margin: 0 1em 0 0;}

/* Format top navigation bar with sliding doors technique: */
/* www.alistapart.com/articles/slidingdoors */
#navbar {
      float: left;
      width: 100%;
      background: #DDEEFF bottom; /* #DDFFEE bottom; */
      font-size: 0.8em;
      color: black;
      border: 1px solid black;
      line-height: normal;}

#navbar #current {
      font-weight: bold;      
      background-image: url("navbar/tab-right-on.gif");}

#navbar #current a {
      color: black;
      font-weight: bold;      
      background-image: url("navbar/tab-left-on.gif");}

#navbar ul {
      list-style: none; /* remove bullets */
      margin: 0 0 0 2em;
      padding: 1em 1em 0;} 

#navbar li {
      list-style: none; /* remove bullets */
      float: left;
      color: black;
      background: url("navbar/tab-right.gif") no-repeat right top;
      margin: 0;
      padding: 0;}

#navbar li:hover {
      color: black;
      background: url("navbar/tab-right-hover.gif") no-repeat right top;}

#navbar a {
      display: block; /* allows width and height settings on an element */
      float: left;    /* provided only to fix display in IE-Mac */
      height: 2em;
      line-height: 2em;
      color: black;
      background: url("navbar/tab-left.gif") no-repeat left top;
      padding: 0 1.2em 0 1.2em;
      text-decoration: none;
      text-align: center;} 

/* Commented backslash hack hides rule from IE5-Mac \*/
#navbar li a {float: none;}
/* End IE5-Mac hack */

#navbar li a:hover {
      color: black;
      background: url("navbar/tab-left-hover.gif") no-repeat left top;}
/* End sliding doors technique */

/* Format navigation path */
#path {
      float: left;
      width: 70%;
      font-size: 0.8em;
      text-align: left;
      margin: 0 0 0 1em;
      padding: 0 0 0.2em 0;
      line-height: 2em;}

/* Format main body */
#main {
      float: left;
      width: 94%; /* width + leftpad + rightpad = 100% */
      min-height: 35em;        /* Min-height fast hack: */
      height: auto !important; /* www.dustindiaz.com/min-height-fast-hack */
      height: 35em;            /* End min-height fast hack */
      margin: 0 0 1em 0;
      padding: 3% 3% 1% 3%;
      background: #DDEEFF bottom; /* #DDFFEE bottom; */
      font-size: 0.8em;
      border: 1px solid black;
      line-height: normal;}

/* Format sidebar for links */
#sidebar {
      float: left;
      width: 17%;
      margin: 0;
      padding: 0;
      background: #DDEEFF bottom; /* #DDFFEE bottom; */
      font-size: 1em;
      line-height: 1.8em;}

#sidebar ul {
      list-style: none; /* remove bullets */
      margin: 0;
      padding: 0;} 

#sidebar li {
      list-style: none; /* remove bullets */
      margin: 0;
      padding: 0;}

/* Format right side for text */
#rightside {
      margin: 0 0 0 18%; /* left margin 1% greater than sidebar width */
      padding: 0 0 0 3%;
      border-left: 1px solid #AAAAAA; /* light grey */
      background: #DDEEFF bottom; /* #DDFFEE bottom; */
      font-size: 1em;
      line-height: 1.8em;}

/* Format LHS for address details */
#addressEtc {
      float: left;
      width: 34%;
      margin: 0;
      padding: 0;
      background: #DDEEFF bottom; /* #DDFFEE bottom; */
      font-size: 1em;
      line-height: 1.6em;}

/* Format RHS for map */
#map {
      margin: 0 0 0 35%; /* left margin 1% greater than address width */
      padding: 0 0 0 2%;
      background: #DDEEFF bottom; /* #DDFFEE bottom; */
      font-size: 1em;
      line-height: 1.6em;}

/* Format for directions */
#directions {
      float: left;
      width: 100%;
}

/* Format footer */
#footer {
      clear: left; /* Starts footer below floated content */
      float: left;
      width: 60%;
      font-size: 0.8em;
      text-align: left;
      margin: 0 0 0 1em;
      line-height: 1.2em;}

/* Format bottom RiteDesign message */
#riteDesign {
      font-size: 0.8em;
      text-align: right;
      line-height: 1.2em;
      margin: 0 1.2em 0 0;}

/* Format sign-in form */
#signIn {padding: 0; margin: 0;}

/* Format images */
img { width: 27.5em;
      height: 20em;
      border: 1px solid black;}
img.logo {width: 50em;
      height: 5em;}
img.map {width: 39em;
      height: 36.5em;}
img.left {
      float: left;
      margin: 1em 2em 1em 0;}
img.right {
      float: right;
      margin: 1em 0 1em 2em;}
img.leftPortrait {
      width: 20em;
      height: 27.5em;
      float: left;
      margin: 1em 2em 1em 0;}
img.leftSmall {
      width: 23.5em;
      height: 17em;
      float: left;
      margin: 1em 2em 1em 0;}
img.rightSmall {
      width: 23.5em;
      height: 17em;
      float: right;
      margin: 1em 0 1em 2em;}
img.leftLarge {
      width: 61em;
      height: 42em;
      float: left;
      margin: 1em 2em 1em 0;}
img.leftLogo {
      width: 8em;
      height: 8em;
      float: left;
      margin: 1em 2em 1em 0;}

/* Format tables */
table {border-collapse: collapse;
       border: 1px solid black;}
table.noborder {border: 0;}
table.booking {width: 11em;}
table.bookingTime {border: 0; width: 8em;}
table.key {width: 1.2em;}

tr {text-align: left;}
tr.centre {text-align: center;}
td {padding: 1em 0.5em 0 0.5em;}      
td.closetop {padding: 0.25em 0.5em 0 0.5em;}      
td.nopad {padding: 0;}
td.nolr {padding: 1em 0 0 0;}
td.noright {padding: 1em 0 0 0.5em;}
td.space {padding: 0 2.5em 0 2.5em;}
td.spaceSmall {padding: 0 0.5em 0 0.5em;}
td.spacetop {padding-top: 2.5em;}
td.spacebottom {padding-bottom: 2.5em;}

/* For booking table */
td.time {padding: 0 0.5em 0 0.5em;
         border-top: 1px solid #DDEEFF;}
td.timeHour {padding: 0 0.5em 0 0.5em;
         border-top: 1px solid #DDEEFF;
         font-weight: bold;}
td.free {padding: 0 0.5em 0 0.5em;
         background: white;
         border-top: 1px solid white;}
td.freeHour {padding: 0 0.5em 0 0.5em;
         background: white;
         border-top: 1px dashed black;}
td.freeTop {padding: 0 0.5em 0 0.5em;
         background: white;
         border-top: 1px solid black;}
td.freeHourTop {padding: 0 0.5em 0 0.5em;
         background: white;
         border-top: 1px solid black;}
td.booked {padding: 0 0.5em 0 0.5em;
         background: #99CCFF;
         border-top: 1px solid #99CCFF;}
td.bookedHour {padding: 0 0.5em 0 0.5em;
         background: #99CCFF;
         border-top: 1px dashed black;}
td.bookedTop {padding: 0 0.5em 0 0.5em;
         background: #99CCFF;
         border-top: 1px solid black;}
td.bookedHourTop {padding: 0 0.5em 0 0.5em;
         background: #99CCFF;
         border-top: 1px solid black;}
td.keyFree {padding: 0 0.5em 0 0.5em;
         background: white;
         border-top: 1px solid black;}
td.keyBooked {padding: 0 0.5em 0 0.5em;
         background: #99CCFF;
         border-top: 1px solid black;}
td.keySpace {padding: 0.2em 0.5em 0.2em 0.5em;}

/* format form elements */
input.normal {font-family: Verdana, Arial, sans-serif;
         font-size: 1em;}
input.normalBold {font-family: Verdana, Arial, sans-serif;
         font-size: 1em;
         font-weight: bold;}
input.larger {font-family: Verdana, Arial, sans-serif;
         font-size: 1.2em;}
input.largerBold {font-family: Verdana, Arial, sans-serif;
         font-size: 1.2em;
         font-weight: bold;}
select.normal {font-family: Verdana, Arial, sans-serif;
         font-size: 1em;}

/* Format horizontal line break */
hr {clear: left; /* Starts line break below floated content */
    height: 1px;
    width: 100%;
    color: #003399;
    background-color: #003399;}

/* Format company name */
h1 {font-family: Verdana, Arial, sans-serif;
    font-size: 3em;
    font-weight: bold;
    color: #2277BB;
    margin: 0 0 0.5em 0;
    text-align: center;}
h1.promo {font-size: 1.4em;
    color: #333333; /* Dark grey text */
    line-height: 1.4em;} 

/* Format title of main section */
h2 {font-family: Verdana, Arial, sans-serif;
    font-size: 1.1em;
    font-weight: bold;
    color: black;
    margin: 0 0 1.5em 0;} 

/* Format sub-title of main section */
h3 {font-family: Verdana, Arial, sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #003399; 
    margin: 0;} 
h3.nobold {font-weight: normal; line-height: 1.2em;}

/* Format paragraphs */
p {margin: 0;}
p.rhs {text-align: right;}
p.leavespace {white-space: pre;}
p.open {line-height: 1.8em;}
p.halfOpen {line-height: 0em;}
p.clear {line-height: 1.8em; clear: both;}
p.note {color: #003399; line-height: 1.2em;}
p.openNote {color: #003399; line-height: 1.8em;}
p.key {color: #003399; line-height: 1.8em; font-weight: bold}

/* Underline links, make all links blue, make links purple when visited */
/* and make links light blue when hovered over */
a {text-decoration: underlined;}
a:link {color: #003399;}
a:visited {color: #660066;}
a:hover {color: #0066FF;}