/*
PartsTrader CSS - 10/06/2008 a

Document structure:

- Reset styles

- Default styles 
	- Body  
	- Typography
	- Links
	- Tables (Now decorated, needs update / reshuffle)
	- Form elements
	- Other HTML elements, ul, li

- Page chrome structure & styling
	- Wrapper
	- Header
		-tools			
	- Nav
	- Sub-nav
	- Footer

- Page content styles
	- stepCounter (wizard progress indicator)
	- Error & Success message boxes
	- Calendar Styles
		
-Page content structure
	- Content wrapper
	- Main panel
		-section
		-key
		-box
		-form
	- taskpanel headings & buttons 
	- half panels for task pages 	
    - Buttons at the bottom of every wizard step 
	- Secondary content panel styles

- Helper classes
	- element size classes
	- clearfix
	
- Styles added in for sake of external components
 - Modal popup
 - CMS required styles
 - Date & Time picker Styles
	
As yet unsorted categories:
- Parts list boxes


*/

/**** Headings ****/
/** Sub-headings **/
/* Comments */


/**** Reset styles *****/

html, body, form {
	height: 100%;
}

body, ul, ol, dl, li, dt, dd, h1, h2, h3, h4, h5, p, blockquote, form, fieldset {
	margin: 0;
	padding: 0;
}

img, fieldset {
	border: 0;	
}


/***** Default styles *****/

body 
{    
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.626em;
	color: #000;
}


/** Default styles - Typography **/

h1, h2, h3, h4, h5 {
	color: #009FE3;
	font-weight: bold;
	clear: left;
}


h1{
	font-size: 1.7em;
	padding: 7px 12px 5px 12px;	
}

h1.short {
	float: left;
}

h1.long
{
    float:left;
    width:50%    
}

h1.headingExpanded
{
	float:left;
	width:700px;	
}

h1.headingCollapsed
{
	float:left;
	width:480px;	
}

h2 {
	font-size: 1.4em;
	padding: 7px 12px 10px 12px;
}

h2.short {
	float: left;

}

h2.long {
	width:50%
}

h3 {
	font-size: 1.2em;
	padding: 7px 0 0px 12px;
}

.table h4 {
	font-size: 1.1em;	
	padding: 0px 50px 0px 6px;
}

.small h4
{	
	/*The only thing this is used for is the links to filter feedback comment categories*/
	padding-right:10px;
}

h4 
{
    float:left; 
	font-size: 1.1em;
}


h5 {
	color: #666;
	font-size: 1.2em;
	padding: 7px 0 0px 12px;
}

.sectionDescription 
{
    color: #666;    
	font-size: 1.2em;
	clear: left;
	padding: 7px 0 7px 12px;
	background: #E9E9E9;
	/* 
    background: #E9E9E9;
    */
	
}

.measureTitle
{
    font-size: 1.2em;
    
	clear: left;
	padding: 7px 0 7px 12px;	
	background: #009DE0;
	color: #FFF;	
}

p {
	color: #575757;
	font-size: 1.1em;
	clear: left;
	padding: 0 6px;
}


/** Default styles - Links **/

a {
	color: #009FE3;
}


a:hover {
	text-decoration: none;
}

a:visited {
	color: #009FE3;
}

a.highlight
{
	color: #019FE0;
}

.tableKey
{   
    padding-left:6px;
} 

/* START - Point of Impact table styles*/

table.pointOfImpact
{    
    font-size: 0.9em;
    border-spacing:0px;
    background-color:transparent;               
    /*color: #009FE3;*/
    /*font-weight:bold;*/        
    /*background-image:url(../../Images/Background/bg_PointOfImpactCar.jpg);*/
}

table.pointOfImpact td
{
    background-color:transparent;            
    /*border:1px solid Red;*/
    padding: 0px 0px 0px 0px;  
    margin: 0px 0px 0px 0px;        
}

table.pointOfImpact tr
{
    background-color:transparent;                
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;        
}

table.pointOfImpact span
{    
    cursor:default;
}

table.pointOfImpact input
{
    border:0px;    
    /*border-color:#009FE3;*/
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;        
    vertical-align:middle;        
    /*background-color: #009FE3;*/
}


/* END - Point of Impact table styles*/

/** Default styles - table.decorated **/

table.decorated {
	width: 100%;
	clear: left;
	font-size: 1em;
	border-collapse:separate;
	border-spacing: 1px;	
	table-layout:auto;
	overflow:hidden;
	margin-bottom: 4px;
	background: #E1E1E1;	
}

table.feedbackTable
{
	width: 100%;
	clear: left;
	color:#666;
	font-size: 1.2em;		
	overflow: hidden;
	background-color: #E9E9E9;		
	
}

table.feedbackTable td
{	
    padding:5px 5px 5px 10px;
    vertical-align:top;
    text-align:left;
}

table.feedbackTable .title
{		
	font-size: 1.1em;	
	font-weight:bold;
	color:#009FE3;

}

table.feedbackTable .radio
{
    padding-left:0px;            
}

table.feedbackTable .radio label
{          
    /*this is used to centre the radio button text on the provide feedback and the accurracy feedback view*/
    margin-top:-2px;    
}

table.decorated td, table.decorated th {
	font-size: 1.2em;
	vertical-align: top;
}

table.decorated tr {
	background: #FFF;
}

table.decorated tr.even  { /* colour alternate rows */
	background: #E9E9E9;
}

table.decorated tr.summaryInfo{ /* colour summary info/totals row*/
	background: #D9D9D9;
}

table.decorated tr.active { /*colour selected rows */
	background: #97BF0F; /* /#009DE0;/*#E6F2FF*/
	color: #FFF;	
}

table.decorated tr.active a {
	color: #FFF;
}

table.decorated td {
	padding: 6px;	
}

table.decorated th {
	background: url(../../Images/Background/bg-th-mid.jpg) repeat-x bottom #88898B;
	color: #FFF;
	font-weight: bold;
	text-align: left;
	padding: 6px 6px 8px 6px;
	line-height: 1.1em;
}

table.decorated th a {
	color: #FFF;
}

table.decorated th.active {
	background: url(../../Images/Background/bg-th-active.jpg) repeat-x bottom #38383A;
}

table.decorated th.activeBlue {
	background: #02ACE7;
}

table.decorated th.first {
	background: url(../../Images/Background/bg-th-first.jpg) repeat-x bottom #646466;
}

table.decorated th.sortDesc {
	background: url(../../Images/Background/bg-th-sortDesc.jpg) no-repeat bottom right #88898B;
}

table.decorated th.sortAsc {
	background: url(../../Images/Background/bg-th-sortAsc.jpg) no-repeat bottom right #88898B;
}

table.decorated th.financial, table.decorated th.financial span
{
    text-align:right;
}

/**BOSKO NEW STYLES FOR NEW TABLES**/

table.decorated td.darkGray, table.decorated tr.darkGray
{
	background: #B5B5B5;
	color:#737373;		
}

table.decorated td.darkGray a, table.decorated tr.darkGray span.sponsor, table.decorated tr.darkGray a
{
	color:#737373;	
}

table.decorated tr.darkGray a.action, table.decorated tr.darkGray a.firstAction
{
	color:White;
	font-weight:bold;
	padding: 0px 5px 0px 5px;
}

table.decorated tr.darkGray a.firstAction
{
	padding-left:32px;
}

/**BOSKO STUFF END HERE**/

/*Styles for table inside popup*/


/*end here*/


/*carjam styles*/
div.container
{
    margin-right:12px; 
    width:510px;   
}

table.smallPopupTable
{
    font-size:xx-small; 
    color:#575757;       
}



span.NoPadNoMar
{
	padding:0px 0px 0px 0px; 
	margin:0px 0px 0px 0px;
}
table.smallPopupTable span
{
	padding-top:13px; 	
	margin:10px 10px 0px 10px;   			
}

h2.CarJam
{
   width:240px;
   display:block;
   float:left; 
   clear:left;   
}
   
img.CarJamLogo
{
    /*width:80px;*/
    display:block; 
    float:right; 
    clear:right;
}

/*Styles for two column drop down list*/

div.TwoColumnDropDown
{
    background-color:White;
    border:1px solid Black; 
    font-size:1.1em;    	
}
    
table.TwoColumnDropDownList
{
	margin:-1px 1px 1px 1px;
}

table.TwoColumnDropDownList td
{
    padding: 1px 5px 1px 5px;    	
    vertical-align:top;
    cursor:default;
    border-width:0px;
    border-style:none; 	
}

table.TwoColumnDropDownList tr.selected
{
    background-color: #0A246A;
    color:White;   	
}

table.TwoColumnDropDownList tr.notSelected
{
    background-color: White;
    color:#666;
}

table.TwoColumnDropDownList tr.notSelectedGray
{
    background: #E9E9E9;
    color:#666;
}
    
table.TwoColumnDropDownList td.title
{
    font-weight:bold;    	
}  

/*End of styles for two column drop down list*/

/**Message panel styles**/

div.messagePanel
{
    border-width:1px;
    border-bottom-width:0px;    
    border-style:solid;
    border-color:#009FF4;          
    background-color:#D9F2FF;    
    display:block;
    clear:left;
    float:left;
    color:Black;
    width:100%;
    /*margin:3px 0px 3px 0px;    */
    font-size:1.2em;    
}
div.messagePanelLast
{
    border-bottom-width:1px;    
    border-bottom-style:solid;
    border-bottom-color:#009FF4;   
    margin-bottom:15px;    
}

div.messagePanel span, div.messagePanel a
{
    float:left;    
    display:block;    
    position:relative;
    margin-top:8px;
   
}

input.closeButton
{
    float:right;
    clear:right;
    display:block;
    margin-right:3px;
    margin-top:3px;
    width:7px;
    height:7px;
}

/**End of message panel styles**/


/** Default styles - Form elements **/

input {
 	color: #666;
	border: 1px solid #919294;
	font-size: 1.1em;
}


input[type=image] {
	border: none;  
}

input[type=text], input[type=password] { /* we only want this on text fields, ie6 won't see it, but that beats adding exceptions to ALL buttons etc */
	background: #FFF;
	/*url(../../Images/Background/bg-input-txt.gif) repeat-x bottom;*/ 
}


textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.1em;
 	color: #666;
	border: 1px solid #919294;
	padding: 3px 1px;
	background: #FFF;
	/*url(../../Images/Background/bg-input-txt.gif) repeat-x bottom;*/ 
}

select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.1em;
 	color: #666;
	border: 1px solid #919294;
	padding: 2px 0px 2px 3px;
	background: #FFF;
	/*url(../../Images/Background/bg-input-txt.gif) repeat-x bottom;*/ 
	
}




/** Default styles - Other HTML elements **/
ul {
	/*list-style: none;*/
	margin-left: 15px;
	list-style-position: inside;
	list-style: square;
	padding: 0pt 8px 7px 4px;
}:first-child + html ul {
	margin-left: 0px;
}

ol {
	list-style-position: inside;
	margin-left: 6px;
	}

li {
	color:#666;
}

li li { /* reset size to prevent percentage based growth cascading down */
	font-size: 1em;
	padding: 0;
}




/**** Page chrome structure & styling *****/

#wrapper, #popupWrapper{

    position: relative;
    width:  1000px;
	min-height: 100%;
}* html body #wrapper { /* fix height for ie6 */
	height: 100%;
}:first-child+html { /* fix width: auto behaviour in ie7 */
	width: 99.95%;	
}

#popupWrapper
{
    width: 780px;
}


	#header {
		width: 100%;
	}	
		
		#logo {
			float: left;
		}
		
		#advert {
			display: block;
			float: right;
			height: 60px;
			width: 234px;
			background: #C5C6C8;
			margin: 7px 5px; 
		}		
		
		#tools {
			float: right;
			list-style: none;
			padding: 7px 5px;
			
		}		
		
			#tools li {
				display: block;
				float: left;
				font-size: 0.9em;
				color: #666;
				padding: 7px 5px;
				border-right: 1px solid #666;
			}
			
			#tools li.last {
				border: none;
			}
			
			#tools a {
				color: #666;
				text-decoration: none;
			}
			
			#tools a:hover, #tools:active {
				text-decoration: underline;
			}
		
	#nav {
		width: 100%;
		background: url(../../Images/Background/bg-menu.jpg) repeat-x #868789;
		min-height: 34px;
	}* html body #nav { /* fix height for ie6 */
		height: 34px;
	}	
	
		#nav ul {
			float: left;
			background: url(../../Images/Background/bg-menu-ul.jpg) no-repeat;
			list-style: none;
			padding: 0 0 0 24px; 
			margin: 0;	
		}
		
			#nav ul li {
				display: block;
				float: left;
				text-align: center;
				height: 34px;
				width: 100px;
				background: url(../../Images/Background/bg-menu-li.jpg) no-repeat #02ACE7;
				color: #FFF;
				font-size: 1.4em;
				font-weight: bold;
			}
			
			#nav ul li.long, #nav ul li a.long { /* for menu items whose title is too long to fit the regular block ie "My Partstrader" */
				width: 140px;
				background: url(../../Images/Background/bg-menu-li-long.jpg) no-repeat #02ACE7;
			}
			
			#nav ul li.active, #nav ul li a:hover  {    	
				background: url(../../Images/Background/bg-menu-li-hover.jpg) no-repeat #78787A;    
				height:35px;
			}

			#nav ul li a:hover  {    	
			    height:27px;
			}						
			
			#nav ul li.active a.long, #nav ul li a.long:hover, #nav ul li.active.long {	
				background: url(../../Images/Background/bg-menu-li-hover-long.jpg) no-repeat #78787A;
				width:140px;
			}
			
			#nav ul a 
			{
				display: block;
				color: #FFF;
				padding: 8px 0 0px 0;
				text-decoration: none;
			}
			
		#search {
			background: none;
			float: right;
			width: 390px;
			margin: 1px 0 0 0;
			padding: 3px 0 0 0;
		}
		
			#search fieldset, search a {
				display: block;
				float: left;
				clear: none;
			}
			
			#search a {
				background: url(../../Images/Background/bg-search-button.gif) no-repeat;
				color: #FFF;
				padding: 3px 10px 7px 25px;
			}
			
			#search input {
				width: 160px;
				border: 1px solid #6F7072;
				margin: 0 8px 0 0;
				padding: 1px 5px;
				font-size: 0.9em;
			}
			
	#sub-nav {
		clear: both;
		width: 100%;
		background: #868789;		
		min-height: 25px; _height: 25px;
		
	}
	
		#sub-nav #login {
			display: block;
			float: left;
			padding: 3px 0 3px 44px;
		}
		
		
		#sub-nav #lnkLogin {
			border: 0;
			text-decoration: none;
			cursor:hand;
			cursor: pointer;
			padding-right:8px;		
		}
		
		.standardLink
		{
		    text-decoration: underline;
			cursor:hand;
			cursor: pointer;
		}
		
		.clickableObject
		{
		    cursor:hand;
		    cursor: pointer;
		}
		

		#sub-nav #lnkLogin img{
			vertical-align:bottom;
		}			        	
	 

		#sub-nav label {
			color: #FFF;
			padding: 0 8px  0 8px;
		}
		
		#sub-nav input {
			border: 1px solid #6C6C6E;
			font-size: 1em;
			line-height: 1.2em;
			margin: 0 8px 0 0;
			
		}
		
		#sub-nav a {
			color: #FFF;
			padding: 7px 0 0 0;
		}
		
		#sub-nav ul {		    
			padding: 4px 0 0 40px;
            list-style: none;

		}
		
		#sub-nav li {
			float: left;
			color: #FFF;
			border-right: 1px solid #FFF;
			padding: 0 16px 8px 16px;
		}
	
			#sub-nav li.active {				
				background: url(../../Images/Background/bg-subnav-li-active.jpg) no-repeat 50% 17px;		    
				
		    }
			
			#sub-nav li.last {
				border-right: none;
			}
	
			#sub-nav li a {
				padding: 0;
			}
		
		
	#footer 
	{	    
	    width: 1000px;
		display: block;
		clear:both;
		position: relative;
		background: url(../../Images/Background/bg-footer.jpg) repeat-x #5F5F5F;
		margin-top: -30px;
		min-height: 30px;	
		/*padding: 0 5px 0 24px;*/
	}* html body #footer { /* fix for ie6 */
		height: 30px;	
	}
	
	
	
		#footer a {
			color: #FFF;
			font-weight: bold;
		}
	
			#footer a:hover {
				text-decoration: none;
			}
	
	
		#footerLinks {
			float: left;
		}
		
		#helpLinks {
			float: right;
			
		}
	
			#footerLinks li, #helpLinks li {
				display: block;
				float: left;
				color: #FFF;
				margin: 7px 0 0 0;
				padding: 0 8px;
				border-right: 1px solid #FFF;	
			}
	
				#footerLinks li.last, #helpLinks li.last {
					border-right: none;
				}
				
  
/**** Page Content styles ****/
				
				
		
/** Step Counter **/
#stepCounter {
	overflow: auto;
	padding:0;	
}

#main #stepCounter { /* double id reference to raise speceficity, refactor order */
	display: block;
	list-style: none;
	list-style-position: inside;
	margin: 3px 0 0 10px;
	padding:0;	
}		
		
		#stepCounter input {
		display:list-item;
		text-indent: -9999px;
		height: 30px;
		float: left;
	}
	
		#stepCounter input.step1 {
			width: 238px;
		}
		
		#stepCounter input.step2 {			
			width: 142px;
		}
		
		#stepCounter input.step3 {			
			width: 142px;
		}
		
		#stepCounter input.step4 {
			width: 172px;
		}
		
		#stepCounter input.step1quote {
			width: 228px;
		}
		
		#stepCounter input.step2quote {			
			width: 204px;
		}
		
		
		
/** Error & Success message boxes **/

#error, #success, .error,  .success, #warning{
	
	margin: 0;
	padding: 0px 0px 5px 70px;
	background: url(../../Images/Background/bg-error.jpg) repeat-x #E30C1C;
	min-width: 0; /* IE7 fix - provides hasLayout otherwise text disappears */
	
}

/* ie6 hack*/
* html #error, * html #success, * html .error, * html .success, * html #warning
{
    display:block;
    float:left;
    width:700px;	    
}


    #success, .success {
	    background: url(../../Images/Background/bg-success.jpg) repeat-x #97BF0F;    	
    }

    #warning, .warning{
        background: #F9D8A0
    }

	#error img, #success img, .error img, .success img, #warning img {
		display: block;
		float:left;
		margin: 12px 0px 6px -44px;
				
	}
	
	* html #error img, * html #success img, * html .error img, * html .success img, * html #warning img {
	    margin: 12px 0px 6px -24px;
	}
	
	#error h3, #success h3, .error h3 {
		color: #FFF;
		font-size: 1.2em;
	}
	
	#error li, #success li, .error li {
		color: #FFF;		
	}
	
	#error p, #success p, .error p{
		color: #FFF;
		font-size: 1.2em;
		font-weight: bold;
		padding-bottom: 4px;
		clear: none;
	}
	
	#error a, #success a, .error a{
		color: #FFF;
	}
	
	
	
	 #warning p, #warning ul
	 {    
		font-size: 1.2em;
		padding-bottom: 4px;
		clear: none;
		padding: 7px 0 5px 12px;		
	 } 
	
	div#error ul, div#success ul, div.error ul {
		margin: 0;
		padding: 7px 0 5px 12px;
		list-style-type: disc;
		font-size: 1.1em;
		font-weight: bold;
		color: #FFF;
	}
	
/** Calendar Styles **/
.calendar .ajax__calendar_container	{
    border:1px solid #646464;
    background-color: #ffffff;
    color: #000000;    
    width:270px;
}

.calendar .ajax__calendar_title, .calendar .ajax__calendar_next {
  font-size: .9em;
  position:relative;
  top:-11px;
}

.calendar .ajax__calendar_body  {
    width:270px;
}

.calendar .ajax__calendar_body table {
	border-style:none;
    font-size: .9em
}

.calendar .ajax__calendar_prev {
 padding-right:0px; 
}

#priorityListIcon
{
    display:block; 
    float:left; 
    width:20px;
}

.inlineIcon
{
    padding-left:3px;
    padding-right:3px;
}
	
/**** Page Content structure ****/
				
/** Content wrapper **/
#content, #popContent {
	width: 1000px;
	padding: 0 0 0 0;
	overflow: auto;
	clear: left;	
	}
	
#popupContent
{
    width: 780px;   
}
	
	
:first-child+html #content {
	overflow-x: hidden; /* hide ie7's issues with figuring out what 100% means */
}
	
/** main content panel & styles **/

#main {
	width: 770px;	
	margin: 0;
	padding: 0 0 50px 9px;	/*24 left*/
	float:left;	
	
}


#main.mainExpanded
{
	width:980px;	
}

#main.mainCollapsed
{
	width:770px;		
}

.mainwithLeftNav
{
   float:left;
   width: 740px;	     
}
	
	#main p {
		padding: 0 0 8px 0px;
	}

	.section{
		clear: left;
		margin: 10px 0 0 0;
		padding: 0;
		background: url(../../Images/Background/bg-box-gradient.jpg) repeat-x;
		overflow-y: auto; 
	}
	

	.popupHeader
	{

		clear: left;
		margin: 15px 0 0 0;
		padding: 0;
		background: url(../../Images/Background/bg-box-gradient.jpg) repeat-x;
		overflow-y: auto; 
	
	}
		
		.key, .keyWarning{
			float: left;
			display: block;
			font-size: 1.1em;
			padding: 7px 3px 3px 12px;
			color: #333;
			min-width: 0; /* IE7 fix - provides hasLayout otherwise text disappears */
		}
		
		.keyWarning
		{
			color:Red;
		}
		
		.tools {
			display:inline;			
			float: left;
    		text-align: right;
			padding: 0px 3px 0px 12px; 
		}
		.titleloading
		{
		    color: #009FE3;
	        font-weight: bold;
	        font-size:1.3em;
			display:inline;			
			float: left;	
			text-align: left;	  
			padding: 0px 12px 0px 0px;
		}
		
		.titleButtons
		{
			float: right;
			text-align: right;
			padding: 12px 12px 12px 12px;						
			width:210px;			
		}
		
		.backLink
		{			
			float: left;			
			text-align: left;
			padding: 0px 0px 0px 12px;			
			clear:left;			
			width:480px;
		}
		
		.updateStatus
		{
		    float: left;
			display: block;
			font-size: 1.1em;
			padding: 7px 3px 3px 12px;
			color: #333;
		}	
		
		/*NB:Box*/
		.box {
			margin: 0;
			padding: 10px 12px 6px;
			background: #FFF;			
			clear: left;
		}
		
		.box h1, .box h2, .box h3, .box h4, .box h5  {
			padding-left: 12px ;
		}
				
		.box.table {
			padding: 10px 0px 6px 0px;
		}

		.box input {
			padding: 3px 6px;
		}
		
		.box li{
            font-size: 1.1em;
	        clear: left;
	        display:list-item;
	        padding: 0px 6px 3px ;
	        vertical-align:text-top;	        
	    }

   
	    .blueBullets li
	    {	        
	       color: #009fe3;
	    }
	    
	    .highlight
	    {
	        color: #009fe3;
	    }
	    
	    .box li li, .box li li li
		{	
	        font-size: 1.0em;	        	    
	        display:list-item;
		}
        
        .box li .listText
        {
            color: #575757;
            display:inline-block;
            vertical-align:top;
            max-width:90%;
            
        }
		
		
		.box .noResultsMsg
		{
		    margin-left:12px;
		    
        }
		
		/** PAGING - FOR AT TOP OF RESULT TABLES **/

		.paging {
			float: right;
			margin: 0 27px 5px 0;
		}
		
			.paging a {
				display: inline-block;
				margin: 0 3px;
			}
			
			.paging .active {
				/*color: #009FE3; */
				text-decoration:none;
			}
			
			.paging .current {
					font-weight: bold;
					text-decoration: none;
			}
		
		
		/** FORM BOXES & STYLING **/

               
        .boxWithColor
        {
            background: #E9E9E9;
        }

		.form {
			margin: 0 0 0 0;
			padding: 10px 24px 10px 54px;
			/*background: #F5F5F5; - HAD TO BE MADE DARKER FOR BRIGHT SCREENS */
			background: #E9E9E9;
			color: #5A5957;
		}
		
			.paddedtoform { /* USING FOR ADVANCED SEARCH OPTIONS */
				padding: 0px 0px 5px 27px;
			}
			
			.form div {
				clear: left;
			}
			
			.form label, .form span.label {
				display: block;
				float: left;
				width: 135px;
				text-align: right;
				clear: left;
				padding: 6px 0 6px 0;
				font-size: 1.2em;
			}
			
			.form .error label, .form .error span {
				color: #E0374A;
				font-weight: bold;
			}
			
			.form input.noresize {
				width:auto;		
			}
			
			.form span.label-flexilength {	
				width: 135px;
				text-align: right;
				clear: left;
				color: #FFF;
				padding: 6px 0 6px 0;
				font-size: 1.2em;
			}
			
			.form input, .form a    { /* DO LINKS REALLY NEED TO BE STYLED HERE????????????????????????? */
				display:block;
				float:left;
				margin: 3px 6px 0 20px;
				padding: 3px 12px;
				_height: 12px;
				padding: 3px;				
			}		
			
			.form select {
				display: block;
				float: left;
				margin: 3px 6px 0px 20px;
				padding: 3px 0 3px 0px;
				_height: 12px;
							
			}
			
			.form textarea  {
				display: block;
				float: left;
				width: 490px;
				margin: 3px 6px 0 20px;
				padding: 3px 1px;
				_height: 46px;
			}
			
			.form span.radio {
				display: block;
				float: left;
				width: 490px;
				margin: 3px 6px 0 0;
				padding: 3px 12px 3px 0;				
			}
			
			.form input.disabled {
				background:	#D9D9D9;
			}
			
			.form .disabled a
			{
				margin-left:0px;
				margin-top:0px;
				padding:0px;
			}
			
			.form .disabled a.inline
			{
			    margin:0px;
				padding:0px;
				float:none;
				display:inline;
				vertical-align:top;    
            }
			
			.importantText
			{			    
				background-color: #F9D8A0; 
			}
			
			.form span.disabled {
				display: block;
				float: left;
				width: 490px;
				margin: 3px 6px 0 20px;
				color: #5A5957;
				border: 1px solid #919294;
				font-size: 1.1em;
				padding: 3px 3px;
				background:	#D9D9D9;
				min-height:14px;
			}
			
			.form span.importantText
			{		
				background-color: #F9D8A0; 			
			}

			.form span.disabled-flexilength {
				display:inline;
				margin: 3px 6px 0 20px;
				padding: 3px 12px 0px 12px;
				color: #000;
				border: 1px solid #919294;
				font-size: 1em;
				padding: 3px 12px 0px 12px;
				background:	#D1D1D1;
			}
			
			.form .error input {
				border: 1px solid #E0374A;
			}
			
			.form input.postcode {
				width: 104px;
			}
			
			.form .FormValidation {
				display: block;
				float: left;
				width: auto;
				margin: 3px 6px 0 3px;
				padding: 3px;
				border: solid 1px #F00;
				color: #F00;
			}
			
			.form span.radio input.text {
				border: 1px solid #919294;
			}
			
			.form span.radio label {
				clear: none;
				margin: 0;
				padding: 0;
				text-align: left;
			    width:auto;			    
			}		
			
			.radioLabelSize80 label
			{
			    max-width:80%;			    
			}
			
			.radioLabelSize70 label
			{
			    max-width:70%;			    
			}

			.radioLabelSize115px label
			{
			    width:115px;
			    max-width:115px;			    
			 
			}
			
		
			.radioLabelSize40 label
			{
			    max-width:40%;   	    			    
	
			}
			
			.form span.form-symbol {
				float: left;
				padding: 7px 0 6px 6px;
				margin: 0 -23px 0 0;
			}
			
			.form .description {
				color: #666;
			}
			
			
			
		/** PARTS LISTSING TABLE IN REQUEST WIZARD **/

		.listBox p {
			margin: 12px 6px 0px 12px;
		}
		
		.listBox label {
			margin: 0px 6px 0px 6px;
			padding-top: 3px;			
		}
		
		:first-child+html #main .listBox label, first-child+html #main .radiolist label  {
			margin: 0px 6px 0px 4px;
		}
		
		.listBox input, .radiolist input {
			margin: 0px 6px 0px 12px;
			padding: 0;		
			
		}
		
		.listBox .radio input, .radiolist .radio input{
			display: block;
			float: left;
			margin-top: 0px;
			clear: left;
			border:0px;
			margin-left:5px;			
		}
		
	
				
		:first-child+html .listBox  span.radio input {
			margin-top: 0px; /* overrides default correction for ie7 */			
		}
		
		.listBox .radio label {
			display: block;
			float: left;		
			vertical-align:top;
		}
		


	
		.listBox input.checkbox, 
		.listBox .checkbox input, 
		.listBox .checkbox tr
		.listBox .checkbox
		{
			border: 0;
			margin-top: 4px;
			margin-bottom: -1px;
		}
		
		.radio table tr, .radio table td, .radio table 
		{            	    
            margin:0px; 
            border:0px; 
            padding:0px; 
            font-size: 1em;	             
		}
        
			
		.listBox .checkbox label {
			margin-top: 4px;
		}

/** Buttons at the bottom of every wizard step **/

.pageButtons {
	clear: both;
	margin: 10px 0 0px 12px;
	display: block;
}

	.pageButtons input {
		padding-right: 6px;
		border: 0;
	}


.printButtons {
    display:none;
}


/** half panels for task pages **/


.panel-container 
{
	display: block;
    float: left;
	width: 49%;
 	min-width: 49%;
}

.panel {
	display: block;
    float: left;
 	width:100%;
 	min-width: 100%;
	margin-right: 1.6%;
	margin-bottom: 15px;
	background: #E1E2E3;
	clear: left;	
}
.panel.right {
	margin-right: 0%;
	width:49%;
	min-width: 49%;
	clear: right;
	float: right;
	background-color: #E9E9E9; 
}
	
	.panel h2 {
		color: #FFF;
		background: url(../../Images/Background/bg-panel-h2.gif) repeat-x #FFF;
		padding-bottom: 10px;
		vertical-align:top; 
		min-height:17px;
	}
	
	.panel h3
	{
	    padding:3px 0px 3px 0px;
	}
	
	.inline
	{
	    display:inline; 
	    float:left;
	}
	
	.panel .box {
		background: transparent;
	}
	
	.panel .box h2 {
		color: #009FE3;
		background: none;
		
	}	

	.panel li {
            font-size: 1.1em;
	        clear: left;
	        display:list-item;
	        padding: 2px 6px 2px;
	        vertical-align:text-top;
	        
	        
	}
	
	.panel li li{     
	        font-size: 1em;        
	}
	
	.panel ul 
	{
	    padding-left:0px;
	    text-indent:0px;
		padding-bottom: 10px;

	}

/** taskpanel headings & buttons **/
/* The queueCount classes are all to create the button style links on the task index pages */
.taskGroup {
		display: block;
		margin: 0px 0 12px 0px;	
		clear: left;
		
}

	#main .taskGroup h3, #main .taskGroup .h3 {
		margin: 0px 0 2px 0;
		padding: 2px 0 0 0;
		font-size: 120%;
		font-weight: bold;
		width: auto;
		clear: none;
		color: #666;
	}
	
	
	#main .taskGroup img, #main .taskGroup input
	{
		padding-left:0px;
		margin-left:0px;			    
	}
	
	#main .taskGroup a {
		font-size: 120%;
	}
	
	
	
	.queueCount,  .queueCountNone, .queueCountUrgent, .queueCountWarming {
			font-size: 180%;
			color: #FFF;
			padding: 12px 8px 4px 8px;
			width: 40px;
			height: 23px;
			float: left;
			text-align: center;
			margin: 0 8px 6px 0;
			font-weight: bold;
			border: none;
			text-decoration:none;
	}
	
	.queueCount:visited,  .queueCountNone:visited, .queueCountUrgent:visited, .queueCountWarming:visited,
	.queueCount:active,  .queueCountNone:active, .queueCountUrgent:active, .queueCountWarming:active
	{
	    color: #FFF;
	}
	

	#main .queueCount {
			background: url(../../Images/Buttons/btn-task-bg.jpg) no-repeat #009FE3;
	}	
		
		#main .queueCount:hover {
				background: url(../../Images/Buttons/btn-task-bg-hover.jpg) no-repeat #009FE3;
		}


		
	#main .queueCountWarming {
			background: url(../../Images/Buttons/btn-task-bg-warming.jpg) no-repeat #F6B44D;
	}	
		
		#main .queueCountWarming:hover {
				background: url(../../Images/Buttons/btn-task-bg-warming-hover.jpg) no-repeat #F6B44D;
		}
    
	
	#main .queueCountUrgent {
			background: url(../../Images/Buttons/btn-task-bg-urgent.jpg) no-repeat #ED131F;
	}	
		
		#main .queueCountUrgent:hover {
				background: url(../../Images/Buttons/btn-task-bg-urgent-hover.jpg) no-repeat #ED131F;
		}

    #main .queueCountNone {
			background: url(../../Images/Buttons/btn-task-bg-disabled.jpg) no-repeat #B5B5B7;
	}
	
	#main .zero {
	background: #868789;
}

#secondary {
	position:relative;
	float: right;
	width: 210px;
	margin: 0;
	padding: 0;	
	padding-top:10px;
	
	
}

.secondaryCollapsed
{
	width:0px;
}
.secondaryExpanded
{
	width:210px;
}

/** element size classes TO CUT DOWN LENGTH OF INPUT BOXES etc **/

#main .money {
    width: 55px
}
#main .short {
    width: 151px
}
#main select.short { /* exception for select as the drop-down arrow pushed the width out */
    width: 156px
}
#main .shorter {
    width: 75px
}
#main .medium {
    width: 315px
}

#main .mediumTextBox
{
    width: 305px;
}

#main .normal {
	width: 490px;
}
#main .long {
    width: 515px
}


#main ul li {
			padding-left: 7px;
		}


/** clearfix hack **/

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* EO clearfix hack */

.clearBoth {
	clear: both;
}

/** Content Management Styles.  Used to define the look/feel of content-managed styles. **/


.cm-console {
	width:300px;
	padding-left:20px;
}

.cm-editor-summary {
	width:500px;
	padding-left:20px;
}


.cm-editablearea {
	padding-left:20px;
	border:1px solid #d3e5fa;
}

.cm-table {
	border: 1px solid;
	padding: 4px;	
}

.cm-header, .cm-label, .cm-label-black {
	padding: 2px; 
	font-weight: bold; 
	font-size: 8pt; 
	text-indent: 5px; 
	font-family: verdana; 	
}

.cm-header {
	background-color: #d3e5fa;
	vertical-align:middle;
}	

.cm-label {
	color: #666666;
}

.cm-label-black {
	color: #000000;
}

.cm-nonedit {
	background-color: #eeeeee;
}

.cm-nopad {
	padding: 0px;
}	

.cm-pad {
	padding: 2px;
}

.cm-pad4 {
	padding: 4px;
}

.cm-smallselect {
	font-size: 6pt;
}
 
.cm-lighttext {
	font-weight: normal; 
	font-size: 8pt; 
	font-family: verdana; 
	color: #eeeeee;
}

.smallErrorMessage  {
	color:#ff0000;
}

.smallStatusMessage  {
	font-weight:bold;
}

.closeKnit  {
	padding-bottom:1px;
	padding-top:1px;
}

.reportingSelector {
	color: #009FE3;
	font-size: 1.4em;
	font-weight: bold;	
	padding-left:5px;
	padding-right:5px;    
}

/** Modal Popup **/
.modalBackground {
	background-color:Gray;
	filter:alpha(opacity=70);
	opacity:0.7;
}


.modalPopup {
	background-color:Gray;
	border-style:solid;
	border-color:Gray;
	width:95%;
	width:95%;
}

/** Date & Time picker Styles **/


#main .form div.formCalendar, #main .form div.formTimePicker {
    clear: none;
    float: left;
}

#main .form div.formCalendar input, #main .form div.formCalendar a, #main .form div.formTimePicker input, #main .form div.formTimePicker a    {
    float:none;
}

#main .form div.formCalendar div.pickerWrapper_Default , #main .form div.formTimePicker div.pickerWrapper_Default {
	margin-left: 20px;	
	width:75px;
    min-width:75px;
}

#main div.formCalendar input, #main div.formTimePicker input {
    display:inline;
    margin-left: 0px;
    width:75px;
    min-width:75px;
 }

#main .form div.formCalendar a, #main .form div.formTimePicker a {
    margin: 0px;
    padding-left: 6px;
}

#main .form div.formTimePicker a.radTimePickerButton {
	width: 50px;
	text-align: left;
}:first-child+html #main .form div.formTimePicker a.radTimePickerButton {
	text-align: right; /* otherwise the clock ends up in the middle of the input field on ie */
}
	

#main div.formCalendar tr, #main div.formTimePicker tr {
    background: transparent;
}

#main div.formCalendar td, #main div.formTimePicker td {
    width: 60px;
    overflow: visible;
    margin-left: 6px;
}

a.radDatePickerButton, a.radTimePickerButton
{    
    width: 60px;
}

#main div.formCalendar input[type="hidden"], #main div.formTimePicker input[type="hidden"], input[type="hidden"] {
visibility: hidden;
}

/******************************* FROM HERE DOWN NOT CLEANED UP YET ******************************************/

input.image {
	border: 0;
}

textarea.comments {
	width: 272px;
	height: 32px;
}

div.blue {
	color: #009FE3;
	font-size: 1.2em;
	font-weight: bold;
}

strong.blue {
	color: #009FE3;
	font-size: 1.0em;
	font-weight: bold;
}

.stretch {
	float: right;
	margin: 1px;
}


/* this class allows a span.radio to be wrapped around controls that generate radio buttons 
which do not allow for a .radio class to be attached to them directly. 
This is necessary as the default input styling assumes that it is a text field. */
span.radio input{ 
	border: none;
	width: auto;
	display: block;
	float: left;
}

/* ie6 fix*/
* html fieldset span.radio input
{
    margin-left:10px;    
}

:first-child+html span.radio input{ /* fix for ie7, which handles radio button margins differently */
	margin-top: -2px; 
}

span.radio label {
	display: block;
	float: left;
	padding: 2px 8px 0 0;	
	margin-top:-3px;
}

div.menuItem
{	
	padding:5px 0px 5px 15px;	
	margin:0px 5px 0px 5px;	
}

div.menuItemBottom
{	
	margin-bottom:5px;	
}

div.menuItemTop
{	
	margin-top:5px;
}

div.menuItemDisabled
{
	padding:5px 0px 5px 15px;
	color: #737373;	
	cursor:default;
	margin:0px 5px 0px 5px;	
}

div.contextMenu
{
	border-style:outset;
	border-width:2px;
	width:200px;	
	position:absolute;
	background-color:#D8D5CF;
	color:Black;	
	cursor:pointer;
	margin:5px 5px 5px 5px;
} 

div span.radio {
	display: block;
	clear: left;
}

div.form span.radio {
	clear: none;
}


/* .mandatory fields display the errors next to input fields when a page is returned with errors */
p.mandatory,  span.mandatory {
	margin: 0; 
	padding: 0 3px 0 0;
	color: #D52D3E;
}

p.mandatory {
	display: block;
	float: left;
	width: 25%;
	clear: none;
}

.form span.mandatory {
	display: inline-block;
	margin: 0 -13px 0 5px;	
}

span.escalated {
	display: inline-block;
	margin: 0 -8px 0 3px;
	color: #E4001B;
	font-weight: bold;
}

.highlightImportant
{
    color:Red;
    
}


/** Styles added for telerik RAD controls. **/
/* These can possibly be styled more efficiently, refer to documentation and review when time available */ 

.GridRowOver_Default
{
background-color: #0185CB;
cursor:pointer;
}


div.radtooltip
{
	font-family: Arial, Helvetica, sans-serif;
	font-size:8px;
} 



textarea.radTextBox {
	border: 1px solid #919294;
	padding: 3px 1px 0px 3px;
	margin-right:0px;
	color: #5A5957;	
}



.userMenu, .userMenu .panel{
 	display: block;
    float: left;
 	clear: left;
    width: 240px;    
    margin-top:6px;
}

.panel .userMenu ul {
	list-style: none;
}

.userData 
{
    padding-left:9px;
    display: block;
    margin-right: 0%;
    margin-top: 10px;
	float: left;
	clear: right;	
	width: 741px;	
}


.headingWithUpdater
{
    display:block; 
    min-height:19px;
}

* html .headingWithUpdater
{
    display:block; 
    min-height:19px;
    height:19px;
          
}

.userData .section
{
    margin-top:0px;
    margin-bottom:10px;
}


div.uploadControl {
display:block;
float:left;
margin: 3px 6px 0pt 20px;
padding:0px;
clear: none;
width: 214px;
}

:first-child+html div.uploadControl {
	margin: 3px 6px 0pt 3px;
} 
:first-child+html span.description {
	display: inline-block;
	padding-left: 10px;	
}

span.description a
{
		float:none;
		display: inline;
		margin-left:0px;
}

#main div.uploadControl li {
	padding: 0;
}

span.ruFileWrap input {
	display:inline;
	
	float:none;
	margin:0;
	padding:0;
}


/*styles for the telerik tree view */

.form div.busRelnRegionChooser 		
{
	display:block;
	float:left;
	clear:left;
	position:relative;
	left:-195px;
	
	
}

			
.form ul.rtUL div
{
	padding: 0px 2px -2px 15px;
	margin: 0px 0px 0px 0px;
}

.form input.rtChk 
{
	display:inline;
	float:none;
	margin: 0px 0px 0 0px;
	padding: 0px 0px 0px 0px;
	_height: 21px;
	padding: 3px;
}

.form span.rtIn 
{
	color: #5A5957;
}


.form div.RadTreeView 		
{
	display:block;
	float:right;
	margin: 3px 6px 0 20px;
	padding: 3px 12px;
	_height: 21px;
	padding: 3px;
}

/* telerik maintain menu items*/

div.RadPanelBar 
{
	margin: 0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	border-color:#ffffff;
	background:none;
	border:none;
	background-color:#ff0000;
	
}

div.RadPanelBar ul.rpRootGroup 
{
	padding: 0px 0px 0px 0px;
	border:none;
	
}

span.rpText 
{
	padding:0px 0px 0px 0px;
}

div.RadPanelBar ul.rpRootGroup li
{
		color: #FFF;
		background: url(../../Images/Background/bg-panel-h2.gif)		repeat-x #FFF;
		font-size: 1.2em;
		padding: 7px 12px 10px 12px;
		border:none;
		padding-bottom: 0px;
		vertical-align:top; 
		min-height:17px;	
}

div.RadPanelBar ul.rpRootGroup li span.rpText
{
		background-image:none;
}

div.RadPanelBar ul.rpRootGroup li.rpItem 
{
	background-color:#cccccc;	
}


div.RadPanelBar ul.rpRootGroup li li.rpItem 
{
	background-color:transparent;	
}

div.RadPanelBar ul.rpGroup li
{
			background-color:#cccccc;
			background: none;
			font-size: 1.1em;
	        clear: left;
	        display:list-item;
	        padding: 5px 0px 5px 0px;
}


div.RadPanelBar ul.rpGroup li A.rpLink, 
div.RadPanelBar ul.rpRootGroup li A.rpLink 
{
	color:#000000;
	border-bottom: none; 
}

div.RadPanelBar ul.rpGroup li span.rpText
{
	color:#000000;
	border-bottom:none;
	font-size: 90%;
	line-height: 1.6em;
	margin-right: -20px;

}

.RadNumericTextBox input
{
    background-color:Blue;    
}

/* this sorts out issue with conflicting types of ul's in panels */
ul.menuList {
	list-style: none;
	list-style-position: outside;
	margin-left: 0px;
}

ul.menuList li {
	font-size: 120%;
	line-height: 1.6em;
	margin-right: -20px;	
}

ul.menuList li.active  {
	background:  transparent url(../../Images/Background/bg-leftnav-li-active.gif) no-repeat 220px;	
}

ul.menuList li.active a{
	text-decoration:none;	
}

span.sponsor 
{
	font-size:8pt;
	color:#008FD5;
	font-weight:bold;
}

/**BOSKO STYLES FOR TERMS OF USE**/

.cmsZone .Terms ol.major
{
	font-size: 1.8em;
	font-weight:bold;	
	list-style-type: decimal;
	margin-left:-20px;	
}
.cmsZone .Terms ol.major li
{
	padding-bottom:10px;	
	list-style-position:outside;
}
.cmsZone .Terms span.subHeading 
{
	display:block;
	padding-top:10px;
	font-weight:bold;	
}
.cmsZone .Terms ol.minor
{
	padding-top:10px; 
	font-size: 85%;
	font-weight:normal;
	margin-left:20px;
	list-style-type: decimal;	
}
.cmsZone .Terms ol.alpha
{
	padding-top:10px;
	font-size: 85%;
	font-weight:normal;
	color:Blue;
	margin-left:20px;
	list-style: lower-alpha;
}

.cmsZone .Terms ol.roman
{
	padding-top:10px;
	font-size: 85%;
	color:Red;
	font-weight:normal;
	margin-left:20px;
	list-style: lower-roman;
}

.cmsZone .Terms ol.blank
{
	padding-top:10px; 
	font-size:80%;
	font-weight:normal;
	margin-left:20px;
	list-style-type:none;	
}


.cmsZone
{
    display:block;
    clear:both;
   	position:relative;
	margin: 0;
	padding: 0;	
}

.cmsZone h1, .cmsZone h2, .cmsZone h3, .cmsZone h4
{
	color: #009FE3; 	
    font-weight: bold;
	clear: left;	
}

.cmsZone h1, .cmsZone h2 {
	background: url(../../Images/Background/bg-box-gradient.jpg) repeat-x;		
	margin-top:5px;
}

#secondary .cmsZone h1
{
    margin-top:0px;
}

.cmsZone h1{
	font-size: 1.7em;
	padding: 7px 12px 7px 12px;	
}

.cmsZone h2 {
	font-size: 1.4em;
	padding: 7px 12px 7px 12px;
	
}

.cmsZone h3 {
	font-size: 1.3em;
	padding: 7px 0px 7px 12px;
}

.cmsZone h4 
{
    font-size: 1.3em;
    padding-left: 12px;
}


.cmsZone p, .cmsZone ul, .cmsZone ol, .cmsZone table 
{
    padding: 0px 3px 0px 12px;
	color: #575757; 	
	font-size: 1.3em;
	clear: left;
}  

#main .cmsZone p
{
    display:block; 
    font-size: 1.3em;
    padding: 0px 12px 3px 12px;
    
}



.cmsZone ul li, .cmsZone ol li
{  
	/** color: #575757; **/
	font-size: 1.0em;
	display:list-item;
	vertical-align:top;
	max-width:90%;
	
}

.loadTestBanner 
{
	height:25px;
	width:100%;
	background-color:#ff0000;
	padding-left:20px;
}

.loadTest 
{
	color:#FFFFFF;
	font-size:2.0em;
}

.loadTestInfoIcon 
{
	color:#FFFFFF;
	font-size:10px;
}


/** Alternative styles to address width issue **/

/* 1. Content centered */
/* 
#wrapper{
	width: auto;
	background: #eee;
}

#header {
	width: auto;
	background: #fff;
}
#content {
	background: #fff;
	margin: 0 auto;
}

#footer {
	width:auto;
}
*/

/* 2. Content left, just darker right background */
/*
#wrapper{
	width: auto;
	background: #ccc;
}

#header {
	width: auto;
	background: #fff;
}
#content {
	background: #fff;
}

#footer {
	width:auto;
}
*/