@charset "utf-8";

/*  MR.css          JBR 2009                                                                          */
/*   ***********************************************************************************************  */

/*       W3C CSS Validation Service Approved 26.7.09  JBR copyright 2009   */

/* Zero the browser defaults                           */
  /*  html, body, ul, ol, li, p,  ---  OK - not so good  */
  /*  h1, h2, h3, h4, h5, h6,                            */

  *          { margin: 0; padding: 0; }
  body       { font-size: 100.01%; 
               font-family: Arial,Verdana,Helvetica,sans-serif; 
               font-weight: normal;
               color: #000000; 
               background-color: #FFFFFF; 
               padding: 5px;
  }
  img        { border: 0px; }
  fieldset   { margin: 50px 5px 95px 0px; }  /* t r b l */     
  ul, ol, dl,li, dd, blockquote { margin-left: 20px; }
  fieldset   { padding:10px; }

/*  The difference between an ID and a class is that an ID can be used to identify one element,  */
/*  whereas a class can be used to identify more than one.                                       */

/* Class Selectors are .classname*/
  .sz80      { font-size:  80%;  }
  .sz120     { font-size: 120%;  }
  .sz150     { font-size: 150%;  }
  .mt05      { margin-top: 0.5em; }
  .mb15      { margin-bottom: 1.5em; }
  .mt15      { margin-top: 1.5em; }
  .mb25      { margin-bottom: 2.5em; }
  .mt25      { margin-top: 2.5em; }
  .noprint   {   }                     /*View only*/

  .Addresslink {
      display: none;                   /* Print only */
      font-family: 'Arial'; 
      font-size: 16pt;                 /* Sets the em */
      font-style: italic;
      font-weight: bold; 
      color: gray;
      margin-top: 1.0em;
      text-align: center;
      white-space: nowrap;       /* pre doesn't seem to be supported by IE  */
  }      
  .C21   {                             /*View only*/
      font-family: 'Arial'; 
      font-size: 200%;                 /* Sets the em */
      font-style: italic; 
      font-weight: bold;
      color: gray; 
      line-height: 1.5em;
  }
  .C21Head { 
      font-family: 'Arial'; 
      font-size: 200%;                 /* Sets the em */
      font-style: italic; 
      font-weight: bold;
      color: gray; 
      line-height: 1.25em;
  }
  .Indent {
      font-weight: normal;
      text-indent: 1em;
      padding: 0em;
  }
 

/*  ID selector are #selectorname */
  #Blurb   {
      font-size: 100%;                 /* Sets the em */
      font-weight: normal;
      margin-top: 1.5em;
  }

/*  Positioning Areas */
  /*  Col 1 = Blue Navigation Box */
  #BlueBar {
      position: absolute;
      top: 0;
      left: 0;
      bottom: -100em;
      width: 10em;
      color: #000000;                 /* Black  */
      background-color: #0099ff;      /* Dk Cyan*/
  }
  
  /*  Col 3 = Pictures */ 
  #PictureBar {
      font-family: 'Arial'; 
      font-size: 80%;                 /* Sets the em */
      position: absolute;
      top: 0;     
      right: 0;     
      width: 255px;                   /* Use px cos of the pictures - NB Print is smaller*/
      padding: 1em; 
      color: #000000;                 /* Black  */
      background-color: #FFFFFF;      /* White  */
  } 

  /*  Col 2 = Meat */ 
  #Middle {
      font-family: 'Arial'; 
      font-weight: normal;
      margin: 0 18em 0em 11em;        /* T,r,b,l !! */
      color: #000000;                 /* Black  */
      background-color: #FFFFFF;      /* White  */
  }


 
/*   Pseudo classes are bolted on to selectors to specify a state or relation to the selector.  */
/*   They take the form of selector:pseudo class { property: value; }                           */
/*      Link Pseudoclasses -  just four are widely supported (must be in this order): */

/*   Link Styles */
/*  Normal  */
    a                     { font-size: 100%;                                          }
    a:link                { color: #000080; text-decoration: underline;               }       /*   Navy-000080 */
    a:visited             { color: #800080; text-decoration: underline;               }       /* Purple-800080 */
    a:hover               { color: #FF0000; text-decoration: underline;               }       /*    Red-FF0000 */
    a:active              { color: #800000; text-decoration: none;                    }       /* Maroon-800000 */
/* BlueBar as background - so change style to maintain legibility  */    
    a.onblue              { font-size: 90%;                                           }
    a.onblue:link         { color: #FFFF00; text-decoration: underline;               }
    a.onblue:visited      { color: #FFFF00; text-decoration: underline;               }       /* Yellow-FFFF00 */
    a.onblue:hover        { color: #FFFFFF; text-decoration: underline;               }       /*  White-FFFFFF */
    a.onblue:active       { color: #800000; text-decoration: none;                    }       /* Maroon-800000 */
/* C21 grey - as Index page  */    
    a.greylink            { position:relative; z-index:2;                             }
    a.greylink:link       { color: gray; text-decoration: none;                       }
    a.greylink:visited    { color: gray; text-decoration: none;                       }
    a.greylink:hover      { color: red; text-decoration: underline; z-index:6;        }
    a.greylink span       { display: none;                                            }       /* span will ONLY display on :hover */
    a.greylink:hover span { display: block; position: absolute;
                            top: -1.0em; left: -1em;
                            border: 1px solid #ff0000;                                        /* border colour red*/
                            background-color: #ffff99;                                        /* background colour ?parchment? */
                            color: #000000;                                                   /* text colour Black*/
                            white-space: pre; text-align: left; text-indent: 0;               /* text-indent hits firstline only! */
                            font-size: 50% ;font-style: italic; z-index: 30;          }
/* ItalicInline */
    a.iil                 { font-size: 100%;                                          }
    a.iil:link            { color: #000080; text-decoration: underline;               }       /*   Navy-000080 */
    a.iil:visited         { color: #800080; text-decoration: underline;               }       /* Purple-800080 */
    a.iil:hover           { color: #FF0000; text-decoration: underline;               }       /*    Red-FF0000 */
    a.iil:active          { color: #800000; text-decoration: none;                    }       /* Maroon-800000 */
/* ToolTipText  ie Popup window*/
    a.info                { position:relative; z-index:2;                             }
    a.info:link           { color: #000080; text-decoration: none; font-style:italic; }       /*   Navy-000080 */
    a.info:visited        { color: #000080; text-decoration: none; font-style:italic; }       /*   Navy-000080 */
    a.info:hover          { z-index:6; color: #800000;                                }
    a.info span           { display: none;                                            }       /* span will ONLY display on :hover */
    a.info:hover span     { display: block; position: absolute;
                            top: 1.0em; left: 6em; 
                            border:1px solid #ff0000;                                         /* border colour red*/
                            background-color:#ffff99;                                         /* background colour ?parchment? */
                            color:#000000;                                                    /* text colour Black*/
                            white-space: pre; text-align: left;text-indent: 0;                /* text-indent hits firstline only! */
                            font-size: .8em;font-style:italic; z-index:30;            }
/* ToolTipTextlink  - Underlined during hover*/
    a.infolink            { position:relative; z-index:2;                             }
    a.infolink:link       { color: #000080; text-decoration: none; font-style:italic; }       /*   Navy-000080 */
    a.infolink:visited    { color: #000080; text-decoration: none; font-style:italic; }       /*   Navy-000080 */
    a.infolink:hover      { z-index:6; color: #800000; text-decoration: underline;    }
    a.infolink span       { display: none;                                            }       /* span will ONLY display on :hover */
    a.infolink:hover span { display: block; position: absolute;
                            top: 1.0em; left: 6em; /* width:30em;   */
                            border:1px solid #ff0000;                                         /* border colour red*/
                            background-color:#ffff99;                                         /* background colour ?parchment? */
                            color:#000000;                                                    /* text colour Black*/
                            white-space: pre; text-align: left;text-indent: 0;                /* text-indent hits firstline only! */
                            font-size: .8em;font-style:italic; z-index:30;            }
/* ToolTipText  ie Popup window*/
    a.piclink             { position: relative; z-index:2;                            }
    a.piclink:link        { color: #000080; text-decoration: none; font-style:italic; }       /*   Navy-000080 */
    a.piclink:visited     { color: #000080; text-decoration: none; font-style:italic; }       /*   Navy-000080 */
    a.piclink:hover       { z-index:6; color: #800000;                                }
    a.piclink span        { display: none;                                            }       /* span will ONLY display on :hover */
    a.piclink:hover span  { display: block; position:absolute;
                            top: -10.0em; left: -6em; 
                            border:1px solid #ff0000;                                         /* border colour red*/
                            background-color:#ffff99;                                         /* background colour ?parchment? */
                            color:#000000;                                                    /* text colour Black*/
                            white-space: pre; text-align: left;text-indent: 0;                /* text-indent hits firstline only! */
                            font-size: 1.0em; font-style: italic; z-index:30;         }
/* ToolTipText  ie Popup window  NotYetCompleted linkholder*/
    a.nyclink             { position: relative; z-index:2;                            }
    a.nyclink:link        { color: #808080; text-decoration: none; font-style:italic; }       /*   Grey-F0F0F0 */
    a.nyclink:visited     { color: #000080; text-decoration: none; font-style:italic; }       /*   Navy-000080 */
    a.nyclink:hover       { z-index: 6; color: #800000;                               }
    a.nyclink span        { display: none;                                            }       /* span will ONLY display on :hover */
    a.nyclink:hover span  { display: block; position: absolute;
                            top: -1.0em; left: -1em;
                            border:1px solid #404040;                                         /* border colour red*/
                            background-color:#ffff99;                                         /* background colour ?parchment? */
                            color:#000000;                                                    /* text colour Black*/
                            white-space: pre; text-align: left;text-indent: 0;                /* text-indent hits firstline only! */
                            font-size: 1.0em; font-style: italic; z-index:30;         }


