body 
{  
  background: #FFF url(images/grid_institute_watermark_white_large_draft.jpg) center 0 no-repeat;
  /*Do not allow background image to scroll*/
  background-attachment: fixed;
  background-color: #FFFFFF;  
  color: #000000; 
  font-family: sans-serif;
  text-align:  justify;
} 

table.DocumentInfo td
{
  vertical-align: top;
}

div.RevisionDate
{
  font-family: Courier;
  font-size:   smaller;
  text-align:  center;
}

div.ExternalWrapper
{
  position: absolute;
  top:      350px;
  left:     50%;
  margin-left: -390px;
  width:    796;
}

div.Wrapper
{

  padding:  10px;
  border:   double #999 4px;
}

div.Banner
{
  position: absolute;
  top:      60px;
  left:     50%;
  margin-left: -387px;
  width:   784;
  padding: 2px;
  border:  double #999 1px;
  text-align: center;
}

img.BannerImage
{
  border:  solid #999 1px;
  padding: 1px;
}

div.Title h1
{
font-family:Arial, Helvetica, sans-serif;
font-size: x-large;
  background-color:#000;
  color:#FFF;
  padding: 5px;
  margin: -10px -10px 10px -10px;
}

img.BorderedImage
{
  border:  outset #ABA 2px;
  padding: 1px;
  background: #EEE;
}

/*
As always, supporting IE 6 proves to be a nightmare.
In Displaying the figures I set up some styles that
nicely flow the text around the images and captions 
in Mozilla. But IE quirks result in unexpected display
behavior. So then I set up CSS to simply center the
figures on the page and not flow text around them.
However, I.E. is too stupid even for that and will
just left justify the figures. Oh well...

So to switch off flow text and center align the figures
(or left align in IE 6) instead comment out 
table.ImageWrapper rules below and switch on the auto 
margin rules...
*/
/*
table.ImageWrapper
{
  margin-left:auto;
  margin-right:auto;
}
*/
table.ImageWrapper
{
  display:inline;
  float:right;
  margin:20px;
}


table.ImageWrapper td, table.UseCaseDiagramWrapper td
{
  text-align: center;
}

div.FigureCaption
{
  text-align:justify;
  font-size:smaller;
}


div.UseCase
{
  border: solid #575 1px;
  background-color: #FEFEFE;
  padding: 10px;
  margin:  5px 0px 5px 0px;
}

div.UseCaseTitle
{
  font-weight: bold;
  font-size:   120%;
  margin:      1em, 0, 1em, 0;
}

div.UseCase h2
{
  font-weight: bold;
  font-size:   100%;
  background-color: transparent;
}


table.UseCaseDiagramWrapper
{
  margin-left:auto;
  margin-right:auto;
}


div.UseCaseExtension, div.UseCaseException
{
  margin-left: 2em;
}

div.Contribute
{
  border: solid #575 1px;
  background-color: #FEFEFE;
  padding: 10px;
  text-align: center;
}

div.Copyright
{
  margin-top: 10px;
  /*border-top: double #AAA 2px;*/
  text-align: center;
}

div.Copyright img
{
  border: none;
}


h2 
{
  font: 120% sans-serif;
  background-color: rgb(230, 230, 230); 
  text-align: left;
}

h3 
{
  font: 110% sans-serif;
  font-style: italic; 
  text-align: left;
}

li p 
{
  text-align: left;
}

a:link, a:visited {	
	text-decoration:	none;
	color:			#3A3A3A;
	background:	 	#EFFDEE;
	}

a:hover {	
	text-decoration:	none;
	color:			#000;
	background:	 	#FBFE9C;
	}

a:active { color: #F00;}

.red {color: #FF0000}