/*
 * Eric Meyer's reset file.
 * See http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
 */
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, 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;
        font-weight: inherit;
        font-style: inherit;
        font-size: 100%;
        font-family: inherit;
        vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
        outline: 0;
}
body {
        line-height: 1;
        color: black;
        background: white;
}
ol, ul {
        list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
        border-collapse: separate;
        border-spacing: 0;
}
caption, th, td {
        text-align: left;
        font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
        content: "";
}
blockquote, q {
        quotes: "" "";
}


/*
 * Give any elements that need to be cleared a class of "clearfix".
 * See http://www.positioniseverything.net/easyclearing.html for details.
 */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;}

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

/*
 * Base
 */
body {
  font-family: arial;
  font-size:   0.75em;
  line-height: 1.5em;
}

em {
	font-weight: bold;
}

/*
 * Colours
 */
body {
	background-color: #f0eadd;
	color: #000000
}

/*
 * Top-level layout
 */
#header {
	padding-top: 10px;
	height: 120px;
}

#top-right-sheep {
	float: right;
}

#site-branding {
	padding-top: 20px;
	float: left;
}

#site-tagline {
	clear: left;
	float: left;
	margin-top: 15px;
	font-size: 2.2em;
	letter-spacing: -1px;
}

#phone-the-ceo {
	float: right;
	width: 14em;
	display: block;
	font-size: 1em;
}

#header-right {
	width: 550px;
	display: block;
	float: left;
	margin-left: 80px;
}

#session-details {
	float: left;
}

#static-navigation {
	margin-top: 5px;
	float: left;
	clear: left;
	font-size: 1.7em;
}

#static-navigation li {
	float: left;
	margin-right: 1.4em;
	padding-bottom: 0.3em;
}

#static-navigation li a {
	color: #f47929;	
	text-decoration: none;
}

#top-menu {
	margin-top: 10px;
	margin-left: 40px;
	float: left;
	width: 320px;
}

#footer {
	margin-top: 33px;
	background-image: url(../images/footer_graphic.png);
	height: 47px;
	padding-top: 80px;
	padding-left: 5px;
}

#footer-text {
	background-color: #000000;
	width: 930px;
	color: #ffffff;
}

#footer-text a {
	color: #ffffff;
	text-decoration: none;
}

#footer-menu {
	float: left;
	margin-left: 30px;
}

#copyright {
	float: right;
	margin-right: 30px;
}

#page-wrapper {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}

#central-panel {
	width: 944px;
	margin-left: auto;
	margin-right: auto;
}

#navigation {
	margin-left: 50px;
}

#navigation ul {
	margin: 0;
	padding: 0;
}

.tab-profile {
	width: 150px;
}

#navigation li {
	height: 29px;
	float: left;
	font-size: 1.5em;
	font-family: Times;
	margin-right: 10px;
}

#navigation li a {
	height: 29px;
	display: block;
	text-align: center;
	text-decoration: none;
}

.tab-receipt-library {
	width: 200px;
}

#main-content {
	padding: 20px;
	background-image: url(../images/backgrounds/main-content-bg.png);
	background-repeat: repeat-y;
}

/*
 * Homepage
 */
.explanation-box {
	margin-top: 46px;
	margin-right: 20px;
	width: 300px;
	height: 240px;
	float: left;
	color: #ffffff;
}

.explanation-box p {
	margin: 10px;
	font-size: 1.8em;
	font-family: Times;
	color: #ffffff;
}

.explanation-box ul {
	margin: 0 10px;
	padding: 0;
	list-style: circle;
	list-style-position: inside;
}

#explanation-box-1 {
	background-color: #56b6de;
}

#explanation-box-2 {
	background-color: #f47929;
}

#explanation-box-3 {
	background-color: #e82c2d;
	margin-right: 0;
}

.explanation-box-image {
	width: 280px;
	height: 140px;
	margin-left: 10px;
	margin-right: 10px;
}

.explanation-panel {
	width: 300px;
	float: left;
	margin-right: 9px;
	margin-bottom: 20px;
}

.explanation-panel-last {
	margin-right: 0;
}

.explanation-panel .number {
	float: left;
	margin-right: 10px;
}

#explanations .text, #explanations p {
	float: left;
	line-height: 1.2;
	color: #333;
}

#explanations h2 {
	font-size: 1.3em;
	padding: 0;
	margin-top: -3px;
	margin-bottom: 0;
}

#explanations p {
	font-size: 0.9em;
	padding: 0;
	margin: 0;
	margin-bottom: 10px;
}

.explanation-pic {
	display: block;
	float: left;
	height: 200px;
}

.quote {
	font-size: 1.5em;
	padding: 1em;
	background-color: #eee;
}

.quote-author {
	color: #888;
	font-style: italic;
    text-align: right;
	margin-bottom: 3em;
}

/*
 * Signup page
 */
#signup-intro {
	width: 700px;
	font-size: 1.5em;
	color: #ec6c3b;
	font-family: Times;
}

/*
 * Forms
 */
form {
	margin-top: 0em;
}

fieldset {
	background: none;
	border: none;
	border-bottom: 1px dashed #999;
	padding: 1em 0;
}

legend {
	color: #3ab6ea;
	border: none;
	background: none;
	font-size: 1.5em;
	padding: 0;
	font-weight: normal;
}

label {
	text-align: left;
	width: 120px;
	margin: 0.5em 0;
	margin-right: 0.3em;
	float: left;
	clear: both;
}

input, select, textarea, .checkbox-area {
	margin: 0.5em 0;
	margin-right: 0.3em;
	float: left;
}

.text-field-suffix {
	margin: 0.5em 0;
	float: left;
}

.checkbox-area input {
	margin: 0;
	margin-right: 0.5em;
}

form .note {
	float: left;
	margin-bottom: 1em;
}

form em {
	margin: 0.5em 0;
	float: left;
	color: #ff0000;
}

.submit, form p.note {
	margin-left: 100px;
}

/*
 * Misc
 */
.testimonial {
	font-size: 1.4em;
	padding: 20px;
	margin: 2em 0;
	background-color: #eee;
	width: 390px;
	margin-right: 30px;
	float: left;
}

.testimonial.last {
	margin-right: 0;
}

.testimonial cite {
	float: right;
}

.large-button {
	background-image: url(../images/button.png);
	width: 214px;
	height: 37px;
	border: none;
	margin: 1em 0;
	margin-left: auto;
	margin-right: auto;
	float: none;
}

.pricing {
	background-color: #eee;
}

.pricing td {
	border: 1px solid #ccc;
	text-align: center;
	font-size: 1.3em;
	padding: 2em 0;
	width: 25%;
}

.pricing h2 {
	font-size: 3.0em;
	padding-bottom: 0.5em;
}

.pricing .description {
	text-transform: uppercase;
	color: #448;
}

.pricing em {
	font-weight: bold;
	color: #800;
}

.largeReceiptImage {
	float: left;
	width: 400px;
}

.receiptImage {
	float: left;
	max-width: 50%;
}

table {
	width: 100%;
}

#receiptFields {
	background-color: #ffffff;
	width: 420px;
	float: left;
}

#receiptFields form {
	margin-top: 0;
}

#inputter-screen #receiptFields {
	position: fixed;
	top: 2em;
	left: 400px;
	padding: 1em;
	border: 1px solid #ccc;
}

h1 {
	font-weight: bold;
	font-size: 2.0em;
	padding-bottom: 1em;
	color: #000000;
}

h2 {
	color: #3ab6ea;
	border: none;
	background: none;
	font-size: 1.5em;
	padding: 0;
	font-weight: normal;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

h3 {
	color: #000000;
	border: none;
	background: none;
	font-size: 1em;
	font-weight: bold;
	padding: 0;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

ul, ol {
	padding: 1em 0;
}

ol li {
	list-style: decimal;
	list-style-position: inside;
}

ol li ol {
	margin-left: 2em;
}

ol li ol li {
	list-style: lower-roman;
}

dl {
	padding: 1em 0;
}

strong {
	font-weight: bold;
}

dt {
	clear: left;
	float: left;
	width: 30%;
}

dd {
	float: left;
	display: inline;
	width: 65%;
}

p {
	padding: 0.2em 0;
}	

.full-table {
	margin-bottom: 1em;
}

.full-table th {
	font-size: 1.3em;
}

th {
	padding: 0.2em 0.3em;
	color: #3fbaf3;
}

th a, th a:visited {
	color: #3fbaf3;	
	text-decoration: none;
}

.full-table td {
	padding: 0.4em 0.4em;	
	border-top: 1px dashed #ccc;
}

th.center, td.center {
	text-align: center;
}

th.currency, td.currency {
	text-align: right;
}

cite {
	font-style: italic;
	font-size: 0.8em;
}

pre {
  background-color: #eee;
  padding: 10px;
  font-size: 11px;
}

a { color: #000; }
a:visited { color: #666; }
a:hover { color: #aaa; }

.fieldWithErrors label {
	color: red;
}

#flash {
	font-size: 1.3em;
	line-height: 1.3em;
}

#flash p.notice, #flash p.error {
	padding: 0.5em 1em;
	margin: 0.5em 0;
}

#flash p.notice {
	color: #708010;
	border: 2px solid #9ea61a;
	background: #bed63a;
}

#flash p.error {
	color: #901010;
	border: 2px solid #b81c1d;
	background: #e82c2d;
}

.zoom-button {
	font-size: 1.2em;
	text-align: center;
	float: left;
	width: 50%;
	padding: 2.5em 0;
}

#zoom_in {
	background-color: green;
}

#zoom_out {
	background-color: red;
}

.envelope-address {
	height: 10em;
}

.error {
	color: red;
}

.query {
	padding: 1em;
	background-color: #ffff22;
}

.pagination {
	padding-bottom: 1em;
	text-align: center;
}

.pie-chart {
	padding: 1em 0;
	width: 700px;
	margin-left: auto;
	margin-right: auto;
}

/*
 * Homepage
 */
#explanations {
	float: left;
	padding: 20px 10px;
	width: 918px;
	background-color: #ffffff;
	background-image: url(../images/home/explanations-middle.png);
	background-repeat: repeat-y;
}

#special-offer {
	width: 50%;
	display: block;
	float: left;
	padding-top: 16px;
}

#signup-area {
	padding-top: 7px;
	float: right;
}

.vr {
	float: left;
	padding-top: 7px;
}

a.signup-button {
	width: 437px;
	height: 56px;
	display: block;
	float: right;
	background-image: url(../images/home/signup-button-2.gif);
	border-style: none;
}

a.signup-button:hover, .signup-button:active {
	background-position: 0 -56px;
}

.find-out-more-button {
	margin-top: 10px;
	float: right;
}

.home-box-half, .home-box-third {
	float: left;
	margin-right: 20px;
	margin-top: 20px;
	background-color: #ffffff;
}

.home-box-third {
	width: 300px;
	height: 280px;
}

.home-box-half {
	width: 460px;
	height: 365px;
}

.home-box-right {
	margin-right: 0;
}

.home-box-content {
	padding: 10px;
}

.home-box-content h3 {
	margin-top: 0;
	margin-bottom: 0;
}

.home-box-content p {
	margin-bottom: 0.5em;
}

.secure-and-safe {
}

.tick-list {
	list-style-image:url(../images/home/tick.png);
	list-style-position: inside;
	padding: 0;
}

.tick-list li {
	margin-bottom: 0.5em;
}

#testimonials {
	margin-top: 20px;
}

/* Pricing and Sign Up Page */
.price-plan {
	float: left;
	width: 210px;
	margin-right: 20px;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 20px;
}

.price-plan-last {
	margin-right: 0;
}

.price-plan-selected {
	border: 1px solid #000;
}

.price-plan-image {
	display: block;
	margin-left: auto;
	margin-right: auto;
	height: 184px;
}

.paypal_subscribe_button {
	width: 149px;
	margin-left: auto;
	margin-right: auto;
}

.paypal_unsubscribe_button {
	width: 113px;
	margin-left: auto;
	margin-right: auto;
}

/* ZX Spectrum Competition Page */
#left-panel {
	width: 62%;
	float: left;
}

#right-panel {
	width: 35%;
	float: right;
}

.ac_results {
	padding: 0px;
	border: 1px solid black;
	background-color: white;
	overflow: hidden;
	z-index: 99999;
}

.ac_results ul {
	width: 100%;
	list-style-position: outside;
	list-style: none;
	padding: 0;
	margin: 0;
}

.ac_results li {
	margin: 0px;
	padding: 2px 5px;
	cursor: default;
	display: block;
	/* 
	if width will be 100% horizontal scrollbar will apear 
	when scroll mode will be used
	*/
	/*width: 100%;*/
	font: menu;
	font-size: 12px;
	/* 
	it is very important, if line-height not setted or setted 
	in relative units scroll will be broken in firefox
	*/
	line-height: 16px;
	overflow: hidden;
}

.ac_loading {
	background: white url('indicator.gif') right center no-repeat;
}

.ac_odd {
	background-color: #eee;
}

.ac_over {
	background-color: #0A246A;
	color: white;
}
