@import "clearfix.css";

/* ###### overall ##### */

* {
    font-family: Verdana, Arial, Sans-Serif;
    font-size: 9pt;
}

body {
    margin: 0px;
    padding: 0px;
    background-image: url('../images/page_bg.gif');
    background-repeat: repeat-y;
}

a {
    color: #007aa9;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* ###### banner ##### */

#banner  {
     /* has clearfix class */
    padding: 10px;
    background-color: #ffffff;
}
#banner_left {float: left;}
#banner_right {float: right;}

/* ###### progress bar ###### */

#progressBarContainer {border: solid 1px #74B1CD; width: 250px; margin-bottom: 15px;}
#progressBar {width: 0px; height: 15px; background-color: #CDE4EF;}

/* ###### breadcrumb ##### */

#breadcrumb {
    font-size: 10pt;
    padding: 3px 3px 3px 15px;
    background-color: #74b1cd;
    color: #ffffff;
}

.legalAgreement
{
    height: 150px;
    width: 97%;
    color: #444444;
    border: solid 1px #444444;
    font-style: italic;
}

/* ###### sidenav ##### */

#nav {
    float: left;
    width: 165px;
    background-color: #cde4ef;
    color: #205268;
    /* white-space: nowrap; */
}

#nav h2 {
    margin: 15px 0px 2px 15px;
    padding: 0px;
}

#nav_links {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

#nav_links li
{
    font-size: 12pt;
    padding: 2px 0px 2px 15px;
}

#nav_links li a {
    color: #205268;
    text-decoration: none;
}

#nav_links li a:hover {
    text-decoration: underline;
}

#nav_programs
{
    margin: 3px 2px 0px 10px;
    padding: 3px;
    list-style-type: none;
}

#nav_programs li
{
    margin: 0px;
    padding: 0px;
}

#navFooter {
    margin-top: 25px;
    width: 150px;
    height: 150px;
    background-image: url('../images/leftnav_bg.gif');
    background-repeat: no-repeat;
}

/* ###### content area ##### */

#content {
    width: 300px;
}

#content.messages {
    width: 800px;
    background-color:#b1c2ca;
    padding:5px !important;
    text-transform:capitalize;
    color:#FFF;
    font-weight:bold;
    margin-bottom: 15px;
}

#app {
    width: 800px;
    padding: 10px;
    float: left;
}

#app h2 {
    display: block;
    font-size: 12pt;
    font-weight: bold;
    margin-top: 5px;
    margin-bottom: 15px;
}

/* pagination text that appears on tables */
.pagebanner {
    display: inline;
    font-size: 10pt;
    font-weight: bold;
    margin-top: 5px;
    padding-bottom: 15px;

    color: #0198D9;
    background-image: url('../images/iconSearch.gif');
    background-repeat: no-repeat;
    background-position: 0px 1px;
    padding-left: 20px;
    padding-right: 15px;
}

/* table styling */
table.detail {
    border-collapse: collapse;
}

table.detail th, table.detail td {
    text-align: left;
    border-bottom: solid 1px #D6DADB;
    padding: 3px 10px 3px 3px;
    font-weight: normal;
}

table.editor {
    border-collapse: collapse;
}

table.editor td, table.editor th {
    text-align: left;
    border-bottom: solid 1px #D6DADB;
    padding: 3px 10px 3px 3px;
}

table.editor th {
    background-color: #CDE4EF;
    font-weight: normal;
}

/* table styling */
table.list {}

table.module {
    border-collapse: collapse;
    border-right: solid 2px #cbe4f4;
    border-left: solid 2px #cbe4f4;
    border-bottom: solid 2px #cbe4f4;
    margin-bottom: 10px;
}

table.module caption
{
    margin-top: 15px;
    text-align: left;
    text-transform: uppercase;
    color: #205268;
    background-image: url('../images/header_bg.gif');
    background-repeat: no-repeat;
    padding: 0px 0px 1px 6px;
    border-bottom: solid 2px #cbe4f4;
}

table.module caption span
{
    background-color: #A5D1EC;
    padding: 0px 5px 1px 0px;
}

table.module th
{
    border-bottom: solid 2px #cbe4f4;
    text-align: left;
    padding: 2px 4px 2px 4px;
}

table.module th, table.module th a
{
    color: #777777;
    font-weight: bold;
    text-decoration: none;
}

table.module th a:hover
{
    text-decoration: underline;
}

table.module td
{
    padding: 4px 4px 4px 4px;
    font-size: 8pt;
}

table.module tr.odd {
    background-color:#dfe6ff;
}

table.module td a
{
    font-size: 8pt;
    text-decoration: none;
}

table.module td a:hover
{
    text-decoration: underline;
}


table.module .icon {
    width:40px;
    text-align:center;
}

table.module .icon-large {
    width:70px;
    text-align:center;
}

table.module tr.on {
    background-color:#D6DADB;
}

table.module tr.seperator {
    background-color:#FFF;
    border-bottom:1px solid #D7DADB;
}

table.module th.date {
    width:60px;
}

table.module th.message {
    width:290px;
}

table.module th.program {
    width:85px;
}

table.module th.actionItem  {
    width:140px;
}

table.module th.dueBy {
    width:85px
}

table.module th.programs {
    width:135px
}

table.module th.status {
    width:455px
}

table.module .lastRow {
    font-size:11pt;
}

table.module tr.seperator td {

}

/* ###### footer ##### */

#footer
{
    text-align: left;
    color: #b1b1aa;
    margin-top: 20px;
    clear: both;
}

#footer_links
{
    list-style-type: none;
    padding: 15px 0px 0px 0px;
    margin: 0px;
}

#footer_links li
{
    font-size: 12pt;
    padding: 0px;
    float: left;
}

#footer_links li a
{
    text-decoration: none;
}

#footer_links li a:hover
{
    text-decoration: underline;
}

#footer_links li.leftmost a, #footer_links li.middle a
{
    padding-right: 5px;
    border-right: solid 2px #b1b1aa;
}

#footer_links li.middle a, #footer_links li.rightmost a
{
    padding-left: 5px;
}

#disclaimer
{
    font-size: 8pt;
}

#copyright
{
    clear: both;
    padding-top: 15px;
}


/* ###### misc ##### */

.loader
{
    background-image: url('../images/spinner.gif');
    background-repeat: no-repeat;
    background-position: 0px 0px;
    padding: 1px 10px 2px 20px;
}

#systemWorking
{
    padding-top: 15px;
    padding-bottom: 15px;
}

.archive {
    text-decoration:none;
    padding:4px 30px 5px 0;
    background: url("../images/arrow-icon.gif") no-repeat 90px 5px;
}

.box
{
    margin-top: 15px;
    margin-bottom: 15px;
    border: solid 1px #999999;
    padding: 10px 10px 10px 10px;
}



.box .actions
{
    margin-top: 10px;
    margin-bottom: 0px;
}

.box .button
{
    font-weight: normal;
}

.box p, .box h3
{
    margin-top: 0px;
}

.box .multibox, .box .multiboxshort
{
    margin-bottom: 10px;
}

.login {
    background-color:#FFF;
    width:435px;
    padding:15px;
    margin-top:10px;
}

*html .login {
    margin-top:25px;
}

.login h2 {
    font-size: 18px !important;
    font-weight:bold;
    padding-top:0px;
    margin-top:0px;
}

.login label, .passReset label {
    font-weight:bold;
    color:#767878;
    display: block;
    padding:5px 0;
}

.prettyButton {
    border-style: double;
    border-color: rgb(204, 204, 204) rgb(153, 153, 153) rgb(153, 153, 153) rgb(204, 204, 204);
    border-width: 3px;
    padding: 0.25em; width: auto;
    background-color: rgb(238, 238, 238);
    font-weight: bold;
    color: #000000;
}

.prettyButton * {
    color: #000000;
}

.information {
    font-weight: bold;
    color: #0198D9;
    background-image: url('../images/iconInformation.gif');
    background-repeat: no-repeat;
    padding-left: 20px;
}

/* this appears once per page at the top or near the action buttons and is invisible by default */
.errorSummary {
    font-weight: bold;
    color:red;
    background-image: url('../images/iconWarning.gif');
    background-repeat: no-repeat;
    padding-left: 20px;
}

/* this appears next to fields and is default to visible */
.error {
    color:red;
}

/* this appears next to fields and is default to visible */
.warning {
    color:#FF6633;
    font-style: italic;
}

/* this appears next to fields and is default to visible */
.notice {
    color:#205268;
    font-style: italic;
}

textarea.addNote {
    width:130px;
    height:60px;
}

.key {
    position: absolute;
    left: 670px;
    margin-top: 15px;
    font-size:11px;
    border: 3px double #727272;
    padding:6px;
}

.key td {
    white-space:nowrap;
}
.key th {
    font-weight:bold;
    text-align:left;
    padding-right:12px;
}

.bigField {
    width:220px;
}

/***** form fields *****/

.line {
    clear: both;
    padding-bottom: 5px;
}

.line label {
    display: block;
    width: 100px;
    float: left;
    height: 20px;
}
span.readonly
{
    background-color: #eeeeee;
    border: solid 1px #555555;
    padding: 3px;
    color: #555555;
}

.line .tip
{
    color: blue;
    font-style: italic;
    font-size: 8pt;
}

.filter .line label {
    height: 15px; /* override the default line height for filter area */
}

.filter
{
    margin-top: 15px;
    border: dotted 1px #999999;
    padding: 5px;
    margin-bottom: 15px;
}

.filter *
{
    font-size: 10px;
}

.filter div
{
    margin-bottom: 6px;
}

.filter button
{
    padding: 0px;
    font-weight: normal;
}

.filter .label
{
    padding-top: 0px;
    margin-top: 2px;
}

.filter .input
{
    position: absolute;
    left: 150px;
}

.filter .actions, .filter .subhead
{
    padding-top: 8px;
}

.multibox
{
    margin-top: 15px;
    border: solid 1px #999999;
    padding: 5px;
    height: 200px;
    width: 500px;
    overflow: auto;
}

.multibox * {
    font-size: 10px;
}

table.checkboxTable {
    border-collapse: collapse;
}

table.checkboxTable table {
    background-color: #eeeeee;
}

table.checkboxTable tr {
    vertical-align: top;
}

table.checkboxTable td {
    border-bottom: dotted 1px #777777;
}
table.checkboxTable h4 {
    background-color: #dddddd;
    padding: 2px;
    margin: 8px 0px 1px 0px;
}

.actions {
    margin-top: 15px;
    margin-bottom: 15px;
}

/* assignment table for user permission management */

.availableRoles {
    margin-bottom: 0px;
}

.availablePrograms {
    margin-bottom: 7px;
}

.multiboxshort
{
    margin-top: 15px;
    border: solid 1px #999999;
    padding: 5px;
    height: 80px;
    width: 300px;
    overflow: auto;
}

.multiboxshort *
{
    font-size: 10px;
}

.multiboxshortErrors
{
    margin-top: 15px;
    border: solid 1px #999999;
    padding: 5px;
    height: 230px;
    width: 750px;
    overflow: auto;
}


a.edit
{
    padding: 1px 1px 1px 18px;
    background-image: url('../images/ico_edit.gif');
    background-repeat: no-repeat;
}

a.delete
{
    padding: 1px 1px 1px 18px;
    background-image: url('../images/ico_delete.gif');
    background-repeat: no-repeat;
    color: Red;
}

/* # manage program cycles #  */


.tableline
{
}

.tableline span
{
    display: block;
    float: left;
}

.tableline .programName, .tableline .programNameInput
{
    width: 300px;
}


#container1
{
width: 90%;
margin: 10px auto;
background-color: #fff;
color: #333;
border: 1px solid gray;
line-height: 130%;
}

#top1
{
padding: .5em;
background-color: #ddd;
border-bottom: 1px solid gray;
}

#top1 h1
{
padding: 0;
margin: 0;
}

#leftnav1
{
float: left;
width: 160px;
margin: 0;
padding: 1em;
}

#content1
{
margin-left: 200px;
border-left: 1px solid gray;
padding: 1em;
max-width: 36em;
}

#footer1
{
clear: both;
margin: 0;
padding: .5em;
color: #333;
background-color: #ddd;
border-top: 1px solid gray;
}

#leftnav1 p { margin: 0 0 1em 0; }
#content1 h2 { margin: 0 0 .5em 0; }

#searchBox {
	width: 300px;
	float: left;
}
#addRegistration {
	width: 400px;
	margin-left: 320px;
}
#registrationListDiv {
	clear: left;
}

#col1 {
	float: left;
	width: 200px;
}

#col2 {
	width: 200px;
	margin-left: 210px;
}

.buttonBar {
	margin-top: 50px;
}

tr.total {
	background-color: #B4CFEC;
	font-weight:bold;		
}