﻿/* Head-Foot Config from http://www.cssreset.com/how-to-keep-footer-at-bottom-of-page-with-css/ */
html,
body {
	margin:0;
	padding:0;
	height:100%;
}
#hf-wrapper {				/* Header-Footer wrapper */
	min-height:100%;
	position:relative;
}
#header {
	padding:10px;
	background:#5ee;
}
#content {
	padding:10px;
	padding-bottom:20px;   /* Height of the footer element */
}
#footer {
	width:100%;
	height:20px;
	position:absolute;
	text-align:center;
	bottom:0;
	left:0;
	background:#ADD8E6;
	color:#0000FF;
}
body {	
	/* This is a blue from the JS logo, we will see if it works */
	color: #224381;

	/* ON WEB SAID - This set is a sans-serif font collection and while geneva and arial do not look terribly similar,
	they are both fairly standard on Macintosh and Windows computers. I include helvetica and helv for customers
	on other operating systems such as Unix or Linux that might not have a robust font library */
	font-family: arial, geneva, helvetica, helv, sans-serif;
}

/* This is a blue border around tables 
the margins make browsers center the table.
if not in older ones look at using
div.centered 
{
    text-align: center;
}
div.centered table 
{
    margin: 0 auto; 
    text-align: left;
}
and put this in page around the table
<div class="centered">*/

/*
#####  Color Palette by Color Scheme Designer
#####  Palette URL: http://colorschemedesigner.com/#3p11T8fSDw0w0
#####  Color Space: RGB; 
   var. 1 = #ADD8E6 = rgb(173,216,230)	darkest blue
   var. 2 = #8CA5AC = rgb(140,165,172)	greyish
   var. 3 = #387E95 = rgb(56,126,149)	next next lightest blue
   var. 4 = #C5E7F3 = rgb(197,231,243)  next lightest blue
   var. 5 = #D1EAF3 = rgb(209,234,243)  lightest blue
 */
 
/* to make all table float in middle of screen */
table {	
	margin-left: auto;
	margin-right: auto;
}



/* cellpadding for HTML 5 which doesn't support table padding and spacing properties
th, td { padding: 5px; }

// cellspacing
table { border-collapse: separate; border-spacing: 5px; } // cellspacing="5"
table { border-collapse: collapse; border-spacing: 0; }   // cellspacing="0"

// valign
th, td { vertical-align: top; }

// align (center)
table { margin: 0 auto; }

*/

/* My Own  Styles*/
.table-no-padd-space {
	border-collapse: collapse;
	border-spacing: 0px;
	padding: 0px;
}

.table-padd-and-space {
	border-collapse: collapse;
	border-spacing: 0px;
	padding: 1px;
}

.table-bg {
	background-color: #ADD8E6;
}
.table-dark-bg {
	background-color: #387E96;
}
.table-header-bg {
	background-color: #D1EAF3;
}
.table-gray-bg {
	background-color: #8CA5AC;
}
.whitetext{
	color: #FFFFFF;
}
.blacktext{
	color: #000000;
}
.greentext {
	color: #008000;
}
.bluegreentext {
	color: #387E96;
}


/*this is for small tables with logo in it*/
#wrapper {
	width: 500px;
	border: 1px solid #0000FF;
	margin-left: auto;
	margin-right: auto;
	/*border: 1px solid #0000FF; /* Bright Blue */
	/*min-width: 400px;
	min-height: 100px;
	/* This is drop shadow around tables */
	-webkit-box-shadow: 5px 5px 5px #000033;
	-moz-box-shadow: 5px 5px 5px #000033;
	box-shadow: 5px 5px 5px #000033;
}


/* This is for using <div> tags as tables. I PLAYED WITH IT - MAYBE MORE LATER  */
/*
#header {
    width: 500px;
}
#content {
    width: 100%;
    margin-top: 10px;
    border-collapse: collapse;
    font-size: 14px;
    display: table;
}
.row {
    display: table-row;
    padding: 10px 10px 10px 10px;
    vertical-align:middle;
}
.cell-header {
    padding: 1px;
    display: table-cell;
}
.cell-center {
    display: table-cell;
    padding: 0px;
    text-align: center;
}
.cell-center-withline {
    display: table-cell;
    padding: 0px;
    text-align: center;
    border-top-style: solid;
    border-top-color:blue;
}
.cell-left {
    display: table-cell;
    padding: 1px;
    text-align: left;
}
.cell-right {
    display: table-cell;
    padding: 1px;
    text-align: right;
}

#footer { 
	color: #66666
} 
*/
