/* DEFAULTS
----------------------------------------------------------*/
body {
  background: #BED3E8 url('/logos/jp2codeBkgnd.jpg') no-repeat fixed left top;
  background-size:cover;
  color: Black;
  font-size: .80em;
  font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
  min-height: 420px;
  z-index:0;
}
a {
  position:relative;
}
a.h1:link, a.h1:visited {
  color:Red;
  text-shadow:4px 4px 8px Yellow;
}
a.h1:hover {
  color:Yellow;
  text-shadow:4px 4px 8px Orange;
}
h1 {
  color:Red;
  letter-spacing:5px;
  position:relative;
  text-align:center;
  text-shadow:4px 4px 8px #696969;
  top:-5px;
}
h2 {
  color:Red;
  letter-spacing:3px;
  position:relative;
  text-align:center;
  text-shadow:4px 4px 8px #696969;
  top:-10px;
}
h3 {
  color:Red;
  position:relative;
  text-align:center;
  text-shadow:4px 4px 8px #696969;
  top:-15px;
}
/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/
div {
  position:absolute;
}
div.header {
  background: url('../logos/logoSpring.png') no-repeat fixed left top;
  height:150px;
  left:0px;
  position:fixed;
  text-align:center;
  top:0px;                          /* GoDaddy header starts at 95px. This was 0px, now it is 95px */
  vertical-align:middle;
  width: 100%;
  z-index:1;
}
div.headerSpring {
  background-image: url('../logos/logoSpring.png');
}
div.headerSummer {
  background-image: url('../logos/logoSummer.png');
}
div.headerFall {
  background-image: url('../logos/logoFall.png');
}
div.headerXMas {
  background-image: url('../logos/logoXMas.png');
}
div.headerWinter {
  background-image: url('../logos/logoWinter.png');
}
div.login {
  height:80px;
  position:absolute;
  right:-105px;
  text-align:center;
  top:5px;
  vertical-align:middle;
  width:100px;
}
div.main {
  top:130px;                          /* GoDaddy header starts at 95px. This was 130px, now it is 230px */
  left:225px;
  /*
  height:575px;
  overflow:scroll;
  position:fixed;
  width:800px;
  width: 100%;
  position:fixed;
  */
  bottom:70px;
  overflow:auto;
  text-align:left;
  width:70%;
  vertical-align:text-top;
}
div.jp2clock {
  height:100px;
  left:800px;
  top:20px;
  width:200px;
  z-index:1;
}
div.jp2login 
{
    float: right;
}
div.jp2social {
  position:absolute;
  top:605px;
  text-align:left;
  left:10px;
}
div.footer {
  bottom:0px;
  position:fixed;
  text-align:center;
}
div.menubar 
{
    position: relative;
}
#menu 
{
  list-style: none;
  margin: 20px auto;
  overflow: hidden;
  left:-30px;
  top:160px;                          /* GoDaddy header starts at 75px. This was 160px, now it is 255px */
  width: 150px;
  position:fixed;
}
.sprite 
{
  height:50px;
  margin: 0;
  padding: 0;
  text-shadow: 4px 4px 8px #696969;
}
.sprite span {
  position: relative;
  top: 10px;
  padding-left: 15px;
}
.sprite a {
  background-image: url('/logos/sprite150.png');
  background-repeat: no-repeat;
  background-position: 0px -100px;
  color:Silver;
  display:block; 
  padding-top: 15px;
  padding-left: 15px;
  width:150px; 
  height:50px;   
}
.sprite a:hover {
  background-position: 0 -50px;
  color:Red;
}
.sprite a:active {
  background-position: 0 0;        
  color:Black;
}
/* table CSS */
table     { background-color:Transparent; border:0px; width:100%; }
table.eml { border:1px; border-color:#780000;}
td        { background-color:Transparent; font-family:verdana; font-size: 10pt; }
td.clf    { border:0px; width:350px; vertical-align: top; }
td.eml    { text-align:left;  vertical-align:top; }
td.epx    { text-align:right; vertical-align:top; }
td.mnu    { border:0px;  height:50px; width: 290px; vertical-align: top; }
td.mmyy   { color:Red;   height:15px; width:140px;font-size:12pt; text-align:center; }
td.day    { color:Red;   height:10px; width:20px; font-size:10pt; text-align:center; }
td.reg    { color:Silver;height:10px; width:20px; font-size: 8pt; text-align:center; }
td.week   { color:Silver;height:10px; width:20px; font-size: 8pt; text-align:center; }
td.time   { color:Black; height:10px; width:140px;font-size: 8pt; }
tr        { background-color:Transparent; border:0px; width:100%; }
tr.eml    { border:1px; border-color:#780000; }
/* YouTube IFrames: */
div.hr {
  background-color: Orange;
  height: 5px;
  position: relative;
}
div.hiddenOverflow {
  overflow-x: hidden;
  position: relative;
}
.inneriframe {
  width: 100%;
  height: 100%;
}
/* unused stuff from wellstyled.com
div.outer {
	float: left;
	width: 150px; height: 50px;
	margin: 0 3px 0 0;
	background: url(/logos/jp2Rollover.png) 0 -50px no-repeat;
}
div.outer a {
	display: block;
	margin: 0; padding:0;
	width:100%; height:100%;
	overflow:hidden;
	font: bold 13px/1 Georgia, serif;
	color:#039;
	text-decoration: none;
	background: url(/logos/jp2Rollover.png) top left no-repeat;
}
div.outer span {
	display: block;
	margin:0; padding: 7px 0 0 13px;
}
div.outer a:hover {
	background-image: none;
	color: yellow;
}
div.outer a:active {
	color: black;
}
 */