body	{font-family:Arial, Helvetica, sans-serif; color:#666666; margin:0px; background-color:#ffffff; background:url(img/body_bg-8x8.gif);}



 
/* global styles  */

.clearAll	{clear:both; padding:0; margin:0; font-size:0px;}
.floatLeft	{float:left;}
.floatRight	{float:right;}

.alignRight	{text-align:right;}
.alignLeft	{text-align:left;}
.alignCenter	{text-align:center;}

/* when adding a floatRight on an image, add this margin class as well so the image has some breathing room */
.floatRightMargin	{margin-left:10px; margin-bottom:10px;}

p	{margin:0px 0px 10px 0px}
ul	{margin-bottom:10px;}

/* by default, no border on images. this saves having to put border=0 on every linked image. */
img	{border:0}

a	{color:#2461AA; text-decoration:none; }
a:hover	{color:#000000; text-decoration:underline;}

a.pdf	{background:url(img/pdf-18x18.png) no-repeat right center; padding-right:25px;} /* apply to any text link for a pdf file */

h1	{margin: 20px 0px 3px 0px; font-size: 18px; color: #0b315e; font-family:"Bitstream Vera Serif","Times New Roman", Times, serif}
h2	{margin: 0px 0px 3px 0px; font-size: 15px; color: #0b315e; font-family:"Bitstream Vera Serif","Times New Roman", Times, serif}
h3	{margin: 0px; font-size: 14px; color: #343433;}
h4	{margin: 0px; font-size: 12px;}

hr	{height:1px; color:#cccccc; background-color:#cccccc; border: none;} /* some browsers use border, some use bg and some use color. nice. unified now. */

div	{ box-sizing: border-box; -moz-box-sizing: border-box;} /*	Mozilla and IE treat padding differently. this'll make them treat it the same.  */


label.required:before	{color:#cc0000; content:"* "; }

/* Global styling for large blocks of text.  Any text block should be placed into one of these three tags */
#content div, table, p	{font-size:15px; line-height:160%; color:#000000;}

form	{display:inline; margin:0; padding:0;}

.displayNone	{display:none;} /* for any element that needs to be hidden by default */


/* for small, disclaimer text */
.small	{font-size:10px; color:#666666; line-height:140%;}

/* for small, hints used to communicate small help for the customers */
.hint	{font-size:10px; color:#666666; line-height:140%;}

/* used for horizontal links with | between each.  each href should have the class on it to generate spaceing between links but not between words */
.menu	{margin:0px 5px 0px 5px;}


/* for pages that have a graphic at the top spanning the entire width of the main column */

.pageHeaderGraphic	{width:500px; height:188px; position:relative; left:-37px;}
.pageHeaderGraphic img	{display:block; vertical-align:top;}


/* for items that needs a subtle border */
.border	{border:1px solid #e8e7e6; background-color:#FFFFFF;}

/* for stacked items (tables or divs) that each need a border */
.box	{border:1px solid #E7E7DB; margin-bottom:10px;}

/* form styles.  All textboxes and text areas should have formed on them.  All buttons should use the button class. */
.formed	{border:1px solid #636363; font-size:8pt; background-color:#ffffff;}
.button	{font-size:8pt; color:#000000;}

/* only to be used when a style needs to be set to hide content.  Add no other styles to this class */
.hidden	{display:none;}


/* these two styles are for the rss feed on the account login page. */
div#rss_input ul {list-style: none; margin: 0; padding: 0; border: none;}
div#rss_input li {border-bottom: 1px dotted #CCCCCC; margin: 0px; margin-bottom:6px; padding-bottom:6px;}


/* floating text callout or quote box  */
.callout	{margin:10px 40px 20px 40px; font-size:18pt; text-align:left; font-family:"Times New Roman", Times, serif; font-style:italic; color:#333333; line-height: 24px}

/* use as a text container for short blurb with call to action. ex: quickbooks merchant services. */
.linkAwayRoundedBox	{
	background:#c8d8ec; 
	padding:10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px; 
	margin-bottom:10px;
	}


/* case studies landing and individual pages (clients section) */
#caseStudiesLanding	{width:874px; margin-top:20px;} /* fixed width to account for panel margins */

.clientOverviewPanel	{float:left; width: 290px; margin-right:1px; cursor:pointer;}
#caseStudiesLanding	.thumbnail {margin-bottom:8px;}
#caseStudiesLanding	.thumbnail img	{
	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 5px rgba(0,0,0,.2);
	box-shadow: 0 1px 5px rgba(0,0,0,.2); 
	}

#caseStudiesLanding h3	{margin:0 0 1px 0; font-size:14px; line-height:14px;}
#caseStudiesLanding .domain	{line-height:10px; font-size:10px; color:#848486;}

#caseStudiesLanding P	{margin:10px 20px 0 0; padding:0; font-size:11px; line-height:17px;}



.clientPage .mainGraphicContainer	{position:relative; width:800px; height:280px;}
.clientPage .mainGraphic	{position:absolute; top:-4px; left:-38px;} /* shift image up to cover 4px tall grey horizontal line */

.clientPage h3	{padding-top:10px; margin:0;}
.clientPage p	{padding:5px 0 15px 0; margin:0;}

.clientPage .mainColumn	{float:left; width:600px; padding-top:20px; }


.clientPage .rightColumn	{float:right; width:295px; margin-right:-37px; background:#f1f1f3; padding-bottom:25px;}
.clientPage .rightColumn h5	{background:url(img/menu_sublinks_bg-1x28.gif) repeat-x; line-height:24px; font-size:14px; font-weight:bold; color:#ffffff; padding:0 5px; margin:-4px 0 0 0;} /* -4 to compensate for mainGraphic vertical shift */



.clientPage .rightColumn ul	{list-style:none; margin:0px; padding:5px 20px;}
.clientPage .rightColumn #caseStudyThumbnails li	{margin:4px 7px 0 0; padding:0; float:left; border:1px solid #cccccc; background:#ffffff;}
.clientPage .rightColumn #caseStudyThumbnails img	{width:75px; height:75px; overflow:hidden; display: block; vertical-align: top;}


/* Right Column */

#trialBoxen	{width:290px; background:#f1f1f2; position:relative;}
#trialBoxenTopCorner {position:absolute; top:-9px; right:-18px; width:18px; z-index:51;}
#trialBoxenRightShade {position:absolute; top:0px; right:-18px;background:#e6e7e8; height:316px; z-index:50; width:18px;} /* top right corner angle graphic */
#trialBoxenBottomCorner {position:absolute; bottom:-1px; right:-18px; z-index:51;} /* angled edge on lower right corner */

#trialFormContainer	{padding:20px; text-align:center;}
#trialFormContainer	td	{text-align:left;}

#trialFormContainer label	{font-size:11px; color:#666666}
#trialFormContainer .formed	{width:135px;}
#trialFormContainer .trialSubmit	{margin-top:5px;margin-right:-3px;}



/* class used on the triangle icons. for now, just handling margins */
div.tricon	{margin-right:8px;}


/* section splitter - whitespace for between sections */
div.splitSection	{padding-top:16px;}


/* header menu and submenu classes */

/* the submenu on/off graphic determines whether the image shown is blue or white. each icon itself has a class to determine position */
.submenu_off	{background:url(img/nav_icons-247x194-off.png) no-repeat; width:24px; height:22px; float:left;}
.submenu_on	{background:url(img/nav_icons-247x194-on.png) no-repeat; width:24px; height:22px; float:left;}

/* products */
.submenu_complete	{background-position: -0px -25px}
.submenu_webstore	{background-position: -0px -50px}
.submenu_inventory	{background-position:  -0px -75px}
.submenu_accounting	{background-position: -0px -97px }
.submenu_orderprocess	{background-position: -0px -123px }
.submenu_shipping	{background-position: -0px -148px }
.submenu_wholesale	{background-position: -0px -173px }

/* services */
.submenu_gfx	{background-position: -53px 2px}
.submenu_mkt	{background-position: -53px -25px}
.submenu_marketplace	{background-position:  -53px -48px}
.submenu_comparisonshop	{background-position: -53px -73px }
.submenu_imp	{background-position: -50px -97px }
.submenu_hosting	{background-position: -50px -123px }
.submenu_domainreg	{background-position: -53px -150px }
.submenu_mpo	{background-position: -53px -150px }

/* company */
.submenu_company	{background-position: -106px 1px}
.submenu_management	{background-position: -108px -23px}
.submenu_employment	{background-position:  -108px -49px}

/* news */
.submenu_events	{background-position: -160px 1px}
.submenu_znews	{background-position: -160px -23px}
.submenu_pressrelease	{background-position:  -160px -49px}



/* footer styles */

#footer	{font-size:11px;}

#footer_col1 a	{display:block; padding:7px 0;font-size: 14px;}

/* makes sure each form label is on its own line */
#footer_col2 label	{display:block;}
#footer_col2 input	{margin-bottom:10px;}


#footer .section	{height: 175px}
#footer .vertsplit	{background:url(img/footer_vert_splitter-5x1.gif) repeat-y right;}


/* for use on news and press releases page */

#pressReleases .section_head	{ padding: 1px 0; clear:both;}
#pressReleases .section_head a	{color:#ffffff; text-decoration:none; background:#2461AA; padding:3px 10px; display:block; font-weight:bold;}
#pressReleases .date	{width:80px; display:block; float:left;}
#pressReleases .title	{width:450px; float:left; display:block;}
#pressReleases .lineitem	{clear:both; padding:4px 0 0px 0;}
#pressReleases .articles	{padding:10px 0;}

/* styles for the navigation */

#subcats div	{float:left; font-size:11px;}

/* the left padding is to compensate for the icon, which is added inline */
#subcats div a	{display:block; line-height:24px; color:#ffffff; margin-right:20px; float:left;}
#subcats div a:hover	{color:#b4d4ef; text-decoration:none;}

#subcats div.catlink_on a	{color:#b4d4ef;}



/* for login modal */

#loginFormContainer div	{margin-bottom:12px;}
#loginFormContainer label	{display:block; float:left; margin-right:12px; clear:left; width:150px; text-align:right; vertical-align:middle;}


/* for homepage slideshow */

/* rotator in-page placement */
div.rotator {
	position:absolute;
	height:280px;
	margin-left: 0px;
	margin-top: 0px;
}
/* rotator css */
	div.rotator ul li {
	float:left;
	position:absolute;
	list-style: none;
}
/* rotator image style */	
	div.rotator ul li img {
	border:0px solid #000000;
	padding: 0px;
	background: #000000;
}
div.rotator ul li.show {
	z-index:500;
}



/*  Color Pallete
gunmetal grey: 	2F3C40						Zoovy Blue:  	2461AA
medium grey: 	828282						light blue:  	C8D8EC
light grey: 	ECECEC						yellow/orange: 	F7B135
 */