@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	font-family: 'Roboto', sans-serif;
	color: #333333;
}
ol, ul {
	list-style: none;
}

a {
	text-decoration: none;
	color:#333333;
	font-family: 'Roboto', sans-serif;
}

p {
	line-height: 1.5em;
	font-family: 'Roboto', sans-serif;
	color: #333333;
}

h1 {
	font-size: 2em;
	text-align:left;
	font-family: 'Roboto', sans-serif;
	color: #999999;
	padding: 0;
	margin:0;
}

h2 {
	font-size: 1.5em;
	font-family: 'Roboto', sans-serif;
	color: #333333;
	padding: 0 0 10px 0;
	text-align:left;
}

h3 {
	font-size: 1.25em;
	font-family: 'Roboto', sans-serif;
	color: #333333;
	padding: 0 0 10px 0;
	text-align:left;
}

h4 {
	font-size: 1em;
	font-family: 'Roboto', sans-serif;
	color: #333333;
	padding: 0 0 10px 0;
	text-align:left;
}

.bolder {
	font-weight: 700;
	font-family: 'Roboto', sans-serif;
}

.center {
	text-align:center;
}
.ital {
	font-style: italic;
	font-family: 'Roboto', sans-serif;
}

.smaller {
	font-size:85%;
}

.arrow {
	font-family: 'Arial Narrow', Arial, sans-serif; font-size:.8em;
}

.arrow2 {
	font-family: 'Arial Narrow', Arial, sans-serif; font-size:.8em; color:#fff;
}

.clear {
	float:none;
	
}

.hp-border {
	border:1px solid #666666; padding-top:20px;
}

a:link img {
       opacity: 1.0;
       filter: alpha(opacity=100); /* For IE8 and earlier */
     }
a:hover img {
       opacity: 0.6;
       filter: alpha(opacity=60); /* For IE8 and earlier */
     }
#content {
	min-height: 600px;
}

#content-container {
	max-width:1280px;
	margin:0 auto;
	
}
#mainwrapper {
	width: 95%;
	margin: 0 auto;
}

#mainwrapper header {
	/*Header */
	background-color: #ffffff;
	overflow: auto;
	font-family: Arial, sans-serif;
	font-style: normal;
	font-weight: 400;
	padding:20px 0;
}

.head-block {
		position:relative;
	
}

	
#mainwrapper header #logo {
	width: 70%;
	font-size:600%;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	color: #cccccc;
	display:block;
	float:left;
	margin:0;
}

#mainwrapper header #logo2 {
	float: left;
	font-family: 'Roboto', sans-serif;
	color: #666666;
	font-size: 12px;
	letter-spacing: .2em;
	padding: 0;
}
.mobileOnly {
	display: none !important;
}
#mainwrapper header #logo2 img {
	width: 350px;
}

#mainwrapper header #social {
	width: 30%;
	float:left;
	text-align: right;
}
#mainwrapper header .company-name {
	width: 200px;
	float: left;
	font-family: 'Roboto', sans-serif;
	color: #666666;
	font-size: 12px;
	letter-spacing: .2em;
	padding: 22px 5px 0 30px;
}
#mainwrapper header .contact {
	width: 25%;
	float: right;
	text-align: right;
	font-family: 'Roboto', sans-serif;
	color: #666666;
	font-size: 12px;
	letter-spacing: .2em;
	padding: 15px 5px 0 0;
}
.share-link {float: right;width:25px;height:25px;margin-left:10px;border:0;box-shadow:0;display:block;}
.facebook {background-image: url('../images/icn-facebook-off.gif');}
.facebook:hover {background-image: url('../images/icn-facebook-on.gif');}
.twitter {background-image: url('../images/twitter-normal.jpg');}
.twitter:hover {background-image: url('../images/twitter-hover.jpg');}
.instagram {background-image: url('../images/instagram-normal.jpg');}
.instagram:hover {background-image: url('../images/instagram-hover.jpg');}
.email {background-image: url('../images/icn-email-off.gif');}
.email:hover {background-image: url('../images/icn-email-on.gif');}

nav {
	float:left;
	width:100%;
}
nav ul {
margin: 10px 0 0 0;
padding: 0;
}
 
nav ul li {
display: inline-block;
list-style-type: none;
    }
     
nav > ul > li > a {
color: #333;
text-transform: uppercase;
padding: 12px;
font-size: 1.15em;
text-decoration: none;
	display:block;
        }

nav > ul > li:hover {
  background-color: #ececec;
}
 
nav > ul > li:hover > a {
}

nav > ul > li > div {
    background-color: #fff;
	border: 1px solid #cccccc;
    border-radius: 0 0 4px 4px;
    display: none;
    margin: 0;
	padding: 0 0 20px 0;
    opacity: 0;
    position: absolute;
    visibility: hidden;
    z-index: 100;
     
}
 
    nav > ul > li > div ul > li {
        display: block;
    }
     
nav > ul > li > div ul > li > a {
    display: block;
    padding: 12px 0px;
	margin: 0 24px;
	color: #333;
	font-size:.9em;
    text-decoration: none;
	border-bottom:1px solid #cccccc;
}
     
nav > ul > li > div ul > li:hover > a {
    background-color: #ececec;
	font-weight:bold;
}

nav > ul > li:hover > div {
    display: block;
    opacity: 1;
    visibility: visible;
}
nav ul li img {
	width: 55px;
	margin-left: 10px;
	display: inline-block;
}

/* Book Content Top */
	
	#topContent {
	width: 100%;
	margin-bottom:20px;
	background-color: #0063b4;
	overflow:hidden;
	}
#book-sidebar {
    float: right;
    width:30%;
	overflow:hidden;
    }

#book-title {
	padding: 30px;
	color: #ffffff;
	overflow:hidden;
}

#book-title h1 {
	color:#fff;
	font-family: 'Roboto', sans-serif;
	/*font-size:3em; */ /* Old style 28 oct 23 */
	font-size: 2.4em;
	font-weight:700;
	line-height:1em;
	margin-bottom: 10px;
}

#book-title h2 {
	color:#fff;
	font-family: 'Roboto', sans-serif;
	font-size: 1.30em;
	font-weight:400;
	font-weight: bold;
	/*padding-bottom:20px;*/
	padding-bottom: 10px;
	line-height:1em;
}

#book-title h4 {
	color:#fff;
	font-family: 'Roboto', sans-serif;
	font-size: 1em;
	font-weight: bold;
	line-height: 1.25em;
	padding-bottom: 0;
}


#book-title sup {
	font-family: 'Roboto', sans-serif;
	line-height: 1em;
	font-size: .75em;
}

#book-title h3 {
	font-family: 'Roboto', sans-serif;
	font-size:1.15em;
	font-weight:400;
	line-height: 1.25em;
	text-transform: uppercase;
	padding-bottom:20px;
}
	
#bannerImage {
    float: left;
    width: 70%;
	margin:0;
	padding:0;
    }
#bannerImage img {
		width:100%;
	display: block;
	}
	
#book-nav-wrapper {
        float: left;
        width:30%;
    }
	
/* Book Content Bottom */

#bottomContent {
	clear: both;
	width: 100%;
	padding-bottom:40px;
	overflow:hidden;
}


#book-body-wrapper {
	width:70%;
	float:left;
}

#book-body {
	padding: 0 80px 20px 30px;
}

#book-body h2 {
	font-family: 'Roboto', sans-serif;
	font-size:2em;
	font-weight:700;
	line-height: 1.25em;
		padding-bottom:20px;
}
#book-body .bookSubtitle {
	font-weight: normal;
	margin-bottom: 5px;
}



#book-body p {
	font-family: 'Roboto', sans-serif;
	font-style: normal;
	line-height: 1.5em;
	font-weight: 200;
	text-align: justify;
	padding-bottom: 10px;
}


#nav-sidebar-wrapper {
	width:30%;
	float:right;
}

#nav-sidebar {
	padding: 5px 30px 30px 30px;
	
}

#nav-sidebar h2 {
	font-size: 1.35em;
	text-transform: uppercase;
	text-align: center;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	border-bottom: 1px solid #999999;
	padding-bottom: 10px;
}
#nav-sidebar ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
#nav-sidebar ul li {
	font-family: 'Roboto', sans-serif;
	color:#333333;
	font-size:1.15em;
  	padding-left: 1em;
	padding-top: 10px;
	text-indent: -1em;
	line-height: 1.2em;
}

#nav-sidebar ul li a {
	text-decoration: none;
}
#nav-sidebar ul li.twoCols {
	display: grid;
	grid-template-columns: 1fr .3fr;
	grid-gap: 10px;
}
#nav-sidebar ul li img {
	width: 80px;
}

#nav-sidebar ul li a:hover, #nav-sidebar ul li a:active {
	color:#999999;
}

#nav-sidebar h2.shortlinksOtherBookTitle {
	margin-top: 20px;
	text-align: left;
}
#nav-sidebar.hp-border {
	padding-top: 20px;
}

/*======= Promo Block =======*/
	#nav-sidebar-wrapper .promoBlock {
		border: 1px solid #FE3500;
		text-align: center;
		padding: 25px;
		margin-bottom: 40px;
	}
	#nav-sidebar-wrapper .promoBlock img {
		width: 85%;
		margin-bottom: 20px;
	}
	#nav-sidebar-wrapper .promoBlock p {
		margin-bottom: 20px;
		font-weight: bold;
		font-size: 19px;
		line-height: 1.3em;
	}
	#nav-sidebar-wrapper .promoBlock a.learMore {
		padding: 8px 35px;
		background-color: #FE3500;
		color: #fff;
		border-radius: 25px;
		display: inline-block;
		margin-top: 10px;
		font-weight: bold;
	}
	#nav-sidebar-wrapper .promoBlock a.learMore:hover {
		transition: all .3s;
		background-color: #DC2F01;
	}

/*======= Promo Block 2 =======*/
	#nav-sidebar-wrapper .promoBlock2 {
		text-align: center;
		padding: 25px;
		margin-bottom: 40px;
        background-color: #0062aa;
        
	}
	#nav-sidebar-wrapper .promoBlock2 h2 {
	color:#fff;
	font-family: 'Roboto', sans-serif;
	font-size: 1.50em;
	font-weight:400;
	font-weight: bold;
        padding: 10px 0px 0px 0px;
	}

#nav-sidebar-wrapper .promoBlock2 h3 {
	font-size: 1.25em;
	font-family: 'Roboto', sans-serif;
	color: #ffffff;
	padding: 0;
	text-align:center;
}
#nav-sidebar-wrapper .promoBlock2 p {
		margin-bottom: 20px;
		line-height: 1.3em;
        color: #ffffff;
	}

#nav-sidebar-wrapper .promoBlock2 a {
		margin-bottom: 20px;
		font-weight: bold;
		font-size: 19px;
		line-height: 1.3em;
        color: #ffffff;
  text-decoration: underline;
	}


/* book purchase links */
.book-nav-wrapper {
	width:30%;
	float:right;
	margin:0;
	}

.book-nav-inner {
	width: 100%;
	margin: 0 auto;
}
.book-nav-inner p {
	color: #fff;
	font-size: 14px;
	margin-left: 18px;
}


.main_book-nav {
overflow: auto; 
display: block;
font: bold 14px Arial, sans-serif;
position: relative;
background: #fff;
cursor: pointer;
border:1px solid #cccccc;
margin: 10px 20px 0 20px;
padding: 0;
}

.main_book-nav a {
display:block;
text-decoration: none;
color: #555555;
padding: 5px;
}

.submenu_book-nav {
    display:none;
}

/*.main_book-nav:hover .submenu_book-nav {
    display:block;
    position:relative;
}*/
.main_book-nav {
	overflow: visible;
}
.main_book-nav:hover .submenu_book-nav {
	display: block;
   position: absolute;
   left: -1px;
   top: 100%;
   background-color: #fff;
   z-index: 100;
   width: 100%;
   border: 1px solid #cccccc;
   border-top: none;
}
	

.submenu_book-nav_link {
    position:relative;
	display:block;
}
	
.submenu_book-nav_link a {
display:block;
}
	
.submenu_book-nav_link a:hover {
background-color:#cccccc;
}

	.book-nav-wrapper .customShopLinks {
		margin: 10px 0;
		padding: 0 20px;
	}
	.book-nav-wrapper .customShopLinks a {
		display: inline-block;
		margin-right: 10px;
		padding: 10px 20px;
		background-color: #fff;
		border-radius: 25px;
		font-weight: bold;
	}
	.book-nav-wrapper .customShopLinks a:last-child {
		margin-right: 0;
	}
	.book-nav-wrapper .customShopLinks a:hover {
		transition: all .3s;
		background-color: #cccccc;
	}


/*======= Coming soon promo ======*/
	.comingSoonPromo {
		text-align: center;
		padding: 30px;
	}
	body.ranaEclipso .comingSoonPromo {
		padding-top: 0;
	}
	@media screen and (min-width: 1185px) {
		body.ranaEclipso .comingSoonPromo {
			margin-top: 100px;
			padding-top: 30px;
		}
	}
	.comingSoonPromo img {
		width: 60%;
	}
	.comingSoonPromo p {
		font-weight: bold;
		font-size: 18px;
		color: #fff;
		margin-bottom: 15px;
		line-height: 1.2em;
	}

/*======= Learn with pictures section ========*/
	.learningWithPicture {
		text-align: center;
		border-top: 1px solid #F03E00;
		padding-top: 40px;
	}
	.learningWithPicture .learningWithPictureInner{
		width: 80%;
		margin: 0 auto;
	}
	.learningWithPicture img {
		width: 370px;
		max-width: 90%;
		margin-bottom: 20px;
	}
	.learningWithPicture p {
		font-weight: bold;
		font-size: 17px;
	}
	.learningWithPicture .discount {
		display: flex;
		width: 35%;
		margin: 20px auto;
		align-items: center;
	}
	.learningWithPicture .discount img {
		width: 25px;
		margin-right: 10px;
	}
	.learningWithPicture .discount p {
		font-weight: normal;
		font-size: 15px;
		text-align: left;
	}
	.regularBookOrderSec {
		text-align: left;
		margin-top: 50px;
	}
	.regularBookOrderSec .discount {
		padding: 15px;
		border: 1px solid #F03E00;
		margin-bottom: 5px;
		margin-top: 15px;
		display: inline-block;
	}
	.regularBookOrderSec .discount b {
		font-weight: bold;
		display: block;
		margin-bottom: 7px;
	}
	.learningWithPicture .buttons,
	.regularBookOrderSec .buttons {
		margin: 10px 0;
	}
	.learningWithPicture .buttons a,
	.regularBookOrderSec .buttons a {
		padding: 10px 20px;
		border-radius: 25px;
		display: inline-block;
		text-transform: uppercase;
		font-weight: bold;
		font-size: 14px;
		letter-spacing: 1px;
	}
	.learningWithPicture .buttons.disabled a,
	.regularBookOrderSec .buttons.disabled a {
		opacity: .4;
	}
	.learningWithPicture .buttons a.order,
	.regularBookOrderSec .buttons a.order {
		background-color: #D1470F;
		color: #fff;
		margin-right: 20px;
	}
	.learningWithPicture .buttons a.lessonPlans,
	.regularBookOrderSec .buttons a.lessonPlans {
		border: 1px solid #D1470F;
		color: #D1470F;
	}
	.learningWithPicture a.learnMore,
	.regularBookOrderSec a.learnMore,
	.retailBockInner a.learnMore {
		text-decoration: underline;
		font-weight: bold;
		display: inline-block;
		margin: 20px 0 40px;
	}
	.retailBockInner a.learnMore {
		margin-bottom: 0;
	}
	.learningWithPicture a.learnMore img,
	.regularBookOrderSec a.learnMore img,
	.retailBockInner a.learnMore img {
		width: 13px;
		margin-bottom: 0;
	}

/* About Liz */

.col-container {
	max-width: 1280px; margin:20px 0px auto; text-align:center; 
}

.col3 {
	width: 30%; display:inline-block; vertical-align: text-top; 
}

.col33 {
	width: 33%; display:inline-block; vertical-align: text-top; 
}

.col5 {
	width: 50%; display:inline-block; vertical-align: text-top; float: left; 
}

.col6 {
	width: 60%; display:inline-block; vertical-align: text-top;
}

.col-container p {
	text-align:justify;
	margin:0 30px 20px 0;
}

.col33 img {
	width:100%;
}
.col3 img {
	width:90%;
}


.col100 {
	width: 100%;

}


/*======= Privacy Policy ======*/
	.privacyPolicyContent {
		margin-bottom: 50px;
	}
	.privacyPolicyContent h1 {
		margin-bottom: 10px;
		color: #333333;
	}
	.privacyPolicyContent ul {
		list-style: disc;
		padding-left: 25px;
		margin-top: 10px;
	}
	.privacyPolicyContent ul li {
		margin-bottom: 10px;
	}
	.privacyPolicyContent h2, .privacyPolicyContent h3 {
		margin-top: 20px;
	}

/*======= Home page updates =======*/
	h2.homepageSectionTitle {
		border-bottom: 1px solid #000;
		margin: 15px 0 35px;
		margin-left: 28px;
		padding-bottom: 4px;
	}
	img.hasLearningWithPic {
		display: block;
		width: 130px;
		margin: 20px auto 0;
	}
	.homeLayout {
		display: grid;
		grid-template-columns: 7fr 3fr;
		grid-gap: 30px;
	}
	.homeLayout .col33 {
		width: 49%;
	}
	.homeLayout #nav-sidebar-wrapper {
		width: unset !important;
	}
	#bottomContent.homeLayout {
		overflow: unset;
	}
	/*-------------*/
	.lookInsideTrigger {
		color: #DD4B33;
		font-weight: 600;
		display: inline-block;
		margin-bottom: 15px;
		margin-left: 27px;
		position: relative;
		text-transform: uppercase;
	}
	.lookInsideTrigger img {
		width: 25px;
		transform: rotate(90deg);
		/*margin-left: -10px;*/
		position: absolute;
		top: -10px;
		right: -15px;
	}
	#book-body .lookInsideTrigger {
		margin-left: 0;
		margin-bottom: 0;
		font-size: 18px;
	}
	#book-body .bookBodylightBox {
		margin-top: 15px;
	}
	.relativeSlider {
		display: none;
	}
	/*------------*/
	.lb-data .lb-number {
		color: #fff !important;
	  font-weight: bold;
	  letter-spacing: 1px;
	  font-size: 14px !important;
	}

/*======= New book page =======*/
	.retailBockWrapper {
		margin-bottom: 30px;
		margin-top: 30px;
	}
	.retailBockWrapper .retailBockInner {
		display: grid;
		grid-template-columns: 1fr;
		grid-gap: 30px;
	}
	@media screen and (min-width: 1050px) {
		body.lwpb .retailBockWrapper .retailBockInner {
			grid-template-columns: 1.5fr 8fr;
		}
	}
	.retailBockInner .discount {
		padding: 15px;
		border: 1px solid #F03E00;
		margin-bottom: 5px;
	}
	.retailBockInner .discount * {
		display: block;
		margin-bottom: 7px;
	}
	.retailBockInner .discount b {
		font-weight: bold;
	}
	/*--------------*/
	.retailTop > p {
		text-transform: uppercase;
		font-size: 15px;
		margin-bottom: 7px;
	}
	.retailTopInfo {
		display: flex;
	}
	.retailTopInfo span {
		margin-right: 30px;
	}
	.retailTopInfo .bookName {
		color: #F03E00;
	}
	.retailCalc	{
		margin: 15px 0;
		display: grid;
		grid-template-columns: repeat(6, auto);
		border: 1px solid #F03E00;
	}
	.retailCalc	div {
		border-right: 1px solid #F03E00;
		padding: 8px;
		display: flex;
		align-items: center;
	}
	.retailCalc div:last-child {
		border-right: none;
	}
	.retailCalc	input {
		border: none;
		width: 45px;
		height: 16px;
		font-size: 16px;
		outline: none;
	}
	.retailCalc	.orangeText {
		color: #F03E00;
		text-transform: uppercase;
		margin-right: 8px;
	}
	.retailCalc	.greyText {
		color: #aaa;
	}
	/*---------------*/
	.retailBockWrapper .orderSection {
		text-align: left;
		margin: 30px 0;
	}
	.retailBockWrapper .orderSection > * {
		display: inline-block;
	}
	.retailBockWrapper .orderSection > p {
		margin-right: 30px;
	}
	.retailBockWrapper .orderButtons {
		margin: 10px 0 30px;
	}
	.retailBockWrapper .orderButtons a {
		padding: 10px 20px;
		border-radius: 25px;
		display: inline-block;
		text-transform: uppercase;
		font-weight: bold;
		font-size: 14px;
		letter-spacing: 1px;
		line-height: 1em;
	}
	.retailBockWrapper .orderButtons a.order {
		background-color: #F03E00;
		color: #fff;
		margin-right: 20px;
	}
	.retailBockWrapper .orderButtons a.order:hover {
		transition: all .3s;
		background-color: #C63908;
	}
	.retailBockWrapper .orderButtons a.lessonPlans {
		border: 1px solid #F03E00;
		color: #F03E00;
	}
	/*=================*/
	.moreBookInfo {
		border-top: 2px solid #F13F01;
		margin-bottom: 50px;
		text-align: center;
		padding: 10px 0 0;
	}
	.moreBookInfo p {
		font-size: 19px;
	}
	.moreBookInfo b {
		color: #F13F01;
		font-weight: bold;
	}

/*======= learn With Picture Page =======*/
	.learnWithPictureWrapper {
		text-align: center;
	}
	.learnWithPictureWrapper * {
		font-family: 'Roboto', sans-serif;
	}
	.learnWithPictureWrapper b {
		font-weight: bold;
	}
	.learnWithPictureWrapper em {
		font-style: italic;
	}
	.learnWithPictureWrapper > img {
		width: 40%;
		margin-bottom: 30px;
	}
	.learnWithPictureWrapper img.childrens {
		width: 100%;
		margin-bottom: 20px;
	}
	.orangeText {
		color: #F03E00;
	}
	.learnWithPictureWrapper .InfoBookName {
		font-size: 35px;
	}
	.learnWithPictureWrapper .threeCols {
		width: 80%;
		margin: 50px auto;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-gap: 30px;
		text-align: left;
	}
	.learnWithPictureWrapper .threeCols div:not(:last-child) {
		border-right: 2px solid #FF3500;
	}
	.learnWithPictureWrapper .threeCols h4 {
		font-weight: bold;
		color: #FF3500;
	}
	.learnWithPictureWrapper .threeCols p {
		margin-bottom: 10px;
	}
	.learnWithPictureWrapper .threeCols ul {
		list-style-type: disc;
		padding-left: 25px;
	}
	.learnWithPictureWrapper .threeCols ul li {
		margin-bottom: 10px;
	}
	.learnWithPictureWrapper h3.tbBorder {
		text-align: center;
		margin: 20px auto 40px;
		border-top: 1px solid #FF3500;
		border-bottom: 1px solid #FF3500;
		padding-top: 10px;
		font-weight: bold;
		font-size: 25px;
		width: 60%;
	}
	.learnWithPictureWrapper .oneTwoCols {
		width: 80%;
		margin: 30px auto 50px;
		display: grid;
		grid-template-columns: 3fr 8fr;
		grid-gap: 20px;
	}
	.learnWithPictureWrapper .oneTwoCols .left {
		padding: 10px;
		font-size: 14px;
		border: 1px solid #FF3500;
		height: max-content;
		margin-top: 20px;
	}
	.learnWithPictureWrapper .oneTwoCols .right {
		display: grid;
		grid-template-columns: 2fr 8fr;
		grid-gap: 10px;
		text-align: left;
		align-items: center;
	}
	.learnWithPictureWrapper .oneTwoCols .right img {
		width: 200px;
	}
	.learnWithPictureWrapper .oneTwoCols .right .orangeTb {
		border-top: 1px solid #F03E00;
		margin-top: 15px;
		padding-top: 5px;
		display: inline-block;
	}
	.learnWithPictureWrapper .oneTwoCols .right b {
		display: block;
		line-height: 1.3em;
	}

/*======= Book order form page =======*/
	.bookOrderFormWrapper {
		width: 80%;
		margin: 30px auto;
	}
	.bookOrderFormWrapper > img {
		width: 40%;
		display: block;
		margin: 0 auto 30px;
	}
	.bookOrderFormWrapper h2 {
		text-align: center;
		margin: 20px auto 40px;
		border-top: 1px solid #FF3500;
		border-bottom: 1px solid #FF3500;
		padding-top: 10px;
		font-weight: bold;
		font-size: 25px;
	}
	.bookOrderFormWrapper p {
		margin-bottom: 15px;
	}
	/*---------------*/
	form#bookOrderForm {
		margin: 40px 0;
	}
	form#bookOrderForm * {
		font-family: 'Roboto', sans-serif !important;
	}
	form#bookOrderForm .inputWrapper {
		margin-bottom: 20px;
	}
	form#bookOrderForm .inputWrapper label {
		display: block;
		margin-bottom: 10px;
		cursor: pointer;
	}
	form#bookOrderForm label {
		cursor: pointer;
	}
	form#bookOrderForm .inputWrapper input:not([type=radio]),
	form#bookOrderForm .inputWrapper select {
		display: block;
		width: 100%;
		background-color: unset;
		border: 1px solid #aaa;
		padding: 15px 10px;
		font-size: 17px;
		outline: none;
		box-sizing: border-box;
	}
	form#bookOrderForm .inputWrapper select {
		color: #F33D00;
		cursor: pointer;
		padding-right: 20px;
	}
	form#bookOrderForm .inputWrapper select#oBook {
		background: url(../images/select-arrow.png) no-repeat;
		background-position: 99% 50%;
		background-size: 15px;
		-webkit-appearance: none;
		-moz-appearance: none;
		text-indent: 1px;
		text-overflow: '';
	}
	form#bookOrderForm .retailBockWrapper .retailBockInner {
		grid-template-columns: 1fr;
	}
	form#bookOrderForm .retailCalc, form#bookOrderForm .retailCalc div {
		border-color: #aaa;
		margin-bottom: 0;
	}
	form#bookOrderForm h3 {
		text-transform: uppercase;
		margin-bottom: 15px;
	}
	/*-------------*/
	form#bookOrderForm .oneTWoCols {
		display: grid;
		grid-template-columns: 3fr 7fr;
		grid-gap: 20px;
	}
	form#bookOrderForm .threeCols {
		display: grid;
		grid-template-columns: 5fr 2.5fr 2.5fr;
		grid-gap: 20px;
	}
	form#bookOrderForm .twoCols {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-gap: 20px;
	}
	form#bookOrderForm .billingInfo {
		margin-bottom: 50px;
	}
	form#bookOrderForm .billingInfo input[type=number]::-webkit-outer-spin-button,
   form#bookOrderForm .billingInfo input[type=number]::-webkit-inner-spin-button {
      -webkit-appearance: none;
   }
   form#bookOrderForm .billingInfo input[type=number] {
      -moz-appearance: textfield;
   }
	form#bookOrderForm .shippingInfo {
		margin-top: 30px;
		display: none;
	}
	/*------------------*/
	form#bookOrderForm .paymentMethod {
		margin-bottom: 50px;
	}
	form#bookOrderForm .sPaymentMethod {
		width: 100%;
		margin-bottom: 20px;
		display: flex;
		align-items: center;
	}
	form#bookOrderForm .paymentMethod label {
		display: inline-block;
		margin-right: 10px;
		text-transform: uppercase;
		font-size: 18px;
		margin-bottom: 0;
		min-width: max-content;
	}
	form#bookOrderForm .paymentMethod input {
		margin: 0;
		margin-right: 7px;
	}
	form#bookOrderForm .paymentMethod .twoCols span {
		display: inline-block;
		margin-top: 5px;
	}
	form#bookOrderForm h3 span {
		margin-right: 10px;
	}
	form#bookOrderForm .inputWrapper input[type=submit],
	form#bookOrderForm .inputWrapper button[type=submit] {
		width: auto;
		display: inline-block;
		cursor: pointer;
		background-color: #FF3500;
		color: #fff;
		border: none;
		border-radius: 25px;
		padding: 10px 35px;
		text-transform: uppercase;
		font-weight: bold;
		letter-spacing: 1px;
		font-size: 16px;
	}
	@keyframes spin {
		100% {
			transform: rotate(360deg);
		}
	}
	form#bookOrderForm .inputWrapper button img {
		width: 18px;
		vertical-align: top;
		animation: spin 1s infinite;
		animation-timing-function: linear;
		animation-fill-mode: forwards;
		border-radius: 50%;
		display: none;
	}
	form#bookOrderForm .inputWrapper input[type=submit]:hover,
	form#bookOrderForm .inputWrapper button[type=submit]:hover {
		transition: all .3s;
		background-color: #CF3209;
	}
	form#bookOrderForm .inputWrapper.submitForm em {
		margin-top: 15px;
		display: block;
		font-style: italic;
	}
	form#bookOrderForm .inputWrapper.submitForm .result {
		margin-top: 15px;
		display: block;
		font-size: 17px;
		color: green;
		font-weight: bold;
		display: none;
	}
	form#bookOrderForm .inputWrapper.submitForm .result span.success {
		color: green;
	}
	form#bookOrderForm .inputWrapper.submitForm .result span.failed {
		color: #FF3500;
	}
	/*-----------*/
	form#bookOrderForm .g-recaptcha {
		margin-bottom: 15px;
	}
	.recaptchaError {
		color: red;
		margin-bottom: 15px;
		display: none;
	}


/* Global Footer */

footer {
	clear: both;
	width: 100%;
	background-color: #818181;
	color:#ffffff;
}

footer p {
	clear: both;
	background-color: #818181;
	color:#ffffff;
	font-family: 'Roboto', sans-serif;
	font-size: .8em;
	padding: 20px 0 20px 30px;
}

footer #footerbar {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
footer #footerbar p.footerNav {
	text-align: right;
	padding-right: 30px;
}
footer #footerbar a {
	color: #fff;
}

/* Media Queries Tablet */

@media (max-width: 1040px) {
	
	#content {
		min-height: 0px;
		margin-bottom:20px;
	}
	#content-container {
		width:100%;
	}
	#mainwrapper {
		width: 97%;
		margin: 0 auto;
	}
		
	#mainwrapper header #logo {
		width: 70%;
		float: left;
		font-size:450%;
		font-family: 'Roboto', sans-serif;
		font-weight: 700;
		color: #cccccc;
	}

	#mainwrapper header #social {
		width: 30%;
		float: right;
		text-align: right;
	}

	#book-title {
	padding: 20px;
	}

	#book-title h1 {
		font-size:175%;
	}

	#book-title h2 {
		font-size:135%;
	}

	#book-title h4 {
		font-size:90%;
	}


	#book-title sup {
		font-size: .75em;
	}

	#book-title h3 {
		font-size:.85em;
	}
		
	#book-body {
		padding: 0 30px 20px 30px;
	}

	#book-body h2 {
		font-size:1.5em;
		padding-bottom:15px;
	}

	#nav-sidebar h2 {
		font-size: 1em;

	}

	#nav-sidebar ul li {
		font-size:1em;
	}
		
	.col5 {
		width: 100%; 
	}
		
	.col-container p {
		text-align:left;
		margin:0;
	}

	/*======== Learn with picture page =========*/
	.retailBockWrapper .retailBockInner {
		grid-template-columns: 1fr;
	}
	.learnWithPictureWrapper .threeCols {
		width: 95%;
	}
	.learnWithPictureWrapper .oneTwoCols {
		width: 95%;
	}
	.retailBockWrapper .retailBockInner .discount {
		width: 200px;
  		margin: 0 auto;
  		text-align: center;
	}
	body.lwpb .retailBockWrapper .orderSection {
		text-align: center;
		margin-top: 0;
	}
	.retailCalc {
		grid-template-columns: repeat(3, 1fr);
	}
	.retailCalc div {
		border-right: 1px solid #F03E00;
	}
	.retailCalc div:nth-child(3) {
		border-right: none;
	}
	.retailCalc div:nth-child(1),.retailCalc div:nth-child(2),.retailCalc div:nth-child(3) {
		border-bottom: 1px solid #F03E00;
	}

	/*======= book order order form page ======*/
	.bookOrderFormWrapper {
		width: 90%;
	}

	/*----- Regular book page -----*/
	.learningWithPicture .buttons, .regularBookOrderSec .buttons {
		margin-bottom: 0;
	}
	.learningWithPicture .buttons a.order, .regularBookOrderSec .buttons a.order {
		margin-bottom: 15px;
	}
	.learningWithPicture .discount {
		width: 50%;
	}
	.comingSoonPromo {
		padding: 30px 20px;
	}
	.comingSoonPromo p {
		font-size: 17px;
	}
	#bannerImage img {
		height: 100%;
	}
}

@media (max-width: 480px) {
	
#content {
	min-height: 0px;
	margin-bottom:20px;
}

#mainwrapper header {
	padding:20px 0 10px 0;
	position: relative;
}
	
#mainwrapper header #logo {
	width: 100%;
	font-size:300%;
text-align: center;
}

#mainwrapper header #logo2 img {
width: 220px;
}
	
#mainwrapper header .company-name {
	width: 130px;
	text-align: right;
	float: right;
	font-family: 'Roboto', sans-serif;
	color: #666666;
	font-size: 12px;
	letter-spacing: .2em;
	padding: 15px 0 0 0;
}
	
#mainwrapper header .contact {
	clear:both;
	width: 100%;
	float: none;
	text-align: center;
	padding: 15px 0 0 0;
	overflow: hidden;
}
	#mainwrapper header .contact > div {
		overflow: hidden;
		text-align: center;
	}
	#mainwrapper header .contact > div .share-link {
		float: unset;
		display: inline-block;
	}
	#mainwrapper header #logo2 {
		width: 100%;
	}
	.mobileOnly {
		display: block !important;
	}
	#mainwrapper header #logo2 .triggerNav {
		display: inline-block !important;
		float: right;
	}
	#mainwrapper header #logo2 .triggerNav button {
		background-color: unset;
		border: none;
		cursor: pointer;
	}
	#mainwrapper header #logo2 .triggerNav button img {
		width: 30px;
	}
	#mainwrapper header {
		overflow: visible;
	}
	nav {
		float: unset;
		position: absolute;
		top: 55px;
		background-color: #fff;
		z-index: 1000;
		display: none;
	}
	nav ul {
		border-top: 1px solid #999999;
	}
	nav ul li {
		display: block;
		border-bottom: 1px solid #999999;
	}
	.share-link {
		width: 30px;
		height: 30px;
		background-repeat: no-repeat;
  		background-size: cover;
	}
	nav > ul > li > div,
	nav > ul > li:hover > div {
		display: none;
		position: unset;
		visibility: visible;
		opacity: 1;
		border: none;
		border-top: 1px solid #cccccc;
		padding-bottom: 0;
	}
	nav ul ul {
		border-top: none;
	}
	nav ul ul li {
		border-bottom: none;
	}
	nav ul ul li:last-child a {
		border-bottom: none;
	}
	
#mainwrapper header #social {
	width: 100%;
}

.share-link {float: right;margin:5px;}
	
#book-title h1 {
	font-size:2.5em;
	text-align: center;
}

#book-title h2 {
	font-size:1.3em;
	text-align: center;
}

#book-title h4 {
	font-size: 1em;
	text-align: center;
}

#book-title h3 {
	font-size:1em;
}	

#book-sidebar {
        float: none;
        width:100%;
		text-align: center;
    }

#bannerImage {
    float: none;
    width: 100%;
    }
	
#book-nav-wrapper {
    float:none;
    width:100%;
    }
	
#nav-sidebar {
	padding: 0 20px;
	float:none;
	width:100%;
	box-sizing: border-box;
}
.book-nav-inner p {
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	padding: 0 20px;
	margin-left: 0;
}
.book-nav-wrapper .customShopLinks {
	text-align: center;
}
#book-body-wrapper {
	width:100%;
	float:none;
	margin-bottom: 20px;
}

#book-body {
	padding: 0 20px 20px 20px;
}

#book-body h2 {

padding-bottom:10px;
}

	#book-body p {
	text-align: left;
	}
#nav-sidebar-wrapper {
	width:100%;
	float:none;
	text-align: center;
}
	
	.book-nav-wrapper {
	width:100%;
	float:none;
	margin:10px 0 20px 0;
	}
.col-container {
	padding: 0 20px 20px 20px;
}
	
.col3 {
	width: 100%; 
}

.col33 {
	width: 100%; padding:0 0 40px 0;
}

.col5 {
	width: 100%;
}

.col6 {
	width: 100%;
}

.col-container p {
	text-align:left;

}
	.col3 img {
	width:100%;
		margin-bottom:20px;
}
	
.hp-border {
	border:none; 
}
}

/*============ Custom media query ============*/
@media screen and (max-width: 480px) {
	#nav-sidebar-wrapper #nav-sidebar ul {
		padding-left: 10px;
		text-align: left;
	}
	/*======= Learn with pictures section ========*/
	.learningWithPicture:not(#book-body .learningWithPicture),
	.moreBookInfo:not(#book-body .moreBookInfo) {
		display: none;
	}
	.learningWithPicture .learningWithPictureInner {
		width: 90%;
	}
	#book-body .learningWithPicture .learningWithPictureInner {
		width: 100%;
	}
	#book-body .learningWithPicture .learningWithPictureInner > p {
		font-weight: bold;
	}
	.learningWithPicture p {
		font-size: 16px;
	}
	.learningWithPicture .discount {
		width: 90%;
	}
	.learningWithPicture .buttons a.order,
	.regularBookOrderSec .buttons a.order {
		margin-right: 0;
		margin-bottom: 25px;
	}
	#book-body .moreBookInfo p {
		text-align: center;
	}

	/*======= Home page updates =======*/
	#nav-sidebar-wrapper .promoBlock {
		width: 90%;
		margin: 0 auto 30px;
		box-sizing: border-box;
	}
	h2.homepageSectionTitle {
		width: 85%;
	}
	.homeLayout {
		grid-template-columns: 1fr;
	}
	.homeLayout .col33 {
		width: 100%;
	}
	.lookInsideTrigger {
		font-size: 18px;
	}

	/*========= Retail block ========*/
	.retailBockWrapper .retailBockInner {
		grid-template-columns: 1fr;
		width: 90%;
		margin: 0 auto;
	}
	.retailBockInner .discount {
		text-align: center;
	}
	.retailTopInfo {
		display: block;
	}
	.retailTopInfo span {
		display: block;
		margin-right: 0;
		margin-bottom: 10px;
	}
	.retailCalc {
		grid-template-columns: 1fr;
	}
	.retailCalc div {
		border-right: none;
		border-bottom: 1px solid #F03E00;
		padding: 13px;
	}
	.retailCalc div:last-child {
		border-bottom: none;
	}
	.retailBockWrapper .orderSection > p {
		margin-right: 0;
	}
	.retailBockWrapper .orderButtons a.order {
		margin-right: 0;
		margin-bottom: 25px;
	}
	.retailBockWrapper .orderSection {
		text-align: center;
	}
	body.ranaEclipso .comingSoonPromo {
		padding-top: 20px;
	}

	/*================*/
	.moreBookInfo {
		padding: 20px 20px 0;
		margin-bottom: 25px;
	}

	/*======= Learn with picture page ======*/
	.learnWithPictureWrapper .InfoBookName {
		font-size: 23px;
	}
	.learnWithPictureWrapper .threeCols {
		grid-template-columns: 1fr;
	}
	.learnWithPictureWrapper .threeCols div:not(:last-child) {
		border-right: none;
	}
	.learnWithPictureWrapper h3.tbBorder {
		width: 90%;
		font-size: 20px;
	}
	.learnWithPictureWrapper .oneTwoCols {
		grid-template-columns: 1fr;
	}
	.learnWithPictureWrapper .oneTwoCols .right {
		grid-template-columns: 1fr;
	}
	.learnWithPictureWrapper .oneTwoCols .right > div:first-child {
		text-align: center;
	}

	/*====== Book order form page ======*/
	.bookOrderFormWrapper .retailBockWrapper .retailBockInner {
		width: 100%;
	}
	form#bookOrderForm .inputWrapper input:not([type="radio"]),
	form#bookOrderForm .inputWrapper select {
		font-size: 16px;
	}
	form#bookOrderForm .oneTWoCols,
	form#bookOrderForm .threeCols,
	form#bookOrderForm .twoCols {
		grid-template-columns: 1fr;
	}
	form#bookOrderForm .fieldInfo {
		font-size: 15px;
	}
	form#bookOrderForm h3 span:first-child {
		margin-top: 20px;
	}
	form#bookOrderForm h3 span {
		display: block;
		margin: 10px 0;
	}

	/*====== Footer ======*/
	footer #footerbar {
		grid-template-columns: 1fr;
	}
	footer #footerbar p.footerNav, footer p {
		text-align: center;
		padding: 20px 0;
	}
	footer #footerbar p.footerNav {
		padding-top: 0;
	}

	/*----- Regular book page -----*/
	.regularBookOrderSec {
		text-align: center;
	}
	.regularBookOrderSec .discount {
		padding: 20px;
		margin-top: 25px;
	}
	.regularBookOrderSec .discount span {
		display: block;
		margin-bottom: 6px;
	}
}

@media screen and (min-width: 480px) {
	body.homePage #nav-sidebar-wrapper {
		position: sticky;
		top: 20px;
	}
	body.aboutPage .col6 {
	  width: 68%;
	}
}

@media screen and (max-width: 768px) {
	.comingSoonPromo {
		padding: 22px;
	}
	.comingSoonPromo p {
		font-size: 17px;
	}
}