/* Default stylesheet for CompletelyRetail.co.uk  
 * Written by Andy Wardley <abw@wardley.org> for Squeeze Ltd.
 */

/*------------------------------------------------------------------------
 * css/reset.css
 *   Resets default browser styles.  Created by Erik Meyer, v1.0, 2008-02-12
 *   http://meyerweb.com/eric/tools/css/reset/index.html 
 *   Adapted by Andy Wardley http://wardley.org/
 *------------------------------------------------------------------------*/

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, input,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
    font-family: Arial,Helvetica,sans-serif;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

body {
	line-height: 1;
    color: #888;
    background: #FFFFFF;
}

ol, ul {
	list-style: none;
}

i {
    font-style: italic;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:active, :focus {
	outline: none;
}

/*
button::-moz-focus-inner, 
submit::-moz-focus-inner, 
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
    border: none;
}
*/

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*------------------------------------------------------------------------
 * css/typography.css
 *   Define the default typography styles.  
 *   Written by James Bridge-Butler and Andy Wardley
 *------------------------------------------------------------------------*/

html { 
    font-size: 62.5%;    /* default 1em == 16px x .625 -> 10px */
    line-height: 135%; 
}    

body { 
    font-family: Arial,Helvetica,sans-serif;
    line-height: 140%;
}

h1,h2,h3,h4,h5,h6 {
    font-family: Arial,Helvetica,sans-serif;
    color: #888;
}

h1              { font-size:14px; line-height: 140%; margin:1em 0 0.6em 0; }
h2              { font-size:13px; margin:10px 0 7px 0; }
h3              { font-size:12px; margin:10px 0 8px 0; }
h4              { font-size:12px; margin:8px 0 10px 0; }
h5              { font-size:12px; font-weight:bold; margin:9px 0 0 0;  }
h6              { font-size:12px; font-style:italic; font-weight:normal; margin:9px 0 0 0;  }

p               { font-size:14px; line-height: 150%; margin:0 0 5px 0; }

img             { border:0;}
acronym         { cursor:pointer; border-bottom: 1px dashed #F3A223 }
ul              { list-style-type:disc; margin:0;}
ul li           { font-size:10px; margin:2px 0 2px 20px;}
ol              { list-style-position:inside; }
address         { display:block; font-style:normal; font-size:12px; line-height:20px; } 
caption         { text-align:left; font-size:12px; font-weight:bold;}
th              { font-size:12px; text-align:left; }
td              { font-size:12px; padding: 2px 4px; }
ul              { margin-top: 5px; }
ul.inline       { list-style: none; margin: 0; padding: 0; }
ul.inline li    { float: left; clear: none }
a,a:link        { color: #7E5493; outline: none; text-decoration: none }
a:visited       { color: #7E5493; }
a:hover,a:active
                { color: #F3A223; }
form            { }
fieldset        { }
legend          { }
label           { }
option          { padding-left:0.3em; }
input.checkbox  { font-size:1em; border:0em;}
input.radio     { margin:0.3em 0.2em 0.3em 0.4em; }
input.submit    { width:auto; }
input,select,textarea { 
    background:#fcfcfc; border:1px solid #888; 
    font-size:12px; line-height:16px; color: #444;
    padding:3px; 
}
input:active, input:focus,
select:active, select:focus,
textarea:active, textarea:focus {    
    background: #fff; border:1px solid #7E5493; 
    color: #000;
    outline: 0;
}
hr              { border: 0; height: 1px; margin: 10px 0; clear: both }
    
table tr, table tr td
                { vertical-align: top }
pre, code       { font-family: Courier, monospace; font-size: 14px; line-height: 18px}

.access         { position: absolute; left: -9999px; display: none; }
.shown          { display: block }
.hidden         { display: none  }
.error          { color: #ff0000 }
.small          { font-size: 12px; line-height: 16px; }
.tiny           { font-size: 10px; line-height: 14px; }
.fll            { float: left   }
.flr            { float: right  }
.cll            { clear: left   }
.clr            { clear: right  }
.cln            { clear: none   }
.clear          { clear: both   }
.middle         { margin-left: auto; margin-right: auto }
.left           { margin-left: 0; margin-right: auto }
.right          { margin-left: auto; margin-right: 0 }
.inset          { margin-left: 20px }
.vgap           { margin-top: 20px; margin-bottom: 20px }
.margin         { margin: 10px }
.NYI            { clear: both; float: none; opacity: 0.3; }  /* Not Yet Implemented */
.centre,.center { text-align: center; }
.text-right     { text-align: right; }
.text-left      { text-align: right; }
.blue           { color: #0488B4 }
.gold           { color: #F9A51A }
.bold           { font-weight: bold }/*------------------------------------------------------------------------*/
/* css/chrome.css - styles for overall site layout and branding           */
/*------------------------------------------------------------------------*/

html {
    background-color: #f4f4f4;
}

body {
    display: block;
    width: 980px;
    margin: 0 auto 10px;
    padding: 10px;
}

#header {
    position: relative;
    overflow: visible;
    z-index: 1105;
}

#header #banner {
    height: 76px;
    position: relative;
    background: url('../images/chrome/header_background_2.gif') no-repeat top left;
}

#header #logo {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 94px;
    height: 76px;
    background: url('../images/chrome/logo_2.gif') no-repeat top left;
}

#header #text_logo {
    display: block;
    position: absolute;
    top: 11px;
    left: 106px;
    width: 297px;
    height: 53px;
    background: url('../images/chrome/text_logo_2.gif') no-repeat top left;
}

#header #association {
    display: block;
    position: absolute;
    top: 38px;
    left: 525px;
    width: 124px;
    height: 35px;
    background: url('../images/chrome/association.gif') no-repeat top left;
}

#header #status {
    clear: both;
    height: 40px;
    background: url('../images/chrome/title/default.gif') no-repeat top left;
}

#header #status #clock {
    float: right;
    font-size: 11px;
    line-height: 24px;
    color: white;
    margin-right: 8px;
}

#header ul.links {
    position: absolute;
    width: 238px; 
    height: 16px;
    left: 500px;
    top: 56px;
    z-index:200;
}

#header ul.links li {
    clear: none;
    float: left;
    margin: 0 0 0 22px;
}

#header ul.links li a,
#header ul.links li a:link,
#header ul.links a:visited {
    font-size: 11px; 
    color: #FFFFFF;
    text-decoration: none;
}

#header ul.links li a:active,
#header ul.links li a:hover {
    color: #F3A223;
}

#header #forms {
    position: absolute;
    top: 0px;
    right: 0;
    width: 310px;
}

#header #forms ul.forms {
    margin: 0;
    width: 65px;
    float: left;
}

#header #forms ul.forms li {
    display: block;
    width: 65px;
    margin: 5px 0 3px 0;
    height: 20px;
}

#header #forms ul.forms li.last {
    margin-bottom: 0;
}

#header #forms ul.forms li a {
    display: block;
    width: 56px;            /* delete me */
    width: 65px;
    height: 20px;
    background: #aaa url('../images/chrome/form_tabs.gif') no-repeat top left;

    border-radius: 2px 0 0 2px; 
    -moz-border-radius: 2px 0 0 2px; 
    -webkit-border-radius: 2px 0 0 2px;
    -khtml-border-radius: 2px 0 0 2px;

}
#header #forms ul.forms li.warm a           { background-position:   0px  -40px }
#header #forms ul.forms li a.search         { background-position:  -80px   0px }
#header #forms ul.forms li.warm a.search    { background-position:  -80px -40px }
#header #forms ul.forms li a.register       { background-position: -160px   0px }
#header #forms ul.forms li.warm a.register  { background-position: -160px -40px }
#header #forms ul.forms li a.login          { background-position: -240px   0px }
#header #forms ul.forms li.warm a.login     { background-position: -240px -40px }
#header #forms ul.forms li a.user           { background-position: -320px   0px }
#header #forms ul.forms li.warm a.user      { background-position: -320px -40px }
#header #forms ul.forms li a.contacts       { background-position: -400px   0px }
#header #forms ul.forms li.warm a.contacts  { background-position: -400px -40px }
#header #forms ul.forms li a.logout         { background-position: -480px   0px }
#header #forms ul.forms li.warm a.logout    { background-position: -480px -40px }
#header #forms ul.forms li a.home           { background-position: -560px   0px }
#header #forms ul.forms li.warm a.home      { background-position: -560px -40px }
#header #forms ul.forms li a.admin          { background-position: -640px   0px }
#header #forms ul.forms li.warm a.admin     { background-position: -640px -40px }

#header #forms ul.forms li.blank a {
    background: transparent none;
}

#header #forms form,
#header #forms .panel { 
    float: left;
    width: 245px;
    height: 70px; 
    display: none;
    background: #666 url('../images/chrome/logged_in.gif') no-repeat top left;
} 

#header #forms .warm {
    display: block;
}

#header #forms form#search { 
    background: #666 url('../images/chrome/find_a_shop.gif') no-repeat 10px 12px;
}

#header #forms form fieldset { 
    margin: 12px 0 3px 0; 
}

#header #forms form#search fieldset { 
    margin-top: 36px; 
}

#header #forms form fieldset.fields { 
    float: left;
    width: 190px;
    margin-left: 10px;
}

#header #forms form fieldset.buttons { 
    clear: none;
    float: right;
    width: 30px;
    margin-top: 40px;
}

#header #forms form legend,
#header #forms form label { 
    display:none; 
}

#header #forms form input.text { 
    margin: 0 0 8px 0;
    width: 150px;           /* delete me */
    width: 180px; 
    height: 14px; 
    padding: 2px 4px;
    font-size: 12px; 
    color: #808080;
    background-color: #eee;
    border: 1px solid #fff;
}

#header #forms form input:focus { 
    color: #404040;
    background-color: #fff;
    border: 1px solid #fff;
}

#header #forms form input.submit { 
    display: block;
    font-size: 12px;
    width: auto; 
    line-height: 12px;
    height: 20px;
    padding: 2px 5px 3px 5px; 
    color:#fff; 
    background:#000; 
    border: 0;
}

#header #forms form input.submit:focus,
#header #forms form input.submit:hover,
#header #forms form input.submit:active {
    color: #F3A223;
}

#header #forms div.panel {
    color: white;
} 

body #header #forms div.user {
    position: relative;
    background: #666 url('../images/chrome/logged_in.gif') no-repeat 0px -90px;
} 
body.cr_plus #header #forms div.user     { background-position: 0px -180px } 
body.admin   #header #forms div.user     { background-position: 0px -270px }

#header #forms div.panel h3,
#header #forms div.panel h5,
#header #forms div.panel div.controls {
    float: none;
    display: block;
    clear: both;
    margin: 3px 0 0 10px;
    width: 164px;
    color: #ccc;
    overflow: hidden;
}

#header #forms div.panel h3 {
    margin-top: 8px;
    font-size: 14px;
    line-height: 14px;
    height: 14px;
}

#header #forms div.panel h5.email {
    margin-top: 8px;
    font-size: 11px;
    line-height: 12px;
    height: 12px;
    font-weight: normal;
}

#header #forms div.panel div.controls {
    /* shift icons a few pixels left of the text - it just looks better */
    margin-left: 6px;
    padding-top: 4px;
    width: 220px;
}

#header #forms div.panel div.controls a {
    display: block;
    float: left;
    width: 72px; height: 20px;
    padding-left: 22px;
    margin-right: 16px;
    font-size: 11px;
    line-height: 20px;
    background: url('/images/chrome/home_icon.gif') no-repeat 0 0;
    color: #ccc;
}

#header #forms div.panel div.controls a.logout {
    background-image: url('/images/chrome/logout_icon.gif');
    width: 54px;
}

#header #forms div.panel div.controls a.admin {
    background-image: url('/images/chrome/admin_icon.gif');
    width: 42px;
    margin-right: 0;
}

body.user_home #header #forms div.panel div.controls a.home,
#header #forms div.panel div.controls a:hover {
    color: #F3A223;
    background-position: 0 -30px;
}

#header #forms div.user a.expanding {
    position: absolute;
    display: block;
    top: 30px; right: 46px;
    width: 24px; height: 20px;
    background-repeat: no-repeat;
    background-position: right top;
}

#header #forms div.user a.expanding span {
    display: none;
}

#header #forms div.user a.expanding:hover span {
    display: block;
    margin: 0 30px 0 10px;
    font-size: 11px;
    line-height: 20px;
    color: #F3A223;
    text-align: left;
}

#header #forms div.user a.envelope {
    position: absolute;
    top: 5px;
    background-image: url('../images/chrome/envelope_icon.gif');
}

#header #forms div.user a.admin {
    position: absolute;
    top: 25px;
    background-image: url('../images/chrome/admin_icon.gif');
}

#header #forms div.user a.messages {
    background-position: right -60px;
}

#header #forms div.user a.expanding:hover,
#header #forms div.user a.messages:hover {
    background-position: right -30px;
    width: 120px;
    opacity: 0.9;
}



/*------------------------------------------------------------------------*/
/* header tabs                                                            */
/*------------------------------------------------------------------------*/

#header ul.tabs {
    width: 100%;
    height: 20px;
}

#header ul.tabs li { 
    float: left; 
    margin: 0;
    padding: 0;
    position: relative;
    min-height: 18px;
}

#header ul.tabs li a,
#header ul.tabs li a:link,
#header ul.tabs li a:visited {
    display: block;
    float: left;
    width: 120px;
    height: 20px;
    margin: 4px 5px 4px 0;
    text-align: center;
    font-size: 10px;
    line-height: 20px;
    font-weight: bold;
    text-decoration: none;
    color:#ffffff; 
    background-color: #888888;
}

#header ul.tabs li a:hover,
#header ul.tabs li a:active {
    background: #666666;
/*    background: #F3A223; */
}

#header ul.tabs li.last a {
    margin-right: 0;
/*    width: 119px;  */
}

#header ul.tabs li.home a {
    width: 105px;
}

#header ul.tabs li.submenu a {
    background: #888888 url('../images/arrows/grey_stripe_revealers.gif') no-repeat 5px -35px;
}
#header ul.tabs li.submenu a:hover,
#header ul.tabs li.submenu:hover > a {
    background: #666666 url('../images/arrows/grey_stripe_revealers.gif') no-repeat 5px -95px;
}
#header ul.tabs li.submenu ul.submenu li a {
    background-image: none;
}



#header ul.tabs li.home a,
#header ul.tabs li.home a:link,
#header ul.tabs li.home a:visited {
    background: #541C70
}
#header ul.tabs li.home a:hover,
#header ul.tabs li.home a:active {
    background: #3F1554;
/*    background: #F3A223 */
}
#header ul.tabs li.CR a,
#header ul.tabs li.CR a:link,
#header ul.tabs li.CR a:visited {
    background: #541C70
}
#header ul.tabs li.CR a:hover,
#header ul.tabs li.CR a:active {
    background: #3F1554;
/*    background: #F3A223 */
}
#header ul.tabs li.PR a,
#header ul.tabs li.PR a:link,
#header ul.tabs li.PR a:visited {
    background: #B1D232
}
#header ul.tabs li.PR a:hover,
#header ul.tabs li.PR a:active {
    background: #849D25;
/*    background: #F3A223 */
}
body.PR #header #status {
    background-image: url('../images/chrome/title/property_requirements.gif');
}
#header ul.tabs li.SC a,
#header ul.tabs li.SC a:link,
#header ul.tabs li.SC a:visited {
    background: #A21D2D
}
#header ul.tabs li.SC a:hover,
#header ul.tabs li.SC a:active {
    background: #791521;
/*    background: #F3A223 */
}
body.SC #header #status {
    background-image: url('../images/chrome/title/shopping_centres.gif');
}
#header ul.tabs li.HS a,
#header ul.tabs li.HS a:link,
#header ul.tabs li.HS a:visited {
    background: #F9A51A
}
#header ul.tabs li.HS a:hover,
#header ul.tabs li.HS a:active {
    background: #BA7B13;
/*    background: #F3A223 */
}
body.HS #header #status {
    background-image: url('../images/chrome/title/find_a_property.gif');
}
body.HS #header #clock {
    color: #541C70;
}
#header ul.tabs li.RW a,
#header ul.tabs li.RW a:link,
#header ul.tabs li.RW a:visited {
    background: #0488B4
}
#header ul.tabs li.RW a:hover,
#header ul.tabs li.RW a:active {
    background: #036687;
/*    background: #F3A223 */
}
body.RW #header #status {
    background-image: url('../images/chrome/title/retail_warehousing.gif');
}
body.RW #header #clock {
    color: #541C70;
}


body.FAP #header #status {
    background-image: url('../images/chrome/title/find_a_property.gif');
}

body.FAS #header #status {
    background-image: url('../images/chrome/title/find_a_scheme.gif');
}

body.advertise #header #status {
    background-image: url('../images/chrome/title/advertising.gif');
}

body.services #header #status {
    background-image: url('../images/chrome/title/services.gif');
}

body.networks #header #status {
    background-image: url('../images/chrome/title/networks.gif');
}

body.contact #header #status {
    background-image: url('../images/chrome/title/contacts.gif');
}

#header ul.tabs li a em { 
    font-style:normal;
}

#header ul.tabs li.home a {
    color: white;
}

#header ul.tabs li ul.submenu { 
    position: absolute;
    top: 24px;
    left: -4px;
    width: 120px;
    background-color: white;
    list-style: none;
    padding: 0 4px 4px 4px;
    margin: 0;
    min-height: 18px;
    
}

#header ul.tabs li ul.submenu li { 
    margin: 0;
    padding: 0;
}

#header ul.tabs li ul.submenu li a { 
    margin: 4px 0 0 0;
}


/*------------------------------------------------------------------------*/
/* footer                                                                 */
/*------------------------------------------------------------------------*/

#footer {
    height: 30px;
    position: relative;
    background: url('../images/chrome/footer_background.gif') no-repeat top left;
    clear: both;
    margin-top: 5px;
}

#footer #powered {
    display: block;
    position: absolute;
    right: 10px;
    top: 6px;
    width: 120px;
    height: 20px;
    background: url('../images/chrome/powered_by_squeeze.gif') no-repeat center center;
}

#footer #carbon_neutral {
    display: block;
    position: absolute;
    right: 10px;
    top: 6px;
    width: 135px;
    height: 16px;
    /*background: url('../images/chrome/carbon_neutral.gif') no-repeat center center; */
}

#footer ul.links li {
    margin: 7px 0 0 0;
    padding: 0 8px;
    border-right: 1px solid #fff;
}

#footer ul.links li.last {
    border-right: none;
}

#footer ul.links li a,
#footer ul.links li a:link,
#footer ul.links a:visited { 
    font-size: 10px; 
    color: #FFFFFF; 
    text-decoration: none;
}

#footer ul.links li a:active,
#footer ul.links li a:hover {
    color: #F3A223; 
}

/*------------------------------------------------------------------------*/
/* css/layout.css - defines page layout styles                            */
/*------------------------------------------------------------------------*/

#body {
    margin: 5px 0;
    font-size: 14px;
}

#body.sidebar_left {
    padding-left: 180px;
    clear: both;
}

#body.sidebar_left #sidebar {
    width: 150px;
    float: left;
    margin-left: -180px;
}

#body.sidebar_left #main {
    float: left;
    width: 800px;
}

#body.sidebar_right {
}

#body.sidebar_right #main {
    float: left;
    width: 650px;
}

#body.sidebar_right #sidebar {
    width: 300px;
    float: left;
    margin-left: 10px;
}

#body.sidebar_right #sidebar div.feature { 
    width: 310px;
}

#body.sidebar_right #main div.feature {
    width: 290px;
}

#body.portfolio {
}

#body.portfolio #sidebar {
    clear:both; 
    float:left; 
    display:block; 
    width: 200px; 
}

#body.portfolio #main {
    clear: none; 
    float: right; 
    display: block; 
    width: 758px; 
}

div.column {
    float: left;
}

div.gap {
    margin-left: 10px;
}

div.vgap {
    margin-top: 20px;
}

div.grey {
    background-color: #E1E1E1;
}

div.edge {
    border: 1px solid #C3C3C3;
}

#body.sidebar_right div.half     { width: 320px }
#body.sidebar_left  div.half     { width: 395px }
#body.sidebar_left  div.inleft   { width: 610px }
#body.sidebar_left  div.inright  { width: 180px }

#body.sidebar_left div.half table.data {
    width: 371px;
    margin: 10px auto;
}

#sidebar, 
#col_1 { 
    width:150px; 
    clear:both; 
    float:left; 
    display:block;
    background:url('../images/backgrounds/vertical_gradient.gif') repeat-x;
    margin: 0;
}

#col_2 { 
    clear: none; 
    float: left; 
    width: 513px; 
    min-height: 280px; 
    background: url('../images/backgrounds/vertical_gradient.gif') repeat-x 0 0;
    margin: 0; 
    padding: 0; 
}

#col_1_2 { 
    width:660px; 
    clear:both; 
    float:left; 
    display:block;
    background:url('../images/backgrounds/vertical_gradient.gif') repeat-x;
    margin: 0;
}

#col_2b { 
    clear:none; float:right; 
    width: 822px; 
    background:url('../images/backgrounds/vertical_gradient.gif') repeat-x; 
    margin: 0 0 10px 0; 
}

#col_3 { 
    clear: none;
    float: right; 
    display: block;
    width: 310px;
    padding: 0;
    margin: 0;
}

#col_2 #content {
    clear:none; float:none; display:block; 
    width:450px; 
    margin:15px 0 0 40px;
    padding:24px 0 10px 0;
}

#content_2 {
    clear:both; float:left; display:block; 
    width: 320px; margin: 15px 0 0 40px; padding: 24px 0 10px 0;
}
#content_3,
#content_4 {
    clear:both; float:left; display:block; 
    width: 430px; margin: 15px 0 0 40px;
    padding: 24px 0 10px 0;
}

/*------------------------------------------------------------------------*/
/* css/menus.css - menu styles                                            */
/*------------------------------------------------------------------------*/

#sidebar h2.menu_title {
    color: #EF9528;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal;
    margin: 0px 0px 5px 5px;
    text-transform: uppercase; 
}

#sidebar ul.menu {
    margin: 0 0 30px 0;
    padding: 0;
}

#sidebar ul.menu li {
    display: block;
    list-style: none;
    margin: 0 0 5px 0;
    padding: 0;
}

#sidebar ul.menu li.last {
    margin-bottom: 0;
}

#sidebar ul.menu li.hide {   /* TODO */
    opacity: 0.5;
}

#sidebar ul.menu li span.locked,
#sidebar ul.menu li a,
#sidebar ul.menu li a:link,
#sidebar ul.menu li a:visited {
    display: block;
    padding: 3px 0;
    text-transform: uppercase; 
    color: #FFFFFF;
    font-size: 10px;
    font-weight: bold;
    background: #888888 url('../images/arrows/white_down_right.gif') no-repeat 135px 6px;
}

#sidebar ul.menu li a span {
    display: block;
    margin: 0 30px 0 4px;
    font-size: 10px;
    cursor: pointer;
}

#sidebar ul.menu li span.locked {
    padding-left: 4px;
}

#sidebar ul.menu li a:hover {
    color: #FFFFFF;
    background-color: #666666;
    background-position: 135px 6px;
}

#sidebar ul.menu li.warm a {
    color: #FFFFFF;
    background-color: #541C70;
    background-position: 135px 6px;
}

#sidebar ul.menu li.search a {
    background: #F3A223 url('../images/arrows/white_up_right.gif') no-repeat 6px 6px; 
}
#sidebar ul.menu li.search a:hover {
    background-color: #B6791A;
}

#sidebar ul.menu li.search a span {
    margin: 0 4px 0 20px;
}

#sidebar ul.menu li span.locked {
    background: #ccc url('../images/user/crplus_lock.gif') no-repeat right 1px;
}

/* sub-menus */

#sidebar ul.menu li.presub {
    margin-bottom: 1px;
}

#sidebar ul.menu li.submenu {
    margin-top: 0;
    background-color: #F0ECF3; 
}

#sidebar ul.menu li.submenu ul {
    margin: 0; padding: 0;
    background-color: #F0ECF3;
    border-top: 0;
}

#sidebar ul.menu li.submenu ul li {
    margin: 0;
    border-bottom: 1px solid #E2D9E7;
}


#sidebar ul.menu li.submenu ul li a,
#sidebar ul.menu li.submenu ul li a:link,
#sidebar ul.menu li.submenu ul li a:visited {
    margin-bottom: 0px;
    background-image: none;
    background-color: #F0ECF3;
    color: #7E5493;
    padding: 2px 0 2px 5px;
    text-transform: none;
    font-weight: normal;
}

#sidebar ul.menu li.submenu ul li a span {
    font-size: 11px;
}

#sidebar ul.menu li.submenu ul li.warm a {
    background-color: #7E5493;
    color: white;
}

#sidebar ul.menu li.submenu ul li a:hover {
    background-color: #A98DB7;
    color: white;
}

#sidebar ul.menu li.submenu ul.l2 li a {
    padding-left: 15px;
}

#sidebar ul.menu li.submenu ul.l3 li a {
    padding-left: 25px;
}

#sidebar ul.menu li.submenu ul.l2 li.warm a {
    background-color: #D4C6DB;
    color: #7E5493;
}

#sidebar ul.menu li.submenu ul.l2 li.warm a:hover {
    background-color: #A98DB7;
    color: white;
}

#sidebar ul.menu li.submenu ul.l2 li.last {
    border-bottom: none;
}




#header ul.tabs li a em { 
    font-style:normal;
}

/*------------------------------------------------------------------------*/
/* NOTE: this is the start of the css/styles.css template.  This is where */
/* I'm putting generic styles that I've extracted and/or adapted from     */ 
/* Steve's CSS that I think should be in the master stylesheet. -- abw    */
/*------------------------------------------------------------------------*/


body.CR #title h2,
body.CR #titles h2,
body.CR #title h3,
body.CR #title h4,
body.CR div.agents ul.contact_nos li a:hover,
body.CR div.agents ul.contact_nos li a:active,
body.CR ul.regions li a:hover,
body.CR ul.regions li a:active,
body.CR div.feature ul.ol,
body.CR div.feature ul.ol li a:hover,
body.CR #map div.popup h4.name,
body.CR a.col,            /* I think these .col ones are incorrect... */
body.CR a.col:link,
body.CR a.col:visited,
body.CR a.cat,            /* ...they should be .cat (but .col may be in use) */
body.CR a.cat:link,
body.CR a.cat:visited,
body.CR .catcol,
body.CR hr,
span.CR {
    color: #541C70; 
}

body.CR ul.nav_property li a:hover,
body.CR ul.nav_property li a:active,
body.CR table.tenancy caption,
body.CR div.results div.overview,
body.CR div.feature h4,
body.CR hr,
body.CR .bar,
body.CR #sidebar ul.menu li.warm a {
    background-color: #541C70; 
}

body.CR input.input:active,
body.CR input.input:focus,
body.CR select:active,
body.CR select:focus,
body.CR textarea:active,
body.CR textarea:focus {
    border: 1px solid #7E5493;
}
body.CR a.cat {
    color: #541C70;
}
body.CR a.cat:hover,
body.CR a.cat:active {
    color: #F3A223;
}
body.CR .overline {
    border-top: 1px solid #541C70;
}

body.HS #title h2,
body.HS #titles h2,
body.HS #title h3,
body.HS #title h4,
body.HS div.agents ul.contact_nos li a:hover,
body.HS div.agents ul.contact_nos li a:active,
body.HS ul.regions li a:hover,
body.HS ul.regions li a:active,
body.HS div.feature ul.ol,
body.HS div.feature ul.ol li a:hover,
body.HS #map div.popup h4.name,
body.HS a.col,            /* I think these .col ones are incorrect... */
body.HS a.col:link,
body.HS a.col:visited,
body.HS a.cat,            /* ...they should be .cat (but .col may be in use) */
body.HS a.cat:link,
body.HS a.cat:visited,
body.HS .catcol,
body.HS hr,
span.HS {
    color: #F9A51A; 
}

body.HS ul.nav_property li a:hover,
body.HS ul.nav_property li a:active,
body.HS table.tenancy caption,
body.HS div.results div.overview,
body.HS div.feature h4,
body.HS hr,
body.HS .bar,
body.HS #sidebar ul.menu li.warm a {
    background-color: #F9A51A; 
}

body.HS input.input:active,
body.HS input.input:focus,
body.HS select:active,
body.HS select:focus,
body.HS textarea:active,
body.HS textarea:focus {
    border: 1px solid #FABB53;
}
body.HS a.cat {
    color: #F9A51A;
}
body.HS a.cat:hover,
body.HS a.cat:active {
    color: #F3A223;
}
body.HS .overline {
    border-top: 1px solid #F9A51A;
}

body.RW #title h2,
body.RW #titles h2,
body.RW #title h3,
body.RW #title h4,
body.RW div.agents ul.contact_nos li a:hover,
body.RW div.agents ul.contact_nos li a:active,
body.RW ul.regions li a:hover,
body.RW ul.regions li a:active,
body.RW div.feature ul.ol,
body.RW div.feature ul.ol li a:hover,
body.RW #map div.popup h4.name,
body.RW a.col,            /* I think these .col ones are incorrect... */
body.RW a.col:link,
body.RW a.col:visited,
body.RW a.cat,            /* ...they should be .cat (but .col may be in use) */
body.RW a.cat:link,
body.RW a.cat:visited,
body.RW .catcol,
body.RW hr,
span.RW {
    color: #0488B4; 
}

body.RW ul.nav_property li a:hover,
body.RW ul.nav_property li a:active,
body.RW table.tenancy caption,
body.RW div.results div.overview,
body.RW div.feature h4,
body.RW hr,
body.RW .bar,
body.RW #sidebar ul.menu li.warm a {
    background-color: #0488B4; 
}

body.RW input.input:active,
body.RW input.input:focus,
body.RW select:active,
body.RW select:focus,
body.RW textarea:active,
body.RW textarea:focus {
    border: 1px solid #42A5C6;
}
body.RW a.cat {
    color: #0488B4;
}
body.RW a.cat:hover,
body.RW a.cat:active {
    color: #F3A223;
}
body.RW .overline {
    border-top: 1px solid #0488B4;
}

body.SC #title h2,
body.SC #titles h2,
body.SC #title h3,
body.SC #title h4,
body.SC div.agents ul.contact_nos li a:hover,
body.SC div.agents ul.contact_nos li a:active,
body.SC ul.regions li a:hover,
body.SC ul.regions li a:active,
body.SC div.feature ul.ol,
body.SC div.feature ul.ol li a:hover,
body.SC #map div.popup h4.name,
body.SC a.col,            /* I think these .col ones are incorrect... */
body.SC a.col:link,
body.SC a.col:visited,
body.SC a.cat,            /* ...they should be .cat (but .col may be in use) */
body.SC a.cat:link,
body.SC a.cat:visited,
body.SC .catcol,
body.SC hr,
span.SC {
    color: #A21D2D; 
}

body.SC ul.nav_property li a:hover,
body.SC ul.nav_property li a:active,
body.SC table.tenancy caption,
body.SC div.results div.overview,
body.SC div.feature h4,
body.SC hr,
body.SC .bar,
body.SC #sidebar ul.menu li.warm a {
    background-color: #A21D2D; 
}

body.SC input.input:active,
body.SC input.input:focus,
body.SC select:active,
body.SC select:focus,
body.SC textarea:active,
body.SC textarea:focus {
    border: 1px solid #B95561;
}
body.SC a.cat {
    color: #A21D2D;
}
body.SC a.cat:hover,
body.SC a.cat:active {
    color: #F3A223;
}
body.SC .overline {
    border-top: 1px solid #A21D2D;
}


.cat_icon {
    display: block; float: left;
    width: 28px; height: 28px;
    margin: 0 5px; padding: 0;
    background-position: bottom left;
    background-repeat: no-repeat;
}
.RW_icon { background-image: url('/images/icons/property/RW_square.png') }
.SC_icon { background-image: url('/images/icons/property/SC_square.png') }
.HS_icon { background-image: url('/images/icons/property/HS_square.png') }


/* special-case hack to account for the mismatch between HS and Find a Shop,
 * both of which are yellow... or not... er, I'm not even sure myself...
 */
span.FS {
    color: #F9A51A; 
}
span.FAP {
    color: #F9A51A; 
}
span.FAS {
    color: #F9A51A; 
}

.bar {
    padding:2px 0 2px 6px; margin: 0; 
    color: white;
    float: none; clear: both;
}
h3.bar   { font-size: 12px; line-height: 16px }
h4.bar   { font-size: 12px; margin: 0 }
.bg4d    { background-color: #4d4d4d }
.bg7d    { background-color: #7d7d7d }


h1.purple       { color:#460d60; font-size:27px; margin: 0 0 5px 0; }
h1.purple img   { margin: 0 0 2px 5px;clear: none; float:none;}
h1.purple span  { color:#f9a51a; }
h1.red          { color:#cc3834; font-size:27px; margin: 0 0 4px 1px; }
h2.purple       { font-size:18px; line-height: 22px; margin: 15px 0 4px 0;color:#460d60; font-weight:normal; clear: both;}
h3.purple       { font-size:15px; margin: 4px 0 4px 0;   color:#460d60; font-weight:normal; }
div.boxtext h2  { font-size:18px; margin: 4px 0 2px 8px; color:#ffffff; font-weight:normal;}
p.info a        { color: #7E5493 }
p.info a:hover  { color: #F3A223 }

/* icon list */
ul.iconList { 
    clear:both; float:none; list-style: none;
    width:450px; 
    margin: 10px 0 0 0; 
}

ul.iconList li { 
    clear: both; float: none; 
    display: block;
    position: relative;
    padding-left: 85px;
    font-size: 10px;
    margin: 20px 0 25px 0;
}
ul.iconList a.icon { 
    position: absolute;
    top: 0;
    left: 0;
    width: 75px;
    height: 75px;
}
ul.iconList img.bigCRIcon.schemes { margin-left:-7px;margin-right:10px; }

ul.iconList h4 { 
    float: none;
    font-size: 16px;
    margin: 4px 0;
    padding: 0;
    color: #460d60; 
}

ul.iconList p { 
    font-size: 14px; 
    line-height: 150%;
    margin: 5px 30px 1px 0;
/*    width: 260px; */
    color: #888;
}



/* dotted list */
ul.dottedList { 
    clear:both; float:none; 
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
}

ul.dottedList li {
    clear:both; float:none; 
    display: block;
    font-size: 10px;
    padding: 5px 0; 
    margin: 0;
    border-bottom: 1px dotted #4d4d4d; 
}
ul.dottedList li.l { 
    border: 0; 
}
ul.dottedList li span,
ul.dottedList li a, 
ul.dottedList li a:link,
ul.dottedList li a:visited { 
    clear:none; float:none; display:block; font-size:14px; 
    color:#4d4d4d; margin:0;
}
ul.dottedList li span.disabled,
ul.dottedList li a.disabled,
ul.dottedList li a.disabled:link,
ul.dottedList li a.disabled:visited { 
    color:#ccc; 
}

ul.dottedList li a.arrow {
    display: block;
    padding-left: 23px;
    background: url('/images/arrows/main_arrow_7d7d7d.gif') no-repeat 10px 4px;
}




div.grey p {
    color: #888;
}

ul.arrowMenu {
    padding: 0; margin: 0;
}

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

div#col_1 ul.arrowMenu li a,
ul.arrowMenu li a {
    display: block; cursor: pointer;
    margin: 10px 0 0 4px;
    margin: 0;
    padding: 0 4px;
    width: 108px;
    font-size: 10px;
    background: #4d4d4d url('../images/arrows/main_arrow_basic.gif') no-repeat 132px 7px;
}    

ul.arrowMenu li a,
ul.arrowMenu li a.sel,
ul.arrowMenu li a.sel:link,
ul.arrowMenu li a.sel:visited,
ul.arrowMenu li a:hover,
ul.arrowMenu li a:active { background:#97999C; }

ul.arrowBullets { 
    clear:both; float:none; list-style-image: url('/images/arrows/bullet_triangle.gif');
    margin: 5px 0 10px 0; 
    padding: 0;
}
ul.arrowBullets li { 
    float:none; margin: 0 0 4px 0px; 
    padding: 0;
    font-size:14px; width:auto;line-height:20px; 
}
ul.arrowBullets li a { 
    color: #7E5493;
}
ul.arrowBullets li a:hover { 
    color: #F3A223;
}
div#content ul.arrowBullets { margin-left:20px;}
div#content ul.arrowBullets li { font-size:14px;}
div#content ul.arrowBullets ul { list-style:none; margin-left:20px;}
div#content ul.arrowBullets ul li { font-size:10px;}

ul.preLaunchOffers { 
    clear:both; float:none; list-style: none;
    padding: 0; margin: 25px 0 0 0;
}
ul.preLaunchOffers li { 
    clear:none; float:left; display: block;
    font-size:10px; width:98px; height: 33px; margin: 0 20px 0 0;
}
ul.preLaunchOffers li img { 
    width:98px; height:33px; margin:0; 
}
div#content ul.preLaunchOffers li { 
    font-size: 10px;  
}


div#content_2 ul { margin: 0 0 12px 0; list-style-type:disc; width:300px }
div#content_2 li { float:none; font-size:14px;  margin:0 0 10px 20px; }

#pr_holder {
    clear:none; float:right; 
    margin: 38px 30px 0 0;
    width: 417px;
    height: 430px;
    padding: 0;
}
#experian_holder {
    clear:none; float:right;
    margin: 0; padding: 35px 0 0 0; 
    background-image: url('/images/backgrounds/box_grad_1.gif'); 
    background-repeat:repeat-y; 
    width: 314px;
    display:block;
}
#experian_holder p {
    clear:both; float:left;
    width:300px;font-size:14px; color:#ffffff; 
    margin: 2px 0 0 9px; line-height:19px;
}
#experian_holder p#earn_more {
    clear:both; float:left;font-size:14px; color:#ffffff; 
    margin: 12px 0 0 9px;line-height:19px;
}
#experian_holder p img {
    margin: 0 0 0 0;
}
#experian_holder a img {
    margin: 10px 0 0 13px;
}
#experian_holder a img#lrg_img {
    margin: 260px 0 0 13px;
}
#experian_holder img {
    clear:both; float:left; 
    margin: 6px 0 12px 11px;
}
#experian_holder img#earn_credits {
    clear:both; float:left; margin: 6px 0 12px 0;
}
#experian_holder img#exp_title {
    clear:both; float:left; 
    margin: 0 0 0 0;
}
#experian_holder h2 { 
    font-size:18px;
    margin: 5px 0 4px 6px; color:#ffffff;font-weight:normal;width:300px;
}
#experian_holder h2 img {
    margin: 0 0 -1px 2px; clear:none;float:none;
}

div.grey { clear:both; float:none;  overflow: auto; padding:10px 0 10px 15px; background:#D7D7D7; }
div.grey p { font-size:14px; padding-right: 15px; } 
div.grey span.left { clear:both; float:left; width:20px;}
div.grey span.right { clear:none; float:left; }
div.grey a {
    color: #97999C;
}
div.grey a:hover {
    color: #EF9528;
}

div#col_3.bordered { border:1px solid #4d4d4d;border-top:0; }
div#col_3 div.flash { clear:both; float:none; margin-bottom:0; }
div#col_3 div.flash.padded { width:292px;padding:9px;font-size:10px; }

/*
div.resources div.resource {
    background-color: #eee;
    margin-bottom: 2px;
}

div.resources div.even {
    background-color: #ddd;
}

div.resources img.slide {
    margin: 5px 0 0 5px;
}

div.resource div.hint {
    margin-left: 10px;
}

div.resources a.icon {
    margin: 20px 0 5px 40px;
}

*/


a.pdf22,
a.pdf32 {
    display: block; float: left;
    color: #888;
}

a.pdf22:hover,
a.pdf32:hover {
    color: #F3A223;
}
    
a.pdf22 {
    padding-left: 26px; min-height: 22px;
    background: url(/images/icons/pdf22.png) no-repeat top left;
}

a.pdf32 {
    padding-left: 36px; min-height: 32px;
    background: url(/images/icons/pdf32.png) no-repeat top left;
}

ul.brochures {
    padding: 0;
    margin: 5px 0;
}

ul.brochures li {
    list-style: none;
    float: none; clear: left;
    padding: 4px 0;
    margin: 2px 5px;
}

ul.brochures li a {
    padding-top: 4px;
    font-size: 12px;
}

div.goad_thumbnail {
    width: 64px;
    height: 80px;
    padding: 2px;
    border: 1px solid #ccc;
    margin: 5px;
    margin-left: 0;
    float: left;
}

div.goad_thumbnail div.caption {
    line-height: 16px;
    font-size: 12px;
    text-align: center;
    color: #888;
}








/*------------------------------------------------------------------------*/
/* NOTE: this is the end of the css/styles.css template. Most of what     */
/* follows in this stylesheet is stuff that I've put in to get the webapp */ 
/* side of things working.  Most of it should get replaced in due course  */
/* as I replace it with stuff from Steve's CSS.  So things below this     */
/* point should eventually migrate above this point, or get deleted.      */ 
/*------------------------------------------------------------------------*/

/*------------------------------------------------------------------------*/
/* css/buttons - button styling for links and form submit buttons         */
/*------------------------------------------------------------------------*/

a.button, input.button, span.button {
    display: block; float: left;
    width: 50px;  /* +25 padding */
    margin-top: 5px;
    margin-right: 5px;
    margin-bottom: 5px;
    padding: 2px 20px 2px 5px;
    font-size: 10px; line-height: 16px;
    text-transform:uppercase; text-align:left; text-decoration: none;
    color: white;
    border: 1px solid #541C70;
    background: #701B82 url('../images/arrows/diag_down.gif') no-repeat right -11px;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
}
a.flr, input.flr, span.flr {
    float: right;
}

a.push-up {
    margin-top: 0;
}

a.button:visited,
a.button:link {
    color: white;
}

a.button:hover,  input.button:hover,
a.button:active, input.button:active,
a.button:focus,  input.button:focus,
input.button:focus::-moz-focus-inner {
    background-color: #F3A223;
    border: 1px solid #F3A223;
    color: white;
    outline: none;
    cursor: pointer;
}

a.button:active, input.button:active {
    border: 1px solid #B6791A;
}

a.button, span.button {
    /* firefox doesn't seem to be applying the same line height to a.button
     * as it is to input.button... haven't looked at any other browser
     */
    line-height: 15px;
}

a.view_details, a.view_details:visited, a.view_details:link {
    color: white;
    background-color: #4d4d4d;
    border: 1px solid #4d4d4d;
    width: 30px;
    margin-right: 0;
}

a.view_details:hover {
    color: white;
    background-color: #F3A223;
    border: 1px solid #F3A223;
}

a.cancel, input.cancel {
    background: #aaa url('../images/arrows/diag_up.gif') no-repeat 0px -12px;
    padding: 2px 5px 2px 20px;
    border: 1px solid #aaa;
}

a.cancel:hover,  input.cancel:hover,
a.cancel:active, input.cancel:active,
a.cancel:focus,  input.cancel:focus {
    background-color: #F3A223;
    text-decoration: none;
}

a.add, input.add {
    background-color: #4F8A10;
    background-image: url('../images/arrows/plus.gif');
    border: 1px solid #3B670C;
    text-decoration: none;
}

a.add:hover,  input.add:hover,
a.add:active, input.add:active,
a.add:focus,  input.add:focus {
    background-color: #F3A223;
    border: 1px solid #F3A223;
}
a.add:focus::-moz-focus-inner, input.add:focus::-moz-focus-inner {
    border: 1px solid #F3A223;
}

a.delete, input.delete {
    background-color: #791521;
    background-image: url('../images/arrows/cross.gif');
    border: 1px solid #791521;
    text-decoration: none;
}

a.delete:hover,  input.delete:hover,
a.delete:active, input.delete:active,
a.delete:focus,  input.delete:focus {
    background-color: #A21D2D;
    color: white;
    border: 1px solid #A21D2D;
}
a.delete:focus, input.delete:focus {
    border: 1px solid #791521;
}
a.delete:focus::-moz-focus-inner, input.delete:focus::-moz-focus-inner {
    border: 1px solid #A21D2D;
}

a.return {
    background-color: #FF9D00;
}

a.reveal,a.reveal:active,a.reveal:focus {
    background: #aaa url('../images/arrows/aaa_revealers.gif') no-repeat 5px -35px;
    padding: 2px 5px 2px 20px;
    text-decoration: none;
    border: 1px solid #aaa;
}

a.reveal:hover {
    background-color: #aaa;
    background-position: 5px -55px;
    color: black;
    cursor: pointer;
    border: 1px solid #aaa;
}

a.revealed,a.revealed:active,a.revealed:focus {
    background: #aaa url('../images/arrows/aaa_revealers.gif') no-repeat 5px -95px;
    color: black;
    border: 1px solid #aaa;

    border-radius: 2px 2px 0 0; 
    -moz-border-radius: 2px 2px 0 0; 
    -webkit-border-radius: 2px 2px 0 0;
    -khtml-border-radius: 2px 2px 0 0;
}

a.grey,   input.grey, span.grey { background-color: #aaa; border-color: #aaa }
a.dark,   input.dark, span.dark { background-color: #666; border-color: #666 }
a.wide,   input.wide     { width:  90px }
a.wider,  input.wider    { width: 130px }
a.back,   input.back     { background-image: url('../images/arrows/diag_up.gif') }
a.plus,   input.plus     { background-image: url('../images/arrows/plus.gif')    }
a.add,    input.add      { background-image: url('../images/arrows/plus.gif')    }
a.cross,  input.cross    { background-image: url('../images/arrows/cross.gif')   }
a.right,  input.right    { background-image: url('../images/arrows/right.gif')   }
a.last                   { margin-right: 0 }
a.pad-1                  { padding-top: 1px; padding-bottom: 1px }
a.pad-0                  { padding-top: 0px; padding-bottom: 0px }

a.span-1 { width: 83px; }
a.skip-1 { margin-left: 115px; }
a.span-2 { width: 198px; }
a.skip-2 { margin-left: 230px; }
a.span-3 { width: 313px; }
a.skip-3 { margin-left: 345px; }
a.span-4 { width: 428px; }
a.skip-4 { margin-left: 460px; }
a.span-5 { width: 543px; }
a.skip-5 { margin-left: 575px; }
a.span-6 { width: 658px; }
a.skip-6 { margin-left: 690px; }
a.span-7 { width: 773px; }
a.skip-7 { margin-left: 805px; }

a.skip-half {
    margin-left: 55px;
}

a.compact, input.compact {
    width: 35px;  /* +25 padding */
    padding: 1px 20px 1px 5px;
    font-size: 10px;
    background-position: right -12px;
}

body.CR input.category, 
body.CR a.category {
    background-color: #541C70;
    border: 1px solid #541C70;
}
body.CR input.category:hover, 
body.CR input.category:focus, 
body.CR input.category:active, 
body.CR a.category:hover,
body.CR a.category:focus,
body.CR a.category:active {
    background-color: ;
    border: 1px solid ;
}
body.HS input.category, 
body.HS a.category {
    background-color: #F9A51A;
    border: 1px solid #F9A51A;
}
body.HS input.category:hover, 
body.HS input.category:focus, 
body.HS input.category:active, 
body.HS a.category:hover,
body.HS a.category:focus,
body.HS a.category:active {
    background-color: ;
    border: 1px solid ;
}
body.RW input.category, 
body.RW a.category {
    background-color: #0488B4;
    border: 1px solid #0488B4;
}
body.RW input.category:hover, 
body.RW input.category:focus, 
body.RW input.category:active, 
body.RW a.category:hover,
body.RW a.category:focus,
body.RW a.category:active {
    background-color: ;
    border: 1px solid ;
}
body.SC input.category, 
body.SC a.category {
    background-color: #A21D2D;
    border: 1px solid #A21D2D;
}
body.SC input.category:hover, 
body.SC input.category:focus, 
body.SC input.category:active, 
body.SC a.category:hover,
body.SC a.category:focus,
body.SC a.category:active {
    background-color: ;
    border: 1px solid ;
}

a.icon-left,
span.icon-left {
    display:block; float:left;
    padding-left: 20px; min-height:16px;
    background-position: top left;
    background-repeat: no-repeat;
}

a.tick, span.tick   { background-image: url('/images/icons/silk/tick.png') }
a.cross,span.cross  { background-image: url('/images/icons/silk/cross.png') }
a.lock,span.lock    { background-image: url('/images/icons/silk/lock.png') }


/*------------------------------------------------------------------------*/
/* mini action buttons                                                    */
/*------------------------------------------------------------------------*/

div.actions {
    text-align:         right;
    overflow:           visible;
    width:              110px;
    padding:            0;
}

div.actions a {
    display:            block;
    float:              right;
    clear:              right;
    text-align:         center;
    margin-bottom:      4px;
    width:              18px;
    height:             14px;
    font-size:          10px;
    line-height:        13px;
    border:             1px solid #bbb;
    color:              #888;
    background:         #ddd url('/images/panels/control_icons.gif') 
                        no-repeat right -2px;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
}

div.actions a:hover {
    width:              100px;
    padding-right:      8px;
}

/* info action button */
div.actions a.info {
    background-position: right -2px;
    background-color:   #BDE5F8;
    border-color:       #00529B;
    color:              #00529B;
}
div.actions a.info:hover {
    background-position: right -22px;
    background-color:   #00529B;
    border-color:       #00529B;
    color:              #BDE5F8;
}
/* select action button */
div.actions a.select {
    background-position: right -43px;
    background-color:   #DFF2BF;
    border-color:       #4F8A10;
    color:              #4F8A10;
}
div.actions a.select:hover {
    background-position: right -63px;
    background-color:   #4F8A10;
    border-color:       #4F8A10;
    color:              #DFF2BF;
}
/* unselect action button */
div.actions a.unselect {
    background-position: right -83px;
    background-color:   #FFBABA;
    border-color:       #D8000C;
    color:              #D8000C;
}
div.actions a.unselect:hover {
    background-position: right -103px;
    background-color:   #D8000C;
    border-color:       #D8000C;
    color:              #FFBABA;
}


div.actions a span.hint {
    display:            none;
    padding:            0 4px;
}

div.actions a:hover span.hint {
    display:            inline;
}




/*------------------------------------------------------------------------*/
/* tool tips                                                              */
/*------------------------------------------------------------------------*/

a.tip {
    position:           relative;
    overflow:           visible;
}

span.tip {
    display:            none;
    position:           absolute;
    overflow:           visible;
    padding:            3px 6px;
    width:              120px;
    top:                -27px;
    left:               0;
    font-size:          10px; 
    line-height:        14px;
    text-align:         center; 
    text-decoration:    none;
    text-transform:     none;
    z-index:            211;

    border-radius: 3px; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;


    opacity: 0.9;
    filter: alpha (opacity = 90);

}

a:hover span.tip {
    display:            block;
    background-color:   #FFA;
    border:             1px solid #ba6d10;
    color:              #ba6d10;
}

a:hover span.tip span.arrow {
    display:            block; 
    position:           absolute;
    top:                20px; 
    left:               20px;
    width:              10px; 
    height:             5px;
    background:         url('../images/arrows/tooltip_down_yellow.gif') 
                        no-repeat top left;
}

form span.tip {
    text-align: left;
}

/*------------------------------------------------------------------------
 * grid.css
 * Written by Andy Wardley based on blueprint grid.css
 * See http://code.google.com/p/blueprintcss/
 * - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 * Grid Specification:
 *   Number of cells:      7
 *   Width of each cell:   110px
 *   Margin between cells: 5px
 *------------------------------------------------------------------------*/

.span, .span-1, .span-2, .span-3, .span-4, .span-5, .span-6, .span-7, .span-n
            { float: left; margin-right: 5px }

.pull, .pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-n
            { float: left; position: relative }

.push, .push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-n
            { float: right; position: relative }

.span-1     { width: 110px }
.span-2     { width: 225px }
.span-3     { width: 340px }
.span-4     { width: 455px }
.span-5     { width: 570px }
.span-6     { width: 685px }
.span-7     { width: 800px }
.span-7,
.last       { margin-right: 0 }

.skip-1     { margin-left: 115px }
.skip-2     { margin-left: 230px }
.skip-3     { margin-left: 345px }
.skip-4     { margin-left: 460px }
.skip-5     { margin-left: 575px }
.skip-6     { margin-left: 690px }

.pull-1     { margin-left: -115px }
.pull-2     { margin-left: -230px }
.pull-3     { margin-left: -345px }
.pull-4     { margin-left: -460px }
.pull-5     { margin-left: -575px }
.pull-6     { margin-left: -690px }

.push-1     { margin-left: -115px; margin-right: 115px }
.push-2     { margin-left: -230px; margin-right: 230px }
.push-3     { margin-left: -345px; margin-right: 345px }
.push-4     { margin-left: -460px; margin-right: 460px }
.push-5     { margin-left: -575px; margin-right: 575px }
.push-6     { margin-left: -690px; margin-right: 690px }


/* extra grid tweaks */

.span-half { 
    float: left; 
    margin-right: 5px;
}

.span-half { 
    width: 55px; 
    font-size: 10px; 
}

.skip-half { 
    margin-left: 55px;
}

.last {
    margin-right: 0;
}
/*------------------------------------------------------------------------
 * css/forms.css
 *------------------------------------------------------------------------*/

form.grid {
    margin:             5px 0;
    padding:            5px 0;
}

form.grid div.field {
    float:              left; 
    position:           relative; 
    overflow:           visible;
    /* we do these separately so that other rules can specify margin-left */
    margin-top:         5px;
    margin-right:       5px;
    margin-bottom:      5px;
    padding:            0;
}

form.grid div.f0  { z-index: 200 }
form.grid div.f1  { z-index: 199 }
form.grid div.f2  { z-index: 198 }
form.grid div.f3  { z-index: 197 }
form.grid div.f4  { z-index: 196 }
form.grid div.f5  { z-index: 195 }
form.grid div.f6  { z-index: 194 }
form.grid div.f7  { z-index: 193 }
form.grid div.f8  { z-index: 192 }
form.grid div.f9  { z-index: 191 }
form.grid div.f10 { z-index: 190 }
form.grid div.f11 { z-index: 189 }
form.grid div.f12 { z-index: 188 }
form.grid div.f13 { z-index: 187 }
form.grid div.f14 { z-index: 186 }
form.grid div.f15 { z-index: 185 }
form.grid div.f16 { z-index: 184 }
form.grid div.f17 { z-index: 183 }
form.grid div.f18 { z-index: 182 }
form.grid div.f19 { z-index: 181 }
form.grid div.f20 { z-index: 180 }


/* prompts and messages */

form.grid div.prompt {
    clear:              left;
    margin-top:         0;
    padding:            20px 0 5px 0;
    font-size:          12px; 
    line-height:        18px;
    color:              #666;
}

.compact div.message,
form.grid div.message,
form.grid div.error {
    margin-top:         15px;
    margin-bottom:      0px;
    padding:            10px 10px 10px 35px;
    font-size:          12px;
}

.compact div.message {
    margin: 0;
}

.compact div.error,
form.grid div.error {
    background-image:   url('/images/icons/silk/exclamation.png');
}

.compact div.warning,
form.grid div.warning {
    background-image:   url('/images/icons/silk/error.png');
}

.compact div.success,
form.grid div.success {
    background-image:   url('/images/icons/silk/tick.png');
}

.compact div.info,
form.grid div.info {
    background-image:   url('/images/icons/silk/flag_blue.png');
}

form.grid div.disabled {

    opacity: 0.3;
    filter: alpha (opacity = 30);
 
}


/* form labels */

form.grid label {
    display:            block;
    float:              left;
    clear:              none;
    text-align:         right;
    font-size:          12px;
    line-height:        20px;
    margin:             0 5px 0 0;
    padding-top:        1px;                /* fix me */
    color:              #666;
}

form.label-left label,
form.grid label.left,
form.grid label.text-left,
form.grid div.label-left label {
    text-align:         left;
}

form.label-center label,
form.grid label.center,
form.grid label.text-center,
form.grid div.label-center label {
    text-align:         left;
}

form.grid label.shift-left {
    margin-left:        -5px;
    margin-right:       5px;
}

form.grid div.field_error label {
    color:              #D8000C;
    font-weight:        bold;
}

form.grid label span.mandatory {
    color:              #9F6000;
    font-size:          16px;
    line-height:        16px;
    position:           relative;
    top:                3px;
    margin:             0 2px;
}

form.no-label label,
form.grid div.no-label label,
form.no-star span.mandatory,
form.grid div.no-star span.mandatory {
    display:            none;
}


/* input fields */

form.grid input.input,
form.grid textarea,
form.grid select, 
form.grid div.value {
    position:           relative;
    float:              left;
    background-color:   #fcfcfc;
    font-family:        Arial,Helvetica,sans-serif;
    padding:            3px 3px 2px 3px;
    font-size:          12px;
    line-height:        16px;
    color:              #666;
    border:             1px solid #888;
    margin:             0 5px 0 0;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
}

form.grid div.value {
    /* tweaks to make static value divs line up with input fields */
    padding:            2px 2px 1px 4px;
    line-height:        16px;
    background-color:   #f8f8f8;
    border:             1px solid #bbb;
    color:              #666;
    overflow:           hidden;
}

form.grid div.value p {
    font-size:          12px;
    line-height:        16px;
    color:              #444;
    margin:             0 5px 0 0;
}

form.grid textarea {
    /* padding tweak */
    padding: 2px 3px;
}

form.grid select {
    padding: 2px 0px 1px 0;
}

form.grid input.radio {
    position: relative;
    top: 5px;
    margin-left: 20px;
}

form.grid input.input:active,
form.grid input.input:focus,
form.grid textarea:active,
form.grid textarea:focus,
form.grid select:active,
form.grid select:focus {
    background-color:   #fff;
    color:              black;
    outline:            none;
    border-color:       #541C70;
}


/* errors */

form.grid div.field_error input.input,
form.grid div.field_error textarea,
form.grid div.field_error select {
    border:             1px solid #A21D2D;
    background-color:   #fee;
}

form.grid div.field_error input.input:active,
form.grid div.field_error input.input:focus,
form.grid div.field_error textarea:active,
form.grid div.field_error textarea:focus,
form.grid div.field_error select:active {
    border:             1px solid #791521;
}


/* submit buttons */

form.grid .buttons {
    clear:              both;
    width:              100%;
    margin:             0; 
    padding:            0;
}

form.grid input.button,
form.grid span.button,
form.grid a.button {
    margin-top:         0;
    margin-bottom:      0;
}



/* help and tooltips */

form.grid div.field a.help {
/* form.grid div.field a.help:link,
form.grid div.field a.help:visited { */
    display:            block;
    position:           absolute;
    top:                2px;
    left:               0px;
    width:              18px;
    height:             18px;
    background:         url('../images/icons/help/question_blue.gif') no-repeat 0 0;
    z-index:            210;  
    overflow:           visible;

}

form.grid div.field a.help:hover,
form.grid div.field a.help:active {
    background-position: 0 -20px;
}

form.grid div.field a.help span.tip {
    position:           relative;
    padding:            5px 6px;
    width:              180px;
    top:                -2px;
    left:               -199px;
    font-size:          12px;
    line-height:        16px;
    z-index:            211;

    opacity: 0.9;
    filter: alpha (opacity = 90);

}

form.grid div.field a.help:hover span.tip,
form.grid div.field a.help:active span.tip {
    display:            block;
}

form.tip-left div.field a.help span.tip,
form div.tip-left a.help span.tip {
    left:               -199px;
}

form.tip-right div.field a.help span.tip,
form div.tip-right a.help span.tip {
    left:               30px;
}

form.grid div.field a.help:hover span.tip span.arrow {
    display:            block; 
    position:           absolute;
    top:                6px; 
    left:               -6px;
    width:              6px; 
    height:             10px;
    background:         url('../images/arrows/form_tooltip_left_edge.gif') 
                        no-repeat top left;
}

form.grid div.field a.help span.tip span.example,
form.grid div.field a.help span.tip span.example {
    display:            block;
    font-size:          11px;
    line-height:        15px;
    font-style:         italic;
    padding-left:       30px;
    color:              #662;
}

form.grid div.field a.help span.tip span.example span.eg, 
form.grid div.field a.help span.tip span.example span.eg {
    display:            inline;
    float:              left;
    margin-left:        -25px;
}


/*------------------------------------------------------------------------
 * grid for form fields
 *------------------------------------------------------------------------*/

/* form fields in full column increments: span-1, span-2, span-3, etc. */

form.field-1 input,
form.field-1 textarea,
form.field-1 div.value,
form.grid div.field-1 input,
form.grid div.field-1 textarea,
form.grid div.field-1 div.value,
form.grid input.span-1,
form.grid textarea.span-1,
form.grid div.field div.span-1 {                  /* NOT SURE - breaks upload meter */
    width: 102px;
}

/* fields in half-column increments: span-1_5, span-2_5, span-3_5, etc */
form.field-1_5 input,
form.field-1_5 textarea,
form.field-1_5 div.value,
form.grid input.span-1_5,
form.grid textarea.span-1_5,
form.grid div.field div.span-1_5 {
    width: 157px;
}

/* buttons */
form.field-1 .buttons a,
form.grid .buttons a.span-1,
form.grid .buttons a.span-1 {
    width: 83px;
}

/* field labels and select fields have different padding */
form.label-1 label,
form.field-1 select, 
form.grid div.label-1 label,
form.grid label.span-1,
form.grid select.span-1, 
form.grid .buttons input.span-1 {
    /* padding doesn't seem to be added for input buttons and selects */
    width: 110px;
}

form.label-1_5 label,
form.field-1_5 select, 
form.grid label.span-1_5,
form.grid select.span-1_5, 
form.grid .buttons input.span-1_5 {
    width: 165px;
}

/* skip columns */
form.grid label.skip-1,
form.grid input.skip-1,
form.grid textarea.skip-1,
form.grid select.skip-1, 
form.grid .buttons a.skip-1,
form.grid .buttons input.skip-1 {  
    margin-left: 115px; 
}

form.grid label.skip-1_5,
form.grid input.skip-1_5,
form.grid textarea.skip-1_5,
form.grid select.skip-1_5, 
form.grid .buttons a.skip-1_5,
form.grid .buttons input.skip-1_5 {
    margin-left: 170px; 
}

/* help icon position */
form.help-1 div.field a.help,
form.help-1 div.field a.help:link,
form.help-1 div.field a.help:visited,
form.grid div.help-1 a.help,
form.grid div.help-1 a.help:link,
form.grid div.help-1 a.help:visited {
    left: 115px;
}
form.help-1_5 div.field a.help,
form.help-1_5 div.field a.help:link,
form.help-1_5 div.field a.help:visited,
form.grid div.help-1_5 a.help,
form.grid div.help-1_5 a.help:link,
form.grid div.help-1_5 a.help:visited {
    left: 170px;
}

/* help tooltip widths */
form.help-w1 div.field a.help span.tip,
form.help-w1 div.field a.help:visited span.tip,
form.grid div.help-w1 a.help span.tip,
form.grid div.help-w1 a.help span.tip {
    width: 60px;
    left: -79px;
}
form.help-w1_5 div.field a.help span.tip,
form.help-w1_5 div.field a.help span.tip,
form.grid div.help-w1_5 a.help span.tip,
form.grid div.help-w1_5 a.help span.tip {
    width: 80px;
    left: -99px;
}

/* messages */
form.field-1 div.message,
form.grid div.messages div.span-1 {
     width: 65px; 
}

/* fluxbox tweaks */
form.grid div.fluxbox div.span-1 {
    width: 110px;
}


form.label-1 div.prompt,
form.label-1 div.error,
form.label-1 div.messsage {
    margin-left: 115px;
}

form.field-1 div.prompt,
form.field-1 div.error,
form.field-1 div.messsage {
    width: 63px;
}

/* IE6 is a pile of shit.  We have to hide these rules from it by using
 * the 'parent > child' selector which it is too crap to support
 */
html>body form.grid input.button.span-1 {
    width: 110px;
}
html>body form.grid input.button.span-1_5 {
    width: 165px;
}
html>body form.grid div.value.skip-1 {
    margin-left: 115px; 
}
html>body form.grid div.value.skip-1_5 {
    margin-left: 170px; 
}
html>body form.grid div.message.span-1 {
     width: 65px; 
}


form.field-2 input,
form.field-2 textarea,
form.field-2 div.value,
form.grid div.field-2 input,
form.grid div.field-2 textarea,
form.grid div.field-2 div.value,
form.grid input.span-2,
form.grid textarea.span-2,
form.grid div.field div.span-2 {                  /* NOT SURE - breaks upload meter */
    width: 217px;
}

/* fields in half-column increments: span-1_5, span-2_5, span-3_5, etc */
form.field-2_5 input,
form.field-2_5 textarea,
form.field-2_5 div.value,
form.grid input.span-2_5,
form.grid textarea.span-2_5,
form.grid div.field div.span-2_5 {
    width: 272px;
}

/* buttons */
form.field-2 .buttons a,
form.grid .buttons a.span-2,
form.grid .buttons a.span-2 {
    width: 198px;
}

/* field labels and select fields have different padding */
form.label-2 label,
form.field-2 select, 
form.grid div.label-2 label,
form.grid label.span-2,
form.grid select.span-2, 
form.grid .buttons input.span-2 {
    /* padding doesn't seem to be added for input buttons and selects */
    width: 225px;
}

form.label-2_5 label,
form.field-2_5 select, 
form.grid label.span-2_5,
form.grid select.span-2_5, 
form.grid .buttons input.span-2_5 {
    width: 280px;
}

/* skip columns */
form.grid label.skip-2,
form.grid input.skip-2,
form.grid textarea.skip-2,
form.grid select.skip-2, 
form.grid .buttons a.skip-2,
form.grid .buttons input.skip-2 {  
    margin-left: 230px; 
}

form.grid label.skip-2_5,
form.grid input.skip-2_5,
form.grid textarea.skip-2_5,
form.grid select.skip-2_5, 
form.grid .buttons a.skip-2_5,
form.grid .buttons input.skip-2_5 {
    margin-left: 285px; 
}

/* help icon position */
form.help-2 div.field a.help,
form.help-2 div.field a.help:link,
form.help-2 div.field a.help:visited,
form.grid div.help-2 a.help,
form.grid div.help-2 a.help:link,
form.grid div.help-2 a.help:visited {
    left: 230px;
}
form.help-2_5 div.field a.help,
form.help-2_5 div.field a.help:link,
form.help-2_5 div.field a.help:visited,
form.grid div.help-2_5 a.help,
form.grid div.help-2_5 a.help:link,
form.grid div.help-2_5 a.help:visited {
    left: 285px;
}

/* help tooltip widths */
form.help-w2 div.field a.help span.tip,
form.help-w2 div.field a.help:visited span.tip,
form.grid div.help-w2 a.help span.tip,
form.grid div.help-w2 a.help span.tip {
    width: 120px;
    left: -139px;
}
form.help-w2_5 div.field a.help span.tip,
form.help-w2_5 div.field a.help span.tip,
form.grid div.help-w2_5 a.help span.tip,
form.grid div.help-w2_5 a.help span.tip {
    width: 140px;
    left: -159px;
}

/* messages */
form.field-2 div.message,
form.grid div.messages div.span-2 {
     width: 180px; 
}

/* fluxbox tweaks */
form.grid div.fluxbox div.span-2 {
    width: 225px;
}


form.label-2 div.prompt,
form.label-2 div.error,
form.label-2 div.messsage {
    margin-left: 230px;
}

form.field-2 div.prompt,
form.field-2 div.error,
form.field-2 div.messsage {
    width: 178px;
}

/* IE6 is a pile of shit.  We have to hide these rules from it by using
 * the 'parent > child' selector which it is too crap to support
 */
html>body form.grid input.button.span-2 {
    width: 225px;
}
html>body form.grid input.button.span-2_5 {
    width: 280px;
}
html>body form.grid div.value.skip-2 {
    margin-left: 230px; 
}
html>body form.grid div.value.skip-2_5 {
    margin-left: 285px; 
}
html>body form.grid div.message.span-2 {
     width: 180px; 
}


form.field-3 input,
form.field-3 textarea,
form.field-3 div.value,
form.grid div.field-3 input,
form.grid div.field-3 textarea,
form.grid div.field-3 div.value,
form.grid input.span-3,
form.grid textarea.span-3,
form.grid div.field div.span-3 {                  /* NOT SURE - breaks upload meter */
    width: 332px;
}

/* fields in half-column increments: span-1_5, span-2_5, span-3_5, etc */
form.field-3_5 input,
form.field-3_5 textarea,
form.field-3_5 div.value,
form.grid input.span-3_5,
form.grid textarea.span-3_5,
form.grid div.field div.span-3_5 {
    width: 387px;
}

/* buttons */
form.field-3 .buttons a,
form.grid .buttons a.span-3,
form.grid .buttons a.span-3 {
    width: 313px;
}

/* field labels and select fields have different padding */
form.label-3 label,
form.field-3 select, 
form.grid div.label-3 label,
form.grid label.span-3,
form.grid select.span-3, 
form.grid .buttons input.span-3 {
    /* padding doesn't seem to be added for input buttons and selects */
    width: 340px;
}

form.label-3_5 label,
form.field-3_5 select, 
form.grid label.span-3_5,
form.grid select.span-3_5, 
form.grid .buttons input.span-3_5 {
    width: 395px;
}

/* skip columns */
form.grid label.skip-3,
form.grid input.skip-3,
form.grid textarea.skip-3,
form.grid select.skip-3, 
form.grid .buttons a.skip-3,
form.grid .buttons input.skip-3 {  
    margin-left: 345px; 
}

form.grid label.skip-3_5,
form.grid input.skip-3_5,
form.grid textarea.skip-3_5,
form.grid select.skip-3_5, 
form.grid .buttons a.skip-3_5,
form.grid .buttons input.skip-3_5 {
    margin-left: 400px; 
}

/* help icon position */
form.help-3 div.field a.help,
form.help-3 div.field a.help:link,
form.help-3 div.field a.help:visited,
form.grid div.help-3 a.help,
form.grid div.help-3 a.help:link,
form.grid div.help-3 a.help:visited {
    left: 345px;
}
form.help-3_5 div.field a.help,
form.help-3_5 div.field a.help:link,
form.help-3_5 div.field a.help:visited,
form.grid div.help-3_5 a.help,
form.grid div.help-3_5 a.help:link,
form.grid div.help-3_5 a.help:visited {
    left: 400px;
}

/* help tooltip widths */
form.help-w3 div.field a.help span.tip,
form.help-w3 div.field a.help:visited span.tip,
form.grid div.help-w3 a.help span.tip,
form.grid div.help-w3 a.help span.tip {
    width: 180px;
    left: -199px;
}
form.help-w3_5 div.field a.help span.tip,
form.help-w3_5 div.field a.help span.tip,
form.grid div.help-w3_5 a.help span.tip,
form.grid div.help-w3_5 a.help span.tip {
    width: 200px;
    left: -219px;
}

/* messages */
form.field-3 div.message,
form.grid div.messages div.span-3 {
     width: 295px; 
}

/* fluxbox tweaks */
form.grid div.fluxbox div.span-3 {
    width: 340px;
}


form.label-3 div.prompt,
form.label-3 div.error,
form.label-3 div.messsage {
    margin-left: 345px;
}

form.field-3 div.prompt,
form.field-3 div.error,
form.field-3 div.messsage {
    width: 293px;
}

/* IE6 is a pile of shit.  We have to hide these rules from it by using
 * the 'parent > child' selector which it is too crap to support
 */
html>body form.grid input.button.span-3 {
    width: 340px;
}
html>body form.grid input.button.span-3_5 {
    width: 395px;
}
html>body form.grid div.value.skip-3 {
    margin-left: 345px; 
}
html>body form.grid div.value.skip-3_5 {
    margin-left: 400px; 
}
html>body form.grid div.message.span-3 {
     width: 295px; 
}


form.field-4 input,
form.field-4 textarea,
form.field-4 div.value,
form.grid div.field-4 input,
form.grid div.field-4 textarea,
form.grid div.field-4 div.value,
form.grid input.span-4,
form.grid textarea.span-4,
form.grid div.field div.span-4 {                  /* NOT SURE - breaks upload meter */
    width: 447px;
}

/* fields in half-column increments: span-1_5, span-2_5, span-3_5, etc */
form.field-4_5 input,
form.field-4_5 textarea,
form.field-4_5 div.value,
form.grid input.span-4_5,
form.grid textarea.span-4_5,
form.grid div.field div.span-4_5 {
    width: 502px;
}

/* buttons */
form.field-4 .buttons a,
form.grid .buttons a.span-4,
form.grid .buttons a.span-4 {
    width: 428px;
}

/* field labels and select fields have different padding */
form.label-4 label,
form.field-4 select, 
form.grid div.label-4 label,
form.grid label.span-4,
form.grid select.span-4, 
form.grid .buttons input.span-4 {
    /* padding doesn't seem to be added for input buttons and selects */
    width: 455px;
}

form.label-4_5 label,
form.field-4_5 select, 
form.grid label.span-4_5,
form.grid select.span-4_5, 
form.grid .buttons input.span-4_5 {
    width: 510px;
}

/* skip columns */
form.grid label.skip-4,
form.grid input.skip-4,
form.grid textarea.skip-4,
form.grid select.skip-4, 
form.grid .buttons a.skip-4,
form.grid .buttons input.skip-4 {  
    margin-left: 460px; 
}

form.grid label.skip-4_5,
form.grid input.skip-4_5,
form.grid textarea.skip-4_5,
form.grid select.skip-4_5, 
form.grid .buttons a.skip-4_5,
form.grid .buttons input.skip-4_5 {
    margin-left: 515px; 
}

/* help icon position */
form.help-4 div.field a.help,
form.help-4 div.field a.help:link,
form.help-4 div.field a.help:visited,
form.grid div.help-4 a.help,
form.grid div.help-4 a.help:link,
form.grid div.help-4 a.help:visited {
    left: 460px;
}
form.help-4_5 div.field a.help,
form.help-4_5 div.field a.help:link,
form.help-4_5 div.field a.help:visited,
form.grid div.help-4_5 a.help,
form.grid div.help-4_5 a.help:link,
form.grid div.help-4_5 a.help:visited {
    left: 515px;
}

/* help tooltip widths */
form.help-w4 div.field a.help span.tip,
form.help-w4 div.field a.help:visited span.tip,
form.grid div.help-w4 a.help span.tip,
form.grid div.help-w4 a.help span.tip {
    width: 240px;
    left: -259px;
}
form.help-w4_5 div.field a.help span.tip,
form.help-w4_5 div.field a.help span.tip,
form.grid div.help-w4_5 a.help span.tip,
form.grid div.help-w4_5 a.help span.tip {
    width: 260px;
    left: -279px;
}

/* messages */
form.field-4 div.message,
form.grid div.messages div.span-4 {
     width: 410px; 
}

/* fluxbox tweaks */
form.grid div.fluxbox div.span-4 {
    width: 455px;
}



form.field-5 input,
form.field-5 textarea,
form.field-5 div.value,
form.grid div.field-5 input,
form.grid div.field-5 textarea,
form.grid div.field-5 div.value,
form.grid input.span-5,
form.grid textarea.span-5,
form.grid div.field div.span-5 {                  /* NOT SURE - breaks upload meter */
    width: 562px;
}

/* fields in half-column increments: span-1_5, span-2_5, span-3_5, etc */
form.field-5_5 input,
form.field-5_5 textarea,
form.field-5_5 div.value,
form.grid input.span-5_5,
form.grid textarea.span-5_5,
form.grid div.field div.span-5_5 {
    width: 617px;
}

/* buttons */
form.field-5 .buttons a,
form.grid .buttons a.span-5,
form.grid .buttons a.span-5 {
    width: 543px;
}

/* field labels and select fields have different padding */
form.label-5 label,
form.field-5 select, 
form.grid div.label-5 label,
form.grid label.span-5,
form.grid select.span-5, 
form.grid .buttons input.span-5 {
    /* padding doesn't seem to be added for input buttons and selects */
    width: 570px;
}

form.label-5_5 label,
form.field-5_5 select, 
form.grid label.span-5_5,
form.grid select.span-5_5, 
form.grid .buttons input.span-5_5 {
    width: 625px;
}

/* skip columns */
form.grid label.skip-5,
form.grid input.skip-5,
form.grid textarea.skip-5,
form.grid select.skip-5, 
form.grid .buttons a.skip-5,
form.grid .buttons input.skip-5 {  
    margin-left: 575px; 
}

form.grid label.skip-5_5,
form.grid input.skip-5_5,
form.grid textarea.skip-5_5,
form.grid select.skip-5_5, 
form.grid .buttons a.skip-5_5,
form.grid .buttons input.skip-5_5 {
    margin-left: 630px; 
}

/* help icon position */
form.help-5 div.field a.help,
form.help-5 div.field a.help:link,
form.help-5 div.field a.help:visited,
form.grid div.help-5 a.help,
form.grid div.help-5 a.help:link,
form.grid div.help-5 a.help:visited {
    left: 575px;
}
form.help-5_5 div.field a.help,
form.help-5_5 div.field a.help:link,
form.help-5_5 div.field a.help:visited,
form.grid div.help-5_5 a.help,
form.grid div.help-5_5 a.help:link,
form.grid div.help-5_5 a.help:visited {
    left: 630px;
}

/* help tooltip widths */
form.help-w5 div.field a.help span.tip,
form.help-w5 div.field a.help:visited span.tip,
form.grid div.help-w5 a.help span.tip,
form.grid div.help-w5 a.help span.tip {
    width: 300px;
    left: -319px;
}
form.help-w5_5 div.field a.help span.tip,
form.help-w5_5 div.field a.help span.tip,
form.grid div.help-w5_5 a.help span.tip,
form.grid div.help-w5_5 a.help span.tip {
    width: 320px;
    left: -339px;
}

/* messages */
form.field-5 div.message,
form.grid div.messages div.span-5 {
     width: 525px; 
}

/* fluxbox tweaks */
form.grid div.fluxbox div.span-5 {
    width: 570px;
}



form.field-6 input,
form.field-6 textarea,
form.field-6 div.value,
form.grid div.field-6 input,
form.grid div.field-6 textarea,
form.grid div.field-6 div.value,
form.grid input.span-6,
form.grid textarea.span-6,
form.grid div.field div.span-6 {                  /* NOT SURE - breaks upload meter */
    width: 677px;
}

/* fields in half-column increments: span-1_5, span-2_5, span-3_5, etc */
form.field-6_5 input,
form.field-6_5 textarea,
form.field-6_5 div.value,
form.grid input.span-6_5,
form.grid textarea.span-6_5,
form.grid div.field div.span-6_5 {
    width: 732px;
}

/* buttons */
form.field-6 .buttons a,
form.grid .buttons a.span-6,
form.grid .buttons a.span-6 {
    width: 658px;
}

/* field labels and select fields have different padding */
form.label-6 label,
form.field-6 select, 
form.grid div.label-6 label,
form.grid label.span-6,
form.grid select.span-6, 
form.grid .buttons input.span-6 {
    /* padding doesn't seem to be added for input buttons and selects */
    width: 685px;
}

form.label-6_5 label,
form.field-6_5 select, 
form.grid label.span-6_5,
form.grid select.span-6_5, 
form.grid .buttons input.span-6_5 {
    width: 740px;
}

/* skip columns */
form.grid label.skip-6,
form.grid input.skip-6,
form.grid textarea.skip-6,
form.grid select.skip-6, 
form.grid .buttons a.skip-6,
form.grid .buttons input.skip-6 {  
    margin-left: 690px; 
}

form.grid label.skip-6_5,
form.grid input.skip-6_5,
form.grid textarea.skip-6_5,
form.grid select.skip-6_5, 
form.grid .buttons a.skip-6_5,
form.grid .buttons input.skip-6_5 {
    margin-left: 745px; 
}

/* help icon position */
form.help-6 div.field a.help,
form.help-6 div.field a.help:link,
form.help-6 div.field a.help:visited,
form.grid div.help-6 a.help,
form.grid div.help-6 a.help:link,
form.grid div.help-6 a.help:visited {
    left: 690px;
}
form.help-6_5 div.field a.help,
form.help-6_5 div.field a.help:link,
form.help-6_5 div.field a.help:visited,
form.grid div.help-6_5 a.help,
form.grid div.help-6_5 a.help:link,
form.grid div.help-6_5 a.help:visited {
    left: 745px;
}

/* help tooltip widths */
form.help-w6 div.field a.help span.tip,
form.help-w6 div.field a.help:visited span.tip,
form.grid div.help-w6 a.help span.tip,
form.grid div.help-w6 a.help span.tip {
    width: 360px;
    left: -379px;
}
form.help-w6_5 div.field a.help span.tip,
form.help-w6_5 div.field a.help span.tip,
form.grid div.help-w6_5 a.help span.tip,
form.grid div.help-w6_5 a.help span.tip {
    width: 380px;
    left: -399px;
}

/* messages */
form.field-6 div.message,
form.grid div.messages div.span-6 {
     width: 640px; 
}

/* fluxbox tweaks */
form.grid div.fluxbox div.span-6 {
    width: 685px;
}



form.field-7 input,
form.field-7 textarea,
form.field-7 div.value,
form.grid div.field-7 input,
form.grid div.field-7 textarea,
form.grid div.field-7 div.value,
form.grid input.span-7,
form.grid textarea.span-7,
form.grid div.field div.span-7 {                  /* NOT SURE - breaks upload meter */
    width: 792px;
}

/* fields in half-column increments: span-1_5, span-2_5, span-3_5, etc */
form.field-7_5 input,
form.field-7_5 textarea,
form.field-7_5 div.value,
form.grid input.span-7_5,
form.grid textarea.span-7_5,
form.grid div.field div.span-7_5 {
    width: 847px;
}

/* buttons */
form.field-7 .buttons a,
form.grid .buttons a.span-7,
form.grid .buttons a.span-7 {
    width: 773px;
}

/* field labels and select fields have different padding */
form.label-7 label,
form.field-7 select, 
form.grid div.label-7 label,
form.grid label.span-7,
form.grid select.span-7, 
form.grid .buttons input.span-7 {
    /* padding doesn't seem to be added for input buttons and selects */
    width: 800px;
}

form.label-7_5 label,
form.field-7_5 select, 
form.grid label.span-7_5,
form.grid select.span-7_5, 
form.grid .buttons input.span-7_5 {
    width: 855px;
}

/* skip columns */
form.grid label.skip-7,
form.grid input.skip-7,
form.grid textarea.skip-7,
form.grid select.skip-7, 
form.grid .buttons a.skip-7,
form.grid .buttons input.skip-7 {  
    margin-left: 805px; 
}

form.grid label.skip-7_5,
form.grid input.skip-7_5,
form.grid textarea.skip-7_5,
form.grid select.skip-7_5, 
form.grid .buttons a.skip-7_5,
form.grid .buttons input.skip-7_5 {
    margin-left: 860px; 
}

/* help icon position */
form.help-7 div.field a.help,
form.help-7 div.field a.help:link,
form.help-7 div.field a.help:visited,
form.grid div.help-7 a.help,
form.grid div.help-7 a.help:link,
form.grid div.help-7 a.help:visited {
    left: 805px;
}
form.help-7_5 div.field a.help,
form.help-7_5 div.field a.help:link,
form.help-7_5 div.field a.help:visited,
form.grid div.help-7_5 a.help,
form.grid div.help-7_5 a.help:link,
form.grid div.help-7_5 a.help:visited {
    left: 860px;
}

/* help tooltip widths */
form.help-w7 div.field a.help span.tip,
form.help-w7 div.field a.help:visited span.tip,
form.grid div.help-w7 a.help span.tip,
form.grid div.help-w7 a.help span.tip {
    width: 420px;
    left: -439px;
}
form.help-w7_5 div.field a.help span.tip,
form.help-w7_5 div.field a.help span.tip,
form.grid div.help-w7_5 a.help span.tip,
form.grid div.help-w7_5 a.help span.tip {
    width: 440px;
    left: -459px;
}

/* messages */
form.field-7 div.message,
form.grid div.messages div.span-7 {
     width: 755px; 
}

/* fluxbox tweaks */
form.grid div.fluxbox div.span-7 {
    width: 800px;
}





/*------------------------------------------------------------------------
 * custom select styling for categories
 *------------------------------------------------------------------------*/

select.category option {
    background:         url('/images/icons/property/category_icons_18x20.gif') 
                        no-repeat right 20px;
    line-height:        20px;
}

select.category option.HS {
    background-position: right -2px;
/*  background-color:   #F9A51A; 
    color:              white; */
}

select.category option.SC {
    background-position: right -22px;
/*  background-color:   #A21D2D;
    color:              white; */
}

select.category option.RW {
    background-position: right -42px;
/*  background-color:   #0488B4; 
    color:              white; */
}



/*------------------------------------------------------------------------
 * recaptcha
 *------------------------------------------------------------------------*/

form.grid div.recaptcha {
    width: 340px;
}

form.grid div.recaptcha div.widget {
    clear: both;
}

form.grid div.recaptcha label {
    text-align: right;
    width: 340px;
    float: left;
    margin-right: 0;
    margin-bottom: 10px;
}

form.grid div.recaptcha #recaptcha_widget_div {
    clear: both;
    float: right;
    border: 1px solid #bbb;
}

form.grid div.recaptcha #recaptcha_widget_div label {
    margin: 0;
    padding: 0;
    float: none;
}

form.grid div.recaptcha #recaptcha_widget_div input {
    float: none;
}


/*------------------------------------------------------------------------*/
/* uploads                                                                */
/*------------------------------------------------------------------------*/

div.upload_widget {
    margin-top: 10px;
    height: 104px;
}
div.upload_widget div.upload {
    width: 115px;
    float: left;
}
div.upload_widget div.status {
    width: 500px;
    float: left;
}

div.upload_widget div.upload a.upload_button {
    display: block;
    overflow: hidden;
    cursor: pointer;
    width: 64px;
    height: 40px;
    padding: 5px 35px 5px 5px;
    margin: 0 0 10px 0;
    color: #666;
    background: url(/images/buttons/file_upload.gif) no-repeat top left;
}

div.upload_widget div.upload a.upload_button:hover {
    background-position: 0 -50px;
    cursor: pointer;
    color: white;
}

div.upload_widget div.upload a.file_selected,
div.upload_widget div.upload a.file_selected:hover {
    background-position: 0 -100px;
    color: white;
}

div.upload_widget div.upload a.please_wait,
div.upload_widget div.upload a.please_wait:hover {
    background-position: 0 -150px;
    color: white;
}

div.upload_widget div.upload a.upload_button input.file {
    position: relative;
    height: 100%;
    width: auto;
    opacity: 0.5;
    cursor: pointer;
}


/*------------------------------------------------------------------------
 * layout tweaks
 *------------------------------------------------------------------------*/

form.last,
form.grid label.last,
form.grid input.last,
form.grid textarea.last,
form.grid select.last,
form.grid div.last {
    margin-right:       0;
}

form.grid .shift-left {
    margin-left:        -5px;
}

form.grid .shift-right {
    margin-left:        5px;
}

form.grid .cln {
    clear:              none;
}

form.grid input.checkbox {
    width: 32px;
}

form.grid div.checkbox-32 label {
    width:              320px;
}

form.grid div.checkbox-32 input.checkbox {
    margin-top:         2px;
    width:              20px;
}

form.inline {
    display:            inline; 
    margin:             0; 
    padding:            0; 
    border:             0; 
    background-color:   transparent
}

form.inline select {
    display:            inline; 
    float:              none; 
    clear:              none;
    margin:             0; 
    padding:            0; 
}


/* section-specific tweaks */


body.CR form.grid label.bright {
    color: #541C70;
}
body.CR form.grid input.input:active,
body.CR form.grid input.input:focus,
body.CR form.grid textarea:active,
body.CR form.grid textarea:focus,
body.CR form.grid select:active,
body.CR form.grid select:focus {
    border-color:       #541C70;
}

body.HS form.grid label.bright {
    color: #F9A51A;
}
body.HS form.grid input.input:active,
body.HS form.grid input.input:focus,
body.HS form.grid textarea:active,
body.HS form.grid textarea:focus,
body.HS form.grid select:active,
body.HS form.grid select:focus {
    border-color:       #F9A51A;
}

body.RW form.grid label.bright {
    color: #0488B4;
}
body.RW form.grid input.input:active,
body.RW form.grid input.input:focus,
body.RW form.grid textarea:active,
body.RW form.grid textarea:focus,
body.RW form.grid select:active,
body.RW form.grid select:focus {
    border-color:       #0488B4;
}

body.SC form.grid label.bright {
    color: #A21D2D;
}
body.SC form.grid input.input:active,
body.SC form.grid input.input:focus,
body.SC form.grid textarea:active,
body.SC form.grid textarea:focus,
body.SC form.grid select:active,
body.SC form.grid select:focus {
    border-color:       #A21D2D;
}



/* extra tweaks */

form#property_form.grid div.field#add_prop_town {
    padding-bottom:     5px;
}
form#property_form.grid div.field#add_prop_county {
    padding-bottom:     5px;
}

form#request_property_add_form.grid div#prop_request_message {
    width:              575px;
}

form#company_form.grid div#user_job_title{
    width:              345px;
}

/*------------------------------------------------------------------------*/
/* css/messages - styling for message boxes used to report webapp status  */
/*------------------------------------------------------------------------*/

div.info,
div.success, 
div.warning, 
div.error, 
div.invalid, 
div.debug, 
div.message {
    clear: both;
    font-size: 14px;
    line-height: 140%;
    border: 1px solid;
    margin-top: 10px;
    margin-bottom: 10px;
    padding:15px 10px 15px 60px;
    background-repeat: no-repeat;
    background-position: 10px center;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
}

#body div.resources div.tight div.message {
    margin: 0;
}

/* NOTE: we explicitly use a child selector to hide these rules from the
 * piece of shit that is IE6.  Otherwise IE6 mistakenly applies them to
 * both div.message and div.span-N and all hell breaks loose.  IE6 is what
 * makes web developers wish they had taken up plumbing instead.  Sticking
 * your hand down a toilet blocked full of excrement is a walk in the park 
 * compared to living the daily nightmare of IE6.
 */
html>body div.message.span-1 { width: 38px; }
html>body div.message.span-2 { width: 153px; }
html>body div.message.span-3 { width: 268px; }
html>body div.message.span-4 { width: 383px; }
html>body div.message.span-5 { width: 498px; }
html>body div.message.span-6 { width: 613px; }


div.message p {
    font-size: 12px;
    line-height: 140%;
    margin: 5px 0 0 0;
}

div.message p.intro {
    font-size: 14px;
    line-height: 140%;
}

div.message ul {
    margin: 10px 0;
}

div.message ul li {
    font-size: 12px;
}

div.message a {
    text-decoration: underline;
}
div.message a.button {
    text-decoration: none;
}

/* #messages div.info {     */   /* scoped because div.info is used elsewhere */
div.error {  
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('../images/messages/error.png');
}
div.error a,
#content div.error p a {  
    color: #6C0006;
}
div.error a:hover,
#content div.error p a:hover {  
    color: #360003;
}
div.info {  
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url('../images/messages/info.png');
}
div.info a,
#content div.info p a {  
    color: #00294D;
}
div.info a:hover,
#content div.info p a:hover {  
    color: #001426;
}
div.invalid {  
    color: #D63301;
    background-color: #FFCCBA;
    background-image: url('../images/messages/invalid.png');
}
div.invalid a,
#content div.invalid p a {  
    color: #6B1900;
}
div.invalid a:hover,
#content div.invalid p a:hover {  
    color: #350C00;
}
div.success {  
    color: #4F8A10;
    background-color: #DFF2BF;
    background-image: url('../images/messages/success.png');
}
div.success a,
#content div.success p a {  
    color: #274508;
}
div.success a:hover,
#content div.success p a:hover {  
    color: #132204;
}
div.warning {  
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url('../images/messages/warning.png');
}
div.warning a,
#content div.warning p a {  
    color: #4F3000;
}
div.warning a:hover,
#content div.warning p a:hover {  
    color: #271800;
}


.note {
    font-size: 12px;
    color: #888;
    font-style: italic;
    min-height: 16px;
    padding: 5px 10px 5px 30px !important;
    margin: 5px 0;
    background: #f4f4f4 url('../images/icons/silk/flag_yellow.png') no-repeat 10px 5px;
    border: 1px solid #ccc;
}

div.neon {
    position: relative;
    width: 600px;
    height: 600px;
    margin: 20px auto;
    padding: 80px 0 0 0;
/*    background: url('../images/backgrounds/cr_beta_neon.jpg') no-repeat top left; */
}

div.neon a.home {
    position: absolute; display: block;
    top: 0; left: 0;
    width: 257px; height: 213px;
    background: url('../images/backgrounds/cr_beta_neon.jpg') no-repeat top left;
    cursor: pointer;
}

div.neon h1,
div.neon h1,
div.neon h1 {
    color: #C50907;
    margin: 0 0 20px 280px;
    font-size: 32px;
}    

div.neon p {
    color: #CCC;
    font-size: 18px;
    margin: 0 0 20px 280px;
}

div.denied,
div.magic8,
div.not_found {
    width: 360px;
    height: 100px;
    margin: 40px auto;
    padding: 35px 0 0 150px;
    background: url('../images/messages/hal.jpg') no-repeat top left;
}

div.not_found {
    background-image: url('../images/messages/marvin.jpg');
    padding: 0 0 0 120px;
    height: 200px;
}

div.magic8 {
    background-image: url('../images/messages/magic8ball.png');
    padding: 0 0 0 120px;
    height: 200px;
    width: 550px;
}

div.denied h1 {
    color: #C50907;
    margin: 0 0 25px 0;
    font-size: 32px;
}

div.denied p {
    color: #CCC;
    font-size: 18px;
}

div.not_found h1,
div.magic8 h1 {
    color: #FF7F00;
    margin: 0 0 10px 0;
    font-size: 20px;
}

div.not_found p,
div.magic8 p {
    color: #888;
    font-size: 14px;
}

div.not_found p.marvin {
    color: #AAA;
    font-size: 12px;
}

div.magic8 p.intro {
    color: #AAA;
    font-size: 16px;
}

div.magic8 p.fail {
    color: #D8000C;
    font-size: 14px;
}

div.debug {
    border-color: #ccb59e;
    color: #9A7958;
    background-color: #F5F5F5;
    background-image: url('../images/messages/debug.gif');
    background-position: 5px 5px;
    padding-left: 100px;
    min-height: 70px;
}

/* yuk.  we must avoid the .title clash with div.panel */
#content div.debug   .title,
#content div.debug   .caption { 
    color: #9A7958 
}
#content div.info    .title,
#content div.info    .caption { 
    color: #00529B 
}
#content div.warning .title,
#content div.warning .caption { 
    color: #9F6000 
}
#content div.invalid .title,
#content div.invalid .caption { 
    color: #D63301 
}
#content div.error   .title,
#content div.error   .caption { 
    color: #D8000C 
}
#content div.success  .title,
#content div.success  .caption { 
    color: #4F8A10;
}

#content div.success h3.title,
#content div.debug   h3.title,
#content div.info    h3.title,
#content div.warning h3.title,
#content div.invalid h3.title,
#content div.error   h3.title,
#content div.success h3.caption,
#content div.debug   h3.caption,
#content div.info    h3.caption,
#content div.warning h3.caption,
#content div.invalid h3.caption,
#content div.error   h3.caption { 
    font-size: 16px; margin: 8px 0;
}


div.todo {
    color: #448;
    background: #ddddff url('../images/messages/todo.png') no-repeat 20px 20px;
    padding-left: 100px;
    min-height: 70px;
}

div.todo h4 {
    color: #448;
    margin: 0 0 5px 0;
}

div.todo ul {
    padding: 0;
}

div.todo li {
    margin: 5px 0;
    padding-left: 24px;
    list-style: none;
    background: url('../images/icons/silk/wrench.png') no-repeat 0 0;
}

div.todo li.done {
    color: #888;
    background-image: url('../images/icons/silk/tick.png');
}

div.first {
    margin-top: 0px;
}

div.working {
    background-color: #FEEFB3;
}

/* debug/development stuff */

div.caller {
    background-color: #eee;
    color: #444;
    padding: 4px;
    margin: 2px;
    border: 1px solid #bbb;
}

div.caller span.module,
div.caller span.method,
div.caller span.file,
div.caller span.line {
    font-weight: bold;
    color: black;
}

div.caller span.method {
    color: #3e8f84
}

div.caller span.file,
div.caller span.line {
    color: #448;
}

/*------------------------------------------------------------------------*/
/* css/panels.css - styling for various panels                            */
/*------------------------------------------------------------------------*/

#body div.panel {
    clear: both; float: none;
    margin-bottom: 10px;
}

#body div.vgrad {
    background: #fdfdfd url('/images/backgrounds/vert_grad.gif') repeat-x top left;
}

#body div.panel .title {
    clear: both; float: none;
    display: block;
    position: relative;
    font-size: 12px;
    line-height: 20px;
    height: 20px;
    background-color: #888;
    color: white;
    margin: 0 0 2px 0;
    padding: 0px 20px 0px 6px;
    text-transform: uppercase;
    font-weight: bold;
    cursor: pointer;

    border-radius: 2px 2px 0 0; 
    -moz-border-radius: 2px 2px 0 0; 
    -webkit-border-radius: 2px 2px 0 0;
    -khtml-border-radius: 2px 2px 0 0;
}

#body div.closed .title {

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
}

#body div.panel .title:hover {
    color: #444;
}

#body div.panel div.message {
    margin: 20px;
}

#body div.resources div.message {
    margin: 10px;
}

#body div.panel .title em {
    color: black;
    font-style: normal;
}

#body div.panel .title .revealer {
    position: absolute; 
    display: block;
    cursor: pointer;
    top: 5px;
    right: 5px;
    width: 12px;
    height: 12px;
    background: url('../images/arrows/grey_revealers.gif') no-repeat right -80px;
}

body.RW #body div.panel .title .revealer {
    background-image: url(/images/arrows/blue_revealers.gif);
}
body.SC #body div.panel .title .revealer {
    background-image: url(/images/arrows/red_revealers.gif);
}
body.HS #body div.panel .title .revealer {
    background-image: url(/images/arrows/yellow_revealers.gif);
}
body.CR #body div.panel .title .revealer {
    background-image: url(/images/arrows/purple_revealers.gif);
}

#body div.panel .title:hover .revealer,
#body div.panel .title .revealer:hover {
    background-position: right -100px;
}

#body div.closed .title .revealer {
    background-position: right -120px;
}

#body div.closed .title:hover .revealer,
#body div.closed .title .revealer:hover {
    background-position: right -140px;
}

#body div.panel .title a.go {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 25px;
    height: 20px;
    font-size: 12px;
    line-height: 20px;
    color: white;
    background-color: black;
    text-align: center;
    cursor: pointer;
}

#body div.panel div.body {
    clear: both; float: none;
    padding-bottom: 1px;
}

#body div.closed div.body {
    display: none;
}

#body div.closed:focus div.body {
    display: block;
}

#body div.panel div.body  h1,
#body div.panel div.body  h2,
#body div.panel div.body  h3,
#body div.panel div.body  h4,
#body div.panel div.body  h5,
#body div.panel div.body  p {
/*     margin: 10px; */
}

#body div.panel div.body p {
    font-size: 14px;
    line-height: 135%;
}

#body div.panel div.body p.intro {
    font-size: 16px;
    line-height: 135%;
}

#body div.panel div.body p.info {
    font-size: 12px;
    line-height: 135%;
}

#body div.panel div.body div.message p {
    font-size: 12px;
    line-height: 135%;
}

#body div.panel div.body div.message p.intro {
    font-size: 14px;
}

#body div.panel div.body b.email {
    color: #541C70;
}

#body div.panel div.body ul.ol {
    clear: both; float: none; 
    padding: 10px 0px 10px 10px;
    margin: 0; 
    list-style-position: outside; 
    list-style-type: decimal;  
    font-size:10px; 
}

#body div.panel div.body ul.ol li a,
#body div.panel div.body ul.ol li a:link, 
#body div.panel div.body ul.ol li a:visited { 
    font-size:10px; 
    color: #97999C; 
}

#body div.danger .title {
    background-color: #791521;
}

#body div.danger .title a.revealer {
    background-color: #791521;
    background-image: url('../images/arrows/red_revealers.gif');
}


/*------------------------------------------------------------------------*/
/* tabbed panels                                                          */
/*------------------------------------------------------------------------*/

div.tabset {
    margin: 5px 0 0 0;
}

div.tabset ul.tabs {
    display: block;  overflow: visible;
    list-style: none;
    margin: 0; padding: 0;
    height: 20px;
}

div.tabset ul.tabs li {
    float: left; clear: none;
    margin: 0 5px 0 0; 
    padding: 0;
}

div.tabset ul.tabs li a {
    clear: none; float: left;
    display: block;  position: relative; 
    height: 12px;  min-width: 60px;
    margin: 0; padding: 4px 12px 5px 10px;
    font-size: 10px; font-weight:bold; line-height: 15px;
    background-color: #888888;
    text-decoration: none;
    text-transform: uppercase;
    color: white; 
}

div.tabset ul.tabs li a:hover {
    background-color: #F3A223;
}

div.tabset ul.tabs li.warm a,
div.tabset ul.tabs li.warm a:hover {
    background-color: #541C70;
}

div.tabset div.panels div.panel {
    display: none; clear: both;
/*    margin: 5px 0 0 0;  
    padding: 0 0 4px 0;*/
    margin: 0;
    padding: 5px 0 4px 0;
    border-top: 1px solid #541C70;
}

div.tabset div.panels div.warm {
    display: block;
}

/*------------------------------------------------------------------------*/
/* section-specific styles for panels                                     */
/*------------------------------------------------------------------------*/

body.CR #body div.panel .title                      { background-color: #541C70 }
body.CR #body div.panel div.body ul.ol,
body.CR #body div.panel div.body ul.ol li a:hover   { color: #541C70 }
body.CR div.tabset ul.tabs li.warm a,
body.CR div.tabset ul.tabs li.warm a:hover          { background-color: #541C70 }
body.CR div.tabset div.panels div.panel             { border-color: #541C70     }
body.HS #body div.panel .title                      { background-color: #F9A51A }
body.HS #body div.panel div.body ul.ol,
body.HS #body div.panel div.body ul.ol li a:hover   { color: #F9A51A }
body.HS div.tabset ul.tabs li.warm a,
body.HS div.tabset ul.tabs li.warm a:hover          { background-color: #F9A51A }
body.HS div.tabset div.panels div.panel             { border-color: #F9A51A     }
body.RW #body div.panel .title                      { background-color: #0488B4 }
body.RW #body div.panel div.body ul.ol,
body.RW #body div.panel div.body ul.ol li a:hover   { color: #0488B4 }
body.RW div.tabset ul.tabs li.warm a,
body.RW div.tabset ul.tabs li.warm a:hover          { background-color: #0488B4 }
body.RW div.tabset div.panels div.panel             { border-color: #0488B4     }
body.SC #body div.panel .title                      { background-color: #A21D2D }
body.SC #body div.panel div.body ul.ol,
body.SC #body div.panel div.body ul.ol li a:hover   { color: #A21D2D }
body.SC div.tabset ul.tabs li.warm a,
body.SC div.tabset ul.tabs li.warm a:hover          { background-color: #A21D2D }
body.SC div.tabset div.panels div.panel             { border-color: #A21D2D     }



/*------------------------------------------------------------------------*/
/* lockable panels - hacked in as a temporary measure for user forms      */
/* until something better comes along                                     */
/*------------------------------------------------------------------------*/

#body div.lockable {
}

#body div.lockable h3.locker {
    position: relative;
    margin: 10px 20px;
    padding: 2px 25px 2px 10px;
    color: #888888;
    text-align: right;
    font-size: 12px;
}

#body div.lockable h3.locker a.padlock {
    display: block;
    position: absolute;
    bottom: 2px;
    right: 0px;
    width: 16px;
    height: 16px;
    background: url('../images/icons/silk/lock.png') no-repeat left top;
    cursor: pointer;
}

#body div.unlocked h3.locker a.padlock {
    background-image: url('../images/icons/silk/lock_open.png');
}

#body div.lockable .unlocked {
    display: none;
}

#body div.unlocked .unlocked {
    display: block;
}

/* special case for flexbox which needs the element in the DOM to attache to */

#body div.lockable .unlocked-hide {
    visibility: hidden;
    position: absolute;
    left: -9999px;
}

#body div.unlocked .unlocked-hide {
    visibility: visible;
    position: relative;
    left: 0;
}

#body div.unlocked span.unlocked,
#body div.unlocked a.unlocked {
    display: inline;
}

#body div.unlocked th.unlocked,
#body div.unlocked td.unlocked {
    display: table-cell;
}

#body div.lockable .locked {
    display: block;
}

#body div.lockable span.locked,
#body div.lockable a.locked {
    display: inline;
}

#body div.unlocked .locked,
#body div.unlocked a.locked,
#body div.unlocked span.locked {
    display: none;
}

/*------------------------------------------------------------------------*/
/* Combination Panels                                                     */
/*------------------------------------------------------------------------*/


div.combo {
    padding:            0;
/*    margin:             0 0 10px 0; */
}

div.combo div.top {

    border-radius: 4px 4px 0 0; 
    -moz-border-radius: 4px 4px 0 0; 
    -webkit-border-radius: 4px 4px 0 0;
    -khtml-border-radius: 4px 4px 0 0;
}

div.combo div.bottom {

    border-radius: 0 0 4px 4px; 
    -moz-border-radius: 0 0 4px 4px; 
    -webkit-border-radius: 0 0 4px 4px;
    -khtml-border-radius: 0 0 4px 4px;
}

div.combo div.padded {
    padding:        5px;
}

div.combo div.watermark {
    position:       relative;
    background:     #eee url('/images/panels/cr_panel_800x200.gif') 
                    no-repeat bottom right;
    overflow:       auto;
}

/* div.results div.combo div.overview, */
div.combo div.overview {
    background-color:   #bbb;
    line-height:        20px;
    padding:            2px 5px;
    font-size:          16px;
    color:              #444;
    margin-bottom: 1px;
}

div.results div.combo div.overview {
/*    background-color:   #bbb;
    color:              #666; */
}

div.results div.combo div.overview h2 {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    color: #EEE;
    font-weight: normal;
}

div.results div.combo div.overview div.summary {
    color: #EEE;
}


#body div.combo div.panel {
    margin: 1px 0 0 0;
}

#body div.combo div.panel .title {
    margin-bottom: 1px;
    text-transform: none;
    line-height: 18px;

    border-radius: 0; 
    -moz-border-radius: 0; 
    -webkit-border-radius: 0;
    -khtml-border-radius: 0;

    background-color: #bbb;
}

#body div.combo div.panel .title .revealer {
    padding-right: 16px;
    width: 120px;
    top: 6px;
    font-size: 10px;
    line-height: 10px;
    color: #666;
    text-align: right;
}

#body div.combo div.panel .title .revealer:hover,
#body div.combo div.panel .title:hover .revealer {
    color: #444;
}


/*------------------------------------------------------------------------*/
/* table styling - most of this is temporary stuff for developing,        */
/* testing, etc.  It's used in the admin area and should eventually be    */
/* replaced or removed.                                                   */
/*------------------------------------------------------------------------*/

table.data { 
    display: block;
    float: none;
}

table.data tr th,
table.data tr td,
table.data caption {
    font-size: 12px;
    line-height: 20px;
    padding: 2px 5px;
    vertical-align: middle;
}

table.data th, 
table.data caption { 
    background-color: #BBB; 
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
    font-weight: bold;
}

table.data tr td {
    background-color: #eee;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;
}

table.data tr td.last {
    border-right: 0;
}

table.data tr td.blank {
    padding: 0;
}

table.data tr td.key {
    font-weight: bold;
}

table.data td.dark {
    background-color: #ccc;
    border-bottom: 1px solid white;
    color: #444;
    font-weight: bold;
}

table tr.vtop td {
    vertical-align: top;
}

/* bah! */
#body div.panel div.body table.data p {
    font-size: 12px;
}

/*
body.SC table.data tr td {
    color: #A21D2D;
}

body.SC table.data thead th,
body.SC table.data caption {
    background-color: #A21D2D;
}

body.RW table.data tr td {
    color: #0488B4;
}

body.RW table.data thead th,
body.RW table.data caption {
    background-color: #0488B4;
}

body.HS table.data tr td {
    color: #EF9528;
}

body.HS table.data thead th,
body.HS table.data caption {
    background-color: #0488B4;
}

*/

table.wide {
    width: 100%;
}

table.fll {
    margin-right: 10px;
}

table td.span-half, table td.span-1, table td.span-2, table td.span-3, table td.span-4, table td.span-5, table td.span-6, table td.span-7,
table th.span-half, table th.span-1, table th.span-2, table th.span-3, table th.span-4, table th.span-5, table th.span-6, table th.span-7 { 
    float:none; margin-right: 0px;
}

table td.span-1, table th.span-1 {
    width: 115px;
}
table td.span-1_5, table th.span-1_5 {
    width: 170px;
}
table td.span-2, table th.span-2 {
    width: 235px;
}
table td.span-2_5, table th.span-2_5 {
    width: 290px;
}
table td.span-3, table th.span-3 {
    width: 355px;
}
table td.span-3_5, table th.span-3_5 {
    width: 410px;
}
table td.span-4, table th.span-4 {
    width: 475px;
}
table td.span-4_5, table th.span-4_5 {
    width: 530px;
}
table td.span-5, table th.span-5 {
    width: 595px;
}
table td.span-5_5, table th.span-5_5 {
    width: 650px;
}
table td.span-6, table th.span-6 {
    width: 715px;
}
table td.span-6_5, table th.span-6_5 {
    width: 770px;
}
table td.span-7, table th.span-7 {
    width: 835px;
}
table td.span-7_5, table th.span-7_5 {
    width: 890px;
}



table tr.pass td, table tr td.pass,
table tr.accepted td, table tr td.accepted {
    color: #4F8A10;
    background-color: #DFF2BF;
}

table tr.warn td,
table tr td.warn {
    color: #C64001;
    background-color: #FFDDBA;
}

table tr.fail td, table tr td.fail,
table tr.rejected td, table tr td.rejected {
    color: #D8000C;
    background-color: #FFBABA;
}

table tr.pending td, table tr td.pending,
table tr.pending td, table tr td.pending {
    color: #00529B;
    background-color: #BDE5F8;
}

table.clickable tr:hover td,
table.clickable tr.even:hover td,
table.clickable tr.odd:hover td  { 
    background: #D8D8D8; 
    background-color: #E2D9E7;
    cursor: pointer;
}

table.clickable tr.odd:hover td  { 
    background-color: #F0ECF3;
}

/*------------------------------------------------------------------------*/
/* css/search.css: outer search results container with paging controls    */
/*------------------------------------------------------------------------*/

div.results {
    clear:              both;
    margin:             10px 0;
}

div.results div.overview {
    position:           relative;
    height:             20px;
    padding:            1px 0 5px 5px; 
    overflow:           visible;
    font-size:          12px;
    line-height:        22px;
    color:              #fff; 
    background:         #541C70; 
    text-transform:     uppercase 
}

div.results div.head { 

    border-radius: 2px 2px 0 0; 
    -moz-border-radius: 2px 2px 0 0; 
    -webkit-border-radius: 2px 2px 0 0;
    -khtml-border-radius: 2px 2px 0 0;

}
div.results div.foot { 

    border-radius: 0 0 2px 2px; 
    -moz-border-radius: 0 0 2px 2px; 
    -webkit-border-radius: 0 0 2px 2px;
    -khtml-border-radius: 0 0 2px 2px;

}

div.results div.body,
#body div.panel div.results div.body {
    padding:            0;
}

div.results div.overview div.summary {
    height:             20px;
    padding:            2px 0;
    font-size:          12px;
    line-height:        20px;
    color:              white;
}

div.results div.overview div.summary em {
    position:           relative;
    top:                1px;
    margin:             -1px 0;
    padding:            0px 2px 0 2px;
    font-weight:        bold;
    font-style:         normal;
    font-size:          16px;
    line-height:        18px;
}

div.results form.inline {
    position:           relative;
}

div.results form.inline select.page_no {
    width:              40px;
    font-size:          10px;
    padding:            1px;
    top:                -1px;
}

div.results form.inline select.page_size {
    position:           relative;
    top:                -1px;
    width:              45px;
    font-size:          10px;
    padding:            1px;
    background-color:   #eee;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;

}




/*------------------------------------------------------------------------*/
/* search paging controls                                                 */
/*------------------------------------------------------------------------*/


div.results div.overview div.paging {
    position:           absolute;
    top:                3px;
    right:              0px;
}

div.paging {
    width:              266px;
    height:             22px;
    text-align:         right;
}

div.paging .blank {
    display:            block;
    float:              left;
    width:              24px;
    margin-left:        5px;
}

div.paging .control {
    position:           relative;
    display:            block;
    float:              left;
    overflow:           visible;
    width:              22px;
    height:             18px;
    margin:             0 0 0 5px;
    font-size:          11px;
    line-height:        18px;
    color:              white;
    text-align:         center;
    border:             1px solid #3F1554;
    background:         #88619b url('/images/arrows/paging_icons_purple.gif') 
                        no-repeat 1px -1px;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;

}

div.paging .page_no              { background-image: none }

div.paging .control:hover        { background-position: 1px -21px }
div.paging .prev_page            { background-position: -19px -1px }
div.paging .prev_page:hover      { background-position: -19px -21px }
div.paging .next_page            { background-position: -39px -1px }
div.paging .next_page:hover      { background-position: -39px -21px }
div.paging .last_page            { background-position: -59px -1px }
div.paging .last_page:hover      { background-position: -59px -21px }

div.paging span.first_page,
div.paging span.first_page:hover { background-position: 1px -41px }
div.paging span.prev_page,
div.paging span.prev_page:hover  { background-position: -19px -41px }
div.paging span.next_page,
div.paging span.next_page:hover  { background-position: -39px -41px }
div.paging span.last_page,
div.paging span.last_page:hover  { background-position: -59px -41px }

div.paging a.control:hover,
div.paging a.warm {
    background-color:   #f19300;
    border-color:       #D4C6DB;
    border-color:       black;
}

div.paging .control span.text {
    color:              #555;
    color:              #3F1554;
    display:            none;  /* using images */
}

div.paging .page_no span.text {
    display:            inline;
    font-weight:        bold;
}

div.paging a.warm span.text,
div.paging a.control:hover span.text {
    color:              white;
}

div.paging .disabled,
div.paging .disabled:hover {
    background-color:   #6d3e85;
    border-color:       #442652;
}

div.paging .disabled:hover span.tip {
    display: none;
}


/*------------------------------------------------------------------------*/
/* tool tip tweaks                                                        */
/*------------------------------------------------------------------------*/

div.paging a.control:hover span.tip {
    left:               -110px;
}

div.paging a.control:hover span.tip span.arrow {
    left:               114px;
}

table.results a.tip:hover span.tip {
    top:                -24px;
    left:               -20px; 
}

table.results a.tip:hover span.tip span.arrow {
    left:               25px;
}

table.results a.tip span.tip span.dir {
    position:           absolute;
    right:              5px;
    top:                1px;
    width:              10px;
    height:             16px;
    font-size:          16px;
}


/*------------------------------------------------------------------------*/
/* layout palette                                                         */
/*------------------------------------------------------------------------*/

div.results div.watermark div.layout {
    position:           absolute;
    overflow:           visible;
    top:                4px;
    right:              4px;
}

div.layout {
    width:              256px;
    margin:             0;
    padding:            0 0 8px;
    background-color:   white;
    border:             1px solid #ccc;

    border-radius: 3px; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
 %]
}

div.layout h5 {
    color:              #aaa;
    font-size:          12px;
    font-weight:        normal;
    line-height:        18px;
    margin:             4px 0 2px 12px;
}

html > body div.layout {                 /* IE sucks */

    opacity: 0.7;
    filter: alpha (opacity = 70);

}

html > body div.layout:hover {           /* IE sucks */

    opacity: 1;
    filter: alpha (opacity = 100);

}

ul.layout {
    margin:             4px 0 0 12px;
}

ul.layout li {
    position:           relative;
    overflow:           visible;
    float:              left;
    height:             34px;
    width:              70px;
    margin:             0 12px 0 0;
    padding:            0;
    list-style:         none;
}

ul.layout li.last {
    margin-right:       0;
}

ul.layout li a {
    display:            block;
    height:             28px;
    width:              64px;
    margin:             0;
    padding:            1px;
    border:             1px solid #ccc;
    background:     url('/images/panels/pip_layout.gif') no-repeat 1px 1px;

    border-radius: 1px; 
    -moz-border-radius: 1px; 
    -webkit-border-radius: 1px;
    -khtml-border-radius: 1px;
}

ul.layout li.warm a,
ul.layout li a:hover {
    padding:            1px;
    border:             1px solid #aaa;
}

ul.layout li a.pips3 {
    background-position: 1px 1px;
}

ul.layout li a.pips1 {
    background-position: -79px 1px;
}

ul.layout li a.pipst {
    background-position: -159px 1px;
}

div.pips3 ul.layout li a.pips3,
ul.layout li.warm a.pips3,
ul.layout li a.pips3:hover {
    background-position: 1px -39px;
}

div.pips1 ul.layout li a.pips1,
ul.layout li.warm a.pips1,
ul.layout li a.pips1:hover {
    background-position: -79px -39px;
}

div.pipst ul.layout li a.pipst,
ul.layout li.warm a.pipst,
ul.layout li a.pipst:hover {
    background-position: -159px -39px;
}

ul.layout a.tip:hover span.tip {
    left:               -68px;
    display:            none;              /* off for now */
}

ul.layout a.tip:hover span.tip span.arrow {
    left:               114px;
}



/*------------------------------------------------------------------------*/
/* column headings with sort order indicators                             */
/*------------------------------------------------------------------------*/

table.results,
table.results thead,
table.results tbody {
    width:              100%;
    padding:            0;
}

table.results tbody {
    margin:             0;
    
}

table.results th {
    margin:             0;
    padding:            0;
    line-height:        20px;
    background:         #BBB; 
    border-right:       1px solid #C4C4C4; 
}

table.results th a.order,
table.results th span.static {
    display:            block;
    color:              white;
    font-size:          12px; 
    line-height:        16px;
    padding:            4px 15px 4px 4px;
    margin:             0;
    background-color:   #BBB;
}

table.results th a.order {
    background:         url('/images/arrows/sorting_arrows_CR.gif') no-repeat right 0;
}

table.results th:hover,
table.results th a.order:hover {
    color:              #541C70;
    background-color:   #C4C4C4;
}

table.results th.static:hover {
    background-color:   #BBB;
}



table.results th a.order        { background-position: right -4px }
table.results th a.order:hover  { background-position: right -36px }
table.results th a.down         { background-position: right -68px }
table.results th a.down:hover   { background-position: right -100px }
table.results th a.up           { background-position: right -132px }
table.results th a.up:hover     { background-position: right -164px }

table.results th.up,
table.results th.down {
    background-color:   #AAA;
}

table.results th a.up,
table.results th a.down {
    color:              #444;
}

table.results td  { 
    color:              #333333; 
    background:         #F8F8F8; 
    font-size:          12px; 
    border-right:       1px solid #FFF;
    padding-top:        3px;
    padding-bottom:     3px;
    height:             24px;
}

table.results tr.even td { 
    background:         #E4E4E4;
    border-right:       1px solid #EEE
}

table.results td.last,
table.results th.last { 
    border-right:       0 
}

table.results td.right { 
    text-align:         right;
    padding-right:      0;
    padding-left:       0;
}

table.results td.right a.button { 
    float:              right; 
    margin:             0 
}

table.results td.blank { 
    vertical-align:     top; 
    padding:            0;
}

table.results a.button { 
    margin-top:         0; 
    margin-bottom:      0; 
}

table.results th.blank,
table.results td.blank,
table.results tr.odd td.blank,
table.results tr.even td.blank { 
    background:         none; 
    padding:            0;
}

table.results td.blank .button { 
    margin:             0; 
}


table.results td span.town {
    font-weight:        bold;
}


/*------------------------------------------------------------------------
 * search filters
 *------------------------------------------------------------------------*/

.filter a.filter {
    display: block;
    float: left;
    width: 20px;
    height: 20px;
    border: 0;
    margin-top: 1px;
    background: url('/images/icons/filter_icons.gif') no-repeat left top;
}

.filter a.add {
    background-position: -20px 0;
}

.filter a.zap:hover {
    background-position: 0 -20px;
}

.filter a.add:hover {
    background-position: -20px -20px;
}

.filter div.unused {
    display: none;
}

.filter a.filter span.tip {
    left: 30px;
    top: -1px;
}

.filter a.filter span.tip span.arrow {
    display:            block; 
    position:           absolute;
    top:                5px; 
    left:               -6px;
    width:              6px; 
    height:             10px;
    background:         url('../images/arrows/form_tooltip_left_edge.gif') 
                        no-repeat top left;
}


/*------------------------------------------------------------------------*/
/* section-specific search styles                                         */
/*------------------------------------------------------------------------*/

.user div.paging .control { 
    background-image:   url('/images/arrows/paging_icons_grey.gif');
    background-color:   #d4d4d4;
    border-color:       #888;
    border-color:       #666;
}

.RW   div.paging .control { 
    background-image:   url('/images/arrows/paging_icons_blue.gif');
    background-color:   #50accb;
    border-color:       #036687;
}

.SC   div.paging .control { 
    background-image: url('/images/arrows/paging_icons_red.gif');
    background-color:   #be616c;
    border-color:       #791521;
}

.HS   div.paging .control {
    background-image: url('/images/arrows/paging_icons_yellow.gif');
    background-color: #fbc05f;
/*  border-color:       #FCD28C; */
    border-color:       #BA7B13;
}

.user div.paging .disabled,
.user div.paging .disabled:hover {
    background-color:   #c4c4c4;
    border-color:       #aaa;
    border-color:       #777;
}

.RW   div.paging .disabled,
.RW   div.paging .disabled:hover {
    background-color:   #299abf;
    border-color:       #207895;
}

.SC   div.paging .disabled,
.SC   div.paging .disabled:hover {
    background-color:   #b03f4c;
/*  border-color:       #cc606d; */
    border-color:       #822f38;
}

.HS   div.paging .disabled,
.HS   div.paging .disabled:hover {
    background-color:   #ecb04e;
/*  border-color:       #FCD28C; */
    border-color:       #dc9c35;
}

      div.paging .page_no,
      div.paging .page_no:hover,
.user div.paging .page_no,
.user div.paging .page_no:hover,
.RW   div.paging .page_no,
.RW   div.paging .page_no:hover,
.SC   div.paging .page_no,
.SC   div.paging .page_no:hover,
.HS   div.paging .page_no,
.HS   div.paging .page_no:hover {
    background-image:   none 
}

.user div.paging a.control span.text {
    color:              #555;
}

.RW   div.paging a.control span.text {
    color:              #02445A;
}

.SC   div.paging a.control span.text {
    color:              #510E16;
}

.HS   div.paging a.control span.text {
    color:              #7C520D;
}

.user div.paging a.control:hover,
.user div.paging a.warm,
.RW   div.paging a.control:hover,
.RW   div.paging a.warm,
.SC   div.paging a.control:hover,
.SC   div.paging a.warm,
.HS   div.paging a.control:hover,
.HS   div.paging a.warm {
    background-color:   #f19300;
    border-color:       #a70;
}

.RW   div.paging a.control:hover,
.RW   div.paging a.warm {
    border-color:       #02445A;
}
.SC   div.paging a.control:hover,
.SC   div.paging a.warm {
    border-color:       #510E16;
}
.HS   div.paging a.control:hover,
.HS   div.paging a.warm {
    border-color:       #FDE8C5;
}

.user div.paging a.warm span.text,
.user div.paging a.control:hover span.text,
.RW   div.paging a.warm span.text,
.RW   div.paging a.control:hover span.text,
.SC   div.paging a.warm span.text,
.SC   div.paging a.control:hover span.text,
.HS   div.paging a.warm span.text,
.HS   div.paging a.control:hover span.text {
    color:              white;
}

.SC   div.paging .control:hover span.tip,
.SC   a.tip:hover span.tip {
    background-color:   #E7C6CA;
    border-color:       #B95561;
    color:              #A21D2D;
}

.SC   div.paging .control:hover span.tip span.arrow,
.SC   a.tip:hover span.tip span.arrow {
    background-image:   url('../images/arrows/tooltip_down_SC.gif');
}

.RW   div.paging .control:hover span.tip,
.RW   a.tip:hover span.tip {
    background-color:   #C0E1EC;
    border-color:       #42A5C6;
    color:              #0488B4;
}

.RW   div.paging .control:hover span.tip span.arrow,
.RW   a.tip:hover span.tip span.arrow {
    background-image: url('../images/arrows/tooltip_down_RW.gif');
}

.HS   div.paging .control:hover span.tip,
.HS   a.tip:hover span.tip {
    background-color: #FDE8C5;
    border: 1px solid #FABB53;
    color: #F9A51A;

    background-color: #FEF0D8;
    border: 1px solid #BA7B13;
    color: #BA7B13;
}

.HS   div.paging .control:hover span.tip span.arrow,
.HS   a.tip:hover span.tip span.arrow {
    background-image: url('../images/arrows/tooltip_down_HS2.gif');
}



/*------------------------------------------------------------------------*/
/* fluxbox                                                                */
/*------------------------------------------------------------------------*/

div.fluxbox {
    position: relative; overflow: visible;
    float: left; clear: none;
    z-index: 204;
}

div.fluxbox div.results {
	overflow:auto;
    position: absolute;
    top: 11px; left: 0px;
    max-height: 240px;
    background-color: #f8f8f8;
    z-index: 205;
}

div.fluxbox input.text {
}

div.fluxbox div.result {
    overflow: hidden;
	color:#555;
	height: 16px;
	font-size: 11px;
	line-height: 16px;
	clear:both;
	padding: 2px 4px;
	border: 1px solid #888;
	border-top: 0;
}

div.fluxbox div.result:hover {
    overflow: visible;
}

div.fluxbox div.no_results {
    font-style: italic;
    color: #888;
}

div.fluxbox div.select {
	cursor: pointer;
	color: white;
	background-color: #F3A223;
}

div.fluxbox div.click {
    color: black;
}

div.fluxbox div.result span.match {
	text-decoration:underline;
	color:#000;
	font-weight: bold;
}

div.fluxbox div.select span.match {
	background-color: #F3A223;
}

body.CR div.fluxbox div.result {
	border:1px solid #7E5493;
	border-top: 0;
    background-color: #F0ECF3;
    color: #3F1554;
}
body.CR div.fluxbox div.no_result {
    color: #3F1554;
}
body.CR div.fluxbox div.result span.match {
/*    background-color: #F0ECF3; */
    color: #2A0E38;
}
body.CR div.fluxbox div.select,
body.CR div.fluxbox div.select span.match {
    background-color: #541C70;
    color: white;
}
body.HS div.fluxbox div.result {
	border:1px solid #FABB53;
	border-top: 0;
    background-color: #FEF7EB;
    color: #BA7B13;
}
body.HS div.fluxbox div.no_result {
    color: #BA7B13;
}
body.HS div.fluxbox div.result span.match {
/*    background-color: #FEF7EB; */
    color: #7C520D;
}
body.HS div.fluxbox div.select,
body.HS div.fluxbox div.select span.match {
    background-color: #F9A51A;
    color: white;
}
body.RW div.fluxbox div.result {
	border:1px solid #42A5C6;
	border-top: 0;
    background-color: #EAF5F8;
    color: #036687;
}
body.RW div.fluxbox div.no_result {
    color: #036687;
}
body.RW div.fluxbox div.result span.match {
/*    background-color: #EAF5F8; */
    color: #02445A;
}
body.RW div.fluxbox div.select,
body.RW div.fluxbox div.select span.match {
    background-color: #0488B4;
    color: white;
}
body.SC div.fluxbox div.result {
	border:1px solid #B95561;
	border-top: 0;
    background-color: #F7ECED;
    color: #791521;
}
body.SC div.fluxbox div.no_result {
    color: #791521;
}
body.SC div.fluxbox div.result span.match {
/*    background-color: #F7ECED; */
    color: #510E16;
}
body.SC div.fluxbox div.select,
body.SC div.fluxbox div.select span.match {
    background-color: #A21D2D;
    color: white;
}

/*------------------------------------------------------------------------*/
/* property info panels - generic styles                                  */
/*------------------------------------------------------------------------*/

div.pip {
    position:           relative;
    float:              left; 
    padding-bottom:     28px;
    width:              798px;
    margin-bottom:      10px;
    min-height:         61px;
    border:             1px solid #ccc;
    background:         #f0f0f0 url('/images/panels/cr_info_panel_800x600.gif') 
                        no-repeat right bottom;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;

}

div.pip h2,
div.pip h3,
div.pip h4,
div.pip h5,
div.pip h5 {
    font-weight:        normal;
    margin:             0;
    color:              #444;
}

div.pip h3 a {
    color:              #666;
}

div.pip h2 {
    font-size:          14px;
    line-height:        18px;
}

div.pip h3,
div.pip h4,
div.pip h5,
div.pip h3,
div.pip h4 a,
div.pip h5 a {
    font-size:          12px;
    line-height:        16px;
    color:              #888;
}

div.pip h5,
div.pip h5 a {
    font-weight:        bold;
    color:              #888;
}

div.pip .thumbnail {
    position:           absolute;
    top:                4px;
    left:               4px;
    width:              64px;
    height:             48px;
    background-color:   white;
    padding:            2px;
    border:             1px solid #ccc;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;

}

div.pip div.address {                        /* TODO */
    margin:             4px 28px 5px 78px;
}

div.pip .postcode,
div.pip .town {
    position:           absolute;
    overflow:           hidden;
    bottom:             2px;
    height:             22px;
    font-size:          14px;
    line-height:        22px;
    color:              #555;
    font-weight:        normal;
    margin:             0;
    padding:            0;
}

div.pip .town a {
    color:              #555;
    font-weight:        normal;
    font-size:          14px;
    line-height:        22px;
}

div.pip .postcode {
    font-size:          14px;
    line-height:        24px;
    color:              #777;
    font-style:         normal;
}

div.pip .caticon {
    position:           absolute;
    bottom:             3px;
    right:              3px;
    width:              18px;
    height:             16px;
    background:         url('/images/icons/property/category_icons_18x20.gif') 
                        no-repeat right 0;
    border: 1px solid #444;

    border-radius: 2px; 
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
}

div.HS .caticon {
    border-color:       #7C520D;
    background-color:   #F9A51A;
    background-position: right -2px;
}

div.SC .caticon {
    border-color:       #510E16;
    background-color:   #A21D2D;
    background-position: right -22px;
}

div.RW .caticon {
    border-color:       #02445A;
    background-color:   #0488B4;
    background-position: right -42px;
}

div.pip .caticon:hover,
div.HS .caticon:hover,
div.RW .caticon:hover,
div.SC .caticon:hover {
    background-color: #f19300;
    border-color: #AA7700;
}

div.HS .caticon:hover {
    background-position: right -62px;
}

div.SC .caticon:hover {
    background-position: right -82px;
}

div.RW .caticon:hover {
    background-position: right -102px;
}

div.pip .caticon span.hint {
    display: none;
}


div.pip span.availability {
    position:           absolute;
    text-align:         right;
    bottom:             3px;
    right:              3px;
    width:              150px;
    font-size:          12px;
    line-height:        16px;
    height:             16px;
    color:              #aaa;
}

div.pip span.tenant {
    display: none;
}

div.pip div.status {                        /* TODO */
    position:           absolute;
    bottom:             2px;
    left:               6px;
    width:              210px;
    height:             22px;
    line-height:        22px;
    overflow:           hidden;
}


/*------------------------------------------------------------------------*/
/* pips1 - one panel per row                                              */
/*------------------------------------------------------------------------*/

div.pips1 div.items {
    padding-top: 5px;
}

div.pips1 div.pip {
    background-image:   url('/images/panels/cr_panel_800x200_plain.gif');
    min-height:         60px;
    padding-bottom:     2px;
    margin-bottom:      5px;
}

div.pips1 div.selected {
    background-image:   url('/images/panels/cr_panel_800x200_green.gif');
}

div.pips1 div.pip .location,
div.pips1 div.pip .location a {
    font-size:          14px;
    line-height:        18px;
}

div.pips1 div.pip .postcode {
    font-size:          14px;
    line-height:        22px;
}

div.pips1 div.pip .town {
    right:              124px;
    top:                1px;
    width:              200px;
    text-align: right;
}

div.pips1 div.pip .town a {
    font-size:          16px;
}

div.pips1 div.pip .postcode {
    text-align:         right;
    right:              124px;
    width:              162px;
    top:                22px;
    bottom:             auto;
}

div.pips1 div.pip .availability {
    right:              124px;
    font-size:          14px;
}

div.pips1 div.pip .name {
    width: 150px;
}

div.pips1 div.pip span.tenant {
    display:            block;
    position:           absolute;
    text-align:         left;
    bottom:                4px;
    left:               450px; 
/*    right:               170px;
    text-align: right; */
    width:              160px;
    font-size:          12px;
    line-height:        14px;
    height:             14px;
    color:              #aaa;
}


div.pips1 div.pip span.availability span.tenant {
    display: inline;
}

div.pips1 div.pip h5.postcode {
/*    padding-left: 20px; */
}

div.pips1 div.actions {
/*    width: 220px; */
}

div.pips1 div.actions a {
    width:              100px;
    padding-right:      8px;
}

div.pips1 div.actions a span.hint {
    display:            inline;
}

div.pips1 div.actions a,
div.pips1 div.actions a:hover {
/*    clear:              none; */
    margin-left: 4px;
}

div.pips1 div.pip .caticon {
    width: 108px;
    text-align: center;
    background-image: none;
}

div.pips1 div.pip .caticon span.hint {
    display: inline; 
    font-size: 10px;
    line-height: 10px;
    color: #eee;
    text-align: center;
    width: 105px;
}

/*------------------------------------------------------------------------*/
/* pip3 - 3 column layout                                                 */
/*------------------------------------------------------------------------*/

div.pips3 div.items {
    padding-top: 10px;
}

div.pips3 div.pip {
    margin-right:       10px;
    width:              258px;
    min-height:         61px;
    background-image:   url('/images/panels/cr_info_panel_260.gif');
    background-position: left bottom;
}

div.pips3 div.third {
    margin-right:       0px;
}

div.pips3 div.pip:hover {
    background-position: -258px bottom;
    border-color:       #bbb;
}

div.pips3 div.selected {
    background-image:   url('/images/panels/cr_info_panel_260_green.gif');
    border-color:       #b6cba0;
}

div.pips3 div.selected:hover {
    border-color:       #7ca84c;
}

div.pips3 div.pip .street {
    display:            none;
}

div.pips3 div.pip .town {
    left:               6px;
    width:              160px;
}

div.pips3 div.pip .postcode {
    text-align:         right;
    right:              4px;            /* TODO */
    right:              30px;
    width:              86px;
}

div.pips3 div.pip .availability {
    bottom:             30px;
    font-size:          12px;
}

div.pips3 div.pip .caticon {
}

div.pips3 div.selected .town,
div.pips3 div.selected .town a,
div.pips3 div.selected .postcode {
    color: #4c6433;
}


/*------------------------------------------------------------------------*/
/* table-like layout                                                      */
/*------------------------------------------------------------------------*/

div.results div.pipst div.items {
    padding: 1px 0 0 0;
}

div.pipst div.pip {
    background-image: none;
    border:             0;
    padding:            2px 0 0;
    margin:             0 0 1px 0;
    min-height:         20px;

    border-radius: 0; 
    -moz-border-radius: 0; 
    -webkit-border-radius: 0;
    -khtml-border-radius: 0;
;
}

div.pipst div.odd {
    background-color:   #F8F8F8; 
}

div.pipst div.odd:hover {
    background-color:   #FCFCFC; 
}

div.pipst div.even {
    background-color:   #E4E4E4;
}
div.pipst div.even:hover {
    background-color:   #ECECEC;
}

div.pipst div.pip .thumbnail {
    display: none;
}

div.pipst div.pip div.address {
    margin: 0 0 0 30px;
}

div.pipst div.pip div.address .name,
div.pipst div.pip div.address .location,
div.pipst div.pip div.address .street,
div.pipst div.pip div.address .town,
div.pipst div.pip div.address .postcode {
    position: relative;
    top: 0;
    left: 0;
    bottom: auto;
    float: left;
    padding: 0px 5px 0 2px;
    font-size: 12px;
    line-height: 20px;
    min-height: 20px;
/*    overflow: visible; */
/*    border: 1px solid red; */
}

div.pipst div.pip div.address .town a {
    font-size: 12px;
    line-height: 20px;
    font-weight: bold;
}

div.pipst div.pip div.address .name {
    width: 56px;
}

div.pipst div.pip div.address .location,
div.pipst div.pip div.address .location a {
    font-weight: bold;
}

div.pipst div.pip div.address .location,
div.pipst div.pip div.address .street {
    width: 196px;
}

div.pipst div.pip div.address .town {
    width: 146px;
    font-weight: bold;
}

div.pipst div.pip div.address .postcode {
    width: 96px;
}

div.pipst div.pip div.actions {
    width: 50px;
}

div.pipst div.pip div.actions a {
    float: left;
    clear: none;
    margin-left: 5px;
}

div.pipst div.pip span.availability {
    display: none;
}

div.pipst div.pip .caticon {
    position:           absolute;
    top:                3px;
    left:               3px;
    bottom:             auto;
    right:              auto;
}

div.pipst div.actions a:hover {
    width:              18px;
    padding-right: 0;
}

div.pipst div.actions a span.hint {
    display: none;
}

div.pipst div.selected {
    background-color: #DFF2BF;
}
div.pipst div.selected.even {
    background-color: #CFE2AF;
}
div.pipst div.selected:hover,
div.pipst div.selected.even:hover {
    background-color: #EFF2CF;
/*FEEFB3 */
}

div.pipst div.selected .location,
div.pipst div.selected .location a,
div.pipst div.selected .street,
div.pipst div.selected .postcode {
    color: #4F8A10;
}

div.pipst div.selected .name,
div.pipst div.selected .town,
div.pipst div.selected .town a {
    color: #3F7A00;
}

div.pips1 div.pip .location a:hover,
div.pips1 div.selected .location a:hover,
div.pips1 div.pip .town a:hover,
div.pips1 div.selected .town a:hover,
div.pips3 div.pip .location a:hover,
div.pips3 div.selected .location a:hover,
div.pips3 div.pip .town a:hover,
div.pips3 div.selected .town a:hover,
div.pipst div.pip .location a:hover,
div.pipst div.selected .location a:hover,
div.pipst div.pip .town a:hover,
div.pipst div.selected .town a:hover {
    color: #F3A223;
    cursor: pointer;
}

div.pip span.to_let {
    color:              #666;
    font-weight:        bold;
}








/*------------------------------------------------------------------------*/
/* property actions - TODO: move this somewhere more generic              */
/*------------------------------------------------------------------------*/

div.pip div.actions  {
    position:           absolute;
    top:                3px;
    right:              3px;
}

div.pip div.actions > a {           /* hidden from IE... */

    opacity: 0.5;
    filter: alpha (opacity = 50);
}

div.pip:hover div.actions a {       /* ...because it is shit */

    opacity: 0.8;
    filter: alpha (opacity = 80);

}

div.pip div.actions a:hover {

    opacity: 0.9;
    filter: alpha (opacity = 90);
}

div.pip div.actions a.select,
div.pip div.actions a.unselect {
    display: none;
}

div.selectable div.actions a.select,
div.selected div.actions a.unselect {
    display: block;
}



/*------------------------------------------------------------------------*/
/* misc property styles                                                   */
/*------------------------------------------------------------------------*/

table.accommodation thead tr td { 
    background-color: white;
    color: #333;
    font-size: 12px;
    font-weight: bold;
    border-right: 0;
}

table.accommodation tbody tr.even td,
table.accommodation tbody tr.even th { background:#F0F0F0; }
table.accommodation tbody tr.odd td,
table.accommodation tbody tr.odd th { background:#CCCCCC; }
table.accommodation tbody tr th { 
    color: #444; font-size: 14px; font-weight:bold;padding-left:10px;
} 
table.accommodation tbody tr td { 
    color: #444;
    padding-left:10px; height:25px; 
    vertical-align:middle;font-weight:bold;
}
table.accommodation tr td.name {width:200px;}
table.accommodation tr td.size {width:120px; text-align: right}
table.accommodation tr td.view {width:90px}
table.brochures     tr td.pdf  {width:40px;}
table.accommodation tfoot tr td { 
    background:#666666;color:#fff;border-top:#fff 3px solid;
    font-weight: bold;
    padding: 5px;
}



body.CR div#content div.property_details h2,
body div#content div.preview_CR div.property_details h2 { color: #541C70 }
body.CR div#content div.ruled,
body div#content div.preview_CR div.ruled { 
    border: 1px solid #541C70;
    border-left: 0; border-right: 0; 
}
body.CR div#content div#overview table.accommodation tr th,
body div#content div.preview_CR div#overview table.accommodation tr th { 
    color: #541C70;
    background-color: white;
}

body.HS div#content div.property_details h2,
body div#content div.preview_HS div.property_details h2 { color: #F9A51A }
body.HS div#content div.ruled,
body div#content div.preview_HS div.ruled { 
    border: 1px solid #F9A51A;
    border-left: 0; border-right: 0; 
}
body.HS div#content div#overview table.accommodation tr th,
body div#content div.preview_HS div#overview table.accommodation tr th { 
    color: #F9A51A;
    background-color: white;
}

body.RW div#content div.property_details h2,
body div#content div.preview_RW div.property_details h2 { color: #0488B4 }
body.RW div#content div.ruled,
body div#content div.preview_RW div.ruled { 
    border: 1px solid #0488B4;
    border-left: 0; border-right: 0; 
}
body.RW div#content div#overview table.accommodation tr th,
body div#content div.preview_RW div#overview table.accommodation tr th { 
    color: #0488B4;
    background-color: white;
}

body.SC div#content div.property_details h2,
body div#content div.preview_SC div.property_details h2 { color: #A21D2D }
body.SC div#content div.ruled,
body div#content div.preview_SC div.ruled { 
    border: 1px solid #A21D2D;
    border-left: 0; border-right: 0; 
}
body.SC div#content div#overview table.accommodation tr th,
body div#content div.preview_SC div#overview table.accommodation tr th { 
    color: #A21D2D;
    background-color: white;
}


div.property_details div.property_feature {
    clear: both; display: block;
    margin: 10px 0 0 0;
    font-size: 14px;
}

div.property_details div.half,
#body.sidebar_left div.property_details div.half {
    display: block; float: left; clear: none;
    width: 225px;
    margin: 0 5px 0 0;
}

div.property_details div.last,
#body.sidebar_left div.property_details div.last {
    margin-right: 0;
}

div.property_details div.half span.rvalue {
    float: left;
    width: 90px;
    text-align: right;
}

div.property_details div.property_feature p.value {
    width: 440px;
}

div.property_details div.half p.value {
    width: 210px;
}

div.property_details div.ruled {
    width: 440px;
    padding-bottom: 10px;
}

div.property_feature h4.label {
    clear: both; float: none; 
    margin:10px 0 0; 
    font-size: 14px;
    line-height: 18px;
    color: #666;
}

div.property_details img {
    clear:both; float:none; margin:0px;
}

div.property_details a.thumbnail {
    cursor: pointer;
}

p.misreps {
    clear:both; font-size:9px; font-style:italic;
    line-height:10px; padding-top:25px;
}

div.disposals {
}

div#content div.disposals h3.title {
    padding-top: 5px;
    margin: 40px 0 2px 0;
    font-size: 14px;
    font-weight: normal;
}

div#content div.disposal h4.name {
    font-size: 14px;
    color: #444;
}

div#content div.disposal p {
    font-size: 12px;
    color: #888;
}

div#content div.disposal div.agents h5 {
    color: #888;
}

div.epc_chart {
    position:           relative;
    width:              340px;
    height:             315px;
    float:              left;
    margin:             10px 0 5px;
    background:         url('/images/property/epc_eer_background.gif')
                        no-repeat top left;
}

div.field div.epc_chart {
    margin:             5px 0 0;
}

div.epc_chart div.range {
    position:           absolute;
    top:                60px;
    width:              45px;
    height:             225px;
}

div.epc_chart div.range div.slider {
    position:           relative;
    width:              45px;
    height:             20px;
    background:         url('/images/property/epc_eer_arrows.gif')
                        no-repeat 0 0;
}

div.epc_chart div.range div.bandA { background-position: 0  -30px; }
div.epc_chart div.range div.bandB { background-position: 0  -60px; }
div.epc_chart div.range div.bandC { background-position: 0  -90px; }
div.epc_chart div.range div.bandD { background-position: 0 -120px; }
div.epc_chart div.range div.bandE { background-position: 0 -150px; }
div.epc_chart div.range div.bandF { background-position: 0 -180px; }
div.epc_chart div.range div.bandG { background-position: 0 -210px; }

div.field div.epc_chart div.range div.slider { background-position: -50px    0px; }
div.field div.epc_chart div.range div.bandA  { background-position: -50px  -30px; }
div.field div.epc_chart div.range div.bandB  { background-position: -50px  -60px; }
div.field div.epc_chart div.range div.bandC  { background-position: -50px  -90px; }
div.field div.epc_chart div.range div.bandD  { background-position: -50px -120px; }
div.field div.epc_chart div.range div.bandE  { background-position: -50px -150px; }
div.field div.epc_chart div.range div.bandF  { background-position: -50px -180px; }
div.field div.epc_chart div.range div.bandG  { background-position: -50px -210px; }


div.epc_chart div.range div.slider input {
    border:             0;
    float:              right;
    width:              25px;
    height:             16px;
    margin:             2px;
    padding:            0;
    text-align:         right;
    font-size:          14px;
    line-height:        14px;
    color:              white;
    font-weight:        bold;
    background-color: transparent;
}

div.epc_chart div.range div.slider input:focus {
}

div.epc_chart div.current {
    left:               235px;
}

div.epc_chart div.potential {
    left:               290px;
}

div.epc_eir {
    background-image:   url('/images/property/epc_eir_background.gif');
}

div.epc_eir div.range div.slider {
    background-image:   url('/images/property/epc_eir_arrows.gif');
}

/* created/modified timestamps */
div.timestamps {
    margin-top:         40px;
    clear:              both;
    background-color:   #eee;
    border:             1px solid #ddd;
    padding:            5px;
    font-size:          11px;
    color:              #888;
}

div.timestamps span.created {
    color: #666;
}

div.timestamps span.modified {
    color: #666;
}

div.timestamps span.time,
div.timestamps span.date {
    font-weight: bold;
}
/*------------------------------------------------------------------------*/
/* css/adverts - styling for banners,adverts, etc.                        */
/*------------------------------------------------------------------------*/

/* CR banners in left sidebar */
ul.cr_banners                   { margin-top: 35px; float: none; clear: both; list-style: none }
ul.cr_banners li                { float: none; clear: both; margin: 6px 0 0 0 }
ul.cr_banners li a,
ul.cr_banners li a:link,
ul.cr_banners li a:visited      { background:none; padding: 0 }
ul.cr_banners li a span         { font-size:11px; color:#4d4d4d; margin:0 0 1px 0; width: 130px; font-weight:normal; }
ul.cr_banners li a img          { display: block; clear: both; float: none; }
ul.cr_banners li img.cr_banner  { width:150px; height:29px; padding-top: 2px; border-top:4px solid #EF9528; margin: 0;  }
ul.cr_banners li img.missing    { width:150px; height:70px; margin:10px 0 0 0; }

/* advertising banners in right sidebar */

div.banners {
    margin: 0; padding: 0;
}

div#col_1 div.banners { width: 140px; }
div#col_2 div.banners { width: 440px; }
div#col_3 div.banners { width: 310px; }

div.banners a {
    clear: none; float: left; display: block;
    margin: 0 0 10px 0;
    padding: 0;
}

div.banners a.small {
    width: 150px; height: 70px;
    margin-right: 9px;
}

div.banners a.last {
    margin-right: 0;
}

div.banners a.wide {
    width: 310px; height: 70px;
}

div.banners a.wide_plus {
    width: 310px; height: 98px;
}

div.banners a img { 
    margin: 0; padding: 0; border: 0;
}

/*------------------------------------------------------------------------*/
/* help tip                                                               */
/*------------------------------------------------------------------------*/

#body .help_tip {
    display: inline-block;
    margin: 0 2px 0 3px;
    height: 20px;
    line-height: 20px;
    padding: 0 0 0 20px;
    background: url(/images/icons/help/question_blue.gif) no-repeat left top;
    color: #0488B4;
}

#body a.help_tip:hover {
    background-position: left -20px;
    color: #9354A1;
}

/* moved to search.css 
span.tip {
    display:            none;
    position:           relative;
    overflow:           visible;
    background-color:   #FFA;
    border:             1px solid #ba6d10;
    color:              #ba6d10;
    padding:            5px 6px;
    width:              180px;
    top:                -2px;
    left:               -199px;
    font-size:          12px;
    line-height:        16px;
    z-index:            211;

    border-radius: 3px; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;


    opacity: 0.9;
    filter: alpha (opacity = 90);

}

a.tip:hover .tip {
    display:            block;
}

a.tip:hover .tip span.arrow {
    display:            block; 
    position:           absolute;
    top:                6px; 
    left:               -6px;
    width:              6px; 
    height:             10px;
    background:         url('/images/arrows/form_tooltip_left_edge.gif')
                        no-repeat top left;
}
*/

/*------------------------------------------------------------------------*/
/* help overlay                                                           */
/*------------------------------------------------------------------------*/

#blackout { 
    display:none;  
    position: fixed; 
    z-index: 2000; 
    top: 0px; left: 0px; 
    height:100%; width:100%; 
    background-image:url(/images/misc/blackout.png);
    
    opacity: 0.60;
    filter: alpha (opacity = 30);
}

#loading {
    display: none;
    position: fixed; z-index: 1001; 
    width: 32px; height: 32px;
    top: 300px; left: 50%; 
    margin: 0 0 0 -16px;
    background: transparent url('/images/icons/help_loading.gif') no-repeat top left;
}

#overlay { 
    display:none;  
    position: fixed; z-index: 2001; 
    width: 700px; 
    top: 20%; left: 50%; 
    margin: 0 0 0 -350px;
    text-align:left; 
    background: #000; padding: 20px;
    border: 1px solid #888;
    padding: 21px;
}

#overlay_content {
    background: #FFF; color:#444; 
    text-align:left; 
    padding: 10px 20px 20px 20px;
    max-height: 400px;
    overflow-y: auto; 
}

#overlay span.hint {
    display: block;
    position: absolute;
    top: 2px; right: 24px;
    width: 200px; height: 16px;
    font-size: 10px; color: #aaa;
    text-align: right;
}

#overlay span.hint code {
    font-size: 10px;
    color: #BA7B13;
}

#overlay a.close {
    display: block;
    overflow: hidden;
    position: absolute;
    top: 2px; right: 2px;
    width: 15px;
    height: 15px;
    background: #444 url('/images/arrows/cross.gif') no-repeat -2px -13px;
    border: 1px solid #888;
}

#overlay a.close:hover {
    background-color: #666;
    border: 1px solid #ccc;
}

#help {
    background: url('/images/icons/help/question_large.gif') no-repeat top left;
    padding: 0 0 0 30px;
}

#help h1 {
    font-size: 18px;
    line-height: 24px;
    color: #F9A51A;
}

#help h4 {
    margin: 5px 0 -5px -25px;
}

#help p {
    margin: 10px 0;
    font-size: 14px;
    line-height: 20px;
}

#help ul li {
    font-size: 14px;
    line-height: 20px;
}

#help code {
    color: #0488B4;
}


/* debugging */

div.debug {
     display: none;
     margin: 10px;
}

#debugger {
    clear: both;
    margin: 10px 0 0 0;
    padding: 10px;
    border: 1px solid #ccc;
    background-color: #eee;
    overflow: auto;
}

.debug_on, 
body .debug, 
body.debugging .debug_off {
    display: none;
}

body.debugging .debug,
body.debugging .debug_on {
    display: block;
    color: #666666;
}

body.debugging .debug * {
    color: #666666;
}

body.debugging span.debug,
body.debugging span.debug_on {
    display: inline;
    color: #666666;
}

a.debug_switch {
    color: #7E5493;
}

a.debug_switch:hover {
    color: #F3A223;
}

a.debug_switch span.debug_on {
    color: green;
}

a.debug_switch span.debug_off {
    color: red;
}

body.debugging #body {
    background: url('../images/backgrounds/grid_h.gif') repeat top left;
}

body.debugging #content {
    background: url('../images/backgrounds/grid_hv.gif') repeat top left;
}

body.debugging .redline   { border: 1px solid red   }
body.debugging .blueline  { border: 1px solid blue  }
body.debugging .greenline { border: 1px solid green }
body.debugging .redback   { background-color: #faa  }
body.debugging .greenback { background-color: #afa  }
body.debugging .blueback  { background-color: #aaf  }


/*------------------------------------------------------------------------*/
/* form debugging                                                         */
/*------------------------------------------------------------------------*/

body.debugging form.debuggable {
    background-color: #FDF;
}

body.debugging form.grid div.field {
    background-color: #DDF;
    opacity: 0.4; 
}

body.debugging form.grid div.field label {
    background-color: #FFC;
    opacity: 0.8;
}