/*
 * main.css
 *
 * Copyright (c) 2006-2009 by Goose Networks, Inc.
 */

/*************************************************
 *                                               *
 *               High-level Layout               *
 *                                               *
 *************************************************/

html {
	background: none;
}

body {
	background: #003400 url('../images/background3.png') no-repeat scroll center top;
	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
}

#main-column-wrapper {
	width: 900px;
	margin: 0 auto;
}

#main-column {
	width: 800px;
	margin: 0 50px;
	height: 100%;
}

.body {
	width: 100%;
}

/*************************************************
 *                                               *
 *                 Header Layout                 *
 *                                               *
 *************************************************/

#header {
	height: 83px;
	width: 100%;
	position: relative;
}

#logo {
	position: absolute;
	height: 45px;
	width: 270px;
	top: 20px;
	left: 0px;
}

#logo a {
	display: block;
	height: 100%;
	width: 100%;
}

#call-us {
	position: absolute;
	height: 20px;
	width: 227px;
	top: 0px;
	right: 0px;
}

#nav-left,
#nav-right {
    position: absolute;
    top: 33px;
    height: 38px;
}

#nav-left {
    right: 369px;
    width: 298px;
    background: url('../images/nav-left.png') no-repeat 0 0;

}

#nav-right {
    right: 0px;
    width: 354px;
    background: url('../images/nav-right.png') no-repeat 0 0;
}

#nav-left li,
#nav-right li {
    display: block;
    float: left;
    height: 38px;
}

#nav-right li {
    width: 87px;
    margin-right: 1px;
}

#nav-left li a,
#nav-right li a {
    display: block;
    height: 100%;
    width: 100%;
}

#nav-left #nav-left-employers { width: 129px; }
#nav-left #nav-left-transit { width: 169px; } 

#nav-left-employers.active a,
#nav-left-employers a:hover { background: url('../images/nav-left.png') no-repeat 0px -38px; }
#nav-left-transit.active a,
#nav-left-transit a:hover { background: url('../images/nav-left.png') no-repeat -129px -38px; }

#nav-right #nav-right-features { width: 87px; padding-left: 1px }
#nav-right #nav-right-blog { width: 88px;  margin-right: 0px; }

#nav-right-features a:hover { background: url('../images/nav-right.png') no-repeat -1px -38px; }
#nav-right-platform a:hover { background: url('../images/nav-right.png') no-repeat -89px -38px; }
#nav-right-about a:hover { background: url('../images/nav-right.png') no-repeat -177px -38px; }
#nav-right-blog a:hover { background: url('../images/nav-right.png') no-repeat -265px -38px; }

/*************************************************
 *                                               *
 *                  Body Layout                  *
 *                                               *
 *************************************************/

#welcome-body #body-top {
	height: 10px;
	width: 100%;
	background: url('../images/body-top.png') no-repeat 0 0;
}
#standard-body #body-top {
	height: 83px;
	width: 100%;
	background: url('../images/body-top-with-header.png') no-repeat 0 0;
}
#fullpage-body #body-top {
	height: 83px;
	width: 100%;
	background: url('../images/full-body-top-with-header.png') no-repeat 0 0;
}
#body-inner {
	width: 100%;
	background: white url('../images/standard-body-background.gif') repeat-y 0 0;
}
#welcome-body #body-inner {
	background: white;
}
#fullpage-body #body-inner {
	background: white;
}
#body-bottom {
	height: 10px;
	width: 100%;
	background: url('../images/standard-body-bottom.png') no-repeat 0 0;
}
#welcome-body #body-bottom {
	background-image: url('../images/body-bottom.png');
}
#fullpage-body #body-bottom {
	background-image: url('../images/body-bottom.png');
}
#standard-body #section-name,
#standard-body #page-name {
	float: left;
	font-size: 246.2%;
	font-weight: lighter;
	color: white;
	padding: 20px;
	text-align: left;
}

#standard-body #section-name {
	width: 140px; /* 180 - 20 - 20 */
}
#fullpage-body #page-name {
	float: left;
	font-size: 246.2%;
	font-weight: lighter;
	color: white;
	padding: 20px;
	text-align: left;
}

#body-content { float: left; padding: 0px 30px; }

#body-content {
	width: 560px; /* 620 - 30 - 30 */
}
.full-body #body-content {
	width: 740px; /* 800 - 30 - 30 */
}
.alt-full-body #body-content {
    padding: 0px 50px;
    width: 700px; /* 800 - 50 - 50 */
}

.banner-paragraph {
	font-weight: lighter;
	text-align: left;
	color: #808080;
	font-size: 159.9%;
	line-height: 1.4em;
}

.banner-paragraph strong { font-weight:bold;  }

/*************************************************
 *                                               *
 *                 Footer Layout                 *
 *                                               *
 *************************************************/

#footer {
	height: 48px;
	width: 100%;
	font-size: 85%;
}
#footer span {
	color: white;
}
#footer-left,
#footer-right {
	padding: 14px 0;
}
#footer-left {
	float: left;
}
#footer-right {
	float: right;
}
#footer-nav li {
	float: left;
	border-right: 1px dotted white;
	padding: 0 10px;
}
#footer-nav li.last-item {
	border-right: none;
	padding: 0 0 0 10px;
}
#footer-nav li a span {
	text-decoration: none;
}
#footer-nav li a:hover span {
	text-decoration: underline;
}

/*************************************************
 *                                               *
 *                 Body Content                  *
 *                                               *
 *************************************************/

.body-row { padding: 20px 0; }
.body-row-liner { float: left; } /* IE6 Floats + Bottom Padding Bug */
.body-row-banner { padding: 20px 0 0 0; }

.horizontal-divider {
	width: 100%;
	height: 1px;
	background: url('../images/divider.gif') repeat-x 0 0;
}
.body p {
    color: #404040;
    font-size: 85%;
    text-align: left;
}

.full-body p {
	color: #404040;
	font-size: 85%;
	text-align: left;
}

/*************************************************
 *                                               *
 *                 Secondary Nav                 *
 *                                               *
 *************************************************/

#blog-sidebar,
#secondary-nav {
	float: left;
	width: 180px;
}

#secondary-nav li {
	padding: 0 0 1px 0;
	background: url('../images/secondary-nav-divider.gif') repeat-x bottom left;
}

#secondary-nav li a {
	display: block;
    font-size: 93%;
	padding: 10px 20px 10px 20px;
	text-align: left;
}

#secondary-nav li a:hover {
	background-color: #9b9b9b;
}

#secondary-nav li a span {
	font-size: 93%;
	color: #000000;
	text-decoration: none;
}


/*************************************************
 *                                               *
 *                Content Columns                *
 *                                               *
 *************************************************/


.column { float: left; }

/* Row: one-column */
.one-column .column { width: 560px; }
.full-body .one-column .column { width: 740px; }

/* Row: two-columns-50-50-no-divider */
.two-columns-50-50-no-divider .column { width: 265px; }
.two-columns-50-50-no-divider .column-1 { margin: 0 30px 0 0; }
.full-body .two-columns-50-50-no-divider .column { width: 355px; }

/* Row: two-columns-50-50-with-divider */
.two-columns-50-50-with-divider .body-row-liner { background: url('../images/divider.gif') repeat-y 280px 0; }
.two-columns-50-50-with-divider .column { width: 260px; }
.two-columns-50-50-with-divider .column-1 { margin: 0 40px 0 0; }
.full-body .two-columns-50-50-with-divider .body-row-liner { background-position: 370px 0; }
.full-body .two-columns-50-50-with-divider .column { width: 350px; }

/* Row: two-columns-40-60-no-divider */
.two-columns-40-60-no-divider .column-1 { width: 220px; margin: 0 30px 0 0; }
.two-columns-40-60-no-divider .column-2 { width: 310px; }
.full-body .two-columns-40-60-no-divider .column-1 { width: 325px; }
.full-body .two-columns-40-60-no-divider .column-2 { width: 385px;}

/* Row: two-columns-40-60-with-divider */
.two-columns-40-60-with-divider .body-row-liner { background: url('../images/divider.gif') repeat-y 235px 0; }
.two-columns-40-60-with-divider .column-1 { width: 215px; margin: 0 40px 0 0; }
.two-columns-40-60-with-divider .column-2 { width: 305px;}
.full-body .two-columns-40-60-with-divider .body-row-liner { background-position: 340px 0; }
.full-body .two-columns-40-60-with-divider .column-1 { width: 320px; }
.full-body .two-columns-40-60-with-divider .column-2 { width: 379px;}

/* Row: two-columns-60-40-no-divider */
.two-columns-60-40-no-divider .column-1 { width: 310px; margin: 0 30px 0 0; }
.two-columns-60-40-no-divider .column-2 { width: 220px;}
.full-body .two-columns-60-40-no-divider .column-1 { width: 385px; }
.full-body .two-columns-60-40-no-divider .column-2 { width: 325px;}

/* Row: two-columns-60-40-with-divider */
.two-columns-60-40-with-divider .body-row-liner { background: url('../images/divider.gif') repeat-y 325px 0; }
.two-columns-60-40-with-divider .column-1 { width: 305px; margin: 0 40px 0 0; }
.two-columns-60-40-with-divider .column-2 { width: 215px;}
.full-body .two-columns-60-40-with-divider .body-row-liner { background-position: 399px 0; }
.full-body .two-columns-60-40-with-divider .column-1 { width: 379px; }
.full-body .two-columns-60-40-with-divider .column-2 { width: 320px;}

/* Row: two-columns-30-70-no-divider */
.two-columns-30-70-no-divider .column-1 { margin: 0 30px 0 0; }
.full-body .two-columns-30-70-no-divider .column-1 { width: 246px; }
.full-body .two-columns-30-70-no-divider .column-2 { width: 464px; }

/* Row: two-columns-30-70-with-divider */
.two-columns-30-70-with-divider .body-row-liner { background: url('../images/divider.gif') repeat-y 325px 0;}
.two-columns-30-70-with-divider .column-1 { margin: 0 40px 0 0;}
.full-body .two-columns-30-70-with-divider .body-row-liner { background-position: 260px 0;}
.full-body .two-columns-30-70-with-divider .column-1 { width: 240px; }
.full-body .two-columns-30-70-with-divider .column-2 { width: 459px; }


/*************************************************
 *                                               *
 *                   Content                     *
 *                                               *
 *************************************************/

.paragraph .heading {
	padding: 0 0 4px 0;
}

.heading-icon,
.heading-text {
	float: left;
}

.paragraph .heading-icon {
	height: 40px;
	width: 40px;
	margin: 0 5px 0 0;
}

.paragraph-vertical-spacing {
	height: 20px;
	width: 100%;
}

/*************************************************
 *                                               *
 *              Screenshot Styling               *
 *                                               *
 *************************************************/

.floating-box,
.floating-screenshots {
    background: #dddddd;
    border: 1px solid #aaaaaa;
}
.floating-box { padding: 0.75em 1em; width: 40%; }
.floating-screenshots { padding: 1.75em 1.75em 0.5em 1.75em; width: 130px; }
.floating-button-right,
.floating-box-right,
.floating-screenshots-right,
.video-right { float: right; margin: 0.5em 0 0.5em 1.5em; }
.floating-button-left,
.floating-box-left,
.floating-screenshots-left,
.video-left  { float: left; margin: 0.5em 1.5em 0.5em 0; }

.floating-button a { display: block; height: 100%; width: 100%; }

.floating-button-interactive_demo {
    width: 193px;
    height: 51px;
    background: url('../images/med-button-interactive-demo.png') no-repeat 0 0;
}

.floating-button-newsletter {
    width: 193px;
    height: 51px;
    background: url('../images/med-button-newsletter.png') no-repeat 0 0;
}

.screenshot-wrapper {
	float: left;
	margin: 0 0 10px 0;
	width: 120px;
	padding: 5px 5px 5px 5px;
	background: url('../images/screenshot-wrapper.png') no-repeat 0 0;
}
.screenshot { height: 70px; width: 120px; }
.screenshot a { display: block; height: 100%; width: 100%; }
.screenshot-caption a span { color: #000000; font-size: 85%; }

/*************************************************
 *                                               *
 *               RSS Feed Styling                *
 *                                               *
 *************************************************/

.news-paragraph .heading .subscribe-link {
	float: right;
}
.news-paragraph .heading .subscribe-link a {
	display: block;
	padding-right: 18px;
	background: url('../images/rss-feed-icon.gif') no-repeat scroll right 2px;
}
.news-paragraph .heading .subscribe-link a:hover {
	background-image: url('../images/rss-feed-icon-hover.gif');
}
.news-paragraph .heading .subscribe-link a span {
	font-size: 85%;
}

.story { text-align: left; margin: 0 0 4px 0; }
.last-story { margin: 0; }

.story-headline, .story-body {
	padding-left: 17px;
}

a.story-headline {
	background: url('../images/rss-single-story-icon.gif') no-repeat 0 2px;
}
a.story-headline:hover { background-image: url('../images/rss-single-story-icon-hover.gif'); }
.multiple-stories a.story-headline { background-image: url('../images/rss-multiple-stories-icon.gif'); }
.multiple-stories a.story-headline:hover { background-image: url('../images/rss-multiple-stories-icon-hover.gif'); }

a.story-headline span {
	font-size: 85%;
}

/*************************************************
 *                                               *
 *                 Blog Styling                  *
 *                                               *
 *************************************************/

.blog-block { padding: 10px 20px 10px 20px; }
.blog-block h2 { font-size: 100%; color: #000000; }
.blog-block-content { text-align: left; }
.blog-block-content,
.blog-block-content a,
.blog-block-content p { color: #000000; }
.blog-block-content .item-list ul {
    font-size: 85%;
}
.blog-block-content a {
    text-decoration: underline;
}
.blog-block .view { padding: 0.5em 0; }
.blog-block .view ul {
    padding: 0.25em 0;
    margin: 0 0 0 0.5em;
}

.blog-content-footer {
    background: #dddddd;
    font-size: 85%;
    margin: 1em 0 0 0;
    padding: 8px 2px 8px 12px;
    width: 536px;
}
.blog-content-footer a,
.blog-content-footer span {
    color: #000000;
}
.blog-content-footer a { text-decoration: underline; }

.blog-content-footer-l { float: left; }
.blog-content-footer-r { float: right; }

.blog-content-footer li.bcf {
	float: left;
	border-left: 1px dotted #000000;
	padding: 0 10px 0 14px;
}
.blog-content-footer li.bcf-first {
	border-left: none;
	padding: 0 10px 0 0;
}

/*************************************************
 *                                               *
 *             General Site Styling              *
 *                                               *
 *************************************************/

p, h1, h2, h3, h4, h5, h6 {
	text-align: left;
}

h2 {
	color: #006000;
	font-weight: lighter;
	font-size: 123.1%;
    line-height: 1.2em;
}
h2 a { color: #006000; }
h2 a:hover { text-decoration: underline; }

a {
	text-decoration: none;
}
a span {
	color: #006000;
	text-decoration: underline;
}
a:active,
a:hover,
a:link,
a:visited {
	outline: none;
}


/*************************************************
 *                                               *
 *             Content Baseline CSS              *
 *                                               *
 *************************************************/

.content p { padding: .5em 0; }
.content a {
	color: #006000;
	text-decoration: underline;
}

.content strong { font-weight:bold;  }
.content em { font-style:italic; }
.content blockquote { padding: .5em 0; }
.content dl,
.content ol,
.content ul {
    padding: 0 0 .5em 0;
    margin-left:2em;
    color: #404040;
	font-size: 85%;
	text-align: left;
}
.content ol li { list-style: decimal outside; }
.content ul li { list-style: disc outside; }
.content dl dd { margin-left:1em; }

/*************************************************
 *                                               *
 *                 Welcome Page                  *
 *                                               *
 *************************************************/

#welcome-carousel {
	height: 240px;
	width: 100%;
	margin-bottom: 20px;
    background: url('../images/carousel-static-preloader.png') no-repeat 0 0;
}

.factbox { position: relative; height: 38px; margin-bottom: 20px; }
.factbox a { position: absolute; top: 11px; height: 19px; width: 150px; }
#factbox-employers { background: url('../images/factbox-employers.png') no-repeat 0 0; }
#factbox-transit { background: url('../images/factbox-transit.png') no-repeat 0 0; }
#factbox-employers a { left: 630px; }
#factbox-transit a { left: 582px; }

#clients-static {
	margin: 0;
	width: 740px;
	height: 45px;
	background: url('../images/clients-static.png') no-repeat 0 0;
}

.testimonial {
    width: 379px;
    height: 160px;
    overflow: hidden;
}

#testimonial-1 { background: url('../images/testimonial-1.gif') no-repeat 0 0; }
#testimonial-2 { background: url('../images/testimonial-2.gif') no-repeat 0 0; }
#testimonial-3 { background: url('../images/testimonial-3.gif') no-repeat 0 0; }
#testimonial-4 { background: url('../images/testimonial-4.gif') no-repeat 0 0; }

.testimonial a {
    display: block;
    height: 100%;
    width: 100%;
}

/*************************************************
 *                                               *
 *                Editions Page                  *
 *                                               *
 *************************************************/
 
#editions-wrap {
	margin: 25px 0 15px;
}

.editions-sep-vertical {
	width: 1px;
	height: 370px;
	float: left;
	background: url('../images/divider.gif') 0 0 repeat-y;
	margin: 0 20px 5px 20px;
}

.editions-col {
	float: left;
	height: 100%;
	width: 200px;
}

.editions-title {
	float: left;
	font-size: 246.2%;
	font-weight: lighter;
	color: #333333;
	text-align: left;
	width: 100%;
}

.editions-checks {
	text-align: left;
	font-size: 85%;
	font-weight: bold;
	color: #404040;
}

.editions-checks li {
	padding-left:25px;
	background: url(../images/check.gif) no-repeat;
	height: 17px;
}

.editions-sep-horizontal {
	background: url('../images/divider.gif') 0 0 repeat-x;
	height: 1px;
	margin: 10px 0;
}

.editions-features {
	text-align: left;
	font-size: 85%;
	color: #404040;
	margin: 10px 0;
}

.editions-features li {
	list-style: disc;
	list-style-position: inside;
	line-height: 1.5em;
}

.signup-button {
    border: none;
    height: 26px;
    margin: 35px auto 0px;
    width: 146px;
}

.signup-button a {
    display: block;
    width: 100%;
    height: 100%;
    background: url('../images/signup-button.png') 0px 0px no-repeat;
    color: #fff;
}
.signup-button a:hover {
    background-position: 0px -26px;
}