@charset "utf-8";
/* CSS Document */
.title-color {
	color: #105177;
}
.container {
	width: 960px;
	background: #d0dfe7;  /* light blue */
	margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout */
}
.header {
	background-color:  #CFCBC5; /* GREY COLOR BEHIND GCL LOGO AND THE FOOTER */
	padding-top: 15px;
	padding-bottom: 0;
}

.gcl_logo {
	padding-left: 20px;
}
#header_menu {
	background-image: url(../images/menu_backg.png);
	height: 40px;
	width: 945px;
	padding-bottom: 0;
	padding-left: 15px;
	margin-top: 25px;
}

#header_menu ul {
  list-style-type: none;
  height: 30px;
  padding-left: 25px;
  
}
#header_menu a:hover {
  background-image: url(../images/main-button-tile_green.png);
}
#header_menu a:active {
background-image: url(../images/main-button-tile_green.png);
}
#header_menu a:focus {
background-image: url(../images/main-button-tile_green.png);
}
#header_menu li {
  float: left;
}

#header_menu ul a {
  background-position: right;
  padding-right: 10px;
  padding-left: 10px;
  text-decoration: none;
  font-family: "Segoe Script";
  font-size: 16px;
  color: #FFF;
}
body {
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	background-color: #105177;/* THIS IS THE DARK BLUE OUTSIDE THE PAGE */
	margin: 0;
	padding: 0;
	color: #000; /* BLACK */
}
.footer {
	background: #CFCBC5; /* GREY COLOR BEHIND GCL LOGO AND THE FOOTER */
	padding: 10px 0; 
	clear: both;
}
.footer_menu_table {
     padding-left: 5px;
	 padding-right: 15px;
     width: 960px;
}


/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
	padding-right: 15px;
	padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
}
a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
	border: none;
}
/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
	color: #42413C; /* DARK GREY */
	text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
	color: #6E6C64; /* A LIGHTER GREY THAN a:link */
	text-decoration: underline;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	text-decoration: none;
}

.fltrt { 
	float: right;
	margin-left: 15px;
}
.fltlft {
	float: left;
	margin-top: 7px;
	margin-right: 15px;
	padding-bottom: 0px;
}
.fltlft_lmarg15 { 
	float: left;
	margin-top: 7px;
	margin-right: 15px;
	margin-left: 15px;
}
.fltlft_narrow { /* used on the pt_*_oth pages */
	float: left;
	margin-top: 7px;
	margin-right: 5px;
}
.fltlft_lmarg15_narrow { /* used on the pt_*_oth pages */
	float: left;
	margin-top: 7px;
	margin-right: 5px;
	margin-left: 15px;
}

.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
.page_logo2 {
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-left: 10px;
}
.page_logo {
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: 30px;
}
.cover_border {
	border: 1px solid #000;
}
.copyright {
	padding-top: 15px;
}
.gail_book_quote {
	font-size: 16px;
	font-style: italic;
	border: 1px solid #105177;
	margin-right: 250px;
	background-color: #e2d8d7;
	margin-left: 15px;
	margin-bottom: 10px;
	padding-top: 7.5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.chapter {
	font-size: 20px;
	margin-left: 250px;
}
.gcl_text {
	font-size: 18px;
	font-weight: normal;
	font-variant: normal;
	font-style: normal;
	margin-right: 35px;
	margin-left: 25px;
	padding-top: 20px;
}
.gcl_text h1 {
	font-size: 18px;
	font-weight: normal;
	font-variant: normal;
	font-style: normal;
}
.gcl_text h2 {
	font-size: 20px;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
}
.guestbook {
	font-size: 18px;
	font-weight: normal;
	font-variant: normal;
	font-style: normal;
	margin-right: 25px;
	margin-left: 125px;
	padding-top: 20px;
}
.attribution {
	font-size: 16px;
	font-style: italic;
}
.space_above_heading {
	padding-top: 20px;
}
.appear_sched {
	font-family: "Segoe Script";
	font-size: 18px;
	color: #FFF;
	background-color: #105177;
	border: 1px solid #000;
	text-align: center;
	font-weight: bolder;
}
.centered_pic {
    text-align: center;
}
}
.photocaption {
	background-color: #000;
	line-height: normal;
	color: #FFF;
	font-size: 14px;
	font-style: italic;
	font-weight: bolder;
	margin-bottom: 2px;
	text-align: center;
}
.credit {
	line-height: normal;
	color: #000;
	font-size: 11px;
	font-style: italic;
	font-weight: bolder;
	margin-bottom: 2px;
	padding-left: 5px;
	text-align: left;
	margin-right: auto;
}
.creditvideo {
	line-height: normal;
	color: #000;
	font-size: 11px;
	font-style: italic;
	font-weight: bolder;
	margin-bottom: 2px;
	padding-left: 15px;
	text-align: left;
	margin-right: auto;
}
.creditaudio {
	line-height: normal;
	color: #000;
	font-size: 11px;
	font-style: italic;
	font-weight: bolder;
	margin-bottom: 0;
	padding: 0;
	text-align: right;
	margin-right: 0px;
	width: 250px;
}
.extra_top_padding {
	padding-top: 20px;
}
.publisher {
	font-size: 14px;
	font-weight: normal;
	font-variant: normal;
	font-style: italic;
	text-decoration: overline;
}
.footer_books_menu, .footer_books_menu ul {
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none;
	display: block;
}
.footer_books_menu li {
	font-family: "Segoe Script", serif;
	font-size: 14px;
	background: #487691;
	color: #fff;
	margin: 0;
	padding: 0;
	display: block;
	float: left;	/* move all main list items into one row, by floating them */
	position: relative;	/* position each LI, thus creating potential IE.win overlap problem */
	z-index: 5;		/* thus we need to apply explicit z-index here... */
	border-width: 1px;
	border-style: solid;
	border-color: #ccc #888 #555 #bbb;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
	font-weight: bold;
}
.footer_books_menu li:hover {
	z-index: 10000;	/* ...and here. this makes sure active item is always above anything else in the menu */
	white-space: normal;/* required to resolve IE7 :hover bug (z-index above is ignored if this is not present)
							see http://www.tanfa.co.uk/css/articles/pure-css-popups-bug.asp for other stuff that work */
}
.footer_books_menu li li {
	float: none;/* items of the nested menus are kept on separate lines */
	
}
.footer_books_menu ul {
	visibility: hidden;	/* initially hide all submenus. */
	position: absolute;
	z-index: 10;
	left: 0;	/* while hidden, always keep them at the bottom left corner, */
	bottom: 0;		/* 		to avoid scrollbars as much as possible */
}
.footer_books_menu li:hover>ul {
	visibility: visible;	/* display submenu them on hover */
	bottom: 100%;	/* 1st level go above their parent item */
}
.footer_books_menu li li:hover>ul {	/* 2nd+ levels go on the right side of the parent item */
	bottom: 0;
	left: 100%;
}
.footer_books_menu:after, .footer_books_menu ul:after {
	content: ".";
	height: 0;
	display: block;
	visibility: hidden;
	overflow: hidden;
	clear: both;
}
.footer_books_menu, .footer_books_menu ul {	/* IE7 float clear: */
	min-height: 0;
}
.footer_books_menu ul {
	background-image: url(../images/empty.gif);	/* required for sticky to work in IE6 and IE7 - due to their (different) hover bugs */
	padding: 30px 10px 10px 30px;
	margin: 0 0 -10px -30px;
}
.footer_books_menu ul ul {
	padding: 30px 30px 30px 10px;
	margin: 0 0 -30px -10px;
}
.footer_books_menu, .footer_books_menu ul li {
	color: #FFF;
}
.footer_books_menu ul {
	width: 11em;
}
.footer_books_menu a {
	text-decoration: none;
	color: #fff;
	padding: .4em 1em;
	display: block;
	position: relative;
	font-weight: bold;
}
.footer_books_menu li:hover>a {
	color: #FFF;
	background: #577ec3;; /* medium blue */
}
.footer_books_menu a:hover {
	color: #FFF;
    background: #577ec3;; /* medium blue */

}
.footer_books_menu li li {	/* create borders around each item */
	border: 1px solid #ccc;
}
.footer_books_menu ul>li + li {	/* and remove the top border on all but first item in the list */
	border-top: 0;
}
.footer_books_menu li li:hover>ul {	/* inset 2nd+ submenus, to show off overlapping */
	bottom: 5px;
	left: 90%;
}
#apDiv1 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
#apDiv2 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
#apDiv3 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
#apDiv4 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
#apDiv5 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
#apDiv6 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
#apDiv7 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
#apDiv8 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
#apDiv9 {
	position:relative;
	z-index:1;
	overflow: visible;
	right: 40px;
	bottom: 8px;
}
.icons {
  border: none;
  
}

.reference {
	font-size: 13px;
	font-style: italic;
	font-weight: bold;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 25px;
	margin-left: 0px;
	margin-right: 0px;
	color: #E41635;
}


/* ########################################## */

.tabs_menu_container {
	height: auto;
	width: auto;
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #000;
	padding-left: 27px;
}



.tabs_menu, .tabs_menu ul {
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none;
	display: block;
}

.tabs_menu li {
	font-family: "Segoe Script", serif;
	font-size: 16px;
	background: #eeeeee;
	color: #105177;
	margin: 0;
	margin-right: 5px;
	padding: 0;
	display: block;
	float: left;	
	position: relative;
	z-index: 5;
	border-width: 1px;
	border-style: solid;
	border-color: #ccc #888 #555 #bbb;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
	font-weight: bold;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style:  solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-bottom-color: #eeeeee;
	border-bottom-width: 1px;
	border-left-style: solid;
	border-top-color: #999;
	border-right-color: #999;
	border-left-color: #CCC;
	
	-moz-user-select: none;
	-khtml-user-select: none;
	-moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
	-webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
	border-radius-topright: 10px;
	border-radius-topleft: 10px;
}

.tabs_menu li:hover {
	z-index: 10000;	
	white-space: normal;
	background: #5a866e;
	
	
}

.tabs_menu li li {
	float: none;
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-topright: 0px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    border-radius-topright: 0px;
    border-radius-topleft: 0px;
    }
    
.tabs_menu ul {
	visibility: hidden;	/* initially hide all submenus. */
	position: absolute;
	z-index: 10;
	left: 0;
	bottom: 0;	
}

.tabs_menu li:hover>ul {
	visibility: visible;
	bottom: 100%;
    
}

.tabs_menu li li:hover>ul {	
	bottom: 0;
	left: 100%;
}

.tabs_menu:after, .footer_books_menu ul:after {
	content: ".";
	height: 0;
	display: block;
	visibility: hidden;
	overflow: hidden;
	clear: both;
}
.tabs_menu, .footer_books_menu ul {	
	min-height: 0;
}

.tabs_menu ul {
	background-image: url(../images/empty.gif);	
	padding: 30px 10px 10px 30px;
	margin: 0 0 -10px -30px;
}
.tabs_menu ul ul {
	padding: 30px 30px 30px 10px;
	margin: 0 0 -30px -10px;
    
}

.tabs_menu, .footer_books_menu ul li {
	color: #FFF;
	text-align: center;
}
.tabs_menu ul li {
	text-align: center;
}


.tabs_menu ul {
	width: 10em;
}

.tabs_menu a {
	text-decoration: none;
	color: #105177;
	padding: .3em 1em;
	display: block;
	position: relative;
	font-weight: bold;
}

.tabs_menu li:hover>a {
	color: #FFF;
}

.tabs_menu li li {	
	border: 1px solid #ccc;
}
.tabs_menu ul>li + li {	
	border-top: 0;
}
.tabs_menu li li:hover>ul {	
	bottom: 5px;
	left: 90%;
}
.bookcovers {
	width: 960;
	text-align: center;
	font-size: 18px;
	background: #eeeeee;
}
.rp { 
	margin-right: 20px;
	margin-bottom: 10px;
	margin-top: 10px;
	border: 1px solid #000;
}
.instructions {
	font-size: 20px;
	font-weight: normal;
	font-variant: normal;
	font-style: italic;
	padding-bottom: 0px;
	margin-left: 15px;
	margin-top:10px;
}

.audio_filler {
	width: 240px;
	height: 8px;
	font-size: 11px;
	font-weight: bold;
}

.box_audio {
	float: left;
	width: 252px;
	background-color: #000;
	color: #FFF;
	font-size: 11px;
	font-style: italic;
	font-weight: bolder;
	margin-top: 5px;
	margin-right: 35px;
	margin-bottom: 25px;
	padding: 0;
	border-top: 1px solid #000;
}
.fltlft_buy {
	float: left;
	margin-top: 0;
	margin-right: 15px;
	padding-bottom: 0px;
}

#books {
	background-image: url(../images/bookcase30.png);
	background-repeat: no-repeat;
	background-position: 6px;
	padding: 0;
	padding-left: 25px;
	margin-right: 12px;
	
}
#ptales {
	background-image: url(../images/castle30.png);
	background-repeat: no-repeat;
	background-position: 2px;
	padding: 0;
	padding-left: 16px;
	margin-right: 12px;
}
#picture {
	background-image: url(../images/picture30.png);
	background-repeat: no-repeat;
	background-position: 2px;
	padding: 0;
	padding-left: 20px;
	margin-right: 12px;
}
#never_land {
	background-image: url(../images/fairy30.png);
	background-repeat: no-repeat;
	background-position: 4px;
	padding: 0;
	padding-left: 25px;
	margin-right: 12px;
}
#other {
	background-image: url(../images/magic30.png);
	background-repeat: no-repeat;
	background-position: 3px;
	padding: 0;
	padding-left: 20px;
	margin-right: 12px;
}
#audio {
	background-image: url(../images/victrola.png);
	background-repeat: no-repeat;
	background-position: 3px;
	padding: 0;
	padding-left: 18px;
}
#points {
    margin-left: 80px;
}