/*
@import url('https://fonts.googleapis.com/css?family=Saira+Condensed:300,400,500,700,900|Saira+Extra+Condensed:300,400,500,700,900|Zilla+Slab:300,300i,400,400i,500,500i,600,600i,700,700i&subset=latin-ext');
*/
@import url('https://fonts.googleapis.com/css?family=Rasa:300,400,500,600,700|Zilla+Slab:300,300i,400,400i,500,500i,600,600i,700,700i&subset=latin-ext');

@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css);
body, ul, table, form{margin:0;padding:0;font-family: 'Zilla Slab', serif;font-weight:500;}
a,a:hover {text-decoration:none;color:#333;}
a:hover {color:blue;}
.gbg {background:#ddd !important;}
#nav {position:absolute;top:-35px;right:0;padding:6px;background:#eee;border-radius:6px;font-size:12px;opacity:.6;}
#nav:hover {opacity:1;}
#nav a {display:inline-block;margin:0 6px;}

@media (min-width: 1367px) {
	
	#canvas{width: 100%;height: 100%;margin: 10px auto 30px auto;}
	.ok-book{width:1200px;height:750px;margin:0 auto;}
	.ok-book .hard{width:600px;height:750px;}
	.ok-book .own-size{width:580px;height:732px;}
	.ok-book .p1 .side {height:750px;left:595px;}
	.ok-book .depth {height:744px;top:4px;width:16px;}
	.ok-book .book-content{width: 500px;height:632px;display:table;font-size:18px;line-height: 24px;}
	.ok-book .table-contents {font-size:17px;margin:50px auto;}
	.ok-book .table-contents li {line-height:28px;}
	
}
@media (max-width: 1366px) {
	
	#canvas{width: 100%;height: 100%;margin:0 auto;}
	.ok-book{width:960px;height:600px;margin:0 auto;}
	.ok-book .hard{width:480px;height:600px;}
	.ok-book .own-size{width:460px;height:582px;}
	.ok-book .p1 .side {height:650px;left:475px;}
	.ok-book .depth {height:590px;top:7px;width:16px;}
	.ok-book .book-content{width: 380px;height:482px;display:table;font-size:13px;line-height: 18px;}
	.ok-book .table-contents {font-size:13px;margin:36px auto;}
	.ok-book .table-contents li {line-height:22px;}
}

#canvas{position:relative;}
#book-zoom{-webkit-transition: -webkit-transform 1s;-moz-transition: -moz-transform 1s;-ms-transition: -ms-transform 1s;-o-transition: -o-transform 1s;transition: transform 1s;}
h1,h2,h3,h4,h5 {position:relative;font-weight: 400;color:#666;margin-bottom:15px;}
h3 {font-size: 1.65rem;}
h1:after,h2:after,h3:after,h4:after,h5:after {content:" ";width:100%;position:absolute;bottom:-5px;left:0;border-bottom:1px dotted #ddd;}
h1{font-size: 26px;margin: 20px 8px;color: #333;}
h2{font-size:22px;}
.ok-book .book-content{margin:40px 40px;}
.ok-book .book-content audio {position: absolute;bottom: 40px;width: 88%;left: 6%;}
blockquote{color:#586078;margin:10px 0;font-style:italic;}
blockquote:before{content: "\201C";color:#333D53;font-size:20px;}
blockquote:after{content: "\201D";color:#333D53;font-size:20px;}
cite{font-size:13px;font-weight:200;font-style:normal;color:#666;}
.ok-book .book-content .center-pic{margin:0;text-indent:0;text-align:center;display: table-cell; vertical-align: middle;}
.ok-book .zoom-this:hover{opacity:0.9;cursor:pointer;}
.ok-book .book-content p{margin: 0 0 10px 0;word-break: break-word;}
.ok-book .left-pic{float:left;margin-top:15px;margin-right:15px;margin-bottom:15px;}
.animated{-webkit-transition:margin-left 0.2s ease-in-out;-moz-transition:margin-left 0.2s ease-in-out;-o-transition:margin-left 0.2s ease-in-out;-ms-transition:margin-left 0.2s ease-in-out;transition:margin-left 0.2s ease-in-out;}
.ok-book .shadow{-webkit-transition: -webkit-box-shadow 0.5s;-moz-transition: -moz-box-shadow 0.5s;-o-transition: -webkit-box-shadow 0.5s;-ms-transition: -ms-box-shadow 0.5s;-webkit-box-shadow:0 0 10px #999;-moz-box-shadow:0 0 10px #999;-ms-box-shadow:0 0 10px #999;-o-box-shadow:0 0 10px #999;box-shadow:0 0 10px #999;}
.ok-book .page{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);-moz-box-shadow:0 0 20px rgba(0,0,0,0.2);-ms-box-shadow:0 0 20px rgba(0,0,0,0.2);-o-box-shadow:0 0 20px rgba(0,0,0,0.2);box-shadow:0 0 20px rgba(0,0,0,0.2);}
.zoom-pic{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.2);z-index:999;}
.zoom-pic img{-webkit-box-shadow:0 0 20px #999;-moz-box-shadow:0 0 20px #999;-o-box-shadow:0 0 20px #999;-ms-box-shadow:0 0 20px #999;box-shadow:0 0 20px #999;}
.ok-book .p1 .side{width:5px;position:absolute;top:0;background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #bbb), color-stop(0.5,  #ddd), color-stop(1,  #bbb));background-image:-webkit-linear-gradient(left, #bbb, #ddd, #bbb);background-image:-moz-linear-gradient(left, #bbb, #ddd, #bbb);background-image:-ms-linear-gradient(left, #bbb, #ddd, #bbb);background-image:-o-linear-gradient(left, #bbb, #ddd, #bbb);background-image:linear-gradient(left, #bbb, #ddd, #bbb);-webkit-transform:rotateY(-90deg);-moz-transform:rotateY(-90deg);-o-transform:rotateY(-90deg);-ms-transform:rotateY(-90deg);transform:rotateY(-90deg);-webkit-transform-origin:top right;-moz-transform-origin:top right;-o-transform-origin:top right;-ms-transform-origin:top right;transform-origin:top right;z-index:100000;}
.ok-book-transform div[page="1"] > div, .ok-book-transform div[page="2"] > div{overflow:visible !important;}
.ok-book .depth{background-image:url(../pics/pages-depth.png); background-size:auto 100%; position:absolute;}
.ok-book .front-side .depth{left:4px;background-position:0 0;}
.ok-book .back-side .depth{right:4px;background-position:right 0;}
.ok-book .hard{background-color:white;-webkit-box-shadow:none;-moz-box-shadow:none;-ms-box-shadow:none;box-shadow:none;}
.ok-book .page-wrapper{-webkit-perspective:2000px;-moz-perspective: 2000px;-ms-perspective: 2000px;perspective: 2000px;}
.ok-book .own-size{background-color:white;overflow:hidden;}
.ok-book .even{background:-webkit-gradient(linear, left top, right top, color-stop(0.95, #fff), color-stop(1, #dadada));background-image:-webkit-linear-gradient(left, #fff 95%, #dadada 100%);background-image:-moz-linear-gradient(left, #fff 95%, #dadada 100%);background-image:-ms-linear-gradient(left, #fff 95%, #dadada 100%);background-image:-o-linear-gradient(left, #fff 95%, #dadada 100%);background-image:linear-gradient(left, #fff 95%, #dadada 100%);}
.ok-book .odd{background:-webkit-gradient(linear, right top, left top, color-stop(0.95, #fff), color-stop(1, #cacaca));background-image:-webkit-linear-gradient(right, #fff 95%, #cacaca 100%);background-image:-moz-linear-gradient(right, #fff 95%, #cacaca 100%);background-image:-ms-linear-gradient(right, #fff 95%, #cacaca 100%);background-image:-o-linear-gradient(right, #fff 95%, #cacaca 100%);background-image:linear-gradient(right, #fff 95%, #cacaca 100%);}
.ok-book .loader{background-image:url(../pics/loader.gif);width:22px;height:22px;position:absolute;top:280px;left:219px;}
.ok-book .page-number{color:#999;width:110px;margin-left:-55px;left:50%;bottom:0px;position:absolute;display:block;border:1px solid #eee;border-bottom:0;border-radius:6px 6px 0 0;text-align: center;line-height:28px;font-size:10px;}
.ok-book .page-number a {color:#999;}
.ok-book .table-contents{width:400px;color:#ccc;}
.ok-book .table-contents ul {width: 42%;float:left;margin:0 6% 2px 2%;}
.ok-book .table-contents li{list-style:none;}
.ok-book .table-contents span{float:right;}
.ok-book .table-contents a{display:block;text-decoration:none;color:#333;border-bottom:1px dashed #ddd;}
.ok-book .table-contents a:hover{color:#FF6203;text-decoration:none;}
.capital,.ok-book .book-content .no-indent{text-indent: 0;}
.capital:first-letter {display:block;float:left;font-size: 300%;line-height: 70%;margin-right: 6px;margin-top: 7px;margin-left:18px;}
.ie8 .ok-book .even,.ie9 .ok-book .even{background-image:url(../pics/gradient-page-left.jpg);background-position:right top;background-repeat:repeat-y;}
.ie8 .ok-book .odd,.ie9 .ok-book .odd{background-image:url(../pics/gradient-page-right.jpg);background-position:left top;background-repeat:repeat-y;}


.owl-item .table-contents li {/*font-family: Saira Extra Condensed !important;*/width:100%;float:none;}
.owl-item .table-contents {width:auto;padding:0 30px;}
.owl-item .book-content {display:block;width:auto;height:auto;    margin: 0 !important;padding: 30px;    font-size: 17px; line-height: 24px;}
.owl-carousel .owl-item img {margin:0 auto;}
.owl-carousel .owl-item .fbox {display:table;width:100%;height:100%;text-align:center;}