﻿/*
	This stylesheet should contain only general re-usable styles which affect the entire site.
	Page or Control specific styles should be placed in their own stylesheets.

	Colour Reference
	=======================================
	Normal Text:					#696969
	Normal Background:				#FFF
	Light Text:						#AFAFAF
	Light Background:				#F6F6F6
	Body Background:				#D5E1F1
	Frameset Border:				#E0CCD8
	Highlight Background:			#E0CCD8
	Header Text (no background):	#7F0B6E
	Header Background:				#ADCFE6
	Menu Background:				#7A1F5E
	Link Text:						#005ECF
	Row Highlight					#FCE0A0
*/

html { color: #696969; }

body
{
	background: #f9faff;	
	margin: 0;
	padding: 0;
}

dd
{
    margin-bottom:15px;
    margin-top:10px;
    margin-left:30px;
}

dt
{
    font-weight:bold;
    color:#7A1F5E;
}

body, p, div, span, table, tr, td, body, input, textarea, select
{
	color: inherit;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
}

/* page layout styling */
#page
{	
	margin:0 auto;
	width:1030px;
}

#content-outer
{	
	background:url('/App_Themes/Images/ds_repeat_990.png') repeat-y 0 0;	
	width:1030px;	
}

#content
{
	width:990px;
	margin:0 20px;
	background-color:#fff;	
}

#header
{
	padding:0;
}

	#header .upper,
	#header .top,
	#header .bottom
	{
		margin:0;
		padding:10px 20px;
	}			
		#header .upper > .right a,
		#header .upper > .right span
		{
			font-weight:bold;
			font-size:9pt;
		}

	#header .bottom
	{		
		overflow:hidden;	
		font-size:9pt;
		text-transform:uppercase;		
	}
	
	#header .test-company,	
	#header .account-details	
	{
		height:27px;
		line-height:27px;		
	}
	
	#header .account-details
	{
		width:290px;
		text-align:right;
	}
			
#logo
{	
	padding:15px 20px 15px;
}

#menu-bar-container
{
	height: 40px;
	background-color:#8e236b;
	display:block;
	margin:0;
}

#main
{
	padding:20px;
	min-height:300px;
}

#content-footer
{
	border-top:1px solid #ccc;
	margin:0 20px;
	padding:10px 0;
}

	#content-footer .links
	{
		display:inline-block;
		height:28px;
		line-height:28px;
		float:right;		
	}

		#content-footer .links a
		{
			font-size:8pt;	
			color:#999;		
			margin-left:30px;
		}
	
		#content-footer .links a:hover
		{
			color:#005ecf;
			text-decoration:none;
		}

	#content-footer .social-media
	{		  
		float:left;    
	}

		#content-footer .social-media > span > a
		{
			display:inline-block;
			width:28px;
			height:28px;	
			margin-right:10px;	
		}

#footer
{
	margin:5px 20px 40px;	
}

	#footer .copyright
	{
		text-align:center;
		font-size:7pt;
		color:#bbb;
	}	

#shadow-top, #shadow-bottom
{
	display:block;
	height:10px;
	width:1030px;
	margin:0 auto;
}

#shadow-bottom
{
	background:url("/App_Themes/Images/ds_bottom_990.png");
}

/* social media sprites */
.blog-icon
{
	background:url("/App_Themes/Images/socialmedia-sprites.png") no-repeat 0 0;
}

.blog-icon:hover
{
	background:url("/App_Themes/Images/socialmedia-sprites.png") no-repeat -28px 0;
}

.facebook-icon
{
	background:url("/App_Themes/Images/socialmedia-sprites.png") no-repeat 0 -28px;
}

.facebook-icon:hover
{
	background:url("/App_Themes/Images/socialmedia-sprites.png") no-repeat -28px -28px;
}

.twitter-icon
{
	background:url("/App_Themes/Images/socialmedia-sprites.png") no-repeat 0 -56px;
}

.twitter-icon:hover
{
	background:url("/App_Themes/Images/socialmedia-sprites.png") no-repeat -28px -56px;
}

.youtube-icon
{
	background:url("/App_Themes/Images/socialmedia-sprites.png") no-repeat 0 -84px;
}

.youtube-icon:hover
{
	background:url("/App_Themes/Images/socialmedia-sprites.png") no-repeat -28px -84px;
}


label { vertical-align: 1px; }

a, a:hover, a:active, a:visited
{
	border: none;
	color: #005ECF;
	outline: none;
	text-decoration: none;
}

a:hover { text-decoration: underline; }

a[onclick] { cursor:pointer; }

a.nonbold { font-weight:normal; }

h1
{
	background: url('/App_Themes/Images/header-background.png') repeat-x 0 0;
	color: #FFF;
	font-size: 11pt;
	font-weight: bold;
	height: 28px;
	line-height: 28px;
	margin: 0 0 10px 0;
	padding: 0 10px;
}

* + h1 { margin: 20px 0 10px 0; }

h1.tab
{
	display: inline-block;
	font-size: 10pt;
	margin: 20px 0 0 0;
	padding: 0 15px;
	width:auto;
	/* ie7 inline-block fix */
	zoom: 1;
	*display: inline;
}

h3.faq
{
    color:#7A1F5E;
}

h1.text
{
	background: none;
	color: #7F0B6E;
	padding: 0;
}

h2
{
	font-size: 1.0em;
	font-weight: bold;
	padding: 0;
	margin: 0 0 5px 0;
}

* + h2 { margin: 10px 0 5px 0; }

hr
{
	background-color: #E0CCD8;
	border: none;
	display: block;
	height: 1px;
	margin: 20px 0;
	overflow: hidden;
	padding: 0;
}

p
{
	margin: 5px 0;
	padding: 0;
}

p:first-child { margin: 0 0 5px 0; }
p:last-child { margin: 5px 0 0 0; }

br + br { display: none; } /* << if you're thinking of removing this, don't - fix your markup instead! */

em, strong
{
	color: #7A1F5E;
	font-style: normal;
	font-weight: normal;
}

strong { font-weight: bold !important;}

fieldset
{
	border: solid 1px #E0CCD8;
	display: block;
	margin: 10px 0;
	padding: 5px;
}

fieldset.inner
{
	border: none;
	clear: both;
	margin: 0;
	padding: 0;
}

fieldset legend
{
	color: #696969;
	font-weight: bold;
}

fieldset div.label
{
	clear: both;
	float: left;
	padding: 8px 5px 5px 5px;
	width: 305px;
}

fieldset div.labelinline
{
	clear: none;
	float: left;
	padding: 8px 5px 5px 5px;
	width: 405px;
}

fieldset div.fullblock
{
    display: block;
    float: left;
}

fieldset div.fullwidthbold
{
	clear: both;
	float: left;
	padding: 8px 5px 5px 5px;
	width: 100%;
	font-weight: bold;
}

fieldset div.warning
{
	clear: none;
	float: left;
	padding: 8px 5px 5px 5px;
	width: 390px !important;
}

fieldset div.popupwarning
{
	clear: none;
	float: left;
	padding: 8px 5px 5px 5px;
	width: 245px !important;
}

fieldset div.label.narrow { width: 100px;}

fieldset div.label.wide, fieldset div.field.wide { width: 275px; }
fieldset div.field.wide input { width: 245px !important; }
fieldset div.label.max, fieldset div.field.max { width: 585px; }

fieldset div.label.inline
{
	clear: none;
	width: auto;
}

fieldset div.field
{
	clear: none;
	float: left;
	padding: 8px 5px 5px 5px;
}

fieldset div.field_wrapper
{
	clear:both;	
}

table.small-text * { font-size: 8pt; }
table.tiny-text * { font-size: 7pt; }

table.wizard th, table.wizard td
{
	padding: 0;
}

table, table.wizard table
{
	border: none;
	border-collapse: collapse;
	width: 100%;
}


th, td, table.wizard table th, table.wizard table td
{
	border: none;
	font-weight: normal;
	padding: 5px;
	text-align: left;
	vertical-align: top;
}

table.wizard table.monetaryrightalign th
{    
    width:70%;
}

table.wizard table.monetaryrightalign td
{
    text-align:right;
    width:30%;
}

th, table.wizard table th
{
	font-weight: bold;
	width: 305px;
}


table.autosize th, table.wizard table.autosize th { width: auto; }

th[scope="col"], th[scope="column"], table.wizard table th[scope="col"], table.wizard table th[scope="column"]
{
	background: #E0CCD8; /*background: #ADCFE6;*/
	width: auto;
}

th.fullwidth { width: 100% !important; }

tr.highlight { background: #FCE0A0; }

table.gridview table { width: auto; }

div.calendar div.ajax__calendar_container { background: #FFF; border: solid 1px #ADCFE6 }
div.calendar * { font-family: tahoma,verdana,helvetica; font-size:11px; }
div.calendar td { padding: 0px !important; }

img, a img
{
	border-width: 0;
	border-style: none;
	display: inline-block;
	margin: 0;
	padding: 0;
}

ul.horizontal
{
	margin: 0;
	padding: 0;
	white-space: nowrap;
}

ul.horizontal li { display: inline; }

ul.horizontal li a
{
	border-right: solid 1px #AFAFAF;
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0 0.8em !important;
	text-align: center;
}

div#header-links li a, div#footer-links li a
{
	color: #AFAFAF;
	font-size: 7pt;
	text-decoration: none;
}

div#header-links a:hover, div#footer-links a:hover
{
	text-decoration: underline;
}

ul.horizontal li.first a
{
	border-left: none !important;
	padding-left: 0 !important;
}

ul.horizontal li.last a
{
	border-right: none !important;
	padding-right: 0 !important;
}

ul.links
{
	list-style-type: none;
	margin: 0;
	padding: 0 0 0 20px;
}

ul.links li
{
	padding: 10px 0;
}

ul.links a
{
	background: transparent url('/App_Themes/Images/arrow-button.png') no-repeat 0 0;
	color: #7F0B6E;
	display: inline-block;
	font-weight: bold;
	padding: 0 0 0 20px;
}

input[type="image"] { display: inline-block; vertical-align: top; }
input[type="radio"] { margin: 0 3px 0 0; }
input[type="radio"] + label { margin: 0 10px 0 0; position: relative; top: -1px; }

.validation
{
	background: #FDFEDD;
	border: solid 3px #DC2000;
	color: #DC2000;
	font-weight: bold;
	margin: 0 0 10px 0;
	padding: 10px;
}

.validation ul
{
	font-size: 9pt;
	font-weight: normal;
	margin-bottom: 0;
}

.validation ul li { padding: 2px 0; }

span.marker { color: #F00; font-weight: bold; }
span.marker:after { content: "*"; }

div.tab, div.tab-inverted
{
	border: solid 1px #E0CCD8;
	margin: 0 0 20px 0;
	padding: 10px;
}

div.tab
{
	background: #F5F5F5;	
}

div.tab-inverted
{
	background: #FCFCFC;
}

div.tab-header
{
	float:left;
}

div.tab-link
{
	float:right;
	margin:25px 0 5px 0;	
}

div.tab fieldset { border: none; margin: 0; padding: 0; }
div.tab fieldset + fieldset { margin: 10px 0 0 0; }
div.tab fieldset legend { display: none; }

div.tab div.box { margin: 0; }
div.tab div.box + div.box { margin: 10px 0 0 0; }

div.tab table tr { border: none; }
div.tab table.lines tr { border-bottom: solid 1px #ADCFE6; }
div.tab table.lines tr:last-child { border-bottom: none; }

div.tab span { display: inline-block; } /* fixes IE7 "disappearing-text" bug - place affected text within a <span> to prevent it disappearing */

div.highlight
{
	background: #E0CCD8;
	padding: 10px;
}

div.panel
{
	background: #FFF url('/App_Themes/Images/panel-header-wide.png') no-repeat 0 0;
	border: none;
	margin: 20px 0;
}

div.panel div.panel-content
{
	border: solid 1px #7A1F5E;	
	padding: 10px;
}

div.panel h1
{
	background: none;
	border: none;
	color: #FFF;
	font-size: 11pt;
	font-weight: bold;
	height: 35px;
	line-height: 35px;
	margin: 0;
	padding: 0 0 0 10px;
}

div.panel a { color: #0075BD; }

div.panel th, div.panel td
{
	font-weight: bold;
	vertical-align: top;
}

div.panel td { color: #7A1F5E; }

div.box > span.legend:first-child
{
	background: transparent url('/App_Themes/Images/white-background.png') repeat 0 0;
	font-weight: bold;
	left: -5px;
	padding: 0 2px;
	position: relative;
	top: -18px;
}

div.tab div.box > span.legend:first-child { background: transparent url('/App_Themes/Images/grey-background.png') repeat 0 0; }

div.box > span.legend:first-child + * { margin-top: -8px; }

div.wizard-footer, div.navigation { height: 22px; margin: 20px 0 0 0; }
div.wizard-footer .left input, div.navigation .left input { margin: 0 10px 0 0; }
div.wizard-footer .right input, div.navigation .right input { margin: 0 0 0 10px; }

div.two-col { width: 460px; }
div.three-col { width: 300px; }
div.four-col { width: 220px; }

div.tab div.two-col { width: 455px; }
div.tab div.three-col { width: 290px; }
div.tab div.four-col { width: 205px; }

div.column
{
	display: inline; /* fixes IE6 double-margin bug */
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
}

div.leftpadded
{
    padding-left: 150px;
}

div.fullborder
{
    border: solid 1px #E0CCD8;
	display: block;
	margin: 10px 0;
	padding: 5px;
}

div.gridfooter
{
	 border-top: double 4px #E0CCD8;
	 font-weight: bold;
	 margin-top: 5px;
	 padding-top: 2px;
	 text-align: right;
}

div.gridfooter.totallabel
{
	border-top: none;
	padding-top: 6px;
	text-align: left;
}

div.monetarypadding
{
    padding-right: 10px;
}

.hiddencol
{
    display:none;
}

span.hiddenValidator
{
    display: none;
    visibility: hidden;
}

input.xx-small { width: 30px; }
input.x-small { width: 60px; }
input.small { width: 90px; }
input.medium { width: 120px; }
input.large { width: 150px; }
input.x-large { width: 180px; }
input.xx-large { width: 210px; }

.help { font-size: 8pt; }
.hyperlink { cursor: pointer; }
.disabledhyperlink {  color: inherit !important; text-decoration: none !important; }

.visible { visibility: visible; display: block; }
.hidden { visibility: hidden; display: none; }
.disabled { cursor: default; }

.left { float: left !important;}
.right { float: right !important;}

.clear
{
	clear: both;
	font-size: 1pt;
	height: 0;
	line-height: 0;
	margin: 0;
	overflow: hidden;
	padding: 0;
}

.box
{
	border: solid 1px #E0CCD8;
	margin: 10px 0;
	padding: 10px;
}

.text-left, .text-left * { text-align: left !important; }
.text-center, .text-center * { text-align: center !important; }
.text-right, .text-right * { text-align: right !important; }

.text-help-footer, .text-center * { text-align: center !important; margin-bottom: 15px;} 

.red { color: #F33; }
.blue { color: #33F; }

.dimmed { color: #BBB; }

.mt, .mtop { margin-top: 20px; }
.mb, .mbottom { margin-bottom: 20px; }
.ml, .mleft { margin-left: 20px; }
.mr, .mright { margin-right: 20px; }

.mt0 { margin-top: 0; }
.mb0 { margin-bottom: 0; }
.ml0 { margin-left: 0; }
.mr0 { margin-right: 0; }

.mt5 { margin-top: 5px; }
.mb5 { margin-bottom: 5px; }
.ml5 { margin-left: 5px; }
.mr5 { margin-right: 5px; }

.mt10 { margin-top: 10px; }
.mb10 { margin-bottom: 10px; }
.ml10 { margin-left: 10px; }
.mr10 { margin-right: 10px; }

.mt15 { margin-top: 15px; }
.mb15 { margin-bottom: 15px; }
.ml15 { margin-left: 15px; }
.mr15 { margin-right: 15px; }

.flat
{
	border: 1px solid #C0C0C0;
	height:1.5em;
	line-height:1.5em; /* IE Fix */
}

/*Remember Me*/
.AspNet-Login-RememberMePanel 
{
    padding: 10px 0 0 0;
    vertical-align: middle;
}

.AspNet-Login-RememberMePanel a
{
    padding: 3px 0 0 0;
}

.AspNet-Login-RememberMePanel em
{
    padding: 0 0 3px 0;    
}

.AspNet-Login-RememberMePanel input
{
    margin-left: 0px;
}

.AspNet-Login-RememberMePanel img
{
    vertical-align: bottom;
}

/*Tooltip*/
.tooltip {
	color: #000000; outline: none;
	cursor: help; text-decoration: none;
	position: relative;
}
.tooltip span {
	margin-left: -999em;	
	position: absolute;
	color: #000;
	text-decoration: none;
}
.tooltip:hover span {
	border-radius: 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; 
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
	position: absolute; left: 1em; top: 2em; z-index: 9999;
	margin-left: 0; width: 250px;
}
/*.tooltip:hover img {
	border: 0; margin: -10px 0 0 -55px;
	float: left; position: absolute;
}*/
.tooltip:hover em {
	font-size: 1.2em; font-weight: bold;
	display: block; padding: 0.2em 0 0.6em 0;
}
.helpbubble { padding: 0.8em 1em; background: #FFFFAA; border: 1px solid #FFAD33;}
* html a:hover { background: transparent; }

.screen-reader
{
	margin-left:-9999999px;
	clip:rect(1px, 1px, 1px, 1px);
    position:absolute !important;	

}

/* Disabled Inputs */
select:disabled,
textarea:disabled,
input[type=text]:disabled,
input[type=password]:disabled
{
	background-color:#EEE;
	border:1px solid #CCC;
	color:#999;
}