/*------------------------------------------------------------------- 
     Styles for Showlite pages
 

     Created: 		28 November 2006
     Last modified:	              4 June 2008
     Version:		1.8
     Author:		Dave Whiting

     H1 color changed to red. Div.tableWrapper positioning
     re-centered. Short versions of hr added for use with 
     vcss logo.

     Class redText added for use on Home page.

     Background of div.mainLogo changed to white. Line
     colour changed to navy and weight changed to 2px.
---------------------------------------------------------------------*/


/* ----- BODY ----- */

/* setting fixed margins centres document */

  body {
        color: black;
        background: #d6d6d6;         /* was ffe2c6 */
        margin-left: 5%;
        margin-right: 5%; 
       }

/* ----- PARAGRAPHS ----- */

  p    {
        font-family: Verdana, "Comic sans", sans-serif;
       }


  p.info {
          position: relative;
          left: 50%;
          width: 550px;
          color: #000; 
          text-align: center;
          background: #ffff80;
          font-family: Verdana, "Comic sans", sans-serif;
          border: 2px solid #00f; 
          padding: 0.25em;
          margin-left: -345px; 
         }

  p.brInfo {
          text-align: left;
          font-family: Verdana, "Comic sans", sans-serif;
          font-size: 0.8em;
          color: black;
          padding: 0;
          margin: 0; 
         }


  p.hilite {
            text-align: center;
            color: red;
            font-family: "Times New Roman", Garamond, serif;
            font-weight: bold;
           }

  p.upDated {
             margin: 0; 
             text-align: left;
             color: navy;
             font-size: 75%;
             font-family: Verdana, "Comic sans", sans-serif;
            }

  p.importInfo { 
                text-align: left;
                color: black;
                font-size: 75%;
                font-weight: bold;
                font-family: Verdana, "Comic sans", sans-serif;
               }

  p.smallFont {
               margin-top: 20px;
               margin-bottom: 18px;
               text-align: left;
               color: #000;
               font-size: 90%;
               font-family: Verdana, "Comic sans", sans-serif;
              }

  p.termsFont {
               margin-top: 5px;
               margin-bottom: 5px;
               text-align: left;
               color: #000;
               font-size: 85%;
               font-family: Verdana, "Comic sans", sans-serif;
              }

  hr {color: navy;}

  hr.vcssShort {
                width: 95%;
                text-align: left;
                color: navy;
               }
  hr.homeShort {
                width: 95%;
                text-align: left;
                color: #808080;
               }

  strong.terms { color: #cd1107; }  /* used for trading terms and conditions only */

  strong.redText {color: #ff0000;}  /* Used for home page only */

/* ----- LINKS ----- */

  a {text-decoration: none;}
  a:link {color: blue;}
  a:visited {color: red;}
  a:hover {
           font-weight: bold;
           font-size: 95%;
           color: green;
          }


/* ----- HEADINGs ----- */

  h1   {
        text-align: left;
        color: #f00;
        margin-top: 0.5em;
        margin-bottom: 0.5em;
        padding: 0;
        font-family: Verdana, "Comic sans", sans-serif;
       }


  h2   {
        text-align: left;
        color: #cc0000;
        font-family: Verdana, "Comic sans", sans-serif;
       }


  h3   {
        text-align: left;
        color: #6500dd;
        font-family: Verdana, "Comic sans", sans-serif;
       }

  h4   {
        text-align: left;
        color: #cd1107;
        font-family: Verdana, "Comic sans", sans-serif;
       }


/* ----- <EM> TAG ----- */

  em   {
        color: black;
        font-weight: bold;
       }


/* ----- <DIV> ELEMENTS ----- */

/* centering for tables etc. */

  div.tableWrapper {
                    width: 700px;
                    position: relative;
                    left: 50%;
                    padding-top: 30px;
                    margin-left: -350px;
                   }

  div.mainLogo {
                width: 450px;
                position: relative;
                left: 50%;
                padding: 10px;
                background: #ffffff;  /*was cdffff*/
                font-family: Verdana, "Comic sans", sans-serif;
                text-align: center;
                font-size: 1.2em;
                font-weight: bold;
                color: #f00;
                margin-left: -290px;
                margin-bottom: 20px;
                border: 2px solid navy;
               }

  div.strapLogo {
                 width: 700px;
                 position: relative;
                 left: 50%;
                 padding-top: 5px;
                 margin-top: 10px;
                 margin-left: -270px;
                }

  div.vcssRight
           {
            float: right;
            display: inline;
            position: relative;
            width: 90px;
            height: 32px;
            margin: 0 10px 20px 20px;
            padding: 0;
            border: 0;
           }


/* boxes */

  div.box {
           border: solid; 
           padding: 0.25em;
           border-width: thin;
           border-color: navy;
           width: 90%;
          }

/* floated */

  div.Content  {
                display: inline;
                float: right;
                position: relative;
                width: 700px;
                padding: 0;
                margin: 0;
                border: 0;
               }

  div.headLeft
           {
            display: inline;
            float:left;
            position: relative;
            width:400px;
            margin: 0;
            border: 0;
            padding-left: 100px;
            padding-right: 0;
            padding-top: 10px;
           }

  div.headCenter
           {
            display: inline;
            float:left;
            position: relative;
            width:250px;
            margin: 0;
            border: 0;
            padding: 0;
           }

  div.headRight
           {
            display: inline;
            float: right;
            position: relative;
            width: 550px;
            border: 0;
            margin: 0;
            padding-left: 0;
            padding-right: 140px;
            padding-top: 10px;
           }

  div.clearFooter {
                   clear: both;
                  }

  div.imageLeft
           {
            float: left;
            width: 320px;
            margin: 10px;
            border: 0;
            text-align: center;
            font-size: 80%;
            font-family: Verdana, "Comic sans", sans-serif;
           }

 div.smallImageLeft
           {
            float: left;
            width: 85px;
            height: 100px;
            background: #cdffff;
            margin: 0 10px 0 0;
            padding: 0;
            border: solid 1px;
            border-color: #0000ff;
            text-align: center;
            color: red;
            font-size: 60%;
            font-family: Verdana, "Comic sans", sans-serif;
           }

  div.imageRight
           {
            float:right;
            width:120px;
            margin: 0;
            border: 0;
            text-align:center;
            font-size:80%;
            font-family: Verdana, "Comic sans", sans-serif;
           }

  div.smallImageRight
           {
            float:right;
            width:101px;
            height: 85px;
            background: #cdffff;
            margin: 0;
            border: solid 1px;
            border-color: #0000ff;
            text-align:center;
            color: red;
            font-size:60%;
            font-family: Verdana, "Comic sans", sans-serif;
           }

 div.navLeft
           {
            display: inline;
            float:left;
            position: relative;
            width:80%; /* was 450px */
            margin: 15px;
            padding: 4px;
           }


/* ----- <IMG> ELEMENTS ----- */

  img {border: 0;}

  img.vhtmlLogo {
                         border: 0;
	           padding: 0;
                         margin: 0;
                         }


/* ----- <UL> & <LI> ELEMENTS ----- */

/* navigation list */

/* get rid of padding and default bullets for UL lists */

  ul.nav  {
           float: left;
           margin: 0;
           padding: 0;
           list-style-type: none;
          }

  ul.navList  {
               margin: 0;
               padding: 0;
               list-style-type: none;
              }

  ul.genList  {
               margin: 0;
               padding: 0;
               list-style-type: none;
              }

/* set the list anchor display to block, colour the backgound etc. */

  ul a    {
           text-decoration: none;
           font-family: Verdana, "Comic sans", sans-serif;
          } 

  li a.navLink    {
           display: block;
           height: 20px;
           line-height: 20px;
           text-decoration: none;
           font-family: Verdana, "Comic sans", sans-serif;
          } 

  li.nav  {
           float: left;
           background: #ffff80 no-repeat 0 50%;
           width: 100px;  /* was 120px */
           padding: 0;
           margin-left: 3px;
           margin-top: 3px;
           font-size: 0.7em;
           font-weight: bold;
           text-align: center;
           font-family: Verdana, "Comic sans", sans-serif;
          }

  li.navList  {
               margin-top: 1px;
               margin-left: 25px;
               margin-bottom: 0;
               padding: 0;
               font-family: Verdana, "Comic sans", sans-serif;
              }

  li.kitList  {
               padding-left: 10px;
               font-size:90%;
               font-weight: bold;
               list-style-type: square;
               font-family: Verdana, "Comic sans", sans-serif;
              }

  li.chargeList  {
                  padding-left: 10px;
                  font-size:90%;
                  font-weight: bold;
                  list-style-type: circle;
                  font-family: Verdana, "Comic sans", sans-serif;
                 }

  li.genlistOdd  {
                  padding-top: 10px;
                  color: #cd1107;
                  font-size:90%;
                  font-family: Verdana, "Comic sans", sans-serif;
                 }

  li.genlistEven  {
                   padding-top: 10px;
                   font-size:90%;
                   font-family: Verdana, "Comic sans", sans-serif;
                  }

/* ----- <A> ELEMENTS ----- */

/* anchor settings for Trading Terms */

  a.tradeTerms {
                font-size: 95%;
                color: #ff0000;
                text-decoration: underline;
                font-family: Verdana, "Comic sans", sans-serif;
               }


/* ----- <TABLE> ELEMENTS ----- */

  table.basic {
                     border-collapse: collapse;
                     width: 600px;
                     border: 1px solid #000000;
                    }

  table.small {
                     border-collapse: collapse;
                     width: 300px;
                     border: 1px solid #000000;
                    }

  caption {
           padding: 0.5em;
           font-size: 1.2em;
           font-weight: bold;
           color: #6500dd;
           text-align: left;
           font-family: Verdana, "Comic sans", sans-serif;
          }

  thead {
         padding: 0.5em 0.5em;
         background: #c0c0c0;
         color: #ff0000;
         font-family: Verdana, "Comic sans", sans-serif;
        }  

  th {
      padding: 0.5em 0.5em;
      border-right: 1px solid #000000;
     }

  tr.odd {
          background: #cdffff;
         }

  tr.even {
           background: #c0c0c0;
          }

  td.item {
           padding: 0.5em 0.5em;
           border-top: 1px solid;
           border-right: 1px solid;
           text-align: left;
           font-family: Verdana, "Comic sans", sans-serif;
          }

  td.day {
          padding: 0.5em 0.5em;
          border-top: 1px solid;
          border-right: 1px solid;
          text-align: center;
          font-family: Verdana, "Comic sans", sans-serif;
          }

  td.week {
             padding: 0.5em 0.5em;
             border-top: 1px solid;
             border-right: 1px solid;
             text-align: center;
             font-family: Verdana, "Comic sans", sans-serif;
            }