﻿/* general reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

:focus { outline: 0; }

ins { text-decoration: none; }

del { text-decoration: line-through; }

.clearboth { clear: both; }

.clearright { clear: right; }

img.left { float: left; margin-right: 15px; }

img.right { float: right; margin-left: 15px; }

/* tables still need 'cellspacing="0"' in the markup -- */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* end general reset */

/* font-styles */
hr {margin-bottom: 15px; margin-top: 15px;}

h1 {font-family: Georgia, "Times New Roman", Times, serif; font-size: 2.5em; font-weight: normal; margin-bottom: 0.3em;}
h1 sup {font-size: 0.3em;}
h1 a, h1 a:visited {color: #6666cc; text-decoration: none;}
h1 a:hover, h1 a:focus {text-decoration: underline;}
.breadcrumb {font-size: 0.9em; color: #999;}
.breadcrumb span {font-size: 0.9em; color: #999;}
.breadcrumb a, .breadcrumb a:visited {color: #6666cc;}

h2 {font-family: Georgia, "Times New Roman", Times, serif; font-size: 1.5em; font-weight: normal; margin: 1em 0 0.6em;}

h2.module-name {font-size: 2.8em; margin: 0.5em 0 0;}
h2 a {font-size: 0.3em; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;}
h3.s {background: url(../images/play.jpg) no-repeat left center; padding:10px 0 10px 50px;}
h3 {font-family: Georgia, "Times New Roman", Times, serif; font-size: 1.3em; font-weight: normal; margin: 1em 0 0.6em;}
.module h3 {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 1em; margin: 0; font-weight: bold;}
.callout h3 {margin: 0;}
.example h3 {font-family: Arial, Helvetica, sans-serif; margin-bottom: 10px; font-size: 0.9em; font-weight: bold;}
h4 {font-family: Georgia, "Times New Roman", Times, serif; font-size: 1.2em; font-weight: normal; margin: 1em 0 0.6em;}
h5 {font-size: 0.9em; font-weight: bold; margin: 1em 0 0.6em; color: #525a4b;}
p {line-height: 1.5em; margin: 0.7em 0;}
a, a:visited {color: #0000ff; text-decoration: none;}
a:hover, a:focus {text-decoration: underline;}
li {line-height: 1.5em;}

/* header title */
.header h2 {
	float: right;
	font-family: "Trebuchet MS", "Times New Roman", Times, serif;
	font-size: 1.4em;
	margin-top: 15px;
}

/* Q&A header */
h2.header 
{
	background: #fff url(../images/header-bg.jpg) repeat-x top;
	 color: #fff; 
	 line-height: 2em; 
	 padding-left: 1em; 
	 clear: left; 
}
/* Q&A image */
.qanda {
	background: url(../images/qanda.jpg) no-repeat right top;
	height: 40px;
	width: 113px;
	float:right;
	margin-top: -52px;
}

/*---*/

body {
	text-align: center;
	background: #ECEDF2;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 76%;
	background: #ececf3 url(../images/body-bg.jpg) repeat-y top;
}

.maincontainer {
	background: #fff;
	width: 880px;
	min-width: 880px;
	margin: 15px auto;
	text-align: left;
	padding: 20px 30px;
	font-size: 110%;
}

/* -- main navigation -- */

.navcontainer {
	border-bottom: 6px solid #525a4b;
	float: left;
	width: 100%;
	margin-top: -25px;
}

.nav {
	float: right;
	font-family: Arial, Helvetica, sans-serif;
}

.nav li {
	float: left;
}

.nav li a, .nav li a:visited {
	display: block;
	background: #5e7b6f url(../images/tab-bg-green.gif) repeat-x top;
	padding: 3px 20px;
	margin-left: 4px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	display: block;
	border-bottom: 1px solid #fff;
	font-size: 1.1em;
}

.nav li a:hover, .nav li a:focus {
	background: #586b5d url(../images/tab-bg-green.gif) repeat-x bottom;
}

.nav li.current a, .nav li.current a:visited {
	background: #525a4b;
	border-bottom-color: #525a4b;
	color: #fff;
}


/* -- secondary navigation -- */

.subnavcontainer {
	clear: left;
	float: left;
	width: 100%;
	/*background: #e6e6e6;*/
	background: #e6e6e6;
	margin-top: 1px;
}

.subnav {
	float: right;
	padding-top: 8px;
}

.subnav li {
	float: left;
	margin-right: 10px;
}

.subnav li a, .subnav li a:visited {
	padding: 5px 25px;
	display: block;
	color: #333;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

.subnav li a:hover, .subnav li a:focus {
	text-decoration: underline;
}

.subnav li.current {
	background: #fff url(../images/subtab-left.jpg) no-repeat left top;
}

.subnav li.current a, .subnav li.current a:visited {
	background: url(../images/subtab-right.gif) no-repeat right top;
}

.subnav li.current a:hover, .subnav li.current a:focus {
	text-decoration: none;
}

/* -- third level navigation -- */

.level3navcontainer {border-bottom: 2px solid #e6e6e6; width: 100%; overflow: hidden; clear: both;}
.level3nav {float: right; padding: 12px 0;}
.level3nav li {float: left; padding: 0 10px; border-left: 1px solid #ccc; line-height: 1.2em; overflow: visible;}
.level3nav li.current a, .level3nav li.current a:visited {color: #000;}
.level3nav li.first {border-left: none;}


/* -- main content -- */

.content {
	clear: left;
	padding: 14px 0 0 0;
	overflow: hidden;
}

.maincolumn {
	float: right;
	width: 55%;
}

.secondarycolumn {
	width: 40%;
	float: right;
	margin-right: 3%;
	
}

.intro {
	padding: 0 2em;
}

.intro2 {padding-left: 160px;}
.intro2 ul {margin-left:50px; list-style: disc;}

code 
{
	background: #FFF;
	border: 1px solid #EEE;
	border-left: 6px solid #CCC;
	color: #000;
	display: block;
	font: normal 1em "Verdana",sans-serif;
	line-height: 1.6em;
	padding: 8px 10px;
	white-space: pre;
	margin: 0px 40px 12px 80px;
}
.descr 
{

	color: #525a4b;
	font-size: 0.8em;
	margin-bottom: 6px;
}
/* -- application box on homepage -- */

.software-modules {
	background: url(../images/software-modules.jpg) no-repeat left top;
	height: 241px;
	width: 486px;
	margin-top: 20px;
}

.software-modules h2 {
	display: none;
}

.software-modules img {
	float: left;
	padding-top: 57px;
}

/* -- */

.download /* download box on homepage */ {
	clear: left;
	width: 441px;
	background: url(../images/downloads-bg.gif) repeat-y left;
	margin-left: 20px;
}
.plain-download 
{
   clear: left;
   padding-top:10px;
   padding-left: 5px;
   width: 190px;
}
.plain-download a /* download button on homepage */ {
	display: block;
	background: url(../images/download-prepostoffice.jpg) no-repeat left top;
	width: 240px;
	height: 67px;
	text-indent: -9999px;
}
.plain-download ul 
{
	float:left;
	width: 250px;
}
.demo a /* demo link */ {
	display: block;
	width: 353px;
	height: 254px;
	background: url(../images/screenshot.jpg) no-repeat left top;
	text-indent: -9999px;
	float: right;
}

.white-box /* white boxes on homepage */ {
	background: #fcfcfa url(../images/white-box-bg.gif) no-repeat left top;
	margin: 15px 0;
	width: 100%;
}

.white-box-right {
	background: url(../images/white-box-right.gif) no-repeat right top;
}

.white-box-bottom {
	background: url(../images/white-box-bottom.gif) no-repeat right bottom;
}

.white-box-left {
	background: url(../images/white-box-left.gif) no-repeat left bottom;
	padding: 15px;
}

.white-box h2, .white-box h3 {
	margin-top: 0;
}

.box /* fading panels on modules pages */ {
	background: url(../images/box-right.jpg) no-repeat right top;
	margin: 0 20px 20px;
	overflow: hidden;
	clear: left;
}

.box-inner {
	background: url(../images/box-left.jpg) no-repeat left top;
	padding: 15px 20px;
}

.box h2, h3, h4 {color: #e96d06;}
.box h4
{
	text-decoration: underline;
}

.box h1 {
	margin: 0 0 10px 0;
	font-size: 3.0em;
	padding-bottom: 15px;
}

.box h3, h3.heading {
	margin: 0 0 10px 0;
	font-size: 1.8em;
}

.box p, .box h4, .box h5, .box ul, .box dl, .box ol {
	padding: 0 20px;
	margin-left: 60px;
}

.box ul.bullets {
	margin-left: 95px;
	width: auto;
}

.box dl {
	margin-top: 0;
	
}

.box dt, .box dd {
	float: left;
	margin-bottom: 5px;
}

.box dt {
	clear: left;
	width: 10%;
	text-align: right;
	margin-right: 2%;
	font-weight: bold;
}

.box .tutorials {margin-left: 30px;}

.box .tutorials dt {
	width: 28%;
	text-align: left;
}

.box .tutorials dd {
	width: 68%;
}

.box dd {
	width: 87%;
}

.read-more a /* download button on homepage */ {
	display: block;
	background: url(../images/more.png) no-repeat left center;
	text-indent: 30px;
	float:left;
	padding-right: 5px;
	margin-top: -10px;
}
/*.box img {margin-left: 40px;}*/



.runs-on h3 {
	position: absolute;
	z-index: 100;
}

.right {float: right; width: 40%;}

.features ul {
	list-style: disc;
	margin-left: 20px;
}

.features li {
	line-height: 1.2em;
	margin-bottom: 1em;
}

.featuredtext {
	margin-left: 230px;
}

.callout {
	background: #f3f3f1;
	border: 3px solid #ececec;
	padding: 10px;
}

.callout ul {
	list-style-image: url(../images/check-mark.png);
	margin-left: 25px;
}

.callout ul.arrows {list-style-image: url(../images/arrow.gif)}

.callout li {
	padding-bottom: 5px;
}

.example {margin-bottom: 10px;}

.example-data {margin-left: 20px;}

.callout2 {
	background: #f3f3f1;
	padding: 10px;
	margin: 15px 0 0;
}

.module 
{
	border-bottom: 1px solid #ccc;
	padding-left: 125px;
	padding-bottom: 35px;
	margin-bottom: 25px;
	overflow: hidden;
}

.module-panel {
	float: left;
	padding: 15px 15px 15px 105px;
	margin-bottom: 30px;
	border: 5px solid #e6e6e1;
}

.module-panel h2 {
	margin-bottom: 0;
}

.module-panel h3 {
	font-size: 1em;
	margin-top: 0;
}

.module-panel a {
	text-align: right;
	display: block;
}

.scrubs-module2 {
	border-bottom: none;
	padding-bottom: 0;
}

.scrubs-module, .scrubs-module2 {
	background: url(../images/scrubs-image.jpg) no-repeat left top;
}

.sieve-module {
	background: url(../images/sieve-image.jpg) no-repeat left top;
}

.sieve-module-panel {
	background: #f5f5ef url(../images/sieve-image.jpg) no-repeat 10px center;
	margin: 0 15px;
}

.easy-module {
	background: url(../images/easy-street-image.jpg) no-repeat left top;
	border-bottom: none;
}

.easy-module-panel {
	background: #f5f5ef url(../images/easy-street-image.jpg) no-repeat 10px center;
}



.module-panel h2.coming-soon {
	background: url(../images/coming-soon-grey.jpg) no-repeat right top;
}


.coming-soon {
	float: right;
	background: url(../images/coming-soon.jpg) no-repeat left top;
	padding: 25px 160px 25px 75px;
	font-weight: bold;
}

.get-it-free {
	float: right;
	background: url(../images/get-it-free.jpg) no-repeat left top;
	padding: 18px 0 18px 75px;
	font-weight: bold;
}

.featureslist {
	margin-left: 35px;
	list-style-image: url(../images/check-mark.png);
	color: #0000ff;
}

.featureslist li {
	padding-bottom: 5px;
}

ol {list-style-type: decimal; margin-left: 45px; margin-bottom: 30px;}
ol li {margin-bottom: 8px;}

.faq { padding: 20px 50px 20px 50px; }

.padder {margin: 0 50px;}

ul.bullets {
	list-style: disc;
	margin-left: 20px;
	margin-bottom: 20px;
	margin-top: 10px;
	width: 100%;
}

.sections {padding: 0 30px;}



.answer-inner, .submit-question-inner {
	padding: 15px;
	overflow: hidden;
}

.submit-question {
	background: #f0fcc6;
	overflow: hidden;
}
.submit-question p 
{
	padding: 5px 0px 0px 125px;
}

.submit-question dl {
	margin-top: 10px;
	width: 100%;
}

.submit-question dt, .submit-question dd {
	float: left;
	margin-bottom: 5px;
}

.submit-question dt {
	clear: left;
	width: 20%;
	text-align: right;
	margin-right: 2%;
}

.submit-question dd {
	width: 70%;
}

.submit-question textarea {
	width: 80%;
	height: 60px;
}

.submit-question input {
	width: 60%;
	margin-right: 1%;
}

.submit-question button {
	width: 19%;
}

dt {position: relative;}

dt span {
	color: #ff0000;
	position: absolute;
	right: -15px;
	top: 3px;
}

.answer {
	border: 1px solid #ccc;
	margin-bottom: 15px;
}
.answer-inner, .submit-question-inner {
	border: 1px solid #929f4d;
	padding: 15px;
	overflow: hidden;
}
.answer h3, .faq h3 {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #e96d06 ;
	margin: 0 0 10px 0;
}

.answer h4, .answer p {
	margin: 0 0 0 10px;
}

.answer h4 {
	margin-bottom: 10px;
}

.ask-a-question 
{
	padding-top: 20px;
}
.ask-a-question a {
	display: block;
	background: url(../images/ask-question.jpg) no-repeat left top;
	width: 220px;
	height: 50px;
}
/*left side with image and download*/
.module-features-screenshot 
{
	float:left;
	width: 60px;
	padding-top: 5px;
}
/*right side with feature list*/
.module-features-wrapper 
{
	margin-left: 270px;
	padding-bottom: 10px;
}

.module-features {
	width: 100%;
	float: left;
}

.module-features dt, .module-features dd {
	float: left;
	margin-bottom: 5px;
}
.module-features dd {border-bottom: 1px solid #d1d1d1; padding-bottom: 3px;}

.module-features dt {
	clear: left;
	width: 20%;
	text-align: right;
	margin-right: 1%;
}

.module-features dd {
	width: 75%;
}

.screencasts {border: 1px solid #e5e5e3; margin: 10px 20px; background: #fff;}
.screencasts td {padding: 10px; border-bottom: 1px solid #d1d1d1; border-right: 1px solid #d1d1d1;}
td.play a {display: block; width: 19px; height: 19px; text-indent: -9999px; background: url(../images/play-button.gif)}
td.noplay a{display: block; width: 19px; height: 19px; text-indent: -9999px; background: url(../images/play-disabled.gif);}
td.time-length {width:60px;}
.screencasts img {margin: 0;}

.email-sent 
{
	padding: 10px 160px;
	float:left;
}


.change-log-image-left {
	float: left;
	display: block;
	width: 45%;
	border-right-width:thin;
	border-right-color: Gray;
	border-right-style:dashed;
}

.other-versions p 
{
	margin: 0px;
	padding: 0px;
	font-size: 0.9em;
}
.change-log-image-right {
	float: right;
	display: block;
	padding-bottom: 15px;
}

.footer {
	background: #525a4b;
	overflow: hidden;
	padding: 7px 0;
	text-align: center;
	margin: 15px 0 0 0;
}

.footer ul {
}

.footer li {
	display: inline;
	border-left: 1px solid #ecece9;
	padding: 0 15px;
}

.footer li.first {
	border-left: none;
}

.footer li a {
	background: #525a4b;
	color: #ecece9;
	font-weight: bold;
}

.footer a:visited {
	background: #525a4b;
	color: #fff;
	font-weight: bold;
}
/* ---- Form styles ---- */
.singlecolumn form {background: #f0fcc6; margin-bottom: 25px; overflow: hidden; border: 1px solid #929f4d; clear: left;}

.content form {margin: 1em 160px 1em 160px; background: #f0fcc6; margin-bottom: 25px; overflow: hidden; border: 1px solid #929f4d; clear: left;}
.content form fieldset {border: 7px solid #f0fcc6; margin: 0; padding: 1em 0; overflow: hidden;}
.content form legend {margin-left: 2em; padding: 0 5px; font-weight: bold; font-family: Arial, Helvetica, sans-serif;}
.content form dt, .content form dd {float: left; margin-bottom: 6px;}
.content form dt {clear: left; width: 25%; text-align: right; margin-right: 3%;}
.content form dd {width: 70%;}
.content .formButtons {padding: 0.5em 0 0.5em 28%; clear: left;}


#contactForm input {width: 20em;}
#contactForm textarea {width: 27em; height: 7em;}


.otherContent1 form, .otherContent2 form {margin: 1em 0;}
.otherContent1 form dt, .otherContent2 form dt {margin-bottom: 6px;}
.otherContent1 form dd, .otherContent2 form dd {margin-bottom: 10px;}

.statusMessage {padding: 10px 10px 10px 35px;}
.fail {background: #f5eceb url(../images/exclamation.png) no-repeat 10px 10px;}
.success {background: #eef7f1 url(../images/accept.png) no-repeat 10px 10px;}
.info {background: #ebecf5 url(../images/information.png) no-repeat 10px 10px;}
.warning {background: #fcffe1 url(../images/error.png) no-repeat 10px 10px;}

