/**************************************/
/****    Presto Champion base CSS  ****/
/**************************************/




/**************************************/
/*****        Common Classes      *****/
/**************************************/
.fleft			{float: left;}
.fright			{float: right;}
.clear			{clear: both;}
.bolder			{font-weight: bolder;}
.lighter		{font-weight: lighter;}
.oblique		{font-style:  italic;}
* html .lighter	{font-weight: lighter;}
.hand			{cursor: pointer;}
.oneSixtyWidth	{width: 160px;}
.oneThirtyWidth	{width: 130px;}
.oneTwentyWidth	{width: 120px;}
.oneHunWidth	{width: 100px;}
.noPadding		{margin: 0px; padding: 0px;}
.errorText,
.reqf			{font-weight: bold; color: #990000;}
.formDesc		{font: lighter 13px "Arial", Tahoma, sans-serif; color: #666; display: block; width: 300px;}
.formText		{font: lighter 11px "Arial", Tahoma, sans-serif; color: #666;}
.relative		{position: relative;}
.hidden			{display: none;}
.greyed			{background: red;}
			
form			{margin: 0px; padding:0px;}
sup				{font-size: 7pt; }

.warning				{border: 1px solid red; background: #CCC; display: none;}
.statusError			{color: #FF0000; font-weight: bold; }
.serverErrorStatus		{padding: 0px 15px 0px 0px; margin-bottom: 10px;}
.serverErrorStatus h2	{font: bold 15px "Arial", Tahoma, sans-serif; color: #990101; margin: 0px; padding: 0px; border-bottom: 2px solid #990101; }
.serverErrorStatus ul	{margin: 0px; padding: 0px;}
.serverErrorStatus li	{font: 13px "Arial", Tahoma, sans-serif; color: #990101; list-style: none; padding:0px; margin: 0px;}
.inputArea .serverErrorStatus		{padding: 0px 45px 0px 0px; margin-bottom: 10px;}




/**************************************/
/*****       Modal dialogue       *****/
/**************************************/
#modalLayer				{background: #333;  position: absolute; left: 0px; top: 0px; width: 5px; height: 5px; overflow: hidden;}

.modalBackdrop0			{filter:alpha(opacity=0);}
.modalBackdrop10		{filter:alpha(opacity=10);}
.modalBackdrop20		{filter:alpha(opacity=20);}
.modalBackdrop30		{filter:alpha(opacity=30);}
.modalBackdrop40		{filter:alpha(opacity=40);}
.modalBackdrop50		{filter:alpha(opacity=50);}
.modalBackdrop60		{filter:alpha(opacity=60);}
.modalBackdrop70		{filter:alpha(opacity=70);}
.modalBackdrop80		{filter:alpha(opacity=80);}
.modalBackdrop90		{filter:alpha(opacity=90);}
.modalBackdrop99		{filter:alpha(opacity=99);}

#modalBoxContainer		{
	border: 1px solid #333;
	background: #FFF;
	width: 700px; 
	height: 400px;
	position: absolute; 
	left: -999;
	z-index: 2;
	display: none;
	overflow: hidden;
}

#modalBox				{border-top: 10px solid #ACD371; padding: 20px; text-align: left;}
#modalBox h1			{color: #9D4A49; font: normal 18px "Arial", Tahoma, sans-serif; text-align: left; width: 250px; float: left;}

#modalBox #closeButton	{width: 50px; float: right;}
#modalBox #closeButton a{
	font: normal 11px "Arial", Tahoma, sans-serif; 
	display: block; 
	padding-right: 25px; 
	width: 20px;
	color: #333; 
	text-decoration: none; 
	background: url(../Images/IconSprite.gif) -158px -197px;
}

#modalBox img		{float: left;}
#modalBox #styleDescContainer	{
	width: 240px; 
	padding: 30px 15px 0 0;
	font: normal 13px "Arial", Tahoma, sans-serif; 
	color: #333;
	float: right;
}

#modalBox #styleDescContainer blockquote {font-weight: bold; margin: 0px; padding: 3px;}


/**************************************/
/*****      Billing Control       *****/
/**************************************/
#billingTable td						{padding: 5px 3px 5px 3px;}
#billingTable .seperator td				{padding-top: 12px; border-top: 1px solid #DDD;}

#servicePlanContainer					{padding: 30px 45px 30px 30px;}
#servicePlanSelect						{padding-left: 30px;}
#servicePlanSelect ul					{margin: 0px; padding: 0px; list-style: none;}
#servicePlanSelect li					{margin: 0px 0px 15px 0px; padding: 0px; list-style: none; font: normal 13px "Arial", Tahoma, sans-serif; color: #333;}
#servicePlanSelect li h3				{font: normal 18px "Arial", Tahoma, sans-serif; display: inline; margin: 0px; padding: 0px; }
#servicePlanSelect li div				{padding-left: 20px;}
#servicePlanSelect li div em			{font-size: 12px;}
#servicePlanSelect .altMessage			{font: normal 13px "Arial", Tahoma, sans-serif;}

#promoCodeContainer						{padding: 10px; margin: 15px 0 0 30px; width:480px; border-top: 1px solid #CCC;}
#promoCodeContainer	h3					{font: normal 18px "Arial", Tahoma, sans-serif; margin: 0px; padding: 0px; }

.billingCollapseContainer				{border: 1px solid #CCC; height: 40px; overflow: hidden; margin-bottom: 10px; width: 520px;}
.billingCollapseContainer table			{width: 520px;}
.billingCollapseContainer td			{font: lighter 13px "Arial", Tahoma, sans-serif; color: #333; padding: 5px 3px 5px 3px;}
.billingCollapseContainer #servicePlanSelect
										{padding-left: 0px;}


/**************************************/
/*****		  Billing Info        *****/
/**************************************/
#billingInfoWinContainer {
	width: 450px; 
	padding: 30px; 
	padding-top: 15px;
	margin-left: auto; 
	margin-right: auto; 
	margin-top: 15px;
	text-align: left; 
	background: #FFF; 
	border: 1px solid #CCC;
}

#billingInfoWinContainer p			{font: normal 13px "Arial", Tahoma, sans-serif; color: #333;}
#billingInfoWinContainer p strong	{color: #6D3F98; margin: 0px; font-size: 16px; }
#billingInfoWinContainer .copyright	{font: normal 11px "Arial", Tahoma, sans-serif; color: #6D3F98; float: left; width: auto;}

/**************************************/
/*****            Icons           *****/
/**************************************/
.addIco			{width: 13px; height: 9px; background: url(../Images/IconSprite.gif) -100px -200px;}




/**************************************/
/*****        font size           *****/
/**************************************/
.tsMedium label	{font-size: 12px; margin:0px; padding: 0px;}
.tsLarge  label	{font-size: 17px; margin:0px; padding: 0px;}
.tsLarger label	{font-size: 22px; margin:0px; padding: 0px;}
.tsXtraLg label	{font-size: 24px; margin:0px; padding: 0px;}




/**************************************/
/*****      Basic Page Layout     *****/
/**************************************/
body					{text-align:center; padding:0px; margin:0px; background: #ACD371 url(../images/green_bgGradient.gif) top left repeat-x;}
#outerContainer			{margin: auto; width: 819px; text-align: left; background: url(../images/green_bgTile.gif) top left repeat-y; position: relative;}

#pageContainer			{background: url(../images/green_bgHeader.jpg) top left no-repeat; padding-left: 76px; padding-right: 76px; position: relative;}
#pageContainer .logo	{float: left; margin: 29px 0px 0px 0px;}	

#headerContainer		{height: 85px; padding: 15px 0 0 0;}
#welcomeContainer		{margin: 58px 0px 0px 10px; float: left; width: 360px; overflow: hidden;}
#welcomeContainer h1	{color: #6D3F98; margin: 0px; font: normal 21px "Arial", Tahoma, sans-serif; width: 400px;}
#bodyContainer			{margin-top: 15px;}

#footerContainer		{background: #ACD371 url(../Images/green_bgFooter.jpg) top left no-repeat; padding: 15px; margin: 0px;}
#copyright				{font: normal 11px "Arial", Tahoma, sans-serif; color: #6D3F98; float: left; width: auto;}
#copyright a			{color: #6D3F98;}
#copyright sup			{font-size: 6px;}
html* #copyright sup	{/* damn you IE */ display: inline-block; padding-bottom: 3px; }

#footerNav				{}
#footerNav ul			{list-style: none; margin: 0px; padding: 0px;}
#footerNav ul li		{float: left; display: block; margin: 0px;  margin-left: 15px; color: #6D3F98;}
#footerNav ul li a		{font: normal 12px "Arial", Tahoma, sans-serif; color: #6D3F98; }




/**************************************/
/*****      Name Reservation      *****/
/**************************************/
#chooseEmailAddress #userNameStatus		{position: relative; width: 280px; margin-left: 100px;}
#setupUsernameTable #userNameStatus		{}
#userNameStatus div						{padding: 5px 2px 10px 0px; margin-top: 0px; width: auto;}
#userNameStatus div span				{font: normal 13px "Arial", Tahoma, sans-serif; color: #333;}

#userNameStatus .good					{}
#userNameStatus .good span				{color: #003300; font-style:italic;}
#userNameStatus .taken					{/*border: 1px solid #990000; background: #CD8886; */}
#userNameStatus .taken span				{color: #990000; font-style:italic;}
#userNameStatus .progress				{border: none; background: none;}

#userNameStatus #resultIcon				{width: 16px; height: 16px; float: left; margin-right: 3px;}
#userNameStatus .good  #resultIcon		{background: url(../Images/IconSprite.gif) -100px -150px;}
#userNameStatus .taken #resultIcon		{background: url(../Images/IconSprite.gif) -100px -175px; width: 18px; height: 17px;}
#userNameStatus .progress #resultIcon	{background: url(../Images/progress_anim.gif) top left no-repeat;}

#addNewEmailContainer #userNameStatus div	{padding: 5px 10px 5px 10px; margin: 4px 0px 0px 140px; width: 250px;}




/**************************************/
/*****            Login           *****/
/**************************************/
#loginMessaging							{width: 430px; float:left;  margin-right: 20px; }

#loginMessaging	h1						{font: normal 28px "Arial", Tahoma, sans-serif; color: #DF7A1C; margin-bottom: 20px}
/* hack for IE 6 */
html* #loginMessaging h1 sup			{display: inline-block; font-size: 10pt; padding-bottom: 7px;}

#loginMessaging	h3						{font: normal 18px "Arial", Tahoma, sans-serif; color: #556292; margin-bottom: 15px}	
#loginMessaging ul						{}
#loginMessaging li						{font: normal 15px "Arial", Tahoma, sans-serif; color: #556292;}

#LoginControlContainer					{width: 200px;}
#LoginControlContainer h2				{font: normal 16px "Arial", Tahoma, sans-serif; color: #556292; padding: 0px; margin: 0px;}
#LoginControlContainer a				{font: normal 12px "Arial", Tahoma, sans-serif; color: #556292; text-align: right; display: block; margin-top: 5px;}
#LoginControlContainer #loginBox		{background: #F0F1F2; border: 1px solid #C9D0D4; padding: 5px 15px 15px 15px;}
#loginBox .loginBlock					{margin-top: 10px;}
#loginBox .loginBlock span				{display: block; font: normal 13px "Arial", Tahoma, sans-serif; color: #333;}
#loginBox .loginBlock input				{font: normal 13px "Arial", Tahoma, sans-serif; color: #333; width: 160px;}
#loginBox  label						{font: normal 12px "Arial", Tahoma, sans-serif; color: #666;}
#loginBox .buttonContainer				{text-align: center; margin-top: 10px;}
#loginBox .errorText					{font: normal bolder 13px "Arial", Tahoma, sans-serif;}
#loginForm .signUpLink					{display: block; margin-top:15px; font: normal 13px "Arial", Tahoma, sans-serif;}
#loginForm .signUpLink a				{display: inline; font-size: 13px;}



/**************************************/
/*****           Legal            *****/
/**************************************/
.legalBody				{text-align:center;}
#legalContainer			{width: 600px; border: 1px solid #CCC; background:#FFF; margin: auto; padding: 20px; text-align:left;}
#legalContainer h2		{font: normal 20px "Arial", Tahoma, sans-serif; color: #556292; padding: 0px; margin: 0px;}
#legalContainer p		{font: normal 13px "Arial", Tahoma, sans-serif; color: #333;}
#legalContainer li		{font: normal 13px "Arial", Tahoma, sans-serif; color: #333;}




/**************************************/
/*****       Support (CSI)        *****/
/**************************************/
#deviceLogContainer				{width: 650px; height:400px; border: 1px solid #CCC; overflow: scroll;}

#eventLogTable td, 
#eventLogTable th				{font: 11px 'Lucida Console' , Monospace; color: #000; padding: 1px; border-right: 1px solid #CCC;}
#eventLogTable th				{font-weight: bolder;}


/**************************************/
/*****         xSelect            *****/
/**************************************/
.xSelect						{}
.xSelect, .xSelect ul			{padding: 0; margin: 0; list-style: none; line-height: 1;}
.xSelect a						{display: block; width: 10em; text-decoration: none;}
.xSelect li						{float: left; font: 13px "Trebuchet MS"; width: 10em; background: url(pull.gif) top right no-repeat;}
.xSelect li span				{display: block; border: 1px solid #CCC;}
.xSelect li ul					{position: absolute; width: 10em; left: -999em; border: 1px solid red; background: #FFF; z-index: 5;}
.xSelect li ul li				{border-top: 1px solid #EEE; border-left: none; border-right: none; border-bottom: none; background-image:none; }
.xSelect li ul li a:hover		{background: #F7F7F7;}
.xSelect li ul .selected		{background: red;}

#maxiDeviceContainer.xSelect		{}
#maxiDeviceContainer.xSelect li		{
	font: bold 15px "Arial", Tahoma, sans-serif;
	color: #9D4A49;
	background: #E1E7EA url(../Images/xSelectDownArrow.gif) top right no-repeat;;
	border: 1px solid #556292;
}

#maxiDeviceContainer.xSelect li ul {
	border: 1px solid #556292;
	background: #E1E7EA;	
}

#maxiDeviceContainer.xSelect li ul li {
	background-image: none;
	border: none;
	color: #556292;
	font-size: 14px;
	padding: 3px;
}
#maxiDeviceContainer.xSelect ul a				{color: #556292;}
#maxiDeviceContainer.xSelect li ul .selected a	{color: Blue; padding-left: 14px; background: url(../Images/xSelectCheckbox.gif) top left no-repeat;}
#maxiDeviceContainer.xSelect li ul li.alert		{background: #BE8285;} 
#maxiDeviceContainer.xSelect li ul li.alert	a	{color: #FFF;} 






/**************************************/
/*****          Buttons           *****/
/**************************************/
.buttonContainer				{margin: 2px 0px 1px 0px; padding: 1px; }
.buttonContainer #mSubmit		{width: 130px;}
.buttonContainer .oneSixtyWidth {width: 160px;}
.buttonContainer .oneHunWidth	{width: 100px;}

.saveCancelButtons				{margin-top: 10px;}

.submitButton	{
	border: 1px solid #654898;
	margin: 0px;
	padding: 1px 10px 1px 10px;
	background: #A387D4 url(../images/xButtonBg.gif) top left repeat-x;
	font: bolder 13px "Arial", Tahoma, sans-serif;
	color: #FFF;
	cursor: pointer;
	width:auto;
	overflow:visible;
}
* html .submitButton{padding: 1px 3px 1px 3px;} /* hack for ie, and it's weird button widths */
.submitButton:hover	{background: #A387D4 url(../images/xButtonBg.gif) -80px 0px repeat-x;}
.submitButton:active{border: 1px solid #FF0000;}

.medButton	{
	border: 1px solid #654898;
	margin: 0px;
	padding: 0px 10px 0px 10px;
	background: #A387D4 url(../images/xButtonBg.gif) top left repeat-x;
	font: bolder 12px "Arial", Tahoma, sans-serif;
	color: #FFF;
	cursor: pointer;
	width:auto;
	overflow:visible;
}
* html .medButton	{padding: 0px;} /* hack for ie, and it's weird button widths */
.medButton:hover	{border: 1px solid #999;}
.medButton:active	{border: 1px solid #FF0000;}

.smallButton	{
	border: 1px solid #654898;
	margin: 0px;
	padding: 0px 4px 0px 4px;
	background: #A387D4 url(../images/xButtonBg.gif) top left repeat-x;
	font: bolder 11px "Arial", Tahoma, sans-serif;
	color: #FFF;
	cursor: pointer;
	width:auto;
	overflow:visible;
}
.smallButton:hover	{border: 1px solid #999;}
.smallButton:active	{border: 1px solid #FF0000;}

.disabledButton		{background-image: url(../Images/xButtonDisabledBg.gif); cursor: wait;}


/**************************************/
/*****        Error Page          *****/
/**************************************/

#mErrorContainer h3		{font: bold 16px "Arial", Tahoma, sans-serif; color: #333; padding: 0px; margin: 0px;}
#mErrorContainer code	{font: normal 11px "Lucida Console", Monospace; color: #000;}