/*
 * jQuery Booklet Plugin
 * Copyright (c) 2010 - 2014 William Grauvogel (http://builtbywill.com/)
 *
 * Licensed under the MIT license (http://www.opensource.org/licenses/mit-license.php)
 *
 * Version : 1.4.4
 *
 * Originally based on the work of:
 *	1) Charles Mangin (http://clickheredammit.com/pageflip/)
 */
.booklet {
	width: 960px;
	height: 679px;
	position: absolute;	
	overflow: visible !important;
	top:50%;
	left:50%;
	margin:-315px 0 0 -480px;
}

	.booklet .b-page {
		left: 0;
		top: 0;
		position: absolute;
		overflow: hidden;
		padding: 0;
		outline: 1px solid rgba(0,0,0,0);
		box-shadow:0 0 8px rgba(0,0,0,0.3);
	}

	.booklet .b-pN {
	}

	.booklet .b-p0 {
	}

	.booklet .b-p1 {
	}

	.booklet .b-p2 {
	}

	.booklet .b-p3 {
	}

	.booklet .b-p4 {
	}

	/* Page Wrappers */
	.booklet .b-wrap {
		top: 0;
		position: absolute;
	}

	.booklet .b-wrap-left {
		background: #fff;
	}

	.booklet .b-wrap-right {
		background: #fbfbfb;
	}

	.booklet .b-pN .b-wrap,
	.booklet .b-p1 .b-wrap,
	.booklet .b-p2 .b-wrap,
	.booklet .b-p3 .b-wrap,
	.booklet .b-p4 .b-wrap {
		left: 0;
	}

	.booklet .b-p0 .b-wrap {
		right: 0;
	}

	/* Custom Page Types */
	.booklet .b-page-blank {
		padding: 0;
		width: 100%;
		height: 100%;
	}

	.booklet .b-page-cover {
		padding: 0;
		width: 100%;
		height: 100%;
		background: #925C0E;
	}

		.booklet .b-page-cover h3 {
			color: #fff;
			text-shadow: 0 1px 3px #222;
		}

	/* Page Numbers */
	.booklet .b-counter {
		bottom: 5px;
		position: absolute;
		display: block;
		width: 20px;
		height: 20px;
		background: #FFF;
		color: #444;
		text-align: center;
		border-radius:50%;
		font-size:11px;
		line-height:20px;
	}

	.booklet .b-wrap-left .b-counter {
		left: 5px;
	}

	.booklet .b-wrap-right .b-counter {
		right: 5px;
	}

	/* Page Shadows */
	.booklet .b-shadow-f {
		right: 0;
		top: 0;
		position: absolute;
		opacity: 0;
		background-image: url("../../Images/maga2/shadow-top-forward.png");
		background-repeat: repeat-y;
		background-position: 100% 0;
	}

	.booklet .b-shadow-b {
		left: 0;
		top: 0;
		position: absolute;
		opacity: 0;
		background-image: url("../../Images/maga2/shadow-top-back.png");
		background-repeat: repeat-y;
		background-position: 0 0;
	}

	.booklet .b-p0 {
		background-image: url("../../Images/maga2/shadow.png");
		background-repeat: repeat-y;
		background-position: 100% 10px;
	}

	.booklet .b-p3 {
		background-image: url("../../Images/maga2/shadow.png");
		background-repeat: repeat-y;
		background-position: 0 10px;
	}

	/* Overlay Controls */
	.booklet .b-grab {
		cursor: url("../../Images/maga2/openhand.cur"), default;
	}

	.booklet .b-grabbing {
		cursor: url("../../Images/maga2/closedhand.cur"), default;
	}

	/* Overlay Controls */
	.booklet .b-overlay {
		top: 0;
		position: absolute;
		height: 100%;
		width: 50%;
	}

	.booklet .b-overlay-prev {
		left: 0;
	}

	.booklet .b-overlay-next {
		right: 0;
	}

	/* Tab Controls */
	.b-controls{
		width:100%;
		height:36px;
		position:fixed;
		height:40px;
		bottom:0;
		left:0;
		border-top:1px solid #646464;
		background: #232222; /* Old browsers */
		background: -moz-linear-gradient(top, #232222 0%, #010101 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#232222), color-stop(100%,#010101)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #232222 0%,#010101 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #232222 0%,#010101 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, #232222 0%,#010101 100%); /* IE10+ */
		background: linear-gradient(to bottom, #232222 0%,#010101 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#232222', endColorstr='#010101',GradientType=0 ); /* IE6-9 */		
		text-align:center;
	}
	.booklet .b-tab {
		padding:10px 0 6px 0;
		text-align: center;
		color: #ccc;
		letter-spacing:2px;
		width:80px;		
		display:inline-block;
		font-size:15px;
		background:#1d1d1d;
		border-radius:5px;
		margin:5px 10px 0 0;
		box-shadow:2px 2px 1px #000 inset;
		transition:all 0.1s ease-out;
	}

	.booklet .b-tab:hover {
		background: #494949;
		color:#ffffd2;
	}

	/* Arrow Controls */
	.booklet .b-arrow {
		display: block;
		position: absolute;
		text-indent: -9999px;
		top: 0;
		height: 100%;
		width: 74px;
	}

		.booklet .b-arrow div {
			display: none;
			text-indent: -9999px;
			height: 170px;
			width: 74px;
			position: absolute;
			left: 0;
			top: 25%;
		}

	.booklet .b-arrow-next {
		right: -80px;
	}

	.booklet .b-arrow-prev {
		left: -80px;
	}

	.booklet .b-arrow-next div {
		background: url("../../Images/maga2/arrow-next.png") no-repeat left top;
	}

	.booklet .b-arrow-prev div {
		background: url("../../Images/maga2/arrow-prev.png") no-repeat left top;
	}

/* @z-index fix (needed for older IE browsers)
----------------------------------------*/

body {
	z-index: 0;
}

#menu {
	z-index: 100;
}

.b-selector {
	z-index: 100;
}

.booklet {
	z-index: 10;
}

.b-pN {
	z-index: 10;
}

.b-p0 {
	z-index: 30;
}

.b-p1 {
	z-index: 20;
}

.b-p2 {
	z-index: 20;
}

.b-p3 {
	z-index: 30;
}

.b-p4 {
	z-index: 10;
}

.b-prev {
	z-index: 40;
}

.b-next {
	z-index: 40;
}

.b-counter {
	z-index: 40;
}

/* @Menu Items
----------------------------------------*/
#menu {
	position:fixed;
	top:0;
	width:100%;
	height:53px;
	border-bottom:1px solid #646464;
	background: #232222; /* Old browsers */
	background: -moz-linear-gradient(top, #232222 0%, #010101 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#232222), color-stop(100%,#010101)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #232222 0%,#010101 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #232222 0%,#010101 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #232222 0%,#010101 100%); /* IE10+ */
	background: linear-gradient(to bottom, #232222 0%,#010101 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#232222', endColorstr='#010101',GradientType=0 ); /* IE6-9 */		
	text-align:center;
}
#menu:before{
	content:attr(alt);
	display:block;	
	color:#ffffd2;
	line-height:64px;
	font-size:17px;
	padding:0 0 0 10px;
	letter-spacing:2px;
}
#menu:after{
	content:attr(title);
	display:block;	
	color:#FFF;
	line-height:55px;
	font-size:39px;
	padding:0 0 0 20px;
	font-weight:bolder;
	font-family:"simsun";
}
@media only screen and (max-width: 767px) {
#menu {
	position:relative;
	top:0;
	width:100%;
	height:53px;
	border-bottom:1px solid #646464;
	background: #FFF; 
	text-align:center;
}
#menu:before{
	color:#000;
	display:inline;
	line-height:60px;
	font-size:17px;
	padding:0 0 0 10px;
	letter-spacing:2px;
	right:10px;
	position:absolute;
}
#menu:after{
	color:#000;
	display:inline;
	line-height:60px;
	font-size:25px;
	padding:0;
	/*font-family:"simsun";*/
	font-family:"·L³n¥¿¶ÂÅé";
	position:absolute;
	left:10px;
}
}
.b-selector {
	position: absolute;
	right:0;
	top:0;
	border: none;
	color: #FFF;
	cursor: pointer;	
	background:#1d1d1d;
	border-radius:5px;
	margin:7px 10px 0 0;
	box-shadow:2px 2px 1px #000 inset;
	padding: 13px 20px 9px 20px;
	transition:all 0.1s ease-out;
}
.b-selector:hover{
	background: #494949;	
}

	.b-selector .b-current {
		display: block;
		text-align: center;
	}
	.b-selector .b-current:before{
		content:url(../../Images/maga2/list.png);
		padding:0 10px 0 0;
	}

.b-selector-page {
	
}

.b-selector-chapter {
	width: auto;
}

.b-selector:hover {
	color: #fff;
	background-position: left 0;
}

	.b-selector:hover .b-current {
		background-position: right 0;
	}

.b-selector ul {
	overflow: hidden;
	margin: 0;
	list-style: none !important;
	position: absolute;
	top: 50px;
	right: 0;
	background:#333333;
	width:65px;
	border-radius:10px;
	padding:0 15px;
	box-shadow:0 0 10px #000;
}

.b-selector li {
	border-bottom:1px dashed #FFF;		
}
.b-selector li:hover{
	
}
.b-selector a {
	color: #FFF;
	height: 14px;
	text-decoration: none;
	display: block;
	padding: 10px 10px;
	margin:5px 0;
	transition:all 0.1s ease-out;
}

	.b-selector a .b-text {
		float: left;
		clear: none;
	}

	.b-selector a .b-num {
		/*float: right;*/
		clear: none;
	}
	.b-selector a:hover{
		background:#494949;
		color:#ffffd2;
	}