html {
	height: 100%; /*STOCK*/
	overflow-y: scroll; /*STOCK*/
	}

body {
	background: url("../image/bg/bg-billers.jpg") top left fixed;
	background-size: cover;
			/* brightness(14%) contrast(42%) grayscale(78%) */
	background: #; /*STOCK*/
	color: ; /*STOCK*/
	font: ; /*STOCK*/
	height: 100%; /*STOCK*/
	}

#wrapper {
	font: 10px verdana; /*STOCK*/
	margin: 0px auto; /*STOCK*/
	min-height: 100%; /*STOCK*/
	text-transform: uppercase;
	width: 848px; /*STOCK*/
	}

#content {
	line-height: 20px;
	padding: 135px 0px 45px; /*STOCK*/
	position: relative; /*STOCK*/
	}

	#content a:link {text-decoration: none; color: #050; }
	#content a:visited {text-decoration: none; color: #050; }
	#content a:hover {text-decoration: none; color: #900; }
	#content a:active {text-decoration: none; color: #060; }

		#index-content {
			padding: 125px 55px 45px;
			}




p {
	margin-top: 12px;
	}

	.alc /* alc=ALWAYS LOWER CASE */ {
		text-transform: lowercase;
		}

.grey {
	filter: grayscale(100%);
	opacity: .27;
	}

/* left-justified horizontal rule */
hr.hr-left {
	border-style: none;
	background-color: #888;
	height: 1px;
	margin: 17px 0px 1px 0px;
	text-align: left;
	width: 50%;
	}

.codered {
	color: #a00;
	}

/* locale-bar */
	#locale-bar {
	background: url("../image/bg/bg-billers.jpg") top left fixed;
	background-size: cover;
		height: 51px;
		padding: 10px 75px 42px;
		position: fixed;
		text-align:center;
		top: 34px;
		width: 698px;
		z-index: 2;
		}

	#locale-bar a:link {text-decoration: none; color: #666; }
	#locale-bar a:visited {text-decoration: none; color: #666; }
	#locale-bar a:hover {text-decoration: none; color: #666; }
	#locale-bar a:active {text-decoration: none; color: #060; }



/*date-time */
#date-time {
	font: 29px free-mono-bold;
	}	

	#date {
		text-transform: capitalize;
		}

		.date-div {
			display: block;
			}
		
	#time {
		font: 52px digital-dismay;
		letter-spacing: 2px;
		margin: 0px auto;
		position: relative;
		text-shadow: 2px 0 0 #000, 0 -2px 0 #000, 0 2px 0 #000, -2px 0 0 #000;
		top: -6px;
		transform: scale(1, .75);
		}

		#tick2 {
			color: rgba(0,255,0, .7);
			padding: 2px 11px 0px 15px;
			}


	#date-time a:link {text-decoration: none; color: #000; }
	#date-time a:visited {text-decoration: none; color: #000; }
	#date-time a:hover {text-decoration: none; color: #111; }
	#date-time a:active {text-decoration: none; color: #000; }

/* date-time */


#to-do {
color: #0c0;
font-size: 14px;
font-weight: bold;
left: 0px;
letter-spacing: 2px;
position: absolute;
text-align: left;
text-transform: lowercase;
top: 16px;
}

#to-do:hover {
filter: brightness(120%);
}




#link {
color: #000;
filter: brightness(85%);
font-size: 14px;
font-weight: bold;
letter-spacing: 2px;
position: absolute;
right: 0px;
text-align: right;
text-transform: lowercase;
top: 16px;
}

#link:hover {
filter: brightness(620%);
}

#link a:link {text-decoration: none; color: #000; }
#link a:visited {text-decoration: none; color: #000; }
#link a:hover {text-decoration: none; color: #0d0; }
#link a:active {text-decoration: none; color: #0d0; }

/* locale-bar */





/* BEGIN billers */
#billers {
	text-align: left;
	}

	#billers h4 {
		border-radius: 7px 7px 0px 0px;
		font: 16px verdana-bold;
		letter-spacing: 1px;
		padding: 5px;
		position: relative;
		text-transform: capitalize;
		top: 14px;
		}

	#billers h5 {
		color: #333;
		font: 10px verdana;
		letter-spacing: 1px;
		margin: -12px 0px -7px 35px;
		position: relative;
		text-align: left;
		text-transform: uppercase;
		top: 7px;
		}

		#billers h5.url {
			text-transform: lowercase;
			}

	#billers table {
/*		background: rgba(200,200,200, .3);   now in sortable  */
		font: 21px free-mono-bold;
		margin: 14px auto;
		table-layout: fixed;
		width: 847px;
		text-transform: capitalize;
  		}

/* for numbering */
	#billers table {
		  counter-reset: no -1;
  		}

		#billers tr {
			  counter-increment: row-num;
	  		}

/* for numbering */



#billers thead {
	font: 17px free-mono-bold;
	background: rgba(0,0,0, .9);
	height: 27px;
	text-transform: uppercase;
	}

	#billers thead:hover {
		}

	#billers th {
		color: #aaa;
		letter-spacing: 1px;
		overflow: hidden;
		padding: 3px 6px 2px 17px;
		text-overflow: ellipsis;
		white-space: nowrap;
		}

		#billers tr:hover {
/*			background: rgba(0,0,0, .5); */
			}

		#billers td {
			border: solid 1px #555;
			padding: 3px 6px 3px 17px;
			}




/* four-column-4 */
/* column one note not visible when viewing page, used for sort order */
			#billers .four-column-one {
				width: 12%;
				}

				.month {
					font-size: 0px;
					}

				.note {
					color: #444;
					font-size: 16px;
					margin-right: 2px;
					text-transform: lowercase;
					}

			#billers .four-column-two {
				width: 22%;
				}

			#billers .four-column-three {
				padding: 3px 0px 3px 0px;
				text-align: center;
				width: 6.1%;
				}

				.autopay-off {
					color: rgba(170,0,0, .3);
					font-size: 17px;
					text-transform: uppercase;
					}

					.autopay-on {
						color: rgba(0,80,0, 1);
						font-size: 17px;
						text-transform: uppercase;
						}

			#billers .four-column-four {
				font-size: 16px;
				overflow: hidden;
				padding-right: 14px;
				text-transform: lowercase;
				text-overflow: ellipsis;
				white-space: nowrap;
				width: 18%;
				}

				#billers .four-column-four a:link {text-decoration: none; color: #030; }
				#billers .four-column-four a:visited {text-decoration: none; color: #030; }
				#billers .four-column-four a:hover {text-decoration: none; color: #000; font-weight: bold; }
				#billers .four-column-four a:active {text-decoration: none; color: #070; }
/* four-column-2 */



#billers table.sortable th::after, th.sorttable_sorted::after, th.sorttable_sorted_reverse::after {
	content: " ";
	height: 11px;
	width: 11px;
	}
#billers th.sorttable_sorted::after {
	background: url(my-sorted-icon.png);
	background-size: contain;
	}
#billers th.sorttable_sorted_reverse::after {
	background: url(my-sorted-reversed-icon.png);
	background-size: cover;
	}


/* change colors for alternating row background colors */
/* second rows */
	table.sortable tbody tr:nth-child(2n) td {
		background: rgba(200,200,200, .45);
		}
		table.sortable tbody tr:hover {
			background: rgba(0,0,0, .5);
			}

/* first rows */
	table.sortable tbody tr:nth-child(2n+1) td {
		background: rgba(200,200,200, .35);
		}
		table.sortable tbody tr:nth-child(2n+1):hover {
			background: rgba(0,0,0, .2);
			}


/* END billers */




/* FIXED */ /* OUTSIDE the wrapper unless noted */
/* FIXED */