@charset "iso-8859-1";

/* - - - - - - - - - - - - - - - - - - - - - - - - - -   new version to go with new php pages */

/* - - - - - - - - - - - - - - - - - - - - - -   Global settings - fairly basic to begin with */

body
  {
    background:             rgb(200, 227, 241);         /* My favourite blue (for the moment) */
    background-image:       url("../images/fades/FadeIn.png"); /*  .. fading in from the left */
    background-repeat:      repeat-y;
     
    color:                  rgb(36, 43, 101);           /* A darker blue for the text         */ 
  
/* There is probably something obvious that I'm missing - there usually is - but ..           */
/*  .. if the first font is not present, ..                                                   */
/*  ..  .. IE(7) ignores those after the first line break and just uses its own default.      */
    font-family:            Verdana, Arial, sans-serif;
    font-size:              12px;
    font-weight:            normal;
    
    padding-top:            0;
    padding-left:           0;
    padding-bottom:         0;
    padding-right:          0;

    border-top-width:       0;
    border-left-width:      0;
    border-bottom-width:    0;
    border-right-width:     0;

    margin-top:             0;
    margin-left:            0;
    margin-bottom:          0;
    margin-right:           0;
  }

body * 
  {
    padding-top:            0;                          /* I don't want any implicit space    */
    padding-left:           0;                          /*  .. anywhere, but will this be     */
    padding-bottom:         0;                          /*  .. enough to achieve that?        */
    padding-right:          0;                          /* I'm playing safe and being as      */
                                                        /*  .. explicit as I can, because     */
    border-top-width:       0;                          /*  .. Opera, in particular, keeps    */
    border-left-width:      0;                          /*  .. catching me out.               */
    border-bottom-width:    0;
    border-right-width:     0;

    margin-top:             0;
    margin-left:            0;
    margin-bottom:          0;
    margin-right:           0;
  }

body p                                  
  {
    padding-top:            0;                          /* Default paragraph spacing here ..  */
    padding-bottom:         0.9em;                      /*  .. should apply everywhere        */
  }

/* Because the 1.05s were cumulative, I have had to change this selector: div#Main p, div#Main li
   Paragraphs are (always, I think) directly inside Divisions (but possibly subordinate divisions).
   They are also sometimes inside List Items (in both Ordered, and Unordered, Lists), but sometimes text
   in these List Items is not in Paragraphs. Text elsewhere was not styled by the original.
   There ought to be a better way to dela with the List Items but it doesn't spring to mind,
   and this doesn't really cover all possibilities. I will investigate further when I can. */
div#Main > p, div#Main Div > p, 
div#Main > ul > li, div#Main Div > ul > li,
div#Main > ul > li, div#Main Div > ol > li,
div#Main > ol > li, div#Main Div > ul > li,
div#Main > ol > li, div#Main Div > ol > li
  {
  	font-size:             1.05em;
    line-height:           140%;
  }
  
body h2
  {
    font-size:              2em;                        /* As should other global attributes  */
    font-weight:            bold;
    padding-top:            0.2em;
    padding-bottom:         0.5em;
  }

body h3
  {
    font-size:              1.67em;
    font-style:             italic;
    font-weight:            bold;
    padding-top:            0.8em;
    padding-bottom:         0.6em;
  }

body h4
  {
    font-size:              1.33em;
    font-style:             italic;
    font-weight:            bold;
    padding-top:            0.25em;
    padding-bottom:         0.75em;
  }

body h5
  {
    font-size:              1.25em;
    font-style:             italic;
    font-weight:            bold;
    padding-top:            0.25em;
    padding-bottom:         0.6em;
  }

body a
  {   
    color:                  rgb(36, 43, 101);           /* Global explicit settings prevent   */
                                                        /*  .. automatic purple for visited   */
    text-decoration:        none;                       /*  .. and underlines everywhere      */
  }
body a:hover
  { /* need to do something to stop 'quicklinks' wobbling on hover due to change of font */
    font-style:             italic;                     /* (I think) I always want this       */
  }


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   Top and Bottom of Page */

/* The aim is to have a page-wide header with a right aligned logo as background              */
/*  .. and a single line of light-coloured text as specified in the page                      */
/* Also a page-wide footer with a smaller right-margin aligned logo as its background         */
/* The logos may vary from page to page but top and bottom ones should match                  */
/* Header and Footer are done differently for all sorts of complicated reasons and, no matter */
/*  .. what I try, I can neither fully understand, nor get Firefox and IE to behave the same. */

div.Header
  { 
    background-position:    top right;                  /* Logo image in top right            */
    background-repeat:      no-repeat;                  /*  .. once!                          */

    margin-left:            200px;                      /* Allow for LHS - same as on #RHS    */
    margin-right:           1.5%;                       /* Looks neater slightly off edge     */
  }

div.Header *                                            /* Everything subordinate to Header   */
  {
    margin-right:           160px;                      /* Approx width of background image   */
    margin-top:             0;                          /* Don't want any excess space        */
    margin-bottom:          0;                          /*  .. above or below this text       */
    padding:                0;                          /* Override body p setting            */

    color:                  rgb(216, 235, 244);         /* Pale Blue                          */
    font-size:              6.4em;                      /* Big enough for depth of logo       */

    /* I would have preferred to use "white-space: nowrap;" but, understandably perhaps, it   */
    /*  .. overrides right margins, so a non-breaking string with overflow suppressed is the  */
    overflow:               hidden;                     /*  .. next best thing                */
  }

div.Header p.LinkAbout
  {
    margin-right:           1.5%;
    font-size:              1em;
    font-family:            Arial, Helvetica, sans-serif;
    color:                  rgb(36, 43, 101);
    text-align:             right;	
  }
div.HomeLightning p.LinkAbout
  {
    font-size:              0.67em;						/* Because HomeLightning is bigger    */
  }
div.Header p.LinkAbout *
  {
    margin-right:           0;							/* Paragraph has required margin      */
    font-size:              inherit;					/* Font size as per paragraph         */
  }

div.Footer
  { 
    clear:                  both;
	
    background-position:    top right;                  /* Logo image in top right            */
    background-repeat:      no-repeat;                  /*  .. once!                          */

    margin-left:            2.5%;
    margin-right:           2.5%;
  }

div.Footer br#LogoHeight
  {
    font-size:              50px;                       /* Just to ensure logo is above line  */
  }                                                     /* Use of this should slowly decrease */

div.Footer p.Navigation                                 /* Class will allow Navigation > once */
  {
    padding-top:            26px;                       /* Just to ensure logo is above line  */
                                                        /* Will need changing for Home Page   */
    margin-left:            180px;                      /* Stay wide of Left Flank            */
    margin-right:           140px;                      /*  .. and terminal logo at right     */
                                                        /*  .. N.B. Home Page logo is big     */
  } /* See later for link style */

div.Footer hr
  {
    /* Firefox and Opera colour horizontal rules in the background colour. IE's requirement   */
    /* for the foreground colour is handled in a separate IE-only style sheet.                */
    background-color:       rgb(36, 43, 101);
    height:                 2px;                        /* Opera seems to default to zero     */
  }

div.Footer p#W3CLogo
  {
    float:                  left;
    margin-left:            0;                          /* Always seems to need to be explicit*/
    padding-top:            5px;                        /* A little space around the logo ..  */
    padding-bottom:         5px;                        /*  .. IE adds extra, no idea why     */
  }

div.Footer p#CopyRight
  {
    text-align:             right;
    font-size:              0.75em;                     /* This doesn't seem to work properly */
    margin-top:             0;                          /* Don't want any excess space        */
    padding:                0;                          /* Override body p setting            */
  }

/* Following three, for the home page, may well change - just fixing because I have screwed   */
/*  .. the page with the changes I made to the style sheet. I WILL revisit this               */

div.HomeLightning           { background-image: url("../images/logoed/LightningLarge.png");
                              font-family:      "Old English Text MT", Arial;
                              font-size:        1.5em;                                         }
div.HomeLightning *                                     /* Override same setting on Header *  */
  {                                                     /* This really needs looking at       */
    margin-right:           240px;                      /* Approx width of background image   */
  }

div.HomeLightningSmall      { background-image: url("../images/logoed/Lightning.png");         }
div.HomeLightningSmall br#LogoHeight { font-size: 60px; } /* Home page has bigger image       */
                                                          /* But this won't be needed soon    */
div.HomeLightningSmall p.Navigation { padding-top: 54px; }    /* This is crap! */

div.Lightning               { background-image: url("../images/logoed/Lightning.png");         }
div.LightningSmall          { background-image: url("../images/logoed/LightningSmall.png");    }

div.Explosion2              { background-image: url("../images/logoed/Explosion2.png");        }
div.Explosion2Small         { background-image: url("../images/logoed/Explosion2Small.png");   }

div.Bubble                  { background-image: url("../images/logoed/Bubble.png");            }
div.BubbleSmall             { background-image: url("../images/logoed/BubbleSmall.png");       }

div.Oblique2003             { background-image: url("../images/logoed/Oblique2003.png");       }
div.Oblique2003Small        { background-image: url("../images/logoed/Oblique2003Small.png");  }
  
/* When the window is too narrow to hold what it has to, it has a horizontal scrollbar */
/*  .. and scrolling causes the right hand side to scroll sideways - but the left is fixed  */
/*  .. so the one overlays  the other. Can I fix vertically but not horizontally?  */

/* Dealt with for PHP version   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - - - - - - - - - - - - - - - - - -    Left column: Badges of honour, links, etc.  */

/* Ems are cumulative - body is 12px. LeftFlank 1.5em (=18px), here we want 16px = 0.88em     */

div#LeftFlank, div#LeftFlankFix
  {
    float:                  left;                       /* What else for the left column?     */
    width:                  180px;
    text-align:             center;
    font-size:              1.5em;
    
    top:                    0;
    left:                   0;
    
    margin-top:             1.5em;
  }

div#LeftFlankFix
  {
    position:               fixed;
  }

div#LeftFlank p, div#LeftFlankFix p
  {
    padding-bottom:         0;                          /* Override specification in body ..  */
                                                        /*  .. which should be more specific  */
                                                        /*  .. so that this is only temporary */
  }

div#LeftFlank > div, div#LeftFlankFix > div
  {
    margin-top:             2em;
  }

div#LeftFlank > div#MVPDates
  { 
    margin-top:             0.9em;
    font-size:              0.9em;
  }

div#LeftFlank > div#WordMVPSite
  {
    min-height:             4em;
    font-family:            Arial, sans-serif;          /* See body (above) for comments      */
    font-size:              1em; 
    font-weight:            bold;
  }

div#LeftFlank > div#WordMVPSite > a                     /* Override "body a" setting (q.v.)   */
  {
    color:                  rgb(90, 115, 189);
  }

div#LeftFlank > div#WordMVPSite #WordMVPSiteProud
  {
    font-size:              1.222em;
    color:                  rgb(0, 0, 0);
  }

div#LeftFlankFix > div#FirstLink
  { 
    margin-top:             5em;
  }

div#LeftFlankFix > div#FirstLink + div#FirstLink 
  { /* This is truly horrible - needs attention in php */
    margin-top:             1em;
  }

div#LeftFlankFix > div#BrowserCommentsText
  {                                                     /* I should check out what is needed! */
    margin-top:             11em;
    margin-bottom:          0;
    margin-left:            20%;
    margin-right:           15%;

    padding-top:            1.0em;
    padding-bottom:         1.0em;
    padding-left:           1.0em;
    padding-right:          1.0em;

    border-top-style:       dotted;
    border-bottom-style:    dotted;
    border-left-style:      dotted;
    border-right-style:     dotted;

    border-top-width:       1px;
    border-bottom-width:    1px;
    border-left-width:      1px;
    border-right-width:     1px;

    font-size:              0.5em;
    text-align:             justify;
  }

/* div#LeftFlank > div a:hover
  {
    font-style:             italic;
  } */

/* Dealt with for PHP version   - - - - to here - - - - - - - - - - - - - - - - - - - - - - - */



div#LeftFlank p.Navigation
  {
    padding-top:            6em;
  }
div#LeftFlank p.Navigation + p.Navigation
  {
    padding-top:            0;                           /* No padding after first one        */
  }


/* What follows started as a copy of the WordMVPSite style (above) that could be used on the  */
/* Links page. When I have finalised it I will revisit the one above (and its use on the      */
/* home page to see if I can make everything consistent.                                      */


/* PHP version styles replace LinkText styles below */
div.IndexLink
  {
    font-family:            Arial, sans-serif;          /* See body (above) for comments      */
    font-size:              1.5em; 
    font-weight:            bold;
    
    float:                  left;
    padding-right:          2em;
    padding-top:            0.5em;
  }
div.IndexLink > a                                       /* Override "body a" setting (q.v.)   */
  {
    color:                  rgb(90, 115, 189);
  }

div.IndexText
  {
    margin-left:            250px;
  }
/* End new PHP styles */
/* Start redundant styles */
body a.LinkText
  {
    font-family:            Arial, sans-serif;          /* See body (above) for comments      */
    font-size:              1.5em; 
    line-height:            2.277em;                    /* To be certain (see below)          */
    font-weight:            bold;
    color:                  rgb(90, 115, 189);
    
    float:                  left;
    /* padding-top:            0.5em; */
    padding-right:          2em;
    clear:                  both;
  }

body a.LinkText + p
  {
    margin-left:            250px;
  }

body a.LinkText .LinkTextProud
  {
    font-size:              1.222em;
    color:                  rgb(0, 0, 0);
  }

body a.LinkText:hover
  {
    font-style:             italic;
    line-height:            2.277em;                    /* Override change made by italicis'n */
                                                        /*  .. so following images don't move */
  }
/* End redundant styles */
/* - - - - - - - - - - - - - - - - - - - - - -   Right column: main body of page  - - - - - - */

#Main
  {
    margin-left:            200px;                      /* Absolute val leaves space for LHS  */
    margin-right:           5%;                         /* Relative value is generally better */
  }

#Main h2 .OE
  {
    font-family:            "Old English Text MT", Arial;
    font-size:              1.15em;                     /* OE Text is smaller than Verdana    */
  }

p.LastUpdate /* changed for php version - now a footer component */
  {
    margin-top:             1em;
    float:                  right;
    text-align:             right;
    font-size:              0.8em;
    font-style:             italic;
  }

p.Acknowledgement
  {
    margin-left:            5%;                         /* An extra 5%                        */
    margin-right:           5%;
    font-style:             italic;

    padding-top:            0.8em;
    padding-bottom:         0.8em;
    padding-left:           0.8em;
    padding-right:          0.8em;

    border-top-style:       dotted;
    border-bottom-style:    dotted;
    border-left-style:      dotted;
    border-right-style:     dotted;

    border-top-width:       1px;
    border-bottom-width:    1px;
    border-left-width:      1px;
    border-right-width:     1px;
  }

p.Clarification
  {
    margin-bottom:          0.5em;
    
    padding-top:            0.8em;
    padding-bottom:         0.8em;
    padding-left:           0.8em;
    padding-right:          0.8em;

    border-top-style:       dotted;
    border-bottom-style:    dotted;
    border-left-style:      dotted;
    border-right-style:     dotted;

    border-top-width:       1px;
    border-bottom-width:    1px;
    border-left-width:      1px;
    border-right-width:     1px;
  }

.Caveat 
  {
    margin-left:            5%;                         /* An extra 5%                        */
    margin-bottom:          0.9em; 
    font-style:             italic;

    padding-top:            0.6em;
    padding-bottom:         0.6em;
    padding-left:           0.8em;
    padding-right:          0.8em;

    border-top-style:       dotted;
    border-bottom-style:    dotted;
    border-left-style:      dotted;
    border-right-style:     dotted;

    border-top-width:       1px;
    border-bottom-width:    1px;
    border-left-width:      1px;
    border-right-width:     1px;
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  Classes for In-line Links */

body a.LinkInline
  {
	font-style:             italic;
  }
body a.LinkInline         { color: rgb(0, 102, 204);  } 
body a.LinkInline:hover   { color: rgb(0, 153, 204);  }
body a.LinkInline:visited { color: rgb(153, 51, 204); } 

.VBAComment a.LinkInline         { color: rgb(51, 153, 0);  }
.VBAComment a.LinkInline:hover   { color: rgb(51, 204, 0);  }
.VBAComment a.LinkInline:visited { color: rgb(153, 153, 0);  }

body p.Navigation a                                     /* Might make Footer-specific later   */
  {
    font-style:             italic;
  }

body p.Navigation a         { color: rgb(0, 102, 204);  } /* Might change later!              */ 
body p.Navigation a:hover   { color: rgb(0, 153, 204);  } /* Might change later!              */
body p.Navigation a:visited { color: rgb(153, 51, 204); } /* Might change later!              */

/* I *may* (indeed, should) be able to use "navigation" for this but, at the time of writing, */
/* am unsure where else it is used and don't want to affect wherever that may be. Hence this  */
/* new class, which is only used on the Home page.                                            */

body p.ShortNavigation
  {
    margin-left:            5%;
  }
body p.ShortNavigation a
  {
    font-style:             italic;
    color:                  rgb(0, 0, 255);
  }
body p.ShortNavigation .OE
  {
    font-family:            "Old English Text MT", Arial;
    color:                  rgb(54, 95, 145);
    font-weight:            bold;
    font-size:              1.15em;                      /* OE Text is smaller than Verdana   */
  }
  
body p.Diversion .OE
  {
    font-family:            "Old English Text MT", Arial;
    color:                  rgb(54, 95, 145);
    font-weight:            bold;
    font-size:              1.15em;                      /* OE Text is smaller than Verdana   */
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - -   Classes for standalone On-site Links */

/* I tried using a list with list-style-image but I couldn't get it to work in Firefox.       */
/* In fact I had troubles with list styles generally and need to revisit them sometime.       */

body .Diversion
  {
    margin-left:            5%;
  }
body .Diversion img
  {
    vertical-align:         middle; /* investigate */
  }
body .Diversion a
  {
    color:                  rgb(0, 0, 255);
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   Special for download link icon */

img.verticalcentre
  {
	vertical-align:         middle;
  }

/* - - - - - - - - - - - - - - - - - - - - - -   Special for browser page download link icons */

img.flushright
  {
	float:                  right;
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - -  Classes for File and Folder Icons */

/* I'm not over the moon about this but it does appear to be making the display as I want.    */

body .ExplorerView
  {
    margin-left:            4em;
  }
  
body .ExplorerView .ExplorerIndent
  {
    margin-left:            1.5em;
  }
  
body .ExplorerView .ExplorerIndent2
  {
    margin-left:            3em;
  }
  
body .ExplorerView .ExplorerIndent3
  {
    margin-left:            4.5em;
  }
  
body .ExplorerView img
  {
    vertical-align:         baseline; 
  }

body .ExplorerText
  {
    vertical-align:         top; 
  }
  
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -    Image Layouts */

/* New styles for quotes Jan 2014 */

div.IndentedQuote
  {
    margin-left:            7%;
  }

/* End Jan 2014 */

p.CentredImage                                          /* To centre an image, put it in a .. */
  {                                                     /*  .. paragraph and centre-align ..  */
    text-align:             center;                     /*  .. the text in the paragraph.     */
    margin-top:             1em;
    margin-bottom:          2em; /* overflow:hidden; why did I have this here? */
  }

p.IndentedImage                                         /* Used for some larger images        */
  {                                                     /* I can't really remember why!       */
    text-align:             left;
    margin-left:            5%;
  }

p.LeftAlignedImage                                      /* Used for Ribbon Group pictures     */
  {
    text-align:             left;
    margin-left:            1%;
    margin-top:             1.5em;
    margin-bottom:          1.5em;
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - -   Styles for bulleted and numbered lists */

body ul                                                 /* When not otherwise styled          */
  {
    margin-left:            5%;
  }
body ul.SpacedList, body ul.NestedList
  {
    padding-bottom:         0.2em;
  }

body ul.SpacedList li, body ul.NestedList li
  {
    /* margin-left:            5%; --- percentages are cumulative so just let it fall back    */
    padding-bottom:         0.9em;
  }

body ul.SpacedList ul
  {
    padding-top:            0.9em;
  }

body ul.SpacedList ul.NestedList
  {
    list-style-type:        circle;
  }

body ol.NumberedList
  {
    list-style-type:        decimal;
  }
body ol.LowerAlphaList
  {
    list-style-type:        lower-alpha;
  }
body ol.NumberedList li, body ol.LowerAlphaList li
  {
    margin-left:            5%;
    padding-bottom:         0.9em;
  }

/* This is entirely artificial because I want to suppress extra indentation on an unordered   */
/* list buried in an ordered one (on page 2007). I must revisit this and sort it out.         */
body ol ul 
  {
    margin-left: 0;
  }
/* I think what's wanted is this (globally - allowing for specific overrides)
   ul, ol { margin-left:            5%; }
   ul ul, ul ol, ol, ol, ol ul {margin-left:            0;} 
   and remove some other bits - but what about li - does it need anything?
   But must check it out first */
   
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -    Styles for tables */

body table.CentredTable
  {
    margin-left:            auto;
    margin-right:           auto;
    margin-bottom:          1.5em;
  }

body table.CollapsedBorders
  {
    border-collapse:        collapse;
  }
       
body table.CentredTable caption.Caption
  {
    margin-left:            auto;
    margin-right:           auto;
    padding-top:            0.9em; 
    padding-bottom:         0.9em; 
  }

body th, td                                             /* All headers and details for now .. */
  {                                                     /*  .. but designed for above classes */
    text-align:             center;
    padding-top:            0.35em;
    padding-bottom:         0.35em;
    padding-left:           0.25em;
    padding-right:          0.25em;

    border-style:           solid;
    border-width:           0.1em;
    border-color:           rgb(155, 180, 213);
  }

body table.PaddedCells td
  {
    padding-left:           2em;
    padding-right:          2em;
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   Styles for formatting VBA Code */

/* It appears as though I cannot overlay two background images, both with repeat-x. Shame.    */
/* So faded in VBA background is done in two halves. Rather than trying to sort out exact ..  */
/*  .. depths, both halves have both left and right fades as well as top or bottom bits.      */

body pre                                                /* Defaults for code                  */
  { 
    font-family:            "Courier New", monospace;   /* See body (above) for comments      */
    color:                  rgb(0, 0, 255);
    padding-left:           2.5%;
    padding-top:            1em;
    padding-bottom:         1.5em;
  }

/* taking padding off both top and bottom leads to overlap - I need to spend some time on this */  
body pre.dumpT  
  { 
    padding-left:           5%;
  }
body pre.dumpB  
  { 
    padding-top:            0;
    padding-left:           5%;
  }
  
body pre .Separator
  {
    border-bottom-style:    solid;
    border-bottom-width:    1px;
    border-bottom-color:    rgb(0, 128, 0);
    
    padding-right:          50em;
  }

body pre .VBAComment                                    /* Green for comments                 */
  {
    color:                  rgb(0, 128, 0);
  }
body pre .VBAEmphasis
  {
    color:                  rgb(255, 0, 0);
  }
body pre .VBAEmphasisMuted 
  {
    color:                  rgb(139, 0, 0);
  }

body pre .HexHighlight
  {
    background-color:       rgb(255, 255, 0);
  }
body pre .HexHighlightPink
  {
    background-color:       rgb(255, 192, 255);
  }
  
body pre.BlockXml                                       /* Almost same as classless pre, but  */
  {
    color:                  rgb(0, 0, 0);               /* .. default colour for xml is black */
    padding-left:           5%;                         /* .. and I want to indent it more    */
  }

body pre .XmlOperator                                   /* Trying to match Custom UI Editor   */ 
  {
    color:                  rgb(0, 0, 255);
  }
body pre .XmlTagId 
  {
    color:                  rgb(128, 0, 0);
  }
body pre .XmlAttributeId 
  {
    color:                  rgb(255, 0, 0);
  }
body pre .XmlAttributeValue 
  {
    color:                  rgb(0, 0, 255);
  }
body pre .XmlComment 
  {
    color:                  rgb(0, 128, 0);
  }  
body pre .XmlQuote 
  {
    color:                  rgb(0, 0, 0);
  }  
  
div.VBA3T                                               /* Top half: left hand side           */
  {
    background-color:       rgb(216, 235, 244);
    background-image:       url("../images/fades/VBALeft.png"); 
    background-position:    left;
    background-repeat:      repeat-y;
    max-width:              700px;                      /* Absolute max to override relative  */
                                                        /*  .. width on wide screen           */
  }
div.VBA3T > div                                         /* Top half: right hand side          */
  {
    background-image:       url("../images/fades/VBARight.png"); 
    background-position:    right;
    background-repeat:      repeat-y;
  }
div.VBA3T > div > div                                   /* Top half: top                      */
  {
    background-image:       url("../images/fades/VBATop.png");
    background-position:    top;
    background-repeat:      repeat-x;
  }
div.VBA3T > div > div > div                             /* Top half: top right                */
  {
    background-image:       url("../images/fades/VBATopRight.png"); 
    background-position:    top right;
    background-repeat:      no-repeat;
  }
div.VBA3T pre                                           /* Top half: top left in with code    */
  {
    background-image:       url("../images/fades/VBATopLeft.png"); 
    background-position:    top left;
    background-repeat:      no-repeat;
    margin-bottom:          -1em;                       /* Suppress blank line after end tag  */
  }

div.VBA3T pre.TabXml                                    /* Built-in tab xml pages have img in */
  {                                                     /* faded area before pre tag so use   */
    background-image:       url("../images/fades/VBALeft.png"); /* left graphic, not top left */
    padding-left:           3em;                        /* and is offset slightly             */
  }

div.VBA3T img.TabXml                                    /* The image in the faded area has    */
  {
    background-image:       url("../images/fades/VBATopLeft.png"); /* the top left graphic    */
    background-position:    top left;
    background-repeat:      no-repeat;
    padding-left:           3em;                        /* and is offset slightly             */
    padding-top:            3em;
  }

div.VBA3B                                               /* Bottom half: left hand side        */
  {
    background-color:       rgb(216, 235, 244);
    background-image:       url("../images/fades/VBALeft.png"); 
    background-position:    left;
    background-repeat:      repeat-y;
    max-width:              700px;                      /* Absolute max to override relative  */
                                                        /*  .. width on wide screen           */
  }
div.VBA3B > div                                         /* Bottom half: right hand side       */
  {
    background-image:       url("../images/fades/VBARight.png"); 
    background-position:    right;
    background-repeat:      repeat-y;
  }
div.VBA3B > div > div                                   /* Bottom half: bottom                */
  {
    background-image:       url("../images/fades/VBABottom.png");
    background-position:    bottom;
    background-repeat:      repeat-x;
  }
div.VBA3B > div > div > div                             /* Bottom half: bottom right          */
  {
    background-image:       url("../images/fades/VBABottomRight.png"); 
    background-position:    bottom right;
    background-repeat:      no-repeat;
  }
div.VBA3B pre                                           /* Bottom half: top left in with code */
  {
    background-image:       url("../images/fades/VBABottomLeft.png"); 
    background-position:    bottom left;
    background-repeat:      no-repeat;
  }

/* I can do better than this quick fix! */
div.VBA3B pre.TabXmlNoImage                             /* Some built-in tab xml has image in */
  {                                                     /* faded area after pre tag so use    */
    background-image:       url("../images/fades/VBABottomLeft.png"); /* left graphic, not bot left */
    padding-left:           3em;                        /* and is offset slightly             */
  }

div.VBA3B pre.TabXml                                    /* Some built-in tab xml has image in */
  {                                                     /* faded area after pre tag so use    */
    background-image:       url("../images/fades/VBALeft.png"); /* left graphic, not bot left */
    padding-left:           3em;                        /* and is offset slightly             */
  }

div.VBA3B img.TabXml                                    /* The image in the faded area has    */
  {
    background-image:       url("../images/fades/VBABottomLeft.png"); /* bottom left graphic  */
    background-position:    bottom left;
    background-repeat:      no-repeat;
    padding-left:           3em;                        /* and is offset slightly             */
    padding-bottom:         3em;
  }

body .VBAName
  {
    font-style:             italic;                     /* Italicise properties and methods   */
  }
body .VBAInline, body .VBAInlineNoBreak, body .VBACommentInline
  {
    font-family:            "Courier New", monospace;   /* See body (above) for comments      */
    font-size:              1.1em;                      /* Courier is smaller than Verdana    */
    color:                  rgb(0, 0, 255);
  }
body .VBAInlineNoBreak
  {
	white-space:			nowrap; 
  }
body .VBACommentInline
  {
    color:                  rgb(0, 128, 0);
  }

body p.VBACaption
  {
    text-align:             left;
    margin-left:            5%;
  }

/* - - - - - - - - - - - - - - - - - - - - - - -   Copies of above for formatting XML in-line */

body .InlineXML
  { 
    font-family:            "Courier New", monospace; 
    font-size:              1.1em;                      /* Courier is smaller than Verdana    */
    color:                  rgb(0, 0, 0);
  }
body .InlineXML .XmlOperator
  {
    color:                  rgb(0, 0, 255);
  }
body .InlineXML .XmlTagId 
  {
    color:                  rgb(128, 0, 0);
  }
body .InlineXML .XmlAttributeId 
  {
    color:                  rgb(255, 0, 0);
  }
body .InlineXML .XmlAttributeValue 
  {
    color:                  rgb(0, 0, 255);
  }
body .InlineXML .XmlComment 
  {
    color:                  rgb(0, 128, 0);
  }  
body .InlineXML .XmlQuote 
  {
    color:                  rgb(0, 0, 0);
  }  

/* - - - - - - - - - - - - - - - - - - - - - - - - - - -    Technical (non-VBA) terms in-line */

body .TechnicalTerm
  {
    font-style:             italic;                     /* Italicise                          */
  }

/* - - - - - - - - - - - - - - - - - - - - - -   Experimenting with acronyms and speaking out */

acronym.SpellOut
  {
    speak:                  spell-out;
  }

/* - - - - - - - - - - - - - - - - - - - - - - -   Shaded highlight for Word 2010 Information */

p.ShadedNoteBox
  {
    margin-top:             1em;
    margin-bottom:          1em;
    margin-left:            7%;
    margin-right:           8%;
    color:                  blue;

    padding-top:            1.0em;
    padding-bottom:         1.0em;
    padding-left:           1.0em;
    padding-right:          1.0em;

    border-top-style:       solid;
    border-bottom-style:    solid;
    border-left-style:      solid;
    border-right-style:     solid;

    border-top-width:       2px;
    border-bottom-width:    2px;
    border-left-width:      2px;
    border-right-width:     2px;

    background-color:       rgb(180, 212, 240);

  }

/* - - - - - - - - - - - - - - - - - - - - - - -   Experimenting with IE Conditional Comments */

div.BrowserNote /* Where is this used? */
  {
    border-style:           dotted;
    border-width:           1px;
    border-color:           rgb(36, 43, 101);
    
    padding-left:           1em;
    padding-right:          1em;
    padding-bottom:         1em;
    
    margin-left:            1%;
    margin-right:           2%;
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - -   Suppress display of IE6-only items */

.IE6Only
  {
    display:                none;
  }
  
/* - - - - - - - - - - - - - - - - - - - - - - - - - -   Suppress display of print-only items */

body .InPrint
  {
    display:                none;
    color:                  rgb(0, 0, 0);               /* Not needed here but helps testing  */
  }

body .OnScreen, .OnScreen *								/* OnScreen, everything subordinate.. */
  {
    display:                inline;                     /* I did have a comment here, saying  */
    													/* "just for clarity" - clearly more! */
  }
body p.OnScreen											/* .. except for paragraphs. Without  */
														/*  .. this, paragraphs don't throw   */
														/*  .. new lines after them. Why??    */
  {
    display:                inherit;  }

/* End  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   End */