/**********************************************************
                    GENERAL SITE LAYOUT
**********************************************************/

body.page {                             /* Set up the basic body layout */
    margin: 5px 5% 5px 5%; 
    font-family: Arial, Helvetica, Sans-Serif;
    font-size: 0.8em;
    /* TDCH: alternative look - borrowed (apart from colour) from e-risk (as was)
    font-family: tahoma, Verdana, Arial, Helvetica, Sans-Serif;
    font-size: 75%;
    color: #555; */
}

div#hd {                                /* Page header */
    padding: 4px 0px 4px 0px;
}

div#bd {                                /* Page body (sidebar and content) */
}

div#sb {                                /* Sidebar */
	position: relative; 
    border: none;
    margin: 0px;
    padding: 0px 0px 0px 0px;
	width: 200px;
	float: left;
}

div#ct {                                /* Content */
    position: static;
    line-height: 1.6em;
	border: none;
    margin: 0px 0px 0px 210px;
    padding: 1px 0px 6px 0px;
}

div#ft {                                /* Footer */
    margin: 0px;
    padding: 6px 0px 0px 0px;
    clear: both;
    font-size: x-small ;
    text-align:center;
}
#ft .hostingbanner 
{
    float:right;
    display: inline;
    vertical-align:baseline;
    text-align:right;
    margin-top: 0px;
    padding-top: 0px;
    /*float: left; doesn't use the vertical-align*/
   
}

div#twitterfeed 
{
    position: static;
    float: left; 
    margin: 6px 0px 0px 0px;
    height: 480px;
    width: 100%;
    overflow-y: scroll;
}

/**********************************************************
                    OVERALL APPEARANCE
**********************************************************/

body {background-image: url(/images/bg-bar3_v1_0_0.jpg.ashx); background-repeat: repeat-x; background-position: 0px 80px; }
div#hd {position: relative; height: 110px; overflow: hidden;}
div#logoarea {text-align: center; float: left; width: 200px; margin-right: 10px; }
div#nav {position: absolute; top: 77px; left: 210px; !left: 214px; width: 480px; }
#nav a {display: block; float: left; color: blue; padding: 9px 15px 9px 0px; }
#nav a.disabled {color: #888; text-decoration: none; }

/* Site conventions */
a {text-decoration: none; color: Blue;}
a:hover {text-decoration: underline;}
img {border-style: none;}
table, td, th, tbody {border-style: none; border: none 0px white; text-align: left; }

/* Basic content style */
#ct h1 {
    font-size: 150%; margin-top: 1.5em; margin-bottom: 0.6em;
}
#ct h2, #ct .login .title {
    font-size: 125%; margin-top: 0.6em; margin-bottom: 0.2em;
}
#ct h3 {font-size: 110%;}
#ct .firstline {margin-top: 0px;}

#sb .level1 {padding-left: 10px;}
#sb .level2 {padding-left: 20px;}
.level1 img {padding-right: 10px;}

.button {
    margin: 5px 5px 5px 0px;
    padding: 2px 6px 2px 6px; border: outset 1px #37A; 
    background-color: #DEF; color: #138;
    text-align:center;
}

#sb .rightalign {float: right; text-align: right;}

/*.button:hover {text-decoration: none; background-color: #E8F4FF;}*/
/*.button:active {text-decoration: none; background-color: #E8F4FF; border: inset 1px #37A; }*/
.button:hover {text-decoration: none; background-color: #CDE;}
.button:active {text-decoration: none; background-color: #CDE; border: inset 1px #37A; }

/* Various table list types:
   1) mini-list (don't take up much space)
   2) list (not too cramped) */
/* table.mini-list, .mini-list tr, .mini-list td, .mini-list th, .mini-list tbody tr, table.list, .list td, .list th, .list tbody
    {border-style: none; border: none 0px white; padding: 0px; text-align: left; }
*/
table.minilist td, .minilist tr, .minilist tbody
    {border-style: none; border: none 0px white; padding: 0px; margin: 0px; text-align: left; vertical-align: middle; line-height: 1.3em; }
table.fullwidth {width: 100%; }

table.mini-list, .mini-list td, .mini-list th, .mini-list tbody
    {padding: 0px; }
table.list, .list td, .list th 
    {padding: 2px 10px 2px 2px; }
    
/* The top of the page */
div#titlebar
{
    font-size: 170%;
    font-family: "courier new", monospace; 
    font-weight: bold;
}

#ct h2 {
    font-size: 125%; margin-top: 0.6em; margin-bottom: 0.2em;
}
#ct h3 {font-size: 110%;}
#ct .firstline {margin-top: 0px;}

#sb h1 { font-size: 108%; margin-top: 1em; margin-bottom: 0.2em; }
#sb h2 { font-size: 104%; margin-top: 0.8em; margin-bottom: 0.1em; }
#sb h3 { font-size: 100%; margin-top: 0.6em; margin-bottom: 0.05em; }
#sb .firstline {margin-top: 0px;}

div#identity {float: right; text-align: right; width: 18em;}

span.secondary {float: right; margin: 0px; padding: 0px; }

.floatingblock {display: block; float: left; padding: 0em 2em 0.5em 0em; }
.unavailable {color: Gray; font-style: italic;}

#sb div.group {
    clear: both; padding-bottom: 0.5em;
    margin-bottom: 10px; padding: 5px;
}

#sb div.boxed, #sb div.pagehint, #sb div#groupfactorcontrols, #sb div.fieldlist
 {
    border: solid 1px #fee880; 
}

#sb div.fieldlist {background-color: #FFF4F4;}
/* Field list */
#sb DIV.fieldlist table {width: 100%;}
#sb DIV.fieldlist IMG.weight-g2, #sb DIV.fieldlist IMG.weight-g1, #sb DIV.fieldlist IMG.weight-d1, #sb DIV.fieldlist IMG.weight-d2 {
    /* height: 14px; width: 99px; */
    height: 7px; width: 38px; 
    display: block; float: right; 
    background: transparent url(/images/slider/weightdispsmall3-sprite.gif.ashx) no-repeat; 
    margin-top: 10px;
}

#sb DIV.fieldlist IMG.weight-g2 {background-position: 0px 0px; }
#sb DIV.fieldlist IMG.weight-g1 {background-position: 0px -10px; }
#sb DIV.fieldlist IMG.weight-d1 {background-position: 0px -30px; }
#sb DIV.fieldlist IMG.weight-d2 {background-position: 0px -40px; }


.group ul 
{
    list-style:none;
    margin-top: 0px; 
    margin-left: 0px;
    margin-bottom: 0px;
    padding-left: 0px;
    
}

DIV.slider 
{
    background-position: 3px 0px;
    background-image: url(/images/slider/slider-bg.gif.ashx);
    background-repeat: no-repeat;
    width: 108px;
    height: 20px;
}

DIV.slider input
{
    display: block;
    float: left;
}

div.slider input:hover
{
    background-image: url(/images/slider/slider-ghost.gif.ashx);
    background-repeat: no-repeat;
}

div.pagehint 
{
    color: #5e7084;
    Font-Family: Verdana,Arial,Helvetica,sans-serif;
    Font-Size: 11px;
    line-height: 1.2;    
    background-color:#fef3be;
    /*margin: 20px;*/
    /* drop-shadow effect on MISE - needs position to be absolute, but that messes up the width.
      alternatively, we can set the width */
    /*position:absolute ;*/
    position: static;
    padding: 5px;
/*   filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=3, OffY=3, Color='gray', Positive='true');*/
   filter:progid:DXImageTransform.Microsoft.Shadow(color='#666666', Direction=135, Strength=4);
}

.pagehint p 
{
    margin-top: 10px;
    margin-bottom:0px;
}

/* Make the toggle edit look nice */
#sb div.toggleedit .display { font-weight:bold; }
#sb div.toggleedit .update { background-color: #FDD; width: 70%; }
#sb div.toggleedit .toggle { }

#sb .pagehint h1 
{
    margin-top: 0px;
   padding-bottom: 5px;
    font-size: 1.2em;
}

div#groupfactorcontrols 
{
    margin-bottom: 10px; padding: 5px;
    background-color: #FFF4F4;
    font-size:0.85em;
}

div#groupfactorcontrols INPUT {font-size:0.85em;}


#groupfactorcontrols table th {padding: 0px 4px 0px 4px; }
#groupfactorcontrols td.rightalign a { line-height: 2;}
#groupfactorcontrols { list-style: none; }

#sb .pagehint h1:first-child, #sb .group h1:first-child, #sb .group h1 {margin-top: 0em;}

.validationerror {color: Red; }

/* popup div support - similar in look to the hint? */
.popup
{
    color: #88B;
   position:absolute; left:0; top:0; /*width:132px;*/
    background-color:#FFD;
    border: solid 1px;
   padding:10px;
   /*font-family:Arial;*/
    Font-Family: Verdana,Arial,Helvetica,sans-serif;
   font-weight:normal;
   font-size: 9pt;
   z-index:2;
   visibility:hidden;
   filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color='gray', Positive='true');
}

#ct .popup h1 
{
    font-size: 12pt ; 
    margin-top: 0px;
    text-align:left;
    padding-bottom:5px;
    font-weight:bold;
    /*text-decoration:underline;*/
    line-height: 1em;
/*    text-decoration:none;
    background-color:#88B;
    color: #FFD;*/
}

.popup td, .popup th
{
    /*padding: 3px  0px;*/
    padding: 3px 0px 3px 0px; 
    text-align: left;
    line-height: 1.3em;
}

.popup th.col1 {padding-right: 6px;}

.popup td.col2 {text-align: right;}
    
.scoretableheader  td, .scoretableheader  th, .scoretabledetail td, .scoretabledetail th
{
    width: 80px;
    text-align:center;
    border-bottom: dotted 1px gray !important;
}

.scoretableheader, .scoretabledetail 
{
    /* margin:25px auto; centers it */
    margin:15px 0px; 
    
    border-spacing: 0px;
    border-collapse:collapse;
}

/*div.scoretableheader {width: 400px; }*/

.scorereportseparator 
{
    /*clear:left;*/
}

/* Formatting for the main groupsort report */
div#reportdiv {font-size:0.9em; }
div#reportdiv tr.groupreporthead {font-size: 1.5em; }
div#reportdiv tr.groupreporthead a {color: Black;}

#reportdiv tr.groupreporthead td {padding-top: 20px;}
#reportdiv tr.groupreporthead:first-child td {padding-top: 0px;}

div#reportdiv td {padding: 1px 1px 1px 0px; line-height: 1.1em; }

div#reportdiv tr.header {margin: 0px; padding: 0px; }
div#reportdiv tr.header th {padding-bottom:5px; text-align: left; border-bottom: solid 1px black; }

table .oddrow {background-color: #E8E8E8;}
table .evenrow {background-color: #FFFFFF;}

#reportdiv th {
    padding: 5px 5px 0px 0px; 
    }

/* documentation iframe */
.docframe 
{
/* for now, there are both min-width and width attributes to keep firefox and IE6 happy 
    I think the better way to size the iframe may be to use javascript */

    height:100%;
    width: 99%;
    /*right: 0px;*/
    display:block;
    margin:0;
    padding:0;
    min-width:750px;
    /*min-height:500px;*/
    /*border-right: solid 1px black;
    border-bottom: solid 1px black;*/
}


.dashboardlist td {
    border-top: dotted 1px #fe8500;
    border-bottom: dotted 1px #fe8500;
    padding-bottom: 9px;
    padding-top: 5px;
}.dashboardlist .listname {font-size: 1.2em; font-weight: bold;}
.dashboardlist .listdate {font-weight: bold;}
.dashboardlist .numrecords {font-weight: bold;}
.dashboardlist .fields {color: Gray;}
.dashboardlist .action {}

input.filebrowse {
}

#context 
{
    font-weight: bold;
}

/* try to make the edit box of the toggleedit have the same font as everything else */
input.toggleedit
{
    font-size:inherit; /* doesn't do it */
}

#notneeded_groupfactorcontrols .button 
{
 /*float:right; - no, takes it out of the box */
 display:block;
 margin-right: 5px;
 margin-left: 140px;    /* works */
 /*margin-top: 5px;      /* doesn't work unless display is block*/
 /*margin-bottom: 50px;   /* ditto*/
}

.errormsg 
{

 /*   position:relative;*/
    font-weight: bold;
    color: red;
    border: red 2px solid;
    padding: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    
}

.subgroup 
{
   border-top: dotted 1px #88B;
   margin-top: 3px;
   padding-top: 3px;
}

/**************** SIGNUP TABLE ***************/
table.signup input.password, table.login input.textbox {!width: 150px; /*Only IE notices this*/ }
table.signup {margin-top: 10px;}

/**************** PASSWORD RECOVERY *************/
#ct .recoverpassword .title {    font-size: 125%; margin-top: 0.6em; margin-bottom: 0.2em;}

.highlightbox 
{
    margin: 20px;
    padding: 5px 20px;
    border:solid 2px black;
    background-color: #DDA;
    /*font-weight:bold;*/
}

/**************** Action box *******************/

.actionbox {
    font-family: Verdana,Arial,Helvetica,sans-serif;
    float: left;
    width: 24em;
    height: 13em;
    border: solid 1px;
    padding: 0.8em 0.8em 0em 0.8em; 
    margin-right: 10px;
    margin-bottom: 3px;
    font-size: 100%;
    vertical-align: middle;
}

/* Fix to make IE6 work properly for the coloured boxes on the front page */
.actionbox ul {margin-bottom: 0px; }
.actionbox .fileupload table {padding: 0px; margin: 0px;}

.actionbox a 
{
}

.actionbutton {
    display: block; 
    position: absolute;
    bottom: 1em;
    right: 1em;
    width: 4em; 
}

#ct .actionbox h1, .actionbox span.standout {
    margin-top: 0em;
    margin-bottom: 1em;
    font-style: normal;
    font-weight: bold;
    font-size: 125%;
}

#ct .actionbox ul {
    padding-left: 0em;
    margin-left: 1em;
    line-height: 1.2em;
    display: block;
}
#ct .actionbox ul li {
    line-height: 1.5;
    padding-bottom: 0.75em;
}

#ct .actionbox em {font-weight: bold;}
/*Colours used everywhere*/
.pink, .pink a      { background-color: #fec0ce; color: #744c57; border-color: #e1cbd2; }
.red, .red a        { background-color: #fe9a86; color: #2c1210; border-color: #a66f64; }
.orange, .orange a  { background-color: #ffc07d; color: #2c190e; border-color: #c4ad90; }
.yellow, .yellow a  { background-color: #fee880; color: #2c250e; border-color: #c4bc90; }
.green, .green a   { background-color: #c5ea90; color: #256115; border-color: #b7bfa2; }
.blue, .blue a      { background-color: #afd7fd; color: #33445d; border-color: #bccbda; }

.paleyellow { background-color: #fee880; color: #2c250e; border-color: #c4bc90; }

/* Have the headings stand out a bit more */
h1, h2, h3 { font-family: Verdana, Arial, Helvetica, Sans-Serif; }
.smaller { font-size: 80%; }

/* File upload box */
div.fileupload table th 
{
    font-weight: normal;
}

/* 3 col sections */
.cols3 {
    display: block; float: left;
    width: 30%;
    padding-right: 1em;
}