body
{
	background: #efefef;
}
#content {
	padding: 45px 0 0 0;
}
.error
{
	color: #eb1d24;
}

.vec-field-error
{
	border-color: #eb1d24 !important;
}

.fourdigit
{
	width: 5em;
}

.monies
{
	width: 6em;
}

.datepicker
{
	width: 7em;
}

.name
{
	width: 8em;
}

/* for "open" records */
tbody.hilight
{
	background-color: #b8eef9;
}

td.hilight
{
	/* button color is #33C3F0 */
	/*background-color: #b8eef9;*/
	background-color: #ff4433;
	border-right: 1px solid #ff4433;
	border-bottom: 6px solid #ffa299;
	color: white;
	padding: .25em;
}
td.hilight a {
	color: white;
}

.search-container
{
	color: white;
	float: right;
	margin: .5em 1em;
	position: fixed;
	top: 0;
	right: 1em;
}
.search-container input.item-filter {
	height: 30px;
}

.item-filtered
{
	display: none;
}

tr:hover {
	background-color: #ffffff;
}
th, td {
    border-right: 1px solid #e1e1e1;
    border-bottom: 6px solid #e1e1e1;
    padding: .5em;
}
th {
	border-top: 1px solid #ccc;
	border-bottom: 6px solid #ccc;
}
th:first-child, td:first-child {
    padding-left: .5em;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: 300;
}

h1 { font-size: 4.0rem; line-height: 1.2;  letter-spacing: 0; }
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: 0; }
h3 { font-size: 3.0rem; line-height: 1.3;  letter-spacing: 0; }
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: 0; }
h5 { font-size: 1.8rem; line-height: 1.5;  letter-spacing: 0; }
h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }

/* Larger than phablet */
@media (min-width: 550px) {
  h1 { font-size: 2.5rem; }
  h2 { font-size: 2rem; }
  h3 { font-size: 1.5rem; }
  h4 { font-size: 1rem; }
  h5 { font-size: .9rem; }
  h6 { font-size: .8rem; }
}

h1, h2 {
	color: white;
	float: left;
	margin: 0;
	padding: .5em;
}
h1 {
	display: none;
}


#export-links {
	list-style-type: none;
}
#export-links li {
	background: transparent url('/images/icons/arrow-down.png') no-repeat .25em 50%;
	clear: both; /*to counteract scroll-table-wrapper*/
	padding-left: 1.5em;
}
#export-links li a, #export-links li a:visited {
	color: #0bb8da;
}
#export-links li a:active, #export-links li a:hover {
	color: #007399;
}


.header,
#footer ul {
	
	margin-top: -55px;
	
}
.header {
    height: 55px;
    
	
	margin-bottom: .5em;
}

#footer ul
{
	height: 45px;
	list-style-type: none;
    /*position: absolute;*/
    position: fixed;
   
}

ul#nav-links {
	background: #e63900;
	background: black url('/images/plenisher-logo-small.png') no-repeat;
	color: white;
	list-style-type: none;
	overflow: auto;
	padding: 0 0 0 89px;
	position: fixed;
	width: 100%;
}
#nav-links li {
	float: left;
	margin: 0;
	padding: 0;
}
#nav-links li a {
    line-height: 3;
}
#nav-links a
{
	display: block;
	padding: 0 1em;
}
#nav-links li a, #nav-links li a:visited {
	color: #eeeeee;
	text-decoration: none;
}
#nav-links li a:active, #nav-links li a:hover {
	color: white;
}
#nav-links li:hover {
	background: gray;
}
#nav-links li.current-page {
	background: #f5f5f5;
}
#nav-links li.current-page a {
	color: black;
	font-weight: bold;
}

.user {
	background: #e3ecdf;
	background: hsla(100, 50%, 90%, .3);
}
.packet {
	background: #e8e3e6;
	background: hsla(325, 35%, 90%, .3);
}
.card {
	background: #ece7df;
	background: hsla(35, 65%, 90%, .3);
}
.editable {
	background: #dfe8ec;
	background: hsla(200, 50%, 90%, .3);
}

/* for fixed-header tables */
/* note: needs a small javascript snippet to fix the div widths */
/* @see: https://jsfiddle.net/dPixie/byB9d/3/ */
.scroll-table-wrapper
{
	position: relative;
	float: left;
	/* this will get adjusted by the js */
	padding-top: 2em;
}

.fixed-height-container
{
	/* % doesn't work in FF */
	/* start small, let js make it larger if it can */
	height: 50vh;
	overflow-y: scroll;

	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
}

.fixed-height-container table th
{
	height: 0;
	line-height: 0;
	color: transparent;
	padding: 0 0.45em;
}

.fixed-height-container table th div
{
	position: absolute;
	padding: 0.45em;
	margin-left: -0.45em;
	top: 0;
	/*line-height: normal;*/
	line-height: 1.6;
	color: #000;

	border-left: 1px solid #e1e1e1;
}

#controls
{
	margin-top: 2em;
}

#controls a
{
	float: right;
	margin-right: 2em;
}
#login
{
	background: url('/images/plenisher-logo.png') no-repeat;
	height: 400px;
	width: 710px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 100px;
}

#login form
{
	padding-top: 400px;
	width: 220px;
	margin-right: auto;
	margin-left: auto;
}

#login input
{
	float: right;
}