/*
**------------------------------------------------------------------------------
** Global.
**------------------------------------------------------------------------------
*/

/*
** Tags.
*/
body
{
    font-family:Arial;
    font-size:small;
    padding:0px;
    margin:0px;
}

h1
{
    text-align:center;
    padding:0px;
    margin:0px;
    margin-top:0.7em;
    margin-bottom:0.6em;
    vertical-align:middle;
    line-height:1.5em;
}

h1.x-cell
{
    margin:30px 0px 0px 0px;
}

h2
{
    margin:0px;
    padding:0.5em;
    font-weight:normal;
}

h3
{
    color:Red;
    margin:0px;
    font-weight:bold;
    font-size:small;
    text-align:left;
}

h4
{
    margin:0px;
    padding:0px;
    font-size:small;
}

h4.left-a-bit  /* An h4 starting with an "S" looks indented for some reason so this style can be used to move it left a bit. */
{
    position:relative;
    left:-0.1em;
}

em
{
    color:Red;
    font-style:normal;
    font-weight:bold;
}

img
{
    border:none;
}

p
{
    margin-top:0px;
    padding-top:0px;
    text-align:justify;
}

sub
{
    font-size:smaller;
}

/*
** Style to make a DIV look like an HR since HRs don't seem to obey their color setting in Firefox.
*/
.hr, .hr-thin, .hr-blank-below, .hr-blank-above
{
    border-bottom:solid 2px red;
    clear:both;
    width:100%;
    line-height:6px;
    height:6px;
}

.hr-thin
{
    border-bottom-width:1px;
}

.hr-blank-below
{
    margin-bottom:1em;
}

.hr-blank-above
{
    margin-top:0.5em;
}

/*
** Formatting used for things related to being good for the environment. Needs to use specific selectors
** to avoid being overridden by other specific selectors.
*/
#buttons span.environment, div.product-selection-group h2 a.environment
{
    background-color:#00BB00;
}

/*
** Page header.
*/

#company-logo, #buttons
{
    margin-top:0.5em;
}

#company-logo
{
    float:left;
    margin-left:0.5em;
}

#buttons
{
    float:right;
	text-align:right;
    margin:0.5em 0px 2px 1em;
    border-collapse:collapse;
}

/*
** Background for main button style. Has to be separate from the button text style or the focus
** rectangle is displayed incorrectly due to the padding.
*/
#buttons span, span.button-main  /* Span elements in the buttons table in the header or any other specifically classed span. */
{
    display:inline-block;
	background-color:Red;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	padding-left: 0.6em;
	padding-right: 0.6em;
	margin-right:0.5em;
	margin-top:0.5em;
}

/*
** Button text.
*/
#buttons span a, .button-main a
{
	text-decoration: none;
	color: white;
	font-weight: bold;
}

#buttons span a:hover, span.button-main a:hover
{
    text-decoration: underline;
}

/*
** Smaller button for use in line with text.
*/
span.button-smaller
{
	padding-top: 0.2em;
	padding-bottom: 0.1em;
	padding-left: 0.2em;
	padding-right: 0.2em;
	margin-right:0em;
	margin-top:0em;
	position:relative;
	top:-0.05em;
}
span.button-smaller a
{
	font-weight:normal;
	font-style:normal;
}

.button-product-title {
    font-weight: bold;
    margin-top: 1.5em;
    margin-bottom: 0em;
    margin-left: 0.5em;
    margin-right: 0.5em;
}

/*
** Style to support and image with a caption.
*/
div.figure
{
    text-align:center;
    margin-left:1em;
}

div.figure img
{
    border:solid 1px black;
    padding:0.5em;
}

div.figure p
{
    text-align:center;
    font-size:smaller;
    margin:0px;
}

/*
** Styles used to determine if a tag's content is only displayed on the screen or only printed.
*/
.print-only-inline { display:none; }
.print-only-block  { display:none; }

/*
**------------------------------------------------------------------------------
** Home page specific formatting.
**------------------------------------------------------------------------------
*/

.picture-box
{
    display:inline;
    text-align:center;
    font-weight:bold;
}

.footnote
{
    font-style:italic;
    text-align:right;
    padding-right:0.1em;
    padding-top:0.3em;
}

.avoid-starburst
{
    margin-left:250px;
    margin-right:250px;
}

/*
**------------------------------------------------------------------------------
** Products page specific formatting.
**------------------------------------------------------------------------------
*/

div.product-selection-group
{
}

div.product-selection-group h2
{
    float:left;
    /*width:10em;*/
    padding-right:0px;
}

div.product-selection-group div
{
    float:right;
    text-align:center;
}

div.product-selection-group div table
{
    display:inline;
    border-collapse:collapse;
    text-align:center;
    margin-top:1em;
    margin-right:1.5em;
}

div.product-selection-group a.button-product
{
    display:inline-block;
    width: 10em;
    background-color: red;
    color: white;
    text-decoration: none;
    text-align: center;
    line-height: 1.4em;
    margin-top: 0.5em;
}

div.product-selection-group a:visited.button-product
{
}

div.product-selection-group a:hover.button-product
{
    text-decoration: underline;
}

div.product-selection-group a:active.button-product
{
    text-decoration: none;
}

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

div.full-width
{
    margin:2%;
}

div.box-full-width
{
    border: 1px solid Black;
    margin-left: 2.5%;
    margin-right: 2.5%;
    margin-top: 1em;
    margin-bottom: 1em;
    padding: 0.5em;
    text-align: justify;
    overflow:visible;
}

div.box-full-width-bullets
{
    margin-left: 2.5%;
    margin-right: 2.5%;
    margin-top: 1em;
    margin-bottom: 0;
    text-align: center;
    line-height: 150%;
}

div.box-half-width-left
{
    border: 1px solid black;
    width: 44%;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 2.5%;
    padding: 0.5em;
    float: left;
    text-align: justify;
}

div.box-half-width-right
{
    border: 1px solid Black;
    width: 44%;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-right: 2.5%;
    padding: 0.5em;
    float: right;
    text-align: justify;
}

div.distributor-list
{
    float: left;
    line-height: 2em;
    margin-bottom: 2em;
    margin-right: 4em;
}

.subtitle
{
    font-weight: bold;
    text-align: center;
    font-size: x-large;
    margin: 1%;
}

.product-title
{
    font-weight: bold;
    font-size: x-large;
    padding-bottom: 0.25em;
}

p.headline
{
    text-align: center;
    line-height: 150%;
    font-weight: bold;
}

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

table.table-1
{
    border-top: 1px solid Black;
    border-left: 1px solid Black;
    border-right: 1px solid Black;
    width:95%;
    margin-left:auto;
    margin-right:auto;
    border-collapse:collapse;
}

table.table-1 th, table.table-1 td
{
    border-bottom: 1px solid Black;
    text-align: center;
    padding: 0.5em;
}

table.table-1 thead th, table.table-1 thead td, table.table-1 tbody th.sh
{
    color: Red;
    font-weight: bold;
    padding: 0.5em;
}

table.table-1 thead th, table.table-1 tbody th
{
    font-weight: bold;
    text-align: left;
    padding: 0.5em;
}

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

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

table.table-1-1 td
{
    border: none;
    text-align: left;
    padding: 0em;
}

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

.table-2-row-head
{
    font-weight: bold;
    vertical-align: top;
    padding-right: 1em;
}

.table-2-content
{
    text-align: justify;
}

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

.table-3-border
{
    border: 1px solid black;
    border-right: 0px solid black;
    margin-right: 2em;
}

.table-3-col-head
{
    text-align: center;
    font-weight: bold;
    color: Red;
    width: 17em;
    padding: 0.5em;
    border-right: 1px solid Black;
}

.table-3-content
{
    text-align: center;
    width: 17em;
    border-top: 1px solid Black;
    border-right: 1px solid Black;
    padding: 0.5em;
}

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

table.table-4
{
    text-align:center;
    width:97%;
}

table.table-4 td, table.table-4 th
{
    padding:0.2em;
    white-space:nowrap;
}

table.table-4 th
{
    border-top: solid 1px Black;
    border-bottom: solid 2px Black;
    background-color:#F0F0F0;
    font-weight:bold;
}

table.table-4 td
{
    border-bottom: solid 1px Black;
}

table.table-4 .col-row-head
{
    border-left: solid 1px Black;
    font-weight:bold;
    text-align:left;
}

table.table-4 .col-last
{
    border-right: solid 1px Black;
}

table.table-4 th.col-group-head
{
    border-bottom: none;
    border-left: solid 1px Black;    
    border-right: solid 1px Black;    
}

table.table-4 th.col-sub-head
{
    border-left: solid 1px Black;    
    font-size:smaller;
    width: 4.1em;
}

table.table-4 td.red
{
    background-color:Red;
    border-left: solid 1px Black;
}

table.table-4 td.yellow
{
    background-color:Yellow;
    border-left: solid 1px Black;
}

table.table-4 td.green
{
    background-color:Lime;
    border-left: solid 1px Black;
    border-right: solid 1px Black;
}

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

table.table-5
{
    text-align:center;
    border-top: solid 1px Black;
    border-left: solid 1px Black;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:1em;
    border-collapse:collapse;
}

table.table-5 td, table.table-5 th
{
    border-bottom: solid 1px Black;
    border-right: solid 1px Black;
    padding:0.3em;
}

table.table-5 tbody th
{
    font-weight:normal;
}

table.table-5 tbody td
{
    font-weight:bold;
}

table.table-5 tfoot
{
    font-size:smaller;
    text-align:justify;
}

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

div.bullet-points
{
}

div.bullet-points p
{
    margin-bottom:0.4em;
}

div.bullet-points ul
{
    color:Red;
    list-style-type:disc;
    list-style-position:outside;
    margin-top:0em;
    margin-bottom:0em;
    padding-left:0.5em;  /* Firefox 3 has left padding by default and IE8 doesn't. */
    margin-left:0.5em;   /* IE has a left margin by default and Firefox 3 doesn't. */
}

div.bullet-points li
{
    margin-bottom:0.4em;
    vertical-align:middle;
}

div.items-compressed li
{
    margin-bottom:0em;
}

div.bullet-points span
{
    color:Black;
}

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

div.numbered-list
{
}

div.numbered-list p
{
    margin-bottom:0.4em;
}

div.numbered-list ol
{
    position:relative;
    left:-0.95em;
    margin-top:0em;
}

div.numbered-list li
{
    margin-bottom:0.4em;
}

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

.footnote-1-marker
{
    color:Red;
    vertical-align:text-top;
    text-decoration:none;
    font-weight:normal;
    font-size:smaller;
}

.footnote-1-text
{
    font-size: 80%;
}

img.product-bullet
{
    height: 30px;
    width: 30px;
}

.product-bullet-point
{
    font-weight: bold;
    padding-top: 7px;
    padding-left: 5px;
    padding-right: 10px;
    padding-bottom: 8px;
}

.bullet-point:first-letter
{
    color: Red;
    margin-right: 5px;
}

.bullet-point
{
    margin-left: 11px;
    text-indent: -11px;
    margin-top: 5px;
}

.id
{
    font-size: smaller;
    font-weight: bold;
    color: White;
    border: 1pt solid white;
    background-color: Black;
    padding: 0.25em;
}

.made-in-britain
{
    margin-left: 2.5%;
    vertical-align: middle;
}