html { 
	background: url("/images/site_bg.gif") repeat top center;
	height:100%;
}

body { 
	margin: 0px;
	padding:0px;
	color:#333;
	height:100%;
	font: 14px/20px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; 
}
a:link {  color: #0059B4;}
a:active {  color: #0059B4; text-decoration: underline; }
a:hover {  color: #C38307; text-decoration: none; }
a:visited {  color: #0059B4;}

p, ul { margin:0px; padding-top:.5em; padding-bottom:.5em;text-align: left; }
dt { font-style: italic;font-weight: bold; }
dd { margin-bottom:10px; }
.font9 { font-size: 9px; line-height:1.25em; }
.font10 { font-size: 10px; line-height:1.25em; }
.font11 { font-size: 11px; line-height:1.25em; }
.font12 { font-size: 12px; line-height:1.25em; }
.font13 { font-size: 13px; line-height:1.25em; }
.font14 { font-size: 14px; line-height:1.25em; }
.font16 { font-size: 16px; line-height:1.25em; }
.font18 { font-size: 18px; line-height:1.25em; }
.font20 { font-size: 20px; line-height:1.25em; }
.gray { color: #666666; }
.bgwhite { background-color:#FFF; }
.bgoffwhite { background-color : #efefef; }
.center { text-align: center; }
.green { color: #47A528; }

/*********** start navigation bar ***********/
#headerApps { width: 848px; height: 48px; margin: auto; z-index: 9998;border:0px solid #999; }
#headerApps #nav { margin:0; padding:0; }
#headerApps #nav li { display: inline; }
#headerApps #nav li a { float:left;  height: 0; padding-top: 40px; overflow: hidden; }
#headerApps #nav li a, #headerApps { background-image: url(/images/main_nav-v2.png);  }

/* BUTTONS */
#headerApps #nav li#nav-home a { width: 107px; background-position: 0 0; }
#headerApps #nav li#nav-apps a { width: 105px; background-position: -107px 0; }
#headerApps #nav li#nav-support a { width: 122px; background-position: -212px 0; }
#headerApps #nav li#nav-news a { width: 105px; background-position: -334px 0; }
#headerApps #nav li#nav-contact a { width: 140px; background-position: -439px 0; }
/* OVER STATES */
#headerApps #nav li#nav-home a:hover { background-position: 0 -48px; }
#headerApps #nav li#nav-apps a:hover { background-position: -107px -48px; }
#headerApps #nav li#nav-support a:hover { background-position: -212px -48px; }
#headerApps #nav li#nav-news a:hover { background-position: -334px -48px; }
#headerApps #nav li#nav-contact a:hover { background-position: -439px -48px; }
/* PRESSED STATES */
#headerApps #nav li#nav-home a:active { background-position: 0 -96px; }
#headerApps #nav li#nav-apps a:active { background-position: -107px -96px; }
#headerApps #nav li#nav-support a:active { background-position: -212px -96px; }
#headerApps #nav li#nav-news a:active { background-position: -334px -96px; }
#headerApps #nav li#nav-contact a:active { background-position: -439px -96px; }
/* ON STATES */
#headerApps.home #nav li#nav-home a:hover { background-position: 0 -144px; cursor: default; }
#headerApps.business #nav li#nav-apps a:hover { background-position: -107px -144px; cursor: default; }
#headerApps.solutions #nav li#nav-support a { background-position: -212px -144px !important; }
#headerApps.studies #nav li#nav-news a { background-position: -334px -144px !important; }
#headerApps.iphone #nav li#nav-contact a { background-position: -439px -144px !important; }
/*********** end navigation bar ***********/

/*********** start navigation bar ***********/
#header { width: 848px; height: 48px; margin: auto; z-index: 9998;border:0px solid #999; }
#header #nav { margin:0; padding:0; }
#header #nav li { display: inline; }
#header #nav li a { float:left;  height: 0; padding-top: 48px; overflow: hidden; }
#header #nav li a, #header #anchor { background-image: url(/images/main_nav.png);  }

/* BUTTONS */
#header #nav li#nav-home a { width: 78px; background-position: 0 0; }
#header #nav li#nav-business a { width: 154px; background-position: -78px 0; }
#header #nav li#nav-solutions a { width: 153px; background-position: -232px 0; }
#header #nav li#nav-studies a { width: 153px; background-position: -385px 0; }
#header #nav li#nav-iphone a { width: 153px; background-position: -538px 0; }
#header #nav li#nav-contact a { width: 155px; background-position: -691px 0; }
/* OVER STATES */
#header #nav li#nav-home a:hover { background-position: 0 -48px; }
#header #nav li#nav-business a:hover { background-position: -78px -48px; }
#header #nav li#nav-solutions a:hover { background-position: -232px -48px; }
#header #nav li#nav-studies a:hover { background-position: -385px -48px; }
#header #nav li#nav-iphone a:hover { background-position: -538px -48px; }
#header #nav li#nav-contact a:hover { background-position: -691px -48px; }
/* PRESSED STATES */
#header #nav li#nav-home a:active { background-position: 0 -96px; }
#header #nav li#nav-business a:active { background-position: -78px -96px; }
#header #nav li#nav-solutions a:active { background-position: -232px -96px; }
#header #nav li#nav-studies a:active { background-position: -385px -96px; }
#header #nav li#nav-iphone a:active { background-position: -538px -96px; }
#header #nav li#nav-contact a:active { background-position: -691px -96px; }
/* ON STATES */
#header.home #nav li#nav-home a:hover { background-position: 0 -144px; cursor: default; }
#header.business #nav li#nav-business a:hover { background-position: -78px -144px; cursor: default; }
#header.solutions #nav li#nav-solutions a { background-position: -232px -144px !important; }
#header.studies #nav li#nav-studies a { background-position: -385px -144px !important; }
#header.iphone #nav li#nav-iphone a { background-position: -538px -144px !important; }
#header.contact #nav li#nav-contact a { background-position: -691px -144px !important; }
/*********** end navigation bar ***********/



/*********** start header ***********/
table.sectionheader {
	width:848px;
	height:170px;
	padding:0px;
	margin:10px auto;
	clear:both;
	border-spacing:0px;
	border-collapse:collapse;
}
table.sectionheader td.logo {
	width:217px;
	margin:0;
	padding:0;
	border:0px solid red;
}
table.sectionheader td.hero {
	width:631px;
	margin:0;
	padding:0;
	border:0px solid yellow;
}
/*********** end header ***********/

/*********** start wrapper and layout ***********/
#siteFrame {
	width: 882px; 
	margin:auto; 
	border:0px dotted #999; 
	padding-top: 10px;
}
.wrapper { 
	width:846px; 
	margin:auto; 
	border:0px solid #999; 
	clear:both; 
	margin-top:40px; 
	background-color:#FFF;
}
.wrapper_rounded {
	width:804px; 
	margin:auto; 
	padding:15px;
	padding-top:25px;
	border:1px solid #999; 
	clear:both; 
	margin-top:50px; 
	background-color:#FFF;
	-moz-border-radius: 15px;
	border-radius: 15px;
	-moz-box-shadow: 5px 5px 6px #666;
	-webkit-box-shadow: 5px 5px 6px #666;
	box-shadow: 5px 5px 6px #666;
}
.wrapper_rounded .wrapper_cap { 
	height:30px; 
	width:575px; 
	margin-left:-35px; 
	margin-top:-47px; 
	padding-left:20px; 
	padding-top:14px; 
	font-size:14px; 
	font-weight:bold; 
	background-image: url(/images/box/bubble.png); 
	vertical-align:middle; 
	float:left;
}
.wrapper .top { 
	height:14px; 
	background-image: url(/images/box/box_top.png);
}
.wrapper .top .bubble { 
	position:absolute; 
	height:30px; 
	width:575px; 
	margin-left:-25px; 
	margin-top:-21px; 
	padding-left:20px; 
	padding-top:14px; 
	font-size:14px; 
	font-weight:bold; 
	float:left; 
	background-image: url(/images/box/bubble.png); 
	vertical-align:middle; 
}
.middle table.tri {
	margin: 5px 0 0 -18px;
	padding:0px;
	border: 0px solid #666
}
.middle table.tri td.left {
	padding:0px;
	margin: 0px;
	width:228px;
	border: 0px solid #666
}
.wrapper .middle { 
	width:846px; 
	height:100%; 
	background: url('/images/box/box_middle.png') repeat-y; 
	border:0px solid #000; 
	clear:left; 
}
.wrapper .bottom { 
	height:13px; 
	background-image: url('/images/box/box_bottom.png');
}
.middle div.copy { 
	padding:30px 20px 0 20px; 
	clear:both; 
	overflow:auto;
}
div.sixtyfourty { 
	height:100%; 
	margin:0; 
	padding:0; 
	text-align:center;
}

div.fourty { 
	width:360px; 
	margin:0; 
	padding:0; 
	float:left; 
	text-align:center;
}
div.sixty { 
	width:478px; 
	margin-left:362px;
}
div.fourty img.hero { 
}
.grad125b { 
	background:#FFF url("/images/box/grad125b.png") repeat-x bottom left; 
}
.grad65b { 
	background:#FFF url("/images/box/grad65b.png") repeat-x bottom left; 
}
.threecolumn {
	background: #FFF url("/images/box/bg-3column.png") repeat-y top left;
}
table.std {
	border:1px #666 solid;
	border-spacing: 2px;
	/*empty-cells:hide;*/
	margin:10px auto;
	background-color:#CCC;
	-moz-border-radius: 8px;
}
table.std td {
	border:1px #666 solid;
	border-spacing: 5px;
	vertical-align:middle;
	padding:3px;
	background-color:#FFF;
	-moz-border-radius: 8px;
}
table.std th {
	border:1px #666 solid;
	border-spacing: 5px;
	vertical-align:middle;
	padding:3px;
	color:#666;
	background-color:#CBE86B;
	-moz-border-radius: 8px;
}

/*********** end wrapper and layout ***********/


/*********** start loading div ***********/
.loading {
	display: block;
	color: #999;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	padding: 6px;
	border: 1px solid #ccc;
	background-color: white;
	padding-left: 23px;
	background-image: url(/images/loading-sm.gif);
	background-repeat: no-repeat;
	background-position: center left;
}
.loadingLRG {
	font-size: 24px;
	padding: 6px;
	padding-left: 40px;
	background-image: url(/images/loading-lrg.gif);
}
/*********** end loading div ***********/


/*********** start scrollable ***********/
div.JTmain {
	position:relative;
	overflow:hidden;
	padding:0;	
	margin:auto;
}
div.JTmain div.JTpages {	
	/* this cannot be too large */
	width:20000em;	
	position:absolute;
	clear:both;		
	
	/* decoration */
	margin-left:0px;
}

/* single scrollable item on home page */
div.JTmain div.JTpages div.hm-scroll {
	float:left;
	
	/* custom decoration */
	text-align:left;
	width:430px;
	height:312px;	
	padding:10px 0px;
	border:0px solid #ccc;
	margin-right: 20px;	
	-moz-border-radius:5px;
	font-size:30px;
	line-height:.9em;
}
div.hm-scroll .highlight {
	font-size:1.25em;
	font-weight:bold;
	line-height:1em;
}
div.hm-scroll .reply {
	border:0px solid red;
	font-size:.8em;
	line-height:1.1em;
}

/* single scrollable item on three column page */
div.JTmain div.JTpages div.tre-scroll {
	padding:10px;
	height: 280px;
	background-color:#FFF;
	font-size:1.1em;
	width:370px;
}
/* active item */
div.tre-scroll div.active {
	border:3px inset #ccc;		
	background-color:#fff;
}

/* prev, next, prevPage and nextPage buttons */
a.prev, a.next, a.prevPage, a.nextPage {
	display:block;
	width:18px;
	height:18px;
	background:url(/images/scroll/arrow/left.png) no-repeat;
	float:left;
	margin:43px 10px;
	cursor:pointer;
	font-size:1px;
}

/* mouseover state */
a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover {
	background-position:0px -18px;		
}

/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
}

/* next button uses another background image */
a.next, a.nextPage {
	background-image:url(/images/scroll/arrow/right.png);
	clear:right;	
}
/*********** end scrollable ***********/



/********* start iphone app scrollable **********/
div.appmain div.apppages div.hm-scroll {
	float:left;
	
	/* custom decoration */
	text-align:left;
	width:340px;
	height:480px;	
	padding:10px 0px;
	border:0px solid #ccc;
	margin-right: 20px;	
	-moz-border-radius:5px;
	font-size:30px;
	line-height:.9em;
}

/* single scrollable item on three column page */
div.appmain div.apppages div.tre-scroll {
	padding:10px;
	height: 480px;
	background-color:#FFF;
	font-size:1.1em;
	width:340px;
	border:0px solid red;
}
/* active item */
div.tre-scroll div.active {
	border:3px inset #ccc;		
	background-color:#fff;
}

/* prev, next, prevPage and nextPage buttons */
a.prev, a.next, a.prevPage, a.nextPage {
	display:block;
	width:18px;
	height:18px;
	background:url(/images/scroll/arrow/left.png) no-repeat;
	float:left;
	margin:43px 10px;
	cursor:pointer;
	font-size:1px;
}

/* mouseover state */
a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover {
	background-position:0px -18px;		
}

/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
}

/* next button uses another background image */
a.next, a.nextPage {
	background-image:url(/images/scroll/arrow/right.png);
	clear:right;	
}
/*********** end iphone app scrollable ***********/

/*********** start navigator ***********/
/* position and dimensions of the navigator */
.navi {
	margin:auto;
	width:100px;
	height:20px;
	border:0px solid red;
	text-align: center;
}


/* items inside navigator */
.navi a {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(/images/scroll/arrow/navigator.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
.navi a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
.navi a.active {
	background-position:0 -16px;     
}
/*********** end navigator ***********/


/*
CSS for jquery tools tabs
*/

/* root element for tabs  */
ul.css-tabs {  
	margin:0 !important; 
	padding:0;
	height:30px;
	border-bottom:1px solid #666;	 	
}

/* single tab */
ul.css-tabs li {  
	float:left;	 
	padding:0; 
	margin:0;  
	list-style-type:none;	
}

/* link inside the tab. uses a background image */
ul.css-tabs a { 
	float:left;
	font-size:13px;
	display:block;
	padding:5px 30px;	
	text-decoration:none;
	border:1px solid #666;	
	border-bottom:0px;
	height:18px;
	background-color:#efefef;
	color:#777;
	margin-right:2px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright:4px;
	position:relative;
	top:1px;	
}

ul.css-tabs a:hover {
	background-color:#F7F7F7;
	color:#333;
}
	
/* selected tab */
ul.css-tabs a.current {
	background-color:#ddd;
	border-bottom:2px solid #ddd;	
	color:#000;	
	cursor:default;
}

	
/* tab pane */
div.css-panes div {
	display:none;
	border:1px solid #666;
	border-width:0 1px 1px 1px;
	min-height:150px;
	padding:15px 20px;
	background-color:#ddd;	
}

.alert_box {
	width:400px;
	font-size:1.2em;
	margin:10px auto;
	padding:5px;	
	border:3px solid #CBE86B;	
	background-color:#FFC;
	color:#666;
	-moz-border-radius: 8px;
}

/**** iPhone styles *****/
.phone { 
	margin:0; 
	width:100%;
	padding:0; 
	text-align:center;
	height:520px;
}
.phone .left { 
	width:460px; 
	margin:0; 
	padding:0px; 
	float:left; 
	text-align:center;
	height:100%;
}
.phone .right { 
	width:320px; 
	margin-left:480px;
	height:100%;
}
.phone .left img.icon { 
	width:60px; 
	height:60px; 
	padding:3px; 
	float:left; 
	border:1px solid #CCC;
	margin:15px 20px 15px 0px;
}
.phone div.scrollable {
	position:relative;
	overflow:hidden;
	padding:0;	
	margin:auto;
	width:325px;
	height:470px;
}
.phone div.items {	
	/* this cannot be too large */
	width:20000em;	
	position:absolute;
	border:0px solid red; 
	margin:0;
	padding:0;
}
.phone div.items div {	
	/* this cannot be too large */
	float:left;	
	width:325px; 
}
/*********** start navigator ***********/
/* position and dimensions of the navigator */
.phone .navi {
	margin-left:110px;
	width:150px;
	height:20px;
	border:0px solid red;
}


/* items inside navigator */
.phone .navi a {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(/images/scroll/arrow/navigator.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
.phone .navi a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
.phone .navi a.active {
	background-position:0 -16px;     
}
/*********** end navigator ***********/

