/* CSS Document */

/*
    SS
*/

body {
	background-color: #adb8cc; /*#B5BDD2;*/
	background-repeat: repeat-x;
	text-align: center;  /* IE */
	font-family: verdana, arial, sans-serif;
	font-size: 80%;
	padding: 25px;
	color: #000;
}

form {
	margin: 0; padding: 0;
	border: 0 solid #fff;
}

input,
select,
textarea {
    font-family: verdana, arial, sans-serif;
    font-size: 100%;
}
input.textbox,
select,
textarea {
    border: 1px solid #3499cc;
}

.floatLeft
{
	float: left;
}

.floatRight
{
	float: right;
}

.hidden {
    display: none;
}

div.clearing {
    clear: both;
}

a,
a:link,
a:visited {
	color: #36c;
	text-decoration: underline;
}
a:hover {
	color: #00f;
}



img {
	border: 0;
	margin: 0;
	padding: 0;
}



p {
	margin: 0.8em 0;
	padding: 0;
	line-height: 130%;
}



th {
	font-weight: normal;
}



/*====== Main Template ======*/

div.centeringContainer {
    width: 780px;
    text-align: left;  /* Correct alignment */
    margin: 0 auto;  /* non IE */
    padding: 0;
}

div#outerContainer {
    float: left;
    width: 780px;
    background-color: #fff;
    margin: 0 0 20px 0;
    padding: 0;
}

/*====== end Main Template ======*/



/*====== Corners ======*/

div.cornerContainer {
    float: left;
    width: 780px;  /* Absolute width for MacIE */
    margin: 0;
    padding: 0;
}

div.cornerContainer  div.corner {
    float: left;
    width: 390px;  /* Absolute width for MacIE */
    height: 10px;
    font-size: 1%;
    margin: 0;
    padding: 0;
    background-repeat: no-repeat;
}

div#cornerTopLeft {
    background-image: url('../images/upperleft.png' );
    background-position: top left;
}
div#cornerTopRight {
    background-image: url('../images/upperright.png' );
    background-position: top right;
}
div#cornerBottomLeft {
    background-image: url('../images/lowerleft.png' );
    background-position: bottom left;
    background-color: #F2F2F2;
    
}
div#cornerBottomRight {
    background-image: url('../images/lowerright.png' );
    background-position: bottom right;
    background-color: #F2F2F2;
}

/*====== end Corners ======*/



/*====== Header ======*/

div#logo {
    float: left;
    width: 350px;
    margin: 10px 20px 15px 20px;
}

div#login {
	float: right;
	text-align: right;
	width: 350px;
	margin: 10px 10px 0 0;
}

div#login  a {
	color: #888;
	font-size: 110%;
	font-weight: bold;
	text-decoration: none;
}
div#login  a:hover {
    text-decoration: underline;
}

/*====== Header ======*/


/*====== Menu Bar ======*/

div#navbar {
    float: left;
	width: 763px;
	height: 24px;
	font-size: 15px;
	vertical-align: middle;
	margin: 0;
	padding: 7px 10px 0 7px;
	background-color: #F5F5F5;
	background-image: url('../images/navbarBg.jpg');
	background-repeat: repeat-x;
	border-top: solid 1px #b7becf;
	border-bottom: solid 1px #b7becf;
}

#navbar  ul {
    list-style-type: none;
    margin: 0;
	padding: 0;
}

#navbar  ul  li {
	float: left;
	margin-right: 41px;
	white-space: nowrap;
}

#navbar ul li.first
{
	margin-left: 9px;
}

#navbar  ul  li.last {
	margin-right: 0px;
}

#navbar  a {
	font-family: verdana, arial, sans-serif;
	font-size: 15px;
	font-weight: bold;
	text-decoration: none;
	color: #31A3EC;
}

#navbar  a:hover, #navbar a.active {
    text-decoration: underline;
	color: #35D500;
}

/*====== end Menu Bar ======*/



/*====== Content Area ======*/

div.columnLeft {
	float: left;
    width: 440px;
    background-color: #fff;
	margin: 16px 0 16px 16px;
	_margin-left: 8px;
}

* html div.columnLeft {
	float: left;
    width: 440px;
    background-color: #fff;
	margin: 16px 0 0px 16px;
	_margin-left: 8px;
}  

div.columnRight {
    width: 292px;
    padding: 16px 0 0 0;
    text-align: center;
    margin-left: 472px;
    margin-bottom: 16px;
}

* html div.columnRight {
    width: 292px;
    padding: 16px 0 0 0;
    text-align: center;
    margin-left: 468px;
    margin-bottom: 0px;
}

div.columnSingle {
    float: left;
    width: 700px;
    background-color: #fff;
	padding: 0 15px;
	margin: 15px 0 0 0;
}

/*====== end Content Area ======*/



/*====== Footer ======*/

* html div#footer /*Added to correct firefox problem */
{
		float: none;
    width: 780px;
    font-size: 90%;
    color: #000;
    background-color: #f2f2f2;
    margin: 0;
    padding: 0;
		border-top: 1px solid #e4e4e4;
}

 div#footer 
{
		float: left;
    width: 780px;
    font-size: 90%;
    color: #000;
    background-color: #f2f2f2;
    margin: 0;
    padding: 0;
		border-top: 1px solid #e4e4e4;
}

div#footer  a {
    color: #3D55C5;
}

/*div#footer .hiring  {
    float: left;
    width: 400px;
    text-align: left;
    padding: 3px 0 6px 19px;
    background: url(../images/footerLeft.gif) no-repeat 0 bottom;
}*/

div#footer  .copyright,
div#footer  div#utilityMenu 
{
	font-weight: normal;
    float: left;
    width: 360px;
    margin: 0;
    padding: 15px 15px 5px 15px;
}

div#utilityMenu  ul {
    display: block;
    list-style-type: none;
    text-align: right;
    margin: 0; padding: 0;
}

div#utilityMenu  li {
    display: inline;
    padding-left: 1em;
}

/*====== end Footer ======*/


.textMiddle
{
	text-align: center;
}

#replacement
{
	width: 163px;
	height: 23px;
	margin: 0;
	padding: 0;
	border: 0;
	background: url('../images/submit.png') no-repeat center top;
	text-indent: -1000em;
	cursor: pointer; /* hand-shaped cursor */
	cursor: hand; /* for IE 5.x */
}






.mainText
{
	margin: 0px 30px 0px 0px;
}






/*====== Blue container ======*/

div.columnTop  {
	float: left;
    width: 440px;
    padding: 0 0 15px 0;
}

div.columnTop1  {
	/*float: left;*/
    width: 440px;
    margin: 0px 0 0 0;
    padding: 10px 0 0 0;
    background: url('../images/main/mainbg.jpg');
}


/*
 *  Set defaults to simplify rulesets below
 */
.middleBlue,
.upperleftBlue,
.upperrightBlue,
.lowerleftBlue,
.lowerrightBlue {
    float: left; width: 100%;
    margin: 0; padding: 0;
    background-repeat: no-repeat;
	z-index: 0;
}

.middleBlue {
    background-image: url('../images/backgrounds/blue.png');
    background-repeat: repeat;
}

.upperleftBlue {
	background-image: url('../images/upperleftBlue.png');
	background-position: top left;
}

.upperrightBlue {
	background-image: url('../images/upperrightBlue.png');
	background-position: top right;
}

.lowerleftBlue {
	background-image: url('../images/lowerleftBlue.png' );
	background-position: bottom left;
}

/*
 *  This contains the actual text
 */
.lowerrightBlue {
    width: 420px;
    padding: 10px;
    font-size: 120%;
    color: #fff;
	text-align: center;
	background-image: url('../images/lowerrightBlue.png');
	background-position: bottom right;
}

.lowerrightBlue  h1 
{
    font-size: 100%;
    font-weight: normal;
    color: #fff;
    padding: 0px;
    margin: 0px;
}

/*
 *  DELETE THIS???
 */
.middle {
	margin: 0 0 0 38.5px;  /* Where d'you get a half-pixel from?! */
}

/*====== Blue container ======*/


div.containerTopLeft
{
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/containerTopLeft.png');
	width: 10px;
	height: 10px;
	float: left;
}

div.containerTopLeft[class]
{
	background-image : url('../images/containerTopLeft.png');
	background-repeat: no-repeat;
}

div.containerTopRight
{
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/containerTopRight.png');
	width: 10px;
	height: 10px;
	float: right;
}

div.containerTopRight[class]
{
	background-image : url('../images/containerTopRight.png');
	background-repeat: no-repeat;
}

div.containerBottomLeft
{
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/containerBottomLeft.png');
	width: 10px;
	height: 10px;
	float: left;
}

div.containerBottomLeft[class]
{
	background-image : url('../images/containerBottomLeft.png');
	background-repeat: no-repeat;
}

div.containerBottomRight{
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/containerBottomRight.png');
	width: 10px;
	height: 10px;
	float: right;
}

div.containerBottomRight[class]
{
	background-image : url('../images/containerBottomRight.png');
	background-repeat: no-repeat;
}

div.containerContent
{
	padding: 10px 10px 0 10px;
}

div.containerContent h2
{
	color: #666666;
	margin: 0;
}

div.containerPink, div.containerGreen
{
	background-repeat: repeat;
	padding-bottom: 10px;
	margin: 0px 0 16px 0;
	text-align: left;
	
}

div.containerPink
{
	background-image : url('../images/backgrounds/pink.png');
}

div.containerGreen
{
	background-image : url('../images/backgrounds/lightGreen.png');
}

div.circleTick
{
	width: 32px;
	height: 25px;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/tick_circle.png');
}

div.circleTick[class]
{
	background-image: url('../images/tick_circle.png');
	background-repeat: no-repeat;
}

div.littleList  ul
{
	font-size: 10px;
	margin-left: 20px;
	padding: 0;
}

div.littleList  ul  li
{
	margin: 5px 0 5px 0;
	padding: 0;
}

div.littleList p
{
    margin: 0;
}


/*main container*/
.upperleftMain
{
	margin: 10px 0 0 0;
	width: 100%;
	text-align: left;
	background-color: #E5E5E5;
	color: #000000;
	text-align: justify;
	background-image: url('../images/main/upperleftMain.png' );
	background-repeat: no-repeat;
	background-position: top left;
}

.upperrightMain
{
	background-image: url('../images/main/upperrightMain.png' );
	background-repeat: no-repeat;
	background-position: top right;
}

.lowerleftMain
{
	background-image: url('../images/main/lowerleftMain.png' );
	background-repeat: no-repeat;
	background-position: bottom left;
}

.lowerrightMain
{
	background-image: url('../images/main/lowerrightMain.png' );
	background-repeat: no-repeat;
	background-position: bottom right;
	padding: 2% 2% 2% 2%;
	font-size: 95%;
}

/* redo the CSS... */
.mainContent 
{
    width: 440px;
    text-align: center;
}
.mainContent p 
{
    background: url('../images/main/mainbottom.jpg') no-repeat bottom left;
    padding: 10px;
    margin: 0 0 0 0;
    text-align: justify;
}

/* New CSS 24-03-06 */
.text
{
	width: 150px;
	border: 1px solid #7F9DB9;
}

#screenshotThumb
{
	margin-left: 10px;
}

div#ctl00_Content_UpdateProgress
{
	float: left;
}

.updatingPrice div
{
	display: inline;
	float: left;
}

.button
{
    margin-bottom: 16px;
}

.first
{
	
}

div.fullWidth
{
	width: 100%;	
}

h1
{
	font-family: verdana, arial, sans-serif;
	color: #666666;
	font-size: 230%;
	font-weight: bold;
	margin: 0 0 23px 0;
}

h2
{
	color: #31A3EC;
	font-size: 140%;
	font-weight: normal;
	margin: 0 0 20px 0;
}

h3
{
	color: #666666;
	margin: 0px;
	font-size: 120%;
}

h3 img
{
	vertical-align: middle;
	margin-right: 9px;
}

p.howItWorksStep
{
	margin-bottom: 20px;	
}

table.packages
{
	border-collapse: collapse;
	border: solid 1px #DADFE9;
	background-color: #F5F7FA;
	width: 750px;
}

table.packages td, table.packages th
{
	border-collapse: collapse;
	border: solid 1px #DADFE9;
	padding: 5px 0 5px 0;
}

table.packages td
{
	text-align: center;	
}

table.packages th.packageName
{
	color: #0F669F;
	font-weight: normal;
	font-size: 150%;
	text-align: center;
}

table.packages th
{
	font-size: 90%;
	font-weight: bold;
	padding-left: 3px;
}

#signUpQuickSignUp
{
	color: #666;
	font-size: 120%;
	margin: 0 0 15px 0;
}

#signUpQuickSignUpSmall
{
	color: #666;
	font-size: 80%;
	margin: 0 0 15px 0;
}

.signUpWhichPackage
{
	font-size: 80%;
	text-align: right;
	padding: 0 0 10px 0;
	width: 749px;
}

.support
{
	font-size: 80%;
	text-align: left;
	padding: 0 0 10px 0;
	width: 749px;
}

h2.signUpSteps
{
	font-size: 195%;
	font-weight: normal;
	color: #666666;
}

h2.signUpSteps img
{
	vertical-align: middle;
	margin: 0 5px 0 5px;
}

span.signUpStepName
{
	color: #31A3EC;
}

td.price
{
	font-size: 120%;
	font-weight: bold;	
}

.textbox {
	width: 230px;	
}

.comingSoonKey
{
	color: #f00;
	font-size: 80%;
	padding: 10px 0 10px 0;
}



/*====== Product stuff =======*/

div.product
{
    width: 205px;
    height: 45px;
    float: left;
		padding: 6px 0px 6px 6px;

    
}

div.product h3  
{
    color: #FFF;
    font-weight: bold;
    font-size: 1.2em;
    margin: 0 0 5px 0;
    padding: 3px 5px; 
}

div.product h4
{
    font-size: 1em;
    font-weight: bold;
    color: #666;
    margin: 0 5px;
}

div.product p 
{
    text-align: left;
    margin: 1em 5px;
    font-size: 0.85em;
}

div.product p.link
{
    font-size: 0.91em;
    font-style: italic;
    text-align: right;
    color: #666;
}

div.clearing {
    clear: both;
}

div.lineHorizontal	{
width:425px;
height: 0px;
border-top: 2px solid #C4C4C4;
}

div.lineVertical	{
float: left;
width:2px;
height: 160px;
border-right: 2px solid #C4C4C4;

}

*  html #lineIE	{
margin: -28px 0px 0px 0px;
float: left;
width: 2px;
height: 195px;
border-right: 2px solid #C4C4C4;

}

/*	[stuart] added logo div */
div.logo {
height: 43px;
vertical-align: bottom;
margin: 0px;
padding: 0px; 
}

/*====== end Product stuff =======*/


/*====== Form stuff ======*/

div.formRow {
	float: left; width: 100%;
	margin: 0; padding: 0;
	margin-bottom: .5em;
}

div.formControlLabel {
    float: left;
    width: 260px;
    text-align: right;
    margin-right: 10px;
}

div.formControl {
	float: left;
	width: 422px;
	padding: 2px;
}

.formPackage {
    float: left;
    width: 422px;
    color: #666666;
    font-weight:bold;
}

div.submitRow {
    text-align: right;
}

span.mandatory {
	color: #f00;
}

div.notMandatorySpacer {
	margin: 0 4px 0 4px;
}

div.formRow input.textbox,
div.formRow select,
div.formRow textarea {
    width: 100%;
}

div.formControl input.checkbox {
	width: 15px;
	margin: 0; padding: 0;  /* CHANGE THIS??? */
}

/*====== End form stuff ======*/



/*====== Contact Us Page ======*/
/* [DanB] 2006-05-30, Added */

div#contactUsPage  div.contactForm {
    float: left; width: 440px;
    margin: 0; padding: 0;
}

div#contactUsPage  div.contactForm  div.formRow {
    margin-bottom: .5em;
}

div#contactUsPage  div.contactForm  input.textbox,
div#contactUsPage  div.contactForm  select {
    width: 272px;
}
/*
 *  In IE, this gets the SELECT the same width as the INPUTs
 */
div#contactUsPage  div.contactForm  select {
    width: 276px;
}

div#contactUsPage  div.contactForm  div.formControlLabel {
    width: 150px;
    text-align: left;
}

div#contactUsPage  div.contactForm  div.formControl {
    width: auto;
    padding: auto;
}

div#contactUsPage  div.contactForm  div.submitRow {
    text-align: right;
}

/*====== end Contact Us Page ======*/



/*====== Benefits Page ======*/

div#benefitsPage  ul {
float: left; width: 100%;
    list-style-type: none;
    margin: 0; padding: 0;
}

div#benefitsPage  ul  li {
float: left; width: 100%;
    margin: 0; padding: 0;
    margin-bottom: 1em;
}

div#benefitsPage  ul  li  h2,
div#benefitsPage  ul  li  p {
    margin: 0 0 .5em 0; 
    padding: 0;
}

/*====== end Benefits Page ======*/



/*====== why do we need this info page ======*/

li.padding {
margin-bottom: 1em;
}

/*====== end why do we need this info page ======*/
/*====== Privacy Policy & TOS Page ======*/
.pp_tos 
{
    float: left;
    background-color: #FFF;
    text-align: left;
}
/*====== end Privacy Policy & TOS Page ======*/
/*====== FAQ Page ======*/
.faq p
{
    padding: 0px 0px 20px 0px;
}
/*====== end Privacy Policy & TOS Page ======*/

/*==== package help page =====*/

h2#packageHelpHeading
{
	color: #31A3EC;
	font-size: 140%;
	font-weight: normal;
	margin: 20px 0 10px 0;
	padding: 0;
}

/*==== end package help page =====*/


/*==== what is it page ====*/

div#whatIsItPage h3
{
	color: Black;
	font-size: 110%;
}

/*==== end what is it page ====*/


div.lowerrightGreen p.quoteTxt
{
	font-size: 10px;
}

p.quoteTxt
{
	font-size: 10px;
}

div.lowerrightGreen
{
	_height: 155px;
	min-height: 155px;
}

div.featuresHead
{
	float: left;
	clear: both;
}

div.lowerrightPink
{
	height: 99px;
}

/*==== News page stuff ====*/

div#NewsContent  ul
{
	margin-left: 40px;
	padding: 0;
}

div#NewsContent  ul  li
{
	margin: 10px 0 10px 0;
	padding: 0;
}

div#NewsContent  p
{
	margin-bottom: 20px;
}
/*==== end of News page stuff ====*/



div.faqList  ul
{
	font-size: 10px;
	margin-left: 20px;
	padding: 0;
}

div.faqList  ul  li
{
	margin: 5px 0 15px 0;
	padding: 0;
	list-style-type: none;
}

div.faqList p
{
    margin: 0;
}