﻿

html,
body {
	margin:0;
	padding:0;
	height:100%;
	font-family:Arial;
	font-size:13px;
}
#main {
	min-height:100%;
	position:relative;
	min-width:960px;
	max-width:1200px;
	margin:0 auto 0 auto;
}
header.top {
	background:#ededed;
	padding:10px;
	margin:0 auto 0 auto;
	min-width:960px;
	max-width:1200px;
	height:65px;
	background-image: url('images/applights.jpg'); 
	background-repeat: repeat;
	color:black;
	text-align:left;

}
section {
	margin-left:150px; 
	margin-right:150px;
	padding: 10px;
	padding-bottom:45px; /* Height of the footer element */
	
}
.mainpage section {
	margin-left:150px; 
	margin-right:0px;
	padding: 10px;
	padding-bottom:45px; /* Height of the footer element */
	
}
.mainpage table { width:1040px; border:1px navy solid; border-collapse:collapse; margin:auto;
}
.mainpage td { 
	border:1px navy solid; padding:0 0 0 0;
	text-align:center;
	height:22px;
	width: 50px;
	
}
h3 {
	margin-top: 0;
}
footer {
	background:#1F1F1F;
	width:100%;
	height:45px;
	position:absolute;
	bottom:0;
	left:0;
	text-align:center;
	color:red;
}
nav.top ul { 
position: relative;
float:right;
	font-size:small; width:160px; 
	margin:-220px -40px ;
}

nav.left ul { 
	position:absolute; 
	top:150px; 
	left:-80px; 
	color:black; 
	width:135px; 
	text-align:center; 
	margin:0px 20px 30px 40px;
	font-size:small
}
aside { 
	position:absolute; 
	top:150px; 
	right:10px; 
	color:navy; 
	width:135px; 
	text-align:center; 
	margin:0px 5px 0 0;
}

#mid-left-col { width:48%; float:left; text-align:left;
}
#mid-right-col {width:48%; float:right; text-align:left;
}

h2 { font-size:150%; color:navy; text-align:center;
}
h3 { font-size:110%; color:navy; text-align:center;
}

h1 {position:relative; top:5px; font-size:350%; color:red; margin:auto 0 auto 20px; 	width: 600px;
}
ul { position:absolute; top:180px; left:-40px; color:navy; width:135px; text-align:center; margin:0;
}
/* set general side button styles */
li { width:115px; list-style-type :none; margin-bottom: 3px; text-align: center;
}
/* set general anchor styles */
li a { display: block; width:115px; color: white; font-weight: medium; text-decoration: none
}
/* specify state styles. */
/* mouseout (default) */
li a { background: #5B78BE; border: 4px outset #aabaff;
}
/* mouseover */
li a:hover { display:block; background: #0a4adf; border: 4px outset #8abaff; width:115px;
}
/* onmousedown */
li a:active { background:#aecbff; border: 4px inset #aecbff;
}

#midcol {width:90%; margin:auto;}
table { width:800px; border:1px navy solid; border-collapse:collapse; margin:auto;
}
td { border:1px navy solid; padding:1px 0 1px 4px; text-align:left;
}
p.error { color:red; font-size:105%; font-weight:bold; text-align:center;
}
.block label { 
	display: inline-block; 
	width: 240px; 
	text-align: right; 
}
.label { float:left; width:210px; text-align:right; clear:left; margin-right:5px;
}
.center{ margin-left:100px;margin-right:100px; text-align:center;
}
span.left {
	text-align:left;
}  
.r-align{
	text-align:right;
	padding-right:2px;
}

.button-link {
	padding: 2px 7px;
    background: #4479BA;
	color: #FFF;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: solid 1px #20538D;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
	text-decoration: none; 
}
.button-link:hover {
    background: #356094;
    border: solid 1px #2A4E77;
    text-decoration: none;
}
.button-link:active {
    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    background: #2E5481;
    border: solid 1px #203E5F;
}
.shift-button {
	padding: 0px 3px;
    background: hsla(213, 46%, 50%, 1);
	color: #FFF;
	font-size: 1em;
	min-width: 50px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: solid 1px #20538D;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
	text-decoration: none; 
}
.shift-button:hover {
    background: hsla(213, 47%, 39%, 1);
    border: solid 1px #2A4E77;
    text-decoration: none;
}
.shift-button:disabled {
    background: hsla(213, 25%, 70%, 1);
    border: solid 1px #2A4E77;
    text-decoration: none;
}

.shift-button:active {
    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    background: hsla(213, 47%, 34%, 1);
    border: solid 1px #203E5F;
}
.important-button {
	width: 15em;
	padding: .5em;
	color: #ffffff;
	font-size: 1.1em;
	text-shadow: 1px 1px 1px #000;
	border: solid thin #882d13;
	-webkit-border-radius: .7em;
	-moz-border-radius: .7em;
	border-radius: .7em;
	-webkit-box-shadow: 2px 2px 3px #999; 
	box-shadow: 2px 2px 2px #bbb;
	background-color: #ce401c;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#e9ede8), to(#ce401c),color-stop(0.4, #8c1b0b));
}