/*
==================================================
 Stylesheet for ABSystems
 June 21, 2010
==================================================
*/

/*
==================================================
 Generic Body Styles
==================================================
*/

html { min-height: 100%; margin-bottom: 1px; }

body	{
margin: 0;
padding: 0;
text-align: center;
line-height: 1.1em;
background: #22517b;
}

img	{
border: 0;
}

h1	{
margin: 0;
padding: 0;
font: 30px 'myriad pro', helvetica, sans-serif;
color: #5895cd;
}

.outer	{
width: 100%;
background: url(../i/common/outerBg.jpg) repeat-y center #d8e7f7;
}

.wrapper	{
margin: auto;
padding: 20px 0;
width: 935px;
text-align: left;
}

a	{
color: #e99033;
text-decoration: underline;
}

a:hover	{
color: #e99033;
text-decoration: none;
}

.center	{
text-align: center;
}

.right	{
text-align: right;
}

.active {
visibility: visible !important;
}

.hr	{
border-bottom: 1px solid #ddd;
padding-top: 15px;
margin-bottom: 15px;
}

.orange	{
color: #e99033;
}

.blue	{
color: #5895cd;
}

.required	{
color: #f00;
}

.fontStandard	{
font: 14px 'myriad pro', helvetica, sans-serif;
}

.imgCurves	{
-moz-border-radius-bottomleft: 7px;
-webkit-border-bottom-left-radius: 7px;
-moz-border-radius-bottomright: 7px;
-webkit-border-bottom-right-radius: 7px;
-moz-border-radius-topleft: 7px;
-webkit-border-top-left-radius: 7px;
-moz-border-radius-topright: 7px;
-webkit-border-top-right-radius: 7px;
}

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

.logo a	{
float: left;
width: 270px;
height: 105px;
display: block;
background: url(../i/common/logo.gif);
}

.requestInfo	{
float: right;
width: 600px;
text-align: right;
padding-top: 30px;
color: #828282;
font: 20px 'myriad pro', helvetica, sans-serif;
}

.requestInfoImg a	{
float: right;
width: 175px;
height: 43px;
display: block;
margin: 5px 0 0 25px;
background: url(../i/common/requestInfo.gif);
}

.requestInfoImg a:hover	{
background-position: 0 -44px;
}

/*
==================================================
 Nav
==================================================
*/

#topNav	{
margin: 15px 0;
text-align: center;
width: 935px;
height: 31px;
background: url(../i/common/mainNavBg.gif);
}

#topNav ul {
font: 11px arial, helvetica, sans-serif;
padding: 0;
margin: 0 0 0 140px;
}

#topNav li	{
margin-top: 7px;
list-style: none;
float: left;
}

#topNav li a {
margin: 0;
padding: 0 80px 5px 0;
color: #222;
text-decoration: none;
font: 14px 'myriad pro', helvetica, sans-serif bold;
}

#topNav li ul {
display: none;
z-index: 99;
}

#topNav li:hover ul, #topNav li.hover ul {
display: block;
position: absolute;
text-align: left;
margin: 2px 0 0 -11px;
padding-bottom: 10px;
border-left: 1px solid #c8c8c8;
border-bottom: 1px solid #c8c8c8;
border-right: 1px solid #c8c8c8;
width: 210px;
-moz-border-radius-bottomleft: 7px;
-webkit-border-bottom-left-radius: 7px;
-moz-border-radius-bottomright: 7px;
-webkit-border-bottom-right-radius: 7px;
-moz-box-shadow: -3px 3px 3px #ddd;
-webkit-box-shadow: -3px 3px 3px #ddd;
background: #e0e0e0;
}

#topNav li.smallNav:hover ul, #topNav li.smallNav.hover ul {
display: block;
position: absolute;
text-align: left;
margin: 2px 0 0 -11px;
padding-bottom: 10px;
border-left: 1px solid #c8c8c8;
border-bottom: 1px solid #c8c8c8;
border-right: 1px solid #c8c8c8;
width: 150px;
-moz-border-radius-bottomleft: 7px;
-webkit-border-bottom-left-radius: 7px;
-moz-border-radius-bottomright: 7px;
-webkit-border-bottom-right-radius: 7px;
-moz-box-shadow: -3px 3px 3px #ddd;
-webkit-box-shadow: -3px 3px 3px #ddd;
background: #e0e0e0;
}

#topNav li:hover li, #topNav li.hover li,
#topNav li.smallNav:hover li, #topNav li.smallNav.hover li	{
float: none;
}

#topNav li:hover li a, #topNav li.hover li a	{
font: 12px 'myriad pro', helvetica, sans-serif bold;
padding: 7px 10px;
width: 165px;
\width: 185px;
w\idth: 165px;
margin: 0;
text-align: left;
color: #222;
}

#topNav li:hover a, #topNav li.hover	{
color: #e99033;
}

#topNav li a:hover, #topNav li li a:hover {
color: #e99033;
}

.mainNav	{
margin: 15px 0;
text-align: center;
width: 935px;
height: 31px;
background: url(../i/common/mainNavBg.gif);
}

.mainNav ul li	{
margin: 0;
padding: 0;
list-style: none;
}

.mainNav li a	{
float: left;
margin: 8px 0 0 68px;
color: #222;
text-decoration: none;
font: 14px 'myriad pro', helvetica, sans-serif bold;
}

.mainNav a:hover	{
color: #e99033;
}

ul.tabs	{
width: 935px;
height: 80px;
margin: 0;
padding: 0;
background: url(../i/home/tabBg.gif);
}

.tabs li	{
margin: 0;
padding: 0;
display: inline;
list-style: none;
}

.tabs li a	{
float: left;
margin-left: 2px;
padding: 27px 40px 0 40px;
width: 105px;
\width: 185px;
w\idth: 105px;
font: 16px 'myriad pro', helvetica, sans-serif bold;
color: #444;
text-decoration: none;
text-align: center;
height: 51px;
display: block; 
}

.tabs li a:hover,
.tabs li.selected a	{
color: #fff;
background: url(../i/home/tabHover.gif);
}

ul.subNav	{
margin: 0;
padding: 20px 0 20px 10px;
list-style: none;
}

.subNav li a, .subNav li span	{
font: 14px 'myriad pro', helvetica, sans-serif;
padding: 9px 0 4px 15px;
width: 215px;
\width: 230px;
w\idth: 215px;
display: block;
color: #222;
text-decoration: none;
}

ul.subNav ul	{
list-style: none;
margin: 0 0 0 20px;
padding: 0;
}

.subNav li li a	{
font: 12px 'myriad pro', helvetica, sans-serif;
list-style: none;
}

.subNav li li a:hover	{
background: none;
}

.subNav li a:hover	{
color: #e99033;
}

.subNav li span.selected	{
font-weight: bold;
border-top: 1px solid #f2f2f2;
border-left: 1px solid #eaeaea;
border-bottom: 1px solid #eaeaea;
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-box-shadow: -3px 3px 3px #eee;
-webkit-box-shadow: -3px 3px 3px #eee;
background: #fff;
}

/*
==================================================
 Content Home
==================================================
*/

#contentHome	{
font: 14px 'myriad pro', helvetica, sans-serif;
width: 935px;
margin: 40px 0 10px 0;
}

div#benefit-content {
height: 360px;
width: 935px;
}

div.benefit {
height: 360px;
position: absolute;
visibility: hidden;
background: url(../i/home/mainImg.jpg) no-repeat;
}

div.benefit p {
margin: 60px 0 0 635px;
width: 300px;
line-height: 1.3em;
}

div#benefit-included	{
background-position: 0 0;
}

div#benefit-cost	{
background-position: 0 -360px;
}

div#benefit-clients	{
background-position: 0 -720px;
}

div#benefit-profit	{
background-position: 0 -1080px;
}

div#benefit-started	{
background-position: 0 -1440px;
}

.getStartedImg a	{
width: 246px;
height: 50px;
margin-left: 635px;
display: block;
background: url(../i/home/getStarted.gif);
}

.getStartedImg a:hover	{
background-position: 0 -50px;
}

.testimonialsCallout, .newsCallout	{
position: relative;
margin-top: 25px;
padding: 25px;
width: 393px;
\width: 443px;
w\idth: 393px;
height: 305px;
color: #222;
font-size: 14px;
}

.testimonialsCallout	{
float: left;
background: url(../i/home/testimonialsBg.gif);
}

.newsCallout	{
float: right;
background: url(../i/home/newsBg.gif);
}

.testimonialsCallout h1, .newsCallout h1	{
font-size: 20px;
color: #639cd0;
margin-bottom: 25px;
}

.newsCallout h2	{
padding: 15px 0 5px 0;
border-bottom: 1px dotted #666;
color: #666;
font-size: 16px;
text-transform: uppercase;
background: url(../i/common/newsDivider.gif) top repeat-x;
}

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

#feed li	{
margin-bottom: 6px;
padding-bottom: 6px;
border-bottom: 1px dotted #ccc;
}

#testimonials p	{
font-size: 16px;
margin: 30px 0 0 30px;
}

.readMore	{
position: absolute;
right: 30px;
bottom: 20px;
}

.readMore a, .readMore a:visited, .readMore a:hover	{
color: #5247ff;
text-decoration: none;
}

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

#content	{
width: 935px;
min-height: 400px;
height: auto !important;
height: 400px;
-moz-border-radius-topleft: 7px;
-webkit-border-top-left-radius: 7px;
background: url(../i/common/contentBg.gif) no-repeat;
}

.contentLeft	{
font: 14px 'myriad pro', helvetica, sans-serif;
float: left;
width: 240px;
}

.contentLeftPadding	{
padding: 15px;
}

.contentRight	{
float: right;
padding: 10px 0;
width: 670px;
font: 14px 'myriad pro', helvetica, sans-serif;
}

.contentRight h1	{
font: 18px 'myriad pro', helvetica, sans-serif;
font-weight: bold;
margin-bottom: 15px;
}

.includedImg	{
float: left;
width: 330px;
}

.includedContent	{
float: left;
width: 340px;
}

.includedContent h1, .question	{
font-size: 16px;
color: #5895cd;
margin-bottom: 5px;
}

.teamPhoto	{
float: left;
width: 140px;
}

.teamPhoto img	{
margin-bottom: 5px;
}

.teamBios	{
float: left;
width: 520px;
margin-left: 10px;
}

.form	{
position: relative;
border: 1px solid #ddd;
padding: 15px;
margin: 0 0 20px 0;
background: #f8f8f8;
-moz-border-radius-topleft: 7px;
-webkit-border-top-left-radius: 7px;
-moz-border-radius-topright: 7px;
-webkit-border-top-right-radius: 7px;
-moz-border-radius-bottomleft: 7px;
-webkit-border-bottom-left-radius: 7px;
-moz-border-radius-bottomright: 7px;
-webkit-border-bottom-right-radius: 7px;
}

.form #help	{
float: right;
}

.registerWebinar a, .watchWebinar a	{
width: 182px;
height: 97px;
display: block;
margin: 0 0 5px 12px;
background: url(../i/common/registerWebinar.gif);
}

.watchWebinar a	{
background: url(../i/common/watchWebinar.gif);
}

.registerWebinar a:hover, .watchWebinar a:hover	{
background-position: 0 -97px;
}

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

.footer	{
width: 100%;
background: url(../i/common/footerShadow.gif) repeat-x;
}

.footerContent	{
padding: 20px 0;
font: 12px 'myriad pro', helvetica, sans-serif;
color: #8cb7d8;
line-height: 1.4em;
}

.footerContent a	{
color: #8cb7d8;
text-decoration: none;
}

.footerContent a:hover	{
color: #fff;
}

.footerContent .column	{
float: left;
width: 200px;
}

.footerContent .column2	{
float: left;
width: 220px;
}

.footerContent .endColumn	{
float: right;
text-align: right;
width: 315px;
}

.footerContent b	{
font-size: 14px;
}

/*
==================================================
 Clear
==================================================
*/

.clear:after {
content: "."; 
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clear {
display: inline-block;
}

/* Hides from IE-mac \*/
* html .clear {height: 1%;}
.clear {display: block;}
/* End hide from IE-mac */