*
{
	padding: 0;
	margin: 0;
}

#everything
{
	width: 954px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
}

#flip	/* defines the clickable area for page flipping */
{
	position: absolute;
	margin-top: 100px;
	margin-left: 77px;
	margin-right: 77px;
	width: 800px;
	/*height: 600px;	Calculated */
	z-index: 100;
	cursor: pointer;	
}

#book	/* defines the initial display area for the current page */
{
	position: absolute;
	padding: 100px 56px 421px 477px;
	width: 421px;
	/*height: 350px;	Calculated */
	overflow: hidden;
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*                                                                               */
/* Default properties of page elements.                                          */
/*                                                                               */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

section
{
    display: none;  /* by default the page images are not displayed */
	position: absolute;
	-webkit-transition-property: -webkit-transform, -webkit-transform-origin;
	-moz-transition-property: -moz-transform, -moz-transform-origin;
	-ms-transition-property: -ms-transform, -ms-transform-origin;	
	-o-transition-property: -o-transform, -o-transform-origin;
	 
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-ms-transition-duration:1s;
	-o-transition-duration:1s;
	
	-webkit-transition-delay: 0s;
	-moz-transition-delay: 0s;
	-ms-transition-delay:0s;
	-o-transition-delay:0s;
	
	-webkit-transition-timing-function: ease;
	-moz-transition-timing-function: ease;
	-ms-transition-timing-function: ease;
	-o-transition-timing-function: ease;
	
/*	background-image: url(blue.jpg);	*/
/*	opacity: 1.0;						*/
}

section > div
{
	position: absolute;
	-webkit-transition-property: -webkit-transform, -webkit-transform-origin;
	-moz-transition-property: -moz-transform, -moz-transform-origin;
	-ms-transition-property: -ms-transform, -ms-transform-origin;
	-o-transition-property: -o-transform, -o-transform-origin;
	
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-ms-transition-duration: 1s;
	-o-transition-duration: 1s;
	
    -webkit-transition-delay: 0s;
	-moz-transition-delay: 0s;
	-ms-transition-delay:0s;
	-o-transition-delay:0s;
	
	-webkit-transition-timing-function: ease;
	-moz-transition-timing-function: ease;
	-ms-transition-timing-function: ease;
	-o-transition-timing-function: ease;

}

section > div > div
{
	position: absolute;
	-webkit-transition-property: -webkit-transform, -webkit-transform-origin;
	-moz-transition-property: -moz-transform, -moz-transform-origin;
	-ms-transition-property: -ms-transform, -ms-transform-origin;
	-o-transition-property: -o-transform, -o-transform-origin;
	
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-ms-transition-duration: 1s;
	-o-transition-duration: 1s;
	
	-webkit-transition-delay: 0s;
	-moz-transition-delay: 0s;
	-ms-transition-delay:0s;
	-o-transition-delay:0s;
	
	-webkit-transition-timing-function: ease;
	-moz-transition-timing-function: ease;
	-ms-transition-timing-function: ease;
	-o-transition-timing-function: ease;
	
	overflow: hidden;

}

section > div > div > div
{
	/* drop shadow along left edge of page */
	position: absolute;
	left: 0px;
	top: 0px;
	width: 10px;
	height: 600px;	/* max preview page height */
	background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .25)), to(rgba(0,0,0,0)));
	background: -moz-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
	background: -o-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
	background: -ms-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*                                                                               */
/* Current right-hand page, unflipped.                                           */
/*                                                                               */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

section.crpu
{
	display: block;
	z-index: 2;
	width: 1200px;  /* 3 times the page width  */
	height: 895px;  /* 3 times the page height */
	-webkit-transform-origin: 1250px 295px;
	-moz-transform-origin: 1250px 295px;
	-ms-transform-origin: 1250px 295px;
	-o-transform-origin: 1250px 295px;
	-webkit-transform: translate(-800px, -295px) rotate(-15deg);
	-moz-transform: translate(-800px, -295px) rotate(-15deg);
	-ms-transform: translate(-800px, -295px) rotate(-15deg);
	-o-transform: translate(-800px, -295px) rotate(-15deg);
}

section.crpu > div
{
	width: 1200px;
	height: 895px;
	overflow: hidden;
}

section.crpu > div > div
{
    /* div containing the actual image */
	width: 400px;
	/* height: 295px; */
	-webkit-transform-origin: 450px 0px;
	-moz-transform-origin: 450px 0px;
	-ms-transform-origin: 450px 0px;
	-o-transform-origin: 450px 0px;
	-webkit-transform: translate(800px, 295px) rotate(15deg);
	-moz-transform: translate(800px, 295px) rotate(15deg);
	-ms-transform: translate(800px, 295px) rotate(15deg);
	-o-transform: translate(800px, 295px) rotate(15deg);
}

section.crpu > div > div > div
{
	/* drop shadow along left edge of page */
	position: absolute;
	left: 0px;
	top: 0px;
	width: 10px;
	height: 600px;	/* preview page height */
	background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .25)), to(rgba(0,0,0,0)));
	background: -moz-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
	background: -o-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
	background: -ms-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*                                                                               */
/* Current right-hand page, flipped.                                             */
/*                                                                               */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

section.crpf
{
	display: block;
	z-index: 2;
	width: 1200px;  /* 3 times the page width  */
	height: 895px;  /* 3 times the page height */
	-webkit-transform-origin: 1250px 295px;
	-moz-transform-origin: 1250px 295px;
	-ms-transform-origin: 1250px 295px;
	-o-transform-origin: 1250px 295px;
	-webkit-transform: translate(-1200px, -295px) rotate(0deg); /* shift left by the width of the image, while rotating from -15 to zero degrees */
	-moz-transform: translate(-1200px, -295px) rotate(0deg); /* shift left by the width of the image, while rotating from -15 to zero degrees */
	-ms-transform: translate(-1200px, -295px) rotate(0deg); /* shift left by the width of the image, while rotating from -15 to zero degrees */
	-o-transform: translate(-1200px, -295px) rotate(0deg); /* shift left by the width of the image, while rotating from -15 to zero degrees */
}

section.crpf > div
{
	width: 1200px;
	height: 895px;
	overflow: hidden;
}

section.crpf > div > div
{
    /* div containing the actual image */
	width: 400px;
	/*height: 295px;*/
	-webkit-transform-origin: 50px 0px;
	-moz-transform-origin: 50px 0px;
	-ms-transform-origin: 50px 0px;
	-o-transform-origin: 50px 0px;
	-webkit-transform: translate(1200px, 295px) rotate(0deg);
	-moz-transform: translate(1200px, 295px) rotate(0deg);
	-ms-transform: translate(1200px, 295px) rotate(0deg);
	-o-transform: translate(1200px, 295px) rotate(0deg);
}

section.crpf > div > div > div
{
	/* drop shadow along left edge of page */
	position: absolute;
	left: 0px;
	top: 0px;
	width: 10px;
	height: 600px;	/* preview page height */
	background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .25)), to(rgba(0,0,0,0)));
	background: -moz-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
	background: -o-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
	background: -ms-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*                                                                               */
/* Next right-hand page (matches crpu, except for z-index)                       */
/*                                                                               */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

section.nrp
{
	display: block;
	z-index: 1;
	width: 1200px;  /* 3 times the page width  */
	height: 895px;  /* 3 times the page height */
	-webkit-transform-origin: 1250px 295px;
	-moz-transform-origin: 1250px 295px;
	-ms-transform-origin: 1250px 295px;
	-o-transform-origin: 1250px 295px;
	-webkit-transform: translate(-800px, -295px) rotate(-15deg);
	-moz-transform: translate(-800px, -295px) rotate(-15deg);
	-ms-transform: translate(-800px, -295px) rotate(-15deg);
	-o-transform: translate(-800px, -295px) rotate(-15deg);
}

section.nrp > div
{
	width: 1200px;
	height: 895px;
	overflow: hidden;
}

section.nrp > div > div
{
    /* div containing the actual image */
	width: 400px;
	/*height: 295px;*/
	-webkit-transform-origin: 450px 0px;
	-moz-transform-origin: 450px 0px;
	-ms-transform-origin: 450px 0px;
	-o-transform-origin: 450px 0px;
	-webkit-transform: translate(800px, 295px) rotate(15deg);
	-moz-transform: translate(800px, 295px) rotate(15deg);
	-ms-transform: translate(800px, 295px) rotate(15deg);
	-o-transform: translate(800px, 295px) rotate(15deg);
}

section.nrp > div > div > div
{
	/* drop shadow along left edge of page */
	position: absolute;
	left: 0px;
	top: 0px;
	width: 10px;
	height: 600px;	/* preview page height */
	background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .25)), to(rgba(0,0,0,0)));
	background: -moz-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
	background: -o-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
	background: -ms-linear-gradient(left, rgba(0, 0, 0, .25), rgba(0,0,0,0));
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*                                                                               */
/* Next left-hand page, unflipped.                                               */
/*                                                                               */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

section.nlpu
{
	display: block;
	z-index: 4;
	width: 900px;
	height: 600px;
	overflow: hidden;
	-webkit-transform-origin: 0px 0px;
	-moz-transform-origin: 0px 0px;
	-ms-transform-origin: 0px 0px;
	-o-transform-origin: 0px 0px;
	-webkit-transform: translate(-500px, 0px);
	-moz-transform: translate(-500px, 0px);
	-ms-transform: translate(-500px, 0px);
	-o-transform: translate(-500px, 0px);
}

section.nlpu > div
{
	width: 1200px;  /* 3 times the page width  */
	height: 895px;  /* 3 times the page height */
	overflow: hidden;
	-webkit-transform-origin: 1250px 295px;
	-moz-transform-origin: 1250px 295px;
	-ms-transform-origin: 1250px 295px;
	-o-transform-origin: 1250px 295px;
	-webkit-transform: translate(-300px, -295px) rotate(-15deg);
	-moz-transform: translate(-300px, -295px) rotate(-15deg);
	-ms-transform: translate(-300px, -295px) rotate(-15deg);
	-o-transform: translate(-300px, -295px) rotate(-15deg);
}

section.nlpu > div > div
{
    /* div containing the actual image */
	width: 400px;
	/*height: 295px;*/
	-webkit-transform-origin: 0px 0px;
	-moz-transform-origin: 0px 0px;
	-ms-transform-origin: 0px 0px;
	-o-transform-origin: 0px 0px;
	-webkit-transform: translate(1200px, 285px) rotate(0deg);
	-moz-transform: translate(1200px, 285px) rotate(0deg);
	-ms-transform: translate(1200px, 285px) rotate(0deg);
	-o-transform: translate(1200px, 285px) rotate(0deg);
}

section.nlpu > div > div > div
{
	/* drop shadow along right edge of page */
	position: absolute;
	left: 390px;
	top: 0px;
	width: 10px;
	height: 600px;	/* preview page height */
	background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0)), to(rgba(0, 0, 0, .25)));
	background: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0, 0, 0, .25));
	background: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0,0,0,.25));
	background: -ms-linear-gradient(left, rgba(0, 0, 0,0), rgba(0,0,0, .25));
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*                                                                               */
/* Next left-hand page, flipped.                                                 */
/*                                                                               */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

section.nlpf
{
	display: block;
	z-index: 4;
	width: 900px;
	height: 600px;
	overflow: hidden;
	-webkit-transform-origin: 0px 0px;
	-moz-transform-origin: 0px 0px;
	-ms-transform-origin: 0px 0px;
	-o-transform-origin: 0px 0px;
	-webkit-transform: translate(-500px, 0px);
	-moz-transform: translate(-500px, 0px);
	-ms-transform: translate(-500px, 0px);
	-o-transform: translate(-500px, 0px);
}

section.nlpf > div
{
	width: 1200px;  /* 3 times the page width  */
	height: 895px;  /* 3 times the page height */
	overflow: hidden;
	-webkit-transform-origin: 1250px 295px;  /* right edge of clip, 1/3 way down from top */
	-moz-transform-origin: 1250px 295px;  /* right edge of clip, 1/3 way down from top */
	-ms-transform-origin: 1250px 295px;  /* right edge of clip, 1/3 way down from top */
	-o-transform-origin: 1250px 295px;  /* right edge of clip, 1/3 way down from top */
	-webkit-transform: translate(-700px, -295px) rotate(0deg);
	-moz-transform: translate(-700px, -295px) rotate(0deg);
	-ms-transform: translate(-700px, -295px) rotate(0deg);
	-o-transform: translate(-700px, -295px) rotate(0deg);
}

section.nlpf > div > div
{
    /* div containing the actual image */
	width: 400px;
	/*height: 295px;*/
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	-webkit-transform: translate(800px, 295px) rotate(0deg);
	-moz-transform: translate(800px, 295px) rotate(0deg);
	-ms-transform: translate(800px, 295px) rotate(0deg);
	-o-transform: translate(800px, 295px) rotate(0deg);
}

section.nlpf > div > div > div
{
	/* drop shadow along right edge of page */
	position: absolute;
	left: 390px;
	top: 0px;
	width: 10px;
	height: 600px;	/* preview page height */
	background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0)), to(rgba(0, 0, 0, .25)));
	background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0,0,0,.25));
	background: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0,0,0,.25));
	background: -ms-linear-gradient(left, rgba(0, 0, 0,0), rgba(0,0,0, .25));
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*                                                                               */
/* Current left-hand page (matches nlpf, except for z-index)                     */
/*                                                                               */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

section.clp
{
	display: block;
	z-index: 3;
	width: 900px;
	height: 600px;
	overflow: hidden;
	-webkit-transform-origin: 0px 0px;
	-moz-transform-origin: 0px 0px;
	-ms-transform-origin: 0px 0px;
	-o-transform-origin: 0px 0px;
	-webkit-transform: translate(-500px, 0px);
	-moz-transform: translate(-500px, 0px);
	-ms-transform: translate(-500px, 0px);
	-o-transform: translate(-500px, 0px);
}

section.clp > div
{
	width: 1200px;  /* 3 times the page width  */
	height: 895px;  /* 3 times the page height */
	overflow: hidden;
	-webkit-transform-origin: 1250px 295px;  /* right edge of clip, 1/3 way down from top */
	-moz-transform-origin: 1250px 295px;  /* right edge of clip, 1/3 way down from top */
	-ms-transform-origin: 1250px 295px;  /* right edge of clip, 1/3 way down from top */
	-o-transform-origin: 1250px 295px;  /* right edge of clip, 1/3 way down from top */
	-webkit-transform: translate(-700px, -295px) rotate(0deg);
	-moz-transform: translate(-700px, -295px) rotate(0deg);
	-ms-transform: translate(-700px, -295px) rotate(0deg);
	-o-transform: translate(-700px, -295px) rotate(0deg);
}

section.clp > div > div
{
    /* div containing the actual image */
	width: 400px;
	/*height: 295px;*/
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	-webkit-transform: translate(800px, 295px) rotate(0deg);
	-moz-transform: translate(800px, 295px) rotate(0deg);
	-ms-transform: translate(800px, 295px) rotate(0deg);
	-o-transform: translate(800px, 295px) rotate(0deg);
}

section.clp > div > div > div
{
	/* drop shadow along right edge of page */
	position: absolute;
	left: 390px;
	top: 0px;
	width: 10px;
	height: 600px;	/* preview page height */
	background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0)), to(rgba(0, 0, 0, .25)));
	background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0,0,0,.25));
	background: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0,0,0,.25));
	background: -ms-linear-gradient(left, rgba(0, 0, 0,0), rgba(0,0,0, .25));

}



/* positioning for other content */

p, div, a, img {
	margin: 0 0 0 0;
}

.float_left {
	float: left;
}

.float_right {
	float: right;
}

.float_none
{
	float:none;
}

.text_center {
	text-align: center;
}

.text_right {
	text-align: right;
}

.text_left {
	text-align: left;
}

.valign_top
{
	vertical-align:top;
}

.inline_block
{
	display:inline-block;
}

.block
{
	display:block;
}

.inline
{
	display:inline;
}

.book_center_narrow {
	width: 750px;
	margin-left: 125px;
	margin-right: 125px;
}

.page_number_block, .right_page_number, .left_page_number
 {
	width: 49%;
	height: 13px;
}


.content, .content_lower{}

.content_upper
{
	position:relative; 
	width: 100%;
	z-index: 200;
}

.upper_fixed_width
{
	width: 800px;
	margin:auto;
}

.content_lower
{
	position:relative; 
	width:100%;

	z-index: 9999;
}

.book_title
{

	width: 48%;
	height:100%;
	font-weight: bold;
	margin: auto;

}

.mkm_block
{
	margin:0 auto 0 auto;
	width:48%;
	height:100%;	
}

.app_title
{

	margin-bottom: 10px;
	width: 100%;
	line-height: 19px;
	font-weight:bold;

}

.makeonebtn
{
	margin:auto;
	text-align:right;

}

.printonelink
{
	margin-right:15px;
	text-align:right;
/*	color:#00aeef;  blue */
	color:#73a9d8;
	line-height:22px;
	font-weight:bold;
	
}

.hover_white:hover
{
	color:White;
}

.book_info 
{

	width: 800px;
	margin-top: 10px;
	
}

.controls
{
	position:relative;
	width: 100%;
	margin-left: 10%;
	
}

.social_badges {
	margin-top: 26px;
}

.page_flip_controls
{
	position:relative;
	width: 100%;
	margin-top: 10px;
}


.makeone_button:visited
{
	color: Black;
}

.makeone_button:active
{
	color: #F9B90C;
}

.mkm_link
{
	margin:20px auto 20px auto;
	height: 14px;
	text-align:right; 
	width: 80%;
	color: #F9B90C;
}

.forward_btn
{

	margin-right: 10%;
	font-size:large;
	font-weight:bold;
	cursor:pointer;
}

.prev_btn
{
	margin-left: 10%;
	font-size:large;
	font-weight:bold;
	cursor:pointer;
}


a:link, a:visited 
{
		color: #00aeef;
		text-decoration: none;
}