body {
  margin: 0px;
  background: #B2E8E8 url("web-background.png") repeat;
  font-family: "Gill Sans", "Trebuchet MS", Verdana, sans-serif;
  font-size: 18px;
  color: #233;
}

.Main {
  max-width: 600px;
  margin: 0px auto;
  background: #009393;
  border-left: 3px solid black;
  border-right: 3px solid black;
  border-bottom: 1px solid black;
}

.Header {
  margin: 0px 0px 0px 0px;
  height: 170px;
  text-align: center;
}

.DraftWarning {
  background: #44F;
  color: white;
  padding: 10px 20px;
}

.Footer {
  background: #044;
  font-size: 14px;
  margin: 0x;
}

.FooterP {
  margin: 0px 20px;
  padding: 6px 0px;
  color: #5AA;
}

.Title {
  margin: 0px;
  width: 600px;
  height: 170px;
}
.TitleWide {
  margin: 0px;
  width: 600px;
  height: 170px;
  display: inline;
}
.TitleNarrow {
  margin: 0px;
  width: 480px;
  height: 136px;
  display: none;
}

.BlockEdge25 {
  height: 25px;
  clear: both;
}

.BlockEdge25 img {
  width: 600px;
  height: 25px;
}

.BlockEdge30 {
  height: 30px;
  clear: both;
}

.BlockEdge30 img {
  width: 600px;
  height: 30px;
}

.Block {
  background: #77FFFF url("block-middle.png") repeat;
}

.BlockIn {
  margin: 0px 40px;
}

.Block2 {
  background: #77FFFF url("block2-middle.png") repeat;
}

.Block2In {
  margin: 0px 240px 0px 60px;
  font-size: 20px;
}

.Block2In p {
  margin: 10px 0px;
  font-style: italic;
}

.RightFloat {
  float: right;
  margin-left: 20px;
  margin-bottom: 20px;
}

.LeftFloat {
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
}

a {
  color: #0030B0;
}

img {
  margin: 0px;
}

h2 {
  font-weight: normal;
  font-size: 24px;
  background-color: #FFFFCC;
  padding: 4px 12px;
  border: 3px dotted #CCC;
}

h3 {
  font-weight: normal;
  font-size: 20px;
}

.SecHead {
}

.BuyPara {
  text-align: center;
  margin-top: 24px;
  margin-bottom: 24px;
  background-color: #FFFFCC;
  padding: 8px 12px;
  border: 3px solid #44BBDD;
  border-radius: 6px;
}

.BuyLinkImage {
  background: #FFF;
  border: 1px solid #44BBDD;
  border-radius: 4px;
}

.BookListPara {
  text-align: center;
}

.BookTitle {
  font-weight: bold;
}

em {
  font-variant: small-caps;
  font-size: 20px;
}

.SecHead em {
  font-size: 24px;
}

.Button {
  clear: both;
  font-size: 14px;
  text-align: center;
  width: 80px;
  background: #D07048;
  border: 3px solid #644;
  padding: 8px 0px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}

.FloatIcon {
  width: 80px;
  text-align: center;
}

.ImageTwoPanels {
  width: 240px;
  height: 200px;
}

.GridBar {
  position: relative;
  text-align: right;
  margin-bottom: 8px;
}

.GridIcon {
  vertical-align: top;
  display: inline-block;
  width: 80px;
  text-align: center;
  margin-left: 4px;
}

.GridIcon img {
  width: 80px;
  height: 80px;
}

.Footer em {
  font-size: 15px;
}

.IsWide {
  display: block;
}
.IsNarrow {
  display: none;
}


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

body {
  font-size: 14px;
}

em {
  font-variant: small-caps;
  font-size: 15px;
}

.SecHead em {
  font-size: 20px;
}

h2 {
  font-size: 20px;
}

h3 {
  font-size: 18px;
}

.Main {
  max-width: 480px;
  border-left: none;
  border-right: none;
}

.Header {
  height: 136px;
}

.Title {
  margin: 0px;
  width: 480px;
  height: 136px;
}
.TitleWide {
  margin: 0px;
  display: none;
}
.TitleNarrow {
  margin: 0px;
  display: inline;
}

.Block {
  background: #77FFFF url("block-middle-s.png") repeat;
}

.Block2 {
  background: #77FFFF url("block2-middle-s.png") repeat;
}

.Block2In {
  margin: 0px 180px 0px 50px;
  font-size: 14px;
}
.Block2In p {
  margin: 10px 0px;
}

.BlockEdge25 {
  height: 20px;
}

.BlockEdge25 img {
  width: 480px;
  height: 20px;
}

.BlockEdge30 {
  height: 24px;
}

.BlockEdge30 img {
  width: 480px;
  height: 24px;
}

.LeftFloat {
  margin-bottom: 14px;
}

.RightFloat {
  margin-bottom: 14px;
}

.Button {
  font-size: 13px;
  width: 60px;
  padding: 2px 0px;
}

.GridIcon {
  font-size: 12px;
}

.Footer {
  font-size: 13px;
}

.ImageTwoPanels {
  width: 214px;
  height: 164px;
}

.IsWide {
  display: none;
}
.IsNarrow {
  display: block;
}

}

