
/* Notification *** */
#reader .book-notification { 
	position: absolute;
	display: none;
	z-index: 10;
	margin: auto;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	width: 75%;
	min-width: 400px;
	height: 45%;
	min-height: 240px;
	background-color: #18222E;
	overflow: hidden;
}
#reader .book-notification .bubble-header {
	background-color: #4D6F8D;
}
#reader .book-notification .bubble-footer {
	height: 12px;
}
#reader .book-notification .bubble-content {
	position:absolute;
	left: 5px;
	right: 5px;
	top: 45px;
	bottom: 5px;
	padding: 0;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	background-color: #FBF5EA;
}
#reader .book-notification #notification\.itemHeader {
	padding: 0 10px;
	height: 40px;
	border: 2px #000 solid;
	border-width: 0px 1px;
	background-image: url(../images/1024/handbook-header-bg.png);
	background-repeat: repeat-x;
	color:#fff;
	font-weight:bold;
	font-size: 14px;
	overflow: hidden;
}
#reader .book-notification #notification\.itemHeader label {
	display: inline-block;
	width: 33%;
	line-height: 2.5em;
}
#reader .book-notification #notification\.itemHeader label[name="bookname"] { width: 60% }
#reader .book-notification #notification\.itemHeader label[name="page"],
#reader .book-notification #notification\.itemHeader label[name="resource"] { width: 20%; min-width: 65px; text-indent: 8px;}
#reader .book-notification table.notification-item-list {table-layout: fixed; overflow-wrap: break-word;}
#reader .book-notification table.notification-item-list thead { color:#fff; font-weight:bold; font-size: 14px; }
#reader .book-notification table.notification-item-list thead tr { height: 40px; }
#reader .book-notification table.notification-item-list thead .header-message th {
    background-color: #FFCCCC;
    background-image: none;
    color: #000;
}
#reader .book-notification table.notification-item-list thead .header-message th .icon-bullet {
	position: relative;
}
#reader .book-notification table.notification-item-list thead .header-message th .icon-bullet:before {
    left: -30px;
    bottom: 2px;
    width: 25px;
    height: 25px;
}
#reader .book-notification table.notification-item-list thead th[name] { cursor: pointer; }
#reader .book-notification table.notification-item-list thead th:first-child { border-left-width: 4px; }
#reader .book-notification table.notification-item-list thead th:last-child { border-right-width: 4px; }
#reader[data-orientation="portrait"] .book-notification table.notification-item-list thead th:last-child { min-width: 65px; }
#reader .book-notification table.notification-item-list thead th:after { margin: auto 10px; }
#reader .book-notification table.notification-item-list thead th.asc:after { content: '\25B2'; }
#reader .book-notification table.notification-item-list thead th.desc:after { content: '\25BC'; }
#reader .book-notification table.notification-item-list tbody tr.notification-item { /*font-weight: bold;*/ font-size: 14px; }
/*#reader .book-notification table.notification-item-list tbody tr.notification-item:nth-child(even) { background-color: #F5F5F5; }*/
#reader .book-notification table.notification-item-list tbody tr.notification-item td {
	padding: 8px 0;
	border-bottom: 1px solid #DEE;
	/*text-indent: 8px;*/
	line-height: 1.2em;
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	transition: .5s;
	opacity: 0;
}
#reader .book-notification table.notification-item-list tbody.visible tr.notification-item td {
	opacity: 1;
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	transition: .5s;
}
#reader .book-notification table.notification-item-list tbody tr.notification-item td.center { text-align: center; }
#reader .book-notification table.notification-item-list tbody tr.notification-item td a { color: #59b200; }

#reader .book-notification table.notification-item-list tbody tr.notification-item td:first-child { text-indent: 8px; }
#reader .book-notification table.notification-item-list tbody tr.notification-item td:nth-child(2) { width: 20%; min-width: 65px; }
#reader .book-notification table.notification-item-list tbody tr.notification-item td:last-child { width: 20%; min-width: 65px; }
/* *** Notification */
