/* common.css - External Version 20100422 - Including DDS Supplementary Changes (Form Search Panel, Toolbars, Key bars, Data-Grid Paging) */
/* ==========                                                                                                                             */

/* All lower-case variants of "buttonbdr", "formselect", "forminputtext" */
/*  are also supported to allow existing .Net controls to work with both */
/*  old and new stylesheets                                              */

body {
	background-color: #fff;
	margin: 0px;
	padding: 0px;
}

/* Style for horizontal-rules across panes before/after forms and visible content table */
hr {
   width: 100%;
   height: 1px;
   color: #000;
   background-color: #000;
   border: 0px;
   margin: 0px;
}


/* HTML Content Table Styles : START */
/* ================================= */
/* This section refers to styles used for visible content tables, rather than an invisible layout table such as table.master */

/* For templates prior to version 2.2.0, the "mainContentTable" style is used.       */
/* For templates 2.2.0 onwards, any table within the main content area will          */
/*  automatically pick-up the inline style due to the "mainContent" class.           */
/* In fact, tables without the "mainContentTable" style class work fine for          */
/*  templates prior to 2.2.0, except you cannot see the style in FrontPage "Normal"  */
/*  view                                                                             */

/* IMPORTANT                                                                         */
/* While data-grid styles are synonymous to that of a mainContentTable, please       */
/* ensure any changes are also updated in the "Data-Grids" styles further down       */

/* Table Itself: */
.mainContentTable,
.mainContent table,
#mainContent table {
	border: 1px solid #666;
	border-collapse: collapse;
	margin: 0px;
	padding: 0px;
}
/* Table Header Rows: */
.mainContentTable th,
.mainContent table th,
#mainContent table th {
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #bababa;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #666;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #666;
	height: 21px;
	vertical-align: top;
	text-align: left;
}
/* Standard Table Rows: */
.mainContentTable td,
.mainContent table td,
#mainContent table td {
	border-bottom-width: 0px;
	border-bottom-style: none;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #666;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #666;
	vertical-align: top;
}
/* Embedded tables - here ensuring the font size doesn't shrink! */
.mainContentTable table td,
.mainContentTable table th,
.mainContent table table td,
.mainContent table table th,
#mainContent table table td,
#mainContent table table th {
	font-size: 1em;
}
/* Embedded tables - the above declaration causes problems if a web browser renders in quirks mode. */
/*                   This is because tables, in such cases, do not correctly inherit parent styles. */
/*                   The solution - take advantage of quirks mode's case insensitivity and the      */
/*                   following declaration will only match in quirks mode (or older pages which use */
/*                   all lower-case styles - but these render in quirks mode anyway).               */
.maincontenttable table td,
.maincontenttable table th,
.maincontent table table td,
.maincontent table table th,
#maincontent table table td,
#maincontent table table th {
	font-size: 0.7em;
}

/* By applying the "noBorder" as well as the "mainContentTable" class to a table, it can be used for layout control */
table.noBorder,
table.noBorder th,
table.noBorder td,
.mainContent table.noBorder,
#mainContent table.noBorder,
.mainContent table.noBorder th,
#mainContent table.noBorder th,
.mainContent table.noBorder td,
#mainContent table.noBorder td,
.mainContent .tvwRoot table,
.mainContent .tvwRoot table th,
.mainContent .tvwRoot table td,
#mainContent .tvwRoot table,
#mainContent .tvwRoot table th,
#mainContent .tvwRoot table td,
.mainContent .searchFormPanel table,
.mainContent .searchFormPanel table th,
.mainContent .searchFormPanel table td,
#mainContent .searchFormPanel table,   
#mainContent .searchFormPanel table th,
#mainContent .searchFormPanel table td {
	border: 0px none !important;
	text-indent: 0px;
	padding: 0px !important;
}

/* HTML Content Table Styles : END */
/* =============================== */


/* Master page holding table */
.master {
   border: 0px none;
	width: 100%;
	background-color: #FFF;
}

/* Nested table in top-left of page, for utilities links and search box */
.topUtilities {
	width: 100%;
	margin: 0px;
	padding: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #000;
}

.topUtilitiesSmall {
	width: 100%;
	margin: 0px;
	padding: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #000;
}

/* Cell (within master table) holding the Bentley logo */
.topUtilitiesLogoTd {
   border: 0px none;
	width: 1%;
	text-align: right;
	vertical-align: top;
	padding-right: 6px;
	padding-top: 10px;
}
.topUtilitiesSmall .topUtilitiesLogoTd {
   border: 0px none;
	width: 1%;
	text-align: right;
	vertical-align: top;
	padding-right: 6px;
	padding-top: 0px;
}

/* Cell (within master table) holding the nested "topUtilities" table */
.topUtilitiesNavTd {
   border: 0px none;
	width: 99%;
	margin: 0px;
	padding: 0px;
}

/* Cell (within master table) holding the site title (BICS) - display:none; may turn this off if on Bentley Intranet or Bentley Brand Guidelines */
.topUtilitiesBicsTd {
   border: 0px none;
	text-align: left;
	vertical-align: top;
	padding-left: 22px;
	padding-top: 40px;
	padding-bottom: 8px;
}
.topUtilitiesSmall .topUtilitiesBicsTd {
   border: 0px none;
	text-align: left;
	vertical-align: top;
	padding-left: 22px;
	padding-top: 8px;
	padding-bottom: 0px;
}

/* Cell (within master table) holding the site title (Bentley Intranet) - display:none; may turn this off if on BICS or Bentley Brand Guidelines */
.topUtilitiesIntranetTd {
   border: 0px none;
	text-align: left;
	display: none;
	vertical-align: top;
	padding-left: 22px;
	padding-top: 40px;
	padding-bottom: 8px;
}
.topUtilitiesSmall .topUtilitiesIntranetTd {
	border: 0px none;
	text-align: left;
	vertical-align: top;
	padding-left: 22px;
	padding-top: 8px;
	padding-bottom: 0px;
}


/* Cell (within master table) holding the site title (Custom) - used when a fixed custom site title is used, rather than the standard      */
/*                                                              behaviour of showing/hiding the appropriate Intranet/BICS/Brand site title */
/*                                                              This can also be used as an alternative way of delivering the ordinary     */
/*                                                              Intranet/BICS/Brand site title(s), when show/hide behaviour is not required*/
.topUtilitiesSiteTitleTd {
   border: 0px none;
	text-align: left;
	vertical-align: top;
	padding-left: 22px;
	padding-top: 40px;
	padding-bottom: 8px;
}
.topUtilitiesSmall .topUtilitiesSiteTitleTd {
	border: 0px none;
	text-align: left;
	vertical-align: top;
	padding-left: 22px;
	padding-top: 8px;
	padding-bottom: 0px;
}


/* Cell (within master table) holding the site title (Bentley Brand Guidelines) - display:none; may turn this off if on BICS or Bentley Intranet */
.topUtilitiesBrandTd {
   border: 0px none;
	display: none;
	text-align: left;
	vertical-align: top;
	padding-left: 22px;
	padding-top: 40px;
	padding-bottom: 8px;
}


/* Cell (within master table) holding the page title (as well as the long horiontal colour bar beneath the title) */
.introHeaderTd {
   border: 0px none;
	padding-top: 17px;
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

/* Cell (within master table) holding left-menu navigation */
.leftNavTd,
.leftNavTdTmplt {
   border: 0px none;
	margin: 0px;
	padding: 37px 20px 0px 0px;
	text-align: left;
	vertical-align: top;
	width: 170px;
}

/* Cell (within master table) holding the main pane content */
.mainContent, .mainContent.noNav {
   border: 0px none;
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding: 0px 10px 50px 0px;
}

/* Modification to mainContent class when used within the context of .Net */
.contentWrapper .mainContent, .contentWrapper .mainContent.noNav {
	padding: 0px 10px 0px 0px;
}

/* Style for DIV holding the page title */
#introHeader {
	margin: 0px;
	padding: 0px 0px 0px 2px;
	border-bottom-width: 6px;
	border-bottom-style: solid;
	border-bottom-color: #000000;
}

/* DIV around main pane content */
#mainContent {
	padding: 0px;
	text-align: left;
	vertical-align: top;
	/*width: 100%;*/
}

/* Main Toolbar - an optional toolbar (used in some applications).                                                         */
/* This sits underneath the "introHeader"/"introTitle" (and the colour ruler, but above the "introSubHeader"/"introQuote") */
.mainToolbar {
  background-color: #dcdcdc;
  padding-top:2px;
}
/* The following two style declarations introduce variants of the mainToolbar for CSS layout, such as that used in .Net MasterPages 1.5.x+ */
.mainWrapper .mainToolbar {
  margin-right: 23px;
}
.useImpulseCSSLayout .mainToolbar {
	margin-right: 195px;
}
/* The following seems to be requireed to fix an IE bug that it doesn't always carry the background colour from parent? */
.mainToolbar .leftAlignIcons,
.mainToolbar .rightAlignIcons {
  background-color: #dcdcdc;
}
/* The following is used to ensure no content after the toolbar can 'float' into the toolbar area.  The essential part of this is 'clear: both;' */
.toolbarBottom {
    content: "."; 
    display: block; 
    height: 0px;
    clear: both;
    visibility: hidden;
    overflow: hidden;
}
/* Supplementary Toolbar - a toolbar used somewhere other than the top of the page (for this, see "mainToolbar")           */
.supplementaryToolbar {
  background-color: #ffffff;
}
/* General toolbar styles - applies to both ".mainToolbar" and ".supplementaryToolbar" */
.leftAlignIcons {
  float: left;
}
.rightAlignIcons {
  float: right;
}
.iconItem {
  white-space: nowrap;
  margin-right: 5px;
  text-decoration: none;
  display: inline;
}
.iconItem img {
  border: 0px none;
  width: 16px;
  height: 16px;
  margin-right: 3px;
}
.iconItem .iconText {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.7em;
  color: #000000;
}
#introText .iconItem .iconText {
	font-size: 1em;
}
.mainToolbar .iconItem .iconText {
  color: #000000;
}
a.iconItem:hover {
  text-decoration: underline;
}
.iconButtonItem
{
  position: relative;
  top: 1px;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	height: 22px;
	padding-left: 19px;
	padding-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	font-size: 0.7em;
	text-decoration: none;
	background-color:transparent;
	background-repeat:no-repeat;
	background-position: 0% 0%;
	vertical-align: bottom;
	text-align: left;
	border: 0px none;
	cursor: hand;
	cursor: pointer;
}
/* The "iconButtonItemHover" class is used by IE.  Since IE (ver 6 and 7, at least) does not recognise the      */
/*  :hover pseudo class on buttons, JavaScript is instead used to dynamically change the style class by         */
/*  'onmouseover' and 'onmouseout' JavaScript calls.  Unfortunately this means the style doesn't change without */
/*  JavaScript!  However, this doesn't affect the functionality nor appearance, and behaviour is as close as it */
/*  can be.                                                                                                     */
.iconButtonItemHover,
.iconButtonItem:hover
{
  position: relative;
  top: 1px;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	height: 22px;
	padding-left: 19px;
	padding-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	font-size: 0.7em;
	text-decoration: underline;
	background-color:transparent;
	background-repeat:no-repeat;
	background-position: 0% 0%;
	vertical-align: bottom;
	text-align: left;
	border-left: 0px none;
	border-right: 0px none;
	border-top: 0px none;
	border-bottom: 0px none;
	cursor: hand;
	cursor: pointer;
}
.mainToolbar .iconButtonItem,
.mainToolbar .iconButtonItemHover {
  color: #000000;
}
/* Hack for Firefox because it doesn't support underline on a button unless we do display: block, float or position: absolute and we can't do any of those without causing trouble for the toolbar layout: */
.iconButtonItemHover,
.iconButtonItem:hover, x:-moz-any-link {
	border-bottom: 1px solid;
}
/* Hack for IE6 and IE7 to remove random additional right margin */
html>body .iconButtonItem {
	*margin-right: -19px;
}
* html .iconButtonItem {
	margin-right: -19px;
}
html>body .iconButtonItemHover,
html>body .iconButtonItem:hover {
	*margin-right: -19px;
	*border-bottom: 0px none;
}
* html .iconButtonItemHover,
* html .iconButtonItem:hover {
	margin-right: -19px;
}


/* Section Introduction main flow of text (ie. underneath the page title, within the grey banner) - NOT the style used for any sub-page-header in the grey banner */
.introQuote {
	background-color: #f0f0f0;
	font-size: 0.7em;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0px 0px 5px;
	padding: 0px 0px 5px 2px;
}
.introQuote a {
	color: #000000;
	text-decoration: none;
}
.introQuote a:hover {
	color: #992233;
	text-decoration: underline;
}

.introQuote table {
}

/* Cell (within master table) holding the nested impulse table */
.impulseTd {
   border: 0px none;
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	width: 166px;
}

/* Cell within impulse table: impulse text */
.impulseTdTxt {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
	width: 121px;
	margin: 0px;
	padding: 0px;
}

/* Cell within impulse table: impulse arrow */
.impulseTdArrow {
	vertical-align: top;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
	padding-top: 6px;
	padding-right: 3px;
	margin: 0px;
	width: 21px;
	padding-bottom: 0px;
	padding-left: 0px;
}

/* Nested table on right side of page, for holding the impulse pane */
.impulse {
	width: 154px;
	margin-right: 10px;
}
/* Variation of above for the intranet template */
.impulseTmplt {
	width: 154px;
	margin-right: 10px;
}

/* Text at the bottom of the page */
.footer {
	font-weight: bold;
	list-style-type: none;
	margin: 2px 0px 0px;
	padding: 0px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #ccc;
	width: 100%;
}

.footer li {
	display: inline;
	margin-left: 15px;
}

.footer li.first {
	display: inline;
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.65em;
	color: #000;
}

.footer li a {
	text-decoration: none;
	margin: 0px;
	padding: 0px;
}

/* Cell (within master table) holding footer text */
.footerTd {
   border: 0px none;
	padding-bottom: 10px;
	padding-right: 15px;
	margin: 0px;
	padding-top: 0px;
	padding-left: 0px;
}

.footer li a:hover {
	text-decoration: underline;
	margin: 0px;
	padding: 0px;
}

/* Cell within impulse table: impulse text (with highlight box)
   - "impulsetdtxtbgcolor" is the deprecated name (move was taken to make spelling of color/colour consistent in class names.  Previously, "colour" was used more so this was chosen as the main spelling) */
.impulseTdTxtBgColour,
.impulsetdtxtbgcolor {
	width: 122px;
	background-color: #f0f0f0;
	margin: 0px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 2px;
}

/* Nested table inside main content pane: used for "Universal Chooser" pages */
.mainContent table.chooser,
#mainContent table.chooser {
	width: 100%;
   border: 0px none;
	/* font-size: 1em; */
}

/* Cell within chooser table: chooser image */
.mainContent table.chooser td.chooserTdImage,
#mainContent table.chooser td.chooserTdImage {
	width: 1%;
	text-align: left;
	vertical-align: top;
	padding-bottom: 10px;
   border: 0px none;
	/* font-size: 1em; */
}

/* Cell within chooser table: chooser text */
.mainContent table.chooser td.chooserTdTxt,
#mainContent table.chooser td.chooserTdTxt {
	text-align: left;
	vertical-align: top;
	width: 99%;
	padding-left: 10px;
	margin: 0px;
	padding-top: 0px;
   border: 0px none;
	/* font-size: 1em; */
}

/* Section Introduction text (for when there is no sub-header) */
.introQuoteNoHdr {
	background-color: #f0f0f0;
	font-size: 0.7em;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0px 0px 10px;
	padding: 4px 0px 5px 1px;
}
.introQuoteNoHdr a {
	color: #000000;
	text-decoration: none;
}
.introQuoteNoHdr a:hover {
	color: #992233;
	text-decoration: underline;
}

/* Cell within impulse table: image */
.impulseTdImg {
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding: 0px 0px 5px;
}

/* Cell (within master table) holding left-menu navigation for the home-page */
.leftNavTdHp,
.leftNavTdHpTmplt {
	width: 170px;
	margin: 0px;
	padding: 0px 20px 0px 0px;
	text-align: left;
	vertical-align: top;
	border-top-width: 36px;
	border-top-style: solid;
	border-top-color: #fff;
	background-color: #f0f0f0;
}

/* Section Introduction text (for the home-page) */
.introQuoteHp {
	background-color: #dcdcdc;
	font-size: 0.7em;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0px 0px 10px;
	padding: 0px 0px 5px 1px;
}
.introQuoteHp a {
	color: #000000;
	text-decoration: none;
}
.introQuoteHp a:hover {
	color: #992233;
	text-decoration: underline;
}

/* Cell (within master table) holding the main pane content (for the home-page) */
.mainContentHp {
   border: 0px none;
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding: 0px 10px 0px 0px;
	background-color: #f0f0f0;
}

/* Cell (within master table) holding the nested impulse table (for the home-page) */
.impulseTdHp {
   border: 0px none;
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	width: 166px;
	background-color: #f0f0f0;
}

/* Cell within impulse table: image (for the home-page) */
.impulseTdImgHp {
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding: 0px 0px 7px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
}

/* Text style for the "helpDesk" text in the impulse pane */
.helpDesk {
	margin: 0px;
	padding: 0px 0px 0px 2px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	color: #666;
}

/* Nested table within the main content area of a home page, holding the major links */
.hpCentral {
	margin: 0px;
	padding: 0px;
	width: 100%;
	border: 0px !important;	
}
.hpCentral td,
.hpCentral th {
	font-size: 1em !important;
	border: 0px !important;
}

/* Cell within hpCentral table: Link and text */
.hpCentralTdTxt {
	text-align: left;
	vertical-align: top;
	width: 48%;
}

/* Nested table that spans panes 3 and 4 (main and impulse panes) underneath main content (on a home page) */
.hpBottomContent {
	width: 100%;
	margin: 5px 0px 10px;
	padding: 0px;
}

/* Cell within impulse table: Holds helpDesk text */
.impulseTdHelpDesk {
	margin: 0px;
	padding: 0px 0px 10px;
}

/* Cell within hpBottomContent table: Link and text */
.hpBottomTdTxt {
	margin: 0px;
	padding: 0px;
	text-align: left;
	vertical-align: top;
}

/* Cell within hpBottomContent table: Image */
.hpBottomTdImg {
	margin: 0px;
	padding: 7px 12px 0px 0px;
	text-align: left;
	vertical-align: top;
}

/* Cell within impulse table: impulse text (on a home-page) */
.impulseTdTxtHp {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
	width: 130px;
	margin: 0px;
	padding: 0px;
}

/* Cell within impulse table: impulse text (on a home-page) */
.impulseTdTxtHpLast {
	width: 130px;
	margin: 0px;
	padding: 0px;
}

/* Columns within the master holding table */
.col1 {
	width: 170px;
}
.col2 {
	width: 100%;
}
.col3 {
	width: 166px;
}


/* Styles to modify an anchor link from 'text' to 'a graphical arrow' : START */
/* ========================================================================== */

/* Coloured arrow with no background */
a.colourArrw{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
	background-image: url(../BY00004_ims/arrow_red.gif);
	background-repeat: no-repeat;
	height: 13px;
	width: 13px;
	float: left;
}
a.colourArrw:hover ,
a.colourArrw.on { background-position: -13px 0; }

/* Coloured arrow with grey background */
a.colourArrwBg{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
	background-image: url(../BY00004_ims/arrow_red_grey_bg.gif);
	background-repeat: no-repeat;
	height: 13px;
	width: 13px;
	float: left;
}
a.colourArrwBg:hover ,
a.colourArrwBg.on { background-position: -13px 0; }

/* Green arrow with no background */
a.greenArrw{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
	background-image: url(../BY00004_ims/arrow_green.gif);
	background-repeat: no-repeat;
	height: 13px;
	width: 13px;
	float: left;
}
a.greenArrw:hover ,
a.greenArrw.on { background-position: -13px 0; }

/* Green arrow with grey background */
a.greenArrwBg{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
	background-image: url(../BY00004_ims/arrow_green_grey_bg.gif);
	background-repeat: no-repeat;
	height: 13px;
	width: 13px;
	float: left;
}
a.greenArrwBg:hover ,
a.greenArrwBg.on { background-position: -13px 0; }


/* Styles to modify an anchor link from 'text' to 'a graphical arrow' : END */
/* ======================================================================== */



/* The following define containers for arrows */
/* ========================================== */

/* Table cell in hpCentral table (centre text on home page) that exists to hold a coloured arrow */
.arrowTd{
	height: 13px;
	width: 13px;
	margin: 0px;
	padding: 0px 17px 0px 13px;
	vertical-align: top;
}
.arrowTd a{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
}

/* Table cell in hpBottomContent (section just above footer on home page) that exists to hold a green arrow */
.arrwGreenTd{
	width: 22px;
	margin: 0px;
	padding: 5px 0px 0px 13px;
	vertical-align: top;
}
.arrwGreenTd a{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
}


/* Table cell in impulse pane table (home page): Holds a green arrow */
.arrwGreenRelatedTd{
	margin: 0px;
	padding: 6px 0px 0px 0px;
	vertical-align: top;
}
	
.arrwGreenRelatedTd a{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
}


/* Element to hold arrow used on "Universal Chooser" pages */
.chooserArrow {
	margin: 0px;
	padding: 3px 0px 0px;
}
p.chooserArrow {
	vertical-align: top;
}
.chooserArrow a{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
}

/* Table cell in impulse pane table (home page): Includes grey background and is used to hold a green arrow
   - "impulsetdarrowbgcolor" is the deprecated name (move was taken to make spelling of color/colour consistent in class names.  Previously, "colour" was used more so this was chosen as the main spelling) */
.impulseTdArrowBgColour,
.impulsetdarrowbgcolor{
	width: 21px;
	background-color: #f0f0f0;
	margin: 0px;
	padding: 6px 3px 0px;
	vertical-align: top;
}
.impulseTdArrowBgColour a,
.impulsetdarrowbgcolor a{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
}
.impulseTdArrowBgColour a.greenArrw,
.impulsetdarrowbgcolor a.greenarrw{
	background-image: url(../BY00004_ims/arrow_green_grey_bg.gif);
}

/* Table cell in impulse pane table (home page): Holds a green arrow: NB. called "last" because last cell excludes the grey line at the bottom, but this style is used for any case when a grey line is not wanted at the bottom  */
td.impulseTdArrowLast{
	width: 21px;
	margin: 0px;
	padding: 6px 3px 0px;
	vertical-align: top;
}
td.impulseTdArrowLast a{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
}
/* DDS release 2.1: fixed bug by removing the following */
/* td.impulseTdArrowLast a.greenArrw{ */
/*	background-image: url(../BY00004_ims/arrow_green_grey_bg.gif); */
/* } */



/* Table cell in impulse pane table (home page): Holds a green arrow: NB. this style defines a grey line at the bottom of the cell */
.impulseTdArrow{
	width: 21px;
	margin: 0px;
	padding: 6px 3px 0px;
	vertical-align: top;
}
.impulseTdArrow a{
	text-decoration: none;
	display: block;
	text-indent: -9999px;
}
td.impulseTdArrow a.greenArrw{
	background-image: url(../BY00004_ims/arrow_green_grey_bg.gif);
}


/* HTML Form Element Styles : START */
/* ================================ */

/* Search form container */
.searchFormPanel {
	background-color: #f0f0f0;
	border: 2px solid #000000;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 40px;
	padding-left: 20px;
	width: 535px;
	clear: both;
  /*  font-size: 0.7em; */
}
.res1024 .searchFormPanel {	width: 759px; }
.useImpulse .searchFormPanel { width: 363px; }
.noNav .res1024 .searchFormPanel { width: 925px; }
.noNav .searchFormPanel,
.noNav .searchFormPanel { width: 701px; }
.useImpulse .res1024 .searchFormPanel { width: 587px; }
.noNavUseImpulse .res1024 .searchFormPanel { width: 753px; }
.noNavUseImpulse .searchFormPanel { width: 529px; }

/* Form layout (Start) - when using CSS layout for forms, rather than tables */
/* The following style declaration uses a "self-clearing" technique, defined here: http://www.positioniseverything.net/easyclearing.html */
/* To briefly explain: CSS behaviour determines that floated elements within a container do not force
   that container to resize, unless the last element in the container is "cleared", ie. "clear: both;".
   However, even this doesn't work if this last element contains floats itself and the last float
   inside it isn't "cleared"!
   To prevent the need to have extra markup in every "search form panel", the CSS2 ":after" pseudo
   element can be used to insert this into HTML for us!  IE does not support this pseudo element, but
   fortunately (in this case) an IE bug means that IE doesn't require "clearing" - but see above article
   for complex exceptions to this. */
.searchFormPanel:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both;
    visibility: hidden;
}
.formRow {
	clear: both;
}
.formCell {
	float: left;
	margin: 0px 20px 5px 0px;
  top:20px;
  position: relative;
}
/* A column ('formCol') can be defined instead of an ordinary cell ('formCell') when wanting to group more "rows" ('formRow') inside this single space */
/* (this is usually used for, say, a column of address lines to which there is only one label for all of them.  The label would sit in the cell to the left of the column) */
.formCol {
  float: left;
}

.searchFormPanel label,
.formTxtInfo {
   top:20px;
   position: relative;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 0.7em;
   float: left;
   margin: 0px 21px 5px 1px;
}
/* Form layout (End) */

/* Submit/Reset/Script/etc button */
.button {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #fff;
	background: #969696 none;
	height: 16px;
	width: 80px;
	margin: 0px;
	padding: 0px;
	border: 0px none;
	margin-bottom: 1px;
}
#mainContent table td a.buttonBdr .button,
.mainContent table td a.buttonBdr .button,
.mainContentTable td a.buttonBdr .button,
#mainContent table td a.buttonbdr .button,
.mainContent table td a.buttonbdr .button,
.mainContentTable td a.buttonbdr .button {
	font-size: 1em; 
}
.buttonBdr,
.buttonbdr {
	border: 1px solid #969696;
	background: #969696 none;
	margin: 0px;
	padding: 0px;
	text-decoration: none;
	height: 16px;
	width: 80px;
	margin-bottom: 1px;
}
.buttonBdr:hover,
.buttonbdr:hover {
/* , #mainContent table td a.buttonBdr:hover,
div#priNavWrap ul li a.buttonBdr:hover { */
	background: #fff none;
}
.buttonBdr:hover .button,
.buttonbdr:hover .button,
.button:hover,
div#priNavWrap ul li a.buttonBdr:hover,
div#priNavWrap ul li a.buttonbdr:hover {
	color: #969696;
	background: #fff none;
	cursor: hand;
	cursor: pointer;
	margin-bottom: 1px;
}

/* Button when inside top navigation */
#priNavWrap ul li .button {
	color: #000;
	background: #fff none;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 6pt;
}
#priNavWrap ul li a.buttonBdr,
#priNavWrap ul li a.buttonbdr {
	border: 1px solid #000;
   top: 6px;
	position: relative
}
div#priNavWrap ul li a.buttonBdr:hover .button,
div#priNavWrap ul li a.buttonbdr:hover .button,
div#priNavWrap ul li .button:hover,
div#priNavWrap ul li a.buttonBdr:hover .button,
div#priNavWrap ul li a.buttonbdr:hover .button {
   color: #666;
}

/* Button when inside a main content table */
.mainContent table .button,
#mainContent table .button {
	font-size: 1em;
}
.mainContent table .buttonBdr,
#mainContent table .buttonBdr,
.mainContent table .buttonbdr,
#mainContent table .buttonbdr {
	top: 1px;
}


/* Accessible Link Button */
/* - This is an ordinary button styled to look like a "Link Button", ie. a hyperlink that causes form submission. */
/*   The purpose of an "Accessible Link Button" is to allow form submission from something that looks like a      */
/*   hyperlink, but without requiring JavaScript. */
.accessibleLinkButton
{
	font-family: Arial, Helvetica, sans-serif;
	color: #992233;
	padding: 0px;
	margin: 0px;
	font-size: 0.7em;
	text-align: left;
	text-decoration: none;
	background-color:transparent;
	border: 0px none;
	cursor: hand;
	cursor: pointer;
}
#mainContent table td .accessibleLinkButton,
.mainContent table td .accessibleLinkButton,
.mainContentTable td .accessibleLinkButton,
.mainContentTxtInfo .accessibleLinkButton,
#mainContent table td .accessibleLinkButton:hover,
.mainContent table td .accessibleLinkButton:hover,
.mainContentTable td .accessibleLinkButton:hover,
.mainContentTxtInfo .accessibleLinkButton:hover,
#mainContent table td .accessibleLinkButtonHover,
.mainContent table td .accessibleLinkButtonHover,
.mainContentTable td .accessibleLinkButtonHover,
.mainContentTxtInfo .accessibleLinkButtonHover {
	font-size: 1em; 
}
/* The "accessibleLinkButtonHover" class is used by IE.  Since IE (ver 6 and 7, at least) does not recognise    */
/*  the :hover pseudo class on buttons, JavaScript is instead used to dynamically change the style class by     */
/*  'onmouseover' and 'onmouseout' JavaScript calls.  Unfortunately this means the style doesn't change without */
/*  JavaScript!  However, this doesn't affect the functionality nor appearance, and behaviour is as close as it */
/*  can be.                                                                                                     */
.accessibleLinkButtonHover,
.accessibleLinkButton:hover
{
	font-family: Arial, Helvetica, sans-serif;
	color: #992233;
	padding: 0px;
	margin: 0px;
	font-size: 0.7em;
	text-align: left;
	text-decoration: underline;
	background-color:transparent;
	border: 0px none;
	cursor: hand;
	cursor: pointer;
}
/* Hack for Firefox because it doesn't support underline on a button unless we do display: block, float or position: absolute and I'd prefer not to risk negatively affecting any layout the developer may be using: */
.accessibleLinkButton, x:-moz-any-link {
	margin-bottom: 1px;
}
.accessibleLinkButtonHover,
.accessibleLinkButton:hover, x:-moz-any-link {
	border-bottom: 1px solid #992233;
	margin-bottom: 0px;
}
/* Hack for IE6 and IE7 to remove random additional right margin and position correctly with any text on the same line as the "link button" */
html>body .accessibleLinkButton {
	*margin-bottom: 0px;
	*margin-right: -19px;
  *position: relative;
  *top: 2px;
}
* html .accessibleLinkButton {
	margin-right: -19px;
  position: relative;
  top: 2px;
}
html>body .accessibleLinkButtonHover,
html>body .accessibleLinkButton:hover {
	*margin-right: -19px;
	*border-bottom: 0px none;
  *position: relative;
  *top: 2px;
}
* html .accessibleLinkButtonHover,
* html .accessibleLinkButton:hover {
	margin-right: -19px;
  position: relative;
  top: 2px;
}

/* Accessible Link Button - variant for Dot.Net (due to different DOC TYPE it uses) */
.accessibleLinkButtonDotNet
{
	font-family: Arial, Helvetica, sans-serif;
	color: #992233;
	padding: 0px;
	margin:0px;
	font-size: 0.7em;
	text-align: left;
	text-decoration: none;
	background-color:transparent;
	border: 0px none;
	cursor: hand;
	cursor: pointer;
}

.accessibleLinkButtonDotNetHover,
.accessibleLinkButtonDotNet:hover
{
	font-family: Arial, Helvetica, sans-serif;
	color: #992233;
	padding: 0px;
	margin: 0px;
	font-size: 0.7em;
	text-align: left;
	text-decoration: underline;
	background-color:transparent;
	border: 0px none;
	cursor: hand;
	cursor: pointer;
}


#mainContent table td .accessibleLinkButtonDotNet,
.mainContent table td .accessibleLinkButtonDotNet,
.mainContentTable td .accessibleLinkButtonDotNet,
.mainContentTxtInfo .accessibleLinkButtonDotNet,
#mainContent table td .accessibleLinkButtonDotNet:hover,
.mainContent table td .accessibleLinkButtonDotNet:hover,
.mainContentTable td .accessibleLinkButtonDotNet:hover,
.mainContentTxtInfo .accessibleLinkButtonDotNet:hover,
#mainContent table td .accessibleLinkButtonDotNetHover,
.mainContent table td .accessibleLinkButtonDotNetHover,
.mainContentTable td .accessibleLinkButtonDotNetHover,
.mainContentTxtInfo .accessibleLinkButtonDotNetHover {
	font-size: 1em; 
	}

/* Hack for IE7 to remove random additional right margin and position correctly with any text on the same line as the "link button" for Dot Net */
html>body .accessibleLinkButtonDotNet,
 {
	*margin-bottom: 0px;
	*margin-right: -10px;
    *position: relative;
    *top: 1px;
}
html>body .accessibleLinkButtonDotNetHover,
html>body .accessibleLinkButtonDotNet:hover {
	*margin-right: -10px;
	*border-bottom: 0px none;
	*position: relative;
	*top: 1px;
}

/* Hack for IE6 to remove random additional right margin and position correctly with any text on the same line as the "link button" for Dot Net */
* html .accessibleLinkButtonDotNetHover,
* html .accessibleLinkButtonDotNet:hover {
	margin-right: -19px;
	position: relative;
	top: 1px;
}
* html .accessibleLinkButtonDotNet {
	margin-right: -19px;
  position: relative;
  top: 1px;
}

/* Form - Remove margin and padding which is default in most browsers */
form {
margin: 0px;
padding: 0px;
}

/* Single-line text fields, ie. input type="text" */
/*  'formInputTextChanged' can optionally be used to style fields for which the value has been changed by the user/client */
.formInputText,
.forminputtext,
.formInputTextChanged,
.formInputTextRightJustify {
   margin: 0px;
   padding: 0px;
   border: 1px solid #666;
	font-size: 0.7em;
}
.formInputTextRightJustify {
   text-align: right;
}
.mainContentTable .formInputText,
.mainContent table .formInputText,
#mainContent table .formInputText,
.mainContentTable .forminputtext,
.mainContent table .forminputtext,
#mainContent table .forminputtext,
.mainContentTable .formInputTextChanged,
.mainContent table .formInputTextChanged,
#mainContent table .formInputTextChanged,
.mainContentTable .formInputTextRightJustify,
.mainContent table .formInputTextRightJustify,
#mainContent table .formInputTextRightJustify {
   font-size: 1.0em;
}
.mainContentTable .formInputTextChanged,
.mainContent table .formInputTextChanged,
#mainContent table .formInputTextChanged {
	background-color: #ffff99;
}

/* Single-line text fields, when inside top navigation */
#priNavWrap ul li .formInputText,
#priNavWrap ul li .forminputtext {
   margin-left: 2px;
   margin-right: 2px;
   margin-top: 5px;
   border: 1px solid #000;
}

/* Password fields, ie. input type="password" */
.formInputPassword {
   margin: 0px;
   padding: 0px;
   border: 1px solid #666;
	font-size: 0.7em;
}
.mainContentTable .formInputPassword,
.mainContent table .formInputPassword,
#mainContent table .formInputPassword {
	font-size: 1.0em;
}

/* Multi-line text fields, ie. textarea */
.formTextArea {
   margin: 0px;
   padding: 0px;
   border: 1px solid #666;
	font-size: 0.7em;
   font-family: Arial, Helvetica, sans-serif;
}
.mainContentTable .formTextArea,
.mainContent table .formTextArea,
#mainContent table .formTextArea {
	font-size: 1.0em;
}

/* Select lists (.formSelect), associated options (.formOption) and groups, if optgroup is used (.formOptGroup) */
/* Cannot set the border of a formSelect, plus requires 3 extra pixels width than the other elements            */
.formSelect,
.formselect {
   margin-top: 1px;
   padding-top: 1px;
	font-size: 0.7em;
}
.mainContentTable .formSelect,
.mainContent table .formSelect,
#mainContent table .formSelect,
.mainContentTable .formselect,
.mainContent table .formselect,
#mainContent table .formselect {
   font-size: 1.0em;
}
.formOption,
.formSelect option,
.formselect option {
}
.formOptGroup,
.formSelect optgroup,
.formselect optgroup {
}

/* Checkboxes, ie. input type="checkbox" */
/* In .NET, the "formInputCheckBox" class may be applied to the .NET component, which is generated as a span which          */
/* contains the input and label elements.  Therefore ".formInputCheckBox label" is defined the same as "mainContentTxtInfo" */
.formInputCheckBox {
/*    position: relative;*/
}

/* Radio buttons, ie. input type="radio" */
/* "formRadioButtonList" is a class for radio button list groups in .NET */
.formInputRadio,
.formRadioButtonList input {
/*    position: relative;*/
}

.formRadioButtonList {
	border: 0px none !important;
}

/* Radio column (for a cell in a table column, when that column is used to hold both the radio button label and radio button) */
/*  This is used for configurations where the radio button label should be centred in the cell above the radio button (which is also centred in its cell) */
/*  radioCol within a th tag is specifically quoted in order to override the setting that left-aligns th */
.radioCol,
.mainContentTable th.radioCol,
.mainContent table th.radioCol,
#mainContent table th.radioCol {
   text-align: center;
}
/* Checkbox column - works in the exactly same way as a radio column */
/*  checkBoxCol within a th tag is specifically quoted in order to override the setting that left-aligns th */
.checkBoxCol,
.mainContentTable th.checkBoxCol,
.mainContent table th.checkBoxCol,
#mainContent table th.checkBoxCol {
   text-align: center;
}


/* Modify form element width by also applying one of the following styles  */
/*   (form elements are "halfWidth" by default)                            */
/*   Notes (and why there are EIGHT variants of each!!!):                  */
/*   a) Widths generally consider proportions of the page as if the        */
/*      impulse pane wasn't there and if the page was at the min. 800x600  */
/*   b) The "res1024" class can also be applied in cases when all site     */
/*      users are guaranteed to use at least 1024x768 (please don't use    */
/*      unless this is the case).  This will enlarge widths appropriately  */
/*   c) When there is no menu (identified by "noNav" applied at the top    */
/*      of the content section along with the "mainContent" or             */
/*      "mainWrapper" class), then widths are also adjusted.               */
/*   d) Widths differ slightly for select drop-boxes (quirk of browsers?)  */

/* default (equivalent to halfWidth) */
/* --------------------------------- */
.formInputText,
.forminputtext,
.formInputTextChanged { width: 239.5px; }
.formInputPassword { width: 239.5px; }
.formTextArea { width: 239.5px; }
.formSelect, .formselect { width: 242.5px; }

/* fullWidth */
/* --------- */
.mainContent.noNav .formSelect.fullWidth,
.mainWrapper.noNav .formSelect.fullWidth,
.mainContent.noNav .formselect.fullWidth,
.mainWrapper.noNav .formselect.fullWidth { width:666px; }
.res1024 .mainContent.noNav .formSelect.fullWidth,
.res1024 .mainWrapper.noNav .formSelect.fullWidth,
.mainContent.noNav .res1024 .formSelect.fullWidth,
.mainWrapper.noNav .res1024 .formSelect.fullWidth,
.mainContent.noNav.res1024 .formSelect.fullWidth,
.mainWrapper.noNav.res1024 .formSelect.fullWidth,
.res1024 .mainContent.noNav .formselect.fullWidth,
.res1024 .mainWrapper.noNav .formselect.fullWidth,
.mainContent.noNav .res1024 .formselect.fullWidth,
.mainWrapper.noNav .res1024 .formselect.fullWidth,
.mainContent.noNav.res1024 .formselect.fullWidth,
.mainWrapper.noNav.res1024 .formselect.fullWidth { width: 890px; }
.formSelect.fullWidth,
.formselect.fullWidth { width: 500px; }
.res1024 .formSelect.fullWidth,
.res1024 .formselect.fullWidth { width: 724px; }
.mainContent.noNav .fullWidth, .mainWrapper.noNav .fullWidth { width: 663px; }
.res1024 .mainContent.noNav .fullWidth,
.res1024 .mainWrapper.noNav .fullWidth,
.mainContent.noNav .res1024 .fullWidth,
.mainWrapper.noNav .res1024 .fullWidth,
.mainContent.noNav.res1024 .fullWidth,
.mainWrapper.noNav.res1024 .fullWidth { width: 887px; }
.fullWidth { width: 497px; }
.res1024 .fullWidth { width: 721px; }

.mainContent.noNav .formSelect.halfWidth,
.mainWrapper.noNav .formSelect.halfWidth,
.mainContent.noNav .formselect.halfWidth,
.mainWrapper.noNav .formselect.halfWidth { width:323.5px; }
.res1024 .mainContent.noNav .formSelect.halfWidth,
.res1024 .mainWrapper.noNav .formSelect.halfWidth,
.mainContent.noNav .res1024 .formSelect.halfWidth,
.mainWrapper.noNav .res1024 .formSelect.halfWidth,
.mainContent.noNav.res1024 .formSelect.halfWidth,
.mainWrapper.noNav.res1024 .formSelect.halfWidth,
.res1024 .mainContent.noNav .formselect.halfWidth,
.res1024 .mainWrapper.noNav .formselect.halfWidth,
.mainContent.noNav .res1024 .formselect.halfWidth,
.mainWrapper.noNav .res1024 .formselect.halfWidth,
.mainContent.noNav.res1024 .formselect.halfWidth,
.mainWrapper.noNav.res1024 .formselect.halfWidth { width: 435.5px; }
.formSelect.halfWidth,
.formselect.halfWidth { width: 240.5px; }
.res1024 .formSelect.halfWidth,
.res1024 .formselect.halfWidth { width: 352.5px; }
.mainContent.noNav .halfWidth, .mainWrapper.noNav .halfWidth { width: 320.5px; }
.res1024 .mainContent.noNav .halfWidth,
.res1024 .mainWrapper.noNav .halfWidth,
.mainContent.noNav .res1024 .halfWidth,
.mainWrapper.noNav .res1024 .halfWidth,
.mainContent.noNav.res1024 .halfWidth,
.mainWrapper.noNav.res1024 .halfWidth { width: 432.5px; }
.halfWidth { width: 237.5px; }
.res1024 .halfWidth { width: 349.5px; }

.mainContent.noNav .formSelect.thirdWidth,
.mainWrapper.noNav .formSelect.thirdWidth,
.mainContent.noNav .formselect.thirdWidth,
.mainWrapper.noNav .formselect.thirdWidth { width:209.3333333px; }
.res1024 .mainContent.noNav .formSelect.thirdWidth,
.res1024 .mainWrapper.noNav .formSelect.thirdWidth,
.mainContent.noNav .res1024 .formSelect.thirdWidth,
.mainWrapper.noNav .res1024 .formSelect.thirdWidth,
.mainContent.noNav.res1024 .formSelect.thirdWidth,
.mainWrapper.noNav.res1024 .formSelect.thirdWidth,
.res1024 .mainContent.noNav .formselect.thirdWidth,
.res1024 .mainWrapper.noNav .formselect.thirdWidth,
.mainContent.noNav .res1024 .formselect.thirdWidth,
.mainWrapper.noNav .res1024 .formselect.thirdWidth,
.mainContent.noNav.res1024 .formselect.thirdWidth,
.mainWrapper.noNav.res1024 .formselect.thirdWidth { width: 284px; }
.formSelect.thirdWidth,
.formselect.thirdWidth { width: 154px; }
.res1024 .formSelect.thirdWidth,
.res1024 .formselect.thirdWidth { width: 228.6666667px; }
.mainContent.noNav .thirdWidth, .mainWrapper.noNav .thirdWidth { width: 206.3333333px; }
.res1024 .mainContent.noNav .thirdWidth,
.res1024 .mainWrapper.noNav .thirdWidth,
.mainContent.noNav .res1024 .thirdWidth,
.mainWrapper.noNav .res1024 .thirdWidth,
.mainContent.noNav.res1024 .thirdWidth,
.mainWrapper.noNav.res1024 .thirdWidth { width: 281px; }
.thirdWidth { width: 151px; }
.res1024 .thirdWidth { width: 225.6666667px; }

.mainContent.noNav .formSelect.quarterWidth,
.mainWrapper.noNav .formSelect.quarterWidth,
.mainContent.noNav .formselect.quarterWidth,
.mainWrapper.noNav .formselect.quarterWidth { width:152.25px; }
.res1024 .mainContent.noNav .formSelect.quarterWidth,
.res1024 .mainWrapper.noNav .formSelect.quarterWidth,
.mainContent.noNav .res1024 .formSelect.quarterWidth,
.mainWrapper.noNav .res1024 .formSelect.quarterWidth,
.mainContent.noNav.res1024 .formSelect.quarterWidth,
.mainWrapper.noNav.res1024 .formSelect.quarterWidth,
.res1024 .mainContent.noNav .formselect.quarterWidth,
.res1024 .mainWrapper.noNav .formselect.quarterWidth,
.mainContent.noNav .res1024 .formselect.quarterWidth,
.mainWrapper.noNav .res1024 .formselect.quarterWidth,
.mainContent.noNav.res1024 .formselect.quarterWidth,
.mainWrapper.noNav.res1024 .formselect.quarterWidth { width: 208.25px; }
.formSelect.quarterWidth,
.formselect.quarterWidth { width: 110.75px; }
.res1024 .formSelect.quarterWidth,
.res1024 .formselect.quarterWidth { width: 166.75px; }
.mainContent.noNav .quarterWidth, .mainWrapper.noNav .quarterWidth { width: 149.25px; }
.res1024 .mainContent.noNav .quarterWidth,
.res1024 .mainWrapper.noNav .quarterWidth,
.mainContent.noNav .res1024 .quarterWidth,
.mainWrapper.noNav .res1024 .quarterWidth,
.mainContent.noNav.res1024 .quarterWidth,
.mainWrapper.noNav.res1024 .quarterWidth { width: 205.25px; }
.quarterWidth { width: 107.75px; }
.res1024 .quarterWidth { width: 163.75px; }

.mainContent.noNav .formSelect.fifthWidth,
.mainWrapper.noNav .formSelect.fifthWidth,
.mainContent.noNav .formselect.fifthWidth,
.mainWrapper.noNav .formselect.fifthWidth { width:118px; }
.res1024 .mainContent.noNav .formSelect.fifthWidth,
.res1024 .mainWrapper.noNav .formSelect.fifthWidth,
.mainContent.noNav .res1024 .formSelect.fifthWidth,
.mainWrapper.noNav .res1024 .formSelect.fifthWidth,
.mainContent.noNav.res1024 .formSelect.fifthWidth,
.mainWrapper.noNav.res1024 .formSelect.fifthWidth,
.res1024 .mainContent.noNav .formselect.fifthWidth,
.res1024 .mainWrapper.noNav .formselect.fifthWidth,
.mainContent.noNav .res1024 .formselect.fifthWidth,
.mainWrapper.noNav .res1024 .formselect.fifthWidth,
.mainContent.noNav.res1024 .formselect.fifthWidth,
.mainWrapper.noNav.res1024 .formselect.fifthWidth { width: 162.8px; }
.formSelect.fifthWidth,
.formselect.fifthWidth { width: 84.8px; }
.res1024 .formSelect.fifthWidth,
.res1024 .formselect.fifthWidth { width: 129.6px; }
.mainContent.noNav .fifthWidth, .mainWrapper.noNav .fifthWidth { width: 115px; }
.res1024 .mainContent.noNav .fifthWidth,
.res1024 .mainWrapper.noNav .fifthWidth,
.mainContent.noNav .res1024 .fifthWidth,
.mainWrapper.noNav .res1024 .fifthWidth,
.mainContent.noNav.res1024 .fifthWidth,
.mainWrapper.noNav.res1024 .fifthWidth { width: 159.8px; }
.fifthWidth { width: 81.8px; }
.res1024 .fifthWidth { width: 126.6px; }

.mainContent.noNav .formSelect.sixthWidth,
.mainWrapper.noNav .formSelect.sixthWidth,
.mainContent.noNav .formselect.sixthWidth,
.mainWrapper.noNav .formselect.sixthWidth { width:95.16666667px; }
.res1024 .mainContent.noNav .formSelect.sixthWidth,
.res1024 .mainWrapper.noNav .formSelect.sixthWidth,
.mainContent.noNav .res1024 .formSelect.sixthWidth,
.mainWrapper.noNav .res1024 .formSelect.sixthWidth,
.mainContent.noNav.res1024 .formSelect.sixthWidth,
.mainWrapper.noNav.res1024 .formSelect.sixthWidth,
.res1024 .mainContent.noNav .formselect.sixthWidth,
.res1024 .mainWrapper.noNav .formselect.sixthWidth,
.mainContent.noNav .res1024 .formselect.sixthWidth,
.mainWrapper.noNav .res1024 .formselect.sixthWidth,
.mainContent.noNav.res1024 .formselect.sixthWidth,
.mainWrapper.noNav.res1024 .formselect.sixthWidth { width: 132.5px; }
.formSelect.sixthWidth,
.formselect.sixthWidth { width: 67.5px; }
.res1024 .formSelect.sixthWidth,
.res1024 .formselect.sixthWidth { width: 104.8333333px; }
.mainContent.noNav .sixthWidth, .mainWrapper.noNav .sixthWidth { width: 92.16666667px; }
.res1024 .mainContent.noNav .sixthWidth,
.res1024 .mainWrapper.noNav .sixthWidth,
.mainContent.noNav .res1024 .sixthWidth,
.mainWrapper.noNav .res1024 .sixthWidth,
.mainContent.noNav.res1024 .sixthWidth,
.mainWrapper.noNav.res1024 .sixthWidth { width: 129.5px; }
.sixthWidth { width: 64.5px; }
.res1024 .sixthWidth { width: 101.8333333px; }

.mainContent.noNav .formSelect.tenthWidth,
.mainWrapper.noNav .formSelect.tenthWidth,
.mainContent.noNav .formselect.tenthWidth,
.mainWrapper.noNav .formselect.tenthWidth { width:49.5px; }
.res1024 .mainContent.noNav .formSelect.tenthWidth,
.res1024 .mainWrapper.noNav .formSelect.tenthWidth,
.mainContent.noNav .res1024 .formSelect.tenthWidth,
.mainWrapper.noNav .res1024 .formSelect.tenthWidth,
.mainContent.noNav.res1024 .formSelect.tenthWidth,
.mainWrapper.noNav.res1024 .formSelect.tenthWidth,
.res1024 .mainContent.noNav .formselect.tenthWidth,
.res1024 .mainWrapper.noNav .formselect.tenthWidth,
.mainContent.noNav .res1024 .formselect.tenthWidth,
.mainWrapper.noNav .res1024 .formselect.tenthWidth,
.mainContent.noNav.res1024 .formselect.tenthWidth,
.mainWrapper.noNav.res1024 .formselect.tenthWidth { width: 71.9px; }
.formSelect.tenthWidth,
.formselect.tenthWidth { width: 32.9px; }
.res1024 .formSelect.tenthWidth,
.res1024 .formselect.tenthWidth { width: 55.3px; }
.mainContent.noNav .tenthWidth, .mainWrapper.noNav .tenthWidth { width: 46.5px; }
.res1024 .mainContent.noNav .tenthWidth,
.res1024 .mainWrapper.noNav .tenthWidth,
.mainContent.noNav .res1024 .tenthWidth,
.mainWrapper.noNav .res1024 .tenthWidth,
.mainContent.noNav.res1024 .tenthWidth,
.mainWrapper.noNav.res1024 .tenthWidth { width: 68.9px; }
.tenthWidth { width: 29.9px; }
.res1024 .tenthWidth { width: 52.3px; }

/* Modify a form element to be highlighted (in the case of an error - typically when reported from a processing page): */
.errorHighlight {
   background-color: #dcdcdc;
}

/* Modify a form element to be highlighted in the case of the data being invalid.  This is often used in conjunction with "validHighlight" to dynamically identify whether the data is valid: */
.invalidHightlight {
	background-color: #ff753f;
}

/* Modify a form element to be highlighted in the case of the data being valid.  This is often used in conjunction with "invalidHighlight" to dynamically identify whether the data is valid: */
.validHightlight {
	background-color: #66ff33;
}

/* Defining line height of form label text in a form table - here, form label text refers to text in close proximity to a form element */
.formTdLabel {
   height: 18px;
   vertical-align: bottom !important;
}

/* The following is a variant of the above, used for form label text that is to the left of elements rather than above. */
/* Its use should not be common because the DDS standard, in most cases, is to have the element labels above the form elements rather than to the side. */
.formTdLabelLeft {
   vertical-align: top;
}

/* Label tag (used to associate form label text with a given form element ID) */
/* -Now obsolete because if styles will ever be defined, it will be directly  */
/*  to the label tag.                                                         */
/* .formlabel, */
/* label { */
/* } */

/* Typically used to style an asterix (*) that denotes a mandatory form field */
.formMandatoryAlert {
   color: #ff0000;
}

/* To place form elements into columns, a table (classes "mainContentTable noBorder") can be used to apply the layout */

/* Width between columns when using a table for form layout */
.formTdSpacer {
   width: 8px;
}

/* Error message relating to form data - generally to style a message returned from a processing page */
.formReportError {
   font-weight: bold;
   color: #000000;
}

/* Success message relating to form data - generally to style a success report returned from a processing page */
.formReportSuccess {
   font-weight: bold;
  color: #335522
}

/* 'In progress' message relating to form data - generally to style a 'please wait' or 'xx% complete' message while form data is being processed */
.formReportProcessing {
  color: #335522
}

/* Alert mark - used for placing an alert icon in the page - especially used in conjunction with form error messages but can be used generically. */
/* Typically this is used in 2 ways: (a) Alongside an alert box (defined below), (b) On its own alongside the form element (or whatever) that has the problem */
.alertMark {
  background:url(../BY00004_ims/warning_triangle.gif) left top no-repeat;
	text-indent: -9999px;
	height: 16px;
	width: 16px;
	display: block;
	float: left;
}
/* variant of above for grey bg - also force normal alert marks inside "introQuote" area to have a grey bg */
.alertMarkBg,
.introQuote .alertMark {
  background:url(../BY00004_ims/warning_triangle_grey_bg.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 16px;
	width: 16px;
	display: block;
}

/* Alert message box - to contain alert text.  Must be used in conjunction with the alert mark (above) */
.alertBox {
  background-color: #ffff99;
  border-color: #666666;
  border-width: 1px;
  border-style: solid;
  padding: 2px;
	font-family: Arial, Helvetica, sans-serif;
}
/* For older pages that display validation messages in the "introQuote" area, the following ensures font size is correct in IE */
.introQuote .alertBox {
  font-size: 1.43em;
}

/* Alert panel - A slight variant on displaying alert messages.  Typically used for styling "ValidationSummary" panels in .Net */
.alertPanel {
   background-image: url(../BY00004_ims/warning_triangle.gif);
   background-repeat: no-repeat;
   background-position: 7px 7px;
   background-color: #ffff99;
   border-color: #666666;
   border-width: 1px;
   border-style: solid;
   padding: 2px 2px 2px 30px;
   font-family: Arial, Helvetica, sans-serif;
}

/* Edit Cells - A special feature that allows input elements within a table to appear without border, */
/*  therefore giving the appearance of an editable cell.  Can be applied to either table, table cell, */
/*  or input element.                                                                                 */

input.editCell,
textarea.editCell,
.editCell input,
.editCell textarea {
   border-width: 0px;
   background: transparent;
}

/* Centred Input Text Fields/Boxes - used for styling text fields when there is a good reason to centre the text within them (eg. if the web user is able to edit a label above a radio button) */
input.centre,
textarea.centre,
.editCell.centre input,
.editCell.centre textarea {
	text-align: center;
}

/* HTML Form Element Styles : END */
/* ============================== */



/* List Styles : START */
/* =================== */

/* UL / OL - (unordered / ordered list) - tags */
ul.mainContentUl,
.mainContent ul,
#mainContent ul,
.mainContent ol,
#mainContent ol {
    margin: 0px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
	font-size: 0.7em;
    color: #000;
}
/* The following ensures that deeper levels do not "shrink" in text size! */
ul.mainContentUl li ul,
ul.mainContentUl li ol,
.mainContent li ul,
#mainContent li ul,
.mainContent li ol,
#mainContent li ol {
    font-size: 1em;
}

/* The following ensures that lists within tables do not "shrink" in text size */
.mainContentTable ul,
.mainContentTable ol,
.mainContent table ul,
.mainContent table ol,
#mainContent table ul,
#mainContent table ol {
	font-size: 1em;
}

/* LI tags - any at level 2 or deeper... *** I DON'T THINK THIS STYLE DOES ANYTHING *** */
ul.mainContentUl li ul li,
ul.mainContentUl li ol li,
.mainContent li ul li,
#mainContent li ul li,
.mainContent li ol li,
#mainContent li ol li {
    padding-left: 8px;
}
/* LI - (list item) - tags */
ul.mainContentUl li,
.mainContent ul li,
#mainContent ul li,
.mainContent ol li,
#mainContent ol li {
    margin-left: 0px;
    padding-left: 25px;
    margin-top: 5px;
    margin-bottom: 5px;
    line-height: 1.25em;
}
/* LI - (list item) - tags (when immediate parent tag is a UL - unordered list): support up to 10 bullet levels */
.mainContent ul li,
.mainContent li ul li,
.mainContent li li ul li,
.mainContent li li li ul li,
.mainContent li li li li ul li,
.mainContent li li li li li ul li,
.mainContent li li li li li li ul li,
.mainContent li li li li li li li ul li,
.mainContent li li li li li li li li ul li,
.mainContent li li li li li li li li li ul li,
#mainContent ul li,
#mainContent li ul li,
#mainContent li li ul li,
#mainContent li li li ul li,
#mainContent li li li li ul li,
#mainContent li li li li li ul li,
#mainContent li li li li li li ul li,
#mainContent li li li li li li li ul li,
#mainContent li li li li li li li li ul li,
#mainContent li li li li li li li li li ul li,
ul.mainContentUl li,
ul.mainContentUl li ul li,
ul.mainContentUl li li ul li,
ul.mainContentUl li li li ul li,
ul.mainContentUl li li li li ul li,
ul.mainContentUl li li li li li ul li,
ul.mainContentUl li li li li li li ul li,
ul.mainContentUl li li li li li li li ul li,
ul.mainContentUl li li li li li li li li ul li,
ul.mainContentUl li li li li li li li li li ul li {
    margin-left: 0px;
    padding-left: 25px;
    margin-left: 0px;
    list-style-type: none;
    background:url(../BY00004_ims/ul_bullet_hyphen.gif) left top no-repeat;
}
/* LI - (list item) - tags (when immediate parent tag is an OL - ordered list): support up to 10 bullet levels */
.mainContent ol li,
.mainContent li ol li,
.mainContent li li ol li,
.mainContent li li li ol li,
.mainContent li li li li ol li,
.mainContent li li li li li ol li,
.mainContent li li li li li li ol li,
.mainContent li li li li li li li ol li,
.mainContent li li li li li li li li ol li,
.mainContent li li li li li li li li li ol li,
#mainContent ol li,
#mainContent li ol li,
#mainContent li li ol li,
#mainContent li li li ol li,
#mainContent li li li li ol li,
#mainContent li li li li li ol li,
#mainContent li li li li li li ol li,
#mainContent li li li li li li li ol li,
#mainContent li li li li li li li li ol li,
#mainContent li li li li li li li li li ol li,
ul.mainContentUl li ol li,
ul.mainContentUl li li ol li,
ul.mainContentUl li li li ol li,
ul.mainContentUl li li li li ol li,
ul.mainContentUl li li li li li ol li,
ul.mainContentUl li li li li li li ol li,
ul.mainContentUl li li li li li li li ol li,
ul.mainContentUl li li li li li li li li ol li,
ul.mainContentUl li li li li li li li li li ol li {
    margin-left: 0px;
    padding-left: 10px;
    list-style-position: inside;
    list-style-type: decimal;
    background-image:none;
}

/* List Styles : END */
/* ================= */



/* Image Styles : START */
/* ==================== */
.calendarIcon {
   vertical-align: text-top;
   border-width: 0px;
}
/* Image Styles : END */
/* ================== */



/* Styles added for FrontPage templates */
/* ==================================== */
/*  */
.impulseTmplt .impulseTdTxt,
.impulseTmplt .impulseTdTxtHp,
.impulseTmplt .impulseTdArrow,
.impulseTmplt .impulseTdArrowLast,
.impulseTmplt .impulseTdTxtLast,
.impulseTmplt .impulseTdTxtHpLast,
.impulseTmplt .impulseTdHelpDesk
{
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #ccc;
	border-bottom-width: 0px;
	border-bottom-style: none;
	padding: 0px 0px 0px 2px;
}
.impulseTmplt .impulseTdTxtFirst,
.impulseTmplt .impulseTxtGreyKey,
.impulseTmplt .impulseTdImgHp
{
	border-top-width: 0px;
	border-top-style: none;
	border-top-color: #ccc;
	border-bottom-width: 0px;
	border-bottom-style: none;
}

/* When the menu is removed, column 1 is used as a spacer column */
.col1Spacer {
	width: 17px;
}
/* When the impulse pane is removed, column 3 is used as a spacer column */
.col3Spacer {
	width: 17px;
}


/* .NET-specifc Styles : START */
/* =========================== */


/* Tree Views : START */
/* . . . . . . . . .  */

/* see style definitions for "noBorder" above" */

/* . . . . . . . . .  */
/* Tree Views :  END  */


/* Control Wrappers : START */
/* . . . . . . . . . . . .  */
/* A control wrapper is typically a "div" wrapper around a control and is      */
/* used to help set specific styling for controls.  Often this is to cancel    */
/* out the effects of Bentley's default styling on HTML elements that controls */
/* use.                                                                        */
/* The control wrapper is often best used outside the mainContent classed div  */
/* in order to best avoid classes with other mainContent-based styling.        */

.controlWrapper {
	padding-right: 23px;
}

.mainContent table .controlWrapper.noBorder table,
.mainContent table .controlWrapper.noBorder table th,
.mainContent table .controlWrapper.noBorder table td,
#mainContent table .controlWrapper.noBorder table,
#mainContent table .controlWrapper.noBorder table th,
#mainContent table .controlWrapper.noBorder table td {
	border: 0px none !important;
	text-indent: 0px;
	padding: 0px !important;
}

/* . . . . . . . . . . . .  */
/* Control Wrappers :  END  */


/* Data-Grids (similar in style with a standard mainContent table (defined above)) : START */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* Data-Grids are known as Grid-Views in VS2005 */

/* While data-grid styles are synonymous to that of a mainContentTable, please ensure any changes are  */
/* also updated in the "HTML Content Table Styles" above                                               */

/* Table Itself: */
.dgTable {
	border: 1px solid #666;
	border-collapse: collapse;
	margin: 0px;
	padding: 0px;
}
/* Table Header Rows: */
.dgTable th,
.dgTable .dgHeader td {
	border-bottom-width: 2px !important;
	border-bottom-style: solid !important;
	border-bottom-color: #bababa !important;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #666;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #666;
	height: 21px;
	vertical-align: top;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	color: #000;
	font-weight: bold;
	margin: 0px;
	padding: 0px 4px 0px 2px !important;
	text-align: left;
}
/* Standard Table Rows                                                   */
/* (NB. dgItem refers to a standard row.                                 */
/*  dgAlternatingItem and others shown here, although currently the      */
/*  same style as dgItem to be synonymous with a mainContent table,      */
/*  they may in future differ.  For this reason, the appropriate style   */
/*  they should be used so that your data-grid will automatically pick   */
/*  up any look and feel.  Don't assume they will always match):         */
.dgTable td,
.dgTable .dgItem td,
.dgTable .dgAlternatingItem td,
.dgTable .dgFooter td,
.dgTable .dgEditItem td,
.dgTable .dgPager td,
.dgTable .dgSelectedItem td {
	border-bottom-width: 0px;
	border-bottom-style: none;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #666;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #666;
	vertical-align: top;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	color: #000;
	margin: 0px 0px 14px;
	padding: 0px 4px 0px 2px !important;
}
/* Standard Table Rows - selected items                                  */
/* NB. This style is one without an equivalent mainContentTable style    */
/* Purpose: to make a selected data-grid item stand out from others      */
.dgTable .dgSelectedItem td {
	font-weight: bold;
}

/* Alternating Table Rows                                                */
/* NB. This style is one without an equivalent mainContentTable style    */
/* Purpose: to style every other row slightly differently to aid reading */
/*          across a table, especially since there are no row divider    */
/*          lines (at the time of writing)                               */
.dgTable .dgItem td {
	background-color: #f0f0f0;
}

/* Table Footer Rows: */
.dgTable .dgFooter td {
	border-top-width: 2px !important;
	border-top-style: solid !important;
	border-top-color: #bababa !important;
}

/* Embedded tables - here ensuring the font size doesn't shrink! */
.dgTable .dgTable th,
.dgTable .dgTable td,
.dgTable .dgTable .dgHeader td,
.dgTable .dgTable .dgItem td,
.dgTable .dgTable .dgAlternatingItem td,
.dgTable .dgTable .dgFooter td,
.dgTable .dgTable .dgEditItem td,
.dgTable .dgTable .dgPager td,
.dgTable .dgTable .dgSelectedItem td {
	font-size: 1em;
}

/* Next Page - "dgPagerNextPage" should be applied to a "div" containing */
/*             the text "Next Page".  The "div" should reside in the     */
/*             NextPageText property (part of PagerSettings).            */
.dgTable .dgPager .dgPagerNextPage {
	text-decoration: none;
	display: block;
	text-indent: -9999px;
	background-image: url(../BY00004_ims/pagers/next.gif);
	background-repeat: no-repeat;
	height: 16px;
	width: 16px;
}

/* Previous Page - "dgPagerPreviousPage" should be applied to a "div"    */
/*                 containing the text "Previous Page".  The "div"       */
/*                 should reside in the PreviousPageText property (part  */
/*                 of PagerSettings).                                    */
.dgTable .dgPager .dgPagerPreviousPage {
	text-decoration: none;
	display: block;
	text-indent: -9999px;
	background-image: url(../BY00004_ims/pagers/previous.gif);
	background-repeat: no-repeat;
	height: 16px;
	width: 16px;
}

/* Row Highlight - Optional means of highlighting a row.  "rowHighlight"  */
/*                  should be applied to a TR tag in addition to either   */
/*                  "dgItem" or "dgAlternatingItem"                       */
/*                 Common use: to dynamically append class using          */
/*                  JavaScript onmouseover event                          */
.dgTable tr.rowHighlight td
{
	background-color: #ffff99;
}

/* Pager table - automatically remove border */
.mainContent .dgTable .dgPager table,
#mainContent .dgTable .dgPager table,
.mainContent .dgTable .dgPager table td,
#mainContent .dgTable .dgPager table td {
	border: 0px none;
}

/* Last Page - "dgPagerLastPage" should be applied to a "div" containing */
/*             the text "Last Page".  The "div" should reside in the     */
/*             LastPageText property (part of PagerSettings).            */
.dgTable .dgPager .dgPagerLastPage {
	text-decoration: none;
	display: block;
	text-indent: -9999px;
	background-image: url(../BY00004_ims/pagers/last.gif);
	background-repeat: no-repeat;
	height: 16px;
	width: 16px;
}

/* First Page - "dgPagerFirstPage" should be applied to a "div"          */
/*              containing the text "First Page".  The "div" should      */
/*              reside in the FirstPageText property (part of            */
/*              PagerSettings).                                          */
.dgTable .dgPager .dgPagerFirstPage {
	text-decoration: none;
	display: block;
	text-indent: -9999px;
	background-image: url(../BY00004_ims/pagers/first.gif);
	background-repeat: no-repeat;
	height: 16px;
	width: 16px;
}

/* Hyperlinks or page label within pager */
.mainContent .dgTable .dgPager table td,
#mainContent .dgTable .dgPager table td {
	/*display: block;*/
	/* width: 10px; */
	padding-left: 3px;
	padding-right: 3px;
	text-align: center;
}

/* Darker borders for when splitting up sections of a data-grid */
.dgTable .dgItem .dgSectionBorderBottom,
.dgTable .dgAlternatingItem .dgSectionBorderBottom,
.dgTable .dgHeader .dgSectionBorderBottom {
  border-bottom-width: 2px !important;
	border-bottom-style: solid !important;
	border-bottom-color: #666 !important;
}
.dgTable .dgItem .dgSectionBorderLeft,
.dgTable .dgAlternatingItem .dgSectionBorderLeft,
.dgTable .dgHeader .dgSectionBorderLeft {
  border-left-width: 2px !important;
	border-left-style: solid !important;
	border-left-color: #666 !important;
}
.dgTable .dgItem .dgSectionBorderRight,
.dgTable .dgAlternatingItem .dgSectionBorderRight,
.dgTable .dgHeader .dgSectionBorderRight {
  border-right-width: 2px !important;
	border-right-style: solid !important;
	border-right-color: #666 !important;
}
.dgTable .dgItem .dgSectionBorderTop,
.dgTable .dgAlternatingItem .dgSectionBorderTop,
.dgTable .dgHeader .dgSectionBorderTop {
  border-top-width: 2px !important;
	border-top-style: solid !important;
	border-top-color: #666 !important;
}
/* The following declaration ensures that a top section border takes precendence over the footer border */
.dgTable .dgFooter td.dgSectionBorderTop {
  border-top-width: 2px !important;
	border-top-style: solid !important;
	border-top-color: #666 !important;
}

/* Data-Grids : END */
/* . . . . . . . .  */

/* .NET-specifc Styles : END */
/* ========================= */


/* Personal Home Page Styles : START */
/* ================================= */
.ppImpulseTmplt {
	background-color: #f0f0f0;
}
.ppQuickLinksTable {
	background-color: #BABABA;
}
.ppCentralImage {
	text-align: left;
	width: 25%;
	background-color: #ffffff;
}

.ppCentralTable {
	background-color: #ffffff;
}
	
.ppMyLinksTable {
	background-color: #f0f0f0;
	text-align: center;
}

.ppCentralMyLinks {
	text-align: left;
	width: 33%;
}

.ppCentralTdTxt {
	text-align: left;
	vertical-align: top;
	width: 25%;
	background-color: #ffffff;
}
/* Personal Home Page Styles : END */
/* =============================== */