/* Created       2000-12-11        */
/* Issued        2000-12-21        */
/* Modified      2001-10-13        */
/* Last checked  2001-10-13        */
/* Copyright (c) 2001, Philip Shaw */
/*   All rights reserved           */
/* N.B. Unsafe for IE3 and NN4,    */
/*   not be used for linked styles */
/* ------------------------------- */

/*
  IMPORTANT: This stylesheet is no
  longer in use from 2001-09-30, see
http://www.codestyle.org/css/CodeStyleCSS.shtml
  It remains available for reference
  purposes only and is not
  recommended for use.
*/

/*
  General structural elements
  declared from 'top to bottom'
*/

/*
  #Header height must be declared
  for Opera 3.62, otherwise logo
  disappears.
*/

#Header{
  height:           100px;
  padding-bottom:   2%;
  text-align:       right;
}


/*
  @media rule allows more flexible
  height: auto declaration for
  supporting browsers, which is
  hidden from Opera 3.62.
*/

@media screen{
  #Header{
    height:         auto;
  }
}

#Header P,
#Header H1{
  margin-right:     20%;
  margin-bottom:    0;
}

/*
  text-align set left to
  counteract IE4, which right aligns
  text with float: right.
*/

#Content{
  float:            right;
  width:            74%;
  padding:          0% 0.1% 0% 1.9%;
  margin:           0;
  border-left:      solid 1px #EEE;
  text-align:       left;
}

/*
  IMPORTANT:

  clear: both in simple #Content
  type selector crashes IE4!

  clear: right doesn't crash IE4,
  but doesn't allow #Sidebar to
  float left alongside it.

  None of the following selectors
  hides this declaration from IE4:

  * > DIV#Content
  * > #Content
  BODY > #Content

  But the @media rule with one
  declaration does.

  This rule is necessary for
  Opera 4 & 5 and Netscape 6.
*/
@media screen{
  #Content{
    clear:          right;
  }
}

/*
  Pull-in margin-right to float
  images and box-outs there.

  First version for IE4, which
  seems to calculate the % width
  as a proportion of the full screen.
  Second @media rule for working
  CSS browsers.
*/

#Content P,
#Content OL,
#Content UL,
#Content DL{
  margin-right:     25%;
  line-height:      1.3em;
}

/*
  But don't compound the margin
*/
#Content OL OL,
#Content UL UL,
#Content OL P,
#Content UL P,
#Content DD P,
#Content DD OL,
#Content DD UL,
#Content .MenuBox UL,
#Content .MenuBox OL{
  margin-right:     0;
}

/*
  Round cornered sidebar container
*/
#Sidebar{
  color:            #000;
  background:       #EEF;
  float:            left;
  width:            22%;
  clear:            none;
  padding:          0;
  margin-right:     1%;
  border:           none;
  font-family:      arial,
                    helvetica,
                    sans-serif;
}

/*
  IE 5 seems to assume some text
  content in empty divs which makes
  the background image repeat, so
  font-size is minimised. Margin,
  padding and border are also
  minimised.
*/

.Top,
.TopLeft,
.TopRight,
.Bottom,
.BotLeft,
.BotRight{
  height:           10px;
  margin:           0;
  padding:          0;
  font-size:        0;
}

.Top,
.Bottom{
  float:            none;
  width:            100%;
}

.Top{
  color:            #FFF;
  background:       #039;
  border:           none;
}

/*
  All corners the same size
*/
.TopLeft,
.TopRight,
.BotLeft,
.BotRight{
  width:            10px;
  border:           none;
}

/* Left corners */
.TopLeft,
.BotLeft{
  float:            left;
}

/* Right corners */
.TopRight,
.BotRight{
  float:            right;
}

/*
  Top left corner background is
  light grey to match edge of
  background image.
*/
.TopLeft{
  color:            #000;
  background:       url(/images/corn-tl-10px039.gif)
                    #EEE;
}

.TopRight{
  color:            #000;
  background:       url(/images/corn-tr-10px039.gif)
                    #FFF;
}

/*
  WARNING: border-top-color same as
  background colour: Opera 4 & 5
  require some non-zero border to
  stop div 'breaking out' beneath
  the curves
*/

.Bottom{
  color:            #000;
  background:       #EEF;
  border-top:       solid 1px #EEF;
}

.BotLeft{
  color:            #000;
  background:       url(/images/corn-bl-10pxFFFMask.gif)
                    #EEF;
}

.BotRight{
  color:            #000;
  background:       url(/images/corn-br-10pxFFFMask.gif)
                    #EEF;
}

/* Temporary, pre-launch */
#Sidebar P{
  padding:          4px;
  text-align:       center;
  font-size:        smaller;
}

.Options{
  color:            #FFF;
  background:       #039;
  clear:            both;
  padding:          0em 0em 0.1em 0.4em;
  margin:           0;
  border-bottom:    solid 1px #99C;
  line-height:      1em;
  letter-spacing:   0.1em;
  font-weight:      normal;
  font-size:        2em;
  font-family:      "times new roman",
                    times,
                    serif;
}

/*
  Netscape 6.0 doesn't seem to
  inherit padding from #Sidebar, so
*/
UL.Menu{
  padding-left:     0.2em;
  padding-top:      0.5em;
  margin-top:       0;
  margin-left:      1.5em;
}

/*
  To control menu point spacing
  between browsers
*/
UL.Menu LI{
  padding:          0;
  margin:           0;
  border:           none;
  line-height:      1.3em;
}

/*
  Ends sidebar declarations
*/

#Footbar{
  clear:            both;
  color:            #FFF;
  background:       #039;
  border-top-color: #99C;
  border-bottom-color: #006;
  border-style:     solid;
  border-width:     2px 0px;
  margin-top:       1em;
  padding-bottom:   0.1em;
  text-align:       center;
  font-family:      arial, sans-serif;
}

#Footbar A:visited{
  color:            #CCC;
  background:       #039;
}

/*
  A:link and A:hover must be declared
  separately, not in a grouped
  selector for Opera 3.62 to render
  A:link styles.
*/

#Footbar A:link{
  color:            #FFF;
  background:       #039;
}

#Footbar A:hover{
  color:            #FFF;
  background:       #039;
}

#Footer{
  float:            none;
  width:            97%;
  clear:            both;
  padding:          1%;
  margin:           0%;
  border:           none;
  text-align:       center;
  font-size:        smaller;
  font-family:      arial,
                    helvetica,
                    sans-serif;
}

/*
  Box-out classes and contextual
  selectors
*/
.Box,
.MenuBox{
  background:       url(/images/CodeStyleFeintCrop.gif)
                    no-repeat
                    #FFF;
  color:            #000;
  padding:          1%;
  margin-top:       1em;
  margin-bottom:    1em;
  border:           solid 1px #EEE;
}
.MenuBox{
  margin-right:     25%;
}
.MenuBox H2,
.MenuBox H3{
  margin-left:      3%;
}

/*
  Floating box-outs; .RgtBox floats
  in wide right margin area beneath
  logo.
*/
.RgtBox,
.RgtPicBox,
.LftBox,
.LftPicBox{
  color:            #000;
  background:       #EEF;
  width:            22%;
  padding:          0.5em;
  border:           solid 1px #CCC;
  text-align:       left;
}

.RgtBox,
.RgtPicBox{
  float:            right;
  margin-left:      0.5em;
}

.LftBox,
.LftPicBox{
  float:            left;
  margin-right:     0.5em;
}

/*
  P styles must be more specific
  than the #Content P selector.
*/

#Content .RgtBox P,
#Content .LftBox P{
  margin:           0em 0em 0.5em 0em;
  padding:          0em;
  font-size:        smaller;
  font-family:      arial, sans-serif;
}

.LftPicBox H3,
.RgtPicBox H3,
.RgtBox H3,
.LftBox H3{
  margin-top:       0;
  text-align:       left;
}

/*
  Ends general structural elements
*/

/*
  Other specific classes
*/

.GIFLogo{
  float:            right;
  margin:           1% 1.5%;
  border:           none;
}
.FlashLogo{
  float:            right;
  border:           none;
  margin:           1% 2%;

/*
  percent lengths operate on canvass
  size, so height is different from
  width! These settings "work" at
  multiple resolutions, but need
  testing.
  width:            12%;
  height:           19.5%;
*/
/*
  em lengths map with font size and
  are equal in width and height.
*/
  width:            7em;
  height:           7em;
}

.URI{
  margin:           1% 20% 0% 0%;
  font-size:        113%;
  font-weight:      normal;
  font-family:      "times new roman",
                    times,
                    serif;
}

.URI A:visited,
.URI A:link{
  color:            #039;
  background:       none;
}

.Title{
  color:            #039;
  background:       none;
  margin:           1.5% 20% 0% 0%;
  font-size:        2.2em;
}

.WideNav{
  display:          none;
}

#Content .Standfirst{
  color:            #333;
  background:       none;
  margin-top:       0;
  font-weight:      bold;
}


/* Drop cap style standfirst not used
#Content .Standfirst{
  line-height:      1.5em;
}

#Content .Standfirst:first-letter{
  float:            left;
  width:            1.1em;
  height:           1em;
  font-size:        3.25em;
  line-height:      0.95em;
  padding:          0;
  margin:           0;
}

#Content .Standfirst:first-line{
  text-transform:   uppercase;
}
*/

.Standfirst Q{
  color:            #039;
  background:       transparent;
}

/* Abbreviations are dark blue */
ABBR{
  color:            #006;
  background:       transparent;
}

.CS{
  color:            #039;
  background:       none;
  text-transform:   lowercase;
  white-space:      nowrap;
  font-size:        113%;
  font-style:       normal;
  font-weight:      normal;
  font-family:      "times new roman",
                    roman,
                    serif;
}

/*
  Links to /css/Warning.shtml are invisible in
  supporting browsers.
*/
.NoStyle{
  display:          none;
}

/* border-top used in place of HR */
.NewSection{
  padding-top:      1em;
  border-top:       solid 1px #EEE;
}

/* Clear floating elements */
.ClearAll{
  clear:            both;
}

.Warning{
  color:            #FF0;
  background:       #C00;
  letter-spacing:   0.2em;

}

/* Used in box-outs, etc. */
.Caption{
  text-align:       center;
  font-size:        small;
}

/*
  Float footer images (not used)
*/
.ValidXHTML,
.ValidHTML{
  display:          block;
  float:            left;
  width:            88px;
  height:           33px;
  padding:          0;
  margin:           0;
  border:           none;

}

.CorrectCSS{
  display:          block;
  float:            right;
  width:            88px;
  height:           33px;
  padding:          0;
  margin:           0;
  border:           none;
}

.ByLine{
  text-align:       right;
}
.Right{
  text-align:       right;
}

.NOBR{
  white-space:      nowrap;
}


/*
  Ends other specific classes
*/

/*
  Block level elements and grouped
  selectors
*/

BODY{
  color:            #000;
  background:       url(/images/CodeStyleFeint.gif)
                    -68px -88px
                    no-repeat
                    #FFF;
}


/* Reduced margins beneath headings */
H1,
H2,
H3,
H4,
H5,
H6,
DT{
  color:            #039;
  background:       transparent;
  margin-bottom:    0.2em;
  letter-spacing:   0.02em;
  font-family:      serif;
}

H1,
H2,
H3{
  font-weight:      normal;
}

H4,
H5,
H6,
TH,
DT{
  font-weight:      bold;
}

DT{
  margin-top:       0.5em;

}
/*
  Top margin minimised to enable compact
  heading/paragraph style, dark grey, no
  font styles specified.
*/
P{
  margin-top:       0;
  color:            #333;
  background:       transparent;
}
UL, OL{
  margin-top:       0;
  color:            #333;
  background:       transparent;
  text-align:       left;
}


DD{
  margin-left:      1em;
}

DL.TOC{
  color:            #000;
  background:       #EEF;
  margin-top:       0;
  margin-right:     25%;
  padding:          2%;
  border-top:       solid thick #039;
  border-right:     solid thin #039;
  border-bottom:    double medium #039;
}

DL.TOC DT{
  font-size:        larger;
  font-weight:      normal;
}

DL.TOC DD{
  margin-left:      0;
  text-indent:      0;
}

DL.TOC DD H3,
DL.TOC DD UL{
  margin-left:      5%;
  padding-left:     0;
}


UL{
  list-style:       url(/images/bull-12px039.gif) disc;
}

/*
  Override the list-style-image
  property for this square only
  marker.
*/
UL.Checkbox{
  list-style-image: none;
  list-style-type:  square;
}


/*
  WARNING: border-top-color same as
  background colour.
*/

PRE{
  color:            #039;
  background:       #EEE;
  clear:            both;
  white-space:      pre;
  padding:          2%;
  margin:           1em 0em 1em 0em;
  border-style:     solid;
  border-width:     2px 2px 1px 2px;
  border-color:     #eee #dfdfdf #666 #ccc;
  font-size:        90%;
  font-family:      "courier new",
                    courier,
                    monospace;
}
PRE.Terminal{
  color:            #FFF;
  background:       #000;
  border:           ridge medium #999;
}

BLOCKQUOTE, Q{
  color:            #039;
  background:       none;
}

/*
  Ends block level elements
*/

/*
  Table elements and contextual
  selectors
*/

TABLE{
  clear:            both;
  margin:           2% 0%;
}

CAPTION{
  color:            #039;
  background:       none;
  padding-top:      2%;
  text-align:       left;
  letter-spacing:   0.02em;
  font-weight:      bold;
}

TH{
  color:            #039;
  background:       transparent;
  margin-bottom:    0.2em;
  letter-spacing:   0.02em;
  text-align:       left;
  font-family:      arial,
                    helvetica,
                    sans-serif;
}

TD P{
  text-align:       left;
}

TD UL{
  margin-left:      10%;
}

/*
  Ends table elements and contextual
  selectors
*/

/*
  Inline elements
*/

CODE{
  color:            #039;
  background:       none;
  letter-spacing:   0;
  font-size:        105%;
  font-family:      "courier new",
                    courier,
                    monospace;
}

/*
  code in headings
*/
H1 CODE,
H2 CODE,
H3 CODE,
H4 CODE,
H5 CODE,
H6 CODE,
TH CODE,
DT CODE,
.Standfirst CODE{
  font-weight:      bold;
}

I,
EM,
.Note{
  font-style:       italic;
}

B,
STRONG{
  color:            #333;
  background:       transparent;
  font-weight:      bold;
}

INPUT,
TEXTAREA,
SELECT{
  border-width:     1px;
  font-family:      "courier new",
                    courier,
                    monospace;
}
.Inline{
  line-height:      1em;
  height:           1.45em;
  padding:          0;
  margin:           0;
  font-size:        smaller;
}

/*
  color was #933;
*/

A:visited{
  color:            #639;
  background:       none;
  text-decoration:  underline;
}

A:active{
  color:            #C33;
  background:       none;
  text-decoration:  underline;
}

A:link{
  color:            #33C;
  background:       none;
  text-decoration:  underline;
}

A:hover{
  color:            #C33;
  background:       none;
  text-decoration:  underline;
}

SUP{
  font-size:        small;
}

/*
  Ends inline elements
*/

/*
  Replaced elements
*/

IMG{
  border:           none;
}

/*
  Ends replaced elements
*/

/*
  Article styles
*/

/*
  Buggy/Yes/No/Not Applicable
*/

.B{
  color:            #000;
  background:       #F00;
  font-weight:      bold;
}
.Y{
  color:            #000;
  background:       #090;
  font-weight:      bold;
}
.N{
  color:            #000;
  background:       #F60;
  font-weight:      bold;
}
.NA{
  color:            #000;
  background:       #EEE;
  font-size:        60%;
}
.W{
  color:            #FF0;
  background:       #C00;
  font-weight:      bold;
}
TD.B,
TD.Y,
TD.N,
TD.NA,
TD.W{
  text-align:       center;
}
.SubHeading{
  color:            #000;
  background:       #999;
  text-align:       center;
  font-size:        small;
  font-family:      serif;
}
.SuperHeading,
.ImgHeading{
  color:            #000;
  background:       #CCC;
  text-align:       center;
}
.SuperData{
  color:            #333;
  background:       #FFC;
  font-size:        smaller;
  border-top:       solid 1px #000;
  border-bottom:    solid 1px #000;
}
.SubData{
  text-align:       right;
}
.TestData{
  text-align:       center;
  font-size:        small;
  font-family:      arial, sans-serif;
}
.RadioData{
  text-align:       center;
  color:            #000;
  background:       #EEE;
}
.Category{
  color:            #000;
  background:       #FFF;
  text-align:       right;
}

/* FAQ styles */

.FAQ DT{
  margin-top:       1em;
  font-size:        110%;
}
.FAQ DD{
  margin-top:       0.5em;
}

.A,
.Q{
  color:            #039;
  background:       #FFF;
  font-size:        larger;
}

/*
  Generic link up-screen
*/
.TopLink{
  text-align:       right;
}

.Accesskey{
  text-decoration:  underline;
}

.AlphaLinks{
  color:           #000;
  background:      #EEF;
  padding:         0% 1%;
  border:          solid 1px #CCC;
  text-align:      center;
}

.Section{
  font-weight:    bold;
}