/* SOURCE:	http://webreference.com/authoring/style/sheets/layout/advanced/... */
/* MODS:		Ian Phillips for kingB - electric blues band */
/* LASTMOD:	07-Feb-03 */
/* LASTVAL:	dd-Mon-03 */

/* MEMO: Validation report is after definitions for ref while correcting */

/* DEV: Colour changed for band website */

/* Memo: Don't use the same shorthand names for classes; it confuses the browser */
/* Memo: Don't use underscores in style names; the W3C validator throws errors */


/* background colour settings in 'ffffff' form are mods */
/* (BTW we need foreground settings to validate) */

/* DEV: how do we constrain the width of the centre panel ('main')? */
/* A. Seems to be by setting width of 'rgtBar' and 'main' rgt margin to same fixed width */

/* DEV: border settings are just to show where we are while we revise the design */

  body {
    margin:9px 9px 0 9px;
    padding:0;
    background:#FFF;
  /* add typespec... */
  font-family:"Trebuchet MS", Helvetica, sans-serif;
  font-size:10.5pt;
    }
  /* level0 background colour controls appearance of left vertical panel */
  #level0 {
    background:#ffffff;	/* FC0 */
    border-left:1px solid #fff;	/* FC0 */
    border-right:1px solid #fff;	/* FC0 */
    width:100%;}
  #level1 {
    margin-left:100px;	/* 143px */
    padding-left:9px;
    border-left:1px solid #fff;	/* FC0 */
    border-right:1px solid #fff;	/* FC0 */
    background:#FFF;}
  #level2 {
    background:#ffffff;	/* FFF3AC */
    position:relative;
    width:inherit;	/* weird - changing this forces everything left! */
    }
  #main {
    margin-right:200px;	/* 9em */
    border-left:1px solid #fff;	/* FC0 */
    border-right:1px solid #fff;	/* FC0 */
    padding-right:9px;
    background:#FFF;}
  
  /* add 'inner main' style def (my order of properties) */
  #mainInner {
  	background:#eeeeee;
  	}
  /* Q. does this work on all paras within above div? */
  #mainInner p {margin:0.50em;}
  /* A. YES, hooray */
  
  /* So why doesn't the DL def below work? */
  #mainInner dl {
    margin:0.50em;
    font-weight:normal;
    font-size:0.95em;
    }
  #mainInner dt {font-weight:normal;}
  /* A. Don't know - the margin setting works... */
  
  #topBar {
    background:#ffffff;	/* #FC0 */
    width:100%}
  #advBar {
    background:#ffffff;	/* FFF3AC */
    clear:right;
    text-align:center;}
  #tipDay {
    float:right;
    width:11em;
    background:#FFF3AC;
    position:relative;}
  #lftBar {
    position:absolute;
    width:100px;	/* nb affects width of text, not panel; corresponds to 'level1' margin-left */
    top:9px;
    left:9px;}
  #rgtBar {
    position:absolute;
    width:200px;	/* 9em */ /* nb affects width of text, not underlying panel  */
    top:0;
    right:0;
    text-align:center;
    }
  #main h1 {
    margin:0;
    padding-left:.3em;
    padding-right:5em;
    font-size:1.25em;	/* Verdana,Helvetica,Arial */
    color:#609;
    background:#cccccc;	/* FC0 */
    }
  #main dt {
    font-weight:bold;
    font-size:120%;
    margin-top:.8em}
  #rgtBar h3 {
    margin:0;
    padding:3px;
    color:#609;
    background:#cccccc;	/* FC0 */
    font-weight:bold;
    font-size:1em;
    text-align:center;}
  #topBar form {
    float:right;
    width:10.5em;
    text-align:right;
    margin:0;
    line-height:.7em;}
  #topBar input {font-size:.8em;}
  #topBar b {
    display:block;
    text-align:left;
    font:bold .8em/1.7em Arial,Geneva,sans-serif;
    padding-left:.5em;}
  #tipTit {
    width:7em;
    position:absolute;
    text-align:center;
    top:-1.8em;
    right:0;
    font:.8em/1.8em Arial,Geneva,sans-serif;}
  #advBar p{text-align:right;margin:0 0.5em;font-weight:bold;}
  #advBar img{margin-bottom:1em}
  a img {border:none;}
  .note {color:red}
  
  /* ADD band-specific stuff... */
  div.biopix { 
  	border:none; width:100%; 
  	padding:0.50em; margin-bottom:1em; 
    text-align: left; 
    } /* width:100%; border:none; text-align:left; font-size:0.85em; */
  img {border:none;}
  img.biopix {margin:0.50em; float:left;}
  img.fullsize {margin-top:1.0em;}	/* improves image positioning */ 
  table {padding: 0;}
  tr {padding: 0;}
  td {padding: 0;}
  p.nav { margin-top:0.25em; text-align:center; letter-spacing:0.10em; }	/* text nav para */
  p.navpix { margin-top:0.25em; text-align:center; }	/* numbers only - allows more entries */
  p.biopix {font-size:0.875em; float:right;}/* margin-top:1.0em;  */
  p.pageinfo {font-size:0.75em;}
  a.nav { font-size:0.75em; }
  span.nav { font-size:0.75em; color:#666666;}	/* numbers only - for selected image */
  span.leadin {font-weight:bold; letter-spacing:0.10em;}
  #alert {border:solid thin #ff0000; padding: 0.20em;}
  #info  {border:none; padding: 0; background:transparent; color:#609; font-style:italic;} /* same colour as headings etc. */
  #data { border:none; font-family: "Trebuchet MS", Helvetica, sans-serif; font-size: 0.90em; }/* Courier New, monospace */
