/* 
*	juice.css
*	Project : NPD/5994 Imperative, Imperative Health Limited.
*	Copyright ©2007 Imperative Health Limited. All rights reserved. 
*	MiLife Master Style Sheet
* 
* Modification History
* Version		Date			By			Comment
* V2M1R0		11/07/2007		HUGSR		Refactored after Code Review - removed duplicate and redundant classes.



/* 	===================================================================================================
												Body
===================================================================================================  */

#headerright 	{
	float:right;
	position:absolute;
	left:620px;
	top:150px;
	margin: 0px auto;
	padding: 20px 5px 0px 0px;
	width: 263px;
	text-align: right;
	padding:0px 0px 0px 0px;
	height:24px;
	line-height:20px;
	}	

/*Layout for masterpage*/

#JM_contentPanelMasterPage, #JM_content_contentPanelMasterPage 
{
	position:relative;
	left:0px;
	height:auto;
	text-align:left;
}

/*Style of ASP.NET change password control*/
.passwordChangeIFrame
{
width:725px;
height: 220px;
border:none 0px;
}

.changePassword
{
	margin-top:20px;
	margin-left:20px;
	float:left;
}

 .infoIcon
{
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	width: 8px;
	height: 17px;
	background-color: Transparent;
	background-image:  url(../images/infoIcon.gif);
}

/***********/
/*   TEXT  */
/***********/


/* Instruction information on the page */
.pageInstructionsText
{
	font-size: x-small;
	color: #228800;
	font-weight:bold;
}

.formFieldHintText
{
	font-size: x-small;
	color: #228800;
}

/* title of some importance */
.importantTitle, .helpTitleText
{
	font-size:x-large;
	font-weight:bold;
	
}

/* groupingTitle : Title labelling a group of controls */
.groupingTitle
{
	/*font-size:medium;*/
	font-weight:bold;
	
	
}

/* formLabel : Title above or next to form contents such at textboxes */
.formLabel
{
	font-size:x-small;
	font-weight:normal;
	
}


/* a normal hyperlink */
.linkNormal
{
	color:#008BDA;
	font-family:Arial,Helvetica,sans-serif;
	font-size:11px;
	font-weight:normal;
	text-decoration:underline;	
}

.linkNormal a:hover,.linkNormal:hover
{
    text-decoration:none;
    color:#81BFE4;
}

/* a normal small hyperlink */
.linkSmall
{
	/*border-bottom:2px solid #545456;*/
	border-bottom:0px none;
	color:#545456;
	font-family:Arial,Helvetica,sans-serif;
	font-size:50%;
	font-weight:normal;
	text-decoration:none;	
}

.linkSmall a:hover,.linkSmall:hover
{
border:0px none;
border-style:none;
text-decoration:none;
}

.linkTellMeMore
{	
	background-image:url(../images/background-tell-me-more-over.png);
	background-repeat:no-repeat;
	color:#008BDA;
	display:block;
	font-family:Arial,Helvetica,sans-serif;
	font-size:11px;
	font-weight:normal;	
	padding-left:20px;
	line-height:20px;
	text-decoration:underline;
	width:90px;
	float:left;
}

.linkTellMeMore:hover, .linkTellMeMore a:hover
{	
	color:#81BFE4;	
	text-decoration:none;
}

.linkTellMeMoreSmall
{	
	background-image:url(../images/background-tell-me-more-over.png);
	border-bottom:2px solid #545456;
	background-repeat:no-repeat;
	color:#545456;
	display:block;
	font-family:Arial,Helvetica,sans-serif;
	font-size:12px;
	font-weight:bold;	
	letter-spacing:-1px;
	line-height:20px;
	padding-left:20px;
	text-decoration:none;
	margin-bottom: 5px;
	display:inline;
	width:auto;
}

.linkTellMeMoreSmall:hover, .linkTellMeMoreSmall a:hover
{	
	background-image:url(../images/background-tell-me-more-over.png);
	border-bottom:2px solid #ffffff;
	background-repeat:no-repeat;
	color:#545456;	
	font-family:Arial,Helvetica,sans-serif;
	font-size:12px;
	font-weight:bold;	
	letter-spacing:-1px;
	line-height:20px;
	padding-left:20px;
	margin-bottom: 5px;
	text-decoration:none;
	width:auto
}


.iconTellMeMore
{
	background-image:url(../images/background-tell-me-more-over.png);
	background-repeat:no-repeat;
	line-height:20px;
	padding-left:20px;
	display:inline;
	width:auto;
	text-decoration: none;
}

.iconTellMeMore a:hover
{
	background-image:url(../images/background-tell-me-more-over.png);
	background-repeat:no-repeat;	
	line-height:20px;
	padding-left:20px;
	display: inline;
	width:auto;
	text-decoration: none;
}

/* a normal text */
.textNormal
{
	font-weight:normal ; 
	font-style:normal;
	text-decoration: none;
}

/* error text */
.textError
{
	color:#FF0000;
}


/* a large text */
.textLargeSized
{
	font-size:medium ; 
	font-weight:bolder;
}

/* a normal text */
.textNormalSized
{
	font-size:small ; 
}

/* a normal text */
.textSmallSized
{
	font-size:xx-small ; 
}

/* This class is used by MiLifePopup */
.textSmall
{
	font-weight: normal;
	font-variant: normal;
	background-color: Transparent;
	color: Black;
	font-size: xx-small;
	text-align: left;
}

/* This class is used by MiLifePopup */
.textLargeColoured
{
	font-weight: bold;
	font-variant: normal;
	background-color: Transparent;
	color: #5e2750;
	font-size: small;
	text-align: left;
}

/* Apply mouse over styling */
A:hover  {color:#882200; }

/* use to position an element over to the right */
.positionRight
{
	float:right;
}

/***********/
/* TABLES  */
/***********/

.table
{
    border: none;
	border-collapse: collapse;
	/*margin-bottom: 20px;*/
    margin-bottom: 0px;
}

.table th
{
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left : 1px;
    padding-right : 1px;
    font-weight: normal;
	border-bottom: solid 2px #5e2750;
}

.table td
{
	border: solid 2px #5e2750;
    padding-left:10px;
    padding-right:10px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.tableheaderleft
{
	padding-bottom: 0px;
}

.tableheaderleft > div
{
	background-image: url(../mi-vitality-images/table-header-left.png);
	background-repeat: no-repeat;
  	background-position: left;
	color: #e9c5cb;
	font-size: 110%;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 0px;
	padding-bottom: 0px;
	line-height: 38px;
    margin-left:-2px;
    margin-right: -1px;
}

.tableheadercenter
{
	background-image: url(../mi-vitality-images/table-header-centre.png);
	background-repeat: repeat-x;
	background-position: left bottom;
	color: #e9c5cb;
	font-size: 110%;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 0px;
	line-height: 38px;
    margin: 0px;
}

.tableheadercenterImage
{
	background-image: url(../mi-vitality-images/table-header-centre.png);
	background-repeat: repeat-x;
	background-position: left;
	color: #e9c5cb;
	font-size: 110%;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 0px;
	padding-bottom: 0px;
	line-height: 38px;
	text-align: center;
	width: 60px;
}

.tableheaderright
{
    padding-bottom: 0px;
}

.tableheaderrightImage
{
	/*width: 60px;*/
    padding-bottom: 0px;
}

.tableheaderright > b > div, .tableheaderright > div
{
	background-image: url(../mi-vitality-images/table-header-right.png);
	background-repeat: no-repeat;
	background-position: right;
	color: #e9c5cb;
	font-size: 110%;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 0px;
	padding-bottom: 0px;
	line-height: 38px;
	text-align: center;
	/*width: 60px;*/
    margin-left:-1px;
    margin-right: -2px;
}

.pagerRowStyle td
{
    border: none;
}

/************************************/

.tableColumnHeaderText
{
	font-size: small;
	font-weight: bold;
	color: #FFFFFF;
}

.tableNormalText
{
	font-size: small;
	border: 0;
	color: #000000;
}


/* a blank tablecell, will have no colour at all */
.tableCellBlank
{
	background-color: Transparent;
	font-weight: normal;
	font-variant: normal;
	
	font-size: small;
	text-align: left;	
	padding: 4px 4px 4px 4px;
	width:auto;
	
}

/* used for an emphasised table cell, such as the header or footer or column titles */
.tableCellStrong
{
	border: solid thin #FFFFAA;
	font-weight: normal;
	font-variant: normal;
	background-color: #66CC00;
	font-size: small;
	text-align: left;	
	padding: 4px 4px 4px 4px;
	width:auto;
}
/* use for vertical text - will not render as vertical in browsers other than IE, but should fail gracefully */
.diaryVerticalHeading
{
	font-weight: normal;
	font-variant: normal;
	background-color: #66CC00;
	font-size: small;
	text-align: left;	
	padding: 4px 4px 4px 4px;
	width:auto;
/*	writing-mode:tb-rl ; */
	
		font-weight: bold;
	color: #FFFFFF;
}
/* a standard table cell */
.tableCellNormal
{
	border: solid thin #97cd17;
	background-color:#AADD66;
	font-size: small;
	padding: 4px 4px 4px 4px;
	width: auto;
}



/***********************************/

.tableCellGroupingBox
{
	background-color: #FFFFFF;
}

.diaryCell
{
	border: solid thin #FFFFAA;
	font-size: x-small ; 
	text-align:left ; 

}

/***********/
/*  FORMS  */
/***********/

.checkBoxNormal
{
	margin:0px;
	border: 0px none;
	border-collapse:collapse;	
	margin-left:0.5em;	
}


/* Drop down lists */
.dropdownnormal
{
	font-family: Arial, Helvetica, Sans-Serif;	
	display: block;
}


/* small text entry boxes for inputing single line text such as numbers */
.textBoxNormal
{
	font-weight:normal;
	font-variant:normal;
	background-color:#FFFFFF;
	font-size:x-small;
	color:#000000;
	text-align:left;
}

.systemTextBox
{	
	background-color:#FFFFFF;	
	color:#000000;
	border: 0px none;
	text-align:left;
	border-collapse:collapse;
	font-family: Arial, Helvetica, Sans-Serif;
}

.systemTextBoxInTable
{
	font-weight:normal;
	font-variant:normal;
	background-color:#FFFFFF;
	font-size:x-small;
	color:#000000;
	text-align:left;
	min-width: 250px;
	min-height: 100px;	
}

/* small text entry boxes for inputing single line text such as numbers */
.textBoxSmall
{
	font-weight:normal;
	font-variant:normal;
	background-color:#FFFFFF;
	font-size:xx-small;
	color:#000000;
	text-align:left;
}



/***********/
/* WARNING */
/***********/
.warningNormal
{
	background-color:#55FFFF;
}

/**********/
/* FRAMES */
/**********/

/* grouping frame used to localise specific areas of a page */
.groupingFrameTable
{	
	padding: 0px 0px 0px 0px;
}

/* grouping frame used to localise specific areas of a page */
.groupingFrameN, .groupingFrameS, .groupingFrameE, .groupingFrameW, .groupingFrameCell
{
	background-color: #FFFDAC;
	color: #333333;
	padding: 0px 0px 0px 0px;
	border-width:thin;
}

/* grouping frame corners used to localise specific areas of a page */
.groupingFrameNE, .groupingFrameSE, .groupingFrameSW, .groupingFrameNW 
{
	padding: 0px 0px 0px 0px;
	width: 8px;
	height: 8px; 
	min-width: 8px;
	min-height: 8px;
}
.groupingFrameNE
{
	background-image: url(../images/CreamFrameCornerNE.gif);
}
.groupingFrameSE
{
	background-image: url(../images/CreamFrameCornerSE.gif);
}
.groupingFrameNW
{
	background-image: url(../images/CreamFrameCornerNW.gif);
}
.groupingFrameSW
{
	background-image: url(../images/CreamFrameCornerSW.gif);
}





/** STRONG GROUPING FRAME ***/

/* grouping frame used to localise specific areas of a page */
.strongGroupingFrameTable
{	
	padding: 0px 0px 0px 0px;
}

/* grouping frame used to localise specific areas of a page */
.strongGroupingFrameN, .strongGroupingFrameS, .strongGroupingFrameE, .strongGroupingFrameW, .strongGroupingFrameCell
{
	background-color:Transparent;
	padding: 0px 0px 0px 0px;
	border-width:thin;
}

.strongGroupingFrameSpacer
{
	width: 22px;
	height: 22px;
}

/* grouping frame corners used to localise specific areas of a page */
.strongGroupingFrameNE, .strongGroupingFrameSE, .strongGroupingFrameSW, .strongGroupingFrameNW 
{
	background-color:Transparent;
	padding: 0px 0px 0px 0px;
	width: 22px;
	height: 22px;
	min-width: 22px;
	min-height: 22px;

}
.strongGroupingFrameNE
{
	background-image: url(../images/creamNE.gif);
}
.strongGroupingFrameSE
{
	background-image: url(../images/creamSE.gif);
}
.strongGroupingFrameNW
{
	background-image: url(../images/creamNW.gif);
}
.strongGroupingFrameSW
{
	background-image: url(../images/creamSW.gif);
}
.strongGroupingFrameN
{
	background-image: url(../images/creamN.gif);
}
.strongGroupingFrameS
{
	background-image: url(../images/creamS.gif);
}
.strongGroupingFrameE
{
	background-image: url(../images/creamE.gif);
}
.strongGroupingFrameW
{
	background-image: url(../images/creamW.gif);
}

.cssSpacer
{
	background-color:Transparent;
}


/** STRONG GROUPING FRAME ***/

/* grouping frame used to localise specific areas of a page */
.normalGroupingFrameTable
{	
	padding: 0px 0px 0px 0px;
}

/* grouping frame used to localise specific areas of a page */
.normalGroupingFrameN, .normalGroupingFrameS, .normalGroupingFrameE, .normalGroupingFrameW, .normalGroupingFrameCell
{
	background-color:white;
	padding: 0px 0px 0px 0px;
	border-width:thin;
}

.normalGroupingFrameSpacer
{
	background-color:Transparent;
	width: 22px;
	height: 22px;
}

/* grouping frame corners used to localise specific areas of a page */
.normalGroupingFrameNE, .normalGroupingFrameSE, .normalGroupingFrameSW, .normalGroupingFrameNW 
{
	background-color:Transparent;
	padding: 0px 0px 0px 0px;
	width: 22px;
	height: 22px;
	min-width: 22px;
	min-height: 22px;

}
.normalGroupingFrameNE
{
	background-image: url(../images/whiteNE.gif);
}
.normalGroupingFrameSE
{
	background-image: url(../images/whiteSE.gif);
}
.normalGroupingFrameNW
{
	background-image: url(../images/whiteNW.gif);
}
.normalGroupingFrameSW
{
	background-image: url(../images/whiteSW.gif);
}
.normalGroupingFrameN
{
	background-image: url(../images/whiteN.gif);
}
.normalGroupingFrameS
{
	background-image: url(../images/whiteS.gif);
}
.normalGroupingFrameE
{
	background-image: url(../images/whiteE.gif);
}
.normalGroupingFrameW
{
	background-image: url(../images/whiteW.gif);
}

/* Rounded corner popup box */
/* adapted from http://tutorials.alsacreations.com/cadre/ */

.infoPopup dl { /* block position that can be changed at will */
position: absolute;
left: -85px; /* 1/2 the width to place the infoPopup just below the pointer */
top: 0px;
width: 250px; /* width of block according to your background image */
}

.infoPopup dl, .infoPopup dt, .infoPopup dd{ /* suppression of all margins and paddings */
margin: 0;
padding: 0;

}

.infoPopup dl { /* by default background on the entire block */
background: url(../images/creamRoundedPanelBottom.gif) bottom left no-repeat;
padding-bottom: 13px; /* so that text will not appear on the bottom rounded edge */
}

.infoPopup dt { /* bloc title definition */
height: 30px; /* top image is 34 pixels high, minus the 4 pixels of top padding */
background: url(../images/creamRoundedPanelTop.gif) top left no-repeat;
font-size:medium;
font-weight: bold;
text-align:center;
padding-top: 4px; /* 4 pixels of top padding, must be accounted for int he image height above */
}

.infoPopup dd {
padding: 0 13px 0 10px; /* internal block spaces administration */
text-align: left;
font-size:x-small;
background: url(../images/creamRoundedPanelMiddle.gif) top left repeat-y; /* internal background */
}

/***************************************************************************/
/* Vertical Line for delimiting a page */
/***************************************************************************/
.verticalLine 
{
	 /*border-right-color: Black;
	 border-right-style: groove;
	 border-right-width: 1px;*/
}

.right
{
	/*position:absolute;
	right: 3px;*/
	position:relative;
	right: 3px;
}


.left
{
	position:relative;
	left: 3px;
}


/*
 * Context-sensitive help popups.
 */
.popupImage
{
width: 20px;
height: 20px;
/*background-image: url(../images/help/helpbubble.png);*/
border: none 0 transparent;
cursor: pointer;
}

.popupPanel
{
width: 20px;
height: 20px;
padding: 2px 5px 2px 5px;
display: inline;
cursor: help;
}

.popupTitleText
{
	color:#5E2750;
	font-family:Arial,Helvetica,sans-serif;
	font-size:110%;
	font-weight:bold;
	width: 100%;
	min-width: 100%;
}

#BClose
{
	width: 17px;
	max-width: 17px;
	height: 17px;
}

.popupMessageText
{
	color:#545456;
	font-family:Arial,Helvetica,sans-serif;	
	font-size:90%;
	font-weight:normal;
	line-height:20px;
	text-align:justify;
}

.popupLayoutTable
{
	border: none 0px transparent;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	border-collapse: collapse;
	border-spacing: 0px;
}

.popupBodyTableHelp
{
	border: none 0px transparent;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	background-color: #FFFDAC;
	border-collapse: collapse;
	border-spacing: 0px;
	width: 100%;
}

.popupBodyTable
{
	border: none 0px transparent;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	background-color: #FFFFFF;
	border-collapse: collapse;
	border-spacing: 0px;
	width: 100%;	
}

/*
 * SystemChoiceLink style
 */
.systemChoiceItems
{
	padding-left: 10px;
	background-color:transparent;
	background-image: url(../mi-vitality-images/green-arrow-small.gif);
	background-position: top left;
	background-repeat: no-repeat;
	font-size: 100%;
}
/*
 * Feedback Frames
 */
.frameFeedback
{
	font-size:medium;
	font-weight:bold;
	color:#e0119d;
	background-color:#e9c5cb;
	border: solid 1px #5e2750;
}

.frameWarning
{
	font-size:medium;
	font-weight:bold;
	color:White;
	background-color:red;
}



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

.tabEndCell
{
	width:100%;	
	border-bottom-color: #000000;
	border-bottom-width:2px;
	border-bottom-style:solid;
}


/* Cells containing the images that make the menue slook like tabs */
.tabGraphicCellSelected
{
	border-width: 0px;
}

.tabGraphicCellUnselected
{
	border-bottom-color: #000000;
	border-bottom-width:2px;
	border-bottom-style:solid;
}

.tabGraphicCellSelected, .tabGraphicCellUnselected
{
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	height: 100%;	
}

/* actual images that make the menues look like tabs */
.tabLeftImageUnselected, .tabLeftImageSelected
{
		height: 100%;	
		width: 13px;	
}

.tabRightImageUnselected, .tabRightImageSelected
{
		height: 100%;	
		width: 18px;	
}

/* the selected text in the menu */
.tabTextSelected
{
	font-weight:bold;
	font-size:medium;
	text-decoration:none;
	color: #000000;

}

/* the unselected menu tab text */
.tabTextUnselected
{
	font-weight:bold;
	font-size:medium;
	text-decoration:none;
	
	color:Black;
}

/* the actual table for the menu */
.tabControlTable
{
	padding:0px;
	border-spacing: 0;
}

/* the styles for tabs */
.tabSelectedButton, .tabUnselectedButton
{
	height: 100%;	
}

/* the cell for an unsellected tab */
.tabUnselectedButton 
{
	color: #000000;
	background-color: #F7BF7A;
	border-bottom-color: #000000;
	border-bottom-width:2px;
	border-bottom-style:solid;
	
	border-top-color: #000000;
	border-top-width:2px;
	border-top-style:solid;
	
}

/* the cell for the selected tab, note the lack of a border-bottom - the tab remains open */
.tabSelectedButton 
{
	color: #000000;

	background-color: #FFFDAC;

	border-top-color: #000000;
	border-top-width:2px;
	border-top-style:solid;
}

.tabContentCells
{
	background-color: #FFFDAC;
	border-left-color: #000000;
	border-left-width:2px;
	border-left-style:solid;
	border-right-color: #000000;
	border-right-width:2px;
	border-right-style:solid;
	border-bottom-color: #000000;
	border-bottom-width:2px;
	border-bottom-style:solid;
}


/*Panel used to align the button at the right of the page*/
.buttonFloatRight
{
	width:100%;
	height:100%;
	position:relative;
	display:inline;
	right:0px;
	bottom:0px;
	right:auto;
	top:auto;			
}



/*######################################Layout for PagePanel################################################################*/

/*Layout for table containing rounded scalable page panel*/
.pagePanel0
{
 border:  0;
 margin: 0px;
 border-collapse:collapse;
 overflow:visible;
 display:inline;
 width:auto;
 height:auto;
 font-weight:bold;
}

/*Top left of scalable page panel*/
.pagePanel1 
{ 
}

/*Top right of scalable page panel*/
.pagePanel3
{ 
}

/*Bottom left of scalable page panel*/
.pagePanel7
{ 
}

/*Bottom right of scalable page panel*/
.pagePanel9
{ 
}

/*Top centre of scalable page panel*/
.pagePanel2
{
}

/*Middle left scalalable page panel*/
.pagePanel4
{
	padding: 0px;
}

/*Middle centre of scalable page panel*/
.pagePanel5
{
	padding: 0px;
}

/*Middle right scalalable page panel*/
.pagePanel6
{
	padding: 0px;
}


/*Bottom centre of scalable page panel*/
.pagePanel8
{
}

/*######################################Layout for HeaderPanel################################################################*/

/*Layout for table containing rounded scalable header panel*/
.headerPanel0
{
 display:inline;
 border:  0;
 border-collapse:collapse; 
 font-size: 150%;
 height:auto;
 width:auto;
 margin-left:0px;
 font-family:Arial;
 text-decoration: none;
 /*FONT-WEIGHT: normal;		
 COLOR: #97cd17;	*/
 font-weight:bold;
 color: #5e2750;
 FONT-STYLE: normal;	
}

/*Top left of scalable header panel*/
.headerPanel1 
{ 
}

/*Top right of scalable header panel*/
.headerPanel3
{ 
}

/*Bottom left of scalable header panel*/
.headerPanel7
{ 
}

/*Bottom right of scalable header panel*/
.headerPanel9
{ 
}

/*Middle left scalalable header panel*/
.headerPanel4
{
	padding: 0px;
}

/*Middle centre of scalable header panel*/
.headerPanel5
{
	padding: 0px;
}

/*Middle right scalalable header panel*/
.headerPanel6
{
	padding: 0px;
}


/*Bottom centre of scalable header panel*/
.headerPanel8
{
}

/*######################################Layout for ContentPanel################################################################*/



/*layout of table containing scalabe rounded contentPanel*/


.contentPanel0
{
 border:  0;
 display:inline;
 border-collapse:collapse;
 font-weight:normal;
 font-family:Arial;
 font-size: 0.5em; 
 color:#545456; 
 line-height:20px;
 /*line-height:2.2ex;*/
 text-decoration: none;  
}

/*Top left of scalable content panel*/
.contentPanel1 
{ 
}

/*Top right of scalable content panel*/
.contentPanel3
{ 
}

/*Bottom left of scalable content panel*/
.contentPanel7
{ 
}

/*Bottom right of scalable content panel*/
.contentPanel9
{ 
}

/*Top centre of scalable content panel*/
.contentPanel2
{	
}



/*Middle left scalalable content panel*/
.contentPanel4
{
}

/*Middle centre of scalable content panel*/
.contentPanel5
{
}

/*Middle right scalalable content panel*/
.contentPanel6
{
}


/*Bottom centre of scalable content panel*/
.contentPanel8
{
}

/*######################################Layout for Information Panel################################################################*/

/*Layout for table containing rounded scalable information panel*/
.informationPanel0
{
 border:  0;
 display:inline;
 border-collapse:collapse;
 width:auto;
 height:auto;
 font-weight:normal;
}

/*Top left of scalable information panel*/
.informationPanel1 
{ 
	background: url(../images/InformationPanel/tl.gif) no-repeat; 
	width: 8px;
	height: 10px;	
}

/*Top right of scalable information panel*/
.informationPanel3
{ 
	background: url(../images/InformationPanel/tr.gif) no-repeat; 
	width: 8px;
	height: 10px;
}

/*Bottom left of scalable information panel*/
.informationPanel7
{ 
	background: url(../images/InformationPanel/bl.gif) no-repeat; 
	width: 8px;
	height: 10px;
}

/*Bottom right of scalable information panel*/
.informationPanel9
{ 
	background: url(../images/InformationPanel/br.gif) no-repeat; 
	width: 8px;
	height: 10px;
}

/*Top centre of scalable information panel*/
.informationPanel2
{
	background: url(../images/InformationPanel/top.gif) repeat-x;
	width:auto;
	height: 10px;
}

/*Middle left scalalable information panel*/
.informationPanel4
{
	background: url(../images/InformationPanel/left.gif) repeat-y; 
	width:8px;
	height: 100%;
}

/*Middle centre of scalable information panel*/
.informationPanel5
{
	background: url(../images/InformationPanel/pixel.png) repeat;
	width: auto;
	height: auto;
}

/*Middle right scalalable information panel*/
.informationPanel6
{
	background: url(../images/InformationPanel/right.gif) repeat-y; 
	width:8px;
	height: auto;
}


/*Bottom centre of scalable information panel*/
.informationPanel8
{
	background: url(../images/InformationPanel/bottom.gif) repeat-x;
	width:auto;
	height: 10px;
}

.scrollablepanel 
{
	display: inline;
	width: auto;
	height: auto;
	overflow: scroll;	
	background:white;
}

.emtpy
{
		background-color: transparent;
		background:transparent;
}

/* system button Styles */
.systemButtonTable
{
	cursor: pointer;
	position: relative;
	margin: 2px 2px 2px 2px;
    border-spacing:0px;
}

.systemButtonTable td
{
 padding: 0px;
 border: none;
}

.button
{	margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px; 
	background-image: url(../images/SystemButton/btnMiddleDefault.png);
    background-color: Transparent;
    border-left: 0px none;
    border-right: 0px none;
    font-weight:bold;
    display: block;
    color:#72C0E4;
	font-size:11px;	
    text-transform:uppercase;
	text-indent: 0px;
    height: 35px;
  }
  
.buttonDown
{	margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;    
	background-image: url(../images/SystemButton/btnMiddlePress.png);
    background-color: Transparent;
    font-weight:bold;
    cursor:pointer;        
    display: block;
    text-transform:uppercase;
    text-indent: 0px;
    height: 35px;
  }

.buttonClicked{		
    
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
	background-image: url(../images/SystemButton/btnMiddleRollover.png);
    background-color: Transparent;
    font-weight:bold;	    
    text-transform:uppercase;
    cursor:pointer;        
    display: block;  
    text-indent: 0px;  
    height: 35px;
}


.buttonDisabled
{
	background-image: url(../images/SystemButton/btnMiddleDisabled.png);
    background-color: Transparent;
    display: block;              
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;    	            
    cursor:pointer;	     
    text-transform:uppercase;
    height: 35px;
}



/* Buttons */
/*Standard layout for button text*/
.buttonTextNormal, .buttonTextNormal:visited, .buttonTextNormal a:visited,.buttonTextNormal:active,.buttonTextNormal a:active, .buttonTextNormal a:hover, .buttonTextNormal:hover
{
	width:100%;	
	display:block;	
	color:white;
	font-family:Arial;	
	font-size:11px;
	line-height:12px;
	float:none;	
	text-decoration:none;
	text-align:center;	
	padding: 12px 0px 4px 0px;
}

/*IE layout for button text on hover*/
.buttonTextDisabled,.buttonTextDisabled a:hover, buttonTextNormal a:active, buttonTextNormal a:focus, buttonTextNormal a:visited
{
	display:block;
	width:100%;	
	color: White;
	display:block;
	font-family:Arial;	
	font-size:11px;
	line-height:12px;
	float:none;	
	text-decoration:none;
	text-align:center;	
	padding: 12px 0px 4px 0px;
}

/*Firefox layout for button text on hover*/


.buttonTextClicked, .buttonTextClicked:visited, .buttonTextClicked a:visited,.buttonTextClicked:active,.buttonTextClicked a:active, .buttonTextClicked a:hover, .buttonTextClicked:hover, buttonTextNormal:active, buttonTextNormal:focus
{
	display:block;
	width:100%;	
	color:#72C0E4;	
	font-family:Arial;	
	font-size:11px;
	line-height:12px;
	float:none;	
	text-decoration:none;
	text-align:center;	
	padding: 12px 0px 4px 0px;
}

.buttonTextDisabled:hover
{
	display:block;
	width:100%;	
	color:White;	
	font-family:Arial;	
	font-size:11px;
	line-height:12px;
	float:none;	
	text-decoration:none;
	text-align:center;	
	padding: 12px 0px 4px 0px;
}

.buttonJSDisabled
{
	background-color:transparent;
	border-bottom:solid 2px;
	border:none 0px;
	height:15px;
	}

/* System Button curved imaged */
.systemButtonLeft
{
	background-image: url(../images/SystemButton/btnLeftDefault.png);
	background-position: top right;
	width: 11px;
	height: 35px;
}

.systemButtonRight
{
	background-image: url(../images/SystemButton/btnRightDefault.png);
	background-position: top left;
	width: 11px;
	height: 35px;
}

.systemButtonLeftClicked
{
	background-image: url(../images/SystemButton/btnLeftRollover.png);
	background-position: top right;
	width: 11px;
	height: 35px;
}

.systemButtonRightClicked
{
	background-image: url(../images/SystemButton/btnRightRollover.png);
	background-position: top left;
	width: 11px;
	height: 35px;
}

.systemButtonLeftDisabled
{
	background-image: url(../images/SystemButton/btnLeftDisabled.png);
	background-position: top right;
	width: 11px;
	height: 35px;
}

.systemButtonRightDisabled
{
	background-image: url(../images/SystemButton/btnRightDisabled.png);
	background-position: top left;
	width: 11px;
	height: 35px;
}

/*System Button style for SystemButtonWithPopUp*/



/* Float Styles */
.floatLeft
{
	float:left;
}

.floatRight
{	
	position:relative;
	float:right;
	bottom:0em;
	margin-right:10px;
}

.floatRight_nopad
{	
	position:relative;
	float:right;
	bottom:0em;
}

.floatNone
{
	float:none;
	display:inline;
}

/*Help Popup*/
.helpLayoutTable
{
	border: none 0px transparent;
	padding: 0px;
	margin: 0px;
	border-collapse: collapse;
	border-spacing: 0px;
	/*width: 500px;*/
	width: 100%;
	float: none;
}

.helpPopupHeight
{
	position:relative;
	overflow: auto;
	height: 300px;
	padding-right: 15px;
}
.helpPopupWidth
{
	position:relative;
	width: 400px;
}
.helpPopupHeight_logout
{
	position:relative;
	height: 70px;
}
.helpPopupWidth_logout
{
	position:relative;
	width: 320px;
}
.helpPopup_AutoHeight
{
	position:relative;
	height: auto;
}
.helpPopup_AutoWidth
{
	position:relative;
	width: auto;
}

.eLeft
{
	height: 100%;
	width: 15px;	
	background-image:url(../images/MiLifeHelp/eLeft.png);
	background-repeat:repeat-y;
}

.eRight
{
	height: 100%;
	width: 15px;	
	background-image:url(../images/MiLifeHelp/eRight.png);
	background-repeat:repeat-y;
}

.cLeftTop
{
	height: 15px;
	width: 15px;	
	background-image:url(../images/MiLifeHelp/cLeftTop.png);	
}

.cRightTop
{
	height: 15px;
	width: 15px;	
	background-image:url(../images/MiLifeHelp/cRightTop.png);	
	background-repeat:no-repeat;
}

.cCentreTop
{
	height: 15px;
	width: 100%;
	background-image:url(../images/MiLifeHelp/eTop.png);
	background-repeat:repeat-x;	
}

/*SystemButton look for buttons in PopUp*/

.btnstyleSelector
{
	background-attachment:scroll;
	background-image:url(../mi-vitality-images/btnWholeDefault.png);
	background-repeat:no-repeat;
    background-color:Transparent;
	height:35px;
	width:78px;
	border:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight: 700;
	text-transform:uppercase;
	color:#FFF;
	cursor:pointer;
	display: block;
	float:left;
	margin-left:20px;
}

.btnstyleSelector:hover
{
	background-image:url(../mi-vitality-images/btnWholeRollover.png);
	color:#5CA7BE;
}

/*Size content panel on empty page*/
.emptyPageContentPanel
{
	height: auto;
}

.panelsize
{
	display:inline;
	width:50em;
	height:30em;
	min-width:800px;	
}

/* Infragistics */

.tabbedPane table td
{
	border-bottom-color: #FFFFFF;
	border-bottom-width: 0px;
}

.tab
{
	font-size: 1.0em;	
	background-color:White;
	border: none;
	height: auto;
	border-bottom: none 0px transparent;
	color: #e9c5cb;
	line-height: 14px;
}

.tab_hover
{
    font-size: 1.0em;	
	background-color:White;
	border: none;
	height: auto;
	border-bottom: none 0px transparent;
	color: #ffffff;
}

.tab_selected
{
    font-size: 1.0em;	
	background-color:White;
	border: none;
	height: auto;
	border-bottom: none 0px transparent;
	color: #000000;
}

.visible
{
    visibility: visible;
    line-height: 20px;
}

.hidden
{
    display:none;
    visibility: hidden;
    line-height: 0px;
}

.validatedInputWithUnitsMainUnit
{
	margin:0px;
	border: 0 none transparent;
	border-collapse:collapse;
	width: 43px;
	#width: 38px;
	_width: 38px;
	font-family: Arial, Helvetica, Sans-Serif;
	display: block;
	text-indent:5px;
}

.validatedinput
{	
	margin-left:5px;
	border: 0px none;
	border-collapse:collapse;
	font-family: Arial, Helvetica, Sans-Serif;			
}

.validatedInputCell
{
}

.validatedinputweblink
{	
	padding-left: 60px;			
}

.roundedInput
{
	width:auto;
	border: 1px solid;		
	text-indent:5px;
	margin-left:0px;
	padding-left:0px;
	background-color:#ffffff;
	border-color: #81476d;	
}

.roundedInputDisabled
{
	width:auto;
	border: 1px solid;		
	border-color:#D4D0C8;
	text-indent:10px;
	margin-left:5px;
}


.roundedInputWithUnits
{
	width:45px;
	border: 1px solid;
	border-color: #81476d;	
	margin-left:5px;
	background-color: #ffffff;
	display: inline;
}

.roundedInputDropDown
{
	width:auto;
	border: 0px none;
	border-collapse:collapse;
}

.roundedTextBox
{
	width:auto;
	height:auto;	
	border: 1px solid;			
	background-color:#ffffff;
	border-color: #81476d;	
}


/* NEW LINK STYLES */	
.links {
	text-decoration: none;
	font-weight: bold;
	font-size: 90%;
	font-family: Arial, Helvetica, sans-serif;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #545456;
	color: #545456;
	}
.links:hover{
	text-decoration: none;
	border: 0px;
	}
	
.systemcalendartextbox
{
	display:inline;	
	width:6em;	
	border: 0px none;
	margin-left:5px;
	border-collapse:collapse;
	font-family: Arial, Helvetica, Sans-Serif;		
}

.menuPanel
{
	float: left;
}
	
.menuSub
{
	margin-left: 10px;
}

/* Home Page Detail Progress Styles*/
.detailText
{
	padding: 0px 0px 2px 23px;
	font-family: Arial,  Helvetica, sans-serif;
	font-size: 100%;
	font-weight:normal;
	text-align: left;
}

.mycommitment_text
{
	font-family: Arial,  Helvetica, sans-serif;
	font-size: 15px;
	background-image: url(../mi-vitality-images/arrow-h1.gif);
	background-repeat: no-repeat;
	padding-left: 25px;
	font-weight:normal;
}
	
.homePageContent
{
	width: 684px;
}

/*Change password */
#wzdChangePassword_ChangePasswordContainerID_UserName, #wzdChangePassword_ChangePasswordContainerID_CurrentPassword, #wzdChangePassword_ChangePasswordContainerID_NewPassword, #wzdChangePassword_ChangePasswordContainerID_ConfirmNewPassword
{
	border:none 0px;	
	background-attachment: scroll;
	background-image: url(../mi-vitality-images/background-txt.gif);
	background-repeat: no-repeat;
	padding: 4px 0px 0px 8px;
	height: 25px;
	width: 197px;
	border: 0px none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #545456
}	

.normalTextGrey 
{
	border-collapse:collapse;
	color:#545456;
	font-weight:normal;	
	text-decoration:none;	
	font-family:Arial;
	font-size:12px;
	line-height:20px;
}

.normalTextGreyBold
{
	border-collapse:collapse;
	color:#545456;
	font-weight:normal;	
	text-decoration:none;
	font-weight:bold;	
	font-family:Arial;
	font-size:16px;
	line-height:20px;
}



/*Master page footer link styles */
.footer a, .footer {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	color: #999;
	text-decoration: none;	
	padding: 0px 10px 0px 0px;			
	padding-bottom:10px;	
	position:relative;
	left:10px;	
	top:0px;
}

#JMContent_JM_footerPanelMasterPage
{
	position:relative;
	left:0px;
	top:0px;	
}

.footer a:hover{
	color: #009FDA;
	text-decoration:none;
}

.wizardTable
{
	float:right;
	font-size: 1em;
	position:absolute;
	bottom: 2em;
	right: 4em;
	visibility:visible;
}

.tipoftheweekpanel
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	background-color: #FEFF6A;
	text-align: center;
	text-indent: 5px;
	width: 228px;
	float: none;
	position: relative;
	background-image: url(../images/lightning2.png);
	background-repeat: no-repeat;
	
}

.tipoftheweekpanel_roundedpanel
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	background-color: #FEFF6A;
	text-align: center;
	width: 230px;
	float: none;
	position: relative;
	margin-left: 23px;	
	margin-bottom: 30px;
	
}

/* Goal Setting - HUND */
div.goalSettingPageStyle
{
	position: relative;
	top:0em;
	display:block;
	width: 720px;
	height: 410px;
	#height: 435px;		
	padding-top:0em;
}

div.targetSettingPageStyle
{
	position: relative;
	top:0em;
	display:block;
	#width: 720px;
	#height: 390px;		
	padding-top:0em;
}

.targetSettingPageStyle .systemButtonTable
{
	position: relative;
	right: 8em;
	bottom: 0em;
}

.tableHeaderProgrammeSetting
{
	background-image: url(../mi-vitality-images/background-programme-header.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	height: 10px;
}
.tableRowProgrammeSetting
{
	background-image: url(../mi-vitality-images/background-programme-row.jpg);
	background-position: top left;
	background-repeat: repeat-y;
	padding: 5px 10px 10px 10px;
}
.tableFooterProgrammeSetting
{
	background-image: url(../mi-vitality-images/background-programme-footer.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	height: 20px;
}

.programmeBoxStyle
{
	border: solid 1px #97CD17;
	margin: 2px 2px 2px 2px;
	padding: 2px 4px 2px 4px;
	width: 485px;
	background-color: #FFFFFF;
}

.programmeBoxStyle .autoPadDiv
{
	width: 50px;
	#width: 0px;
}

.programmeBoxStyle .autoPadDiv .linkTellMeMore
{
	border: none 0px transparent;
}

.programmeTitleStyle
{
	font-size:medium ; 
	font-weight:bolder;
	border: none;
	margin: 0px 0px 0px 0px;
	width: 350px;
	color: #97CD17;
	padding-left: 5px;
}

.programmeToolsStyle
{
	font-size:small ; 
	font-weight:normal;
}

.programmeRecommendsStyle
{
	background-image: url(../mi-vitality-images/recommended-programme.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	height: 70px;
	width: 170px;

}

.profileErrorsPanel
{
	color: Red;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;

}

/* Centering for activity rater table */
.tableItemCenter
{
	text-align: center;
}

.textBold
{
	font-weight: bold;
}

.noLineBreak
{
	white-space: nowrap;
}
.trophyText
{
	position:relative;
	top: -15px;
	#top: 0px;
	width: 430px;
	height: auto;
	left: 20px;
}

/* 	===================================================================================================
												Alert Styles
===================================================================================================  */

.modalBackground
{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2400;
}

.alertHeader
{
    clear: both;
    font-weight: bold;
    height: 40px;
}

.alertItemPanel
{
    border-style: dashed;
    border-width: 0px 0px 1px 0px;
    clear: both;
}

.alertMessagePanel
{
    float: left;
    width: 250px;
    padding: 10px 0px;
}

.alertButtonPanel
{
    float: right;
    margin: 10px 0px 0px 0px;
}

.alertSubject
{
}

.alertSender
{
    float: right;
    font-size: 11px;
    color:#A2A2A2;
}

.alertDate
{
    color:#A2A2A2;
    font-size:11px;
    float:right;
    padding-left: 5px;
}

.alertExpandLink
{
    border-bottom: 1px dashed #545456;
    color: #545456;
    font-size: 11px;
    text-decoration: none;
    margin: 0px 10px 0px 10px;
}

.alertExpandLink:hover
{
    border-bottom:0px;
}

.alertMessageTextPanel
{
    float:none;
    clear:both;
    font-size:11px;
}

.alertTickImage
{
    margin: 0px 30px 0px 0px;
}

.messageArchiveLinkPanel
{
    margin: 100px 0px 0px 20px;
    #margin: 15px 0px 0px 20px;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;    
}

.messageArchiveLinkPanel a
{
    color: #545456;
    text-decoration: none;
    display: block;
    float: left;
}

.messageArchiveLinkPanel a:hover
{
    color:#999999;
}

.messageArchiveLinkPanel a img
{
    padding-right: 10px;
}


.messageArchiveLinkPanel a span
{
    line-height: 20px;
}

.labelInput
{
    width:0px;
}

.linkChangeUnits
{
    width:70px;
   
}

.handCursor
{
    cursor: pointer;
}