/* Styles for 'Surviving the World': the comic; */


html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { font-family: 'Magra', sans-serif; color: #222; }

body { margin: 0; font-size: 1em; line-height: 1.4; background-image:url(../img/handbg.png); background-repeat:no-repeat;background-color:#626470; background-size: 100%;}

a { color: black; text-decoration:underline; }
a:visited { color: black; }
a:hover { color: black; text-decoration:none; }
a:focus { outline: thin dotted; }

a:hover, a:active { outline: 0; }

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }


/* ==|== primary styles =====================================================
   Author: Helen V. Holmes
   ========================================================================== */

/* For inherits */
.background {
  background-image:url(../img/handbg.png);
  width:1497px;
  height:1020px;
}

.main {
  margin:auto;
  width:800px;
}

.header {
  background-color:#435248;
  width, margin:inherit;
  height:125px;
}

.header h1 {
  margin:0;
  padding:0;
  padding-left:20px;
  color:white;
  font-size:58px;
  float:left;
}

.header h2 {
  font-size:18px;
  padding:0;
  margin:0;
  clear:left;
  float:right;
  color:white;
  padding-right:20px;
}

.nav {
  width, margin:inherit;
  height:40px;
  background-color:#93a298;
  text-transform:uppercase;
  color:white;
  font-size:14px;
  text-align:center;
}

.nav a {
  color:white;
  text-decoration:none;
}

.nav a:hover {
  color:white;
  text-decoration:none;
}

.button {
  width:113.5px;
  height:25px;
  background-color:#667b6d;
  float:left;
  margin-right:1px;
  padding-top:15px;
}

.button:hover {
  background-color:#54665a;
}

.buttonlast {
  width:113px;
  height:25px;
  background-color:#667b6d;
  float:left;
  margin-right:none;
  padding-top:15px;
}

.buttonlast:hover {
  background-color:#54665a;
}

.comicnav {
  background-color:#c8c8c8;
  height:52px;
  width, margin:inherit;
  color:#616161;
  font-size:18px;
  text-transform:uppercase;
  text-align:center;
  padding-top:0px;
}

.comicnav img {
  padding-left:5px;
  padding-right: 5px;
}

.comicnav img.gradient {
  clear:both;
  padding:0;
  margin:0;
}

.comicnav ul, li {
  padding:0;
  margin:0;
}

.comicnav ul li {
  list-style-type: none;
}

.comicnav ul li a {  
  display: block;
  height: 51px;
  text-indent: -9999px;
  float: left;
  background-image:url('../img/comicnav.png');
} 

.firstlesson a {  
  width: 167px;
  background-position: 0px 0px;  
} 

.firstlesson a:hover {  
  background-position: 0px -52px;  
} 

.previous a {  
  width: 145px;
  background-position: -167px 0px;  
} 

.previous a:hover {  
  background-position: -167px -52px;  
} 

.random a {  
  width: 210px;
  background-position: -312px 0px;  
} 

.random a:hover {  
  background-position: -312px -52px;  
} 

.next a {  
  width: 100px;
  background-position: -510px 0px;  
} 

.next a:hover {  
  background-position: -510px 52px;  
} 

.latestlesson a {  
  width: 175px;
  background-position: -622px 0px;  
} 

.latestlesson a:hover {  
  background-position: -622px 52px;  
} 

.comiccontainer {
  width, margin: inherit;
  background-color:#c8c8c8;
  padding-top:30px;
  padding-left:15px;
  padding-bottom:15px;
}

.comiccontainer h1 {
  color:black;
  font-size:36px;
  text-transform: uppercase;
  margin:0;
  padding:0;
}

.comiccontainer p {
  font-family:Georgia, serif;
  width:650px;
}

.comiccontainer .img {
  float:left;
  width:650px;
}

.comiccontainer .img img {
  width:100%;
}

.share {
  float:right;
  padding-right:20px;
}

.share ul {
  margin:0;
  padding:0;
}

.share ul li {
  list-style-type: none;
}

.share ul li a {  
  display: block;
  width: 106px;
  text-indent: -9999px;
  background-image:url('../img/share.png');
} 

.sharethis a {  
  height: 42px;
  background-position: 0px 0px;  
} 

.sharethis a:hover {  
  background-position: -107px 0px;  
} 

.permalink a {  
  height: 42px;
  background-position: 0px -42px;  
} 

.permalink a:hover {  
  background-position: -107px -42px;  
} 

.twitter a {  
  height: 42px;
  background-position: 0px -84px;  
} 

.twitter a:hover {  
  background-position: -107px -84px;  
} 

.facebook a {  
  height: 42px;
  background-position: 0px -126px;  
} 

.facebook a:hover {  
  background-position: -107px -126px;  
} 

.rssfeed a {  
  height: 42px;
  background-position: 0px -170px;  
} 

.rssfeed a:hover {  
  background-position: -107px -170px;  
} 

.enroll a {  
  height: 42px;
  background-position: 0px -212px;  
} 

.enroll a:hover {  
  background-position: -107px -212px;  
} 

.search a {  
  height: 44px;
  background-position: 0px -254px;  
} 

.search a:hover {  
  background-position: -107px -254px;  
} 

.footer {
  width, margin: inherit;
  background-color:#435248;
  clear:both;
  padding-left:15px;
  text-transform:uppercase;
  color:white;
  font-size:14px;
  padding-bottom:80px;
  padding-top:20px;
}

.footerlinks {
  float:left;
}

.footer a {
  color:white;
  text-decoration: none;
}

.footer a:hover {
  color:white;
  text-decoration:underline;
}

.right {
  float:right;
  padding-right:20px;
}

/*
6:50am to 7:04am;
8:45am to 9:15am;
12:06pm to 12:08;

12:35pm to12:45pm;
2:10 to 2:35;

30 minutes, now 4:15;

10:45pm to 11:45 pm;