@import url(http://fonts.googleapis.com/css?family=Sorts+Mill+Goudy:400,400italic);
@import url(http://fonts.googleapis.com/css?family=Oswald:700);

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  min-width: 240px;
}
body {
  font-family: 'Sorts Mill Goudy';
  font-size: 100%;
  background-color: #dcdcdc;
  background-repeat: no-repeat;
  background-image: -moz-linear-gradient(to bottom,#fff 0%,#dcdcdc 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
  background-image: -webkit-linear-gradient(to bottom,#fff 0%,#dcdcdc 100%);
  background-image: -ms-linear-gradient(to bottom,#fff 0%,#dcdcdc 100%);
  background-image: -o-linear-gradient(to bottom,#fff 0%,#dcdcdc 100%);
  background-image: linear-gradient(to bottom,#fff 0%,#dcdcdc 100%);
}
#container {
  position: relative;
  min-height: 100%;
}
#main {
  padding-bottom: 4em;
}
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 3em;
}
footer p {
  text-align: center;
  font-size: 1em;
}
footer a {
  color: #868686;
}
p, li {
  font-size: 1.3em;
  font-size: 1.3rem;
  line-height: 1.4em;
}
nav {
  position: relative;
  background: rgba(224,224,224,1);
  background: -moz-linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 12%, rgba(4,92,117,1) 88%, rgba(161,161,161,1) 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(161,161,161,1)), color-stop(12%, rgba(6,59,75,1)), color-stop(88%, rgba(4,92,117,1)), color-stop(100%, rgba(161,161,161,1)));
  background: -webkit-linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 12%, rgba(4,92,117,1) 88%, rgba(161,161,161,1) 100%);
  background: -o-linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 12%, rgba(4,92,117,1) 88%, rgba(161,161,161,1) 100%);
  background: -ms-linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 12%, rgba(4,92,117,1) 88%, rgba(161,161,161,1) 100%);
  background: linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 12%, rgba(4,92,117,1) 88%, rgba(161,161,161,1) 100%);
  /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e0e0', endColorstr='#a1a1a1', GradientType=0 ); */
}
nav ul {
  list-style: none;
  padding: 0 0 0 15px;
  margin: auto;
  position: relative;
}
nav li {
  float: left;
  padding: 0;
  position: relative;
}
nav ul a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: .3em 1em 0;
  font-size: .9em;
  opacity: .8;
  font-family: 'HelveticaNeue-Light','Helvetica Neue Light','HelveticaNeue','Helvetica Neue',Helvetica,'Lucida Grande',Arial, sans-serif;
  font-weight: 300;
}
nav ul a:hover {
  opacity: 1;
  color: #fff;
  text-shadow: 0 0 0;
}
nav .site {
   font-family: Oswald;
   font-size: 18px;
   line-height: 18px;
   color: #fff;
   position: absolute;
   top: 50%;
   margin-top: -9px;
   right: 10px;
   text-decoration: none;
}
nav .site:hover {
  color: #fff;
}
nav.largescreen {
  height: 2.5em;
  margin: 0 auto;
}
nav#smallscreen {
  position: absolute;
  z-index: 2;
  border-radius: 4px;
  background: -moz-linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 4%, rgba(4,92,117,1) 96%, rgba(161,161,161,1) 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(161,161,161,1)), color-stop(4%, rgba(6,59,75,1)), color-stop(96%, rgba(4,92,117,1)), color-stop(100%, rgba(161,161,161,1)));
  background: -webkit-linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 4%, rgba(4,92,117,1) 96%, rgba(161,161,161,1) 100%);
  background: -o-linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 4%, rgba(4,92,117,1) 96%, rgba(161,161,161,1) 100%);
  background: -ms-linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 4%, rgba(4,92,117,1) 96%, rgba(161,161,161,1) 100%);
  background: linear-gradient(to bottom, rgba(161,161,161,1) 0%, rgba(6,59,75,1) 4%, rgba(4,92,117,1) 96%, rgba(161,161,161,1) 100%);
  -webkit-box-shadow: 0 5px 10px 0 rgba(0,0,0,0.75);
  -moz-box-shadow: 0 5px 10px 0 rgba(0,0,0,0.75);
  box-shadow: 0 5px 10px 0 rgba(0,0,0,0.75);
}
#smallscreen ul {
  margin: 2em;
  padding: 0;
}
#smallscreen li {
  float: none;
}
#smallscreen a {
  padding: .5em 0;
}
.banner {
  border: 1px solid #999;
  position: relative; /* for nav menu button */
  background: silver; /* Old browsers */
  background: -moz-radial-gradient(top, ellipse cover, rgb(255,255,255) 0%,rgb(255,255,255) 20%,rgb(230,230,230) 60%,rgb(200,200,200) 80%,rgb(180,180,180) 100%); /* FF3.6+ */
  background: -webkit-radial-gradient(top, rgb(255,255,255) 0%,rgb(255,255,255) 20%,rgb(230,230,230) 60%,rgb(200,200,200) 80%,rgb(180,180,180) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-radial-gradient(top, ellipse cover, rgb(255,255,255) 0%,rgb(255,255,255) 20%,rgb(230,230,230) 60%,rgb(200,200,200) 80%,rgb(180,180,180) 100%); /* Opera 12+ */
  background: -ms-radial-gradient(top, ellipse cover, rgb(255,255,255) 0%,rgb(255,255,255) 20%,rgb(230,230,230) 60%,rgb(200,200,200) 80%,rgb(180,180,180) 100%); /* IE10+ */
  background: radial-gradient(ellipse at top, rgb(255,255,255) 0%,rgb(255,255,255) 20%,rgb(230,230,230) 60%,rgb(200,200,200) 80%,rgb(180,180,180) 100%); /* W3C */
}
.banner h1 span {
  position: absolute;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.1) 0%, rgba(0,0,0,.8) 15%, rgba(0,0,0,.6) 60%, rgba(0,0,0,.4) 80%, rgba(0,0,0,.1) 100%);
}
.banner h1:after {
  content: attr(data-attr);
  color: #000;
  text-shadow: 0 1px 0 #fff;
}
.menubtn {
  display: block;
  position: absolute;
  height: 19px;
  width: 35px;
  background: url('../images/nav.png') no-repeat;
  cursor: pointer;
}
#showmenu {
  right: 10px;
  top: 50%;
  margin-top: -10px;
  display: none;
  z-index: 1;
}
#hidemenu {
  top: 2px;
  right: 2px;
  background-position: 0 -18px;
}
a:hover {
  color: red;
}
.drop {
  letter-spacing: 0;
  text-transform: uppercase;
  color: #0e81be;
  font-size: 340%;
  float: left;
  margin: 0.13em 0.1em 0 0;
  line-height: 0.7;
}
.caps {
  font-variant: small-caps;
  font-size: 1.4em;
}

h1 {
  font: normal 4em Oswald, sans-serif;
  color: #0e81be;
  letter-spacing: -3px;
  line-height: 1em;
  text-align: center;
  margin: .375em auto;
  text-shadow: #fff -1px -1px 0, #000 1px 1px 0;
  position: relative;
}
h2 {
  color: rgba(102,102,102, 0.6);
  text-shadow: 1px 1px 2px #def, 0 0 0 #000,-1px -1px 3px #def;
  font-family: Oswald, sans-serif;
  font-size: 2em;
  margin-top: 4em;
}
h2:first-child {
  margin-top: 0;
} 
h3 {
  font-weight: 700;
  font-size: 1.5em;
}
.one {
  position: relative;
  width: 90%;
  margin: 3em auto;
}
.narrow {
  max-width: 900px;
}
.one article, .two article, .one article div, .two article div {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 2em;
  padding-bottom: 1em;
  border-bottom: 1px solid #999;
  border-top: 2px solid rgb(245,245,245);
}
.one article:first-child, .one article div:first-child, .two article div:first-child {
  border-top: 0;
}
.one article:last-child, .one article div:last-child, .two article div:last-child {
  border-bottom: 0;
}
.two {
  width: 100%;
  text-align: center;
}
.two article {
  text-align: left;
  width: 46%;
  display: inline-block;
  border: 0;
}
.two article div {
  width: 90%;
  margin: auto;
  border-style: solid;
  border-width: 1px;
  border-color: #ccc #999 #666 #999;
  background: silver;
  background: radial-gradient(ellipse at top, rgb(255,255,255) 0%,rgb(255,255,255) 20%,rgb(230,230,230) 60%,rgb(200,200,200) 80%,rgb(180,180,180) 100%);
  padding: 1em 1em 1em 0;
}
.two article div p {
  margin: 0 1.5em;
  padding: 1em 0;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #999;
}
.two article div p:first-of-type {
  border-top: 0;
}
.two article div p:last-of-type {
  border-bottom: 0;
}
.two article p {
  margin-left: 24px;
}
.two article h2 {
  margin-left: 24px;
  margin-top: 1em;
}
.two figure {
  max-width: 100%;
  float: left;
}
.two img {
  max-width: 100%;
  height: auto;
}
.two article:first-child {
  float: left;
}
.two .smaller {
  font-size: 100%;
}
.noJS {
  
}
.noJS img {
  width: auto;
  float: right;
  margin: 0 0 1em 1em;
}
.where {
  color: rgb(0,0,238);
  text-decoration: underline;
  cursor: pointer;
}
.framed {
  border: 1px solid #000;
  padding: 8px 8px 0;
  background-color: #fff;
  -webkit-box-shadow: 5px 5px 10px -5px rgba(0,0,0,0.75);
  -moz-box-shadow: 5px 5px 10px -5px rgba(0,0,0,0.75);
  box-shadow: 5px 5px 10px -5px rgba(0,0,0,0.75);
}
figure.right {
  float: right;
  margin: 0 0 2em 2em;
}
figure.left {
  float: left;
  margin: 0 2em 2em 0;
}
figcaption {
  font-size: .8em;
  font-weight: bold;
  text-align: center;
  line-height: 1.1em;
  margin: .2em 0 .8em;
  font-family: 'HelveticaNeue','Helvetica Neue',Helvetica,'Lucida Grande',Arial, sans-serif;
}
.clearfloat {
  clear: both;
  margin: 0;
  line-height: 1px;
}
.excerpt {
  width: 95%;
  max-width: 1200px;
  margin: auto;
}
.excerpt .ttl {
  text-align: center;
  margin: 2em auto;
}
.sbexcerpt {
  display: block;
  margin: auto;
  width: 60px;
  height: 23px;
  background: url(../images/sbexcerptdingbats.png) no-repeat;
}
.section {
  background-position: 0 -23px;
}
.by {
  margin-bottom: 0;
  font-weight: bold;
}
.rev {
  margin-top: 0;
  margin-left: 2em;
}
.sect {
  margin-top: 3em;
}

/* Booklist slider */
#booklistContainer {
  background-color: #f3f3f3;
  background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
  border-top: 2px solid #ccc;
  border-bottom: 2px solid #f3f3f3;
  padding: 1em 0 .8em;
  display: flex;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
}
#booklistContainer > div {
  scroll-snap-align: start;
  height: 100%;
  width: 250px;
  text-align: center;
  flex-shrink: 0;
  scroll-behavior: smooth;
}
#booklistContainer img {
  border: 1px solid #666;
  -webkit-box-shadow: 2px 2px 5px 0 rgba(0,0,0,.4);
  -moz-box-shadow: 2px 2px 5px 0 rgba(0,0,0,.4);
  box-shadow: 2px 2px 5px 0 rgba(0,0,0,.4);
}
#booklistContainer figcaption {
  font-weight: normal;
  font-size: .7em;
}


/* Retailer styles */
#evBg {position: absolute;
top: 0;
left: 0;
height: 100px;
width: 100%;
background-color: #000;
z-index: 100;
filter:alpha(opacity=0);
opacity: 0;
}
#eventDisplay {
  position: absolute;
  left: -2000px;
  z-index: 101;
  width: 300px;
  background-color: #fff;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 5px 5px 10px #000;
  -moz-box-shadow: 5px 5px 10px #000;
  box-shadow: 7px 8px 25px #000;
  overflow: hidden;
}
#eventDisplay h2 {
  text-align: center;
  font-size: 1.3em;
  text-shadow: 0 0 0;
  margin: 0;
  padding: .6em 0 .7em;
  color: #fff;
  background: #036;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0% #036), color-stop(25% #1f5492), color-stop(80% #036));
  background-image: -webkit-linear-gradient(top, #036 0%, #1f5492 25%, #036 80%);
  background-image: -moz-linear-gradient(top, #036 0%, #1f5492 25%, #036 80%);
  background-image: -o-linear-gradient(top, #036 0%, #1f5492 25%, #036 80%);
  background-image: linear-gradient(top, #036 0%, #1f5492 25%, #036 80%);
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
}
#eventDisplay p, #eventDisplay ul {
  margin: 1em;
}
#eventDisplay p, #eventDisplay ul li {
  font: 1em/1.1em 'HelveticaNeue','Helvetica Neue',Helvetica,'Lucida Grande',Arial, sans-serif;
}
body.ie9 #eventDisplay h2 {background-image: url('../images/iegradients/eventH2.svg');}
#close {
display: block;
float: right;
margin: 9px 8px 0 0;
cursor: pointer;
}
#eventDisplay li {font-size: 1.3em;}
#eventDisplay img {
  border: 1px solid #666;
  padding: 3px;
  float: right;
  margin: 1em;
}
#eventDisplay img#close {border: 0;}

/* Video display */
.videohd {
  max-width: 1280px;
  margin: 0px auto;
}

.videohd > div {
  position: relative;
  padding-bottom: 60%;
  height: 0px;
}

.videohd iframe {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}


@media screen and (max-width: 1020px) {

  .one figure.right, .one figure.left {
    max-width: 50%;
  }
  .one figure img {
    max-width: 100%;
	height: auto;
  }
  .evt img {
    max-width: 50%;
    height: auto;
  }
}

@media screen and (max-width: 800px) {
  h1 {
    font-size: 300%;
    letter-spacing: -2px;
  }
  .largescreen li a {
    font-size: .8em;
  }
  .two article:first-child {
    float: none;
  }
  .two article {
    width: 90%;
    margin: 0 auto 3em;
}
  .nb {
    float: none;
    width: 60%;
    margin: 1em auto;
}
    p, li {
    font-size: 1.1em;
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 520px) {
  nav.largescreen {
    display: none;
  }
  h1 {
    font-size: 200%;
    letter-spacing: -1px;
    text-align: left;
    margin-left: 10px;
    width: 82%;
  }
  h2 {
    font-size: 1.5em;
  }
  h3 {
    font-size: 1.2em;
  }
  p, li {
    font-size: 1em;
    font-size: 1rem;
  }
  footer p {
    font-size: .8em;
  }
  #showmenu {
    display: block;
  }
}

@media screen and (max-width: 460px) {
  .right.authorportrait {
    float: none;
    display: block;
    max-width: 90%;
    margin: 0 auto 2em;
  }
  .one figure.right, .one figure.left, .evt img {
    display: none;
  }
}