body, tr, td, p, a, form, input, textarea, select, h1, h2, h3, h4, ul, ol, li, msg, label, button {
	font-family: Roboto, Arimo, Arial; 
	font-size: 12px; 
	color: #000; 
	padding: 0; 
	margin: 0;
	line-height: 1; /* 1.6; */
} 

ul:not(.div_table) li, ol li {margin-left: 40px; line-height: 1.6;}

a i {color: #000;}
a:hover i {color: #f8aa27;}

body {background-color: #fff; color: #000;}

h1 {font-size: 16px;}
h2 {font-size: 16px;}
h3 {font-size: 11px; text-transform: uppercase;}

a {text-decoration: underline; cursor: pointer;}
a:hover {text-decoration: none;}
a.reverse {text-decoration: none;}
a.reverse:hover {text-decoration: underline;}
a.nohover {text-decoration: none;}
a.nohover:hover {text-decoration: none;}
a.dashed {text-decoration: none; border-bottom: 1px dashed #666;}
a.dashed:hover {text-decoration: none; border-bottom: 0px;}
a.dashed.reverse {text-decoration: none; border-bottom: 0px;}
a.dashed.reverse:hover {text-decoration: none; border-bottom: 1px dashed #666;}
a img {border: none;}

td, div {vertical-align: top;}
.vert_middle {vertical-align: middle;}
.hor_center {text-align: center;}
.hor_right {text-align: right;}
.hor_left {text-align: left;}

.div_table {display: table;}
.div_table_row, ul.div_table li {display: table-row;}
.div_table_cell, ul.div_table li span {display: table-cell;}

.div_row {margin-bottom: 20px;}
.div_no_row {margin-bottom: 0px;}

div.div_table.div_cols > div.div_table_cell {padding-left: 10px; padding-right: 10px;}
div.div_table.div_cols > div.div_table_cell:first-child {padding-left: 0px;}
div.div_table.div_cols > div.div_table_cell:last-child {padding-right: 0px;}

.div_w5  {width: 5%;}
.div_w10 {width: 10%;}
.div_w15 {width: 15%;}
.div_w20 {width: 20%;}
.div_w25 {width: 25%;}	
.div_w30 {width: 30%;}	
.div_w35 {width: 35%;}	
.div_w40 {width: 40%;}	
.div_w45 {width: 45%;}	
.div_w50 {width: 50%;}	
.div_w55 {width: 55%;}	
.div_w60 {width: 60%;}	
.div_w65 {width: 65%;}	
.div_w70 {width: 70%;}	
.div_w75 {width: 75%;}	
.div_w80 {width: 80%;}	
.div_w85 {width: 85%;}	
.div_w90 {width: 90%;}	
.div_w95 {width: 95%;}	
.div_w100 {width: 100%;}

.theme_color 	{color: #f8aa27;}
.success_color  {color: #5cb85c;}
.warning_color  {color: #f0ad4e;}
.error_color    {color: #d9534f;}
.inactive_color {color: #f3f3f3;}

.bg_theme_color 	{background-color: #f8aa27;}
.bg_success_color   {background-color: #dff0d8;}
.bg_warning_color   {background-color: #fcf8e3;}
.bg_error_color     {background-color: #f2dede;}
.bg_inactive_color  {background-color: #f3f3f3;}

.msg {padding: 20px 20px 20px 30px; border: none;}
.msg_success  {color: #3c763d; background-color: #dff0d8;}
.msg_warning  {color: #8a6d3b; background-color: #fcf8e3;}
.msg_error    {color: #a94442; background-color: #f2dede;}
.msg li {line-height: 1.6; margin-left: 15px;}

.btn 				{display: inline-block; padding: 6px; font-weight: 400; border: 1px solid transparent; border-radius: 4px; text-align: center; text-decoration: none; cursor: pointer; width: auto;}
.btn				{color: #000000; background-color: #ffffff; border-color: #D4D6D8;}
.btn_theme			{color: #ffffff; background-color: #40B175; border-color: #40B175;}
.btn_success 		{color: #ffffff; background-color: #5cb85c; border-color: #4cae4c;}
.btn_warning 		{color: #ffffff; background-color: #f0ad4e; border-color: #eea236;}
.btn_error   		{color: #ffffff; background-color: #d9534f; border-color: #d43f3a;}
.btn_link			{color: #000000; background-color: #ffffff; border-color: #ffffff;}

.btn:hover  		{color: #000000; background-color: #F0F1F1; border-color: #D4D6D8;}
.btn_theme:hover	{color: #40B175; background-color: #ffffff; border-color: #40B175;}
.btn_success:hover	{color: #ffffff; background-color: #449d44; border-color: #398439;}
.btn_warning:hover	{color: #ffffff; background-color: #ec971f; border-color: #d58512;}
.btn_error:hover	{color: #ffffff; background-color: #c9302c; border-color: #ac2925;}
.btn_link:hover		{color: #000000; background-color: #ffffff; border-color: #ffffff;}

.btn_icon {font-size: 14px; width: 14px; height: 14px; border-color: transparent;}
.btn_lg {height: 38px;}

.hide0 {display: none !important;}


/* === STRUCTURE === */

body {min-width: 350px;}

#top {padding: 10px; text-align: center; background-color: #fac55b;}
#top i {font-size: 12px;}
#top #main_menu {margin-top: 10px;}
#top #main_menu a {padding: 0 5px;}
#top #main_menu a:not(:last-child) {border-right: 1px solid #000;}
#top #main_menu a:first-child {padding-left: 0}
#top #main_menu a:last-child {padding-right: 0;}


#full_menu {display: none; padding: 10px; background-color: #fde593;}
#full_menu div {text-align: center;}
#full_menu div.menu_chapter {font-weight: bold;}
#full_menu div.chapter_menu:not(:last-child) {margin-top: 10px; margin-bottom: 15px;}
#full_menu div a {padding: 0 5px;}
#full_menu div a:not(:last-child) {border-right: 1px solid #000;}
#full_menu div a:first-child {padding-left: 0}
#full_menu div a:last-child {padding-right: 0;}

#middle {padding: 10px; text-align: center; background-color: #fff8b6;}
#middle #sub_menu {margin-top: 10px;}
#middle #sub_menu a:not(:last-child):not(#open_filter) {padding-right: 7px; border-right: 1px solid #000; margin-right: 7px;}

#content {padding: 20px;}
#content .div_table {margin-right: auto; margin-left: auto;}
#filter {margin: 0 15px;}


/* === TABLES === */

ul.div_table {padding-left: 0px; min-width: 400px;}
ul.div_table li span {padding: 3px 16px; vertical-align: middle; height: 30px;}

ul.div_table.grid_view li span {border-top: 1px solid #DDD; border-left: 1px solid #DDD;}
ul.div_table.grid_view li span:last-child {border-right: 1px solid #DDD;}
ul.div_table.grid_view li:last-child span {border-bottom: 1px solid #DDD;}

ul.div_table.row_view li span {border-top: 1px solid #DDD;}
ul.div_table.row_view li:last-child span {border-bottom: 1px solid #DDD;}

ul.div_table.row_grid_view li span {border-top: 1px solid #DDD;}
ul.div_table.row_grid_view li:last-child span {border-bottom: 1px solid #DDD;}
ul.div_table.row_grid_view li span:first-child {border-left: 1px solid #DDD;}
ul.div_table.row_grid_view li span:last-child {border-right: 1px solid #DDD;}
ul.div_table.row_grid_view li.grid_row span {border-left: 1px solid #DDD;}
ul.div_table.row_grid_view li.grid_row:last-child span {border-bottom: 1px solid #DDD;}


ul.div_table.head_row li:first-child span {color: #555; font-weight: bold; text-align: center; background: #f3f3f3;}
ul.div_table.summary_row li:last-child span {background: #f3f3f3; color: #555;} 
ul.div_table.head_column li span:first-child {background: #f3f3f3; color: #555;}
ul.div_table li.empty_row span {background: #f3f3f3; color: #555; height: 15px;}
ul.div_table li.highlight_row span {color: #555; font-weight: bold; background: #f3f3f3;}
ul.div_table li.italic_row span {color: #AAA; font-style: italic;}
ul.div_table li.italic_row span p {color: #AAA; font-style: italic;}

ul.div_table span.but_cell {width: 1px; text-align: center; padding: 1px 0px;}

ul.div_table.sort_table.head_row > li:first-child > span:not([data-ts-disable*='true']):not(:empty) i.fa-sort {color: #AAA;}
ul.div_table.sort_table.head_row > li:first-child > span:not([data-ts-disable*='true']):not(:empty) {cursor: pointer; position: relative; }
ul.div_table.sort_table.head_row > li:first-child > span:not([data-ts-disable*='true']):not(:empty) i {position: absolute; top: 1px; right: 1px; color: #000;}

ul.div_table.highlight_row li:hover span {background: #f3f3f3;}
ul.div_table.highlight_row li:hover span .btn_icon {background-color: transparent;}
ul.div_table.highlight_row li:hover span .btn_icon:hover {background-color: #F0F1F1;}
ul.div_table.highlight_cell span:hover {background: #f3f3f3;}


.progress_bar {vertical-align: middle; width: 100px; margin: 0px auto;}
.progress_bar .progress {position: relative; height: 20px; overflow: hidden; background: none repeat scroll 0% 0% #d9d9d9; border-radius: 0px; margin: 0; padding: 0; vertical-align: middle;}
.progress_bar .bar {position: absolute; height: 20px; top: 0;left: 0; color: #FFF; background: none repeat scroll 0% 0% #888; border-radius: 0px; box-sizing: border-box; margin: 0; padding: 0;}
.progress_bar .bar_nofill {background-color: #d9d9d9;}
.progress_bar .bar_success {background-color: #84B761;}
.progress_bar .bar_warning {background-color: #FDD400;} /* ffba47 */
.progress_bar .bar_error {background-color: #D66C6D;}
#report_table .progress_bar .progress {width: 100px;}

.div_table .precat {color: #999; font-weight: normal;}
.money {text-align: right;}
.div_chart {max-width: 800px; min-width: 300px; height: 250px; margin: 0 auto;}

.tr_day_clnd, .tr_ttl_cr, .tr_comm, .acc_ttl_cr, .dim {color: #999;}
.li_switched_off span, .li_switched_off span a {color: #AAA;}

ul.div_table#report_table li span {padding: 3px 8px;}
#jkh_table {display: none;}
#jkh_table_2 b {font-weight: normal;}
#jkh_table_2 input {width: auto;}

/* === FORMS === */


input, textarea, select {color: rgba(0, 0, 0, 0.6); background-color: #fafafa; border-radius: 2px; border: 1px solid #40B175; padding: 6px; width: 100%; height: 28px;}
input:not(.btn):focus, textarea:focus, select:focus {background: #fafafa; border: 1px solid #e0e0e0;}
input[disabled], input[readonly] {background-color: #ccc;}
input[disabled]:focus, input[readonly]:focus {background-color: #ccc;}
textarea {height: 80px;}
select option:checked, select option:hover {box-shadow: 0 0 10px 100px #40B175 inset;}
input::placeholder, textarea::placeholder {color: #CCC;} 
input:focus::placeholder, textarea:focus::placeholder {color: transparent;}


form .div_table_cell {vertical-align: middle; padding-bottom: 4px;}
form .div_table_row:last-child .div_table_cell {padding-bottom: 0px;}
form .div_table_cell input, form .div_table_cell select, form .div_table_cell textarea {width: 100%;}
form .div_table_cell input[type=checkbox] {width: auto; height: auto;}
form.view1 .div_table_cell:nth-child(1) {width: 140px; font-weight: 700; text-align: left; padding-right: 10px;}
form.view1 .div_table_cell:nth-child(2) {width: 250px;}
/* form.view1 .div_table_cell:nth-child(3) {vertical-align: top; padding: 5px;} */
form.view2 .div_table {width: 800px;}
form.view2 .div_table_cell {height: 31px; padding: 3px;}
form input.submit_button, form input.cancel_button, form input.delete_button, form input.reset_button /*, #more_button */ {width: auto;}

form .div_table_row.with_hint .div_table_cell, form .with_hint.div_table_cell {padding-bottom: 0px;}
form .div_table_cell .hint {display: block; font-size: 11px; padding: 2px 0; color: rgba(0, 0, 0, 0.6); font-weight: normal;}

form .div_res .msg {margin: 0 0px 10px;}

.login {margin: 6% auto; width: 250px; padding: 25px 30px; border: 4px solid #ddd; background-color: #FFF;}
.login h1 {text-align: center; padding: 25px 0px;}
.login h3 {text-align: center; font-size: 18px;color: #898989; margin-bottom: 20px;}
.login form input, .login form input.submit_button {width: 100%; margin-bottom: 10px; height: 38px;}
.login a {color: #898989;}
.login div.div_table {margin-top: 20px;}

#filter {display: none;}
#process {text-align: center;}
#process .fa-spinner {font-size: 22px; margin: 15px; color: #20655f;}

a.cat_tree {position: absolute; left: -20px;}
a.cat_tree i.fa {font-size: 18px; color: #AAA;}

.hotcat, .hottrans {display: inline-block; margin: 5px;}

#comment_info {padding-bottom: 4px; font-style: italic;}

#comment_area {color: rgba(0, 0, 0, 0.6); background-color: #fafafa; border-radius: 2px; border: 1px solid #40B175; border-top: 0px solid #40B175; padding: 0px 0px;}
#comment_area .comment_input {border: 0px solid #40B175; border-top: 1px solid #40B175; border-radius: 0px;}
#comment_area #comment {border-top: 1px solid #40B175;}

.comment_tags {padding: 2px 6px;}
.comment_tags a {display: inline-block; margin: 5px;}

.comment_input + .comment_tags {display: none;}
.comment_input:focus + .comment_tags {display: block;}
.comment_tags:focus, .comment_tags:hover {display: block;}

#filed_tags_area {color: rgba(0, 0, 0, 0.6); background-color: #fafafa; border-radius: 2px; border: 1px solid #40B175; border-top: 0px solid #40B175;}
#filed_tags_area .field_input {border: 0px solid #40B175; border-top: 1px solid #40B175; border-radius: 0px;}

.field_tags {padding: 2px 6px;}
.field_tags a {display: inline-block; margin: 5px;}

.field_input + .field_tags {display: none;}
.field_input:focus + .field_tags {display: block;}
.field_tags:focus, .field_tags:hover {display: block;}


/* === RESPONSIVE === */

@media all and (max-width: 875px) {
	body, tr, td, p, a, form, input, textarea, select, h1, h2, h3, h4, ul, ol, li, msg, label, button {font-size: 11px;}
	h1 {font-size: 16px;}
	h2 {font-size: 14px;}
	
	#top, #middle, #content {padding: 10px 0px;}	
	#middle .div_row, #top .div_row {margin-bottom: 5px;}
	.div_row {margin-bottom: 10px;}
	
	.div_table {width: 100%;}
	.div_table_cell {height: 31px; padding: 3px;}
	ul.div_table li span {padding: 3px 6px;}
	.space {min-width: 100px;}
	#report_table .progress_bar .progress {width: 50px;}
	
	
	form .div_table, form.view2 .div_table {width: 100%;}
	form.view1 .div_table_cell:nth-child(1) {width: auto;}
	form.view1 .div_table_cell:nth-child(2) {width: 70%;}
	input, textarea, select {height: 26px;}

	#form_res {text-align: center;}
	
	.hide1 {display: none !important;}
}

@media all and (max-width: 500px) {
	ul.div_table {min-width: auto;}
	ul.div_table li span {height: 26px;}
	.space {min-width: 50px;}		
	.hide2 {display: none !important;}
}

@media all and (min-width: 875px) {
	.ohide1 {display: none !important;}
}

