/* This is just a sample file with CSS rules. You should write your own @font-face declarations
 * to add support for your desired fonts.
 */

@font-face {
  font-family: 'Novecentowide Book';
  src: url("/ViewerJS/fonts/Novecentowide-Bold-webfont.eot");
  src: url("/ViewerJS/fonts/Novecentowide-Bold-webfont.eot?#iefix") format("embedded-opentype"),
  url("/ViewerJS/fonts/Novecentowide-Bold-webfont.woff") format("woff"),
  url("/fonts/Novecentowide-Bold-webfont.ttf") format("truetype"),
  url("/fonts/Novecentowide-Bold-webfont.svg#NovecentowideBookBold") format("svg");
  font-weight: normal;
  font-style: normal;
}

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

}

/* just to be sure these are full screen*/
html, body { width: 100%; height: 100%; }
/* To remove the scrollbars */

#the-canvas {
  margin: 0 0 0 30px;
  display: block;
}
#overlay-prev {
  top: 0;
  left: 0;
  position: fixed;
  display: block;
  height: 100%;
  width: 50%;
}
#overlay-prev-btn {
  top: 10px;
  left: 0;
  position: absolute;
  display: block;
  padding-top: 10px;
  height: 90%;
  width: 30px;
  background: #ccc;
  text-align: center;
}
#overlay-next {
  top: 0;
  right: 0;
  position: fixed;
  display: block;
  height: 100%;
  width: 50%;
}
#overlay-next-btn {
  top: 10px;
  right: 0;
  position: absolute;
  display: block;
  padding-top: 10px;
  height: 90%;
  width: 30px;
  background: #ccc;
  text-align: center;
}
#footer-bar {
  bottom: 2px;
  right: 10px;
  position: fixed;
  height: 25px;
}