.full-size {
width: 100%;
height: 100%;
}
.alert {
border: 1px solid transparent;
border-radius: 4px;
padding: 10px;
}
.alert-danger {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
}
.fb3d-default-page {
z-index: 1;
}
.fb3d-button {
display: inline-block;
font-size: 13px;
margin: 0;
cursor: pointer;
border-width: 1px;
border-style: solid;
border-radius: 3px;
white-space: nowrap;
box-sizing: border-box;
min-height: 32px;
line-height: 2.30769231;
padding: 0 12px;
color: #fff;
background: #007cba;
border-color: #007cba;
text-decoration: none;
text-shadow: none;
}
a.fb3d-button, a.fb3d-button:visited {
color: #fff;
}
.fb3d-button:focus,
.fb3d-button:hover {
background: #0071a1;
border-color: #0071a1;
color: #fff
}
.fb3d-button:focus {
box-shadow: 0 0 0 1px #fff, 0 0 0 3px #007cba
}
.fb3d-button:active {
background: #00669b;
border-color: #00669b;
box-shadow: none;
color: #fff
}
table.fb3d-categories td {
text-align: center;
}
table.fb3d-categories h3 {
text-align: left;
}
@media (max-width: 599px) {
table.fb3d-categories .fb3d-categories tr, .fb3d-categories td {
display: block;
}
}
._3d-flip-book a, .fb3d-link-lightbox-mode {
cursor: pointer;
}
.fb3d-thumbnail-lightbox-mode, .fb3d-thumbnail-mode {
position: relative;
display: inline-block;
line-height: 0;
}
._3d-flip-book .book-thumbnail {
display: inline-block;
transition: box-shadow .25s ease-in-out;
}
._3d-flip-book .book-thumbnail>a {
-webkit-transform-style: flat;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-perspective: 1200px;
-moz-perspective: 1200px;
perspective: 1200px;
display: inline-block;
}
._3d-flip-book:hover .book-thumbnail {
box-shadow: 0 0 7px rgba(0,0,0,0.5);
}
._3d-flip-book:active .book-thumbnail {
box-shadow: 0 0 5px rgba(0,0,0,0.5);
transition: box-shadow .15s ease-in-out;
}
._3d-flip-book .book-thumbnail img {
border-radius: 0;
-webkit-transform-origin: left;
transform-origin: left;
transition: transform .25s;
}
._3d-flip-book:hover .book-thumbnail img {
-webkit-transform: rotateY(-20deg) rotateZ(0deg);
-moz-transform: rotateY(-20deg) rotateZ(0deg);
-ms-transform: rotateY(-20deg) rotateZ(0deg);
transform: rotateY(-20deg) rotateZ(0deg);
}
._3d-flip-book:active .book-thumbnail img {
-webkit-transform: rotateY(-17deg) rotateZ(0deg);
-moz-transform: rotateY(-17deg) rotateZ(0deg);
-ms-transform: rotateY(-17deg) rotateZ(0deg);
transform: rotateY(-17deg) rotateZ(0deg);
transition: transform .15s;
}
.fb3d-thumbnail-lightbox-mode .book-heading, .fb3d-thumbnail-mode .book-heading {
position: absolute;
width: 100%;
height: 100%;
pointer-events: none;
overflow: hidden;
}
.fb3d-thumbnail-lightbox-mode .book-heading h3, .fb3d-thumbnail-mode .book-heading h3 {
box-sizing: border-box;
position: absolute;
width: 100%;
margin: 0;
padding: 5px;
font-weight: normal;
font-size: 14px;
line-height: 120%;
color: #fff;
text-decoration: none;
z-index: 1;
background: rgba(60, 60, 60, 0.8);
bottom: -100%;
transition: bottom .3s ease .2s;
}
.fb3d-thumbnail-lightbox-mode:hover .book-heading h3, .fb3d-thumbnail-mode:hover .book-heading h3 {
bottom: 5px;
transition-delay: 0s;
}
._3d-flip-book.fb3d-fix-title .book-heading h3 {
bottom: 5px;
}
.fb3d-thumbnail-lightbox-mode .book-heading h3 a {
color: #fff;
text-decoration: none;
}
._3d-flip-book.fb3d-fs-dark .fullscreen {
background-image: url(//www.kidsbangna.ru.ac.th/wp-content/plugins/interactive-3d-flipbook-powered-physics-engine/assets/images/texture.jpg);
}
._3d-flip-book.fb3d-fs-light .fullscreen {
background-image: url(//www.kidsbangna.ru.ac.th/wp-content/plugins/interactive-3d-flipbook-powered-physics-engine/assets/images/inverse-texture.jpg);
}
._3d-flip-book .fullscreen {
background-image: url(//www.kidsbangna.ru.ac.th/wp-content/plugins/interactive-3d-flipbook-powered-physics-engine/assets/images/texture.jpg);
}
.fb3d-h-100 {
height: 100px;
}
.fb3d-h-200 {
height: 200px;
}
.fb3d-h-300 {
height: 300px;
}
.fb3d-h-400 {
height: 400px;
}
.fb3d-h-500 {
height: 500px;
}
.fb3d-h-600 {
height: 600px;
}
.fb3d-h-700 {
height: 700px;
}
.fb3d-h-800 {
height: 800px;
}
.fb3d-h-900 {
height: 900px;
}
.fb3d-h-1000 {
height: 1000px;
} .fb3d-modal-shadow {
overflow: hidden;
}
.fb3d-modal {
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
background-color: rgba(0,0,0,.5);
z-index: 500001;
pointer-events: none;
visibility: hidden;
opacity: 0;
transition: opacity 0.5s, visibility 0.5s step-end;
}
.fb3d-modal.visible {
pointer-events: all;
visibility: visible;
opacity: 1;
transition: opacity 0.5s;
}
.fb3d-modal .mount-container {
position: absolute;
z-index: 1;
}
.fb3d-modal.dark .mount-container, .fb3d-modal.light .mount-container {
width: 95%;
height: 95%;
left: calc(5% / 2);
top: calc(5% / 2);
box-shadow: 0 0 5px rgba(255,255,255,.5);
}
.fb3d-modal.dark-shadow .mount-container, .fb3d-modal.light-shadow .mount-container {
width: 100%;
height: 100%;
left: 0;
top: 0;
}
.fb3d-modal.dark .mount-container, .fb3d-modal.dark-shadow .mount-container {
background-color: rgba(0,0,0,.5);
}
.fb3d-modal.light .mount-container, .fb3d-modal.light-shadow .mount-container {
background-color: rgba(255,255,255,.5);
}
.light .mount-container.fullscreen, .light-shadow .mount-container.fullscreen {
background-image: url(//www.kidsbangna.ru.ac.th/wp-content/plugins/interactive-3d-flipbook-powered-physics-engine/assets/images/inverse-texture.jpg);
}
.dark .mount-container.fullscreen, .dark-shadow .mount-container.fullscreen {
background-image: url(//www.kidsbangna.ru.ac.th/wp-content/plugins/interactive-3d-flipbook-powered-physics-engine/assets/images/texture.jpg);
}
.fb3d-modal .cmd-close {
font-size: 24px;
color: #ccc;
position: absolute;
right: 10px;
top: 8px;
z-index: 2;
cursor: pointer;
transition: color .15s ease-in;
}
.fb3d-modal.dark .cmd-close, .fb3d-modal.light .cmd-close {
right: calc(5% / 2 + 10px);
top: calc(5% / 2 + 8px);
}
.fb3d-modal.light .cmd-close, .fb3d-modal.light-shadow .cmd-close {
color: #555;
}
.fb3d-modal .cmd-close:hover {
color: #eee;
transition: color .15s ease-out;
}
.fb3d-modal.light .cmd-close:hover, .fb3d-modal.light-shadow .cmd-close:hover {
color: #111;
}
.fb3d-modal .cmd-close:active {
font-size: 22px;
padding-top: 1px;
padding-right: 1px;
}