@import url("menu.css");
@import url("catalogue.css");

body {
	font-family: Arial, Sans-serif;
    font-size: medium;
    background-color: white;
    margin: 0;
    overflow-y: scroll;
}

#pageFrame {
    text-align: center;
}
#all {
    text-align: left;
    width: 770px;
    margin: 0 auto 4px auto;
	background-color: #d9f2d8;
	border: 1px solid #339933;;
    /*background-image: url("images/page-background.jpg");
    background-repeat: repeat;*/
    /*
    max-width: 800px;
    width:expression(document.body.clientWidth > 800 ? "800px" : "auto" );
    */
    font-size: medium;
}
@media print {
  #all {width: auto;}
}
#topMenu {
    margin: 4px auto 0 auto;
    padding: 2px 2px 2px 2px;
    width: 770px;
    text-align: left;
    font-size: medium;
    background-color: #99ffae;
    background-image: url(images/top-fade.jpg);
    background-position: top right;
    background-repeat: no-repeat;
}
#topMenu a {
    color: black;
    font-weight: bold;
    text-decoration: none;
}
#topMenu a:hover {
    text-decoration: underline;
}
#infoMenu a {
    padding: 4px 8px;
    color: black;
    text-decoration: none;
}
#infoMenu a:hover {
    text-decoration: underline;
}
a.viewBasket:link, a.viewBasket:hover, a.viewBasket:visited, a.viewBasket:hover {
    color: black;
    text-decoration: none;
    background-image: url(images/basket.gif);
    background-repeat: no-repeat;
    padding-left: 24px;
}
a.viewBasket:hover {
    text-decoration: underline;
}

#topArea {
    background-color: black;
    height: 60px;
    margin: 0;
}
#logo {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
}
#foot {
    position: absolute;
    z-index: 1;
    right: 2px;
    top: -20px;
}
#earwig {
    position: absolute;
    z-index: 2;
    left: 270px;
    top: -15px;
}
#leaf {
    position: absolute;
    z-index: 1;
    left: -30px;
    top: 50px;
}
#home {
    height: 60px;
    width: 70px;
}


#searchBox {
    text-align: right;
    position: absolute;
    z-index: 1;
    right: 0;
    padding: 0 0 0 0;
    margin: 2px 70px;
}
@media print {
    #topMenu, #foot, #topArea, #searchBox, #basketBox {display: none;}
    #all {border: 0;}
    .para {border: 0;}
}

@media print {#logo {display: none;}}
#logoFrame {
    clear: both;
    background: black;
    text-align: center;
    padding: 8px;
}

#title {
    position: absolute;
    z-index: 1;
    /* border-bottom: 4px solid #6600ff; */
    left: 100px;
    top: 20px;
    font-weight: bold;
    color: white;
}
#sitename {font-size: large; font-style: italic;}
#pagename {font-size: medium}
@media print {#title {border: none; position: relative; z-index: 0; left: 0px; margin-bottom: 32px;}}


#bannerImage {
    background: black;
    text-align: right;
    z-index: 2;
    float: right;
    padding: 4px;
}
@media print {#bannerImage {display: none;}}

#menuBar {
    background: #000;
    padding: 4px 4px 4px 100px;
    font-weight: bold;
    margin: 0;
}
@media print {#menuBar {display: none;}}

#content {
    margin: 0px 8px 8px 8px;
    clear: both;
}

#rightCol {
    float: right;
    width: 230px;
}

#mainCol {
    padding-right: 230px;
}

div.whitePanel {
    background: white;
    border: 1px solid #999999;
    padding: 4px;
}

table.banner {
    background: black;
}

div.banner {
    font-weight: bold;
    color: white;
    padding: 4px;
}

a.nice {
    text-decoration: underline;
    color: #6600ff;
}
a.quiet {
    text-decoration: none;
    color: black;
}

a.crumb {
    background-color: #f4ee9d;
    border-top: 1px solid #fcf7a9;
    border-left: 1px solid #fcf7a9;
    border-right: 1px solid #e2da79;
    border-bottom: 1px solid #e2da79;
    padding: 2px 4px;
    color: black;
    text-decoration: none;
}

/* Buttons */
.formButton {
}
.linkButton {
    display: block;
    text-decoration: none;
    color: black;
    padding: 1px 4px 1px 4px;
    border: 1px solid #333333;
    background: #eeeeee;
}

/* Search */
#searchForm {
    padding: 8px;
}
#searchButton {
    font-weight: bold;
    color: white;
    border-width: 2px;
    background-color: #8d64cc;
    background-image: url(images/magnifier.gif);
    background-position: 2px;
    background-repeat: no-repeat;
    border-top: 1px solid #cfb0ff;
    border-left: 1px solid #cfb0ff;
    border-right: 1px solid #7146b2;
    border-bottom: 1px solid #7146b2;
    margin: 2px 0 0 0;
    padding: 1px 1px 1px 20px;
    width: 8em;
}
input.searchBox {
    background-color: #f2e6ff;
    padding-left: 4px;
    margin: 2px 0 1px 0;
}


/* Informational notes */
div.info {
    background-image: url(images/info.gif);
    background-repeat: no-repeat;
    background-position: 2px 6px;
    padding: 4px 4px 4px 20px;
    background-color: #d9f2d8;
    margin: 4px;
    background-attachment: scroll;
}
@media print {div.info {display: none;}}

/* Crumbs */
.crumbs {
    margin: 8px;
    padding-left: 8px;
}
@media print {.crumbs {display: none;}}

span.crumbSep {
    color: #cc794b;
    font-weight: bold;
}
a.crumb:hover, a.crumb:link, a.crumb:active, a.crumb:visited {
    background-color: #cc794b;
    border-top: 1px solid #e6976c;
    border-left: 1px solid #e6976c;
    border-right: 1px solid #b25e30;
    border-bottom: 1px solid #b25e30;
    padding: 2px 4px;
    color: white;
    text-decoration: none;
    font-size: 0.9em;
}
a.crumb:active {
    background-color: #de601d;
}
span.crumbHint {
}
div.crumbIndex {
    float: right;
    padding-bottom: 4px;
}

/* Contact */
div.contactType {
    margin: 8px;
}
div.contactAction {
    padding: 4px;
}
div.contactPoint {
    padding: 4px 4px 4px 12px;
}

/* Home */
.para {
    background-image: url("images/page-background.jpg");
    background-repeat: repeat;
    background-color: #e4fce3;
    border: 2px solid #a9dea6;
    font-size: medium;
    padding: 4px;
    margin: 8px 8px 0px 0px;
}
.special {background-image: none; background-color: #ffff77;}
@media print {.para {border: 0;}}
div.paraHeader {
    font-weight: bold;
}
h1 {font-size: medium; font-weight: bold; margin-top: 6px;}
h2 {font-size: medium; font-weight: bold; margin-top: 6px;}
div.productDescription h1 {clear: both;}
div.productDescription div.left img {float: left; margin: 0 8px 8px 0;}
div.productDescription div.right img {float: right; margin: 0 0 8px 8px;}

div.homeBanner {
    margin: 8px;
    border-bottom: 2px solid #00ff33;
    padding: 4px;
    clear: both;
}
div.item {
    /* background: #ffffff; */
    /* border: 1px solid #cccccc; */
    /* border-right: 4px solid #6600ff; */
    padding: 8px;
}
/* News */
div.feed {
    clear: both;
    float: right;
}
@media print {div.feed {display: none;}}
div.feed a {
    text-decoration: none;
    color: black;
}
div.newsItem {
    background-image: url(images/calendar.gif);
    background-position: 4px;
    background-attachment: scroll;
    background-repeat: no-repeat;
    margin: 8px 8px 0px 8px;
    padding-left: 30px;
}
span.newsDate {
}
div.moreLink {
    text-align: right;
    margin-right: 8px;
    margin-bottom: -8px;
}
/* Product Teasers */
div.teaserItem {
    clear: both;
    margin: 8px 8px 16px 30px;
    padding-left: 0px;
}
div.teaserImage {
    float: left;
    margin: 0px 12px 4px 8px;
}
div.teaserDescription {
}
div.teaserCatalogueLink {
    text-align: right;
}
/* Events */
div.item_events {
    background-image: url(images/date.png);
    background-position: 0px;
    background-attachment: scroll;
    background-repeat: no-repeat;
    margin: 8px 8px 16px 8px;
    padding-left: 30px;
}
div.item_events_date {
}
div.item_events_heading {
    font-weight: bold;
}
div.item_events_subHeading {
}
div.item_events_text {
    margin-left: 16px;
}

/* News */
div.item_news {
    background-image: url(images/text_dropcaps.png);
    background-position: 0px;
    background-attachment: scroll;
    background-repeat: no-repeat;
    margin: 8px 8px 16px 8px;
    padding-left: 30px;
}
div.item_news_date {
    float: left;
    margin-right: 16px;
}
div.item_news_heading {
    font-weight: normal;
}
div.item_news_subHeading {
}
div.item_news_text {
    margin-left: 16px;
 }

/* News */
div.item_articles {
    background-image: url(images/text_dropcaps.png);
    background-position: 4px;
    background-attachment: scroll;
    background-repeat: no-repeat;
    margin: 8px 8px 16px 8px;
    padding-left: 30px;
}
div.item_articles_date {
    float: left;
    margin-right: 16px;
}
div.item_articles_heading {
    font-weight: normal;
}
div.item_articles_subHeading {
}
div.item_articles_text {
    margin-left: 16px;
 }

/* Articles */
div.articleTitle {
    margin: 12px 0 12px 0;
    font-size: medium;
    font-weight: bold;
    border-bottom: 1px solid #6600ff;
}
div.articleImage {
     float: left;
}
@media print {div.articleImage {display: none;}}
@media print {div.article {padding-left: 0px;}}
div.sig {
    text-align: right;
    margin-top: 12px;
}
span.leader {
    padding-left: 8px;
    border-left: 12px solid #6600ff;
    font-weight: bold;
}
div.articleInList {
    /* background-image: url("images/page-background.jpg");
    background-repeat: repeat; */
    background-color: #e4fce3;
    border-top: 2px solid #d1e7d0;
    border-left: 2px solid #d1e7d0;
    border-right: 2px solid #a4baa3;
    border-bottom: 2px solid #a4baa3;
    padding: 4px;
    margin: 20px 8px 8px 8px;
    padding-bottom: 8px;
}
div.articleInListTitle {
    font-weight: bold;
    margin-bottom: 8px;
}
div.articleInListLeader{
    font-weight: normal;
    margin-left: 24px;
}
div.articleInListMore{
    padding-top: 4px;
    text-align: right;
}
div.articleInListDate{
    float: right;
    margin-left: 24px;
}
div.articlesFooterImage {
    float: right;
    margin: 8px;
}
@media print {div.articlesFooterImage {display: none;}}
div.articleIndex {
    text-align: left;
    margin: 8px;
}
div.articleIndexEntry {
    margin: 8px;
}
div.articleIndexHeader {
    margin: 8px;
    font-weight: bold;
}

/* Terms & Conditions */
div.tacLink {
    text-align: right;
}
p.tac {
    margin: 16px;
}
li.tac {
    margin: 8px;
}

#homeMontage {
    text-align: center;
    margin-top: 8px;
}
@media print {.hiddenInPrint {display: none;}}
form.link {
    display: inline;
}
@media print {form.link {display: none;}}

h2 {
    font-size: medium;
    font-weight: bold;
}

li {
    margin-bottom: 8px;
}
li.plod {
    color: #9999ff;
}
li.ideas {
    color: #ff9999;
}
li.resources {
    color: #33cc33;
}

li span {
    color: black;
}

#footer {
    background-image: url(images/rainbow.jpg);
    background-repeat: no-repeat;
    padding: 8px 8px 8px 8px;
    width: 760px;
    text-align: center;
    color: #000000;
    margin: 0 auto;
}
@media print {
  #footer {width: auto}
}
table.info {
    border: none;
    margin: 0;
    padding: 0;
    margin-top: 16px;
}
table.info td, table.info th  {
    border: 1px solid #999;
    border-collapse: collapse;
    padding: 4px;
}
table.info th {
    background: #eee;
    font-weight: normal;
}
table.info td {
    background: white;
}
a:visited, a:link, a:active {
    color: blue;
    text-decoration: none;
}
a:hover {
    color: blue;
    text-decoration: underline;
}
ul.info {padding: 0;}
ul.info li {
    list-style: none;
    display: inline;
}
ul.info li a {
    padding: 2px 8px;
}
td.itemInactive {
    color: red;
}
td.itemActive {
    color: green;
}
#profile {
}
#profile div {
    margin-left: 230px;
}
#profile img {
    margin-top: 4px;
    clear: both;
    float: left;
    margin-right: 16px;
    display: block;
}

div.searchable {
    clear: both;
    background-position: 4px;
    background-attachment: scroll;
    background-repeat: repeat;
    min-height: 110px;
    height: expression('110px');
    position: relative;
}
div.searchable img {float: left; border: 3px solid #a9dea6; margin-right: 16px;}
div.searchable .label {float: right; clear: both; font-weight: bold; padding-left: 8px; }
div.searchable div.title {font-weight: bold; font-size: medium; margin-bottom: 4px; padding-left: 120px;}
div.searchable .title a:active, div.searchable .title a:visited, div.searchable .title a:link {text-decoration: none;}
div.searchable .title a:hover {text-decoration: underline;}
div.searchable .location {font-style: italic; padding-left: 120px;}
div.searchable .excerpt {padding-left: 120px;}
hr {clear: both; margin-left: 120px;border-style: solid; border-width: 0 0 1px 0; border-color: #339900;}
div.nothumb {
    min-height: 10px;
    height: expression('10px');
}
div.nothumb .excerpt, div.nothumb .location, div.nothumb div.title {
    padding-left: 32px;
}

div.news .label {float: right; clear: both;}

div.sidebar {clear: both; float: right;}
div.item .label {font-weight: bold; clear: none; float: none; }
img.framed {display: block; border: 2px solid #a9dea6; margin: 0 4px 4px 0;}
div.inline img.framed {display: inline;}
div.sidebar span {text-align: center; font-style: italic;}
div.item div.content {padding-right: 166px;}
div.item div.nogutter {padding-right: 0;}
div.item div.title {font-weight: bold; font-size: medium; margin-bottom: 4px;}
div.item div.location {font-weight: bold; font-size: medium; margin-bottom: 4px;}
div.bottombar {clear: both; text-align: center;}
div.bottombar div.image {float: left;}
div.bottombar div.caption {font-style: italic; margin-bottom: 8px;}

div.buy {float: right;}
form.buy {float: right;}
form.buy input {padding: 2px 4px; font-weight: bold; background-color: #00ff43; border-top: 1px solid #b2ffc7; border-left: 1px solid #b2ffc7; border-bottom: 1px solid #77b286; border-right: 1px solid #77b286;}

#cart {float: right; margin: 0 16px 0px 0; position: relative;}
form.cart {position: absolute; z-index:1; right: 0px; top: expression("-8px")}
form.cart input {
    background-image: url(images/cart.gif);
    background-repeat: no-repeat;
    padding: 1px 4px 1px 28px;
    font-weight: bold;
    background-color: #00ff43;
    border-top: 1px solid #b2ffc7; border-left: 1px solid #b2ffc7; border-bottom: 1px solid #77b286; border-right: 1px solid #77b286;
}

ul.buy li {color: #77b286;}
ul.buy li span {color: black;}

div.howtobook {
    text-align: right;
}
img.msAgent {position: absolute; left: -10px; top: -5px;}

#information {text-align: center; color: #333; display: none;}
#information p {margin: 0;}

.sitemap {}
a.sitemap:link, a.sitemap:visited, a.sitemap:active {color: black; text-decoration: none;}
a.sitemap:hover {color: black; text-decoration: underline;}
.sitemap .o {margin-top: 8px; font-weight: bold;}
.sitemap .s {padding-left: 16px;}
.sitemap .p {padding-left: 32px;}
.sitemap .i {padding-left: 16px;}

div.static {
    margin: 8px;
}
div.with-sidebar div.content {
    padding-right: 170px;
}
div.static h1 {font-size: medium; font-weight: bold;}

#subscribe {
    text-align: left;
    margin-right: 4px;
}
#subscribe div {margin: 4px;}
#subscribe form {margin: 0; padding: 0}
#subscribe .submit {text-align: right; margin: 8px 4px 4px 0; }
#subscribe .submit input {background-color: #ffc28e;}
#subscribe .email input, #subscribe .name input {width: 100%; background-color: #fff3e8;}
#subscribe .name {display: none;}
#subscribe .help {text-align: center; margin: 4px; }

a.help {
    background-image: url(images/help.gif);
    background-repeat: no-repeat;
    background-position: 0 0;
    padding-left: 16px;
}
a.feed {
    background-image: url(images/feed.gif);
    background-repeat: no-repeat;
    background-position: 0 0;
    padding-left: 16px;
}
a.icon {}
a.icon img {border: 0;}

@media print { #subscribe, a.help, a.feed, div.rest, div.more {display: none;}}
@media print { a:hover, a:visited, a:link, a:active {text-decoration: none; color: black;}}

.exclamation {
    background-image: url(images/exclamation.gif);
    background-repeat: no-repeat;
    padding-left: 20px;
}
div.availability {
    margin: 0 0 8px 0;
}
div.availability .L {
    background-image: url(images/exclamation.gif);
    background-repeat: no-repeat;
    padding: 4px 4px 4px 20px;
    border: 1px solid black;
    background-color: #ffffcc;
}
div.availability .N {
    background-image: url(images/exclamation.gif);
    background-repeat: no-repeat;
    background-position: 2px 6px;
    padding: 4px 4px 4px 20px;
    border: 1px solid black;
    background-color: #ffffcc;
}
div.availability .S {
    background-image: url(images/info.gif);
    background-repeat: no-repeat;
    background-position: 2px 6px;
    padding: 4px 4px 4px 20px;
    border: 1px solid black;
    background-color: #ffffcc;
}
div.guide {
    background-image: url(images/guide.gif);
    background-repeat: no-repeat;
    background-position: 2px 6px;
    padding: 4px 4px 4px 20px;
    border: 1px solid black;
    background-color: #feeacb;
    margin: 8px 8px 8px 0;
}
@media print {
div.guide {
    padding: 0;
    border: none
}
}
#audioplayer1 {background-color: yellow;}
div.label span.bargain {
  color: red;
  text-align: right;
}

/* newsletter */
div.newsletter {
  border-bottom: 2px solid #a9dea6; 
  font-size: medium;
  padding: 4px;
  margin: 8px 8px 0px 0px;
}
div.newsletter img {
  border: none;
}
div.newsletter p.more {
  text-align: right;
  margin: 8px;
  clear: left;
}
div.newsletter p.more a {
  background-image: url(images/more.gif);
  background-position: 0 50%;
  background-repeat: no-repeat;
  padding: 0 0 0 22px;
}
div.newsletter p {
  margin-left: 160px;
}
div.newsletter h1 {
  clear: left;
  font-size: medium;
  font-weight: bold;
  margin-top: 6px;
}
div.newsletter table {
    border-collapse: collapse;
}
div.newsletter td {
    border: 1px solid #577955;
    vertical-align: top;
}
.special {
  margin: 16px 8px 8px 0;
  background-color: #ffff99;
  padding: 4px;
  border: 1px dashed #cccc00;
}
div.special h1 {
  text-align: center;
}


div#subscribe {text-align: left;}
div#subscribe h1 {margin-bottom: 4px;}
div#subscribe span.label, div#subscribe span.spacer, div#subscribe span.multiple span {width:120px; float:left; font-size: 0.9em;}
div#subscribe span.multiple {float:left;}
div#subscribe span.button {padding-left:120px;}
div#subscribe div.clear {clear:both;padding-top:5px;}

div.montage {padding: 8px; text-align: center;}

/*--- clear ---*/

br.clear {
clear: both;	
}

.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}

.clearfix {
display: inline-block;	
}

html[xmlns] .clearfix {
display: block;	
}

* html .clearfix {
height: 1%;	
}