body { font-family: Arial, Verdana; }

/*** REGISTRATION STEPS DETAILS **/
div.stepHeader
{
	font-weight: bold;
	line-height: 32px;
}

div.stepHeader img
{
	vertical-align: middle;
}

div.stepHeader span
{	
	display: inline-block;
	padding-left: 8px;
	padding-right: 4px;
}

div.stepHeader span.pageCount
{
	font-weight: normal;
}

div.stepHeader span.red
{
	color: Red;
}

div.stepHeader span.selected 
{ 
	background-color: #ff584f; 
	color: #ffffff;
	vertical-align: middle;
	
}

div.stepHeader img { border: 0 !important }
/***** THE STANDARD STYLE FOR ERROR MESSAGES *****/
.errorText
{
	font-size: 1.0em;	
	color: red;
}

/***** Color Formatting *****/ 
.colorRed
{
	color: Red;
	
}

/***** PAGE CONTAINERS *****/
.smallPageContainer, .largePageContainer, .htmlContainer, .smallFormContainer, .largeFormContainer
{
	clear: both;
	padding-right: 0px;
	margin-top: 10px;
	padding-left: 0px;
	padding-bottom: 5px;
	padding-top: 0px;
}

.smallPageContainer, .smallFormContainer
{
	width: 305px;
}

.largePageContainer, .largeFormContainer
{
	width: 510px;
}

/* Use these for the forms with the grey backgrounds */
.smallFormContainer, .largeFormContainer
{
	background-color: #F9F8F4;
	border-style:solid;
	border-color: #C1C1BD;
	border-width:1px;
}

.htmlContainer
{	
	width: 400px
}


/***** TITLE BARS FOR THE FORMS *****/  
.formHeading
{
	background-color:#E7E7DD;
	font-weight: bold;
	padding-left:5px;
	padding-bottom:2px;	
	margin-bottom:10px;
}

/***** ROW AND SPAN SETTINGS FOR ALIGNMENT *****/

/* This div defines a new row */
div.row {
	clear: both;
	padding-top: 4px;
	width: 100%;
	font-size: 1.0em;	
}

/* A right aligned short label as default */
div.row span.label, span.labelMed, span.noLabel {
	float: left;
	width: 130px;
	text-align: right;
	color: #AFA8A0;
	font-weight: bold;
}

/* A right aligned med length label */
div.row span.labelMed {
	width: 200px;	
}

span.formLabel
{
	width: 150px;
	margin-left: 72px;
}

span.noLabel
{
	margin-left: 135px;
	text-align:left;
	width: 300px;
}

span.longFormButton, span.smallFormButton, span.challengeFormButton {
	margin-right: 0px;
	float:right;
	width:100px;
}

div.leftFormButton 
{
	float: left; 
	margin-left: 25px;
}

span.longFormButton{
	margin-right: 55px;
}

span.challengeFormButton 
{
	margin-right: -14px;
}

/* Full length label for displaying on small forms */
span.longFullLabel
{
	float: left;
	width: 450px;
	text-align: left;
	color: #AFA8A0;
	font-weight:bold;
	margin-left:30px;
}

span.shortFullLabel
{
	float: left;
	width: 250px;
	text-align: left;
	color: #AFA8A0;
	font-weight:bold;
	margin-left:30px;
}

/* Full length label for displaying on small forms */
span.radioButtonQuestionaire
{
	float: left;
	width: 480px;
	text-align: left;
	color: #AFA8A0;
	font-weight:bold;
	margin-left:10px;
}

/* base label, very small standard size, left justified */ 
span.leftLabel, span.leftLabelSmall, span.leftLabelLong {
	float: left;
	width: 100px;
	text-align: left;
}

/***** THESE TWO LABELS ARE USED FOR THE FULL LENGTH OF THE 2 FORMS, LEFT JUSTIFIED *****/

/* Use for labels with full width of form where form has right hand side banner, set margin on top  */
span.leftLabelSmall {
	width: 300px;
	margin-top: 0.5em;	
}

/* Use for labels with full width of form, set margin on top  */
span.leftLabelLong {
	width: 505px;
	margin-top: 0.5em;
}
 
/* Base length for a small form element, left justified */
div.row span.formElement, span.formSmall, span.formLong, span.rewardButton {
	float: left;
	width: 100px;
	text-align: left;
	margin-left:5px;
}

/* Length for a small form used inside a small container */
div.row span.formSmall {     
	width: 165px;
}

/* Length for a long form */   
div.row span.formLong {
	width: 360px;
}

span.rewardButton 
{
	background: url("../../../../images/reward_token_blank.gif");
	background-repeat: no-repeat;
	color: White;
	font-size: 1.4em;
	font-weight:bold;
	width:71px;
	height:50px;
	padding: 0.4em 0;
}

span.buttonText1Figure, span.buttonText2Figure, span.buttonText3Figure
{
	margin-left: 1.1em;
	vertical-align:bottom;
}

span.buttonText2Figure
{
	margin-left: 0.8em;
}


span.buttonText3Figure
{
	margin-left: 0.6em;
}

/***** DEFINE BANNERS WITH BACKGROUND IMAGES *****/
.interactHeader, .eventsHeader, .interactHeaderSmall, .challengesHeaderSmall
{
	width: 505px;
	font-size: 1.0em;
	font-weight: bold;
	float:left;
	text-align:left;
	padding: 0 0 0 0.3em;	
	margin: 0 0 10 0;
}

.interactHeader, .interactHeaderSmall 
{

	background-image: url("../../../../images/background-heading-interact.gif");
	color: White;
}

.interactHeaderSmall {
	width: 300px;
}

.eventsHeader
{
	width: 505px;
	background-image: url("../../../../images/background-heading-events.gif");
	color: Black;
}

.challengesHeaderSmall 
{
	
	width: 300px;
	background: url("../../../../images/background-heading-challenges.gif");
	color: White;
}

/***** GRID SETTINGS *****/
.genericGrid {
	background-color:white;
	font-family:Arial, Verdana;
	font-size:10pt;
	border-color:White;
	border-style:None;	
	border-width:1px;
}


/***** POLL SPECIFIC *****/
span.pollBarGraph, span.pollResult {
	float: left;
	width: 100px;
	text-align: left;
}

span.pollBarGraph {
	margin-left: 5px;
}

div.row span.pollResult {
	width: 30px;
	text-align: right;
} 

/***** GENERIC ITEMS *****/
.smallLeftTopMargin
{
	margin-left: 10px;
	margin-top: 10px;
	margin-right: 5px;
	font-weight: bold;
	color: #AFA8A0;
}

.labelHeader {
	font-weight:bold;
	color: #58ACD1;
}

/***** ALIGNMENT OF RADIOBUTTONS *****/ 
.radioButton {
    display: block;
    margin-left: 5px;
    margin-top: -0.1em;
} 

/***** TEXT BOX SETTINGS *****/

/* Common Fonts for Textboxes */
.smallTextBox, .medTextBox, .challTextBox, .largeTextBox, .longFullTextBox, .multiTextBox, .uploadBox, .largeMultiTextBox {
	font-family:Arial, Verdana;
	border: 1px solid #C1C1BD;
}

/* Textbox Lengths */
.smallTextBox {
	width: 100px;
}

.uploadBox
{
	margin-left: 135px;
}

.medTextBox {
	width:155px;
}

.challTextBox
{
	width: 280px;
}

.largeTextBox {	                     
	width:300px;
}

.longFullTextBox 
{
	width: 410px;
}

.multiTextBox 
{
	width: 155px;
	overflow: auto;
}

.largeMultiTextBox 
{
	width: 450px;
	overflow: auto;
}

/***** SEARCH SETTINGS *****/ 
.backNextLinks
{
	float: right;
}
.searchLinks a
{
	color: black;
	padding-right: 0.25em;	
	font-weight: bold;
}

.searchLinks a.selectedLink 
{
	color: red;
	text-decoration: none;
}

.resultLink a
{
	color: Red;
	font-weight: bold;
	text-decoration: none;
}
.resultLink a:hover
{
	text-decoration: underline;
}

#resultCount
{
	font-weight: bold;
	padding-bottom: 1em;
}

#keyword
{
	padding-bottom: 1em;
}

#pager
{
	padding-bottom: 3em;
}

#searchResults
{
	clear: both;
	padding-bottom: 1em;
}