/*
 * Base stylesheet for the Somborne Shetland web pages.
 *
 * This stylesheet provides styles for a 'frames' type layout with fixed header, footer and 
 * left menu blocks.
 * The content is scrollable as required
 *
 * As far as possible all dimensions are in ems so that content will re-size to suit the screen 
 * resolution and browser window size.
 *
 * Copyright PR Hardman 2008 - All rights reserved
 *
 */



html {
    height: 100%;
    max-height: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    font-size: 90%;
    font-family: "trebuchet ms", tahoma, verdana, arial, sans-serif;
    background: #DFD;
    color: black;
	
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow: hidden;
/* */
}

body {
    height:100%;
    max-height:100%;
    overflow: hidden;
    padding:0;
    margin:0;
    border:0;
}

/* The page header and it's styles */

#header-lmenu {
    position: absolute;
    display: block;
    margin: 0;
    top: 0;
    right: 20px; /* width of scrollbar */
    width: 100%;
    height: 5.2em;
    overflow: auto;
    background: #aea; 
    color: green;
    border-bottom: solid 0.1em olive;
    z-index:6;
}

/* Use the 'Tan Hack' to get the header height for IE */
* html #header-lmenu {
   height: 5.3em;  /* IE 5 Win needs to add the total border width */
   he\ight: 5.2em;    /* IE 6 , IE5 Mac */
}


/* Header Text */
#header-pad { /* Space the header text into the viewport */
    display: block;
    width: 3em;
    height: 5em;
    float: left;
}

#title1 {font-size: 3em;}
#title2 {font-size: 1em;}

#logo {
    float: left;
    height: 5em;
    margin-right: 2em;
    margin-left: 1em;
}

/* end of header */


/* The left menu block incorporating the navigation menu*/

#menu {
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    height: 100%;
    width: 12em;
    background: #aea;
  /* color: green; */
    border-right: solid 0.1em olive;
    font-size: 0.8em;
    z-index: 5;
}


#menu-pad {  /* Space the menu down by the height of the head block */
    display:block;
    height:8em;
    clear: both;
}

#menu ul {
    list-style-type: none;
    margin-left: 0;     /* these two lines override */
    padding-left: 1.5em;  /* the browser-specified indent */
    font-weight: bold;
}

#menu li {margin-bottom: 0.2em;}


/* Use the 'Tan Hack' to get the list item separation for IE */
* html #menu li {
    margin-bottom: 0;/* All IE < 7 need zero margin */
}

#menu a.nav {
    display:block;
    text-decoration: none;
    /* color: green; */
    color: maroon;

}

#menu span.sub-menu {color: gray; font-style: italic;}

#menu a.nav:hover {color: white}
#menu a.curr {color: orange}



/* end of left menu block */

/* The page footer */

#footer {
    position: absolute;
    display: block;
    margin: 0;
    bottom: 0;
    right: 20px;
    width: 100%;
    height: 2em;
    font-size: 0.8em;
    background: #aea;
    /* color: green; */
    text-align: right;
    border-top: solid 0.1em olive;
    z-index: 5; }

#footer .footleft {
    float: left;
    text-align: left;
    padding-left: 25px;
}

#footer .footright {
    float: right;
    text-align: right;
}

/* end of page footer */


/* The content area */
#content {
    display: block;
    height: 100%;
    max-height: 100%;
    overflow: scroll; /* Always show a scrollbar or there will be a gap at the right of the head block */
    padding-left: 10em;  /* Matches width of left block plus a bit of padding */
    position: relative;
	color: maroon;
	z-index: 3;
}

#content-pad {  /* Space the content text down by the height of the head block */
    display:block;
    height:8em;
    clear: both;
}


h1, h2, h3 {font-weight: normal;}


.centre {text-align: center;}
.bold {font-weight:bold;}
.em1 {font-size: 4em;}
.em2 {font-size: 2em;}
.em3 {font-size: 1.2em;}
.em4 {font-size: 1em;}


dt {font-weight: bold;}
dd {margin: 0; margin-bottom: 1em;}

div.spacer { /* Used before and after floated divs so floats are inside container */
  clear: both;
  }

div.horiz-thumbs{
    clear: both;
    padding: 2em;
    padding-top: 0;
}

div.thumb {
    color: maroon;
    text-align: center;
    padding-bottom: 0.5em;
    margin: 0.2em;
    float:left;
    height: 14em; /* Enough to stop thumbs overlapping when in multiple rows */
    width: 9em; /* give thumbs a uniform width */
}


img.hthumb {
    width: 7em;
    /* padding: 0.5em; */
    margin: 0.2em;
}

img.vthumb {
    width: 5em;
    /*padding: 0.5em;*/
    margin: 0.2em;
}

img.thumb {height: 5em}

img.noborder {border: none;}

div.fullsizepic {
	float: left;
	color: maroon;
    text-align: center;
    padding-bottom: 0.5em;
    margin: 0.2em;
}

	
	
div#col_left, #col_right {
    float: left;
    width: 45%;
    height: 100%;
}

/* For sale and wanted page */
.sw-locn {font-size: 1.2em;}
.sw-animal {font-weight: bold;}
.sw-contact {font-weight: bold;}
.sw-tab {display: inline; padding-left: 2em;}

div.salewant {clear: both;}

div.sw-thumbs{
   clear: both;
}

div.sw-thumb {
   float:left;
   height: auto;
   width: 9em;
   text-align: center;
}
img.swthumb {
   padding: 0.5em;
   padding-bottom: 0;
   border: none;

}