@charset "utf-8";
/* CSS Document */


#menuWrap {
    width:100%;
    border-collapse: collapse;
}

#menu {
    width:100%;	
}

#menu td {
    border-collapse: collapse;
    border: 1px solid black;
	padding: 0px 5px 0px 5px;
	text-align:center;
}

#menu td:hover {
	background-color: #89CA82;
}

#menu a {
	color: #000;
	text-decoration: none;	
}

*{
	padding:0px;
	margin:0px;
	border:0px;
	outline:none;
	-moz-outline-style:none;
	}

body{
	margin:0px 0px 0px 0px;
	font-family:"Lucida Sans Unicode", Arial, sans-serif;
	height:100%;
	font-size: 0.9em;
	background-color:#ACA;
	}

#masterContainer{
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	position:absolute;
	width:950px;
	height:100%;
	left:50%;
	margin-left:-475px;
	}

#topContainer{
	margin: 0 auto;
	padding: 0px 0px 0px 0px;
	position:relative;
	width:100%;
	height:100px;
	background-color: #DFD;
	vertical-align: middle;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	}

.headTable {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
	background-color: #B9FAB2;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	}

.headTable td{
	font-size:9px;
	overflow:hidden;
	word-break:normal;
	width:100%;
	}

#topInnerUpperContainer{
	margin: 0 auto;
    padding: 0px 0px 0px 0px;
	width: 775px;
	height: 30%;
	}

.customerLabel {
	margin: 12px 0px 0px 0px;
	font-size:11px;
    background: #99EE99;
	color: #000000;
	width: 150px;
	height: 16px;
	float: left;
	text-align:center;
    padding: 2px 0px 3px 0px;
    border: 1px solid #000000;
	}

.selectCustomername {
    margin: 12px 0px 0px 13px;
    padding: 2px 0px 2px 0px;
    width: 350px;
	float: left;
	background-color: #99EE99;
    border: 1px solid #000000;			
}

#customerNumber {
	margin: 12px 0px 0px 13px;
	font-size:11px;
    background: #99EE99;
	color: #000000;
	width: 150px;
	height: 16px;
	float: left;
	text-align:center;
    padding: 2px 0px 3px 0px;
    border: 1px solid #000000;
}

#navButtonContainer {
    margin: 13px 0px 0px 13px;
    padding: 0px 0px 0px 0px;
	float: left;
    border: 1px solid #000000;
}

.beginning {
	padding: 0px 0px 0px 0px;
    border:0px;
	float: left;
}

.previous {
	padding: 0px 0px 0px 0px;
    border:0px;
	float: left;
}

.next {
	padding: 0px 0px 0px 0px;
    border:0px;
	float: left;
}

.end {
	padding: 0px 0px 0px 0px;
    border:0px;
	float: left;
}

#topInnerMiddleContainer{
	margin: 0 auto;
	padding: 5px 0px 0px 0px;
	width: 775px;
	text-align:center;
	height: 15%;
	font-size: 12px;
	}

#topInnerMiddleContainer a {
	color: #0000FF;
    padding: 0px 8px 0px 8px;
	text-decoration: none;
	}

#topInnerLowerContainer{
	margin: 0 auto;
	padding: 8px 0px 0px 0px;
	width: 775px;
	text-align:center;
	height: 20%;
	font-size: 12px;
	}

#topInnerLowerContainer a {
	color: #44AA44;
	text-decoration: none;
	}

#middleContainer{
	margin:0 auto;
	padding:0px 0px 0px 0px;
	position:relative;
	width: 100%;
	height:auto;
	background-color: #F0FFF0;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	}

#middleInnerContainer {
	margin: 0 auto;
	width: 850px;
	height: 100%;
	}

#middleLeftContainer{
	margin:0 auto;
	position:relative;
	width:50%;
	height:60%;
	float: left;
	}

#middleLeftInnerVerticalBuffer{
	margin:0 auto;
	position:relative;
	width:100%;
	height:5%;
	float: left;
	}

#middleLeftInnerLeftBuffer{
	margin:0 auto;
	position:relative;
	width:8%;
	height:94%;
	float: left;
	}

#middleLeftInnerLeft{
	margin:0 auto;
	position:relative;
	width:25%;
	height:94%;
	float: left;
	}

#middleLeftInnerRight{
	margin:0 auto;
	position:relative;
	width:67%;
	height:94%;
	float: left;
	}

#middleRightContainer{
	margin:0 auto;
	position:relative;
	width:50%;
	height:60%;
	float: left;
	}

#middleRightInnerVerticalBuffer{
	margin:0 auto;
	position:relative;
	width:100%;
	height:5%;
	float: left;
	}

#middleRightInnerLeftBuffer{
	margin:0 auto;
	position:relative;
	width:1%;
	height:94%;
	float: left;
	}

#middleRightInnerLeft{
	margin:0 auto;
	position:relative;
	width:21%;
	height:94%;
	float: left;
	}

#middleRightInnerRight{
	margin:0 auto;
	position:relative;
	width:70%;
	height:94%;
	float: left;
	}

#middleBottomContainer{
	margin:0 auto;
	position:relative;
	width: 100%;
	height:40%;
	float: left;
	}

#middleBottomLeftBuffer{
	margin:0 auto;
	position:relative;
	width:6%;
	height:100%;
	float: left;
	}

.infoLabel {
	display: table-row;
	font-size: 11px;
	color: #222;
    height: 20px;
	text-decoration:underline;
	}

.infoLabelNoULine {
	font-size: 11px;
	text-decoration:none;
    height: 20px;
	}

.resultLable {
	display: table-row;
	font-size: 11px;
	color: #222;
    height: 20px;
	}

#customerEditBar{
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	position:relative;
	width:100%;
	height:auto;
	border-right: 1px solid #000;
	border-left: 1px solid #000;
	border-bottom: 1px solid #000;
	}

#botContainer{
	margin:0px 0px 0px 0px;
	padding:1px 0px 0px 1px;
	position:relative;
	width:100%;
	height:auto;
	border-top: 1px solid #000;
	overflow:auto;
	}

#footerContainer{
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	position:relative;
	width:100%;
	height:10px;
	}

.customerBar {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
	background-color: #B9FAB2;
	}

.customerBar td{
	font-family:Arial, sans-serif;
	font-size:12px;
	padding: 2px 10px;
	overflow:hidden;
	word-break:normal;
	width:50%;
	}

.customerBarEdit {
	background-color: #89CA82;
    text-align: center;
	}

/* Formatting for the ticket display */

.ticketEditWrapper {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
	background-color: #B9FAB2;
    border: 1px solid #000;
	}

.ticket {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
	background-color: #B9FAB2;
	}

.ticket td{
	font-family:Arial, sans-serif;
	font-size:12px;
	padding: 2px 10px;
	overflow:hidden;
	word-break:normal;
	width:50%;
	}

.ticketEdit {
	background-color: #89CA82;
    text-align: center;
	}

#textPayComment {
	font-family:Arial, sans-serif;
	font-size:11px;
	width: 340px;
	height: 50px;
	border: 1px solid #89CA82;
	padding: 1px 1px;
}

.submit-btn-style{
	border : solid 2px #397a32;
	border-radius : 3px;
	moz-border-radius : 3px;
	font-size : 11px;
	color : #171a00;
	padding : 1px 10px;
	background : #64b064;
	background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#64b064), color-stop(100%,#e4f2df));
	background : -moz-linear-gradient(top, #64b064 0%, #e4f2df 100%);
	background : -webkit-linear-gradient(top, #64b064 0%, #e4f2df 100%);
	background : -o-linear-gradient(top, #64b064 0%, #e4f2df 100%);
	background : -ms-linear-gradient(top, #64b064 0%, #e4f2df 100%);
	background : linear-gradient(top, #64b064 0%, #e4f2df 100%);
	filter : progid:DXImageTransform.Microsoft.gradient( startColorstr='#64b064', endColorstr='#e4f2df',GradientType=0 );
}

.textLeft {
	text-align:left;
	}

.textRight {
	text-align:right;
    text-decoration:underline;
	}

.tickets  {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	}

.tickets th {
	font-family:Arial, sans-serif;
	font-size:12px;
	font-weight:bold;
	padding:0px 0px;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	word-break:normal;
	}

.tickets td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:0px 0px;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	word-break:normal;
	text-align:center;
	}

.tickets td a {
    color:#0000FF;
    text-decoration: none;
	}

.openTicketHeader {
	background-color: #BBFFBB;
    text-align: center;
	}

.closedTicketHeader {
	background-color: #FFBBBB;
    text-align: center;
	}

.greenPut {
	display: table-row;
	padding: 0px 0px 0px 0px;
    background-color: #BBFFBB;
	border: 1px solid #44AA44;
}

/* this is for popups */

#pup {
  position:absolute;
  z-index:200; /* always on top*/
  padding: 3px;
  margin-left: 10px;
  margin-top: 5px;
  width: 250px;
  border: 1px solid black;
  background-color: #777;
  color: white;
  font-size: 0.95em;
}

.customerTableHeader {
	background-color: #BBFFBB;
    text-align: center;
}

.customerCommentTextBox {
	width:660px;
	height:60px;
    background-color: #BBFFBB;
	border: 1px solid #44AA44;
}

#customer {
    width:100%; 
    border-collapse: collapse;
	background:#F0FFF0;
	height: 220px;
}

#customer td {
    border: 0px solid #000;
    padding: 0px 0px 12px 0px;
}

#customerDetailHeader {
    width:90%;
    margin-left:5%; 
    margin-right:5%;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
}

#customerDetailHeader td {
    border: 0px solid #00FF00;
    font-size: 0.8em;
    padding: 2px 0px 2px 5px;
}

#customerDetailHeader tr.alt td {
    color: #000000;
    background-color: #E0EEE0;
}

#customerDetailHeader td.space {
    padding: 6px 0px 2px 5px;
}

#customerDetailHeader td.static {
    width: 110px;
	font-weight:bold;
}

#product {
    width:100%; 
    border-collapse: collapse;
	background:#F0FFF0;
	height: 100px;
}

#product td {
    border: 0px solid #000;
    padding: 4px 0px 4px 0px;
}

#productDetailHeader {
    width:60%;
    margin-left:20%; 
    margin-right:20%;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    text-align:center;
}

#productDetailHeader tr.alt td {
    color: #000000;
    background-color: #E0EEE0;
}

#productDetailHeader td.space {
    padding: 6px 0px 2px 5px;
}

#productDetailHeader td.static {
    width: 110px;
	font-weight:bold;
}

.products {
	margin: 5px 0px 0px 0px;
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	}

.products th {
	font-family:Arial, sans-serif;
	font-size:12px;
	font-weight:bold;
	padding:4px 4px;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	word-break:normal;
	}

.products td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:0px 0px 0px 5px;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
	}

.products td a {
    color:#0000FF;
    text-decoration: none;
	}

.productsHeader {
	background-color: #BBFFBB;
    text-align: center;
	}

#initial {
    width:100%; 
    border-collapse: collapse;
	background:#F0FFF0;
	height: 100px;
}

#initial td {
    border: 0px solid #000;
    padding: 4px 0px 4px 0px;
}

#initialDetailHeader {
    width:60%;
    margin-left:20%; 
    margin-right:20%;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    text-align:center;
}

#initialDetailHeader tr.alt td {
    color: #000000;
    background-color: #E0EEE0;
}

#initialDetailHeader td.space {
    padding: 6px 0px 2px 5px;
}

#initialDetailHeader td.static {
    width: 110px;
	font-weight:bold;
}

.initials {
	margin: 5px 0px 0px 0px;
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	}

.initials th {
	font-family:Arial, sans-serif;
	font-size:12px;
	font-weight:bold;
	padding:4px 4px;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	word-break:normal;
	}

.initials td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:0px 0px 0px 5px;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
	}

.initials td a {
    color:#0000FF;
    text-decoration: none;
	}

.initialsHeader {
	background-color: #BBFFBB;
    text-align: center;
	}

#admin {
    width:100%; 
    border-collapse: collapse;
	background:#F0FFF0;
	height: 180px;
}

#admin td {
    border: 0px solid #000;
    padding: 4px 0px 4px 0px;
}


#adminDetailHeader {
    width:60%;
    margin-left:20%; 
    margin-right:20%;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    text-align:left;
}

#adminDetailHeader th {
    text-align:center;
}

#adminDetailHeader tr.alt td {
    color: #000000;
    background-color: #E0EEE0;
}

#adminDetailHeader td.space {
    padding: 6px 0px 2px 5px;
}

#tank {
    width:100%; 
    border-collapse: collapse;
	background:#F0FFF0;
	height: 180px;
}

#tank td {
    border: 0px solid #000;
    padding: 0px 0px 12px 0px;
}

#tankDetailHeader {
    width:90%;
    margin-left:5%; 
    margin-right:5%;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
}

#tankDetailHeader td {
    border: 0px solid #00FF00;
    font-size: 0.8em;
    padding: 2px 0px 2px 5px;
}

#tankDetailHeader tr.alt td {
    color: #000000;
    background-color: #E0EEE0;
}

#tankDetailHeader td.space {
    padding: 6px 0px 2px 5px;
}

#tankDetailHeader td.static {
    width: 110px;
	font-weight:bold;
}

#search {
    width:100%; 
    border-collapse: collapse;
	background:#F0FFF0;
	height: 220px;
}

#search td {
    border: 0px solid #000;
    padding: 4px 0px 4px 0px;
}

#searchDetailHeader {
    width:60%;
    margin-left:20%; 
    margin-right:20%;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    text-align:left;
}

#searchDetailHeader th {
    text-align:center;
}

#searchDetailHeader tr.alt td {
    color: #000000;
    background-color: #E0EEE0;
    padding: 2px 5px 2px 5px;
}

#searchDetailHeader tr td {
    color: #000000;
    padding: 2px 5px 2px 5px;
}

#reportContainer{
	margin:0px 0px 0px 0px;
	padding:1px 0px 0px 1px;
	position:relative;
	width:100%;
	height:auto;
	border-top: 0px solid #000;
	overflow:auto;
	}




.users  {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	}

.users th {
	font-family:Arial, sans-serif;
	font-size:12px;
	font-weight:bold;
	padding:0px 0px;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	word-break:normal;
	}

.users td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:0px 0px;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	word-break:normal;
	text-align:center;
	}

.users td a {
	color:#0000FF;
	text-decoration: none;
	}

.userHeader {
 	background-color: #BBFFBB;
  	text-align: center;
	}









/*
 The following are all used on the reports page. Consider putting them into a separate CSS file that is only
 loaded on the reports page?
*/

#projectionReport  {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	color:#090;
	}

#projectionReport td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 4px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
	}

#projectionReport tr.alt td {
    font-weight:bold;
    font-size:13px;
}

#projectionReport tr.title td {
    font-weight:bold;
    font-size:16px;
	text-align:center;
}

#projectionReport tr.date td {
    font-size:12px;
	text-align:center;
}

#projectionReport td a {
    color:#090;
    text-decoration: none;
}

#CAIReport  {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	color:#090;
	}

#CAIReport td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 4px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
	}

#CAIReport tr.alt td {
    font-weight:bold;
    font-size:13px;
}

#CAIReport tr.title td {
    font-weight:bold;
    font-size:16px;
	text-align:center;
}

#CAIReport tr.date td {
    font-size:12px;
	text-align:center;
}

#CAIReport td a {
    color:#090;
    text-decoration: none;
}

#CSReport  {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	color:#090;
	}

#CSReport td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 4px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
	}

#CSReport tr.alt td {
    font-weight:bold;
    font-size:13px;
}

#CSReport tr.title td {
    font-weight:bold;
    font-size:16px;
	text-align:center;
}

#CSReport tr.date td {
    font-size:12px;
	text-align:center;
}

#CSReport td a {
    color:#090;
    text-decoration: none;
}


#lateFeeReport  {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	color:#090;
    line-height: 8px;
	}

#lateFeeReport td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 4px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
    vertical-align: top;
}

#lateFeeReport tr.alt td {
    font-weight:bold;
    font-size:13px;
}

#lateFeeReport tr.title td {
    font-weight:bold;
    font-size:16px;
	text-align:center;
}

#lateFeeReport tr.date td {
    font-size:12px;
	text-align:center;
}

#lateFeeReport td a {
    color:#090;
    text-decoration: none;
}


#lateFeeTicketList {
	border-collapse: collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	color:#090;
    line-height: 4px;
}



.red {
    width:200px;
    color:#F00;
}

.address {
    width:400px;
}

.statementLabel {
    width: 100px;
	text-align: right;
}

.statementDate {
    text-align: left;
}

#gallonsByDate  {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	color:#090;
    line-height: 8px;
	}

#gallonsByDate td.l {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 2px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
    vertical-align: top;
}

#gallonsByDate td.r {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 2px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:right;
    vertical-align: top;
}



#levelPayReport  {
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
	background-color: #EEE;
	color:#090;
    line-height: 14px;
	}

#levelPayReport td {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 4px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
    vertical-align: top;
}

#levelPayReport tr.alt td {
    font-weight:bold;
    font-size:13px;
}

#levelPayReport tr.title td {
    font-weight:bold;
    font-size:16px;
	text-align:center;
}

#levelPayReport tr.date td {
    font-size:12px;
	text-align:center;
}

#levelPayReport td a {
    color:#090;
    text-decoration: none;
}


#levelPayReport td.l {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 2px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:left;
    vertical-align: top;
}

#levelPayReport td.r {
	font-family:Arial, sans-serif;
	font-size:12px;
	padding:8px 2px;
	border-style:solid;
	border-width:0px;
	overflow:hidden;
	word-break:normal;
	text-align:right;
    vertical-align: top;
}