@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
/*BODY AND MAIN STYLES */
/* Mobile Layout: 480px and below. All others inherit unless overridden */ 
body {
    margin-top: 0;
    background-image: url(/images/small-bg.jpg);
	background-color: #cccccc;
	background-position: top center;
	background-repeat: no-repeat;
    background-size: cover;
    font-size: 0.875em;
    line-height: 1.4;
    color: #333333;
	font-family: 'Roboto Condensed', sans-serif;
	background-attachment: fixed;
}
@media only screen and (min-width: 481px) {
	body {
		background-image: url(/images/medium-bg.jpg);
		font-size: 1.0625em;
		line-height: 1.4;
	}
}
@media only screen and (min-width: 767px) {
	body {
		background-image: url(/images/large-bg.jpg);
		background-color: #989898;
		background-position: center;
		font-size: 1.0625em;
		line-height: 1.4;
	}
}
.topBar {
	background: #000;
	display: block;
	padding: 10px 0;
	color: #fff;
	font-weight: 400;
}
@media only screen and (min-width: 625px) {
	.topBar {
		padding: 5px 10px;
	}
}
/* Mobile Layout: 480px and below. All others inherit unless overridden */ 
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 94%;
	padding-left: 2%;
	padding-right: 2%;
	clear: none;
	float: none;
}
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 481px) {
	.gridContainer {
		width: 90.675%;
		padding-left: 1.1625%;
		padding-right: 1.1625%;
		clear: none;
		float: none;
		margin-left: auto;
	}
}
/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 769px) {
	.gridContainer {
		width: 88.5%;
		max-width: 1232px;
		padding-left: 0.75%;
		padding-right: 0.75%;
		margin: auto;
		clear: none;
		float: none;
		margin-left: auto;
	}
}
/* Mobile Layout: 480px and below. All others inherit unless overridden */ 
.small-header {
    display: block;
}
.small-header p {
    margin: 0;
}
@media only screen and (min-width: 481px) {
	.small-header {
		display: none;
	}
}
.medium-header {
    display: none;
}
@media only screen and (min-width: 481px) {
	.medium-header {
		display: block;
	}
	.medium-header p {
		margin: 0;
	}
}
@media only screen and (min-width: 897px) {
	.medium-header {
		display: none;
	}
}
.large-header {
    display: none;
}
@media only screen and (min-width: 897px) {
	.large-header {
		display: block;
	}
	.large-header p {
		margin: 0;
	}
}
@media only screen and (min-width: 1042px) {
	.large-header {

	}
}
@media only screen and (min-width: 1350px) {
	.large-header {

	}
}
@media only screen and (min-width: 1650px) {
.large-header {

}
}
/*MOBILE MENU */
.js #menu, #menu { /*don't display the menu that builds the mobile menu ever */
		display:none;
	}
.slicknav_menu {
	display:none;
}
.slicknav_menu {
    font-size: 1em;
    background: #000;
    padding: 5px;
}
.slicknav_nav {
    clear: both;
    color: #fff;
    margin: 0;
    font-size: 1.25em;
}
.slicknav_btn {
	background-color: #718dc0;
}
.slicknav_nav a:hover{
	background: #718dc0;
}
.slicknav_nav a:visited{
	color: #FFF;
}
.slicknav_nav .slicknav_item:hover {
	background: #718dc0;
}
.slicknav_menu .slicknav_menutxt {
    text-shadow: none;
}
.slicknav_menu .slicknav_icon-bar {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
@media screen and (max-width: 896px) { /*display the mobile menu now up to 897px */	
	.js .slicknav_menu {
		display:block;
	}
}
/*END OF MOBILE MENU */
/*START OF MAIN MENU */
.mainmenu {
	display:none;
}
.anylinkcss {
	display:none;
}
@media only screen and (min-width: 897px) {
	.mainmenu {
		display: block;
		width: 100%;
		background-color: #000;
		padding: 0;
		color: #fff;
	}
	.anylinkcss {
		display:block;
	}
	.mainlinks {
		margin: 0;
	}
}
.mainlink {
	padding: 5px 8px;
	font-size: 1.15em;
	color: #fff;
	float: left;
	text-transform: uppercase;
}
.menudivider {
	float:left;
	padding-top: 2px;
}
@media only screen and (min-width: 1040px) {
	.mainlink {
		font-size: 1em;
	}
}
.mainlink a {
	color: #fff;
	text-decoration: none;
}
.mainlink a:hover {
	color: #fff;
	background: none;
}
.mainlink a:visited {
	color: #fff;
}
.mainlink:hover {
	color: #fff;
	background-color: #718dc0;
}
/* Mobile Layout: 480px and below. All others inherit unless overridden */ 
.main-content-top {
    padding: 1% 5% .75% 5%;
    background: #d9e0ed;
    border-top: none;
}
.main-content {
    padding: 1% 5%;
    background: rgba(217, 224, 237, 0.70);
    border-top: none;
}
.social {
	float: right;
	padding: 5px 10px;
}
.social a {
	padding: 0 5px;
}
.socialmobile {
	display: block;
	float: none;
	width: 100px;
	padding: 5px 10px;
	margin: 0 auto;
}
.socialmobile a {
	padding: 0 5px;
}
@media only screen and (min-width: 897px) {
	.socialmobile {
		display: none;
	}		
}
@media only screen and (min-width: 481px) {
	.main-content {
		padding: 1% 5%;
	}
}
@media only screen and (min-width: 897px) {
	.main-content {
		padding: 2.5% 5%;
	}
}
.highlight-content {
    padding: 1% 5%;
    background-color: #d8d4d4;
}
@media only screen and (min-width: 481px) {
	.highlight-content {
		padding: 1% 5%;
	}
}
@media only screen and (min-width: 897px) {
	.highlight-content {
		margin-top: 0px;
	}
}
.main-footer {
    padding: 1% 5%;
    background-color: #000;
	font-size: 70%;
	color: #fff;
	line-height: 145%;
	text-transform: uppercase;
}
/*END OF MAIN LAYOUT AND GENERAL STYLES */
img, object, embed, video {
	max-width: 100%;
}
/* Videos */
.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	margin-bottom: 25px;
}
@media only screen and (min-width: 1024px) {
	.video-container {
		margin-bottom: 50px
	}	
}
.video-container-home {
	position:relative;
	padding-bottom:60.25%;
	height:0;
	overflow:hidden;
	margin-bottom: 25px;
}
.video-container iframe, .video-container object, .video-container embed, .video-container-home iframe, .video-container-home object, .video-container-home embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.iframe-container {
	position:relative;
	padding-bottom:200%;
	padding-top:30px;
	height:0;
	overflow:hidden;
}
.iframe-container iframe, .iframe-container object, .iframe-container embed {
	position:absolute;
	top:0;
	left:0;
	width:105%;
	height:100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}
.clearDiv {
	clear:both;
}
/*START OF CUSTOMIZATIONS */
/* Mobile Layout: 480px and below. All others inherit unless overridden */ 
h1, h2, h3, h4, h5, h6 {
    -webkit-margin-before: 0.67em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
	font-family: 'Philosopher', sans-serif;
    font-weight: bold;
}
h1 {
	font-size: 1.25em;
	color: #000;
}
h2 {
	font-size: 1.25em;
	color: #9B4333;
}
h3 {
     font-size: 1.2em;
     color: #2B3D63;
}
h4 {
	font-size: 1.2em;
	color: #000;
}
h5 {
    font-size: 1.1em;
    color : #9B4333;
}
h6 {
    font-size: 1.1em;
    color : #2B3D63;
}
@media only screen and (min-width: 897px) {
	h1 {
		font-size: 1.5em;
	}
	h2 {
		font-size: 1.4em;
	}
	h3 {
		 font-size: 1.3em;
	}
	h4 {
		font-size: 1.2em;
	}
}
a  
{
  color : #3333ff;
}

a:visited
{
  color : #336699;
}

a:hover  
{
  color : #6633cc;
}
a.copyright {
	color:#fff;
}
a.copyright:visited {
	color:#fff;
}
a.copyright:hover {
	color:#a1bbef;
}
.largecolor1 {
	font-size: 1.5em;
	color: #000;
}
.xlargecolor1 {
	font-size: 2em;
	color: #000;
}
.smallcolor1 {
	font : .95em "Calibri", sans-serif;
	color: #000;
}
@media only screen and (min-width: 897px) {
	.smallcolor1 {
		font : 1.125em "Calibri", sans-serif;
	}
}
.color1 {
	color: #000;
}
.col2thirdleft {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 897px) {
	.col2thirdleft {
		float: left;
		width: 60%;	
	}
}
.col1thirdright {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 897px) {
	.col1thirdright {
		float: right;
		width: 30%;	
	}
}
.col2thirdright {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 897px) {
	.col2thirdright {
		float: right;
		width: 65%;	
	}
}
.col1thirdleft {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 1024px) {
	.col1thirdleft {
		float: left;
		width: 30%;	
	}
}
.col1third {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: 10px auto 30px auto;
}
@media only screen and (min-width: 1024px) {
	.col1third {
		float: left;
		width: 31%;
		padding: 0 1.1666666666666667%;
	}	
}
.col1half {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 897px) {
	.col1half {
		float: left;
		width: 45%;
		padding: 0 2.5%;
	}
}
.col1halfright {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 897px) {
	.col1halfright {
		float: right;
		width: 45%;
		padding: 0 2.5% 0 0;
	}
}
.col1halfleft {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 655px) {
	.col1halfleft {
		float: left;
		width: 45%;
		padding: 0 2.5% 0 0;
	}
}
.col1fourth {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: 10px auto 30px auto;
}
@media only screen and (min-width: 941px) {
	.col1fourth {
		float: left;
		width: 22%;
		padding: 0 1.5%;
	}	
}
/*Contact Form */
.emailFormError {
	margin:0px; 
	color:#FF0000
}
.inputButton {}
.inputText {
	width:95%; 
}
.inputValue {
	width:95%;
}
@media only screen and (min-width: 625px) {
	.inputText {
		width:85%; 
	}
	.inputValue {
		width:85%;
	}
}
/*EXTRAS */
/*a colored box without rounded corners */
.colorBox {
	background: rgba(217, 224, 237, 0.35);
	padding: 10px;
}
.newsBox {
	background: rgba(255, 255, 255, 0.45);
	padding: 10px;
}
.newsBox li {
	margin-bottom: 15px;
}
/*Highlight Box with rounded corners centered */
.colorBoxRound {
    width: 90%;
	padding: 15px;
    background-color: #bebcbc;
	margin: 50px auto;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
@media only screen and (min-width: 625px) {
	.colorBoxRound{
		padding: 25px 15px 25px 45px;
	}
	.colorBox {
		padding: 25px 45px;
	}
	.newsBox {
		width: 88%;
		margin: 20px auto;
		padding: 25px 45px;
	}
}
/*padding on images - sub for hspace, vspace or both */
.imgHPad {
	border: none;
	padding: 0 10px;
}
.imgVPad {
	border: none;
	padding: 10px 0;
}
.imgBPad {
	border: none;
	padding: 10px;
}
.imgRight {
	float: right;
	margin: 0 auto;
}
/*Buttons*/
button {
  display: inline-block;
  margin: 0 5px;
  padding: 5px 15px;
  font-size: 1.125em;
  line-height: 1.8;
  vertical-align: bottom;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
button:focus {
  outline: none
}
.flatbutton {
  color: #fff;
  background-color: #2B3D63;
  border: solid 2px #fff;
}
.orangebutton {
  color: #fff;
  background-color: #9B4333;
}
.flatbutton:hover,
.flatbutton.hover {
  background-color: #000;
}
.flatbutton:active,
.flatbutton.active {
  background-color: #B54C1F;
}
/*Form Elements */
input[type="text"] {
	width: 90%;
}
@media only screen and (min-width: 487px) {
	input[type="text"] {
		width: 75%;
	}
}
input[type="submit"] {
    background: #8c9abd;
    padding: 3px 10px;
    border: 1px solid #fff;
    color: #fff;
    font-weight: normal;
}
input[type="submit"]:hover {
    background: #2B3D63;
}
/* Bio page */
.bioPic {
    max-width: 230px;
    float: none;
    background: #fff;
    padding: 10px;
    -moz-box-shadow: 0 0 15px #ccc;
    -webkit-box-shadow: 0 0 15px #ccc;
    box-shadow: 0 0 15px #ccc;
    margin: 0 auto 20px auto;
}
@media only screen and (min-width: 1020px) {
	.bioPic {
		margin: 10px auto 25px auto;
	}
}
/*Appearances */
.facebookContainer {
	width: 225px; 
	margin: 25px auto;	
}
@media only screen and (min-width: 382px) {
	.facebookContainer {
		width: 275px; 	
	}	
}
@media only screen and (min-width: 487px) {
	.facebookContainer {
		width: 300px; 	
	}	
}
@media only screen and (min-width: 897px) {
	.facebookContainer {
		width: 250px; 	
	}	
}
@media only screen and (min-width: 1024px) {
	.facebookContainer {
		width: 275px; 	
	}	
}
@media only screen and (min-width: 1200px) {
	.facebookContainer {
		width: 300px; 	
	}	
}
/*FAQ Pages */
.faqbutton {
  width: 100%;
  color: #fff;
  background-color: #677ca7;
  border: solid 2px #fff;
  text-align: left;
  margin: 15px 0 0 0;
  line-height: 1.4;
}
.faqbutton:hover,
.faqbutton.hover {
  background-color: #000;
}
.faqbutton:active,
.faqbutton.active {
  background-color: #B54C1F;
}
.readAnswer {
	padding: 15px;
	background: rgba(217, 224, 237, 0.35);
    display: none;
}
.toggle {
	float: right; 
	font-size: 65%; 
	padding-top: 5px;
	color: #C3C8D5;	
}
@media only screen and (min-width: 625px) {
	.readAnswer {
		padding: 25px 45px;
	}
}
.firstAnswer {
	display: block;
}
/*Book Pages*/
.bookCover {
    float: none;
    background: #fff;
    padding: 8px;
    -webkit-box-shadow: 0 0 10px #b5b4b4;
    -moz-box-shadow: 0 0 10px #b5b4b4;
	box-shadow: 0 0 10px #b5b4b4;
    margin: 0 auto 20px auto;
}
.onefourth {
	width: 200px;
}
.onethird {
	width: 200px;
}
@media only screen and (min-width: 1140px) {
	.onethird {
		width: 250px;
	}	
}
.bookTitle {
	text-align: center;
}
@media only screen and (min-width: 897px) {
	.bookTitle {
		text-align: left;
	}
}
.buyBooks {
	padding: 15px;
	background: #fff;
}
@media only screen and (min-width: 897px) {
	.buyBooks {
		padding: 15px 25px;
	}	
}
.buyBooks img {
	padding: 5px;
}
@media only screen and (min-width: 897px) {
	.buyBooks img {
		padding: 10px;
	}
}
.reviews {
	padding: 15px;
}
.reviewcredit {
	font-style: italic;
	margin: 0 15px 25px 15px;
	padding-bottom: 10px;
	border-bottom: 3px solid #8C9ABD;
}
.reviewcredit::before { 
	font-size: 24px;
    content: "~ ";
}
@media only screen and (min-width: 897px) {
	.reviews {
		padding: 25px;
	}	
	.reviewcredit {
		margin: 0 25px 40px 25px;
		border-bottom: 5px solid #8C9ABD;
	}	
}
.stars {
	font-weight: bold;
	color: #b22a26;
	font-style: normal;
	padding-left: 15px;
}
/*styles for Accordian Tabs*/
.r-tabs {
	position: relative;
}
.r-tabs .r-tabs-nav {
	border-bottom: 1px solid #fff;
}
.r-tabs .r-tabs-nav .r-tabs-tab {
	position: relative;
	top: 1px;
}
.r-tabs .r-tabs-nav .r-tabs-anchor {
	background: #8c9abd;
	margin-bottom: 3px;
	padding: 10px 12px;
	display: inline-block;
	text-decoration: none;
	color: #fff;
}
.r-tabs .r-tabs-nav .r-tabs-anchor:hover {
	background: #000;
}
.r-tabs .r-tabs-nav .r-tabs-state-active {
	float: right;
	background-color: #2B3D63;
	margin-bottom: -1px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	font-weight: bold;
}
.r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
	color: #fff;
	background-color: #2B3D63;
}
.r-tabs .r-tabs-panel {
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #fff;
	margin-bottom: 3px;
}
.r-tabs .r-tabs-accordion-title .r-tabs-anchor {
	display: block;
	padding: 10px;
	background-color: #8c9abd;
	color: #fff;
	text-decoration: none;
	margin-bottom: 3px;
}
.r-tabs .r-tabs-accordion-title.r-tabs-state-active .r-tabs-anchor {
	background-color: #2B3D63;
	color: #fff;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	margin-bottom: 0;
}
.r-tabs .r-tabs-accordion-title .r-tabs-anchor:hover {
	background: #000;
}
/* Quiz pages */
.quizbutton {
  float: none;
  width: 200px;
  color: #fff;
  background-color: #2B3D63;
  border: solid 2px #fff;
  padding: 5px;
  margin: 10px auto;
  text-align: center;
}
.quizbutton:hover,
.quizbutton.hover {
  background-color: #000;
}
.quizbutton:active,
.quizbutton.active {
  background-color: #B54C1F;
}
.quizbutton a {
	text-decoration: none;
	color: #fff;
}
.quizhero {
	width: 300px;
	float: none;
	margin: 10px auto;
}
/*Game pages*/
.hangman {
	background: #fff; 
	padding: 10px; 
	margin: 0 auto;
}
@media only screen and (min-width: 481px) {	
	.hangman {
		width: 300px; 
		padding: 20px; 
	}
}
#contentLeft {
    float: left;
    margin: 0px;
    width: 50%;
}
@media only screen and (min-width: 897px) {
	#contentLeft {
		float: left;
		margin: 0px 0 0 10%;
		width: 30%;
	}
}
#contentLeft ul {
	margin-left: -20px;
}
#contentLeft li {
	list-style: none;
	list-style-type:none;
	margin-left: -20px;
	padding: 5px;
	background-color:#e1dad7;
}	
@media only screen and (min-width: 897px) {
	#contentLeft li {
		list-style: none;
		list-style-type:none;
		width: 225px;
		margin-left: -20px;
		padding: 0px 0px 18px 25px;
		background-color:#e1dad7;
	}
}
#contentCovers {
	float: left;
	width: 45%;
	margin-left: 5%;
	margin-top: 12px;
}
#contentCovers p {
	margin: 0;
}
#contentCovers img {
	padding: 10px 0 2px 5px;
}
@media only screen and (min-width: 897px) {	
	#contentCovers p {
		margin: 8px 0;
	}
	#contentCovers img {
		padding: 5px;
	}	
}
@media only screen and (min-width: 897px) {
	#contentCovers {
		float: left;
		width: 225px;
		margin-left: 5%;
		margin-top: 0;
	}
}
#coverAnswers {
	padding-top: 50px;
}
@media only screen and (min-width: 897px) {
	#coverAnswers {
		padding-top: 0px;
	}		
}
.concentration-game {
	width: 90%; 
	margin: 25px auto;
}
@media only screen and (min-width: 897px) {
	.concentration-game {
		width: 80%; 
	}	
}
.showMobile {
	display:block;
}
.showDesktop {
	display:none;
}
@media only screen and (min-width: 897px) {
	.showMobile {
		display:none;
	}
	.showDesktop {
		display:block;
	}
}
/*Word Find*/
#puzzle {
  border: 1px solid black;
  padding: 20px;
  float: left;
  margin: 30px 20px;
  background-color: white;
}

#puzzle div {
  width: 100%;
  margin: 0 auto;
}

/* style for each square in the puzzle */
#puzzle .puzzleSquare {
  height: 30px;
  width: 30px;
  text-transform: uppercase;
  background-color: white;
  border: 0;
  font: 1em sans-serif;
  margin: 0;
  padding: 5px;
}

button::-moz-focus-inner {
  border: 0;
}

/* indicates when a square has been selected */
#puzzle .selected {
  background-color: orange;
}

/* indicates that the square is part of a word that has been found */ 
#puzzle .found {
  background-color: blue;
  color: white;
}

#puzzle .solved {
  background-color: purple;
  color: white;
}

/* indicates that all words have been found */
#puzzle .complete {
  background-color: green;
}
/**
* Styles for the word list
*/
#words {
  padding-top: 20px;
  padding-bottom: 20px;
  -moz-column-count: 2;
  -moz-column-gap: 20px;
  -webkit-column-count: 2;
  -webkit-column-gap: 20px;
  column-count: 2;
  column-gap: 20px;
  width: 300px;
}
#words ul {
  list-style-type: none;
      margin-top: 5px;
}
#words li {
  padding: 3px 0;
  font: 1em sans-serif;
}
/* indicates that the word has been found */
#words .wordFound {
  text-decoration: line-through;
  color: gray;
}
/**
* Styles for the button
*/
#solve {
  margin: 0 30px;
}
.col2thirdleftHome {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 897px) {
	.col2thirdleftHome {
		float: left;
		width: 58%;	
	}
}
.col1thirdrightHome {
	float: none;
	width: 98%;
	padding: 0 1%;
	margin: auto;
}
@media only screen and (min-width: 897px) {
	.col1thirdrightHome {
		float: right;
		width: 33%;	
	}
}
hr.home {
    float: left;
    width: 100%;
    height: .5em;
    border: 2px solid #47649C;
    background: #47649C;
    margin: 2em 0;
}
.colorBoxHome {
	padding: 25px;
}