/* START Clearfix */

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.clearfix {
    display: inline-block;
}
html[xmlns] .clearfix {
    display: block;
}
* html .clearfix {
    height: 1%;
}

/* END Clearfix */


/* START general layout */

#finish {
	background:url('../img/play-icon_small.png') no-repeat center center;
	height: 30px;
	min-width: 30px;
}
.mobiletitle {
	display: none;
}
.desktoptitle {
	display: block;
}
#index {
	display: block;
}
body {
	background: 		#000;
	color: 				#221105;
	margin: 			0px;
	text-align: 		center;
}
#frontcover .wrapperfront h1 a:active, #frontcover .wrapperfront h1 a:visited, #frontcover .wrapperfront h1 a:link {
	color: 				#7c3e11;
	text-shadow: 		-3px 0 4px #000;
}
#frontcover .wrapperfront h2 a:active, #frontcover .wrapperfront h2 a:visited, #frontcover .wrapperfront h2 a:link {
	color: 				#7c3e11;
	text-shadow: 		-3px 0 4px #000;
}
#loadingimages {
	color: 				#7c3e11;
	text-shadow: 		0 0 5px black;
	font-weight: 		bold;
}
.wrapperfront {
	text-align: 		center;
}
h1 {
	color: 				#7c3e11;
	margin: 			0px;
	padding: 			0px;
}
h2 {
	text-align: 		center;
	font-style: 		italic;
	margin: 			0px 0px 8px 0px;
	padding: 			0px;
}
h3 {
	margin: 			8px 0px 0px 0px;
	padding: 			0px;
}
h4 {
	margin: 			8px 0px 0px 0px;
	padding: 			0px;
}
a:active, a:link, a:visited  {
	outline: 			none;
	text-decoration: 	none;
	color: 				black;
}
a:hover {
	text-shadow: 		0px 0px 5px red;
	color: 				black;
}
.active span.active {
	text-shadow: 		0px 0px 5px red;
	color: 				#600;
}
span.loadpage, span.loadchapter {
	cursor: pointer;
}
.navigation {
	display: none;
}
ul {
	list-style-type: none;
}
.wrapper {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.backtotop {
	text-align: center;
}
/* END general layout */


/* START Bookindex */
ul.chaptercontent{
	padding: 0px;
	margin: 0px 0px 5px 0px;
}
.chaptercontent {
	display: none;
}		
.bookindex ul.active {
	display: block;
}
#index div.active  h3 a {
	text-shadow: 		0px 0px 5px red;
	color: 				black;
}
/* END Bookindex */


/* START content styling */

/* START stereotype table styling */
.stereotypes td {
	vertical-align: top;
}
.stereotypes tr:first-child td:first-child {
	width: 100px;
}
.stereotypes td {
	padding-bottom: 10px;
}
/* END stereotype table styling */
	
	
/* END content styling */

#page {
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	color: #221105;
}

.handwritten {
	display: none;
}
.quote {
	font-style: italic;
}

#notes {
	text-align: left;
	overflow:show;
	color: #222;
}
.note {
	background: #DBBE93;
	text-align: left;
	padding: 10px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 5px 5px 10px 5px;
}
.note p {
	display: none;
}
#notes .notesignature {
	font-style: italic;
}


/* START COLORISE BY PERSON */
.xapprentice, .renaruskayle {
	color: darkred;
	text-shadow: 0px 0px 5px #f00;
}
.xmaster, .xessearkada  {
	text-shadow: 0px 0px 10px #55E1D8; 
	color: #333;
}
.halcyon  {
	text-shadow: 0px 0px 10px #488214; 
	color: #603311;
}
.muz  {
	text-shadow: 0px 0px 10px purple; 
	color: black;
}
.shilong  {
	text-shadow: 0px 0px 10px #9C661F; 
	color: #333;
}
.xialong  {
	color: black;
    -webkit-animation: glow 5s infinite alternate;
}
@-webkit-keyframes glow {
    to {
        text-shadow: 0px 0px 10px purple;
    }
}
.vexatus {
	text-shadow: 0px 0px 8px red; 
	color: #000;
}
.muzashen {
	color: black;
	-webkit-box-shadow: 0px 3px 16px 0px red;
	-moz-box-shadow: 0px 3px 16px 0px red;
	box-shadow: 0px 3px 16px 0px red;
}
#notes .renaruskayle {
	-webkit-box-shadow: 0px 3px 16px 0px red;
	-moz-box-shadow: 0px 3px 16px 0px red;
	box-shadow: 0px 3px 16px 0px red;
}
#notes .xessearkada  {
	-webkit-box-shadow: 0px 3px 16px 0px #56B4E9;
	-moz-box-shadow: 0px 3px 16px 0px #56B4E9;
	box-shadow: 0px 3px 16px 0px #56B4E9;
}
#notes .shilong  {
	-webkit-box-shadow: 0px 3px 16px 0px red;
	-moz-box-shadow: 0px 3px 16px 0px red;
	box-shadow: 0px 3px 16px 0px red;
}
#notes .xialong  {
	-webkit-box-shadow: 0px 3px 16px 0px red;
	-moz-box-shadow: 0px 3px 16px 0px red;
	box-shadow: 0px 3px 16px 0px red;
}
#notes .vexatus {
	-webkit-box-shadow: 0px 3px 16px 0px red;
	-moz-box-shadow: 0px 3px 16px 0px red;
	box-shadow: 0px 3px 16px 0px red;
}
#notes .darkside {
	-webkit-box-shadow: 0px 3px 16px 0px red;
	-moz-box-shadow: 0px 3px 16px 0px red;
	box-shadow: 0px 3px 16px 0px red;
}
#notes .lightside {
	-webkit-box-shadow: 0px 3px 16px 0px #56B4E9;
	-moz-box-shadow: 0px 3px 16px 0px #56B4E9;
	box-shadow: 0px 3px 16px 0px #56B4E9;
}
#notes .neutralside {
	-webkit-box-shadow: 0px 3px 16px 0px lightgrey;
	-moz-box-shadow: 0px 3px 16px 0px lightgrey;
	box-shadow: 0px 3px 16px 0px lightgrey;
}
/* START COLORISE BY PERSON */


#bookindex  {
	z-index: 2;
}
.styleswitcher  {
	z-index: 1;
}
#bookindex, .styleswitcher  {
	border: 0px solid #000;
	background: #DBBE93;
	text-align: left;
	padding: 20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 5px 5px 5px 5px;
}

/* Landscape phones and down */
@media (max-width: 480px) {
}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {

/* Portrait tablet to landscape and desktop */
/*@media (min-width: 768px) and (max-width: 979px) {*/
@media (min-width: 768px) {

/* Large desktop */
@media (min-width: 1200px) {
}