/* reset css */
html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-weight: normal;
}
table { border-collapse: collapse; border-spacing: 0; }
td, th, caption { font-weight: normal; text-align: center; }
img, fieldset { border: 0; max-width: 100%; display: block;}
ol { padding-left: 1.4em; list-style: decimal; line-height: 2.5;}
ul { padding-left: 1.4em; list-style: round; line-height: 2;}
q:before, q:after { content:''; }
/* end reset */


body {
	font-family: verdana, helvetica, sans-serif; 
	color: #453966;
	background-color: #292b42; 
	font-size: 1em;
}


#wrapper {
	background-color: #292b42; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

a {
	color: #686cba;
	text-decoration: none;
	font-weight: normal;
}

a:link {
	color: #686cba;
	text-decoration: none;
	font-weight: normal;
}

a:visited {
	color: #686cba;
	text-decoration: none;
	font-weight: normal;
}

a:hover {
	color: #e97f27;
	text-decoration: underline;
}	


#container {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}


#banner-strip{
	width: 100%;
	height: 100px;
	/*opacity:0.80;
	filter:alpha(opacity=80);*/
	float: center;
	background-color: #292b42;
	margin-bottom: 15px;
}

#banner-content {
	width: 100%;
	height: 100px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-direction: row;
	align-items: center;
}


#logo {
	margin-top: 7px;
	margin-left: 20px;
	margin-right: 20px;
}


.main-menu {
	font-family: 'Open Sans Condensed', 'Open Sans', Tahoma, sans-serif;
	font-weight: 300;
	padding-right: 5%;
	font-size: 1.2em;
	display: flex;
	height: 100%;
	flex-direction: row;
	align-items: center;
	margin-left: auto;
}


.main-menu a:link{
	font-family: 'Open Sans Condensed', 'Open Sans', Tahoma, sans-serif;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	font-weight: normal;
}


.main-menu a:hover { 
	font-family: 'Open Sans Condensed', 'Open Sans', Tahoma, sans-serif;
	font-weight: 300;
	color: #686cba;
}

.main-menu a:visited {
	color: #ffffff;
}

.header-menu-item {
	padding: 10px;
}

#login_form  p{
	margin-bottom: 5px;
}	

#social-icons {
	margin-top: 0px;
	margin-left: 20px;
	display: flex;
}

#social-icons a {
	padding: 5px;
}


#select2-single-tag-select-container {
	background: #ffffff;
	width: 300px;
	height: 60px;
	display: flex;
	align-items: center;
}


.tag-search-button {
	width: 30%;
	font-family: 'Open Sans Condensed', 'Open Sans', Tahoma, sans-serif;
	font-weight: 500;
	font-size: 1.0em;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	background: #686cba;
	letter-spacing: 2px;
	color: #ffffff;
	border: 2px;
	-moz-border-radius-bottomleft: 3px;
		border-bottom-left-radius: 3px;
		-moz-border-radius-topright: 3px;
		border-top-right-radius: 3px;
		-moz-border-radius-bottomright: 3px;
		border-bottom-right-radius: 3px;
		-moz-border-radius-topleft: 3px;
		border-top-left-radius: 3px;
}


.multi-tag-select-container {
	background: #ffffff;
	font-size: 1.0em;
	width: 80%; 
}

.multi-tag-select-container option {
	font-size: 1.0em;
}

/* #clear1, #submit1 {
	width: 20%;
	font-family: 'Open Sans Condensed', 'Open Sans', Tahoma, sans-serif;
	font-weight: 500;
	font-size: 1.0em;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	background: #686cba;
	letter-spacing: 2px;
	color: #ffffff;
	border: 2px;
	-moz-border-radius-bottomleft: 3px;
		border-bottom-left-radius: 3px;
		-moz-border-radius-topright: 3px;
		border-top-right-radius: 3px;
		-moz-border-radius-bottomright: 3px;
		border-bottom-right-radius: 3px;
		-moz-border-radius-topleft: 3px;
		border-top-left-radius: 3px;
	} */


#search-box {
	width: 40%;
	height: 40px;
	background-color: #ffffff;
	padding-left: 2px;
	padding-top: 2px;
	padding-bottom: 2px;
	-moz-border-radius-bottomleft: 2px;
	border-bottom-left-radius: 2px;
	-moz-border-radius-topright: 2px;
	border-top-right-radius: 2px;
	-moz-border-radius-bottomright: 2px;
	border-bottom-right-radius: 2px;
	-moz-border-radius-topleft: 2px;
	border-top-left-radius: 2px;
}

#search-box-text {
	width: 100%;
	color: #dd5a26;
	padding-top: 5%;
	padding-left: 5%;
	padding-bottom: 5%;
	word-spacing: 6px;
	letter-spacing: 2px;
}

/*#search-inner {
	position: relative;
	width: 650px;
	margin-top: 15px;
	margin-right: 7px;
	font-size: 18px;
	word-spacing: 6px;
	letter-spacing: 2px;
}
*/


#search-text, #search-text-blk {
	font: 1.2em Tahoma, Geneva, sans-serif;
	color:  #989698;
	border: none;
	height: 100%;
	flex-grow: 2;
	min-width: 0;
	font-size: 1.2em
}

#search-text:focus, #search-text-blk:focus {
	outline: none;
}

#search-box input[type="image"]:after {
	content: '';
	margin-right: 30px;
	display: block;
}

#search-box input[type="image"] {
	margin-right: 5px;
	margin-left: 5px;
	height: 20px;
}

#search-box form {
	display: flex;
	flex-direction: row;
	height: 100%;
	align-items: center;
}

#search-text-blk {
	font: 1.2em Tahoma, Geneva, sans-serif;
	color:  #000000;
	width: 90%;
}

.menu-toggle,
.main-menu .menu-close {
  display: none;
}

#white-main {
	background-color: #eae4e4;
	display: flex;
}


#white-main ul {
	list-style: square;
	text-align: left;
}

.font-icon-pale {
	color: #9a9dd6;
}

/*#main-top-section {
	clear: both;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #ffffff;
	display: inline-block;
	text-align: top;
}
*/

#list {
	width: 100%;
}

.center {
	align-items: center;
}

#main-center-wide {
	width: 80%;
	margin-top: 0px;
	margin-left: 8px;
	margin-right: 15px;
	margin-bottom: 30px;
	overflow: hidden; /* contain float */
	padding-left: 15px;
	border-left: 2px dotted silver; /*temporary css*/
}

#main-center-wide h1 {
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	font-weight: 700;
	/*margin-right: 0 auto;*/
	margin-top: 10px;
	margin-bottom: 5px;
	color: #594a82;
	padding: 0px;
	font-size: 2.5em;
	/*text-align: center;*/
}

h1 {
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	font-weight: 700;
	/*margin-right: 0 auto;*/
	margin-top: 10px;
	margin-bottom: 5px;
	color: #594a82;
	padding: 0px;
	font-size: 2.5em;
	/*text-align: center;*/
}

h2 {
	clear: both;
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	font-weight: 600;
	margin-top: 20px;
	margin-bottom: 15px;
	color: #594a82;
	padding: 0px;
	font-size: 2.0em;
}

.light-font {
	font-weight: 500;
}

h3 {
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	color: #594a82;
	font-weight: 550;
	margin-top: 7px;
	margin-bottom: 20px;
	font-size: 1.8em;
	//*text-align: center;*/
}



//*#main-center-wide a:link {
	font-family: Tahoma, Geneva, sans-serif;
	color:  #e97f27;
	font-weight: normal;
	margin-bottom: 10px;
	padding: 0px;
	text-decoration: none;
	font-size: 14px;
	text-align: left;
}

#main-center-wide a:visited  {
	font-family: Tahoma, Geneva, sans-serif;
	color: #ea7c22;
	font-weight: normal;
	margin-bottom: 10px;
	padding: 0px;
	text-decoration: none;
	font-size: 14px;
	text-align: left;
}

#main-center-wide a:hover {
	font-family: Tahoma, Geneva, sans-serif;
	color: #ea7c22;
	font-weight: normal;
	margin-bottom: 10px;
	padding: 0px;
	text-decoration: underline;
	font-size: 14px;
	text-align: left;
}
*/

#two-thirds {
	width: 74%;
	display: inline-block;
	vertical-align: top;
	margin-left: 0px;
	margin-top: 0px;
	/*background-color: #eae4e4;*/
	-moz-border-radius-bottomleft: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
}

/*#main-center {
	float: left;
	margin-top: 0px;
	margin-left: 0px;
	margin-bottom: 20px;
	overflow: hidden; 
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 0px;
	padding-top: 0px;
}*/

#main-center h2{
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	font-weight: 500;
	margin-right: 5px;
	margin-top: 7px;
	margin-bottom: 0px;
	color: #594a82;
	padding: 0px;
	font-size: 2.0em;
}


//*#main-center h3{
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	color: #594a82;
	font-weight: 700;
	margin-top: 15px;
	padding: 0px;
	margin-bottom: opx;
	font-size: 48px;
	text-align: left;
	letter-spacing: 1.3px;
}
*//

#overlay { 
	border: 15px;
	color: #ffffff;
}

#image-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10;
	background-color: rgba(0,0,0,0.5); 
}

#close-dialog {
	
}

#close-dialog  i { 
	z-index: 20;
	right: 5px;
	position: absolute;
	top: 5px;
	cursor: pointer;
	color: #594A82;
	font-size: 1.3em;
}


#right-side-upper {
	background-color: #ffffff;
	width: 21%;
	float: right;
	text-align: left;
	vertical-align: top;
	overflow: hidden;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 1.0em;
	/*word-spacing: 1px;
	letter-spacing: 1px;*/
	margin-top: 10px;
	margin-bottom: 30px;
	margin-left: 0px;
	margin-right: 15px;
	padding: 0px 15px 15px 15px;
	-moz-border-radius-bottomleft: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
}

#right-side-upper h2 {
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	font-weight: 500;
	margin-top: 7px;
	margin-bottom: 10px;
	color: #594a82;
	padding: 0px;
	font-size: 1.7em;
	text-align: center;
}

#box-1-left {
	float: left;
	font-family: Tahoma, Geneva, sans-serif; color: #453966;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	width: 15%;
	margin-bottom: 30px;
	/* background-color: #ffffff; */
	overflow: hidden;
	padding-right: 5px; 
	padding-left: 15px;
	-moz-border-radius-bottomleft: 2px;
	border-bottom-left-radius: 2px;
	-moz-border-radius-topright: 2px;
	border-top-right-radius: 2px;  
}


#box-2-center {
	float: left;
	width: 55%;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 30px;
	overflow: hidden;
	/* background-color: #ffffff; */
	padding-left: 15px;   
	border-left: 1px solid #292b42;
	border-right: 1px solid #292b42;
}

#box-3-right {
	float: left;
	margin-top: 0px;
	width: 25%;
	margin-left: 15px;
	margin-bottom: 30px;
	/* background-color: #ffffff; */
	overflow: hidden;
	padding: 0px;   
}

#box-1-top {
	display: flex;
	flex-direction: row;
	font-family: Tahoma, Geneva, sans-serif; color: #453966;
	margin: 0 auto;
	padding: 4%;
	background-color: #594a82;
	width: 100%;
	overflow: hidden;
	-moz-border-radius-bottomleft: 2px;
	border-bottom-left-radius: 2px;
	-moz-border-radius-topright: 2px;
	border-top-right-radius: 2px;  
}

#percent-box {
	display: flex;
	flex-direction: column;
	width: 25%;
	margin-right: 0%;
	padding: 1%;
	height: auto;
	align-items: center;
	text-align: center;
	background-color: #ffffff;
	margin-left: 0px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	border-top-left-radius: 4px;
	-moz-border-radius-topright: 4px;
	border-top-right-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	border-bottom-right-radius: 4px;
}	



#reading-level-box {
	display: flex;
	flex-direction: column;
	width: 26%;
	margin-right: 4%;
	height: auto;
	margin-left: 0px;
	background-color: #ffffff;
	padding: 1%;
	text-align: center;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	border-top-left-radius: 4px;
	-moz-border-radius-topright: 4px;
	border-top-right-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	border-bottom-right-radius: 4px;
}

#reading-level-box table { 
	border: 0;
}

#reading-level-box td { 
	padding-top: 10px;
}

#single-genre-box {
	display: none;
}	


#multi-genre-box {
	background-color: #ffffff;
	width: 26%;
	height: auto;
	margin-right: 4%;
	padding: 1%;
	align-items: center;
	text-align: center;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	border-top-left-radius: 4px;
	-moz-border-radius-topright: 4px;
	border-top-right-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	border-bottom-right-radius: 4px;
	/*background-color: #e0d9d9;*/
}	


#genre-box {
	clear: both;
	width: 75%;
	height: auto;
	background-color: #ffffff;
	/*text-transform: uppercase;*/
	margin-top: 8px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	padding-top: 4px;
	padding-bottom: 15px;
	padding-left: 10px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	border-top-left-radius: 4px;
	-moz-border-radius-topright: 4px;
	border-top-right-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	border-bottom-right-radius: 4px;
}

.tags {
	/*text-transform: uppercase; */
	line-height: 2.0;
}

#book-order {
	width: 100%;
	margin-left: 20px;
	display: block;
	float: left;
	line-height: 2;
}

#additional-browse {
	clear: both;
	margin-left: 10px;
}

#additional-browse a:hover{
	color:  #453966;
	text-decoration: underline;
}

#browse-section {
	clear: all;
	width: 95%;
	float: center;
	margin-left: auto;
	margin-right: auto;
}

#browse-section-left {
	float: left;
	background-color: #ffffff;
	width: 70%;
	height: auto;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: auto;
}


#genre-box-all {
	width: 95%;
	float: left;
	background-color: #eae4e4;
	margin-top: 10px;
	margin-bottom: 20px;
	padding: 4px 4px 8px 6px;
	-moz-border-radius-bottomleft: 2px;
	border-bottom-left-radius: 2px;
	-moz-border-radius-topright: 2px;
	border-top-right-radius: 2px;
	-moz-border-radius-bottomright: 2px;
	border-bottom-right-radius: 2px;
}

#genre-display {
	width: 19%;
	float: left;
	vertical-align: top;
	padding: 3px;
	line-height: normal;
}

#genre-display a {
	color: #453966;
	text-decoration: none;
	font-weight: normal;
}

#genre-display a:link{
	color: #453966;
	text-decoration: none;
	font-weight: normal;
}

#genre-display a:visited{
	color: #453966;
	text-decoration: none;
	font-weight: normal;
}

#genre-display a:hover{
	color: #e97f27;
	text-decoration: underline;
}	

#browse {
	margin-top: 20px;
	width: 16%;
	margin-left: 15px;
	margin-bottom: 30px;
	float: left;
	background-color: #e4e4e9;
	overflow: hidden;
	padding: 7px;   
	-moz-border-radius-bottomleft: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
}

#browse-section-right {
	float: left;
	background-color: #ffffff;
	width: 28%;
	height: auto;
	margin-top: 20px;
}

#container-bookbox {
	display: flex;
	flex-wrap: wrap;
}


#bookbox {
	max-width: 12%;
	padding: 15px 15px 15px 15px;
	text-align: center;
}	

#bookbox-mobile {
	display: none;
}

#bookbox-search {
	width: 18%;
	float: left;
	padding: 0px 5px 15px 5px;
}	

#bookbox-search:nth-of-type(5n + 1) {
	clear: left;
}	

#reviewbox {
	background-color: #ffffff;
	width: 95%;
	float: left;
	text-align: left;
	overflow: hidden;
	margin-bottom: 10px;
	margin-left: 0px;
	padding: 15px;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	-moz-border-radius-bottomleft: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	border-bottom-right-radius: 10px;
}

/* .print-series {
	font-size: 12px;
	margin: auto 0;
	text-align: center; */
/* } */

#footer {
	opacity:0.90;
	filter:alpha(opacity=90);
	float: center;
	clear: both;
	height: 80px;
	padding-top: 20px;
	width: 100%;
	font-size: 0.9em;
	letter-spacing: 1.3;
	margin-top: 0px;
	color: #ffffff;
	font-weight: normal;
	background-color: #292b42;
	margin-left: 0px;
}


#footer a:link{
	color: #ffffff;
	text-decoration: none;
	font-weight: normal;
	font-variant-caps: petite-caps;
}

#footer a:visited{
	color: #ffffff;
	text-decoration: none;
	font-weight: normal;
}

#footer a:hover{
	color: #a2a2be;
	text-decoration: underline;
}

/*h1{
	font: 20px Tahoma, Geneva, sans-serif;		
	margin-right: 5px;
	margin-top: 15px;
	margin-bottom: 0px;
	color: #594a82;
}
*/



h2.orange{
	font: 1.4em Tahoma, Geneva, sans-serif;	
	font-weight: normal;
	margin-top: 0px;
	margin-bottom: 10px;
	color:  #e97f27;
}

.h2nobreak  {
	font: 1.4em Tahoma, Geneva, sans-serif;	
	font-weight: normal;
	color: #594a82;
	padding: 7px;
}

.h2nobreak2  {
	font: 1.4em Tahoma, Geneva, sans-serif;	
	font-weight: bold;
	color: #594a82;
	padding: 0px;
}

.h2nobreakgrey  {
	font: 1.4em Tahoma, Geneva, sans-serif;	
	font-weight: normal;
	color: grey;
	padding: 7px;
}

p {
	margin-bottom: 15px;
	line-height: 1.5;
}

.big{
	font: 1.6em Tahoma, Geneva, sans-serif;		
	font-style: italic;
	letter-spacing: 6px;
	margin-right: 5px;
	color: #339933;
}

.tiny {
	font-size: 0.75em;
}


.h3italic{
	font-family: Georgia, Palatino, serif;
	color: #3638a7;
	font-weight: normal;
	font-style: italic;
	margin: 0px;
	padding: 0px;
	margin-bottom: 10px;
	font-size: 1.5em;
	text-align: left;
}


.h3-narrow{
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	color: #594a82;
	font-weight: 700;
	margin-top: 0px;
	padding: 0px;
	margin-bottom: -15px;
	font-size: 3.0em;
	text-align: left;
	letter-spacing: -1px;
}

.h3-pale{
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	/* color: #b379b6; */
	/* color: #a186be; */
	color: #594a82;
	font-weight: 700;
	margin-top: 0px;
	padding-top: 0px;
	margin-bottom: 0px;
	font-size: 2.4 em;
	text-align: left;
	letter-spacing: 1.3px;
}

.h3-orange{
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	/* color: #d8853b; */
	/* color: #f1821e;
	/*color: #f18103; */
	color: #ea852b;
	font-weight: 700;
	margin-top: 0px;
	padding-top: 0px;
	margin-bottom: 0px;
	font-size: 2.4em;
	text-align: left;
	letter-spacing: 1.3px;
}

.h3-inline{
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	color: #594a82;
	font-weight: 700;
	margin-top: -12px;
	padding: 0px;
	margin-bottom: -13px;
	font-size: 3.0 em;
	text-align: left;
	letter-spacing: 1.3px;
}

.h3runner {
	font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
	color: #594a82;
	font-weight: 500;
	margin-top: 10px;
	padding-top: 10px;
	margin-bottom: 0px;
	font-size: 1.3em;
	text-align: center;
	display: block;
}


.h3nobold{
	font: 1.4 Tahoma, Geneva, sans-serif;	
	font-weight: normal;
	color: #594a82;
	padding: 7px;
}

.italic-insert{
	font: 1.4em Verdana, sans-serif;	
	font-weight: normal;
	font-style: italic;
	color:  #e97f27;
}

h4{
	font-family: Tahoma, Geneva, sans-serif;
	color: #594a82;
	font-weight: bold;
	font-size: 1.0em;
	margin-top: 5px;
	margin-bottom: 5px;
}

#slogan {
	clear: both;
	width: 100%;
	height: 40px;
	text-align: center;
	font-family: 'Open Sans', Tahoma, Geneva, sans-serif;
	font-weight: 400;
	font-style: italic;
	font-size: 1.4em;
	color: #ffffff;
	margin-left: auto;
	margin-right: auto;
	margin-top: 60px;
}

.inlinehead {
	font-family: Tahoma, Geneva, sans-serif;
	color: #ea7c22;
	font-weight: bold;
	margin-top: 20px;
	margin-bottom: 10px;
	font-size: 1.2em;
	text-align: left;
}

.inlinehead2 {
	font-family: Tahoma, Geneva, sans-serif;
	color: #33365d;
	line-height: 1.3em;
	font-weight: bold;
	padding-top: 20px;
	margin-bottom: 14px;
	font-size: 1.4 em;
	text-align: left;
	letter-spacing: 0px;
}

.inlinehead2  a:hover{
	text-decoration: underline;
	color: #594a82;
	
}

.inlinehead3 {
	font-family: Tahoma, Geneva, sans-serif;
	color: #ea7c22;
	font-weight: normal;
	margin-top: 20px;
	margin-bottom: 10px;
	font-size: 1.4em;
	text-align: left;
	float: left;
}

.inlinehead3  a{
	text-decoration: none;
	color: #ea7c22;
}

.inlinehead3  a:hover{
	text-decoration: underline;
	color: #ea7c22;
}

.orangetext {
	font-family: Tahoma, Geneva, sans-serif;
	color:  #e97f27;
	font-weight: bold;
	margin-bottom: 10px;
	padding: 0px;
	margin-bottom: 8px;
	font-size: 1.0em;
	text-align: left;
}

a.orangelink
{
	color:  #e97f27;
	text-decoration: none;
}

a.orangelink:hover{
	color:  #e97f27;
	text-decoration: underline;
} 


a:hover .orangetext{
	font-family: Tahoma, Geneva, sans-serif;
	color:  #e97f27;
	text-decoration: underline;
}



#spoons {
	float: right;
	width: 15%;
	margin-left: 20px;
	margin-bottom: 10px;
	margin-right: 0px;
	padding-left: 10px;
}

#book-brief {
	float: left;
	/* max-width: 33%; */
	padding: 6px 20px 5px 0px;
}

#book-descrip {
	
}

#series-brief {
	clear: both;
	float: left;
	margin: 0px 0px 5px 0px;
	padding-top: 10px;
	padding-bottom: 50px;
	line-height: 2.2;
}

#series-brief-series {
	line-height: 1.7;
}


#detail-text {
	float: left;
	width: 70%;
	height: auto;
}

.list {
	line-height: 2;
}

.smdetails {
	font-size: 0.80em;
	margin-top: 10px;
	padding: 0px;
}

.meddetails {
	font-size: 0.80em;
	margin-top: 10px;
	padding: 0px;
}

.bkdetails {
	float: right;
	width: 70%;
}
.bksummary {
	float: left;
	width: 30%;
}

.trailer {
	width: 80%;
	float: left;
}

.inlinelink a:link {
	font-weight: normal;
	text-decoration: none;
}

.inlinelink a:visited {
	font-weight: normal;
	text-decoration: none;
}

.inlinelink a:hover {
	font-weight: normal;
	text-decoration: underline;
}




#cover-image {
	position: relative;
	float: left;
	margin: 0 0 0 0;
	padding-top: 0px;
	cursor: pointer;
}

#cover-image i {
	float: right;
	position: absolute;
	/*height: 22px;*/
	height: auto;
	background-color: #ffffff;
	opacity: 0.65;
	filter: alpha(opacity=65);
	color: #453966;
	z-index: 8;
	padding-top: 5px;
	padding-left: 5px;
	right: 0;
	bottom: 0;
	cursor: pointer;
}

.cover-image-style {
		width: 200px;
}

.cover-brief {
	clear: both;
	float: left;
	margin-top: 5px;
	margin-bottom: 15px;
	font-size: 1.0em;
	padding: 0px;
}

.rating-only {
	float: left;
	margin-top: 0px;
	margin-bottom: 5px;
	font-size: 0.80em;
	padding: 0px;
}


.sign-in-boxes {
	-moz-border-radius-bottomleft: 2px;
	border-bottom-left-radius: 2px;
	-moz-border-radius-topright: 2x;
	border-top-right-radius: 2px;
	-moz-border-radius-topleft: 2px;
	border-top-left-radius: 2px;
	-moz-border-radius-bottomright: 2px;
	border-bottom-right-radius: 2px;
	background-color: #ffffff;
}


.textalignright {
	width: 20px;
	text-align: right;
}

.longlists {
	line-height: 2;
}

.firstinlist  {
	line-height: 2;
	font-weight: normal;
	text-decoration: none;
	color: #594a82;
}

.firstinlist a:link {
	font-weight: none;
	text-decoration: none;
	color: #594a82;
}

.firstinlist a:visited {
	font-weight: none;
	text-decoration: none;
	color: #594a82;
}

.firstinlist a:hover {
	font-weight: none;
	text-decoration: underline;
	color: #594a82;
}

.awards {
	font-size: 0.80em;
}	

span.stars, span.stars span {
	display: block;
	background: url(../images/rating-spoon-v1.png) 0 -30.5px repeat-x;
	width: 50px;
	height: 30.5px;
}

span.stars span {
	background-position: 0 0;
}

span.stars-review, span.stars-review span {
	display: block;
	background: url(../images/rating-spoon-v1s.png) 0 -15px repeat-x;
	width: 40px;
	height: 14px;
}

span.stars-review span {
	background-position: 0 0;
}

div.login_panel_overlay
{
	position: absolute;
	background-color: #33365d;
	right: 400px;
	top: 85px;
	padding: 10px;
	-moz-border-radius-bottomleft: 2px;
	border-bottom-left-radius: 2px;
	-moz-border-radius-topright: 2x;
	border-top-right-radius: 2px;
	-moz-border-radius-bottomright: 2px;
	border-bottom-right-radius: 2px;
}

.review-input {
	float: left;
	margin: 28%;
}

div#previous-next {
	font-size: 0.80em;
	float: left;
	padding-bottom: 3px;
}

div#previous-next a:hover{
	//*color: #e97f27;*//
	color: #ffffff;
}

.second-indent ul {
	padding-left: 3em; 
	margin-top: 3px;
	font-size: 1.0 em;
	line-height: 2;
	list-style-type: round !important;
}

#shoponline {
	clear: both;
	z-index: 9;
	float: center;
	/* vertical-align: bottom; */
	width: 90px;
	height: 20px;
	background-color: #ffffff;
	color: #594a82;
	font: 0.4em Verdana, Helvetica, sans-serif;
	letter-spacing: -1;
	padding-top: 3px;
	margin: 0;
	text-align: center;
	border: 1px solid #b4b3c5;
	border-radius: 5px;
}

#shoponline ul {	
	z-index: 10;
	position: absolute;
	visibility: hidden;
	float: left;
	margin-top: 4px;
	padding-top: 5px;
	width: 200px;
	background-color: #ffffff;
	color: #594a82;
	/* font: 0.7em Verdana, Helvetica, sans-serif; */
	border-radius: 5px;
	border: 1px solid #b4b3c5;
	line-height: 2;
}

#shoponline li {
	line-height: 1.0;
	float: left;
	width: 400px;
	list-style: none;
}

#banner-content-mobile {
	display: none;
}

#mobile-friendly {
	float: left;
}


#staff {
	clear: both;
	width: 100%;
	margin-bottom: 30px;
}

.staff-photo {
	float: left;
	width: 18%;
	margin-left: 0;
	margin-top: 30px;
}

.staff-bio {
	float: right;
	width: 82%;
	margin-top: 10px;
}


/* Start Media Query CSS */

/* iPad */
@media (min-width: 900px) and (max-width: 2048px) {
	#wrapper {
		background-color: #eae4e4 !important;
	}
	
	#white-main {
		/*clear: both;*/
		width: 100% !important;
	}
	
	#search-box {
		margin-left: 5%;
		margin-right: 5%;
		width: 25%;
		height: 31px;
	}
	/*final bracket */
}


/* Mobile Phones in Portrait and Landscape */
@media (min-width: 320px) and (max-width: 1023px) {
	
	.home-search-container input[type="reset"],
	.home-search-container input[type="submit"] {
		-webkit-appearance: none;
		border-radius: 0;
	}

	#mobile-friendly {
		display: none;
	}

	body {
		font-family: verdana, helvetica, sans-serif; 
		color: #453966;
		background-color: #292b42; 
		/* font-size: 1.0em; */
	}
	
	h1 {
		font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
		font-weight: 700;
		/*margin-right: 0 auto;*/
		margin-top: 10px;
		margin-bottom: 5px;
		color: #594a82;
		padding: 0px;
		/* font-size: 2.5em; */
		/*text-align: center;*/
	}
	
	h2 {
		font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
		font-weight: 600;
		padding-top: 20px;
		margin-bottom: 10px;
		color: #594a82;
		/* font-size: 2.2em; */
		/* line-height: 1; */
		/*text-align: center;*/
	}
	
	
	h3 {
		font-family: 'Open Sans Condensed', Tahoma, Geneva, sans-serif;
		color: #594a82;
		font-weight: 550;
		margin-top: 15px;
		padding: 0px;
		margin-bottom: 20px;
		/* font-size: 2.0em; */
		text-align: center;
	}

	#logo {
		margin-top: 3px;
		margin-left: 5px;
		float: left;
	}

	#search-box {
		margin-left: auto;
		margin-right: auto;
		width: 80%;
	}
	
	#search-box-text {
	width: 80%;
	color: #dd5a26;
	padding-top: 0px;
	padding-left: 0px;
	padding-bottom: 0px;
	word-spacing: 6px;
	letter-spacing: 2px;
}

	#white-main {
		/*clear: both;*/
		width: 100% !important;
	}
	
	#main-center-wide {
		width: 98%;
		padding: 1%;
		align-items: center;
		text-align: center;
		border-left: none;
		border-right: none;
	}

	/* #main-center-wide h2 {
		font-size: 3.0em;
	} */


	#series-brief h2 {
		line-height: 1.1;
	}

	#container-bookbox {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		/* font-size: 1.8em; */
	}


	#bookbox {
		display: none!important;
	}

	#bookbox-mobile {
		width: 80%;
		max-width: 70%;
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		line-height: 1.5;
		/* flex-wrap: wrap; */
	}

	#bookbox-mobile img {
		width: 200px;
		margin-bottom: 10px;
	}

	/* #bookbox-text-mobile {
		display: flex;
		flex-wrap: wrap;
		text-align: center;
	} */




	/*.home-search-container {
		margin: 0 auto;
		background-color: #ffffff;
		text-align: center;
	}

	.home-search-container h3 {
		text-align: center;
	}*/

	.cover-brief {
		clear: both;
		float: left;
		margin-top: 5px;
		margin-bottom: 15px;
		/* font-size: 1.5em; */
		padding: 0px;
	}

	#box-1-top {
		display: flex;
		flex-direction: column;
		font-family: Tahoma, Geneva, sans-serif; color: #453966;
		margin-left: 2%;
		margin-right: 2%;
		/* font-size: 2em; */
		/*background-color: #594a82;*/
		width: 96%;
		overflow: hidden;
		-moz-border-radius-bottomleft: 2px;
		border-bottom-left-radius: 2px;
		-moz-border-radius-topright: 2px;
		border-top-right-radius: 2px;  
	}


	#percent-box {
		display: none!important;
	}

	#reading-level-box {
		width: 94%;
		margin-bottom: 4%;
		margin-left: 1%;
		margin-right: 1%;
		padding: 0;
		background-color: #ffffff;
		display: flex;
		align-items: center;
		border: none;
	}

	#genre-box {
		display: none !important;
	}

	#single-genre-box {
		width: 94%;
		background-color: #ffffff;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-bottom: 4%;
		margin-left: 1%;
		margin-right: 1%;
		padding: 0;
		border: none;
		-moz-border-radius-bottomleft: 4px;
		border-bottom-left-radius: 4px;
		-moz-border-radius-topleft: 4px;
		border-top-left-radius: 4px;
		-moz-border-radius-topright: 4px;
		border-top-right-radius: 4px;
		-moz-border-radius-bottomright: 4px;
		border-bottom-right-radius: 4px;
		/*background-color: #e0d9d9;*/
}	
	#multi-genre-box {
		width: 94%;
		background-color: #ffffff;
		display: flex;
		flex-direction: column;	
		align-items: center;
		border: none;
		padding-top: 2%;
		margin-left: 1%;
		margin-right: 1%;
	}

	ol {
		text-align: left;
	}


	.multi-tag-select-container {
		background: #ffffff;
		font-size: 1.0em;
		width: 80%; 
	}
	
	.multi-tag-select-container option {
		font-size: 0.4em;
	}

/*#multi-genre-box table {
	width: 100%;
	margin: 0 auto;
	border: none;
	font-size: 1.8em;
}
*/

#book-order {
	margin-top: 30px;
}

#book-order h2 {
	line-height: 1.1;
}
	
	#bookbox-search {
		width: 25%;
		height: auto;
		/*float: left;*/
		padding: 15px 15px 15px 15px;
	}	
	
	
	#box-1-left {
		display: none !important;
	}


	/*Banner-related*/
	
	#banner-strip {
		width: 100%;
		height: 130px;
		float: center;
		background-color: #292b42;
		margin-bottom: 15px;
	}
	
	/* #banner-content {
		width: 100%;
		height: 130px;
		margin-left: auto;
		margin-right: auto;
	} */

	#banner-content {
		display: none;
	}

	#banner-content-mobile {
		width: 100%;
		height: 150px;
		display: flex;
		flex-wrap: wrap;
	}
	
	#search-text, #search-text-blk {
		/* font-size: 1.2em; */
	}
	
	#menu {
		float: right;
	}
	
	.main-menu {
		font-family: 'Open Sans Condensed', 'Open Sans', Tahoma, sans-serif;
		font-weight: 300 !important;
		/* width: 40%; */
		height: 45px;
		/* font-size: 2.0em; */
		float: right;
		margin-right: 20px;
		margin-top: 0px;
	}
	
	.main-menu a:link{
		font-family: 'Open Sans Condensed', 'Open Sans', Tahoma, sans-serif;
		font-weight: 300 !important;
		color: #ffffff;
		text-decoration: none;
		font-weight: normal;
	}
	
	
	.main-menu a:hover { 
		font-family: 'Open Sans Condensed', 'Open Sans', Tahoma, sans-serif;
		font-weight: 300 !important;
		color: #ffffff;
		text-decoration: underline;
		margin: 0px;
	}
	
	.main-menu a:visited {
		color: #ffffff;
		text-decoration: none;
	}
	
	
	#login_form  p{
		margin-bottom: 5px;
	}	
	
	#social-icons {
		margin-left: 20px;
		margin-top: 20px;
	}
	
	.main-menu {
		position: absolute;
		display: none;
		right: -200px;
		top: 0;
		height: 100%;
		overflow-y: scroll;
		overflow-x: visible;
		transition: left 0.3s ease,
		box-shadow 0.3s ease;
		z-index: 999;
	}
	
	.main-menu a {
		display: block;
		padding-left: 20px;
		padding-right: 25px;
		padding-top: 20px;
		margin-right: 15px;
		line-height: 1em !important;
		/* font-size: 1.5em; */
		color: #fff;
		font-weight: 400;
		text-decoration: none;
		border-bottom: 1px solid #383838;
	}
	
	.main-menu a:hover,
	.main-menu a:focus {
		background: #333;
		text-decoration: underline;
	}
	
	/* .main-menu .menu-close {
		position: absolute;
		right: 0;
		top: 0;
	} */

	.menu-toggle {
		display: inline;
	}

	.main-menu .menu-close {
		display: block;
	}

	.menu-toggle span {
		color: white;
	}

	.menu-toggle {
		margin-left: auto;
		margin-right: 30px;
	}

	.header-menu-item {
		padding: 0px;
	}

	#book-brief {
		width: 100%;
		padding: 0px;
		display: flex;
		flex-direction: column;
		align-items: center;
}

	#book-descrip {
		clear: both;
		float: center;
	}

#cover-image-style {
		width: 200px;
}

#cover-image img {
	width: 200px;
	margin-bottom: 10px;

}


#staff {
	clear: both;
	width: 100%;
	margin-bottom: 10px;
	/* border-bottom: solid 1px color#b4b4b4; */
}

.staff-photo {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	margin-bottom: 20px;
}

.staff-bio {
	width: 100%;
	margin: 0 auto;
	margin-top: 10px;
}



	/*
	On small devices, allow it to toggle...
	*/
	/*
	:target for non-JavaScript
	[aria-expanded] will be used if/when JavaScript is added to improve interaction, though it's completely optional.
	*/
	.main-menu:target,
	.main-menu[aria-expanded="true"] {
		display: block;
		left: 0;
		outline: none;
		-moz-box-shadow: 3px 0 12px rgba(0,0,0,.25);
		-webkit-box-shadow: 3px 0 12px rgba(0,0,0,.25);
		box-shadow: 3px 0 12px rgba(0,0,0,.25);
		background-color: #292b42;
	}
	
	.main-menu:target .menu-close,
	.main-menu[aria-expanded="true"] .menu-close {
		z-index: 1001;
	}
	
	.main-menu:target ul,
	.main-menu[aria-expanded="true"] ul {
		position: relative;
		z-index: 1000;
	}
	
	/* 
	We could us `.main-menu:target:after`, but
	it wouldn't be clickable.
	*/
	.main-menu:target + .backdrop,
	.main-menu[aria-expanded="true"] + .backdrop {
		position: absolute;
		display: block;  
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 998;
		background: #000;
		background: rgba(0,0,0,.85);
		cursor: default;
	}
	
	@supports (position: fixed) {
		.main-menu,
		.main-menu:target + .backdrop,
		.main-menu[aria-expanded="true"] + .backdrop{
			position: fixed;
		}
	}
	
	
	
	
	/* End Banner-related*/

	/*final bracket */
}

/* End of Media Query CSS */


#shoponline {
	clear: both;
	z-index: 9;
	float: left;
	/* vertical-align: bottom; */
	width: 200px;
	height: 30px;
	background-color: #ffffff;
	color: #594a82;
	font: 1.0em Verdana, Helvetica, sans-serif;
	letter-spacing: -1;
	padding-left: 5px;
	padding-top: 3px;
	margin: 0;
	border: 1px solid #b4b3c5;
	border-radius: 5px;
}

#shoponline ul {	
	z-index: 10;
	position: absolute;
	visibility: hidden;
	float: left;
	margin-top: 4px;
	padding-left: 5px;
	padding-top: 5px;
	width: 400px;
	background-color: #ffffff;
	color: #594a82;
	font: 1.2em Verdana, Helvetica, sans-serif;
	border-radius: 5px;
	border: 1px solid #b4b3c5;
	line-height: 2;
}

#shoponline a {
	/*display: block;*/
	font-weight: normal;
}

.paid { 
	font: 1.0em Verdana, Helvetica, sans-serif;
}

#shoponline li {
	line-height: 2.0;
	float: left;
	width: 400px;
	list-style: none;
}

#shoponline:hover ul, div#shoponline ul:hover {
	visibility: visible;
}

/* #shoponline li ul li {
	line-height: 1.2;
	height: auto;
	width: 92px;
}
#shoponline li ul li a {
	padding: 4px;
} */