@font-face {
    font-family: 'Goth';
    src: url('../fonts/goth720n-webfont.eot');
    src: url('../fonts/goth720n-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/goth720n-webfont.woff') format('woff'),
         url('../fonts/goth720n-webfont.ttf') format('truetype'),
         url('../fonts/goth720n-webfont.svg#Gothic720BTRoman') format('svg');
    font-weight: normal;
    font-style: normal;
}

  .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 transparent;}
  
  .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;*/ background: url(../images/page-pattern.png) left top repeat #BBB;}
  .booklet .pageLeft { background: url("../images/leftPage-border.png") no-repeat right 0 transparent; height: 520px; padding-top: 25px; }
  .booklet .pageLeft .img {background: url("../images/leftPage-line.png") right 0 no-repeat; float: left; height: 335px; margin-top: 70px; width: 100%;}
  .booklet .b-wrap-right {/*background:#efefef;*/ background: url(../images/page-pattern.png) left top repeat #999;}
  .booklet .pageRight {background: url("../images/rightPage-border.png") no-repeat scroll left 0 transparent;height: 520px;padding-top: 25px;}
  .booklet .pageRight .menu-holder {background: url("../images/rightPage-line.png") left 0 no-repeat; float: left; margin-top: 50px; width: 100%;}
  .booklet .pageRight h4 {margin:0; padding:0; color: #FFF; font-family: Goth; font-size: 18px; line-height: 20px; text-transform: uppercase; }
  .booklet .pageRight .menu {background: url("../images/manu-bg.png") 0 0 repeat; color: #FFF; float: right; font-family: Goth; height: 430px; padding: 10px 10px 10px 0; width: 387px; }
  .menu .viewport { height: 430px; overflow: hidden; position: relative; padding-left: 10px; }
  .menu .overview { width: 100%; }
  .booklet .pageRight .menu table tr { border-bottom: 1px solid #FFF; }
  .booklet .pageRight .menu table {border-collapse: collapse; width: 100%; }
  .booklet .pageRight .menu p, .booklet .pageRight .menu table { font-size: 12px; line-height: 18px; margin: 0 0 20px; padding: 0; }
  
  .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:0px 1px 3px #222;}
   
     /* Page Numbers */
  .booklet .b-counter {bottom:10px; position:absolute; display:block; width:25px; height:20px; background:#999; 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:-80px;}
  .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 0px;}
  .b-selector:hover .b-current {background-position:right 0px;}
  .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;}