/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline; }

/* Site-wide properties ======================================================== */
body{
    font-size: 14px;
    background-color: #f0ead4;
}

/* Fibonacci based heading scale ratio */
h1{ font-size: 1.5em; font-weight: normal; }
h2{ font-size: 1.3em; font-weight: bold; }
h3{ font-size: 1.2em; font-weight: bold; }
h4{ font-size: 1.1em; font-weight: bold; }
h5{ font-size: 1.1em; font-weight: bold; }

/* Reusable classes ============================================================ */

/* Left & Right alignment */
.left{ float: left; }
.right{ float: right; }

/* The inside class provides consistent padding. To be used often! */
.inside{ padding: 20px; }


/* The fraction classes are useful for column lists */
ul.half li, ul.third li, ul.quarter li, ul.fifth li, ul.sixth li{ float: left; list-style-type: none;}
ul.half li{ padding-right: 5%; width: 45%; }
ul.third li{  padding-right: 5%; width: 28.3%; }
ul.quarter li{  padding-right: 5%; width: 20%; }
ul.fifth li{  padding-right: 3%; width: 17%; }
ul.sixth li{  padding-right: 1.5%; width: 15%; }

/* For when a <br /> just ain't enough */
.separator{
    clear: both;
    float: left;
    height: 1px;
    width: 100%;
}

/* Basic Structure ============================================================= */
#wrap{
    width: 960px;
    margin: 0 auto;
    position: relative;
    background-color: #fff;
}

/* Header */
header{
    float: left;
    width: 100%;
}

/* Content */
/* article{float: left; width: 66.7%; }*/
/* Sidebar */
/* aside{float: left; width: 33.3%; }*/

/* Footer */
footer{
    width: 100%;
}

/* Project specifics =========================================================== */
/* Pour some CSS below ========================================================= */

/** clearfix **/
.clear:after{
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
}
.clear{
    display:inline-block;
    min-height:1%;  /* for IE 7*/
}


p, li {line-height: 150%;}

a {color: #229;}

img#logo {
    position: absolute;
    display: block;
    float: left;
    paddng: 10px 10px;
    margin: -30px 10px 20px 50px;
    z-index: 2;
    border: 0;
    background-color: white;
}

/* Menu */

nav#topmenu{
    width: 100%;
    border-top: 1px solid #a2a39e;
    border-bottom: 1px solid #a2a39e;
    float: right;
    margin: 0 0 10px 0;
    padding: 10px 0 10px 0;
    background-color: #750000;

    background-image: -webkit-gradient(
	linear, left bottom, left top,
	color-stop(0.45, rgb(84,0,0)),
	color-stop(0.74, rgb(120,0,0))
    );
    background-image: -moz-linear-gradient(
	center bottom,
	rgb(84,0,0) 45%,
	rgb(120,0,0) 74%
    );
    background-image:      linear-gradient(
	center bottom,
	rgb(84,0,0) 45%,
	rgb(120,0,0) 74%
    );
        }
        nav#topmenu ul {
	    margin: 0 0 0 380px;
	    width: 550px;
        }
        nav#topmenu ul li{
            display: block;
            float: left;
	    font-family: sans-serif;
	    line-height: 2em;
	    font-size: 1em;
/*            font: normal normal 1em/2em Arial, Helvetica, Verdana, sans-serif;*/
            padding: 0 30px 0 30px;
            margin: 10px 0 10px 0;
	    color: #fff;
	}

	nav#topmenu ul li.current {
	    border: 1px solid #833;
	    background-color: #320000;
        }

/*         nav ul li:last-child{ margin:0; }*/

            nav#topmenu ul li a{
		text-decoration: none;
                color: #eee;
                display: block;
                }
            nav#topmenu ul li a:hover{
                color: #fff;
                opacity: 0.6; }


#top{
    width: 100%;
    display: block;
    background-color: #dcddcb;
    padding: 5px 0;
}
.loginstatus{
float:right;
margin-right: 20px;
}

#main {
    width: 920px;
    margin: 0 auto;
}

.alert {
    color: #900;
    font-size: 10pt;
}
.notice {
    color: #090;
    font-size: 10pt;
}

.center {
    text-align: center;
}

#lead h1 {
    width: 250px;
    height: 30px;
    float: left;
    border-right: 1px solid #ccc;
    font-weight: normal;
    font-size: 1.4em;
    margin: 0 20px 10px 30px;
    padding: 10px 0 0 0;
}

#lead p {
    margin: 0 0 0 0;
    padding: 10px 0 0 0;
}

#lead {
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    border-bottom: 1px solid #ccc;
}

#intro {
  display: block;
  border: 1px solid #ccc;
  margin: 10px auto 40px;
  width: 900px;
  padding: 10px;
     -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
          border-radius: 5px;

  background-image: -webkit-gradient(
      linear, left bottom, left top,
      color-stop(0.55, rgb(255,255,255)),
      color-stop(1.0, rgb(240,241,233))
  );
  background-image: -moz-linear-gradient(
      center bottom,
      rgb(255,255,255) 55%,
      rgb(240,241,233) 100%
  );
  background-image:      linear-gradient(
      center bottom,
      rgb(255,255,255) 74%,
      rgb(220,221,203) 45%
  );

}

.specialbooks {
    display: block;
    background-color: #eceddb;
    padding: 10px;
    background-image: -webkit-gradient(
      linear, left top, left bottom,
      color-stop(0.1, #fff),
      color-stop(0.55, #cccdbb),
      color-stop(0.75, #fff)
    );
    background: -moz-linear-gradient(
      center top,
      #fff 10%,
      #cccdbb 55%,
      #fff 75%
    );
    background-image: linear-gradient(
      center bottom,
      rgb(255,255,255) 75%,
      rgb(240,241,233) 55%,
      rgb(255,255,255) 10%
    );
 }

.specialbooks img {
  display: block;
  margin: 0 auto 20px;
  text-align: center;
}

.specialbooks h3 {
    font-size: 11pt;
    text-decoration: none;
}
.specialbooks h3 a {
    color: #009;
    text-decoration: none;
}
.specialbooks h3 a:hover {
    text-decoration: underline;
}

span.betabook {
    border: solid 1px #111;
    white-space: nowrap;
    padding: 2px 3px;
    background-color: #800;
    color: #fff;
    font-size: small;
    font-weight: normal;
}

span.soonbook {
    border: solid 1px #666;
    white-space: nowrap;
    padding: 2px 3px;
    background-color: #343;
    color: #fff;
    font-size: small;
    font-weight: normal;
}

span.endbook {
    border: solid 1px #111;
    white-space: nowrap;
    padding: 2px 3px;
    background-color: #800;
    color: #fff;
    font-size: small;
    font-weight: normal;
}

h2.linked-title a {
    color: #000;
    text-decoration: none;
}
h2.linked-title a:hover{
    opacity: 0.7;
    text-decoration: underline;
}

h4 span.small {
    font-size: 90%;
}


h3#top-old-book {
    width: 900px;
    margin: 0 0 10px 0;
    border-bottom: 1px solid #b8b8b8;
    background-repeat: no-repeat;
    background-position: right center;
}
h3#top-news {
    padding: 7px 0 5px 0;
    background-image: url(/images/top-icon-news.png);
    background-repeat: no-repeat;
    background-position: right center;
}
h3#top-book {
    padding: 7px 0 5px 0;
    background-image: url(/images/top-icon-book.png);
    background-repeat: no-repeat;
    background-position: right center;
}
h3#top-faq {
    padding: 7px 0 5px 0;
    background-image: url(/images/top-icon-faq.png);
    background-repeat: no-repeat;
    background-position: right center;
}

section.half{ float: left; padding: 0 7%; width: 35%; }
section.third{ float: left; padding-right: 20px; width: 290px;}
section.quarter{ float: left; padding-right: 5%; width: 20%; }
section.fifth{  float: left; padding-right: 3%; width: 17%; }
section.sixth{  float: left; padding-right: 1.1%; width: 15.5%; }

div.info {
  margin: 40px 0 40px;
  width: 940px;
}

div.info ul {
    border-top: 1px solid #b8b8b8;
    padding-top: 10px;
}

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

div.info ul li {
  margin: 0 0 10px 0;
}

div.info section div#facebook {
  margin: 20px 0 0 0;
}

.readmore { text-align: right;}

li time {
    display: block;}

/** for top page **/
figure.ads-sq {
  text-align: center;
  margin: 0 0 30px 0;
}
figure.ads-sq img {
  border:solid 1px #777;
  width: 180px;
}
figure.ads-sq figcaption {
  text-align: center;
}

/** for devise page **/
div.iframe-terms {
    border: solid 1px #808080;
    width: 800px;
    height: 300px;
    padding: 0.5em;
    overflow: auto;
}
div.iframe-terms,div.iframe-terms p  {
    font-size: 10pt;
}
div.iframe-terms li  {
  margin: 0 20px 0;
}

/** for comany page **/

table.maintable {
    margin: 0 0 0 20px ;
    border-spacing: 10px;
}

table.maintable tr th {

    /*background-color: #eceddb;*/
    border-top: 1px solid #a2a39e;
    border-left: 1px solid #a2a39e;
    text-align: left;
    width: 240px;
    height: 20px;

    font-weight: bold;
    margin: 0 20px 10px 30px;
    padding: 5px 0 5px 10px;

}

table.maintable tr td {
    padding: 5px 10px;
}


/** for list page **/

article.book {
    float: left;
    padding: 10px 10px 30px 8px;
    width: 420px;
    height: 230px;
}
article.book img {
    float: left;
    padding: 0 0 0 0;
    margin: 0 10px 0 0;
}
article.book img:hover{
    opacity: 0.5;
}
article.book h3 a{
    color: #009;
    text-decoration: none;
}
article.book h3 a:hover{
    text-decoration: underline;
}
article.book p.author {
    text-align: right;
}
article.book p.publisher {
    text-align: right;
}
article.book p.price {
    text-align: right;
    color: #900;
}

/** for book detail page **/
section#bookinfo {
    background-color: #eceddb;
    margin: 0 20px;
    background-image: -webkit-gradient(
      linear, left top, left bottom,
      color-stop(0.3, #fff),
      color-stop(0.8, #dcddcb),
      color-stop(1.0, #fff)
    );
    background: -moz-linear-gradient(
      center top,
      #fff 30%,
      #dcddcb 80%,
      #fff 100%
    );
    background-image: linear-gradient(
      center bottom,
      #fff 30%,
      #dcddcb 80%,
      #fff 100%
    );
}

section#bookinfo .bookimage {
    float: left;
    margin: 10px 30px 10px 30px;
    text-align: center;
}
img.coversmall {
          box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.4);
     -moz-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.4);
}

img.photo {
    margin: 0 0 20px 20px;
    float: right;
}

div.photo {
    width: 300px;
    margin: 0 0 20px 20px;
    float: right;
    text-align: center;
}
div#bookdetail div.photo p {
    text-align: left;
    font-size: 10pt;
}

div section blockquote {
    margin: 10px 10px;
    padding: 30px 50px 10px 50px;
    background: #ecedde;
    border: none;
/*    border-left: 5px solid #f0ead4;*/
       -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
            border-radius: 20px;
}

section#bookinfo .buybutton div {
    padding: 10px 0;
}

.buybutton .cart_item {
    background-color: #cccdbb;
    width: 130px;
    height: 40px;
    margin: 10px 0 10px 0;
    padding: 10px 20px;
    text-align: center;

     -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
          border-radius: 8px;

  background-image: -webkit-gradient(
      linear, left bottom, left top,
      color-stop(0.25, rgb(220,221,203)),
      color-stop(0.70, rgb(255,255,255))
  );
  background-image: -moz-linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 70%
  );
  background-image:      linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 70%
  );
  border: 1px solid #666;

  /* section#bookinfo .buybutton a */
  color: #900;
  font-weight: bold;
  font-size: 14px;
  text-decoration: none;
}

/*section#bookinfo .buybutton form input.cart_item:hover,
section#bookinfo .buybutton a.cart_item:hover*/hover
.buybutton .cart_item:hover, {
    opacity: 0.6;
    background-image: -webkit-gradient(
	linear, left bottom, left top,
	color-stop(0.25, rgb(220,221,203)),
	color-stop(0.60, rgb(255,255,255))
    );
    background-image: -moz-linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 60%
  );
    background-image:      linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 60%
  );
}

.buybutton .endofsales {
    background-color: #aaa;
    width: 130px;
    height: 40px;
    margin: 10px 0 10px 0;
    padding: 10px 20px;
    text-align: center;

       -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
            border-radius: 8px;

    border: 1px solid #333;

    /* section#bookinfo .buybutton a */
    color: #300;
    font-weight: bold;
    font-size: 14px;
    text-decoration: none;
}

.buybutton .setonly {
    background-color: #ccc;
    width: 130px;
    height: 40px;
    margin: 10px 0 10px 0;
    padding: 10px 20px;
    text-align: center;

       -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
            border-radius: 8px;

    border: 1px solid #333;

    /* section#bookinfo .buybutton a */
    color: #300;
    font-weight: bold;
    font-size: 14px;
    text-decoration: none;
}

section#bookinfo  {
    width: 90%;
    margin: 10px auto 0;
}

section#bookinfo  #twittericon {
    float: right;
    margin: 0 -20px 0 5px;
}
section#bookinfo  #hatebuicon {
    float: right;
    margin: 0 0 0 5px;
}
section#bookinfo  #fbicon {
    float: right;
    margin: 0 0 0 5px;
}

section#bookinfo  p.price {
    color: #900;
}

section#bookinfo div.warning-fixed {
    font-weight: bold;
}

div#bookdetail section.doc p.update-book {
    padding: 1em 2em;
}

section#voices {
  border: 1px solid #999;
  margin: 10px 0 40px;
  padding: 10px;
     -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
          border-radius: 5px;

  background-image: -webkit-gradient(
      linear, left bottom, left top,
      color-stop(0.85, rgb(255,255,255)),
      color-stop(1.0, rgb(245,246,240))
  );
  background-image: -moz-linear-gradient(
      center bottom,
      rgb(255,255,255) 85%,
      rgb(245,246,240) 100%
  );
  background-image:      linear-gradient(
      center bottom,
      rgb(255,255,255) 85%,
      rgb(245,246,240) 100%
  );


    color: #900;
    position: relative;

}
		section#voices .tooltipAngle {
			border-right: solid 20px transparent;
			border-left-width: 0;
			border-top: solid 20px #999;
			line-height: 0;
			position: absolute;
			left: 10em;
			bottom: -20px;
			-border-right-color: white; /* for IE6 */
		}
		section#voices .tooltipAngle .tooltipAngleInner {
			border-right: solid 17px transparent;
			-border-right-color: white; /* for IE6 */
			border-left-width: 0;
			border-top: solid 17px white;
			line-height: 0;
			position: absolute;
			left: 1px;
			bottom: 3px;
		}

div#bookdetail {
    margin: 0 0 30px 0;
}

div#bookdetail section {
    margin: 0 auto;
    width: 90%;
}

section.doc h3 {
    border-bottom: 1px solid #dcddcb;
    font-size: 16pt;
    padding: 3px 0 0 0;
    margin: 30px 0 10px 0;
    font-weight: normal;
   /* font-family: "ＭＳ Ｐ明朝","MS PMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro",serif; */
    color: #333;

    background-image: -webkit-gradient(
      linear, left top, right top,
      color-stop(0.0, #fff),
      color-stop(0.8, #eee),
      color-stop(1.0, #eceddb)
    );
    background-image: -moz-linear-gradient(
      left,
      #fff 0%,
      #eee 80%,
      #dcddcb 100%
    );

}

ul.booknavi {
    margin: 10px 0 0 0;
    list-style-type: none;
}
ul.booknavi li {
    width: 120px;
    border: solid 1px #ccc;
    display: block;
    float: left;
    line-height: 1.5em;
    font-size: 1em;
    padding: 0 10px 0 10px;
    margin: 10px 0 10px 10px;
    color: #333;
    background-color: #eceddb;
    text-align: center;
}
ul.booknavi li a{
    text-decoration: none;
    color: #333;
    display: block;
}
ul.booknavi li a:hover{
    text-decoration: none;
    font-weight: bold;
    display: block;
}

div#bookdetail section.lead {
    margin: 3em auto;
}

div#bookdetail section.code {
    margin: 1em auto;
}

section.doc h4 {
    border-bottom: 1px solid #dcddcb;
    font-size: 14pt;
    padding: 3px 0 0 0;
    margin: 20px 0 20px 0;
    font-weight: normal;
}
div#bookdetail p, section.doc p {
    font-size: 11pt;
    margin: 0 0 1em 0;
}

section.doc div.quote-email {
    margin: 20px;
    padding: 20px;
    border: 1px solid #777;
    font-size: 9pt;
}

/** bread crumb **/

section#bread {
       -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
            border-radius: 8px;
    border: 1px solid #ccc;
}

section#bread .breadlist {
    font-size: small;
    margin: 0 10px;
    padding: 10px 0;
}

section#bread #uptopagetop {
    float: right;
    margin: -10px 10px 0 10px;
    padding: 10px 10px 10px 10px;
    border-left: 1px solid #ccc;
}

section#bread a {
    text-decoration: none;
}

section#bread .breadsep {
    margin: 0 5px;
    color: #ccc;
}

/** error form **/
.doc div#error_explanation {
    margin: 10px 0;
}
.doc div#error_explanation h2 {
    font-size: 16pt;
    color: #f00;
}
.doc div#error_explanation p {
    color: #f00;
}
.doc div#error_explanation li {
    margin-left: 10px;
    color: #f00;
    list-style-type: none;
}
.doc div#error_explanation li:before {
    content: "►";
}
.doc p, .auth label {
    font-size: 11pt;
}

/** for ranking page **/
section.ranking .book img {
    float: none;
}
section.ranking a {
 text-decoration: none;
}
section.ranking a:hover {
 text-decoration: underline;
}
section.ranking article.book {
  width: 900px;
  height: 200px;
}
section.ranking article.book h4 {
    font-weight: bold;
    margin: 0 0 10px 0;
}

section.ranking .buybutton .cart_item {
    width: 110px;
    height: 30px;
    margin: 5px 0 5px 0;
    padding: 5px 20px;
    font-size: 12px;
}

/** auth form **/
.auth div#error_explanation {
    margin: 10px 0;
}
.auth div#error_explanation h2 {
    font-size: 16pt;
    color: #f00;
}
.auth div#error_explanation li {
    margin-left: 10px;
    color: #f00;
    list-style-type: none;
}
.auth div#error_explanation li:before {
    content: "►";
}
.auth p, .auth label {
    font-size: 11pt;
}
.solid {
    width: 22em;
    font-size: 12pt;
}
.field_with_errors input {
  background-color: #fcc;
}
.field_with_errors textarea {
  background-color: #fcc;
}

.authbutton {
    background-color: #cccdbb;
    margin: 10px auto 0;
    padding: 3px 5px;
    text-align: center;
    width: 200px;

     -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
          border-radius: 8px;

  background-image: -webkit-gradient(
      linear, left bottom, left top,
      color-stop(0.25, rgb(220,221,203)),
      color-stop(0.70, rgb(255,255,255))
  );
  background-image: -moz-linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 70%
  );
  background-image:      linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 70%
  );
  border: 1px solid #999;

  /* section#bookinfo .buybutton a */
  color: #000;
  font-weight: bold;
  font-size: 14px;
  text-decoration: none;
  line-height: 2em;
}
.authbutton:hover{
    opacity: 0.7;
    margin: 8px 0 2px 0;
    background-image: -webkit-gradient(
	linear, left bottom, left top,
	color-stop(0.25, rgb(220,221,203)),
	color-stop(0.60, rgb(255,255,255))
    );
    background-image: -moz-linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 60%
  );
    background-image:      linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 60%
  );
}


/** cart **/
table.cart {
    margin: 30px auto 10px;
    border-collapse:collapse;
}
table.cart tr  {
    border-bottom: 1px #cccdbb solid;
}
table.cart td {
    text-align: center;
    vertical-align: middle;
    font-size: 12pt;
    padding: 10px;
}
table.cart td.title {
    width: 350px;
    text-align: left;
}
table.cart td.title .new {
    color: #d00;
}
table.cart .price {
    width: 150px;
}
table.cart .action {
    width: 150px;
    font-size: 10pt;
}
table.cart .author {
    width: 150px;
    font-size: 11pt;
}
table.cart .version {
    width: 100px;
}
table.cart .feedback {
    width: 100px;
    font-size: 10pt;
}

div.terms {
    width: 800px;
    height: 400px;
    border: solid 1px #dcddcb;
    overflow: scroll;
    padding: 10px;
}


section.doc ul {
    margin: 1em 0 1em 1.5em;
}

section.doc ul  {
    margin: 0.2em 1.2em;
}

.navibutton {
    background-color: #cccdbb;
    margin: 10px auto 0;
    padding: 10px 10px;
    text-align: center;
    width: 200px;

     -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
          border-radius: 8px;

  background-image: -webkit-gradient(
      linear, left bottom, left top,
      color-stop(0.25, rgb(220,221,203)),
      color-stop(0.70, rgb(255,255,255))
  );
  background-image: -moz-linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 70%
  );
  background-image:      linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 70%
  );
  border: 1px solid #999;

  color: #000;
  font-weight: bold;
  font-size: 14px;
  text-decoration: none;
  line-height: 2em;
}
.navibutton:hover{
    opacity: 0.7;
    margin: 8px 0 2px 0;
    background-image: -webkit-gradient(
	linear, left bottom, left top,
	color-stop(0.25, rgb(220,221,203)),
	color-stop(0.60, rgb(255,255,255))
    );
    background-image: -moz-linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 60%
  );
    background-image:      linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 60%
  );
}

/** feedback **/
section#feedbackform {
    margin: 0 20px;
    padding: 5px 10px;
    border: 1px solid #bbb;
    background-color: #f0eae4;
    font-size: 10pt;
}
section#feedbackform p label {
    vertical-align: top;
}

div#feedbacks p {
    font-size: 10pt;
}
div#feedbacks .mistake {
    color: blue;
}
div#feedbacks .correct {
    color: red;
}
div#feedbacks .comment {
    color: #090;
}


/** about pages **/
section.about {
  padding:  0 0 0 300px; /* サイドバーとの距離 */
}

nav#sidemenu {
  float: left;
  width: 260px;
  padding: 45px 10px 0 10px;
}

nav#sidemenu ul {
  display: block;
  list-style-type: none;
  background-color: #f0ead4;
}
nav#sidemenu ul ul{
  background: #fff;
}

nav#sidemenu ul li {
    padding: 10px 0;
    margin: 0 0 0 10px;
    color: #333;
}
nav#sidemenu ul li a {
    color: #333;
    text-decoration: none;
}
nav#sidemenu ul li a:hover{
    color: #333;
    opacity: 0.6;
    text-decoration: underline;
}


/** news release **/
div#release {
    margin: 10px 0 100px 0;
}
div#release section.doc h1 {
    margin: 10px;
    text-align: center;
}
div#release section.doc h2 {
    margin: 10px;
    text-align: center;
}
div#release p.release-head{
    text-align: right;
}
div#release section.doc p.date {
    text-align: right;
    margin: 20px;
}

/** books optional pages **/
section.doc div.note  {
    border: 1px solid #bbb;
    margin: 20px 10px 20px 40px;
    padding: 10px 10px 0 10px;
    color: #666;
}

section.doc p.sample-image  {
    text-align: center;
}
section.doc p.sample-image img  {
    border: 1px solid #bbb;
}

/** magazine **/
section.doc div.banner  {
    text-align: center;
}

/** about **/
figure.howto {
    text-align: center;
    margin: 20px 20px;
}
figure.howto img {
    max-width: 80%;
 border: solid 5px #f9f9f9;
 outline: solid 1px #666;
/*
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px#888;
box-shadow: 0 0 5px #888;
*/
}
figure.howto figcaption {
    color: #666;
}

/** author **/
table.books td.number {
    text-align: right;
}

/** confirm **/
table.confirm th {
    text-align: right;
    padding-right: 1em;
}

/** common footer **/

footer {
    border-top: 1px solid #000;
    margin: 30px 0 0;
    padding: 10px 0 10px 0;
    background-color: #dcddcb;
}
footer div{
    margin: 0 auto;
    text-align: center;
}
footer div.footer-column{
    padding: 10px;
    text-align: left;
}
footer div.footer-column a{
    color: #000;
    text-decoration: none;
}
footer div.footer-column a:hover{
    text-decoration: underline;
    background-color: #eceddb;
}

/** ribbon (http://github.com/blog/525-github-ribbon-in-css) **/
.ribbon-holder {
  z-index: 10;
  position: absolute;
  top: 0;
  overflow: hidden;
  height: 15em;
  left: 0;
}
.ribbon,
.ribbon:hover {
  text-decoration: none;
}

.ribbon {
  letter-spacing: -0.1px;
  opacity: 0.95;

  padding: 0.25em 0;
  position: relative;
  top: 2em;

  /* Defaults friendly for white pages. */
     -moz-box-shadow: 0 0 13px #888;
  -webkit-box-shadow: 0 0 13px #888;
  color: #fff;
  display: block;
  line-height: 1.8em;
}

.ribbon .text {
  font-size: 13pt;
  font-weight: bold;
  padding: 0.1em 3em;
}

.left .ribbon {
     -moz-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  left: -3em;
}

.green.ribbon {
  background-color: #006e00;
  background: -webkit-gradient(linear, left bottom, left top, from(#006e00), to(#007200));
}

.green.ribbon .text {
  border: 1px solid #6bac6b;
}


/** special page **/
.salebutton a {
    display: inline-block;
    width: 800px;
    background-color: #cccdbb;
    margin: 10px 10px 10px 10px;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;

     -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
          border-radius: 8px;

  background-image: -webkit-gradient(
      linear, left bottom, left top,
      color-stop(0.25, rgb(220,221,203)),
      color-stop(0.70, rgb(255,255,255))
  );
  background-image: -moz-linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 70%
  );
  background-image:      linear-gradient(
      center bottom,
      rgb(220,221,203) 25%,
      rgb(255,255,255) 70%
  );
  border: 1px solid #666;

}
.salebutton a .buttontext{
  color: #000;
  font-weight: bold;
  font-size: 24px;
  text-decoration: none;
}
.salebutton a:hover{
    opacity: 0.7;
  text-decoration: underline;
}