/* CSS Document */
 #bdy { width:960px;
		height:530px;
		margin:20px auto 0 20px;
		position: absolute;
	}

#book{  width:900px; height:500px; margin:10px auto 10px auto; padding:0;  float:left; }

#book .cover { 	width:100%; height:500px; margin:0;  
				    background-color:#fff; }
.page_number{ bottom: 7px; color: #000; display: block; font-size: 15px; line-height: 20px;
			position: absolute;  text-align: center; width: 98%; margin-left:2px; font-weight: 500;  
			}
#controls{ width:800px; text-align:center;	margin:20px 0px 20px 150px;	font:30px arial; }

/* #book .odd{ 
			
			background-image:-webkit-linear-gradient(left, #FFF 95%, #ddd 100%);
			background-image:-moz-linear-gradient(left, #FFF 95%, #ddd 100%);
			background-image:-o-linear-gradient(left, #FFF 95%, #ddd 100%);
			background-image:-ms-linear-gradient(left, #FFF 95%, #ddd 100%); }
#book .even{
			background-image:-webkit-linear-gradient(right, #FFF 95%, #ddd 100%);
			background-image:-moz-linear-gradient(right, #FFF 95%, #ddd 100%);
			background-image:-o-linear-gradient(right, #FFF 95%, #ddd 100%);
			background-image:-ms-linear-gradient(right, #FFF 95%, #ddd 100%);  } */
	
/*---------------------PAGE CONTAIN----------------------------  */

.img_page { width:450px; height:500px; float:left; 
 			backbackground-image:-moz-linear-gradient(left, #FFF 95%, #ddd 100%);
			background-image:-o-linear-gradient(left, #FFF 95%, #ddd 100%);
			background-image:-ms-linear-gradient(left, #FFF 95%, #ddd 100%);	
			background-image:-webkit-linear-gradient(left, #FFF 95%, #ddd 100%);
			background-image: url('../images/l-01.png'); background-color: #fff;
		  }

.img_page .img {  height:380px; width:380px;  padding:0; margin:0em; border:solid 1px #000; box-shadow:0 0 0.2em rgba(0,0,0,0.6); position:relative; }

.notifi {
	position:absolute;
	background-color:rgba(255,255,255,0.7); 
	border-radius:10px; 
	height:40px; 
	width:300px; 
	top:15em;
	left:40px;
	z-index:100; 
	display:none;
	border:solid 1px red; 
	padding:0.5em; 
	box-shadow: 0 0 0.2em rgba(0,0,0,0.4);
}
.notifi img{
	float:left; 
	margin:0.4em; 
	z-index:1;
}
.notifi p{
	margin-top:5px; 
	text-align:center; 
	color:red; 
	font-family:verdana; 
	z-index:1; 
	font-size:20px; 
	float:left; 
	display:none;
}
.notifi p .subP{
	margin-top:5px; 
	text-align:center; 
	color:red; 
	font-family:verdana; 
	z-index:1; 
	font-size:20px; 
	float:left; 
}
.txt_page { width:450px; height:500px; float:left; 
			background-image:-moz-linear-gradient(right, #FFF 95%, #ddd 100%);
			background-image:-o-linear-gradient(right, #FFF 95%, #ddd 100%);
			background-image:-ms-linear-gradient(right, #FFF 95%, #ddd 100%);	
			background-image:-webkit-linear-gradient(right, #FFF 95%, #ddd 100%);
			background-image: url('../images/r-01.png'); background-color: #fff;
			
		}
			
.txt_page  .txt	{  border:1px solid; height:435px; width:auto; padding:10px 5px 0px 5px; margin:0em; background-color:#fff;}
/* .txt_page .txt p :first-child { margin:0; } */
.txt_page .txt p :second-child { margin:1; }
.txt_page .txt p { margin:0 0 0.5em 0; }
.txt_page.tt1 .txt p {margin-top:8em; text-align:center;}
.txt_page.tt1 .txt p span { font-size:28px;} 
.txt_page .txt p span { font-size:18px; line-height:1.57em; } 
.controls {  width:380px; height:55px; margin:0.5em 0 0.5em 0em; background-color:rgba(255,255,255,0.5); border:none; padding-top:2px; }

.controls .mlflow {
    margin-left: 40px;
}
.controls .btn_play
{
        float: left;
        width:42px;
        height:55px;
        
        opacity: 1;
        transition-duration:0.3s;
        position:relative;
}	
.controls .btn_play:hover
{		
        cursor: pointer;
        opacity: 1;
}		
.controls .btn_play img:hover {
    transform: scale(1.15);
    transition-duration:0.2s;
}
.controls .btn_play .btn_pl {
    position:absolute;
    top:0px;
    left:0px;
    height:42px;
	opacity:0.6;
    width:55px;
    z-index: 204;
}
.controls .btn_play .btn_ps {
    position:absolute;
    top:0px;
    left:0px;
    height:42px;
    opacity:0.6;
	width:55px;
    z-index: 203;
    display: none;
}
.controls .btn_play .btn_rpl {
    position:absolute;
    top:0px;
    left:0px;
    height:42px;
	opacity:0.6;
    width:55px;
    z-index: 202;
    display: none;
}
.controls .btn_stop1{
        width:42px;
        float: left;
        height:55px;
        margin:0px 10px;
        background-image: url(../images/stop.png);
        opacity: 1;
        background-repeat: no-repeat;
}
.controls .btn_stop2{
        width:42px;
        float: left;
        height:55px;
        margin:0px 10px;
        background-repeat: no-repeat;
}
.controls .btn_stop1:hover
{
        cursor: pointer;
        opacity: 1;	
}		
.controls .btn_stop1:hover {
    transform: scale(1.15);
    transition-duration:0.2s;
}
.controls .btn_stop2:hover{
        cursor: pointer;
        opacity: 1;	
}		
.controls .btn_stop2:hover {
    transform: scale(1.15);
    transition-duration:0.2s;
}
.controls .btn_vol
{
        width:42px;
        float: left;
        height:55px;
        opacity: 1;
}		
.controls .btn_vol img:hover {
    transform: scale(1.15);
    transition-duration:0.2s;
}
.controls .btn_vol:hover{
		cursor: pointer;
		opacity: 1;	
}
.controls .btn_recs {
                width:42px;
                height:55px;
                position:relative;
                float:left;
                margin:0px 10px;
                cursor:pointer;
}		
.controls .btn_recs img:hover {
    transform: scale(1.15);
    transition-duration:0.2s;
}
.controls .btn_recs:first-child {
    margin-left:0;
}
/*.controls .btn_recs div {
	opacity:0.5;
}
.controls .btn_play div {
	opacity:0.5;
}
.controls .btn_stop {
	opacity:0.5;
}*/
.controls .btn_record_stop{
                position:absolute;
		width:42px;
		height:55px;
		opacity: 1;
                display:none;
}
.controls .btn_record_stop:hover {
    opacity:1;
    
}
.controls .btn_record_play{
                position:absolute;
		width:42px;
		height:55px;
		opacity: 1;
}
.controls .btn_record_play:hover {
    opacity:1;
}

/*-------------Side Panel---page_No Details-----*/
#bdy .sdPnl {
	float: left;
    height: 180px;
    margin: 200px 0 0;
    width: 40px;
}
#bdy .sdPnl ul {
	}
#bdy .sdPnl li {
	list-style:none;
}

#bdy .sdPnl li .sdbxup {
	width:30px;
	height:30px;
	margin:4px 0 4px 0;
        padding:5px 0 0 0;
	border:solid 1px #fff;
	border-left:none;
	border-radius:0 8px 8px 0;
	background: #a5a5a5; /* Old browsers */
background: -moz-linear-gradient(left,  #a5a5a5 0%, #dbdce2 27%, #b8bac6 65%, #f5f6f6 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#a5a5a5), color-stop(27%,#dbdce2), color-stop(65%,#b8bac6), color-stop(100%,#f5f6f6)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  #a5a5a5 0%,#dbdce2 27%,#b8bac6 65%,#f5f6f6 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  #a5a5a5 0%,#dbdce2 27%,#b8bac6 65%,#f5f6f6 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  #a5a5a5 0%,#dbdce2 27%,#b8bac6 65%,#f5f6f6 100%); /* IE10+ */
background: linear-gradient(left,  #a5a5a5 0%,#dbdce2 27%,#b8bac6 65%,#f5f6f6 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a5a5a5', endColorstr='#f5f6f6',GradientType=1 ); /* IE6-9 */
	-moz-box-shadow: 0 0 5px #fff;
	-webkit-box-shadow: 0 0 5px #fff;
	box-shadow: 0 0 5px #fff;
	-moz-transition-duration:1s;
	-webkit-transition-duration:1s;
}

#bdy .sdPnl li .sdbxup:hover {
	width:40px;
	height:30px;
	margin:4px 0 4px 0;
	transition-duration:0.3s;
	-moz-transition-duration:0.3s;
	-webkit-transition-duration:0.3s;
	cursor:pointer;
	}
#bdy .sdPnl li .sdbxup span p {
	font-family:"arial unicode MS";
	font-size:25px;
	color:#000000;
	padding:0px 0 0 0;
	font-weight:bold;
	text-align:center;
}

#bdy .sdPnl li .sdbxdw {
	width:30px;
	height:30px;
	margin:4px 0 4px 0;
        padding:5px 0 0 0;
	border:solid 1px #fff;
	border-left:none;
	border-radius:0 8px 8px 0;
	background: #a5a5a5; /* Old browsers */
background: -moz-linear-gradient(left,  #a5a5a5 0%, #dbdce2 27%, #b8bac6 65%, #f5f6f6 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#a5a5a5), color-stop(27%,#dbdce2), color-stop(65%,#b8bac6), color-stop(100%,#f5f6f6)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  #a5a5a5 0%,#dbdce2 27%,#b8bac6 65%,#f5f6f6 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  #a5a5a5 0%,#dbdce2 27%,#b8bac6 65%,#f5f6f6 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  #a5a5a5 0%,#dbdce2 27%,#b8bac6 65%,#f5f6f6 100%); /* IE10+ */
background: linear-gradient(left,  #a5a5a5 0%,#dbdce2 27%,#b8bac6 65%,#f5f6f6 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a5a5a5', endColorstr='#f5f6f6',GradientType=1 ); /* IE6-9 */
	-moz-box-shadow: 0 0 5px #fff;
	-webkit-box-shadow: 0 0 5px #fff;
	box-shadow: 0 0 5px #fff;
	-moz-transition-duration:1s;
	-webkit-transition-duration:1s;
}

#bdy .sdPnl li .sdbxdw:hover {
	width:40px;
	height:30px;
	margin:4px 0 4px 0;
	transition-duration:0.3s;
	-moz-transition-duration:0.3s;
	-webkit-transition-duration:0.3s;
	cursor:pointer;
	}
#bdy .sdPnl li .sdbxdw span p {
	font-family:"arial unicode MS";
	font-size:25px;
	color:#000000;
	padding:0px 0 0 0;
	font-weight:bold;
	text-align:center;
}


#bdy .sdPnl li .sdbxii {
	width:30px;
	height:40px;
	margin:4px 0 4px 0;
	border:solid 1px #fff;
	border-left:none;
	border-radius:0 8px 8px 0;
	background: #feccb1; /* Old browsers */
background: -moz-linear-gradient(left,  #feccb1 0%, #f17432 26%, #ea5507 77%, #fb955e 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#feccb1), color-stop(26%,#f17432), color-stop(77%,#ea5507), color-stop(100%,#fb955e)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  #feccb1 0%,#f17432 26%,#ea5507 77%,#fb955e 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  #feccb1 0%,#f17432 26%,#ea5507 77%,#fb955e 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  #feccb1 0%,#f17432 26%,#ea5507 77%,#fb955e 100%); /* IE10+ */
background: linear-gradient(left,  #feccb1 0%,#f17432 26%,#ea5507 77%,#fb955e 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feccb1', endColorstr='#fb955e',GradientType=1 ); /* IE6-9 */

	-moz-box-shadow: 0 0 5px #fff;
	-webkit-box-shadow: 0 0 5px #fff;
	box-shadow: 0 0 5px #fff;
	-moz-transition-duration:1s;
	-webkit-transition-duration:1s;
	}

#bdy .sdPnl li .sdbxii:hover {
	width:40px;
	height:40px;
	margin:4px 0 4px 0;
	transition-duration:0.3s;
	-moz-transition-duration:0.3s;
	-webkit-transition-duration:0.3s;
	cursor:pointer;
	}
	
/*-------------jay CSS--------------*/
.mdiv
{
	border: solid 2px #fff; 
	border-radius:20px; 
	height:600px; 
	background-color: #7D0552; 
	width:1200px; 
	margin: 30px auto; 
	position:relative;
	box-shadow:0 0 0.5em rgba(0,0,0,0.6);
}
.mdiv .left
{
	margin: 25px;
	float:left;
}
.mdiv .right
{
	margin: 25px;
	float:right;
}
.mdiv #f
{
	height:150px; 
	background-color:#ffffff;
	cursor:pointer;
}
#img_load
{
	display:none;
	position:absolute;
	margin:3.4em; 
	z-index:1000;
}
.loaderbx {
    position:absolute;
    top:0; 
    left:0; 
    height:100%; 
    width:100%; 
    background-color:rgba(255,255,255,0.6); 
    z-index:106;
}
.loadinBx {
    position: absolute; 
    width:25%; 
    height:5em; 
    background-color:#fff; 
    left:37.5%;
    top:15em;
    border:solid 1px #000;
    border-radius:0.6em;
    box-shadow:0 0 0.5em rgba(0,0,0,0.5);
    background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #eaeaea 50%, #fefefe 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#eaeaea), color-stop(100%,#fefefe)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 0%,#eaeaea 50%,#fefefe 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 0%,#eaeaea 50%,#fefefe 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 0%,#eaeaea 50%,#fefefe 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 0%,#eaeaea 50%,#fefefe 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fefefe',GradientType=0 ); /* IE6-9 */
    font-family:"Times New Roman", Times, serif; 
}
.loadinBx .loadImg {
    height:32px; 
    text-align: center; 
    width:8%; 
    float:left; 
    margin:1.5em 1em; 
}
.loadinBx .loadImg img {
    text-align: center;
}
.loadinBx .loatTxt {
    height:4em;
    width: 75%;
    margin:0.5em 0.5%;
    float:left;
}
.loadinBx .loatTxt p {
    text-align: center;
    line-height: 2.8em;
    font-size:1.5em;
}

/*----------------------------------*/

/*-----------Jay CSS------------*/

.noti{
	background-color:rgba(255,255,255,0.7); 
	border-radius:10px; 
	height:40px; 
	width:300px; 
	position:absolute; 
	margin-top:320px; 
	margin-left:245px; 
	z-index:100; 
	display:none;
	padding:0.5em; 
	box-shadow: 0 0 0.2em rgba(0,0,0,0.4);
}
.noti img{
	float:left; 
	margin:0.4em; 
	z-index:1;
}
.noti#notif_2 {
	margin-top:380px;
	margin-left:245px;
} 
.noti p{
	margin-top:5px; 
	text-align:center; 
	color:red; 
	font-family:verdana; 
	z-index:1; 
	font-size:20px; 
	float:left; 
	display:none;
}
.noti p .subP{
	margin-top:5px; 
	text-align:center; 
	color:red; 
	font-family:verdana; 
	z-index:1; 
	font-size:20px; 
	float:left; 
}
.disable_cont
{
	z-index: 500;
	width: 166px;
	height: 56px;
	margin-left: 215px;
	margin-top: 416px;
	position: absolute;
	display:none;
}
.mt_cont{
	z-index: 501; 
	width: 102px;
	height: 56px;
	margin-left: 91px;
	margin-top: 412px;
	position: absolute;
	cursor:url(../images/restrict.png), auto;
}
.disable_rec{
	z-index: 502;
	width: 95px;
	height: 56px;
	margin-left: 268px;
	margin-top: 412px;
	position: absolute;
	cursor:url(../images/restrict.png), auto;
}
.disable_play{
	z-index: 502;
	width: 42px;
	height: 56px;
	margin-left: 223px;
	margin-top: 416px;
	position: absolute;
	display:none;
	cursor:url(../images/restrict.png), auto;
}
.devide
{
	float:left; 
	margin-left:1em; 
	padding-right:1em; 
	border-right:solid 1px #ccc;
}
/*---------------------------------*/

/*--------Book Manual style----------*/
body {
	margin:0;
	font-size:14px;
	background-color:#fff;
}
h1, h2, h3, h4, p, ul, ol, li {
	margin:0;
	padding:0;
}
.wrapper {
	position:relative;
	width:60em;
	height:auto;
	margin:0 auto;
}
.wrapper h1 {
	text-align:center;
	font-size:2.0em;
	line-height:3.5em;
}
.wrapper .grdBx {
	width:100%;
	height:8em;
	border-bottom:dotted 1px #999;
	margin:0.2em 0;
}
.wrapper .grdBxsm {
	height:5em;
}
.wrapper .grdBx .left {
	float:left;
	margin:0 0.2em;
	width:8em;
	height:8em;
}
.wrapper .grdBx .left img {
	position:relative;
	width:7.0625em;
	height:7.9375em;
	margin:0 0.5em;
}
.wrapper .grdBx .sm {
	height:5em;
}
.wrapper .grdBx .sm img {
	position:relative;
	width:3.5625em;
	height:4.5em;
	margin:0.2em 3em;
	width:auto;
}
.wrapper .grdBx .right {
	float:right;
	margin:0 0.2em;
	width:49.5em;
	height:9em;
}
.wrapper .grdBxsm .right {
	height:5em;
}
.wrapper .grdBx .right p {
	font-size:1.5em;
	line-height:2em;
	text-align:left;
}
#j1{
	position:absolute; 
	top:10px; 
	left:55px; 
	width:337px; 
	height:90px;
}
.proc{
	border: solid 2px green; 
        border-radius: 10px;
	height:70px; 
	width: 365px; 
	cursor: pointer;
        background-color: #fff;
        opacity:0.6;
	top:400px;
	left:90px;
	z-index:1;
	position:absolute;
	
}
.proc:hover{
	border: solid 2px green; 
	height:70px; 
	width: 365px; 
	cursor: pointer;
	background-color: #fff;
	opacity:1.0;
	top:400px;
	left:90px;
	z-index:1;
	position:absolute;
}
.proc p{
	text-align:center; 
	margin-top: 10px; 
    opacity:1.0;
	color: #E05033; 
	font-size: 24px;
}
.proc p:hover{
	text-align:center; 
	margin-top: 10px; 
	opacity:1.0;
	font-weight: lighter;
	color: #E05033; 
	
	font-size: 24px;
}

/*-----------------------------------*/