/*
 * General
 */
*,* html {
    border: 0px;
    margin: 0px;
    padding: 0px;
}

body {
    background: white;
    font-weight: normal;
    color: #293C29;
    padding-left: 0px;
    padding-right: 0px;
    text-align: center;
}

body * {
    text-align: left;
}

#bodywrapouter {
    margin: auto;
}

#bodywrap {
    border: 3px solid white;
    margin: auto;
    width: 99%; /* Needed to fix IE issue where border is off to right hand edge. */
}

div#banner {
    /* Make menu container relative so we can use absolute position on menu to align it to bottom of banner. */
    position: relative;
    border-bottom: 0px solid #408040;
    background: #f0f0f0
}

div#logotext {
    position: relative;
    top: 0px;
    left: 4px;
    font-size: 22pt;
    font-weight: bold;
}

span#tagline {
    position: relative;
    top: 3px;
    left: 5px;
    font-size: 14pt;
    font-style: italic;
    color: #a0a0a0;
}

table#main {
    width: 100%;
    height: 400px;
}

td#mainlefttd, td#mainmiddletd, td#mainrighttd {
    vertical-align: top;
    padding-bottom: 10px;
}

td#mainlefttd {
    padding-top: 3px;
    width: 130px;
    background: #f0f0f0
}

td#mainrighttd {
    padding: 0px;
    padding-top: 10px;
    padding-left: 0px;
    width: 146px;
}


td#mainrighttd * {
/*   overflow:hidden; Makes ads invisible in IE! */
}

td#mainmiddletd {
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
}

.clear {
    clear: both;
}

.center {
    text-align: center ! important;
    margin-left: auto ! important;
    margin-right: auto ! important;
}

/*
 * Normal font
 */

body, td {
    font-family: Trebuchet MS, arial;
    font-size: 10pt;
}

/*
 * Paragraphs and headings.
 */

p {
    margin-left: 0px;
    margin-right: 5px;
    margin-bottom: 5px;
    padding-top: 5px; /* Had to go with padding rather than margin for 3 column div layout otherwise left column gets pushed down. */
    text-align: left;
}

/* Hides from IE5-mac \*/
* html p {height: 1%;}
/* End hide from IE5-mac */ 

p.add-info,
p.add-info-inline,
p.add-info-obvious,
p.add-info-center,
span.add-info {
/*    font-style: italic;*/ /* Caused weird IE bug where text would get large top margin/padding or act as if clear:both used on it - not sure which */
    color: #000088;
}

p.add-info-obvious {
    color: #aa0000;
}

p.add-info-center {
    text-align: center;
}

div.add-info {
    border: 1px solid gray;
    background: #F8F8FD; /* Duplicates viewlet if add-info div used within a viewlet */
    /*background: #e0e0e0;*/
    padding: 3px;
    padding-bottom: 5px;
    padding-left: 6px;
    margin: 0px;
    margin-bottom: 5px;
}

p.promo {
    font-size: 11pt;
    text-align: center;
}

span.grey-out {
    color: #888888;
}

span.de-emph, div.de-emph, p.de-emph {
    color: #666666;
    font-size: 9pt;
}
    
span.obvious {
    /*font-style: italic;*/
    color: #aa0000;
}

span.inc-line-height {
    line-height: 250%;
}

span.pending-approval {
    color: #aa7a00;
}

span.declined-approval {
    color: #aa0000;
}

span.approved {
    color: #00aa00;
}

h2,h3,h4,h5 {
    cursor: default;
    text-align: left;
/*    height: 1%;*/
}

h2 {
    margin-top: 0px;
    margin-bottom: 5px;
    font-size: 11pt;
    color: #000000;
}

h3 {
    font-size: 10pt;
    letter-spacing: 2pt;
    margin-bottom: 5px;
    border-bottom: 1px solid #d0d0d0;
    /* margin-bottom: 10px; /* Causes bug in Opera, but IE squashes stuff without it */
}

h4 {
    font-size: 10pt;
    margin-top: 3px;
    margin-bottom: 3px;
}

div#sign-up-state {
    background: #666666;
}

/*
 * Forms
 */
form {
    margin-top: 10px;
}

input, textarea {
    border: 1px solid gray;
    padding: 2px;
}

input.button {
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    border: 3px outset;
    padding: 1px;
}

input.checkbox,
input.radio {
    border: 0px;
}

textarea {
    behavior: url(/res/css1_0/maxlength.htc) /* http://www.siteexperts.com/ie5/htc/ts08/page1.asp */
}

select {
    border: 1px solid gray;
}

.form-input-name, .form-input-name-small {
}

.form-input-name-small {
    color: #668866;
    font-weight: bold;
    font-size: 9pt;
}

.form-view-name {
    font-weight: bold;
    color: #668866;
    font-size: 9pt;
}

.form-view-field {
}

td.form-view-name, td.form-view-field {
    border-top: 1px solid #e5e5e5;
}

td.row-divider {
    height: 1px;
    background: url(/images/row_divider.gif) repeat-x;
}

.forminput {
    padding-top: 5px;
}    

.prettylinkwrap {
    float: left;
    text-align: center ! important;
}

span.form-error, div.form-errors {
    color: #aa0000;
    font-weight: bold;
}

div#pw-strength {
    font-weight: bold;
    padding-bottom: 1px;
    text-align: center ! important;
    color: #e0e0e0;
    font-size: 9pt;
    width: 110px;
}

/*
 * Links
 */
a,
a:visited {
    text-decoration: underline;
    color: #404080;
    font-weight: bold;
}

a:hover {
    text-decoration: none;
    color: #c00080;
}

a.imagelink, a.imagelink:visited, a.imagelink:hover,
a.divlink, a.divlink:visited, a.divlink:hover {
    text-decoration: none;
    color: #293C29;
}

a.smalllink, span.disabled-small-link {
    font-size: 9pt;
}

div#logotext a {
    text-decoration: none;
    color: #606080;
}

span.disabled-small-link, span.disable-link {
    color: gray;
}

/* Bubble gum links */

table.link {
    margin-right: 6px;
    display: inline ! important; /* CSS1 - should really be using inline-table but this doesn't work for FF & IE */
}

/* Hide this from IE coz although it doesn't support inline-table it tries to do something with this. */
html>body table.link {
    display: inline-table ! important;
}

table.link, table.link td {
    border: 0px ! important;
    padding-top: 0px ! important;
    padding-bottom: 0px ! important;
    padding-left: 0px ! important;
    padding-right: 0px ! important;
    text-align: center ! important;
}

td.linkt, td.linkb {
    padding: 0px ! important;
    height: 4px ! important;
}

td.linktl, td.linktr {
    padding: 0px ! important;
    width: 4px ! important;
}

td.linktl {
    background-image: url(/images/tl4x4.gif) ! important;
    background-repeat: no-repeat ! important;
}

td.linktr {
    background-image: url(/images/tr4x4.gif) ! important;
    background-repeat: no-repeat ! important;
}

td.linkbl {
    background-image: url(/images/bl4x4.gif) ! important;
    background-repeat: no-repeat ! important;
}

td.linkbr {
    background-image: url(/images/br4x4.gif) ! important;
    background-repeat: no-repeat ! important;
}

td.linkt {
    background-image: url(/images/ld1x4.gif) ! important;
    background-repeat: repeat-x ! important;
}

td.linkb {
    background-image: url(/images/dl1x4.gif) ! important;
    background-repeat: repeat-x ! important;
}

td.linkl {
    background-image: url(/images/ld4x1.gif) ! important;
    background-repeat: repeat-y ! important;
}

td.linkr {
    background-image: url(/images/dl4x1.gif) ! important;
    background-repeat: repeat-y ! important;
}

td.link2l, td.link2r {
    width: 10px;
    height: 24px;
}

td.link2l {
    background-image: url(/images/lh10x24.gif) ! important;
    background-repeat: no-repeat ! important;
}

td.link2r {
    background-image: url(/images/rh10x24.gif) ! important;
    background-repeat: no-repeat ! important;
}

td.link2m {
    background-repeat: repeat-x ! important;
    vertical-align: middle ! important;
    background-color: #9c9ad2;
    background-image: url(/images/fade1x24.gif) ! important;
}

td.link2m a {
    display: block;
    color: #000000 ! important;
    text-decoration: none ! important;
}

table.link td.linkm {
    background: #406040 ! important;
    color: #f0f0f0;
    font-weight: bold ! important;
    padding: 0px ! important;
    padding-left: 4px ! important;
    padding-right: 4px ! important;
}

table.link td.linkm a:hover {
    color: #a0c0a0 ! important;
}

table.link input {
    display: block;
    border: 0px ! important;
    padding: 0px ! important;
    margin: 0px ! important;
    background: none ! important;
    font-weight: bold ! important;
    text-align: center ! important;
}

table.link td.linkm input {
    color: #f0f0f0 ! important;
}
    
table.link input:hover {
    cursor: hand;
    cursor: pointer;
}

table.link td.linkm input:hover {
    color: #a0c0a0 ! important;
}

/*
 * Tables used for lists.
 */
table.list {
    background: #CCCCCC;
/*    width: 100%;*/
}

table.list tr.first-row {
}
    
table.list td.first-cell {
}

tr.first-row td {
    padding-top: 1px;
    padding-bottom: 1px;
    font-weight: bold;
    border: 0px dotted gray;
    background: #8398c5;
    color: #f0f0f0;
}

/*
 * Standard unordered list.
 */
ul.list
{
    margin-top: 15px;
    margin-left: 40px;
    margin-right: 40px;
    margin-bottom: 15px;
}

ul.list li, li.list
{
    list-style-image: url('/images/list_bullet.gif');
    cursor: default;
    margin-bottom: 7px;
}

ul.simple-list {
    margin-left: 40px;
}

ul.simple-list li {
    list-style-type: decimal;
    list-style-image: none;
    margin-top: 3px;
    margin-bottom: 0px;
}

li {
    text-align: left;
}

/*
 * Profiles.
 */
tr.profile-haves td.form-input-name {
    background: #f0f0f0;
    font-weight: bold;
/*    text-decoration:underline;*/
}

tr.profile-wants td.form-input-name {
    background: #f0f0f0;
    font-weight: bold;
}

td.profile-wants,
td.profile-haves {
/*    padding: 10px 0px 0px 4px;*/ /* TODO - doesn't work... (in IE ??) */
    font-weight: bold;
    letter-spacing: 0pt;
}

td.profile-section-title {
    font-weight: bold;
    font-size: 130%;
    letter-spacing: 0pt;
    text-align:center;
    background: #ccccff;

}

span.view-attr {
    font-weight: bold;
    
}

div.pagenav {
    margin-bottom: 10px;
}

/*
 * Viewlets
 */
div.viewlet, div.viewlet-form {
    margin: 0px;
    margin-bottom: 5px;
    padding: 5px;
    padding-left: 0px;
    padding-top: 0px;
    background: white;
}

div.viewlet-form {
    padding: 5px;
    background: #f4f4ff;
}

div.viewlet#mainrightcontent {
    background: none;
}

/* Holly Hack.  Peek-a-boo bug fix - occurs when something containing a floated element touches a following
 * element that has 'clear' applied to it.  http://www.communitymx.com/content/article.cfm?page=2&cid=C37E0
 * Has the '* html' hack to hide from non-IE/Win browsers as well as the MAC hack.
 */ 
/* Hides from IE5-mac \*/
* html div.viewlet { height: 1%; }
* html div.viewlet-form { height: 1%; }
* html div.add-info { height: 1%; }
* html .mandatory { height: 1%; }
/* End hide from IE5-mac */ 

/*
 * Fancy tile
 */
/* Hides from IE5-mac \*/
* html div.fancytile {height: 1%;}
/* End hide from IE5-mac */ 

div.boxtitlebar {
}

td.topleft, td.topright {
    width: 10px;
}

td.topleft {
    background: url(/images/topleft.gif) no-repeat;
}

td.topright {
    background: url(/images/topright.gif) no-repeat;
}

td.boxtitlebar {
    /*border-top: 1px solid #8398c5;*/
    background: #8398c5;
}

td.boxmain {
    border-left: 1px solid #8398c5;
    border-right: 1px solid #8398c5;
    border-bottom: 3px solid #8398c5;
}

div.boxcontent {
    margin: 0px;
}

/*div.boxvertfiller {
    width: 1px;
    float: left;
}*/

div.boxbottombar {
/*    clear: both;
    border-bottom: 1px solid gray;*/
}

/*
 * Pop Up Windows
 */
div.popup h4, div.popup p {
    margin: 5px;
    padding: 0px;
}

div.popup {
    margin: 5px;
    padding: 5px;
    background: #f0f0f8;
    text-align: center;
}

/*
 * Footer
 */
#footer {
    clear: both;
    /*width: 100%;*/
    height: 20px;
    padding-top: 2px;
    padding-bottom: 4px;
    border-top: 2px solid gray;
}

span.footerlinks {
    float: right;
    padding-right: 10px;
}

span.footercopyright {
    position: relative;
    float: left;
    top: 2px;
    padding-left: 10px;
    font-size: 9pt;
}

/*
 * Misc stuff that doesn't warrant own css file.
 */

/*
 * For controlling where "Google Site Stats - send feedback" link appears
 */
div.google-ad-tracking {
    margin-top:50px;
    float:right;
}

/*
 * Debug
 */
#debug {
    clear: both;
    /*width: 100%;*/
    text-align: left;
    font-size: 8pt;
}