body,
html {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
body {
width: 100%;
height: 100%;
background: #f1f1f1;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
text-align: center;
}
#flipbook,
.ipgs-flipbook {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
}


#ipgs-scrollbar-listener {
position: fixed !important;
margin: 0 !important;
padding: 0 !important;
width: 100% !important;
height: 0 !important;
bottom: 0 !important;
border: 0 !important;
background-color: transparent !important;
pointer-events: none;
}
@-webkit-keyframes ipgs-loading-animation {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes ipgs-loading-animation {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.ipgs {
position: relative;
padding: 0;
margin: 0;
width: 100%;
height: 400px;
overflow: hidden;
}
.ipgs.ipgs-ready .ipgs-book-transform {
display: block;
}
.ipgs.ipgs-fullscreen {
position: fixed !important;
top: 0 !important;
left: 0 !important;
bottom: 0 !important;
right: 0 !important;
margin: 0 !important;
padding: 0 !important;
width: auto !important;
height: auto !important;
max-width: none !important;
max-height: none !important;
outline: 0 !important;
border: none !important;
z-index: 999999 !important;
}
.ipgs.ipgs-fullscreen .ipgs-stage {
width: 100% !important;
height: 100% !important;
}
.ipgs .ipgs-message {
position: absolute;
top: 50%;
left: 50%;
max-width: 50%;
-webkit-transform: translate(-50%, 50%);
transform: translate(-50%, 50%);
padding: 5px 10px;
color: #fff;
background: #000;
font-size: 12px;
font-family: sans-serif;
}
.ipgs-page,
.ipgs-page .ipgs-image {
background-position: 50% 50%;
background-size: 100% 100%;
}
.ipgs-stage {
position: relative;
width: 100%;
height: 100%;
outline: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.ipgs-book-transform {
display: none;
position: absolute;
-webkit-transition: -webkit-transform 0.3s linear;
transition: -webkit-transform 0.3s linear;
transition: transform 0.3s linear;
transition: transform 0.3s linear, -webkit-transform 0.3s linear;
-webkit-transform-origin: 50% 50% 0;
transform-origin: 50% 50% 0;
will-change: transform;
}
.ipgs-book-transform.ipgs-no-transition {
-webkit-transition: none;
transition: none;
}
.ipgs-book-transform .ipgs-book-wrap {
position: relative;
}
.ipgs-book-transform .ipgs-book-wrap .ipgs-book-size {
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
.ipgs-book-transform .ipgs-book-wrap .ipgs-book-size .ipgs-book {
-webkit-transition: -webkit-transform 0.2s linear;
transition: -webkit-transform 0.2s linear;
transition: transform 0.2s linear;
transition: transform 0.2s linear, -webkit-transform 0.2s linear;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-perspective: 1500px;
perspective: 1500px;
}
.ipgs-book-transform .ipgs-book-wrap .ipgs-book-size .ipgs-book.ipgs-no-transition {
-webkit-transition: none;
transition: none;
}
.ipgs-stage-move {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
pointer-events: none;
}
.ipgs-stage-move.ipgs-active {
pointer-events: auto;
}
.ipgs-page {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
position: absolute;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.ipgs-page.ipgs-left {
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
}
.ipgs-page.ipgs-right {
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%;
}
.ipgs-page.ipgs-loading .ipgs-front .ipgs-layers {
opacity: 0;
pointer-events: none;
}
.ipgs-page.ipgs-loading .ipgs-extra .ipgs-preloader {
opacity: 1;
}
.ipgs-page .ipgs-image {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
pointer-events: none;
z-index: 1;
}
.ipgs-page .ipgs-front {
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
overflow: hidden;
z-index: 2;
}
.ipgs-page .ipgs-front .ipgs-annotations {
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
.ipgs-page .ipgs-front .ipgs-annotations .ipgs-annotation {
position: absolute;
cursor: pointer;
}
.ipgs-page .ipgs-front .ipgs-annotations .ipgs-annotation a {
-webkit-transition: all 0.2s;
transition: all 0.2s;
display: block;
height: 100%;
background-color: #2091eb;
opacity: 0;
}
.ipgs-page .ipgs-front .ipgs-annotations .ipgs-annotation a:hover {
opacity: 0.4;
}
.ipgs-page .ipgs-front .ipgs-layers {
position: absolute;
top: 0;
left: 0;
opacity: 1;
pointer-events: auto;
z-index: 2;
}
.ipgs-page .ipgs-front .ipgs-layers .ipgs-layer a {
-webkit-transition: all 0.2s;
transition: all 0.2s;
display: block;
height: 100%;
background-color: #2091eb;
opacity: 0;
}
.ipgs-page .ipgs-front .ipgs-layers .ipgs-layer a:hover {
opacity: 0.4;
}
.ipgs-page .ipgs-extra .ipgs-preloader,
.ipgs-page .ipgs-shadow,
.ipgs-theme-default.ipgs-ready .ipgs-book-loading,
.ipgs-theme-default.ipgs-ready .ipgs-book-loading-info {
pointer-events: none;
opacity: 0;
}
.ipgs-page .ipgs-extra {
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
pointer-events: none;
z-index: 3;
}
.ipgs-page .ipgs-extra .ipgs-number {
display: none;
}
.ipgs-page .ipgs-extra .ipgs-number.ipgs-show {
display: block;
}
.ipgs-page .ipgs-shadow {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: #000;
z-index: 4;
}
.ipgs-book-cover,
.ipgs-book-loading,
.ipgs-book-loading-info,
.ipgs-next-page,
.ipgs-outline,
.ipgs-prev-page,
.ipgs-share,
.ipgs-thumbnails,
.ipgs-toolbar {
display: none;
}
.ipgs-theme-default.ipgs-ready .ipgs-toolbar {
opacity: 1;
pointer-events: auto;
-webkit-transform: translate3D(-50%, 0, 0);
transform: translate3D(-50%, 0, 0);
}
.ipgs-theme-default ::-webkit-scrollbar {
width: 7px;
height: 7px;
}
.ipgs-theme-default ::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.6);
border: none;
}
.ipgs-theme-default ::-webkit-scrollbar-thumb:active,
.ipgs-theme-default ::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.9);
}
.ipgs-theme-default ::-webkit-scrollbar-track {
background: rgba(0, 0, 0, 0.2);
border: none;
}
.ipgs-theme-default ::-webkit-scrollbar-track:active,
.ipgs-theme-default ::-webkit-scrollbar-track:hover {
background: rgba(0, 0, 0, 0.3);
}
.ipgs-theme-default ::-webkit-scrollbar-corner {
background: 0 0;
}
.ipgs-theme-default .ipgs-stage {
background-color: #777;
-webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.5) inset;
box-shadow: 0 0 50px rgba(0, 0, 0, 0.5) inset;
}
.ipgs-theme-default .ipgs-page {
background-color: #fff;
}
.ipgs-theme-default .ipgs-page .ipgs-extra .ipgs-number {
position: absolute;
right: 5px;
bottom: 5px;
padding: 2px 7px;
color: #fff;
background: rgba(0, 0, 0, 0.3);
font-family: sans-serif;
font-size: 12px;
font-weight: 400;
border-radius: 0px;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.ipgs-theme-default .ipgs-page .ipgs-extra .ipgs-preloader {
-webkit-transition: opacity 0.5s;
transition: opacity 0.5s;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.ipgs-theme-default .ipgs-page .ipgs-extra .ipgs-preloader:before {
content: "";
display: block;
width: 32px;
height: 32px;
background-image: url(../fonts/cb5dff2316df4f15b3079a41e251b7ce.woff);
}
.ipgs-theme-default .ipgs-next-page {
right: 10px;
background-image: url(../fonts/afd3c73d1c694c219fadc892626dbad3.woff);
}
.ipgs-theme-default .ipgs-thumbnails {
-webkit-transition: all 0.7s;
transition: all 0.7s;
position: absolute;
display: block;
top: 0;
left: 0;
bottom: 0;
width: 250px;
-webkit-transform: translate3D(-100%, 0, 0);
transform: translate3D(-100%, 0, 0);
background: rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 50px rgba(0, 0, 0, 0.5);
text-align: center;
opacity: 0;
pointer-events: none;
z-index: 2;
}
.ipgs-theme-default .ipgs-thumbnails.ipgs-active {
-webkit-transform: translate3D(0, 0, 0);
transform: translate3D(0, 0, 0);
opacity: 1;
pointer-events: auto;
}
.ipgs-theme-default .ipgs-thumbnails .ipgs-thumbnails-toggle {
position: absolute;
top: 0;
right: -20px;
width: 20px;
height: 20px;
background-color: rgba(0, 0, 0, 0.5);
background-image: url(../fonts/95df4681184e489789bea0ef3343e668.woff);
background-size: contain;
cursor: pointer;
}
.ipgs-theme-default .ipgs-thumbnails .ipgs-thumbs-wrap {
width: 100%;
height: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow: auto;
}
.ipgs-theme-default .ipgs-thumbnails .ipgs-thumb {
-webkit-transition: all 0.5s;
transition: all 0.5s;
position: relative;
display: block;
margin: 10px auto 0;
background: 50% 50% #fff;
background-size: 100% 100%;
border: 1px solid rgba(0, 0, 0, 0.9);
-webkit-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
}
.ipgs-theme-default .ipgs-thumbnails .ipgs-thumb:last-child {
margin-bottom: 10px;
}
.ipgs-theme-default .ipgs-thumbnails .ipgs-thumb.ipgs-loading .ipgs-preloader:before {
opacity: 1;
}
.ipgs-theme-default .ipgs-thumbnails .ipgs-thumb .ipgs-preloader {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
pointer-events: none;
}
.ipgs-theme-default .ipgs-thumbnails .ipgs-thumb .ipgs-preloader:before {
-webkit-transition: opacity 0.5s;
transition: opacity 0.5s;
opacity: 0;
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 24px;
height: 24px;
margin: -12px 0 0 -12px;
background-image: url(../fonts/5c675e89cd6d42c596153beff413808e.woff);
background-size: contain;
cursor: pointer;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmarks-wrap {
width: 100%;
height: 100%;
padding: 10px 10px 10px 20px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow: auto;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark {
position: relative;
-webkit-transition: all 0.2s;
transition: all 0.2s;
color: rgba(255, 255, 255, 0.8);
font-family: sans-serif;
font-size: 14px;
line-height: 20px;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.7);
cursor: pointer;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark > .ipgs-state {
position: absolute;
-webkit-transition: all 0.2s;
transition: all 0.2s;
display: none;
top: 2px;
left: -3px;
width: 15px;
height: 15px;
-webkit-transform: translate3D(-100%, 0, 0);
transform: translate3D(-100%, 0, 0);
background-image: url(../fonts/91403a49b3444311bc22788d4b0c1533.woff);
background-size: contain;
background-repeat: no-repeat;
opacity: 0.7;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark > .ipgs-state:hover {
opacity: 1;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark > .ipgs-link {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark > .ipgs-link:hover {
color: #fff;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark .ipgs-bookmarks {
display: block;
padding-left: 20px;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark.ipgs-folded .ipgs-bookmarks {
display: none;
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark.ipgs-folded > .ipgs-state {
background-image: url(../fonts/9097a763e9c54470b38372aac492a711.woff);
}
.ipgs-theme-default .ipgs-outline .ipgs-bookmark.ipgs-has-childs > .ipgs-state {
display: block;
}
.ipgs-theme-default .ipgs-share,
.ipgs-theme-default .ipgs-toolbar {
-webkit-transition: all 0.7s;
display: -webkit-box;
display: -ms-flexbox;
opacity: 0;
pointer-events: none;
position: absolute;
}
.ipgs-theme-default .ipgs-toolbar {
transition: all 0.7s;
display: flex;
-webkit-transform: translate3D(-50%, 50px, 0);
transform: translate3D(-50%, 50px, 0);
left: 50%;
bottom: 10px;
background-color: #f7f7f7;
border: 1px solid #fff;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
border-radius: 0px;
z-index: 4;
}
.ipgs-theme-default .ipgs-share {
transition: all 0.7s;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.5);
font-family: sans-serif;
font-size: 12px;
z-index: 5;
}
.ipgs-theme-default .ipgs-share.ipgs-active {
opacity: 1;
pointer-events: auto;
}
.ipgs-theme-default .ipgs-share.ipgs-active .ipgs-share-dialog {
-webkit-transform: translate3D(0, 0, 0);
transform: translate3D(0, 0, 0);
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog {
-webkit-transition: all 0.7s;
transition: all 0.7s;
-webkit-transform: translate3D(0, 50px, 0);
transform: translate3D(0, 50px, 0);
padding: 5px 15px;
color: #262626;
background: #fff;
border-radius: 0px;
-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-header {
padding: 10px 0 0;
font-family: sans-serif;
font-size: 14px;
font-weight: 700;
text-align: center;
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding: 10px;
}
.ipgs-theme-default .ipgs-book-cover.ipgs-active,
.ipgs-theme-default .ipgs-book-loading-info.ipgs-active,
.ipgs-theme-default .ipgs-book-loading.ipgs-active {
display: block;
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-email,
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-facebook,
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-google,
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-linkedin,
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-twitter {
-webkit-transition: all 0.3s;
transition: all 0.3s;
display: block;
width: 20px;
height: 20px;
margin: 0 5px;
background-position: 50% 50%;
background-repeat: no-repeat;
opacity: 0.7;
cursor: pointer;
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-email:hover,
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-facebook:hover,
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-google:hover,
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-linkedin:hover,
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-twitter:hover {
opacity: 1;
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-facebook {
background-image: url(../fonts/cd163c879b0e436e9cf82dfe64b53872.woff);
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-twitter {
background-image: url(../fonts/7039004967ee4e56af39a03d95837e90.woff);
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-google {
background-image: url(../fonts/d0e5a0f68a9a4cd0a4c6873075c04789.woff);
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-linkedin {
background-image: url(../fonts/c12888bba49e49a2962a2be342e768fe.woff);
}
.ipgs-theme-default .ipgs-share .ipgs-share-dialog .ipgs-share-controls .ipgs-share-icon-email {
background-image: url(../fonts/2fe8966a6a434b54a51890ed53c3102e.woff);
}
.ipgs-theme-default .ipgs-book-cover {
-webkit-transition: all 0.5s;
transition: all 0.5s;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
max-width: 80%;
cursor: pointer;
z-index: 6;
}
.ipgs-theme-default .ipgs-book-cover img {
max-width: 100%;
}
.ipgs-theme-default .ipgs-book-cover:hover {
-webkit-transform: translate(-50%, -50%) scale(1.05);
transform: translate(-50%, -50%) scale(1.05);
}
.ipgs-theme-default .ipgs-book-loading {
-webkit-transition: opacity 0.5s;
transition: opacity 0.5s;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 7;
}
.ipgs-theme-default .ipgs-book-loading:before {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 32px;
height: 32px;
margin: -16px 0 0 -16px;
background-image: url(../fonts/94a6e6bc8b004df487ff3373932e7e9c.woff);
}
.ipgs-theme-default .ipgs-icon-prev {
background-image: url(../fonts/26cc521f31604e1986a1e65c828c8091.woff);
}
.ipgs-theme-default .ipgs-icon-next {
background-image: url(../fonts/acb1356acef34bc684f151663a7d631b.woff);
}
.ipgs-theme-default .ipgs-icon-gotolast {
background-image: url(../fonts/ee4387e3b42343bdb8ba7fdae6d8ceb3.woff);
}
.ipgs-theme-default .ipgs-icon-outline {
background-image: url(../fonts/ee38ffd7349b436489f45f0c58f72092.woff);
}
.ipgs-theme-default .ipgs-icon-thumbnails {
background-image: url(../fonts/31e55c47e96f4d5e8181d88b0d6a2221.woff);
}
.ipgs-theme-default .ipgs-icon-zoom-in {
background-image: url(../fonts/b88554a911794f9b819f6f249a12c9c8.woff);
}
.ipgs-theme-default .ipgs-icon-zoom-out {
background-image: url(../fonts/a00286336deb42a6b3c00f51828a0aec.woff);
}
.ipgs-theme-default .ipgs-icon-zoom-default {
background-image: url(../fonts/314e99190997414c90503c6e23aaf61a.woff);
}
.ipgs-theme-default .ipgs-icon-fullscreen {
background-image: url(../fonts/016d75a948ee4968b4d62755ae8b8df6.woff);
}
.ipgs-theme-default .ipgs-icon-share {
background-image: url(../fonts/b8aabe3de31c4ab88e2c75996a27520b.woff);
}
.ipgs-theme-default .ipgs-icon-download {
background-image: url(../fonts/533bbf56157246c7ba08ce8f3b005874.woff);
}
.ipgs-theme-default .ipgs-icon-sound {
background-image: url(../fonts/5d6d7b06c1ce4918a6c3d4afe07e3d28.woff);
}


.ipgs-page .ipgs-front {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
color: #fff;
text-shadow: 1px 1px 0 #000;
}
.ipgs-page.ipgs-first .ipgs-front {
background-image: url(../images/book-c101.jpg);
background-size: cover;
}
.ipgs-page.ipgs-first .ipgs-front a {
color: #fff;
text-shadow: 1px 1px 0 #000;
text-decoration: none;
}
.ipgs-page.ipgs-left .ipgs-front:before,
.ipgs-page.ipgs-right .ipgs-front:before {
content: "";
position: absolute;
width: 35px;
height: 100%;
pointer-event: none;
}
.ipgs-page.ipgs-left .ipgs-front:before {
right: 0;
background-image: linear-gradient(to left, rgba(0, 0, 0, 0.3), transparent);
}
.ipgs-page.ipgs-right .ipgs-front:before {
left: 0;
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.3), transparent);
}
.ipgs-page .ipgs-front > div {
padding: 20px;
font-family: georgia, serif;
font-size: 18px;
text-align: left;
}
.ipgs-page .ipgs-front > div.txt-center {
text-align: center;
}