/* General */
#statusInfo {
	color:				Green;				/* LightGray */
    position:			sticky;
    top:				200px;
}


/* Sidebar */
.nav-main >p {
	margin:				10px 0px 0px 0px;	/* N E S W */
}

.nav-main >ul {
	margin:				5px 0px 0px 0px;	/* N E S W */
}

/* List */

.chessbook_row:hover {
	background-color:	LightGray;
	cursor:				Pointer;
}

/* Board */

.chessbook_board {
    position:			relative;
	padding:			0px 0px 0px 0px;
	z-index: 			0;
}

.chessbook_canvas, .chessbook_pieces {
	margin:				0px 0px 0px 0px;
}

.chessbook_caption0, .chessbook_caption1 {
	font-style:			Italic;
}

.chessbook_caption0 {
	padding:			0px 0px 10px 0px;
}

.chessbook_caption1 {
	padding:			6px 0px 16px 0px;
}

.chessbook_title0, .chessbook_title1 {
	font-size:			16px;
	font-weight:		Bold;
}

.chessbook_title0 {
	padding:			0px 0px 6px 0px;
}

.chessbook_title1 {
	padding:			16px 0px 6px 0px;
}

.chessbook_tree td.even {
	background-color:	LightGray;
}

.chessbook_diagram {
	top:				10px;
	left: 				0px;
	margin-bottom:		40px;
	position:			relative;
	line-height:		1;
	overflow:	 		auto;
}

.chessbook_diagram_static {
	margin-top:			10px;
	margin-bottom:		0px;
	margin-left:		0px;
	display: 			block;
}

.chessbook_game {
	top:				10px;
	left: 				20px;
	position:			relative;
	line-height:		1;
	overflow:	 		auto;
	/*column-count:		2;*/
	margin:				0px 20px 0px -20px;	/* N E S W */
}

.chessbook_sidebar {
	position:			sticky;
	background-color:	#ececec;
	z-index: 			1;
	top:				0px;
}

.bB, .bK, .bN, .bP, .bQ, .bR,
.wB, .wK, .wN, .wP, .wQ, .wR {
	position:	absolute;
	z-index: 	9;
	/*draggable:	true;*/
}

/* Dialogs */

.edit-chessbook {			/* dropdown-content */
	display:			none;
	position:			absolute;
	background-color:	#f1f1f1;
	max-width:			140px;
	box-shadow:			0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index:			1;
}

.edit-chessbook a {			/* dropdown-content */
	color:				black;
	padding:			6px 6px;
	line-height:		80%;
	text-decoration:	none;
	display:			block;
}

.edit-chessbook a:hover {	/* dropdown-content */
	background-color:	#ddd
}

.dialog-chessbook {			/* dropdown-show */
	display:			inline-block;
}

dialog.dialogInput {
    background-color:	LightGray;
    border-color:		DarkBlue;
    border-width:		1px;
}

table.dialogInput {
    background-color:	LightGray;
	border-style:		none;
}

.ui-chessbook {				/* .ui-widget-header,.ui-state-default, ui-button */
	background:			#b9cd6d;
	border: 			1px solid #b9cd6d;
	color: 				#FFFFFF;
	font-weight: 		bold;
}

textarea-chessbook {
	display: 			inline-block;
	border: 			none;
	width: 				100%;
	margin-bottom:		10px;
}

/* Notes: general */

div.chessbook_moves {
	font-weight:		Normal;
	font-style:			Normal;
	padding:			1px 3px 1px 2px;
	line-height:		130%;
}

div.chessbook_moves>div, div.chessbook_moves>div u {
	color:				Black;
	font-weight:		Normal;
}

div.chessbook_moves b {
	padding:			2px 3px 2px 2px;
	line-height:		200%;
}

div.chessbook_moves i {
	font-weight:		Normal;
	font-style:			Normal;
	padding:			1px 3px 1px 2px;
}

div.chessbook_moves i.first {
	font-weight:		Normal;
	font-style:			Italic;
}

div.chessbook_moves u {
	text-decoration: 	none;
}

div.chessbook_moves>div.d0>u.post {
	display:			Block;	  
	padding:			0px 0px 10px 0px;
}

div.chessbook_moves>div.d0>u.pre {
	display:			Block;	  
	padding:			10px 0px 0px 0px;
}

/* Notes: selection */

b.selected {
	border-style:		solid;
	border-width:		1px;
	background-color:	Yellow;
	font-weight:		bold;
	padding:			2px 2px 2px 1px;    /* N E S W */
}

b.target {
	border-style:		solid;
	border-width:		3px;
	border-color:   	Green;
	padding:			2px 2px 2px 0px;
}

i.selected {
	border-style:		solid;
	border-width:		1px;
	background-color:	Yellow;
	font-weight:		bold;
	padding:			1px 2px 1px 1px;
}

i.target {
	border-style:		solid;
	border-width:		3px;
	border-color:		green;
	padding:			1px 2px 1px 0px;
}

i.first {
	font-weight:		Normal;
	font-style:			Italic;
}

div.chessbook_moves b:hover,div.chessbook_moves i:hover {
	background-color:	LightGray;
	cursor:				Pointer;
}


/* Counters: level 1 */

div.chessbook_moves ol.l1 {
	list-style-type:	none;
	counter-reset:		cnt1;
	margin-bottom:		5px;
}

div.chessbook_moves ol.l1>li::before {
	counter-increment:	cnt1;
	content:			counter(cnt1,upper-latin) ") ";
	font-weight:		bold;
	margin-left:		-20px;
}

/* Counters: level 2 */

div.chessbook_moves ol.l2 {
	list-style-type:	none;
	counter-reset:		cnt2;
}

div.chessbook_moves ol.l2>li::before {
	counter-increment:	cnt2;
	content:			counter(cnt1,upper-latin) counter(cnt2) ") ";
	font-weight:		bold;
	margin-left:		-25px;
}

/* Counters: level 3 */

div.chessbook_moves ol.l3 {
	list-style-type:	none;
	counter-reset:		cnt3;
}

div.chessbook_moves ol.l3>li::before {
	counter-increment:	cnt3;
	content:			counter(cnt1,upper-latin) counter(cnt2) "." counter(cnt3) ") ";
	font-weight:		bold;
	margin-left:		-30px;
}

/* Counters: level 4 */

div.chessbook_moves ol.l4 {
	list-style-type:	none;
	counter-reset:		cnt4;
}

div.chessbook_moves ol.l4>li::before {
	counter-increment:	cnt4;
	content:			counter(cnt1,upper-latin) counter(cnt2) "." counter(cnt3) counter(cnt4,lower-latin) ") ";
	font-weight:		bold;
	margin-left:		-35px;
}

/* Counters: level 5 */

div.chessbook_moves ol.l5 {
	list-style-type:	none;
	counter-reset:		cnt5;
}

div.chessbook_moves ol.l5>li::before {
	counter-increment:	cnt5;
	content:			counter(cnt1,upper-latin) counter(cnt2) "." counter(cnt3) counter(cnt4,lower-latin) counter(cnt5)") ";
	font-weight:		bold;
	margin-left:		-40px;
}

/* Counters: level 6 */

div.chessbook_moves ol.l6 {
	list-style-type:	none;
	counter-reset:		cnt6;
}

div.chessbook_moves ol.l6>li::before {
	counter-increment:	cnt6;
	content:			counter(cnt1,upper-latin) counter(cnt2) "." counter(cnt3) counter(cnt4,lower-latin) counter(cnt5) "." counter(cnt6,lower-latin) ") ";
	font-weight:		bold;
	margin-left:		-45px;
}

/* Counters: level 7 */

div.chessbook_moves ol.l7 {
	list-style-type:	none;
	counter-reset:		cnt7;
}

div.chessbook_moves ol.l7>li::before {
	counter-increment:	cnt7;
	content:			counter(cnt1,upper-latin) counter(cnt2) "." counter(cnt3) counter(cnt4,lower-latin) counter(cnt5) "." counter(cnt6,lower-latin) counter(cnt7) ") ";
	font-weight:		bold;
	margin-left:		-50px;
}

/* Counters: level 8 */

div.chessbook_moves ol.l8 {
	list-style-type:	none;
	counter-reset:		cnt8;
}

div.chessbook_moves ol.l8>li::before {
	counter-increment:	cnt8;
	content:			counter(cnt1,upper-latin) counter(cnt2) "." counter(cnt3) counter(cnt4,lower-latin) counter(cnt5) "." counter(cnt6,lower-latin) counter(cnt7) counter(cnt8,lower-roman) ") ";
	font-weight:		bold;
	margin-left:		-55px;
}

/* Counters: level 9 */

div.chessbook_moves ol.l9 {
	list-style-type:	none;
	counter-reset:		cnt9;
}

div.chessbook_moves ol.l9>li::before {
	counter-increment:	cnt9;
	content:			counter(cnt1,upper-latin) counter(cnt2) "." counter(cnt3) counter(cnt4,lower-latin) counter(cnt5) "." counter(cnt6,lower-latin) counter(cnt7) counter(cnt8,lower-roman) "." counter(cnt9) ") ";
	font-weight:		bold;
	margin-left:		-60px;
}

/* Notes: depth 0 */

div.chessbook_moves>div.d0 {
	font-size: 			15px;
	margin:				0px 0px 0px 0px;
}

div.chessbook_moves>div.d0>u.post {
	text-decoration: 	none;
	display:			Block;	  
	padding:			0px 0px 10px 0px;
}

div.chessbook_moves>div.d0>u.pre {
	text-decoration: 	none;
	display:			Block;	  
	padding:			10px 0px 0px 0px;
}


/* Notes: depth 1 - 9 */

div.chessbook_moves ol.d1, div.chessbook_moves div.d1 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				5px 0px 0px 5px;
}

div.chessbook_moves ol.d2, div.chessbook_moves div.d2 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				4px 0px 0px 10px;
}

div.d2 u.pre, div.d2 u.post {
	color:				rgb(34, 33, 33);
}

div.chessbook_moves ol.d3, div.chessbook_moves div.d3 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				3px 0px 0px 15px;
}

div.chessbook_moves ol.d4, div.chessbook_moves div.d4 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				2px 0px 0px 20px;
}

div.chessbook_moves ol.d5, div.chessbook_moves div.d5 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				1px 0px 0px 25px;
}

div.chessbook_moves div.d6 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				1px 0px 0px 28px;
}

div.chessbook_moves div.d7 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				1px 0px 0px 31px;
}

div.chessbook_moves div.d8 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				1px 0px 0px 34px;
}

div.chessbook_moves div.d9 {
	font-size: 			14px;
	color:				rgb(34, 33, 33);
	margin:				1px 0px 0px 37px;
}


/* Dialogs */

menu {
	text-align:			Center;
}

#moveDialog {
	background-color:	AntiqueWhite;
	font-size: 			14px;
	border-width:		2px;
	border-color:		Maroon;
}

#tagDialog {
    height:				450px;
    width:				450px;
}

#importDialog {
	background-color:	AntiqueWhite;
	font-size: 			14px;
	border-width:		2px;
	border-color:		Maroon;
    height:				160px;
    width:				300px;
}

.dialogTitle {
	color:				Black;
	font-size: 			18px;
	background-color:	LightGray;
	text-align:			Center;
}

.dialogLabel {
	color:				Maroon;
	padding:			10px 0px 5px 0px;	/* N E S W */
}

.dialogInput {
	font-size: 			14px;
}

.dialogButton {
	font-size: 			14px;
	color:				Maroon;
	background-color:	AntiqueWhite;
	border-color:		Maroon;
}

.dialogButton:hover {
	cursor:				Pointer;
	background-color:	Yellow;
}


#pawnDialog {
    background:			#efdecd;
    padding:            2px 5px 1px 5px;
}

#pgnDialog {
    background:			#efdecd;
	border-color:		#662200;	/* #cd9575 */
	width:				700px;
	padding:            0px;
}

#pgnDialog pre {
	background:			#efdecd;
	margin: 			0px;
}


/* Variants table */

div.chessbook_moves table.tree .leftcell {
	padding:			0px 2px 0px 5px;
}

div.chessbook_moves table.tree .target {
    border-style:		solid;
    border-width:		3px;
	border-color:   	Green;
}

div.chessbook_moves table.tree .rightcell {
	padding:			0px 5px 0px 2px;
}

div.chessbook_moves table.tree td.bold, div.chessbook_moves table.tree td.number {
	font-weight:		Bold;
}

div.chessbook_moves table.tree td.shadow {
	color:				Gray;
}

div.chessbook_moves table.tree td.cell {
	height:				20px;
	vertical-align:		Middle;
}

div.chessbook_moves table.tree td.active:hover, div.chessbook_moves table.tree td.variant {
	cursor:				Pointer;
}

div.chessbook_moves table.tree td.selected {
/*	border-style:		solid;	*/
/*	border-width:		1px;	*/
	background-color:	Yellow;
	font-weight:		bold;
/*	padding:			1px 2px 1px 2px; */
}

div.chessbook_moves table.tree td.variant {
	font-weight:		Bold;
	text-align:			Center;
}