/*
*** New Logo Stuff ****
Dark Blue						: #112B5E
Light Blue (Button) : #475268
Orange							: #EB6D10
Light Orange				: #
Gray Shadow On Logo	: #D9D9D9

*** Old Stuff
*/

/*** CSS RESET ***/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,legend,input,textarea,p{margin:0; padding:0; text-align:left}
table{border-collapse:collapse; border-spacing:0}
th { text-align: inherit; }
fieldset,img{border:0;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
sup {vertical-align:text-top; position:relative}
sub {vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
input,textarea,select{*font-size:100%;}
ul,ol,li{list-style:none;}
html{-webkit-text-size-adjust:95%}
#track{position:absolute; bottom:0;}

/*** GLOBAL ***/
body {
	background-color:#EDEDED;
	color:#656565;
	font-family: Arial, Calibri, Tahoma, Verdana;
	font-size:80%;
	line-height:1.3em;
	text-align:center;
}

.textIndent { text-indent:5px; }
.clear{clear:both}
.rel{position:relative}
.block{display:block}
.inline{display:inline}
.left{text-align:left !important}
.right{text-align:right !important}
.center{text-align:center}
.centerI{text-align:center !important}
.bottom{position:absolute; bottom:0}
.u{text-decoration:underline !important;}
p{margin:0 0 1em 0}
a:link{text-decoration:none; color:#4747BD}
a:visited{text-decoration:none; color:#4747BD}
a:hover{text-decoration:underline; color:#4747BD}
ul, ol, dl{ margin: 0 0 1em 0 }
input, textarea, select{border:1px solid #ccc; vertical-align:middle; background-color:#fff; color:#656565}
.hide{display:none}
#ie{zoom:1}
#pageID{position:absolute; top:-20px; width:100px; text-indent:-9999px;}
/*#wrapper{margin:0 auto; width:985px; background-color:#ededed; height:100%}*/
#wrapper {
 	background-color:#EDEDED;
	height:100%;
	margin:0 auto;
	width:1024px;
}

#NoShow, .NoShow {
   position:absolute;
   display:none;
}

/****CONTENT AREA****/
#container {background:#FFFFFF  repeat-y scroll 0 0; width:1024px; height:800px; overflow-y:hidden; overflow-x:hidden;}
#page {
	margin:0px 17px 0px 17px;
	position:relative;
	width:989px;
}

h1 { /* main body content headings */
	background:#F1F1F1 url(hpiportal/webimages/gradient_bodyheader.jpg) repeat-x scroll left top;
	/* Top Right Bottom Left */
	padding: 3px 0px 3px 0px;
	font-size:2.2em;
	line-height:26px;
	margin-bottom: 10px;
}
h3 { /*inqueries(request a demo) page*/
	padding: 1px 10px 6px 0px;
	line-height:25px;
	margin-bottom: 3px;
	font-size: 1.4em;
}
h4 { /* block headings with borders (leftsidelayer) */
	/*background:#F8F8F8 url(/planitweb/webimages/gradient_header.jpg) repeat-x scroll left top;*/
	color:#444444;
	font-size:9pt;
	font-weight:bold;
	line-height:15px;
	padding-top:10px;
	padding-bottom:5px;
	text-decoration:underline;
}

h5 { /* block headings with borders (leftsidelayer) */
	/*background:#F8F8F8 url(/planitweb/webimages/gradient_header.jpg) repeat-x scroll left top;*/
	color:#122b5f; /* the official planIT blue - this is just used on the quick links heading which terry wants blue even though its not a link */
	font-size:9pt;
	font-weight:bold;
	line-height:15px;
	padding-top:10px;
	padding-bottom:5px;
	overflow:	white-space:
}

h6 {
	height: 16px;
	width:800px !important;
	background-color: #D9D9D9;
	width: 100%;
	padding-top: 4px;
	margin-bottom:10px;
}

.h6div {
	height:20px;
	background-color: #D9D9D9;
	width: 100%;
	padding-top: 4px;
	margin-bottom:10px;
	display:relative;
	overflow:hidden;
}


#content {
	clear:both;
	position:relative;
	text-align:left;
	width:100%;
}
@media print { body { -webkit-print-color-adjust: exact; } }

@media screen {
	.nodisplay {
	   position:absolute;
	   display:none;
	}
	.ModalBoxes {
  	position:absolute;
  	top:0px;
  	left:-1000px;
		z-index:-1;    
	}
}

.styleTimeline {
	font-size:79.5%;
	line-height:1.5em;
}
.styleTabs {
	font-size:79% !important;
}

.DefaultListStyle li{
	margin: auto auto auto 12pt; 
	list-style: disc;;
}

.BodyInnerLayer {
      width:800px;
      height: 475px;
}
.RightSideLayer {
      width:824px;
      float:left;
      overflow-y:auto; 
      overflow-x:hidden;
      margin-left: 10px;
}
.BlockNewLayer {
/*
	background-color:#FFFFFF;
	border:1px solid #CCCCCC;
*/
	margin:0 0 10px;
	padding:1px 1px 0;

}
.BlockHeight121px { height:121px; }
.BlockNewLayer p{
	line-height:.6em;
}
.ServicesTable {
display: table; height: 250px; width: 561px; background: #aaa; _position: relative; overflow: hidden;
}
.ServicesRow {
	width:100%;
	height: 39px;
	margin-bottom: 10px;
	_position: absolute; _top: 50%; display: table-cell; vertical-align: middle;	
}
.ServicesImage {
	width:54px;
	float:left;
	clear:right;
	margin-right: 10px;
}

.BlockBodyContent {
	margin:5px 10px 20px;
}
.InfoLayer p{
/*	text-align:center;*/
}
.BannerLayer {
	margin-left: 0px;
	position: relative;
	height:82px;
	width:1024px;
}
.StaticContent {
	position: relative;
	height:82px;
	width:1024px;
	float:left;
	clear:none;
}
.BorderTopSplice {
	height:0px;
	margin-top: 10px;
	padding-top: 4px;
	position: relative;
	top:1px;
	width:1024px;
	background:transparent url(/hpiportal/webimages/page_topSlice.gif) repeat-x scroll center bottom;	
}

.bannerGradient_HPI {
background: #ffffff; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE2JSIgc3RvcC1jb2xvcj0iIzIwN2NjYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjU4JSIgc3RvcC1jb2xvcj0iIzE0MmI1ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(left,  #ffffff 0%, #207cca 16%, #142b5e 58%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ffffff), color-stop(16%,#207cca), color-stop(58%,#142b5e)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  #ffffff 0%,#207cca 16%,#142b5e 58%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  #ffffff 0%,#207cca 16%,#142b5e 58%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  #ffffff 0%,#207cca 16%,#142b5e 58%); /* IE10+ */
background: linear-gradient(to right,  #ffffff 0%,#207cca 16%,#142b5e 58%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#142b5e',GradientType=1 ); /* IE6-8 */

}
.bannerCorner_HPI {
	float: right;
	height: 82px;
	src: url(../webimages/rightcorner.jpg);
	align: right;

}
.images
{
float:left;
margin: 0px;
padding: 0px;
align: left;
}
* html .BannerLayer {margin-bottom: -4px;} /* fixes a bug with ie6 */

.RequestADemo {
	border:1px solid #CCCCCC;
	margin-top: 16px;
	margin-bottom: 10px;
	margin-left: 10px;
	margin-right: 10px;
	padding:5px 0px 5px 0px;
	text-align:center;
	background-color: #112B5E;
	color:FFFFFF;
	cursor:pointer;
}
.RequestADemo a{
	 color:white !important; 
	 text-decoration: none;
     font-size: 9pt; 
}

.MenuLayer {
	margin-top: 10px;
}
.BreadCrumbLayer {
	float:left;
	text-indent: 11px;
}
.TimeLayer {
	float:right;
	margin-right:11px;
}
.BreadCrumbTimeLayer {
	line-height: 15px;
	height: 15px;
	width: 100%;
}
	 
.LeftSideLayer {
	position: relative;
	width:153px; 
	height: 600px;
	float:left;
	clear:right;
	background:#FFFFFF url(/hpiportal/webimages/leftside_bg.jpg) no-repeat;
}
.LeftSideLayerRestat {
	background:#FFFFFF url(/hpiportal/webimages/leftside_bg_restat.jpg) no-repeat;
}


.CopyLayer {
	clear:both;
	padding-top:5px;
	position: relative;
	text-align:center;
	background:transparent url(/hpiportal/webimages/page_btmSlice.gif) no-repeat scroll 0 0;
}
.LaunchLayer {
	position: absolute;
	left:396px;
	top:49px;
	width:110px;
	height:28px;
	z-index:7;
}
.message-contents {
	MARGIN-LEFT: 10%; 
	MARGIN-RIGHT: 10%; 
	text-align:left;
	border:thin;
	border-style:solid;
	border-color:#6779A1;
}

HR { MARGIN:0em 0px; COLOR: #988975; HEIGHT: 1px; BACKGROUND-COLOR: #000 }
#PrinterFriendlyLayer { width: 650px; }

INPUT.hrefbuttonlink {
	text-decoration: underline;
	background: #FFFFFF;
	color: #4747BD;
	border:0px;
	cursor: pointer;
	text-align:right;
	font-size: 9pt; 
}

INPUT.hrefbutton {
	text-decoration:none;
	background: #112B5E;
	color: white;
	cursor: pointer;
	text-align:center;
	padding: 3px 4px 2px 4px;	
	font-size: 9pt; 
	border-top: 0px white;
	border-left: 0px white;
	border-bottom: 2px solid #d9d9d9;
	border-right: 2px solid #d9d9d9;
}

INPUT.hrefbutton:hover   {
	background-color: #475268;
	text-decoration: none;
}
INPUT.hrefbuttonbigger {
	text-decoration:none;
	background: #112B5E;
	color: white;
	font-weight:bold;
	cursor: pointer;
	text-align:center;
	padding: 3px 9px 2px 9px;	
	font-size: 10pt; 
	border-top: 0px white;
	border-left: 0px white;
	border-bottom: 2px solid #d9d9d9;
	border-right: 2px solid #d9d9d9;
}
INPUT.hrefbuttonbigger:hover   {
	background-color: #475268;
	text-decoration: none;
}

INPUT.hrefbuttonbigger2 {
	text-decoration:none;
	background: #112B5E;
	color: white;
	cursor: pointer;
	text-align:center;
	padding: 3px 22px 2px 22px;	
	font-size: 9pt; 
	border-top: 0px white;
	border-left: 0px white;
	border-bottom: 2px solid #d9d9d9;
	border-right: 2px solid #d9d9d9;
}
INPUT.hrefbuttonbigger2:hover   {
	background-color: #475268;
	text-decoration: none;
}

INPUT.hrefbuttonbiggerRestat {
	text-decoration:none;
	background: #7C6A52;
	color: white;
	font-weight:bold;
	cursor: pointer;
	text-align:center;
	padding: 1px 7px 0px 7px;	
	font-size: 9pt; 
	border-top: 0px white;
	border-left: 0px white;
	border-bottom: 2px solid #d9d9d9;
	border-right: 2px solid #d9d9d9;
}

HR {
	MARGIN: 0em 0px;
	COLOR: #988975;
	HEIGHT: 1px;
	BACKGROUND-COLOR: #000;
}
	#StageLayer{
		position: relative;
		float:left;
    width: 33px;
		display:inline-block;
	}

#HashmarkLeftLayer {
		background-image:url(/planitcc/webimages/checkboxhash.jpg);
		background-repeat:no-repeat;
		background-position:center right;
}	
	#HashmarkLayer{
		height:1px;
		position: relative;
		width:100%;
		border-bottom-color:#928A87;
		border-bottom:solid thin;
		display:inline-block;
	}
	#HashRightLayer{
		height: 1px;
		position: relative;
		width: 100%;
		border-bottom-color:#928A87;
		border-bottom:solid thin;
		display:inline-block;
	}
	table.Stages td {
	  vertical-align:middle;
		width: 4%;
/*		width: 33px;*/
	}
	
	table.Stages {
	  display: inline;
		text-align : center;
	  margin-bottom: 15px;
	}
#TabLayer {
	position: relative;
	height: 16px !important;
	width: 90%;
	margin: 0px;
	padding: 0px;
	margin-bottom:10px;
	display: inline-block;
	border-bottom-color: #928A87;
	border-bottom: solid thin;
}
#TabLayer .tab-contents {
	MARGIN: 0px;
	padding: 0px;
	POSITION: relative;
	width: auto;
	display: inline-block;
	height: 16px;
}
.tab-contents input {
	/* for ie */
	margin-bottom: -4px;
}
.tab-contents > input {
	/* for non-ie */
	margin-bottom: 0px;
}
div.Timeline { }

#surveyContainer {
	font-size: 11pt;
	font-weight: normal;
	font-family: "Bell MT", "Times New Roman", Tahoma;
}

.border1 {
	border-width: 1px 1px 1px 1px;
	border-spacing: 2px;
	border-style: inset inset inset inset;
	border-color: gray gray gray gray;
	border-collapse: separate;
}


#statesContainer {
	font-size: 8pt;
	color: #072C61;
	border-width: 1px 1px 1px 1px;
	border-spacing: 2px;
	border-style: inset inset inset inset;
	border-color: gray gray gray gray;
	border-collapse: separate;
	background-color: rgb(250, 240, 230);
	width:250px;
}

#surveyContainer input {
	margin-left:33%;
}

table.tableBorders { }

table.tableBorders th, table.tableBorders td {
	margin: 0;
	padding: 1px 15px 1px 0px;
	background-color: white;
	empty-cells: show;
}

table.tableBorders th {
	color:#4747BD;
	padding-bottom: 2px;
  text-decoration: underline;
}

.BannerLayerLogin {
	background:#ffffff;
	MARGIN-TOP: 0px;  
	position: relative;
	width: 588px;
	height:82px;
	float:left;
	padding-bottom: 5px;
}
* html .BannerLayerLogin {margin-bottom: -4px;} /* fixes a bug with ie6 */

#row2Login {
	MARGIN-TOP: 0px;
	BACKGROUND: #FFFFFF;
	position: relative;
	width: 588px;
	height:273px;
	clear:both;
	float:left;
}
#LeftSideLayerLogin {
	position: relative;
	width:386px; 
	height: 273px;
	float:left;
	clear:left;
	padding-right:5px;
}
* html #LeftSideLayerLogin {margin-bottom: -4px;} /* fixes a bug with ie6 */

#RightSideLayerLogin {
	position: relative;
	BACKGROUND: 082F58;
	width:196px; 
	height: 273px;
	float:left;
}
#BodyLoginLayer {
	position: relative;
	background: url(/hpiportal/webimages/login_rightbg.jpg) no-repeat;
	width:196px; 
	height: 273px;
	float:left;
	clear:left;
}
#BodyLoginLayerRestat {
	position: relative;
	background: url(/hpiportal/webimages/login_rightbg_restat.jpg) no-repeat;
	width:196px; 
	height: 273px;
	float:left;
	clear:left;
}
#BodyForgotLayer {
	position: relative;
	background: url(/hpiportal/webimages/forgot_rightbg.jpg) no-repeat;
	width:196px; 
	height: 273px;
	float:left;
	clear:left;
}
#wrapperLogin {
	height:100%;
	margin:0 auto;
	width:583px;
}
#containerLogin {
	background:FFFFFF;
	margin-top: 15px;
}

.CopyLayerLogin {
	clear:both;
	float:left;
	width:588px;
	position: relative;
	text-align:center;
}
.uploadedfilesouter {
	clear:both;
	float:left;
	position: relative;
	text-align:left;
}
.uploadedfilesleft {
	float:left;
	position: relative;
	text-align:left;
	width:88px;
	margin-top:5px;
}
.uploadedfilesright {
	float:left;
	position: relative;
	text-align:left;
	height:auto;
	width:auto;

	
}
.attachmentsouter {
	position: relative;
	text-align:left;
	min-height:50px;
	max-height:125px;
	width:500px;
	padding-bottom:2px;
	padding-top:2px;
	overflow-y:auto;
	overflow-x:hidden;
	border:thin #d9d9d9;
	border-style:solid;
}

div.autocomplete {
  position:absolute;
  width:275px;
  height:100px;
  background-color:white;
  border:1px solid #888;
  margin:0;
  padding-right:20px;
  overflow-y: scroll;
}
div.autocomplete ul {
  list-style-type:none;
  margin:0;
  padding:0;
}
div.autocomplete ul li.selected { background-color: #ffb;}
div.autocomplete ul li {
  list-style-type:none;
  display:block;
  margin:0;
  padding:2px;
  height:12px;
  cursor:pointer;
}
#messages {
	font-size: 9pt;
	color: #CC0000;
}