/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/*

                                Hop Vine Music Styles

 Authors:
   Name  : Hugh Field-Richards, Ian Field-Richards
   Email : hsfr@hsfr.org.uk, ifr@sevenseventyfour.com

-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

   Date                   Who        Changes
   ==========================================================================

   20th January 2006      HSFR       Created temporary framework
   14th February 2006     IFR        Created real styles
   23rd March 2006        HSFR       PayPal cart cosmetics
   8th August 2006        HSFR       Added normal weight to headings
   8th November 2006      HSFR       Rewritten quotes
   1st February 2007      HSFR       Added who span class
   15th June 2007         HSFR       Added reviews
   13th May 2009          HSFR       Removed table support and put in divs
                                     Split CSS into separate files

*/

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/*
   Default document styles
*/
   
body {
   background-color: #D2CAB5;
   color: #66766D;
   vertical-align: top;
}

/* Watch order of each group is not changed */
p.normalPara a:link { color: inherit; text-decoration: none; font-weight: bold;}
p.normalPara a:active { color: inherit; text-decoration: none;  font-weight: bold;}
p.normalPara a:visited { color: inherit; text-decoration: none;  font-weight: bold;}
p.normalPara a:hover { color: #610012; text-decoration: underline; font-weight: bold;}

div.returnToTop a:link { color: inherit; text-decoration: none; font-weight: bold;}
div.returnToTop a:active { color: inherit; text-decoration: none;  font-weight: bold;}
div.returnToTop a:visited { color: inherit; text-decoration: none;  font-weight: bold;}
div.returnToTop a:hover { color: #610012; text-decoration: underline; font-weight: bold;}

li a:link { color: inherit; text-decoration: none; font-weight: bold;}
li a:active { color: inherit; text-decoration: none;  font-weight: bold;}
li a:visited { color: inherit; text-decoration: none;  font-weight: bold;}
li a:hover { color: #610012; text-decoration: underline; font-weight: bold;}

a:link { color: inherit; text-decoration: none; }
a:active { color: inherit; text-decoration: none; }
a:visited { color: inherit; text-decoration: none; }
a:hover { color: #610012; text-decoration: underline; }

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* Body frame contains the main and copyright frame centred */

#bodyFrame {
   text-align: left;
   width: 750px;
   background-color: inherit;
   color: inherit;
   margin-left: auto;
   margin-right: auto;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size: 12px;
   font-weight: normal;
}

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* Page is made up of two vertically stacking frames */

#mainFrame {
   background-color:#e8e5dc;
   color: inherit;
   width: 100%;
   height:100%;
}

#copyrightFrame {
   text-align:center;
   font-size: 80%;
   background-color: inherit;
   color: inherit;
   padding: 0px 0px 10px 0px;
}

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* Header and footers */

#headerFrame {
   width: inherit;
   height: 100px;
   background-color: inherit;
   color: inherit;
   margin: 0px 0px 0px 0px;
}

#headerTitle {
   float: left;
   position: relative;
   left: 200px;
   padding: 50px 0px 20px 0px;
}

#shoppingCart {
   float: right;
   position: relative;
   right: 25px;
   padding: 65px 0px 0px 0px;
   font-size: 90%;
   letter-spacing: 1px;
}

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* Main Navigation */

#navigationImageFrame {
   width: inherit;
   height: 200px;
   padding: 0px 0px 10px 0px;
}

/* Note id prefix here */
#mainImage {
   background-position:   left;
   background-repeat: no-repeat;
   height: 200px; /*important*/
   float: right;
   margin: 0px 25px 0px 0px;
}

#navigationBlock {
   float: left;
   left: 25px;
   width: 150px;
   margin: 0px 0px 0px 25px;
}

.menuItemSeparator {
   background-color:   inherit;
   height: 10px;
   width: 100%;
}

.menuItem {
   font-size: 16px;
   letter-spacing: 0px;
   font-family: Georgia, "Times New Roman", Times, serif;
   background-color:   #f4f3ef;
   width: 100%;
}

.menuItem a {
   height: 10px;
   padding: 7px 00px 15px 10px;
   display: block;
   text-decoration: none;
}

.menuItem a:link {
   color: #56554a;
   background: inherit;
}

.menuItem a:active {
   color: #56554a;
   background: inherit;
}

.menuItem a:visited {
   color: #56554a;
   background: inherit;
}

.menuItem a:hover {
   color: #610012;
   background: white;
}

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* CONTENT */

#centreFrame {
   width: inherit;
   background-color: #E8E5DC;
}

#hopFrame {
   position: relative;
   float: left;
   width: 170px;
   padding: 10px 8px 0px 20px;
}

#homeContentFrame {
   position: relative;
   float: left;
   width: 340px;
   padding: 5px 5px 5px 5px;
   margin: 0px 12px 0px 0px;
   background-color: #eeece6;
   font-size:90%;
   line-height: 18px;
}

#contentFrame {
   position: relative;
   float: right;
   right:23px;
   width: 492px;
   padding: 5px 15px 5px 15px;
   margin: 0px 0px 0px 0px;
   background-color: #eeece6;
   font-size:90%;
   line-height: 18px;
}

#newsFrame {
   float: right;
   position: relative;
   background-color: #f4f3ef;
   width: 150px;
   right: 25px;
   padding: 2px 5px 10px 5px;
   margin: 0px 0px 10px 0px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 90%;
}

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/* SUBFOOTER */

#subfooterMain {
   padding: 10px 0px 10px 0px;
   color: #66766d;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:10px;
   text-align:center;
   letter-spacing: 1px;
}

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/*
   Footer Cell (row) at the bottom of the screen
*/

.footerCell {
    border: 1px solid red;
}

.footerPanel {
    border: 1px solid red;
}

.footerLeft {
   vertical-align:top;
}


.faqContents {
   border-bottom: 1px solid #56554a;
   padding:         10px 0px 10px 0px;  /* top right bottom left */
   font-weight:   bold;
   color:         #610012;
   font-family:   Verdana, Arial, Helvetica, sans-serif;
   font-size:      10px;
}

.faqContentsItem {
   padding: 3px 0px 0px 10px;  /* top right bottom left */
   margin: 0px 0px 0px 0px;
}

.returnToTop {
   text-align: right;
   font-style: italic;
}

.conformanceBox {
   border-top:      1px solid #56554a;
   margin:         20px 0px 10px 0px;  /* top right bottom left */
   padding:         10px 0px 10px 0px;  /* top right bottom left */
   font-weight:   bold;
   color:         #610012;
   font-family:   Verdana, Arial, Helvetica, sans-serif;
   font-size:      10px;
   width: 100%;
}

.conformanceBoxCell {
   text-align: center;
}

/* -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-* */
/*
   Footer Cell (row) at the bottom of the screen
*/

.contentCell {
}

.contentPanel {
}

