@charset "utf-8";
/* CSS Document */

/* check the individual page for inline, do to the design I was unable use one style sheet */

/* MAIN STRUCTURE */
body			{background:url(../images/headerBg.png) repeat-x #f5f6f7; margin:0; font-family:Arial, Helvetica, sans-serif; overflow-x:hidden }
.wrapperUpper	{ position:relative; width:100%; z-index:2;}
.wrapperLower	{ position:relative; width:100%;  background:url(../images/lowerBg.png) #efefef repeat-x; z-index:1  }
.frameAC		{ position:relative; width:900px; left:-30px} .frame		{ position:relative; width:900px; left:-30px}
.mainContent	{ position:relative; top:-24px; text-align:left; padding:5px 25px; background:url(../images/glassThing.png) no-repeat top center; min-height:300px; z-index:2}
.lowerContent	{ position:relative; top:-24px; text-align:left; padding:15px 25px 5px;  min-height:400px; }
.shadow			{ text-shadow: black -0px -1px 0px;}
h1				{ line-height:30px;}
a:active		{ outline: none;}	:focus { -moz-outline-style: none;} a {outline: none; border:none} a img { border:none}

.orange				{ color:#ea413d;  font-weight:normal}	.orange:hover		{ text-decoration:underline; }
.green				{ color:#d7fd3f;  font-weight:normal}	.green:hover		{ text-decoration:underline; }

td, p {text-align:left;}


/* HEADER */
#header		{ position:relative; text-align:left; height:210px; margin:0px 0px 0px 0px; z-index:5 }
.logo			{ position:absolute; background:url(../images/logoBg.png) center no-repeat; width:100%; text-align:center; height:136px; left:30px}

.navFade		{ position:absolute; background:url(../images/navBg.png) no-repeat; width:150px; height:51px; left:-70px; top:135px;}
.navLeft		{ position:absolute; left:55px; top:135px; background:url(../images/navStretch.png) repeat-x; padding:0px 0px 0px 0px; height:51px; }
.navRight		{ position:relative; float:right; font-weight:bold; background:url(../images/tipFull.png) no-repeat; height:51px; padding-top:14px; padding-left:35px;}

.topNav			{ position:relative; color:#FFF; 
					height:51px; font-weight:bold; padding:15px 5px 35px 5px; margin-left:-5px; top:14px; }
.navLeft a		{ text-decoration:none;}
.tip			{ position:relative; float:right; top:0px;}
.bar			{ background:url(../images/dash.png) no-repeat right; padding-right:14px;}




/* LOGIN */
#loginbox 			{position:absolute; top:-230px; left:680px; z-index:5; color:#FFF; background:url(../images/loginBg.png) no-repeat;
						width:250px; height:100px; font-size:70%; }
#loginbutton		{position:relative; cursor:pointer; left:90px; top:-13px; z-index: 99;}
.loginbutton-up		{width:140px;height:64px;background:transparent url('../images/login-button_up.png') no-repeat;cursor:pointer;}
.loginbutton-up:hover	{background:transparent url('../images/login-button_down.png') no-repeat;}
.loginbutton-down	{width:140px;height:64px;background:transparent url('../images/login-button_down.png') no-repeat;cursor:pointer;}
.form 				{ position:relative; left:-130px; top:10px;}

#loginbox .smartyForm.label {  }
#loginbox .smartyForm .field {   }

#loginbox #username { font-size:90%; height:15px; width:120px }
#loginbox #password { font-size:90%; height:15px; width:120px}



/* FOOTER */
.wrapperFooter		{ position:relative; width:100%; z-index:2; background:url(../images/footerBg.png) top repeat-x #212121; }
#footer				{ position:relative; min-height:150px; text-align:left; padding:20px 40px 10px; color:#adadad; }
#footer a			{ color:#FFF; text-decoration:none; font-weight:bold; padding:0px 5px 0px 0px}
#footer a:hover		{ text-decoration:underline}
#footer a + a		{ border-left:2px solid #909090; padding:0px 5px 0px 7px}
.helpAC				{ font-family:Georgia,"Times New Roman", Times, serif; border-bottom:1px dotted #424242; padding:0px 0px 10px 0px; font-size:90%; }
.mailLogo			{ position:relative; top:8px;}

.footerLogin		{ position:absolute; width:297px; height:15px; background-color:#2c2c2c; top:37px; padding:3px 15px; 
						left:450px; font-size:70%; color:#adadad; font-family:Georgia,"Times New Roman", Times, serif;}
.footerLogin a		{ margin-left:10px;}		.footerLogin a + a		{ margin-left:0px;}
.siteNavigation		{ margin:10px 0px 0px}
.siteNavigation a	{ font-size:90%;}
#footer .siteNavigation a + a		{ border-left:1px solid #434343; padding:0px 5px 0px 7px}
.navTitle			{ margin-right:7px; font-size:75%; font-weight:bold;}

.footerMoreLinks	{ text-align:left;}
.footerMoreLinks a 	{ font-size:70%; margin-top:5px }
#footer .footerMoreLinks a + a		{ border-left:1px solid #434343; padding:0px 5px 0px 7px}
.copyright			{ position:relative; margin-top:30px;}
.disclaimer			{ font-size:60%; position:relative; margin-top:10px;}



/* SALES PAGE */
h1.top			{ position:relative; margin-top:30px; font-size:180%; margin-bottom:25px; letter-spacing:-1px; z-index:3; 
					color:#262626; text-shadow: white 0px 1px 0px;}
.sales			{ height:331px;}
.salesTag		{ position:relative; z-index:2; font-style:italic; font-family:Georgia,"Times New Roman", Times, serif; 
					line-height:18px;  color:#262626; left:-50px; }
.salesNote		{ position:relative; z-index:3; font-weight:bold; color:#5e5f60; font-size:70%; margin-top:25px; left:-50px; }
.highlight		{ background-color:#f5d22e; color:#000;}

.att			{ position:absolute;  width:704px; height:350px; top:22px; left:400px; overflow:hidden; z-index:1}
.joel			{ position:absolute;  width:704px; height:350px; top:22px; left:400px; overflow:hidden; z-index:1}
.trucker		{ position:absolute;  width:704px; height:350px; top:22px; left:400px; overflow:hidden; z-index:1}
.trippy			{ position:absolute;  width:704px; height:350px; top:22px; left:400px; overflow:hidden; z-index:1}
.mashable		{ position:absolute;  width:704px; height:350px; top:22px; left:400px; overflow:hidden; z-index:1}
.hammer			{ position:absolute;  width:704px; height:350px; top:22px; left:400px; overflow:hidden; z-index:1}
.cursor			{ cursor:pointer}

.whiteGlow		{ position:absolute;  width:387px; height:150px; top:9px; left:420px;  background:url(../images/whiteGlow.png);}

.brandsTag		{ font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:125%; 
					background:url(../images/hr.png) no-repeat bottom left; padding:15px 0px 25px; }
.logos			{ position:absolute; width:365px; height:94px; top:30px; left:560px; z-index:5; }
.active			{ position:absolute; width:119px; height:54px; top:30px; left:560px; }
.iphoneLayer	{ position:relative; width:912px; height:340px; left:-20px;}

.salesButtons	{ position:relative; width:460px; height:75px; left:-15px; margin-top:20px; z-index:5}
.tour			{ margin-left:-10px;}



/* WHO PAGE */
.lowerCallTag  	{ font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:125%; 
					background:url(../images/hr.png) no-repeat bottom left; padding:20px 0px 38px; text-align:center; }
.logoBar		{ position:relative; width:900px; height:65px; top:-15px; left:0px; z-index:5; text-align:center; background:url(../images/hr.png) no-repeat bottom left; }
.logoBar a		{ margin:0px 10px 0px 10px}
.reviews		{ position:relative; width:900px; margin-top:40px; left:5px;}
.review			{ position:relative; width:450px; float:left; height:180px; }
.title			{ position:relative; font-family:Helvetica, Arial, sans-serif; font-weight:bold; font-size:110%; 
						color:#262626; text-shadow: white 0px 1px 0px; width:450px; }
.contentAC		{ position:relative; font-family:Georgia, "Times New Roman", Times, serif; font-size:95%; width:395px; color:#1e1e1e; margin-top:5px;}
.writer			{ position:relative; font-family:Verdana, Geneva, sans-serif; font-size:75%; width:395px; color:#1e1e1e; font-style:italic;  margin-top:7px;}
.whoLogoBar		{ position:relative; background:url(../images/whoLogoBar.png); width:840px; height:71px; margin-top:-10px;}
.ourProducts	{ margin:3px 0px 0px}


/* EXTRA PAGE background-color:#4699eb */
/* check the individual page for inline, do to the design I was unable use one style sheet. */
/* Specifiacally the large ../images in the upperWrapper, these have backgrounds set in the actual page. */
.top_image		{ position:relative; width:1050px; margin:-23px 0px -23px -95px;  height:370px}
.computer		{ position:absolute; width:411px; height:403px; top:40px; left:460px;}
.extras			{ position:relative; width:798px; height:497px; background-color:#e5e5e5; margin:40px 0px 25px;}
.soon			{ position:absolute; top:-25px; left:-22px;}
.extra			{ position:relative; width:398px; height:130px; background:url(../images/extraLine.png) no-repeat bottom left; padding-left:7px;
					left:50px; top:50px; margin-bottom:20px; text-shadow: white 0px 1px 0px;}
.smallItalic	{ position:relative; font-family:Verdana, Geneva, sans-serif; font-size:75%; width:395px; color:#787878; font-style:italic;  margin-top:7px;}
.extraLogoBar	{ position:relative; text-align:center; left:-20px; margin:5px 0px -25px} .extraLogoBar a {margin:0px 9px}
.complete		{ position:relative; left:253px; top:-15px;}



/* WHO PAGE */
.orderForm		{ position:relative; text-align:left;}
.orderForm h2	{margin:0px}
.orderForm h3	{margin:0px; position:relative; font-family:Helvetica, Arial, sans-serif; font-weight:bold; font-size:110%; color:#1e1e1e; width:450px;}


/* Plans and Pricing */
.buyTitle			{margin:0px 0px 0px 0px; font-family:Georgia, "Times New Roman", Times, serif;}
.buyDesc			{margin:0px 0px 0px 0px; color:#5e5f60; font-size:70%; clear:both;}
.recommended img	{position:absolute; }
.recommended h3		{ position:relative; left:50px; top:10px; margin-bottom:25px;}
.buyform th			{ color:#5e5f60;}

/* ALEARTS */
#message		{ position:relative; left:50px; }

.textBlock 		{padding:20px 10px; background-color:#efefef; font-size:90%; font-family:Georgia, "Times New Roman", Times, serif;}
.textBlock p	{ padding:5px 0px; margin: 4px 0px 5px 20px;}

.icons			{ width:350px}
.icons img		{ padding:2px 5px 3px 0px}
.notSelected	{filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5;}
.appIcon		{ position:absolute; left:100px; top:1180px;}
.text-lightgrey	{ display:none}



/* LOGIN */
#thanks			{position:relative; top:-0px; left:0px; z-index:5; color:#000; background:#c3cfdc ;
						width:300px; font-size:70%; height:160px;  }
#thanks	h4		{margin:0px 0px 0px 30px; font-size:120%;}
#loginbutton		{position:relative; cursor:pointer; left:90px; top:-13px; z-index: 99;}
.loginbutton-up		{width:140px;height:64px;background:transparent url('../images/login-button_up.png') no-repeat;cursor:pointer;}
.loginbutton-up:hover	{background:transparent url('../images/login-button_down.png') no-repeat;}
.loginbutton-down	{width:140px;height:64px;background:transparent url('../images/login-button_down.png') no-repeat;cursor:pointer;}
#thanks .form 				{ position:relative; left:-50px; top:10px;}

#thanks .smartyForm.label {  }
#thanks .smartyForm .field {   }

#thanks #username { font-size:90%; height:15px;  }
#thanks #password { font-size:90%; height:15px;}




@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari 3.0 and Chrome rules here */
.navRight		{ padding-top:16px; padding-left:35px; top:-18px;}

}