/*####################		Main Styles		####################*/

html, form { height: 100%; }
body { background-color: #000033; color: #FFF; height: 100%; margin: 0px; padding: 0px; }
.clearFloat { clear: both; font-size: 0px; margin: 0px; padding: 0px; }

/*####################		Main Styles		####################*/

/*@@@@@@@@@@@@@@@@@@@@		Container Styles		@@@@@@@@@@@@@@@@@@@@*/
#Container
{
	background: -webkit-gradient(linear, 0% 0, 0% 100%, from(#000033), to(#162874));
	height: 100%;
	margin: 15px auto 0 auto;
	text-align: center;
	width: 100%;
}

#InnerContainer
{
	background: -webkit-gradient(linear, 0% 0, 0% 100%, from(#6f6f6f), to(#eeeeee));
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
	margin: 0px auto; 
	min-height: 300px;
	text-align: center;
	width: 700px; 
}

#LoginContainer
{
	background: -webkit-gradient(linear, 0% 0, 0% 100%, from(#fefefe), to(#6e6e6e));
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	-webkit-box-shadow: rgba(0,0,0,1) 0 2px 0;
	-moz-box-shadow: rgba(0,0,0,1) 0 2px 0;
	margin: 0px auto;
	min-height: 270px;
	padding-top: 15px;
	text-align: center;
	width: 275px;
}

.TopButtonContainer
{
	-webkit-border-radius: 8px 8px 0px 0px;
	-moz-border-radius: 8px 8px 0px 0px;
	border-radius: 8px 8px 0px 0px;
	background: -webkit-gradient(linear, 50% 0, 50% 90%, from(#4b284d), to(#834F85));
	float: right;
	height: 35px;
	right: 300px;
	top: 20px;
	width: 100%;
}

.ClearButton
{
	float: left;
	padding-top: 2px;
	padding-right: 25px;
	text-align: right;
	width: 81%;
}

.LogoutButton
{
	float: left;
	padding-top: 2px;
	text-align: left;
	width: 15%;
}
/*@@@@@@@@@@@@@@@@@@@@		Container Styles		@@@@@@@@@@@@@@@@@@@@*/

/*%%%%%%%%%%%%%%%%%%%%		Control Styles		%%%%%%%%%%%%%%%%%%%%*/
   
.button:hover { border-top-color: #003790; background: #003790; color: #ffffff; }   
.button:active { border-top-color: #003790; background: #003790; color: #ffffff; }
.button 
{
   border-top: 1px solid #fffecb;
   background: #003790;
   background: -webkit-gradient(linear, left top, left bottom, from(#FFD823), to(#FFEFA7));
   background: -webkit-linear-gradient(top, #FFD823, #FFEFA7);
   background: -moz-linear-gradient(top, #FFD823, #FFEFA7);
   background: -ms-linear-gradient(top, #FFD823, #FFEFA7);
   background: -o-linear-gradient(top, #FFD823, #FFEFA7);
   padding: 2px 15px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: #003790;
   font-size: 14px;
   font-family: 'Trebuchet MS';  
   font-weight: bold;  
   text-decoration: none;
   vertical-align: middle;
}

.topbutton:hover { border-top-color: #FFD823; background: #FFD823; color: #003790; }   
.topbutton:active { border-top-color: #FFD823; background: #FFD823; color: #003790; }
.topbutton 
{
   border-top: 1px solid #fffecb;
   background: #e6c266;
   background: -webkit-gradient(linear, left top, left bottom, from(#003790), to(#005AEF));
   padding: 2px 10px 0px 10px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   color: #ffffff;
   font-size: 14px;
   font-family: 'Trebuchet MS';  
   font-weight: bold; 
   text-decoration: none;
   vertical-align: middle;
}

.PreviousButtonContainer { float: left; padding-left: 15px; padding-top: 15px; padding-bottom: 10px; text-align: left; width: 25%; }
.NextButtonContainer { float: right; padding-right: 15px; padding-top: 15px; padding-bottom: 10px; text-align: right; width: 25%; }
.errorContainer { float: left; padding-top: 25px; text-align: center; width: 45%; }

.loginLabel
{
	color: #000;
	font-family: 'Trebuchet MS';
	font-size: 14px;
	font-weight: bold;
}

.loginTextbox
{	
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;	
   color: #000;
   font-size: 16px;
   height: 22px;
   padding-left: 5px;
}

/*select
{
	background: -webkit-gradient(linear, 0% 0, 0% 100%, from(#6f6f6f), to(#fff));
	border: solid 1px #834f85;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
	box-shadow: rgba(0,0,0,1) 0 1px 0;
	font-family: Arial;
}*/
/*%%%%%%%%%%%%%%%%%%%%		Control Styles		%%%%%%%%%%%%%%%%%%%%*/

/*&&&&&&&&&&&&&&&&&&&&		Form Styles		&&&&&&&&&&&&&&&&&&&&*/
#main { color: #000; font-family: Arial; font-size: 12px; font-weight: bold; min-height: 175px; padding-top: 6px; }
.Step2Spacer { float: left; width: 345px; }
.Step2Fields { float: left; width: 102px; }
.Step2FieldsLast { float: left; width: 128px; }
.Step3FieldsFirst { float: left; width: 23%; }
.Step3Fields { float: left; width: 16%; }
.Step3FieldsLast { float: left; width: 26%; }
.Required { color: Red;	font-weight: bold; }

.CustomerInfoPanel
{
	-webkit-box-shadow: rgba(0,1,0,1) 2px 2px 2px;
	-moz-box-shadow: rgba(0,1,0,1) 2px 2px 2px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background-color: #fff;
	color: #000;
	width: 96%;
}

.CustomerInfoPanelHeader
{
	-webkit-border-radius: 5px 5px 0px 0px;
	-moz-border-radius: 5px 5px 0px 0px;
	border-radius: 5px 5px 0px 0px;
	border-bottom: 2px solid #ffd92c;
	background: #e6c266;
	background: -webkit-gradient(linear, left top, left bottom, from(#005ef9), to(#003386));
	background: -webkit-linear-gradient(top, #005ef9, #003386);
	background: -moz-linear-gradient(top, #005ef9, #003386);
	background: -ms-linear-gradient(top, #005ef9, #003386);
	background: -o-linear-gradient(top, #005ef9, #003386);
	color: #fff;
	font-family: 'Trebuchet MS'; 
	font-size: 14px;
	font-weight: bold;
	height: 14px;
	padding-left: 10px;
	padding-top: 5px;
	text-transform: uppercase;
}

.CustomerInfoData { font-size: 12px; padding: 2px 2px 10px 10px; }
.CustInfo { color: #005ef9; }
.CIunderline { border-bottom: dotted 1px #003386; height: 16px;}

.DatePicker
{
	background: url(../img/sprite.png) no-repeat -280px -53px;
	border: solid 0px black;
	cursor: pointer;	
	height: 27px;
	padding-left: 2px;
	width: 100px;
}

.OfflineText
{
   color: #ffffff;
   font-size: 14px;
   font-family: 'Trebuchet MS';  
   font-weight: bold; 
   padding-top: 15px;
   text-align: center;
}
/*&&&&&&&&&&&&&&&&&&&&		Form Styles		&&&&&&&&&&&&&&&&&&&&*/

/*%%%%%%%%%%%%%%%%%%%%		Grid Styles		%%%%%%%%%%%%%%%%%%%%*/

.gridouter
{
	border-left: solid 1px #828282;
	border-top: solid 1px #828282;
	margin: 0px auto;
	padding: 0px; 
	width: 97%;
}

.gridcell
{
	background: white;
	border-right: solid 1px #828282;
	border-bottom: solid 1px #828282;
	margin: 0px;
	padding: 0px;
}

.gridheader
{
	border-bottom: 2px solid #ffd92c;
	background: #e6c266;
	background: -webkit-gradient(linear, left top, left bottom, from(#005ef9), to(#003386));
	background: -webkit-linear-gradient(top, #005ef9, #003386);
	background: -moz-linear-gradient(top, #005ef9, #003386);
	background: -ms-linear-gradient(top, #005ef9, #003386);
	background: -o-linear-gradient(top, #005ef9, #003386);
	border-bottom: solid 1px #828282;
	color: #fff;
	font-family: 'Trebuchet MS'; 
	font-size: 12px;
	font-weight: bold;
	height: 14px;
	text-transform: uppercase;
}

.gridheaderlast
{
	border-bottom: 2px solid #ffd92c;
	background: #e6c266;
	background: -webkit-gradient(linear, left top, left bottom, from(#005ef9), to(#003386));
	background: -webkit-linear-gradient(top, #005ef9, #003386);
	background: -moz-linear-gradient(top, #005ef9, #003386);
	background: -ms-linear-gradient(top, #005ef9, #003386);
	background: -o-linear-gradient(top, #005ef9, #003386);
	border-bottom: solid 1px #828282;
	border-right: solid 1px #828282;
	color: #fff;
	font-family: 'Trebuchet MS'; 
	font-size: 12px;
	font-weight: bold;
	height: 14px;
	text-transform: uppercase;
}
/*%%%%%%%%%%%%%%%%%%%%		Grid Styles		%%%%%%%%%%%%%%%%%%%%*/

/*%%%%%%%%%%%%%%%%%%%%		Text Input Styles		%%%%%%%%%%%%%%%%%%%%*/
.shortField { width: 75px; }

input, textarea, select
{
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #666666;
	background-color: #FFFFFF;
	height: 24px;
	margin: 0px;
	padding-left: 2px;
	color: black;	
}

input[type=radio]
{
	height: 14px;
}

input.error, textarea.error, select.error 
{
	border: 2px solid red;
	background-color: #FFFFD5;
	margin: 0px;
	color: red;
}

.error {color: red;	font-family: Arial; font-size: 11px; font-weight: bold; }
/*%%%%%%%%%%%%%%%%%%%%		Text Input Styles		%%%%%%%%%%%%%%%%%%%%*/

/*%%%%%%%%%%%%%%%%%%%%		Sprite Styles		%%%%%%%%%%%%%%%%%%%%*/
#Logo
{
	background: url(../img/sprite.png) no-repeat 0px -90px;
	height: 110px; 
	margin: 0px auto; 
	text-align: center; 
	width: 192px; 
}

.FormHeading
{
	background: url(../img/HeaderBG.png) repeat-x 0px 0px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color: #003366;
	font-family: 'Trebuchet MS';
	font-size: 18px;
	font-weight: bold;
	height: 40px;
	margin: 0px;
	padding: 0px;
	width: 100%;
}

.LogoSmall { background: url(../img/sprite.png) -191px -90px no-repeat;	height: 33px; padding: 0px !important; width: 60px; }
#Step1 { background: url(../img/sprite.png) 0px -50px no-repeat; height: 40px; width: 40px; }
#Step2 { background: url(../img/sprite.png) -40px -50px no-repeat; height: 40px; width: 40px; }
#Step3 { background: url(../img/sprite.png) -80px -50px no-repeat; height: 40px; width: 40px; }
#Step4 { background: url(../img/sprite.png) -120px -50px no-repeat; height: 40px; width: 40px; }
#Step5 { background: url(../img/sprite.png) -160px -50px no-repeat; height: 40px; width: 40px; }
#Step6 { background: url(../img/sprite.png) -200px -50px no-repeat; height: 40px; width: 40px; }

.nextButton, .nextButton:active
{
	background: url(../img/sprite.png) 0 0 no-repeat;
	border: solid 0px black;
	color: #FFF;
	cursor: pointer;
	height: 50px;
	font-family: 'Trebuchet MS';
	font-size: 14px;
	font-weight: bold;			
	text-transform: uppercase;
	width: 148px;
}

.prevButton, .prevButton:active
{
	background: url(../img/sprite.png) -148px 0px no-repeat;
	border: solid 0px black;
	color: #FFF;
	cursor: pointer;
	height: 50px;
	font-family: 'Trebuchet MS';
	font-size: 14px;
	font-weight: bold;
	padding: 0px;
	text-align: center;
	text-indent: -8px;
	text-transform: uppercase;
	width: 148px;
}

.nextButton:hover 
{
	background: url(../img/sprite.png) -296px 0px no-repeat;
	border: solid 0px black;
	color: #003366;
	cursor: pointer;
	height: 50px;
	font-family: 'Trebuchet MS';
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	width: 148px;
}

.prevButton:hover 
{
	background: url(../img/sprite.png) -444px 0 no-repeat;
	border: solid 0px black;
	color: #003366;
	cursor: pointer;
	height: 50px;
	font-family: 'Trebuchet MS';
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	text-indent: -8px;
	text-transform: uppercase;
	width: 148px;
}

#OfflineLogo
{
	background: url(../img/sprite.png) no-repeat -255px -90px;
	height: 110px; 
	margin: 0px auto; 
	text-align: center; 
	width: 215px; 
}
/*%%%%%%%%%%%%%%%%%%%%		Sprite Styles		%%%%%%%%%%%%%%%%%%%%*/

/*%%%%%%%%%%%%%%%%%%%%		Loading Panel Styles		%%%%%%%%%%%%%%%%%%%%*/
.loading {
    display: none;
    border: 1px solid #5c9ccc;
    padding: 2px;
    background-color: #5c9ccc;
    color: #ffffff;
    opacity: 0.90;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    width: 220px;
    height: 50px;
    text-align: center;
    z-index: 100000;    
    margin: 20px auto 0px auto;
	font-family: 'Trebuchet MS';
	font-size: 14px;
	font-weight: bold;
}
/*%%%%%%%%%%%%%%%%%%%%		Loading Panel Styles		%%%%%%%%%%%%%%%%%%%%*/