/* BODY */

html { height:100%; width:100%; }

body { width:100%; height:100%; margin:0; padding:0; font-size:12px; font-family:Arial,sans-serif; color:#000; background:#fff; overflow-y:hidden; }

/* LINKS */
a:link, a:visited { color:#0000cc; text-decoration:none; }
a:hover { color: #d12020; }
a:active, a:focus { outline: 0; }

/* GLOBAL DEFAULTS */
input, textarea, button { border: 1px solid #cccccc; font-size:12px; font-family:Arial,sans-serif; outline: 0; }
input[type="text"] { width:150px; }
input[type="password"] { width:150px; padding-left:3px; }
input[type="text"] { padding-left:3px; }
textarea { width:153px; padding-left:3px; }

.corners {
    -moz-border-radius:5px 5px 5px 5px;
    -webkit-border-radius:5px 5px 5px 5px;
}
form input[type="text"], input[type="password"] { border-top:1px solid #666666; }

.button-content {
    line-height:1.6666em;
    display:inline-block;
    vertical-align:middle;
    color:#000;
}

button, input[type="submit"], a.button {
    padding:0 .5em;
    height:22px;
    border:1px solid #ccc;
    background-image:-moz-linear-gradient(top,#ffffff,#efefef);
    background-image:-webkit-gradient(linear,left top,left bottom,from(#ffffff),to(#efefef));
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    white-space:nowrap;
    vertical-align:middle;
    cursor:pointer;
    overflow:visible;
}

button::-moz-focus-inner, input[type="submit"]::-moz-focus-inner {   
    border: 0px;
}

button:hover, input[type="submit"]:hover, a.button:hover, 
button:focus, input[type="submit"]:focus, a.button:focus {
    border-color:#999;
    background-image:-moz-linear-gradient(top,#ffffff,#ebebeb);
    background-image:-webkit-gradient(linear,left top,left bottom,from(#ffffff),to(#ebebeb));
    -moz-box-shadow:0 0 3px #999;
    -webkit-box-shadow:0 0 3px #999;
}

button:active, input[type="submit"]:active, a.button:active {
    border-color:#999;
    background-image:-moz-linear-gradient(top,#cccccc,#ffffff);
    background-image:-webkit-gradient(linear,left top,left bottom,from(#cccccc),to(#ffffff));
}

a.button {
    display:inline-block;
}

a.button .button-content {
    line-height:1.8em;
}

form select {
    border: 1px solid #cccccc;
    font-size: 12px;
    font-family: Arial,sans-serif;
    border-top:1px solid #666666;
    background: #fff;
    outline: 0;
}

.hidden { display:none; }

/* PAGE STRUCTURE */

#header { padding-top:4px; height:70px; display:table; }

#header img { display:table-cell; }

div#content {
    display:table;
    width:100%;
    height:100%;
}

#desktop {
    display:table-cell;
    padding-left:7px;
    width:100%;
}

.window {
    border-top:1px solid #085aa0;
    border-left:2px solid #085aa0;
    border-right:2px solid #085aa0;
    border-bottom:4px solid #085aa0;
    display:inline-block;
}
.window-title {
    font-size:13px;
    background: #085aa0;
    font-weight:bold;
    border-bottom:1px solid #aaa;
    height:21px;
    line-height:21px;
    color:#ffffff;
    padding-left:10px;
}
.window-content {
    padding:20px;
    overflow:auto;
    background:#fff;
    min-height:126px;
    min-width:252px;
}

#info {
    vertical-align:top;
    width:100%;
    display:table-cell;
    padding-right:20px;
    padding-top:4px;
    text-align:right;
}

#info-menu {
    margin-bottom:8px;
    padding-bottom:3px;
}

.jclock { float:right; font-weight:bold; }

#lock {
    position:absolute;
    top:0;
    left:0;
    z-index:9000;
    width:100%;
    height:100%;
    background-color:white;
    opacity:0.5;
}

#lock-inner {
    width:100%;
    height:100%;
    z-index:9000;
    background-color:white;
    opacity:0.5;
}

#lock-wrap {
    z-index:9000;
    display:inline-block;
    background-color:white;
    opacity:0.5;
}

/* MESSAGES & ERRORS */
div#flash-messages {
    background:#fff1a8;
    position:absolute;
    z-index:9999;
    -moz-border-radius:5px 5px 5px 5px;
    -webkit-border-radius:5px 5px 5px 5px;
}

div#flash-messages p {
    color:#000000;
    padding:4px 9px 4px 9px;
    margin:0px;
    font-weight:bold;
}

.error-message {
    font-size: 11px;
    color: #ff0000;
    margin-bottom:2px;
    text-align: left;
}

div#loading {
    display:none;
    position:absolute;
    z-index:9999;
    background:#fff1a8;
    -moz-border-radius:0px 0px 5px 5px;
    -webkit-border-radius:0px 0px 5px 5px;
}

div#loading p {
    color:#000000;
    padding:4px 9px 4px 9px;
    margin:0px;
    font-weight:bold;
}

div#loading-timeout {
    display:none;
    position:absolute;
    z-index:9999;
    background:#fff1a8;
    -moz-border-radius:0px 0px 5px 5px;
    -webkit-border-radius:0px 0px 5px 5px;
}

div#loading-timeout p {
    color:#000000;
    padding:4px 9px 4px 9px;
    margin:0px;
    font-weight:bold;
}


/* TABLES */
table.form-box { border-collapse:collapse; border: none; }
table.form-box tr td:first-child { text-align:right; vertical-align:middle; padding-top:3px; }
table.form-box tr th:first-child { text-align:right; vertical-align:middle; padding-top:3px; }
table.form-box tr td { border: none; padding-top:3px; }
table.form-box tr:last-child td { padding-top:10px; }

table.checkbox-table { border-collapse:collapse; }
table.checkbox-table tr td { padding-right:20px; height:22px; }
table.checkbox-table tr * { border-bottom:1px #bbbbbb solid; }
table.checkbox-table thead tr * { border: none; }
table.checkbox-table thead tr:first-child * {
    height:24px;
    padding:5px 20px 5px 0px;
    text-align:left;
    background-color:#eee;
}
table.checkbox-table tr td:first-child { padding-right:5px; }
table.checkbox-table tr.discarded * { text-decoration: line-through; }

table.plain-table { border-collapse:collapse; }
table.plain-table tr td { padding-right:20px; padding:2px; height:22px; }
table.plain-table tr * { border-bottom:1px #bbbbbb solid; }
table.plain-table thead tr * { border: none; }
table.plain-table thead tr:first-child * {
    height:24px;
    padding:5px 20px 5px 0px;
    text-align:left;
    background-color:#eee;
}
table.plain-table tr.sum td {
    font-weight:bold;
    padding-top:4px;
    padding-left:2px;
    padding-right:2px;
    border-bottom:0px;
}

table tbody tr.selected td { background-color: #ccc; }

/* OTHER */
div.copyright { text-align:center; font-size:10px; margin-bottom:10px; }

div.grippie {
    background:#EEEEEE url('/public/images/grippie.png') no-repeat scroll center 2px;
    border-color:#aaa;
    border-style:solid;
    border-width:0pt 1px 1px;
    cursor:s-resize;
    height:9px;
    overflow:hidden;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
}

.resizable-textarea textarea {
    display:block;
    margin-bottom:0pt;
    width:95%;
    height: 20%;
}

ul.reports {
    margin-top:5px;
    padding-left:30px;
}

a.quit {
    background: url('/public/images/quit1.png') no-repeat right center;
}

a.quit:hover {
    background: url('/public/images/quit2.png') no-repeat right center;
}

.note { padding: 30px 10px 0px 10px; }
ul.menu {
    display:table-cell;
    vertical-align:top;
    padding-right:3px !important;
}

ul.menu, ul.menu ul {
    list-style-type:none;
    margin:0;
    padding:0;
    min-width:180px;
}

ul.menu a {
    display: block;
    text-decoration: none;	
}

ul.menu li:first-child {
    margin-top:0px !important;
}

ul.menu li {
    margin-top: 1px;
}

ul.menu li a {
    background: #085aa0;
    color: #fff;	
    padding: 0.5em;
    outline:0;
}

ul.menu li a:hover {
    background: #000;
}

ul.menu li ul li a {
    background: #ccc;
    color: #000;
    padding-left: 20px;
}

ul.menu li ul li a:hover {
    background: #aaa;
    border-left: 5px #000 solid;
    padding-left: 15px;
}


table.jCalendar {
	border: 1px solid #000;
	background: #aaa;
    border-collapse: separate;
    border-spacing: 2px;
}
table.jCalendar th {
	background: #333;
	color: #fff;
	font-weight: bold;
	padding: 3px 5px;
}

table.jCalendar td {
	background: #ccc;
	color: #000;
	padding: 3px 5px;
	text-align: center;
}
table.jCalendar td.other-month {
	background: #ddd;
	color: #aaa;
}
table.jCalendar td.today {
	background: #666;
	color: #fff;
}
table.jCalendar td.selected {
	background: #f66;
	color: #fff;
}
table.jCalendar td.selected.dp-hover {
	background: #f33;
	color: #fff;
}
table.jCalendar td.dp-hover,
table.jCalendar tr.activeWeekHover td {
	background: #fff;
	color: #000;
}
table.jCalendar tr.selectedWeek td {
	background: #f66;
	color: #fff;
}
table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {
	background: #bbb;
	color: #888;
}
table.jCalendar td.unselectable,
table.jCalendar td.unselectable:hover,
table.jCalendar td.unselectable.dp-hover {
	background: #bbb;
	color: #888;
}

/* For the popup */

/* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */

div.dp-popup {
	position: relative;
	background: #ccc;
	font-size: 10px;
	font-family: arial, sans-serif;
	padding: 2px;
	width: 171px;
	line-height: 1.2em;
}
div#dp-popup {
	position: absolute;
	z-index: 199;
}
div.dp-popup h2 {
	font-size: 12px;
	text-align: center;
	margin: 2px 0;
	padding: 0;
}
a#dp-close {
	font-size: 11px;
	padding: 4px 0;
	text-align: center;
	display: block;
}
a#dp-close:hover {
	text-decoration: underline;
}
div.dp-popup a {
	color: #000;
	text-decoration: none;
	padding: 3px 2px 0;
}
div.dp-popup div.dp-nav-prev {
	position: absolute;
	top: 2px;
	left: 4px;
	width: 100px;
}
div.dp-popup div.dp-nav-prev a {
	float: left;
}
/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {
	cursor: pointer;
}
div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {
	cursor: default;
}
div.dp-popup div.dp-nav-next {
	position: absolute;
	top: 2px;
	right: 4px;
	width: 100px;
}
div.dp-popup div.dp-nav-next a {
	float: right;
}
div.dp-popup a.disabled {
	cursor: default;
	color: #aaa;
}
div.dp-popup td {
	cursor: pointer;
}
div.dp-popup td.disabled {
	cursor: default;
}

a.dp-choose-date {
    float: left;
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 3px;
    text-indent: -2000px;
    overflow: hidden;
    background: url('/public/images/calendar.png') no-repeat; 
}
a.dp-choose-date.dp-disabled {
    background-position: 0 -20px;
    cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
    width: 140px;
    float: left;
}
/* tables */
table.tablesorter {
    text-align: left;
    border-collapse:collapse;
}

table.tablesorter thead tr th, table.tablesorter tfoot tr th {
    background-color: #eee;
    border-right: 1px solid #fff;
    padding: 5px 20px 5px 2px;
    height: 24px;
    color: #000;
}

table.tablesorter thead tr .header {
    background-image: url('/public/images/bg.gif');
    background-repeat: no-repeat;
    background-position: center right;
    cursor: pointer;
}

table.tablesorter tbody td {
    border-bottom: 1px #bbb solid;
    color: #000;
    padding-left: 2px;
    padding-right: 2px;
    background-color: #fff;
    height: 22px;
}

table.tablesorter thead tr .headerSortUp {
    background-image: url('/public/images/asc.gif');
}

table.tablesorter thead tr .headerSortDown {
    background-image: url('/public/images/desc.gif');
}

table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
    background-color: #bbb;
}

table.tablesorter tfoot td {
    font-weight:bold;
    padding-top: 4px;
    padding-left: 2px;
    padding-right: 2px;
    height: 22px;
}

div#login-container {
    width:360px;
    height:160px;
    border:1px solid #cccccc;
    margin:-200px 0 0 -200px;
    position:fixed;
    top:50%;
    left:50%;
    padding:10px;
    -moz-box-shadow:0 0 5px #999;
    -webkit-box-shadow:0 0 5px #999;
}

table.login-box { border-collapse:collapse; border: none; margin:15px 0 0 40px; }
table.login-box tr td { border: none; padding-top:3px; }
table.login-box tr td:first-child { text-align:right; vertical-align:middle; padding-top:3px; }
form.account-search select { width:155px; }
form.account-search input#block { width:50px; }
form.account-search input#corpus { width:50px; }

/* ACCOUNT & METERS */
table.account-table { border-collapse:collapse; }
table.account-table td.service { padding-right:2px; text-align:left; }
table.account-table td.month { padding-right:2px; }
table.account-table tr.sum * { font-weight:bold; padding-right:2px; }
table.account-table th { width:70px; padding:5px 2px 5px 2px; background-color:#eee; text-align:center; }
table.account-table tr th { border:1px #bbbbbb solid; }
table.account-table tr td { border:1px #bbbbbb solid; }
table.account-table td:first-child { text-align:left; white-space:nowrap; max-width:150px; overflow:hidden; }
table.account-table td { text-align:right; width:70px; padding:2px 1px 2px 1px; }
table.account-table input[type="text"] { border:none; text-align:right; color:#085aa0; font-weight:bold; width:100%; padding:0px; }

table.account-table-readonly td { padding:2px 2px 2px 2px; }

input#amount_service { width:62px; text-align:right; font-weight:bold; color:#046102; border:none; }
input#amount_fee { width:62px; text-align:right; font-weight:bold; color:#046102; border:none; }
input#amount_total { width:62px; text-align:right; font-weight:bold; color:#046102; border:none; }
input#amount_received { width:60px; text-align:right; font-weight:bold; color:#085aa0; }
input#amount_change { width:60px; text-align:right; font-weight:bold; color:#d12020; background-color: #fff; }

table.meters-table { width: 512px; border-collapse:collapse; }
table.meters-table tr th { border:1px #bbbbbb solid; }
table.meters-table tr td { border:1px #bbbbbb solid; }
table.meters-table td.service { padding-right:2px; white-space:nowrap; }
table.meters-table td:first-child { text-align:left; white-space:nowrap; max-width:150px; overflow:hidden; }
table.meters-table td { text-align:right; padding:2px 1px 2px 1px; }
table.meters-table th { padding:5px 2px 5px 2px; background-color:#eee; text-align:center; }
table.meters-table td input[type="text"] { border:none; text-align:right; color:#085aa0; font-weight:bold; width:100%; padding:0px; }

table.meters-table-readonly td { padding:2px 2px 2px 2px; }

input.disabled { color:#000 !important; background-color:#fff; font-weight:normal !important; }

.dialog {
    z-index:9999;
}

.dialog .window-content {
    min-height: 0px;
    min-width: 0px;
}

.dialog .controls {
    margin-top: 15px;
}

#confirm_button { float:left; }

#discard_button { float:right; }

.select-radio * {
    cursor: default;
}

.payment-redirect {
    padding-bottom: 10px;
    border-bottom: 1px dashed #416cb3;
}

.payment-redirect-title {
    background: url('/public/images/bus.svg') no-repeat left center;
    padding-left: 40px;
}

.account-address {
    background: url('/public/images/house.svg') no-repeat left center;
    padding-left: 40px;
    font-weight: bold;
}
#import-log-form #log {
    width: 600px;
    height: 200px;
}

#print-preview {
    width: 600px;
    height: 200px;
    overflow: auto;
    border: 1px solid #cccccc;
    resize: both;
    font-size: 12px;
    font-family: "Courier New";
    white-space: pre;
}

.appendresponse {
    margin-bottom: 20px;
}

ul#statistic-type-list {
    margin-left:0px;
    padding-left:0px;
    white-space:nowrap;
}

ul#statistic-type-list li {
    display:inline;
    list-style-type:none;
}

ul#statistic-type-list a {
    padding:3px 10px;
}

ul#statistic-type-list a:link, ul#statistic-type-list a:visited {
    color:#fff;
    background-color:#085aa0;
    text-decoration:none;
}

ul#statistic-type-list a:hover {
    color:#fff;
    background-color:#ccc;
    text-decoration:none;
}

.statistic-locality-table select {
    width:155px;
}