@charset "iso-8859-1";

/* - - - - - - - - - - - - - - - - - - - - - -   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        */
  }

div#Main p
  {
  	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 a 
  {
    color:                  rgb(36, 43, 101);           /* Global explicit settings prevent   */
                                                        /*  .. automatic purple for visited   */
    text-decoration:        none;                       /*  .. and underlines everywhere      */
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   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 img#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?  */

/* - - - - - - - - - - - - - - - - - - - - - -    Left column: Badges of honour, links, etc.  */

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

/* I want to make the left column scroll on the home page, because it's too deep for many     */
/* screen sizes. */
.HomeLightning + #LeftFlank                             /* This needs a better approach!      */
  {                                                     /*  .. but it works for the moment    */
    position:               absolute;
  }

/* - - - - - - - - - - - - -    Specific styles for textual links in left column of home page */

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

#LeftFlank #MSMVPLogo
  {
    padding-top:            3em;
  }

#LeftFlank #MSMVP
  {
    font-size:              0.9em;
  }

#LeftFlank #MSMVP a:hover
  {
    font-style:             italic;
  }

#LeftFlank a#WordMVPSite
  {
    font-family:            Arial, sans-serif;          /* See body (above) for comments      */
    font-size:              1em; 
    line-height:            1.277em;                    /* To be certain (see below)          */
    font-weight:            bold;
    color:                  rgb(90, 115, 189);
  }

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

#LeftFlank a#WordMVPSite:hover
  {
    font-style:             italic;
    line-height:            1.277em;                    /* Override change made by italicis'n */
                                                        /*  .. so following images don't move */
  }

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.                                      */

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 */
  }

/* - - - - - - - - - - - - - - - - - - - - - -   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   */
  }

#Main p.LastUpdate
  {
    margin-top:             1em;
    float:                  right;
    text-align:             right;
    font-size:              0.8em;
    font-style:             italic;
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  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);
  }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - -  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 */

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
  {
    padding-bottom:         0.2em;
  }

body ul.SpacedList 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 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;
  }
  
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 .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 .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 .VBACommentInline
  {
    color:                  rgb(0, 128, 0);
  }

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

/* - - - - - - - - - - - - - - - - - - - - - - - - - - -    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#LeftFlank p.BrowserCommentsText
  {
    margin-top:             10em;
    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.BrowserNote
  {
    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 */