/* bolds the results of the search */
.ui-autocomplete span.h1_results {
  font-weight: bold;
}

/* sets up scrolling the results (scrollbars, etc.) */
.ui-autocomplete {
  max-height: 250px;
  width: 250px; /* needs to be set or it will wrap to the width of the text box */
  overflow-y: auto; /* shows the vertical scrollbar (if needed) */
  overflow-x: hidden; /* prevents the horizontal scrollbar */
  padding-right: 5px; /* adds padding for the vertical scrollbar */
}

.ui-autocomplete li {
  font-size: 10pt;
}

body {
font-family: Arial,Helvetica;
font-size: 12pt;
color: #000000;
background-color: #FFFFFF;
}

#topDiv {
border-bottom: solid 1px #000000;
width: 100%;
height: 40px;
overflow: hidden;
}

td.tab {
background-color: #FFFFFF;
color: #000000;
font-weight: normal;
border-radius: 10px;
border-top: solid 1px #000000;
border-left: solid 1px #000000;
border-right: solid 1px #000000;
border-bottom: none;
padding: 10px;
padding-bottom: 20px;
cursor: default;
}

td.tab:hover {
background-color: #000000;
color: #FFFFFF;
font-weight: bold;
cursor: pointer;
}

td.tab_selected {
background-color: #000000;
color: #ffffff;
font-weight: bold;
border-radius: 10px;
border-top: solid 1px #000000;
border-left: solid 1px #000000;
border-right: solid 1px #000000;
border-bottom: none;
padding: 10px;
padding-bottom: 20px;
cursor: default;
}

#periodTD {
padding-left: 100px;
padding-bottom: 20px;
}

#bPeriodPara, #tPeriodPara {
font-weight: bold;
font-size: 16pt;
background-color: #333333;
color: #FFFFFF;
border: solid 1px #000000;
padding: 20px;
}

#bPeriodMonth, #tPeriodMonth, #mtfDate_month, #sltfDate_month, #cltfDate_month {
border: solid 1px #000000;
font-size: 12pt;
width: 150px;
height: 30px;
}

#bPeriodYear, #tPeriodYear {
font-size: 12pt;
height: 30px;
width: 50px;
text-align: center;
}

#bPeriodBtn, #tPeriodBtn {
font-size: 12pt;
height: 30px;
width: 50px;
border: solid 1px #000000;
border-radius: 5px;
}

#budgetTable {
border-collapse: collapse;
border-spacing: 0;
}

td.bHeader {
color: #FFFFFF;
font-weight: bold;
font-size: 12pt;
border: solid 1px #000000;
padding: 5px;
}

td.bHeader.name, td.bItem.name {
	text-align: left;
	width: 100%;
}

td.bHeader.amount, td.bItem.amount {
	text-align: right;
	min-width: 100px;
}

td.bItem {
color: #000000;
font-weight: normal;
font-size: 12pt;
border: solid 1px #000000;
padding: 5px;
cursor: default;
}

td.bBlank {
border-top: none;
border-right: none;
border-bottom: solid 1px #FFFFFF;
border-color: #FFFFFF;
}

td.bAddItem, td.bAddCategory {
color: #000000;
font-weight: normal;
font-size: 12pt;
border: solid 1px #000000;
padding: 5px;
cursor: default;
text-align: center;
}

td.bAddItem:hover, td.bAddCategory:hover {
color: #FFFFFF;
font-weight: normal;
background-color: #777777;
}

#bItemDiv_bg {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-color: rgba(0, 0, 0, 0.2);
z-index: 20;
}

#bItemDiv {
position: absolute;
height: 250px;
width: 600px;
background-color: #FFFFFF;
color: #000000;
padding-top: 20px;
border: solid 2px #000000;
border-radius: 10px;
z-index: 20;
}

#bItem_input {
font-size: 12pt;
color: #333333;
height: 25px;
width: 450px;
}

#bItem_planned {
font-size: 12pt;
color: #333333;
height: 25px;
width: 158px;
}

#bItem_actual {
font-size: 12pt;
color: #333333;
height: 25px;
width: 158px;
}

#bItem_save,#bItem_close,#bItem_delete {
font-size: 12pt;
height: 30px;
width: 150px;
border-radius: 5px;
border: solid 1px #000000;
background-color: #555555;
color: #FFFFFF;
font-weight: bold;
}

#bItem_save:hover,#bItem_close:hover,#bItem_delete:hover {
color: #000000;
background-color: #FFFFFF;
}

#chartsTable {
border-collapse: collapse;
border-spacing: 0;
}

#bc_planned_chartDiv {
overflow: hidden;
display: block;
text-align: center;
margin-top: -25px;
}

#bc_actual_chartDiv {
overflow: hidden;
display: block;
text-align: center;
margin-top: -25px;
}

#bc_remaining_chartDiv {
overflow: hidden;
display: block;
text-align: center;
margin-top: -25px;
}

#bc_content {
border: solid 1px #000000;
position: relative;
width: 500px;
height:510px;
}

div.bc_div {
position: absolute;
top: 2px;
left: 2px;
background-color: #FFFFFF;
width: 499px;
z-index: 10;
}

table.bc_content_table {
border-spacing: 0;
border-collapse: collapse;
width: 100%;
}

td.bc_tab {
background-color: #FFFFFF;
color: #000000;
font-size: 12pt;
padding: 5px;
border: solid 1px #000000;
width: 33%;
font-weight: normal;
cursor: default;
text-align: center;
}

td.bc_tab:hover {
background-color: #555555;
color: #FFFFFF;
font-weight: bold;
}

td.bc_tab.selected {
background-color: #555555;
color: #FFFFFF;
font-weight: bold;
padding: 5px;
border: solid 1px #000000;
width: 33%;
font-size: 12pt;
cursor: default;
text-align: center;
}

td.chartHeader {
background-color: #555555;
color: #FFFFFF;
font-size: 12pt;
padding: 5px;
border: solid 1px #000000;
}

td.chartItem {
color: #000000;
width: 250px;
font-size: 12pt;
padding: 5px;
border: solid 1px #000000;
}

td.chartChart {
border: solid 1px #000000;
overflow: hidden;
position: relative;
}

td.chartTotal {
color: #000000;
width: 100px;
font-size: 12pt;
padding: 5px;
border: solid 1px #000000;
text-align: right;
padding-right: 10px;
}

td.chartPercent {
color: #000000;
width: 50px;
font-size: 12pt;
padding: 5px;
border: solid 1px #000000;
text-align: right;
padding-right: 10px;
}

div.incomeDiv {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
display: table-cell;
text-align: center;
vertical-align: center;
padding-top: 50px;
font-size: 11pt;
}

#bc_trans_div {
width: 499px;
}

/************************************************************************/

#transDiv {
display: none; 
padding-top: 100px;  
}

#transTabsDiv {
border-bottom: solid 1px #000000;
width: 100%;
height: 40px;
overflow: hidden;
}

td.transTab {
background-color: #FFFFFF;
color: #000000;
font-weight: normal;
border-radius: 10px;
border-top: solid 1px #000000;
border-left: solid 1px #000000;
border-right: solid 1px #000000;
border-bottom: none;
padding: 10px;
padding-bottom: 20px;
cursor: default;
}

td.transTab:hover {
background-color: #000000;
color: #FFFFFF;
font-weight: bold;
cursor: pointer;
}

td.transTab_selected {
background-color: #000000;
color: #ffffff;
font-weight: bold;
border-radius: 10px;
border-top: solid 1px #000000;
border-left: solid 1px #000000;
border-right: solid 1px #000000;
border-bottom: none;
padding: 10px;
padding-bottom: 20px;
cursor: default;
}

#rTransDiv, #mTransDiv, #slTransDiv, #clTransDiv {
display: none;
}

#transTable, #mTransTable, #slTransTable, #clTransTable {
border-spacing: 0;
border-collapse: collapse;
}

#transFormTable, #mTransFormTable, #slTransFormTable, #clTransFormTable {
border-spacing: 0;
border-collapse: collapse;
width: 250px;
}

td.transHeader, td.mTransHeader {
background-color: #333333;
color: #FFFFFF;
font-weight: bold;
font-size: 12pt;
padding: 5px;
cursor: default;
}

td.transHeader:hover {
background-color: #FFFFFF;
color: #333333;
}

td.transItem {
font-weight: normal;
font-size: 10pt;
padding: 5px;
cursor: default;
}

td.tfHeader {
background-color: #333333;
color: #FFFFFF;
font-weight: bold;
text-align: center;
font-size: 12pt;
padding: 10px;
border: solid 1px #000000;
cursor: default;
}

td.tfTD {
border-left: solid 1px #000000;
border-right: solid 1px #000000;
padding: 10px;
text-align: center;
}

#tfPeriod {
border: solid 1px #000000;
font-size: 12pt;
width: 200px;
height: 30px;
}

#tfCategory {
border: solid 1px #000000;
font-size: 12pt;
width: 200px;
height: 30px;
}

#tfAccount {
border: solid 1px #000000;
font-size: 12pt;
width: 200px;
height: 30px;
}

#tfItem {
border: solid 1px #000000;
font-size: 12pt;
width: 200px;
height: 30px;
}

#tfPlace {
font-size: 12pt;
height: 30px;
width: 200px;
}

#tfAmount {
font-size: 12pt;
height: 30px;
text-align: right;
width: 200px;
}

#tfNotes, #mtfNotes, #sltfNotes, #cltfNotes {
font-size: 12pt;
height: 100px;
width: 200px;
}

#tfDate_month {
text-align: center;
}

#tfDate_day {
text-align: center;
}

#tfDate_year, #mtfDate_year, #sltfDate_year, #cltfDate_year {
text-align: center;
}

input.tfText {
height: 30px;
font-size: 12pt;
color: #000000;
}

input.tfText_blank {
height: 30px;
font-size: 12pt;
color: #AAAAAA;
}

textarea.tfTA_blank {
color: #AAAAAA;
}

textarea.tfTA {
color: #000000;
}

#tfSaveBtn, #tfDelBtn, #tfNewBtn, #mtfSaveBtn, #mtfDelBtn, #sltfSaveBtn, #sltfDelBtn, #cltfSaveBtn, #cltfDelBtn {
font-size: 12pt;
height: 30px;
width: 185px;
border-radius: 5px;
border: solid 1px #000000;
background-color: #555555;
color: #FFFFFF;
font-weight: bold;
}

#tfSaveBtn:hover, #tfDelBtn:hover, #mtfSaveBtn:hover, #mtfDelBtn:hover, #sltfSaveBtn:hover, #sltfDelBtn:hover, #cltfSaveBtn:hover, #cltfDelBtn:hover {
color: #000000;
background-color: #FFFFFF;
}

#mtfAmount, #mtfPrincipal, #mtfInterest, #mtfEscrow, #mtfExtraPrincipal, #mtfExtraEscrow, #mtfEscrowPayment, #sltfAmount, #sltfPrincipal, #sltfInterest, #sltfExtra, #cltfAmount, #cltfPrincipal, #cltfInterest, #cltfExtra  {
width: 100px;
}

td.mTransItem {
font-weight: normal;
font-size: 10pt;
padding: 5px;
cursor: default;
text-align: right;
padding-right: 20px;
}  

/**********************************************************/

#accountsTable, #accountsTransTable {
border-spacing: 0;
border-collapse: collapse;
}

td.acctsTD {
padding: 5px;
border: solid 1px #000000;
font-size: 10pt;
font-weight: normal;
color: #000000;
cursor: default;
}

td.acctsHeader {
font-weight: bold;
color: #FFFFFF;
}

td.actNameTD {
width: 350px;
}

td.actBalTD {
width: 150px;
}

td.actTotalTD {
font-weight: bold;
width: 350px;
}

td.actTotalAmtTD {
font-weight: bold;
width: 150px;
}

td.accts_checking_header {
background-color: #000099;
}

td.accts_checking {
background-color: #CCCCFF;
}

td.accts_savings_header {
background-color: #009900;
}

td.accts_savings {
background-color: #CCFFCC;
}

td.accts_debt_header {
background-color: #990000;
}

td.accts_debt {
background-color: #FFCCCC;
}

td.accts_credit_header {
background-color: #009999;
}

td.accts_credit {
background-color: #CCFFFF;
}

#periodParaDiv {
position: absolute;
width: 100%;
height: 50px;
display: table-cell;
text-align: center;
padding-top: 20px;
background-color: #333333;
color: #FFFFFF;
font-weight: bold;
top: 55px;
left: 0px;
font-size: 16pt;
z-index: 100;
}