/* Body and general styles */
body {
  margin: 0;
  font-family: 'Droid Sans',Arial,Helvetica,sans-serif;
  color: #000000;
  background: #81add9;
  font-size: 62.5%; /* make ems match (pixels / 10) */
  word-wrap: break-word;
}

a {
  color: #2b66a1;
}

a:hover {
  text-decoration: none;
}

h1 {
  font-size: 1.8em;
  font-family: Georgia,'Trebuchet MS','Times New Roman',serif;
}

h2 {
  font-size: 1.6em;
  font-family: 'Trebuchet MS',Arial,Helvetica,sans-serif;
}

h3 {
  font-size: 1.4em;
  font-family: 'Trebuchet MS',Arial,Helvetica,sans-serif;
}

p {
  font-size: 1.2em;
}

ul,ol {
  font-size: 1.2em;
}

.machine { /* for spamrobots */
  display: none;
}

.little { /* text on contact page */
  font-size: 11px;
  color: #444444;
  font-style: italic;
  margin-left: 50px;
}

hr {
  width: 75%;
}

th,td {
  font-size: 1.2em;
  padding: 3px;
}

.spinner {
  margin: 0 auto 0 auto;
  display: block;
}

#passwordcheck {
  color: #aa0000;
}

/*
div to show the background, since I'm using sprites I need to put a new div in... 
*/
#bodysprite {
  height: 500px;
  background: url('graphics/bg-horiz-sprite.png') repeat-x;
}

/*
topbar
*/
#topbar {
  background: #2b66a1;
  border-bottom: 1px solid #333333;
  padding: 7px;
  text-align: right;
  color: #ffffff;
}

#topbar p{
  padding: 0;
  margin: 0;
}

#topbar a {
  color: #fffd5f;
}

#topbar-left{
  float: left;
}

/* Page, container for all divs except topbar*/

#page {
  margin: 5px auto 0 auto;
  width: 960px;
  border: 1px solid #333333;
  background: #ffffff url('graphics/chalky.jpg') top left repeat-y;
  margin-bottom: 5px;
}

/* Menu 1 (horizontal) */

#menu1 {
  height: 40px;
  background: #333333 url('graphics/bg-horiz-sprite.png') 0px -500px repeat-x;
  clear: both;
  color: #ffffff;
  border-bottom: 1px solid #333333;
}

#menu1 ul {
  float: left;
  height: 40px;
  padding: 0;
  margin: 0;
  font-weight: bold;
}
#menu1 li {
  margin: 0;
  padding: 0;
  list-style-type: none;
  float: left;
  border-right: 1px solid #555555;
}
#menu1 a {
  padding: 14px 10px 12px 10px;
  display: block;
  color: #fffd5f;
  position: relative;
}

#menu1 a.stores {
  padding-left: 30px;
}

#menu1 a:hover, #menu1 a:focus {
  background: url('graphics/bg-horiz-sprite.png') 0px -540px repeat-x;
  text-shadow: 2px 2px 2px #000000;
}

#menu1 a img {
  position: absolute;
  border: none;
  top: -90px;
  left: -312px;
  margin: 11px 0  0 5px;
  clip: rect(90px 334px 112px 312px);
}

/* Left Column */

#leftcolumn {
  float: left;
  width: 280px;
  padding: 20px;
  color: #ffffff;
}

#leftcolumn img {
  border: none;
}

#leftcolumn a {
  color: #fffd5f;
}

a.logo-wrapper {
  display: block;
  position: relative;
  height: 102px;
  width: 280px;
}

.logo-smaller {
  position: absolute;
  top: -200px;
  left: 0px;
  clip: rect(200px 280px 302px 0px);
}

a.storesidebarlink {
  background: url('graphics/sprite.png') top left no-repeat;
  display: block;
  width: 280px;
  height: 100px;
  margin: 20px 0 20px 0;
  text-decoration: none;
}

a.storesidebarlink:hover {
  background: url('graphics/sprite.png') 0px -100px no-repeat;
}

a.news-section {
  display: block;
  float: left;
  position: relative;
  width: 32px;
  height: 32px;
  margin-top: -5px;
  margin-right: 3px;
  padding-bottom: 2px;
}

a.news-section:hover {
  border-bottom: 2px dashed #fffd5f;
}

.social {
  background: #d8dfea;
  border: 1px solid #3b5998;
  padding: 7px;
  color: #333333;
}

#leftcolumn .social a {
  color: #3b5998;
  position: relative;
  display: block;
  float: left;
  margin-right: 17px;
  padding-bottom: 2px;
  border-bottom: 2px dashed #3b5998;
  height: 32px;
  width: 32px;
}

#leftcolumn .social a:hover {
  border-bottom: 2px dashed #fffd5f;
}

.social img, #leftcolumn .social img {
  border: none;
}

/* Content Column */

#content {
  padding: 20px;
  margin-left: 320px;
  background: url('graphics/bg-horiz-sprite.png') 0px -580px repeat-x;
}

#content p, #content ul, #content ol{
  font-size: 1.3em;
}

/* footer */

#footer {
  clear: both;
  background: #2b66a1 url('graphics/bg-horiz-sprite.png') 0px -580px repeat-x;
  color: #ffffff;
  font-size: 0.9em;
  border-top: 1px solid #333333;
}

#footer a {
  color: #fffd5f;
}

#footer ul {
  margin-left: 20px;
  padding-left: 0;
}

.footersection { /* 4 left-floating divs in footer */
  padding: 0 20px 0 20px;
  width: 200px;
  float: left;
}

.clear {
  clear: both;
}

/*
for home page only
*/

#home-page {
  margin: 5px auto 0 auto;
  width: 960px;
  border-left: 1px solid #333333;
  border-right: 1px solid #333333;
  border-top: 1px solid #333333;
}

#home-header {
  background: url('graphics/chalky.jpg') top left repeat;
  color: #ffffff;
  padding: 20px;
}

.logo-small-wrapper {
  position: relative;
  float: left;
  width: 280px;
  height: 102px;
  margin-right: 50px;
}

.logo-small {
  position: absolute;
  top: -302px;
  left: 0;
  clip: rect(302px 353px 431px 0px);
}

#home-header a {
  color: #fffd5f;
}

.homeschoolsearch {
  padding: 5px 2px 5px 2px;
  font-size: 1.6em;
  font-weight: bold;
  font-family: 'Trebuchet MS',Arial,Helvetica,sans-serif;
  color: #444444;
  margin-top: 5px;
  width: 300px;
}

.home-header-section { /* two columns in header */
  padding: 0 10px 0 10px;
  float: left;
  width: 440px;
}

#action { /* the first column in header */
    background: #c52626;
    background: -webkit-gradient(linear, left top, left bottom, from(#9a1d1d), to(#da3e3e));
    background: -moz-linear-gradient(top, #9a1d1d, #da3e3e);
    background-origin: padding-box;
    -moz-background-origin: padding;
    -webkit-background-origin: padding;
    background-clip: padding-box;
    -moz-background-clip: padding;
    -webkit-background-clip: padding;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9a1d1d', endColorstr='#de3e3e');
    border: 6px solid rgb(255, 255, 255); /* The Fallback */
    border: 6px solid rgba(255, 255, 255, 0.2);
    box-shadow: 2px 2px 5px #000000;
    -webkit-box-shadow: 2px 2px 5px #000000;
    -moz-box-shadow: 2px 2px 9px #000000;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    width: 400px;
    margin: 10px 25px 0 0;
    display: inline;
}

.home-header-arrow1 {
  height: 24px;
  width: 24px;
  background: url('graphics/sprite.png') -280px 0px no-repeat;
  margin: -5px auto -16px auto;
}

.home-social a {
  position: relative;
  display: block;
  float: left;
  margin: 5px 20px;
  padding-bottom: 2px;
  border-bottom: 2px dashed #363636;
  height: 32px;
  width: 32px;
}

.home-social a:hover {
  border-bottom: 2px dashed #fffd5f;
}

.home-social img, #leftcolumn .social img {
  border: none;
}

.rss {
  position: absolute;
  top: -120px;
  left: -312px;
  clip: rect(120px 344px 152px 312px);
}

.twitter {
  position: absolute;
  top: -152px;
  left: -312px;
  clip: rect(152px 344px 184px 312px);
}

.myspace {
  position: absolute;
  top: -152px;
  left: -280px;
  clip: rect(152px 312px 184px 280px);
}

.youtube {
  position: absolute;
  top: -184px;
  left: -280px;
  clip: rect(184px 312px 216px 280px);
}

.facebook {
  position: absolute;
  top: -120px;
  left: -280px;
  clip: rect(120px 312px 152px 280px);
}

.home-header-social img {
  border: none;
}

img.home-sticker {
  padding-bottom: 3px;
  border-bottom: 2px dashed #333333;
  border-top: none;
  border-right: none;
  border-left: none;
  display: inline;
  margin: 0 25px;
}

img.home-sticker:hover, img.home-sticker:hover {
  border-bottom: 2px dashed #fffd5f;
}

.home-promote-table tr td div{
  padding-left: 30px;
  position: relative;
}

.little-icon {
  position: absolute;
  top: -24px;
  left: -312px;
  clip: rect(24px 334px 46px 312px);
}

.desktop {
  position: absolute;
  top: -68px;
  left: -312px;
  clip: rect(68px 334px 90px 312px);
}

.earth {
  position: absolute;
  top: 0;
  left: -326px;
  clip: rect(0px 348px 22px 326px);
}

.document {
  position: absolute;
  top: 0;
  left: -304px;
  clip: rect(0px 326px 22px 304px);
}

.heart {
  position: absolute;
  top: -46px;
  left: -312px;
  clip: rect(46px 334px 68px 312px);
}

.star {
  position: absolute;
  top: -90px;
  left: -312px;
  clip: rect(90px 334px 112px 312px);
}

#schoolselection {
  height: 120px;
  margin-bottom: 10px;
  padding-left: 10px;
  overflow: auto;
  border: 1px dashed #999999;
  clear: both;
}

.homestorelink {
  background: url('graphics/sprite.png') top left no-repeat;
  display: inline-block;
  width: 280px;
  height: 100px;
  margin: 0 0 10px 10px;
  border: none;
}

.homestorelink:hover {
  background: url('graphics/sprite.png') 0px -100px no-repeat;
}

#home-content {
  clear: both;
  background: #ffffff url('graphics/bg-horiz-sprite.png') 0px -580px repeat-x;
  padding: 20px;
}

#home-content-section p, #home-content-section ul, #home-content-section ol{
  font-size: 1.3em;
}

.home-content-section {
  width: 280px;
  margin-right: 20px;
  float: left;
}

.homestore {
  border: 1px dashed #999999;
  padding: 7px;
  margin: 5px;
  height: auto !important; /* all browsers except ie6 will use this and ignore the next line */
  height: 127px; /* ie6 will use this as a starting point and expand as necessary */
  min-height: 127px; /* all other browsers will use this as a starting point and expand as necessary */
  position: relative;
}

.homestore p {
  margin-left: 130px;
}

.homestorelogo {
  float: left;
  margin: 6px 12px 6px 13px;
  height: 125px;
  width: 125px;
}


/* Store page styles */

.store {
  border: 1px solid #999999;
  padding: 7px;
  margin: 5px;
  height: auto !important; /* all browsers except ie6 will use this and ignore the next line */
  height: 127px; /* ie6 will use this as a starting point and expand as necessary */
  min-height: 127px; /* all other browsers will use this as a starting point and expand as necessary */
  position: relative;
  background: #ffffff;
}

.store p {
  margin-left: 130px;
}

.storelogo {
  float: left;
  margin: 0 5px 0 0;
  height: 125px;
  width: 125px;
}

.favoritebutton {
  position: absolute;
  bottom: 7px;
  right: 7px;
  padding: 8px;
  background: #2b66a1;
  color: #fffd5f;
  font-weight: bold;
  text-decoration: underline;
}  
  
#loginprompt {
  border: 1px solid #666666;
  padding: 7px;
}

#loginprompt h3 {
  margin: 0;
  padding: 0;
}

#favoritestores {
  border: 1px dashed #000066;
  background: #a6c1de;
  padding: 7px;
}

#favoritestores h3 {
  margin: 0;
  padding: 0;
}

.previousnext {
  text-align: right;
  margin: 10px 0 10px 0;
  font-weight: bold;
}

.previousnext p{
  margin: 0;
}

.previousnextleft {
  float: left;
}

/* stores view selection table at top of the three stores pages */
td.store-select-view {
  border: 1px solid #999999;
  height: 50px;
  font-size: 1.0em;
  background: #ffffff;
}

td.store-select-view div {
  position: relative;
  float: left;
  margin-left: 5px;
  width: 32px;
  height: 32px;
}

.default-view {
  position: absolute;
  top: -24px;
  left: -280px;
  clip: rect(24px 312px 56px 280px);
}

.list-view {
  position: absolute;
  top: -56px;
  left: -280px;
  clip: rect(56px 312px 88px 280px);
}

.window-view {
  position: absolute;
  top: -88px;
  left: -280px;
  clip: rect(88px 312px 120px 280px);
}

td.store-select-view p {
  font-weight: bold;
  margin: 8px 0 0 45px;
}

/* admin page boxes */
.adminbox {
  border: 1px solid #666666;
  padding: 10px;
  margin: 10px;
}

.adminbox h2 {
  margin-top: 0;
}

/* for the spread page */
code {
  font-size: 1.0em;
  font-weight: normal;
  display: block;
  width: 265px;
  background: #dfdfdf;
  margin-left: auto;
  margin-right: auto;
}

/*spread page tables */
.spread-table td {
  border: 1px solid #666666;
  padding: 5px;
  font-size: 1.0em;
}

/*first time page */
#firsttime {
    background: #ffffff;
    color: #666666;
    margin: 5%;
    padding: 0 3% 0 3%;
    font-size: 14px;
    width: 84%;
    height: 90%;
}