@import "display.css";
@import "form.css";

/* Element */
p {
    margin-bottom: 1em;
}

.loadIndicator {
    float: right;
    width: 16px;
    height: 16px;
    margin: 2px 3px;
    background: transparent url("img/loading.gif") center center no-repeat;
}

.loadIndicator2 {
    width: 100%;
    height: 40px;
    text-align: center;
    margin-top: 60px;
    background: transparent url("img/loading2.gif") bottom center no-repeat;
}

.accessButton {
    float: right;
    margin: 2px 3px;
}

.toggleButton {
    cursor: pointer;
}

.separator {
    height: 20px;
    background: transparent url("img/separator.png") repeat-x center left;
}

.verticalSeparator {
    background: transparent url("img/separator.png") repeat-y top center;
}

embed, object {
    display: block;
    z-index: 500;
}

.captcha img {
    border: 1px solid #808080;
}

.container-body > .infoPanel {
    padding-top: 5px;
    margin: 0 5px;
}

/* Override Styles */
.ui-datepicker {
    z-index: 2000;
}

.calendar .ui-datepicker {
    width: 180px;
}

.calendar .ui-datepicker-calendar a {
    padding: 0 0.2em;
}

.ui-widget-content a:hover {
    color: #676767;
}

.ui-state-highlight a:hover {
    color: #676767;
}

.ui-effects-transfer {
    border: 2px dotted gray;
}

.jstree li a {
    font-size: 1.1em;
}

/* Behavior */
.middleVAlign {
    vertical-align: middle;
}

.middleVAlignChildren * {
    vertical-align: middle;
}

.centerAlign {
    text-align: center;
}

.justifyAlign {
    text-align: justify;
}

.invisible {
    display: none;
}

.income {
    color: #00844B;
}

.expense {
    color: #A91F00;
}

.footnote {
    margin-top: 10px;
    color: #777;
    font-size: 0.9em;
    text-align: justify;
}

fieldset legend {
    margin-left: 5px;
}

/* Layout */
body {
    font: normal 12px Verdana;
    background: #d7d7d7;
}

.background-top {
    background: #fff url("img/background-top.jpg") repeat-x;
}

.background-content {
    background: #d7d7d7 url("img/background-content.jpg") center center repeat-y;
}

.background-bottom {
    padding-top: 1em;
    background: #d7d7d7 url("img/background-bottom.jpg") top center no-repeat;
}

.container {
    width: 900px;
    margin: 0px auto;
}

/* Header */
.container-header {
    height: 55px;
    padding: 10px 0 0 0;
    color: #888;
}

.container-header strong {
    color: #000;
}

.container-header a {
    color: #888;
    text-decoration: none;
}

.container-header a:hover {
    color: #000;
}

.siteLogo {
    float: left;
    margin: 3px 0 0 0;
}

.userPanel {
    float: right;
    margin: 5px 10px 0 0;
    text-align: right;
}

.userPanel br {
    font-size: 0.5em;
}

/* Footer */
.container-footer {
    text-align: center;
    line-height: 20px;
    padding-top: 20px;
    color: #000;
}

.container-footer a {
    color: #555;
    text-decoration: none;
}

.container-footer a:hover {
    color: #000;
}

/* Body */
.container-body {
    width:100%;
}

.placeholder-left {
    float: left;
    width: 180px;
    border-right: 3px double #d7d7d7;
    border-bottom: 1px solid #d7d7d7;
    min-height: 350px;
}

* html .placeholder-left {
    height: 350px;
}

.placeholder-right {
    float: right;
    width: 200px;
}

.placeholder-middle {
}

.placeholder-middle.left {
    padding-right: 200px;
}

.placeholder-middle.right {
    padding-left: 183px;
}

/* Content */
.content {
}

.content-header {
    font: bold 1em Verdana, Arial;
    color: #444;
    padding: 5px 10px;
}

.content-header a {
    color: #444;
    text-decoration: none;
}

.content-header a:hover {
    color: #777;
    border-bottom: 1px dotted #888;
}

.content-body {
    padding: 5px 10px;
}

.content-body a {
    color: #1A6936;
    text-decoration: none;
}

.content-body a:hover {
    color: #26994E;
}

/* Sidebar */
.sidebar-header {
    color: #444;
    font: bold 1em Verdana, Arial;
    padding: 5px;
}

.sidebar-body {
    font-size: 1em;
    background: #fff;
    padding: 5px;
}

.placeholder-left .sidebar-body {
    padding-right: 10px;
}

.placeholder-left .sidebar-body a.menu {
    display: block;
    color: #1A6936;
    text-decoration: none;
    border-bottom: 1px dotted #d7d7d7;
    padding: 5px 0;
}

.placeholder-left .sidebar-body a.menu:hover {
    color: #26994E;
}

.placeholder-right .segment {
    border-bottom: 1px solid #efefef;
    padding: 5px 0;
}

.placeholder-right .segment:hover {
    background: #FDF7D7;
    border-bottom: 1px solid #FBCB09;
}

.placeholder-right a.link {
    color: #1A6936;
    text-decoration: none;
}

.placeholder-right a.link:hover {
    border-bottom: 1px dotted #1A6936;
}

.placeholder-right .sidebar-body a.menu {
    display: block;
    color: #1A6936;
    text-decoration: none;
}

.placeholder-right .sidebar-body a.menu:hover {
}

.placeholder-right .credit .coin {
    float: left;
}

.placeholder-right .credit .amount {
    font-size: 1.2em;
    padding: 2px 0 2px 30px;
}

/* Display Tab */
.displayTabPanel {
    border-bottom: 1px solid #c6c6c6;
    padding: 0px 5px;
}

.displayTabPanel a {
    float: left;
    display: block;
    padding: 4px 6px;
    margin: 3px -1px -1px 0px;
    border: 1px solid #c6c6c6;
    color: #808080;
    background: #F4F4F4;
}

.displayTabPanel a:hover {
    color: #000;
}

.displayTabPanel a.active {
    padding: 7px 10px 4px 10px;
    margin: 0px -1px -1px 0px;
    color: #000;
    background: #fff;
    border-bottom: 1px solid #fff;
}