body, html {
  padding: 0;
  margin: 0;
  font-family: 'Roboto', sans-serif;
}
*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#reader-container {
  width: 98%;
  height: 98%;
  min-height: auto;
  position: absolute;
  left: 0;
  right: 0;
  /*bottom: 16px;*/
  margin: auto;
  background: transparent;
  z-index: 2;
}
#reader-container .content .pages .overlayer .page .overlay.area {
  background-color: transparent;
  border: none;
}
#reader-container .content .pages .overlayer .page .overlay:not(.open):hover .dimmer {
  background-color: rgba(39, 176, 230, 0.90);
}
#reader-container .content .pages .overlayer .page .overlay.open {
  background-color: #fff;
}
#reader-container .content .pages .overlayer .page .overlay:not(.open):hover:before {
  content: "\f217";
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
  /*--adjust as necessary--*/
  color: #fff;
  padding-right: 0.5em;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -16px 0 0 -16px;
  z-index: 99;
  font-size: 32px;
}
#reader-container .content .pages .overlayer .page .overlay .icon {
    color: rgba(78,78,78,0.80);
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 20px;
}
@media only screen and (max-width:979px), only screen and (max-device-width:979px) {
	#reader-container {
		width: 100%;
		height: 70%;
	}
}

html, body {
    background-color: #fff;
    overflow-x: hidden;
}

html html {
    overflow: auto;
}