/*
 * jQuery Booklet Plugin
 * Copyright (c) 2010 - 2014 William Grauvogel (http://builtbywill.com/)
 *
 * Licensed under the MIT license (http://www.opensource.org/licenses/mit-license.php)
 *
 * Version : 1.4.4
 *
 * Originally based on the work of:
 *	1) Charles Mangin (http://clickheredammit.com/pageflip/)
 */
	.booklet         {width:800px; height:600px; position:relative; margin:0 auto 10px; overflow:visible !important;}
	.booklet .b-page {left:0; top:0; position:absolute; overflow:hidden; padding:0; outline:1px solid rgba(0,0,0,0);background-color: #eee;}
	
	.booklet .b-pN  {}
	.booklet .b-p0  {}
	.booklet .b-p1  {}
	.booklet .b-p2  {}    
	.booklet .b-p3  {}
	.booklet .b-p4  {}
	   
   	/* Page Wrappers */
	.booklet .b-wrap       {top:0; position:absolute;}
	.booklet .b-wrap-left  {background:#fff;}
	.booklet .b-wrap-right {background:#efefef;}
	
	.booklet .b-pN .b-wrap,
	.booklet .b-p1 .b-wrap,
	.booklet .b-p2 .b-wrap,
	.booklet .b-p3 .b-wrap,
	.booklet .b-p4 .b-wrap  {left:0;}
	.booklet .b-p0 .b-wrap  {right:0;}
	
   	/* Custom Page Types */
	.booklet .b-page-blank  {padding:0; width:100%; height:100%;}
	.booklet .b-page-cover  {padding:0; width:100%; height:100%; background:#925C0E;}
	.booklet .b-page-cover h3  {color:#fff; text-shadow:0 1px 3px #222;}
   
   	/* Page Numbers */
	.booklet .b-counter {bottom:10px; position:absolute; display:block; width:25px; height:20px; background:#ccc; color:#444; text-align:center; font-family:Georgia, "Times New Roman", Times, serif; font-size:10px; padding:5px 0 0;}
	.booklet .b-wrap-left  .b-counter  {left:10px;}
	.booklet .b-wrap-right .b-counter {right:10px;}
   
   	/* Page Shadows */
	.booklet .b-shadow-f  {right:0; top:0; position:absolute; opacity:0; background-image:url("images/shadow-top-forward.png"); background-repeat:repeat-y; background-position:100% 0;}
	.booklet .b-shadow-b  {left:0;  top:0; position:absolute; opacity:0; background-image:url("images/shadow-top-back.png");    background-repeat:repeat-y; background-position:0 0;}
	
	.booklet .b-p0 {background-image:url("images/shadow.png"); background-repeat:repeat-y; background-position:100% 10px;}
	.booklet .b-p3 {background-image:url("images/shadow.png"); background-repeat:repeat-y; background-position:0 10px;}
	
   	/* Overlay Controls */
	.booklet .b-grab     {cursor: url("images/openhand.cur"), default;}
	.booklet .b-grabbing {cursor: url("images/closedhand.cur"), default;}
	
   	/* Overlay Controls */
	.booklet .b-overlay      {top:0; position:absolute; height:100%; width:50%;}
	.booklet .b-overlay-prev {left:0;}
	.booklet .b-overlay-next {right:0;}
	
   	/* Tab Controls */
	.booklet .b-tab        {background:#000; height:40px; width:100%; padding:10px 0 0; text-align:center; color:#ccc; position:absolute; font-size:11px;}
	.booklet .b-tab-prev   {left:0;}
	.booklet .b-tab-next   {right:0;}
	.booklet .b-tab:hover  {background:#aaa; color:#000;}	
	
   	/* Arrow Controls */
	.booklet .b-arrow          {display:block; position:absolute; text-indent:-9999px; top:0; height:100%; width:74px;}
	.booklet .b-arrow div      {display:none; text-indent:-9999px; height:170px; width:74px; position:absolute; left:0; top:25%;}
	.booklet .b-arrow-next     {right:-80px;}
	.booklet .b-arrow-prev     {left:-25px;}
	.booklet .b-arrow-next div {background:url("images/arrow-next.png") no-repeat left top;}
	.booklet .b-arrow-prev div {background:url("images/arrow-prev.png") no-repeat left top;}
		
/* @z-index fix (needed for older IE browsers)
----------------------------------------*/

    body              {z-index:0;}
    .b-menu           {z-index:100;}
    .b-selector       {z-index:100;}
    .booklet          {z-index:10;}
    .b-pN             {z-index:10;}
    .b-p0             {z-index:30;}
    .b-p1             {z-index:20;}
    .b-p2             {z-index:20;}
    .b-p3             {z-index:30;}
    .b-p4             {z-index:10;}
    .b-prev           {z-index:40;}
    .b-next           {z-index:40;}
    .b-counter        {z-index:40;}
	
/* @Menu Items
----------------------------------------*/
	.b-menu {height:40px; padding:0 0 10px;}
	
	.b-selector             {height:40px; position:relative; float:right; border:none; color:#cecece; cursor:pointer; font:normal 12px "Myriad Pro", Myriad, "DejaVu Sans Condensed","Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;}
	.b-selector .b-current  {padding:8px 15px 12px; line-height:20px; min-width:18px; height:20px; display:block; background:#000; text-align:center;}
	.b-selector-page        {width:auto; margin-left:15px;}
	.b-selector-chapter     {width:auto;}
	
	.b-selector:hover            {color:#fff; background-position:left 0;}
	.b-selector:hover .b-current {background-position:right 0;}
	.b-selector ul               {overflow:hidden; margin:0; list-style:none !important; position:absolute; top:40px; right:0; padding:0 0 10px; background:#000; width:240px;}
	.b-selector li               {border:none;}
	.b-selector a                {color:#cecece; height:14px; text-decoration:none; display:block; padding:5px 10px;}
	.b-selector a .b-text        {float:left; clear:none;}
	.b-selector a .b-num         {float:right; clear:none;}
	.b-selector a:hover          {color:#fff;}
		
		
	.b-page a{
		display: block; 
		width: 100%; 
		height: 100%;
	}
	.booklet{
		padding: 0px !important;
		background: #eee;
	}
	.booklet .b-wrap {
		padding: 0px !important;
		background: #eee;
		height: 100% !important;
	}
	.booklet .b-counter {background: transparent;}
	.booklet .b-wrap>div:first-child { 
		height: 100%;
		top: -14px;
		position: relative;
	}
	.booklet .b-wrap>div a {
		width: 100%; 
		height: 100%;
	}
	.booklet .b-wrap-left {
		right: 0 !important;
		left: auto !important;
	}
	.booklet .b-wrap-left a {
		margin: 0 !important; 
		padding: 0px !important;
		text-align: left;
		color: #000 !important;
		text-decoration: none;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+85,0.7+96,0.9+100 */
		background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 85%, rgba(0,0,0,0.4) 96%, rgba(0,0,0,0.9) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(85%,rgba(0,0,0,0)), color-stop(96%,rgba(0,0,0,0.4)), color-stop(100%,rgba(0,0,0,0.9))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 85%,rgba(0,0,0,0.4) 96%,rgba(0,0,0,0.9) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 85%,rgba(0,0,0,0.4) 96%,rgba(0,0,0,0.9) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 85%,rgba(0,0,0,0.4) 96%,rgba(0,0,0,0.9) 100%); /* IE10+ */
		background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 85%,rgba(0,0,0,0.4) 96%,rgba(0,0,0,0.9) 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#e6000000',GradientType=1 ); /* IE6-9 */

	}
	.booklet .b-wrap-right {}
	.booklet .b-wrap-left h3{
		visibility: visible;
		color: #000 !important;
		margin: 18px 0 0 -15px !important; 
		padding: 0px !important;
	}
	.booklet .b-wrap-right h3 {
		visibility: visible;
		color: #000 !important;
		margin: 18px -15px 0 0px !important;
		padding: 0px !important;
	}
	.booklet .b-wrap-right a {
		margin:  0 !important;
		padding: 0px !important;
		text-align: right;
		color: #000 !important;
		text-decoration: none;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.9+0,0.7+5,0+13 */
		background: -moz-linear-gradient(left,  rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.4) 5%, rgba(0,0,0,0) 13%, rgba(0,0,0,0) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.9)), color-stop(5%,rgba(0,0,0,0.4)), color-stop(13%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.4) 5%,rgba(0,0,0,0) 13%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.4) 5%,rgba(0,0,0,0) 13%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.4) 5%,rgba(0,0,0,0) 13%,rgba(0,0,0,0) 100%); /* IE10+ */
		background: linear-gradient(to right,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.4) 5%,rgba(0,0,0,0) 13%,rgba(0,0,0,0) 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */

	}
	.booklet .b-page-0 .b-wrap-left {background: #eee url(../example/covers/Robotech-Tactics.jpg) right 32% no-repeat; background-size: auto 95%;}
	.booklet .b-page-1 .b-wrap-right {background: #eee url(../example/covers/Rifts-Ultimate-Edition.jpg) left 32% no-repeat; background-size: auto 95%;}

	.booklet .b-page-2 .b-wrap-left {background: #eee url(../example/covers/Splicers-RPG.jpg) right 32% no-repeat; background-size: auto 95%;}
	.booklet .b-page-3 .b-wrap-right {background: #eee url(../example/covers/Palladium-Fantasy.jpg) left 32% no-repeat; background-size: auto 95%;}

	.booklet .b-page-4 .b-wrap-left {background: #eee url(../example/covers/Dead-Reign.jpg) right 32% no-repeat; background-size: auto 95%;}
	.booklet .b-page-5 .b-wrap-right {background: #eee url(../example/covers/Chaos-Earth.jpg) left 32% no-repeat; background-size: auto 95%;}

	.booklet .b-page-6 .b-wrap-left {background: #eee url(../example/covers/Beyond-the-Supernatural.jpg) right 32% no-repeat; background-size: auto 95%;}
	.booklet .b-page-7 .b-wrap-right {background: #eee url(../example/covers/The-Rifter.jpg) left 32% no-repeat; background-size: auto 95%;}

	.booklet .b-page-8 .b-wrap-left {background: #eee url(../example/covers/Heroes-Unlimited.jpg) right 32% no-repeat; background-size: auto 95%;}
	.booklet .b-page-9 .b-wrap-right {background: #eee url(../example/covers/After-the-Bomb.jpg) left 32% no-repeat; background-size: auto 95%;}

	.booklet .b-page-10 .b-wrap-left {background: #eee url(../example/covers/Mechanoid-Invasion-Triology.jpg) right 32% no-repeat; background-size: auto 95%;}
	.booklet .b-page-11 .b-wrap-right {background: #eee url(../example/covers/Nightbane.jpg) left 32% no-repeat; background-size: auto 95%;}

	.booklet .b-page-12 .b-wrap-left {background: #eee url(../example/covers/Ninjas-and-Superspies.jpg) right 32% no-repeat; background-size: auto 95%;}
	.booklet .b-page-13 .b-wrap-right {background: #eee url(../example/covers/Robotech-Shadow-Chronicles-RPG.jpg) left 32% no-repeat; background-size: auto 95%;}
	.booklet .b-tab {padding-top: 5px;}
	.booklet .b-tab-next {right: 20px; height: 15px !important; top: -20px !important;}
	.booklet .b-tab-prev {left: 20px; height: 15px !important; top: -20px !important;}
	.booklet .b-arrow div {
		background-size: contain;
		height: 40px !important;
		width: 30px !important;
		top: 125px !important;
	}