﻿/*
	--------------------------
	Common Page Styles
	--------------------------
*/

/*  Custom Classes
--------------------------  */

/* contain */
.contain:after	{ content: ""; display: block; clear: both; visibility: hidden; height: 0px; }
.contain		{ display: inline-block; }

/* hidden */
.hidden	{ display: none; }

/* clear */
.clear	{ clear: both; }

/*  Container divs to give 100% width but also a min width for IE 
--------------------------  */

#outer	{ width: 100%; min-width: 65em; }
* html #minwidth	{ width: 100%; border-left: solid 65em #fff; }
* html #inner	{ margin-left: -65em; position: relative; }
/*\*/
* html #minwidth, * html #inner {
	height: 1px;
}
/**/

/*  Typography 
--------------------------  */
html, body  { height: 100%; width: 100%; }

body 		{ font-family: tahoma,arial,helvetica; color: #605f5f; background-color: #f4f5f5; font-size: 1em; line-height: 1.1em; margin: 0px; padding: 0em; width: 100%; }
body.white 		{ background-color: #fff; }

h1 			{ font-size: 1.5em; color: #0a3f45; }
h2 			{ font-size: 1.25em; color: #f47c2a; margin-top: 0px; }
h3 			{ font-size: 1em; color: #507d80; }
h4, h5, h6, h7	{ font-size: 0.85em; margin-bottom: 0px; }

p,li,td,dt,dd	{ font-size: 0.75em; }
li li	{ font-size: 1em; }

a 			{ text-decoration: none; color: #605f5f; }
a:hover		{ text-decoration: none; color: #0f494a; }

a img		{ border: 0px; }

input, select, textarea		{ font-family: arial,helvetica; font-size: 0.7em; color: #6d6d6f; }

input.radio, input.check    { width: 2em; }

/* General */
.right	    { float: right; }
.centre		{ text-align: center; }
.currency   { text-align: right; }
.column     { width: 45%; margin-right: 3%; padding: 0.25em; float: left; }
.nowrap     { white-space: nowrap; }
.red    { color: #ff0000; }

.print  { display: none; }

.tabular span   { display: block; width: 10em; float: left; font-weight: bold; }

img.tool    { margin-left: 0.35em; vertical-align: middle; }

/*  Forms 
--------------------------  */

input.xxsmall, select.xxsmall   { width: 1em; }
input.xsmall, select.xsmall   { width: 3em; }
input.small, select.small   { width: 5em; }
input.medium, select.medium   { width: 7.5em; }
input.large, select.large   { width: 10em; }
input.xlarge, select.xlarge   { width: 15em; }
input.xxlarge, select.xxlarge   { width: 20em; }
input.normal, select.normal   { width: auto; }

/*  Template 
--------------------------  */

#header { width: 100%; background-color: #fff; padding-top: 0.5em; }
#header h1  { margin: 0.35em 0px 0.35em 0px;  }
#header h1 img { float: none; margin: 0.25em 1em 0px 1em; padding: 0px; border: 0px; vertical-align: middle; }

#linksmain  { width: 100%; border-top: solid 1px #ddd; list-style-type: none; margin: 0px; padding: 0px 0px 4px 0px; background: #f4f5f5 url(../files/interface/links-gradient.jpg) repeat-x bottom; }
#linksmain li  { float: left; border-right: solid 1px #fff; }
#linksmain li a { display: block; padding: 0.25em 1em 0.6em 1em; }
#linksmain li a img { border: 0px; vertical-align: middle; margin-right: 0.25em; }
#linksmain li.first   { padding-left: 0.5em; }
#linksmain li.last   { float: right; padding-right: 0.5em; }

#linksmain li.home   { background: #fbbea0 url(../files/interface/orange-gradient.jpg) repeat-x bottom; }
#linksmain li.home a { color: #555; }

#linksmain li:hover   { background: #aabfc1 url(../files/interface/green-gradient.jpg) repeat-x bottom; }
#linksmain li:hover a { color: #fff; }

#linksmain li.current   { background: #aabfc1 url(../files/interface/green-gradient.jpg) repeat-x bottom; }
#linksmain li.current a   { color: #fff; }

#mainbody   { width: 100%; }

#linksleft  { width: 12%; float: left; }

#linkssub  { width: 90%; list-style-type: none; margin: 0.75em 0px 0px 0.75em; padding: 0px; background-color: #fff; border: solid 1px #ddd; position: relative; }
#linkssub li  { margin: 0px; }
#linkssub li a  { display: block; padding: 0.5em 1em; }
#linkssub li a img  { margin-right: 0.5em; border: 0px; vertical-align: middle; }
#linkssub li a:hover  { background-color: #f4f5f5; }

#linkssub li.current a  { background-color: #f4f5f5; }

/*  Site options list 
--------------------------  */

div#trackeroptions { float: right; padding: 0px 0.25em 0px 0px; margin: 0px; font-weight: bold; font-size: 0.75em; text-align: right; color: #ccc; position: relative; z-index: 100; }
div#trackeroptions span { border: solid 1px #ccc; display: inline-block; padding: 0.25em 0.25em; margin: 0px; vertical-align: top; }
div#trackeroptions span.arrow { border: solid 1px #ccc; display: inline-block; padding: 2em 0.25em; margin: 0px; }
div#trackeroptions img { height: 4em; padding: 0.5em; margin: 0px; vertical-align: middle; }
div#trackeroptions span img.shallow { height: 2.5em; padding: 0.5em; margin: 0px; vertical-align: middle; border: solid 0.75em #fff; }

div#trackeroptions:hover   { color: #333; cursor: pointer; }
div#trackeroptions:hover span  { border: solid 1px #333; }
div#trackeroptions:hover div   { border: solid 1px #333; }

div#trackeroptions.singletracker  { border: 0px; cursor: default; }
div#trackeroptions.singletracker img  { border: 0px; }

div#trackeroptions ul  { list-style-type: none; position: absolute; margin: 0px 0.25em 0px 0px; padding: 0px; right: 0px; top: 6em; border: solid 1px #ccc; background-color: #fff; z-index: 100; }
div#trackeroptions ul li  { font-size: 1em; border-bottom: solid 1px #ccc; text-align: center; }

div#trackeroptions:hover ul    { border: solid 1px #333; }

div#trackeroptions ul li img  { border: 0px; }
div#trackeroptions:hover ul li img  { border: 0px; }
div#trackeroptions ul li img.shallow { height: 1.75em; }

/*  Content 
--------------------------  */

div#contentcolumn  { width: 88%; float: left; }
div#contentouter  { width: 96%; float: left; margin: 0.75em 0px 0px 0.75em; padding: 0px; background-color: #fff; border: solid 1px #ddd; position: relative; z-index: 15; }
div#content  { padding: 0.5em; }

/* footer */
#footer { border-top: solid 2px #ddd; width: 100%; font-size: 0.7em; margin-top: 1em; padding-top: 1em; }
#footer span { padding: 0.5em 1.5em; }

/*
	Edit Panel
*/
#edititem, #newitem, #newpost	{ position: absolute; top: 5%; left: 10%; width: 80%; height: 90%; padding: 0px; z-index: 70; border: solid 1px #000; background-color: #fff; }
#edititem img#formloadinganim	{ margin-top: 25%; }

/*
	Greyout Panes
*/
#greyoutcontent, div.greyout, div.greyoutscreen	{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; margin: 0px; padding: 0px; z-index: 50; background-color: #fff; text-align: center; }
#greyoutlinks	{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; margin: 0px; padding: 0px; z-index: 50; background-color: #fff; }

#greyoutcontent img, div.greyout img { top: 5em; position: relative; }

div.greyoutscreen	{ position: absolute; }
div.greyoutscreen img { top: 40%; position: relative; }

/*
    Password form
*/
div.changepassword	{ width: 35em; z-index: 100; position: absolute; top: 2em; left: 50%; background: #fff; border: solid 1px #000; padding: 2em; margin: 3em -17.5em; }
div.changepassword label	{ width: 100%; display: block; font-size: 0.75em; }
div.changepassword input	{ width: 25em; }

div.changepassword input#confirmpassword	{ width: 25.5em; margin-top: 5px; }

/*
    Property Lookup
*/

div#valuationpropertylookup, div#projectpropertylookup  { width: 30em; border: solid 1px #000; position: absolute; z-index: 100; background-color: #fff; padding: 1em; left: 10em; }
div#valuationpropertylookup ul, div#projectpropertylookup ul   { list-style-type: none; margin: 1em; padding: 0px; }
div#valuationpropertylookup ul li span, div#projectpropertylookup ul li span   { display: inline-block; width: 8em; }