/*********************************************************************
**                                                                  **
** (c) Jaguar Software Ltd. 2006                                    **
**                                                                  **
** File: screen.css                                                 **
** History:                                                         **
**  15-Nov-06  RWB  Initial creation                                **
**  30-Nov-06  JIK  plainText                                       **
**  01-Dec-06  RWB  callOuts                                        **
**                                                                  **
** Function:                                                        **
**  style sheet for screen display                                  **
**                                                                  **
*********************************************************************/

BODY {
/* background: scroll transparent url("images/topBarBkgnd.gif") repeat-x left top; */
   color: #333333;
   font-family: tahoma, verdana, arial, helvetica, sans-serif;
   font-size: small; /* =13px */
   margin: 0;
   text-align: center;
   }

#frame {
   border: #330066 2px solid;
   margin: auto;
   position: relative; /* !!! this triggers lots of good behaviour */
   text-align: left;
   width: 720px;
   }

#picsL-disable {
   background-image: url("images/jaguar.jpg");
   height: 195px;
   position: absolute;
   top: 95px;
   left: -130px;
   width: 130px;
   }

#picsR-disable {
   background-image: url("images/jaguar.jpg");
   height: 195px;
   position: absolute;
   top: 95px;
   right: -130px;
   width: 130px;
   }

#topBar {
/* background-color: #330066; this was the body background image */
   background-image: url("images/strap.gif");
   background-repeat: no-repeat;
   height: 95px;
   }

#topBar .strap {
   color: #FFFFFF;
   float: left;
   font-size: 17px; /* large; fix so text-size ops don't overflow */
   margin-left: 10px;
   margin-top: 20px;
   text-align: right;
   width: 320px;
/*
try out composite banner
*/
   visibility: hidden;
   }

#topBar IMG {
/* background-color: #FFFFFF; -- new logo is white on transparent */
   float: right;
   margin-right: 40px;
   margin-top: 10px;
/*
try out composite banner
*/
   visibility: hidden;
   }

/* experimental, not used at the moment
#topBar SPAN.logo {
   color: #FFFFFF;
   float: right;
   font-family: stencil, times, serif;
   font-size: xx-large;
   margin-right: 10px;
   margin-top: 10px;
   text-align: center;
   width: 200px;
   }
*/

#topMenu {
   background-color: #CCCCCC;
/* border-left: #999999 1px solid; -- better without, now frame has border */
   font-size: 12px;
   font-weight: bold;
   white-space: nowrap;
   height: 26px;
   }

#topMenu A {
/* background-color: #CCCCCC; -- do in above, so fills in gap on RHS */
   border-right: #999999 1px solid;
   color: #555555;
   display: block;
   float: left;
   padding: 6px 15px 6px 15px;
   text-decoration: none;
   }

#topMenu A.thisPage {
   background-color: #FFFFFF; /* transparent, see above. same as hookText */
   color: #222222;
   }

#topMenu A:hover {
   background-color: #DDDDDD;
   color: #000000;
   }

H1, H2, H3 {
   color: #330066;
   }
H1 {
   font-size: medium;
   }
H2 {
   font-size: small;
   }
H3 {
   font-size: small;
   margin-bottom: 0;
   }

UL {
   margin-top: 5px;
   margin-bottom: 5px;
   }

#hookText {
   background: url("images/stones.jpg") no-repeat 450px 70px;
/*       : top right bottom left */
   margin: 20px 10px 20px 10px;
   padding-left: 20px;
   padding-right: 300px;
   }

#plainText {
   margin: 20px 10px 20px 10px;
   padding-left: 20px;
   padding-right: 300px;
   }

#otherText1 {
   background: url("images/knot.jpg") no-repeat 20px 0px;
   margin: 20px 10px 20px 10px;
   padding-left: 300px;
   padding-right: 20px;
   }

#otherText2 {
/* This isn't used at the moment */
/* background: url("images/jaguar.jpg") no-repeat 520px 30px; */
   margin: 20px 10px 20px 10px;
   padding-left: 20px;
   padding-right: 300px;
   }

DIV.callOut {
   color: #606060; 
   font-size: 110%;
   white-space: pre;
   width: 250px;
/*
   color: #606060;
   font-size: 130%;
   font-style: italic;
   font-family: Baskerville, Times, serif;
*/
   }

DIV#referralCallOut {
   position: absolute;
   right: 20px;
   top: 450px;
   }

#footer {
   background-color: #330066;
   color: #FFFFFF;
   font-size: smaller;
   margin-top: 30px;
   padding: 5px;
   text-align: right;
   }

/*
A  {
   color: #0000CC;
   text-decoration: none;
   }
*/
/*
A:visited {
   color: #660066;
   }
*/
A:hover {
   background-color: #CCCCCC;
   color: #660000;
   }

A IMG {
   border-style: none;
   }

ADDRESS {
   font-style: normal;
   padding-bottom: 5px;
   padding-top: 10px;
   margin-top: 0;
   white-space: pre;
   }

/* that's it */
