/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

   This contains the bulk of the style definitions for SWeSBA is intended 
   to provide everything needed for
   all common types of document.

   Restoration Works Colours being used:

   000080  Navy  for text
   000080  Navy on horizontal menu
   CCCCFF Pale blue for background
   ADFF2F Bright green for menu hover  - old
   FFCC66 Apricot for menu hover - Old
   CC9933 Browner Apricot for menu hover - current

----------------------------------------------------------------------
*/


/*     B O D Y    D E F I N I T I O N S
       ================================
*/


BODY
{ 
font: 16px Maiandra GD, serif;
   /*
   The margins below are designed to provide left and right margins
   to keep the text away from the edge of the window and also to allow
   for an absolutely positioned banner and navigation area at the top.
   */

   BACKGROUND-COLOR : #CCCCFF;  
   COLOR: #000080; /* Navy */
   

/* Turn on the border to see the different browser approaches to where
   the body is in the window...
*/

/*
   BORDER-WIDTH:5px;
   BORDER-STYLE: solid;
*/

}

/* decrease spacing after headers */
h2 {margin-bottom: 0; padding-bottom: 0;}
h3 {margin-bottom: 0; padding-bottom: 0;}
h4 {margin-bottom: 0; padding-bottom: 0;}

/* 
images
------
*/

#photo, .img 
{
   padding:1px;
   border:1px solid #021a40;; 
   display: inline-block; 
}


#leftcolumn
{
	margin-right: -230px;	/* IE 4 fix */
}
#leftColumn
{
	float: left;
	width: 230px;
	/*/*/ /*/margin: 0 0 0 2px; /* Silly Netscape hack to get the borders to line up */
}

#footer
{
	clear: left;
}
#innerFooter
{
text-align:center; 
}

#w3cFooter
{
text-align:right;
}


#contentColumn
{
	width: auto;
	margin-left: 229px;
}
#innerLeftColumn, #innerContentColumn, #innerFooter
{
	padding: 10px;
}


/* Documents which are index pages tend to have significant differences
   from others.
*/

BODY.index
{


   MARGIN-LEFT: 0px;
   MARGIN-TOP: 148px;

}

/*   C O N T E N T   D I V I S I O N   D E F I N I T I O N S
     =======================================================
*/

/*  The content division is used to hold the main part of a
    document.  It is needed as a general defence against various
    browser defects and as a way of removing constraints from
    design evolution.  Not all documents will have a content division,
    especially older ones.  This is why BODY attributes have to be set
    as well.
*/


DIV.content
{
   MARGIN-LEFT: 30px;
   MARGIN-RIGHT: 30px;         /* Keep text away from window borders */
   MARGIN-TOP: 180px;      /* Allows room for top banner and navigate */

}


.index DIV.content
{
	margin-top: 180px;
	margin-right: 15px;
	margin-left: 200px;
}




/*     B A N N E R   D I V I S I O N   D E F I N I T I O N S
       =====================================================
*/



#banner
{
   POSITION: absolute;

	FONT-FAMILY: Tempus Sans ITC, Times New Roman, serif;
   
   LEFT: 0px;
   TOP: 0px;
   HEIGHT: 120px;
   WIDTH: 100%;
   BACKGROUND-IMAGE: URL(restoration_works_logo.jpg);
   BACKGROUND-ATTACHMENT: scroll;
   BACKGROUND-POSITION: top right;
   BACKGROUND-REPEAT: no-repeat
}


/* 
    The Restoration Works logo appears in the banner.

*/


#banner H1
{
   TEXT-ALIGN: left;
   MARGIN-TOP: 4px;
   MARGIN-LEFT: 3px;
   FONT-SIZE: 36px;
   COLOR: #000080; /* Gets over-riden by link */
   MARGIN-BOTTOM: 0px;
}

#banner H2
{
   PADDING-TOP: 0px;
   TEXT-ALIGN: left; 
   MARGIN-TOP: 0px;
   MARGIN-LEFT: 3px;
   FONT-SIZE: 24px;
   COLOR: #000080;  /* Navy */
}



/* Don't decorate hyperlinks in the banner.
 */

#banner A:link, #banner A:visited
{
   TEXT-DECORATION: none;
   COLOR: #000080; /* Navy */
}

#banner A:active, #banner A:hover
{
   TEXT-DECORATION: underline;
}




/*     T I T L E   D I V I S I O N   D E F I N I T I O N S
       ===================================================
*/

/* In theory, these atributes could be applied to any element
   we'd want to put into the title (eg H1), but in practice,
   IE 4 does not seem to allow a naked H1 to float in this
   way - it always allocates the maximum width possible.
*/


.title
{
   WIDTH: 50%;
   FLOAT: right;
   TEXT-ALIGN: right
}


.index .title
{
   MARGIN-RIGHT: 25px;
   /* This allows some free space so the title clears the new
      absolute placement of the security classification.
   */
}

/* Reduce the amount of whitespace below a main heading in an
   index document.
*/
.index .title H1
{
   TEXT-ALIGN: left;
   MARGIN-BOTTOM: 0px
}



/*     G E N E R A L   D E F I N I T I O N S
       =====================================
*/



H1, H2, H3, H4, H5, H6, B
{
   COLOR: #000080; /* Navy */
}



/* weird hyperlinks */

A:link
{
   COLOR: #000080 /* Navy */
}

A:active, A:hover
{
   COLOR: #000080 /* Navy */
}

A:visited
{
   COLOR: #000080; /* Navy */
}

/*
     Other stuff
     -----------
*/


.highlight
/* Intended to look like a highlighter pen */
{
  BACKGROUND: #FFFF99;
  COLOR:      #000000
}


.bright { COLOR : yellow }


.speculative { COLOR : gray }
/* Used to indicate material is not yet agreed or implemented */

.speculative A
{
   COLOR: gray
}


.note
/* Used to make a note stand out in the text */
{
   COLOR: green;
   MARGIN-LEFT: 1em;
   MARGIN-RIGHT: 1em;
}

.warning
/* Used to make a warning note stand out in the text */
{
   COLOR: red;
   MARGIN-LEFT: 1em;
   MARGIN-RIGHT: 1em;
}


.boxed
/* Used to make an example, sample code, lists etc stand out.
   Navigator does not cope well with this. In a DD block it creates
   a box and then puts the text underneath it.  In a PRE block it
   creates a boxed area but forgets the preformatted text property.
 */
{
   PADDING: 1em;
   MARGIN: 1em;
   BACKGROUND: silver;
   BORDER: solid 1px;
}



/* Pullquotes are used as divisions to take a quotation from the
   main body of the document and float them as images for effect.
   However, bear in mind that a non-style-aware browser will render
   the division as a normal part of the body and therefore the quotes
   have to be designed and placed to blend in with the body.
*/


.pullquote
{
   DISPLAY: block;
   FONT-SIZE: 120%;
   TEXT-ALIGN: CENTER;
   BORDER-TOP: medium black solid;
   BORDER-BOTTOM: thin black solid;
   MARGIN: 1em;
   PADDING: 0.5em;
   BACKGROUND: #990099;
   WIDTH: 10em;
   FLOAT: right
}




/* Signature:

   Normally used with a P tag.  Make signatures cursive and on the right.
   The size is larger because cursive fonts tend to be hard to read.
   (PR_basic provides the right-alignment property)
 */

.signature
{
   TEXT-ALIGN: right;
   FONT-SIZE: larger;
   FONT-FAMILY: cursive
}



/* Lists
   -----

   Provide a way of separating elements of a list more than
   the default very tight one.  But this will propagate to
   nested lists, so provide a means of overriding that.

   Also reduce the separation of paragraphs inside a list
   so that the list items hang together better.

*/

OL.loose LI, UL.loose LI
{
   MARGIN-BOTTOM: .5em
}

OL.tight LI, UL.tight LI
{
   MARGIN-BOTTOM: 0
}

OL P, UL P
{
   MARGIN-TOP: .25em;
   MARGIN-BOTTOM: 0
}







/*   C H A N G E S   T O   B A S I C   T A G S
     =========================================
*/


/* Normally I don't like messing with the implementation of the unadorned
   standard tags, but those below come up so frequently that I can't resist.
*/


KBD
{
   FONT-WEIGHT: bold
}


/* Browsers seem to render CODE blocks in a monospace font that is
   visibly smaller than the surrounding text.  This change makes
   code fit in better.
*/

CODE
{
   FONT-SIZE: larger
}



/*     D O C U P D A T E S   D I V I S I O N   D E F I N I T I O N S
       =============================================================
*/

/*
   Intended as a DIV, this is for document status information such as
   revision history, reviewer list and so on.  See the document.html
   template to see how it is normally used.  The intent of the style
   is to subtly distinguish this document management information from
   the bulk of the document content.

*/

.docupdates
{
   FONT-SIZE: smaller;
}




/*     D O C I N F O   D I V I S I O N   D E F I N I T I O N S
       =======================================================
*/


/*
   Intended as a DIV, docinfo is for document information such as its ID,
   author, possibly copyright notice, etc.
*/

.docinfo
{
   BORDER-TOP: thin gray solid;
   BORDER-BOTTOM: thin gray solid;
   PADDING: 0.5em;
   FONT-SIZE: xx-small;
   COLOR: #666666;
   TEXT-ALIGN: right
}

/*
   Note that xx-small is meant to be an absolute setting, but in IE seems
   to behave much like FONT SIZE = -2.  Watch out for possible anomolies
   in other browsers.  (I've used it because "smaller" isn't small enough)
*/


/*     C O N T E X T   D I V I S I O N   D E F I N I T I O N S
       =======================================================
*/


/* Intended for a DIV, this places the material in an absolute
   position in the owning block.

   The DIV can be placed anywhere in the body.

   The recommended division to use for new documents is #context.

   Earlier documents used .nav, which is also supported here,
   but deprecated.  .nav contents in existing documents don't
   quite fit the new designs, so in changing them, it is
   advisable to change the division name at the same time.

   Existing Wiki documents use a division called .contextlinks for
   a similar purpose.  This is also supported here.  We don't know
   yet whether this should be deprecated.

   The implementation is designed to allow an H1 in the context
   division to form a special title.  The recommended construct
   for the context elements is an unordered list, but ordinary
   body text will also work.

 */



/* Earlier .nav implementations were a vertical list implemented
   with line breaks.  Here we turn off line breaks in the .nav
   context so that things go horizontal.
*/
.nav BR
{
   WHITE-SPACE: nowrap;
   DISPLAY: none;
   POSITION: relative;
}


#horizontal_menu, .nav, .contextlinks
{
   POSITION: absolute;
   TOP: 130px; LEFT: 20%;
   WIDTH: 80%;
/*   HEIGHT: 17px; */
/* This is the height we expect it to have with 1 line of text.
   Browsers don't behave consistently when the content overflows
   a fixed height, so we've explicitly allowed this division to grow
   downwards.  The rest of the page layout is designed to accommodate
   a reasonable amount of this.
*/

   FONT-SIZE: 16px;
   COLOR: white;
   PADDING-BOTTOM: 3px;
/*   PADDING-RIGHT: 15px; */

/*   WHITE-SPACE: nowrap; */
   BACKGROUND: #000080; /* Navy */
}

/*   Implementation notes:
   Turn on the HEIGHT parameter if you wish the context bar to be
   of fixed height.  (This won't guarantee it in IE, but Mozilla
   honours it)  The current settings specify that the bar is allowed
   to grow downwards to contain the text.  The padding-BOTTOM setting
   gives a little bit of space below the text so it appears centred in
   the line.  If you don't want the text to grow downwards (because it
   will interfere with the page content, eventually) then turn on
   the WHITE-SPACE: nowrap; parameter.  Long contexts will then go off
   the end of the window.

   Note that the height of the context division with the above settings
   is determined by the font metrics specified.  Mozilla has a defect
   in which it enlarges fixed-size text along with content, so there
   will be interfernce with the absolutely-positioned menu in this
   browser.

   Turn on the PADDING-RIGHT value to get the menu stripe to reach the
   full window width in IE.  Note that if you do this, you'll get a
   permanent horizontal scroll bar in Firefox and probably other
   browsers.

*/


#horizontal_menu H1
{
   POSITION: absolute;
   LEFT: -175px;
   WIDTH: 175px;
   TOP: 0px;
   TEXT-ALIGN: center;
   BACKGROUND: #000080; /* Navy */
   MARGIN-TOP: 2px;
   MARGIN-BOTTOM: 0;
   PADDING-RIGHT: 0;
   MARGIN-RIGHT: 0;
   PADDING-BOTTOM: 0;
/*	BORDER: 1px solid #FFFFFF; */
/*   TEXT-TRANSFORM: uppercase; */
   FONT-SIZE: 12px;
   FONT-WEIGHT: bolder;
   COLOR: #FFFFFF; /* White */
}
/* Implementation notes:

   Providing a left padding OR margin causes mozilla to bleed the
   heading a bit beyond the 175px width.  Compromise was to center
   the heading, which creates a similar effect with wide headings.
   This will be a problem if the centred heading offends design
   sensibilities.

   The solid white border has been commented out because I thought
   it looked ugly.  Needs discussion perhaps.

*/




#horizontal_menu H1 A:link, #horizontal_menu H1 A:visited
{
   COLOR: #FFFFFF; /* White */
   TEXT-DECORATION: none;
   FONT-WEIGHT: bolder
}


#horizontal_menu H1 A:active, #horizontal_menu H1 A:hover
{
   TEXT-DECORATION: underline;
   COLOR: #CC9933; /* bronze */

}


#horizontal_menu UL, .horizontal_menulinks UL
{
/*   LIST-STYLE-TYPE: ; */
   MARGIN-TOP: 0px;
   MARGIN-BOTTOM: 0px;
   PADDING-TOP: 2px;
   PADDING-LEFT: 20px; 
   MARGIN-LEFT: 5px;
}

#horizontal_menu LI, .horizontal_menulinks LI
{
/*   WHITE-SPACE: nowrap; */
   DISPLAY: inline;
   LIST-STYLE-IMAGE: URL(restoration_works_logo.jpg);
   TEXT-INDENT: 25px; 
   PADDING-LEFT: 20px;
}

#horizontal_menu LI:before, .horizontal_menulinks LI:before
{
   CONTENT: "";
   COLOR: white;
   FONT-WEIGHT:bolder
}


#horizontal_menu A:link, #horizontal_menu A:visited,
.nav A:link, .nav A:visited,
.horizontal_menulinks A:link, .horizontal_menulinks A:visited
{
   COLOR: white;
   TEXT-DECORATION: underline;
   FONT-WEIGHT: bolder;
}

#horizontal_menu A:active, #horizontal_menu A:hover,
.nav A:active, .nav A:hover,
.horizontal_menulinks A:active, .horizontal_menulinks A:hover
{
   COLOR: #CC9933; /* was COLOR: 990099; */
}

/*     H O M E C O N T E X T
       =====================

   This is intended for a division to be used in templates
   or Wiki "skins" which will place a context title over the
   designated area of the context layout.  It allows for global
   subsitution of the heading text with a server-side include.
 
*/

#homecontext
{

   POSITION: absolute;
   LEFT: 0px;
   WIDTH: 21%;
   TOP: 130px;
   TEXT-ALIGN: center;
   BACKGROUND: #000080; /* Navy */
   MARGIN-BOTTOM: 0;
   PADDING-RIGHT: 0;
   MARGIN-RIGHT: 0;
   PADDING-BOTTOM: 3px;
   FONT-SIZE: 16px;
   FONT-WEIGHT: bolder;
   COLOR: #FFFFFF;
   Z-INDEX: 10

}

/*
   The width of the homecontext division is set to 21% rather than
   20% because IE creates a small gap between the homecontext and
   the horizontal menu.  The extra percentage point is a kludge to
   make that disappear.
*/


/* The Z-INDEX is intended to make sure that the homecontext division
   overlays the context division even if it appears first in the
   text stream.
*/



#homecontext H1
{
   MARGIN-TOP: 2px;
   MARGIN-BOTTOM: 0;
   FONT-SIZE: 16px;
   FONT-WEIGHT: bolder;
   COLOR: #FFFFFF
}


#homecontext A:link, #homecontext A:visited
{
   COLOR: white;
   TEXT-DECORATION: none;
}

#homecontext A:active, #homecontext A:hover
{
   COLOR: #CC9933; /* was  COLOR: 990099; */
   TEXT-DECORATION: underline
}


/* csswarn is intended for material that should only appear if the
   rendering agent is not honouring style sheets or is not dealing
   with them correctly.
*/


.csswarn
{
   FONT-STYLE: italic;
   FONT-SIZE: smaller;
   COLOR: green;
   DISPLAY: none
}


@media print
{
   BODY
   {
      FONT-FAMILY: "Maiandra GD", "Times New Roman", serif;
      MARGIN-TOP: 10px
   }

   H1, H2, H3, H4, H5, H6
   {
      page-break-after: avoid
   }


   /*
      No point in printing a navigation division.
      However, early IEs seem to honour this on screen, even though they
      otherwise appear to ignore the @media section.
   */

   .nav
   {
      DISPLAY: none
   }

   #context, #homecontext, #banner
   {
      DISPLAY: none
   }

}

/* E N D   O F   F I L E
   =====================
*/