@charset "utf-8";
/* CSS Document */

/********************************/
/* HTML, BODY, AND WRAPPER		*/
/********************************/

html, body {
	font-size:90%;
	width:768px;
	max-width:768px;
	height:auto;
}

#wrapper {
	height:100%;
/*	background-color:#f00;			/* red - delete me */
}

/********************************/
/* iPAD ONLY					*/
/********************************/

.iPadOnly {
	display:inherit;
}


/********************************/
/* HEADER						*/
/********************************/

#header {
	position:relative;
	width:768px;
	height:150px;
/*	display:none;					/* delete me */
}

#header .spacer {
	display:none;
}

#header img {
	top:0px;
}

#header img.imgLandscape {
	display:none;
}

#header img.imgPortrait {
	display:block;
}

#header h1 {
	top:53px;
	margin-left:150px;
	font-size:33px;
}

/********************************/
/* HEADER > GOOGLE (SEARCH)		*/
/********************************/

#header #search {
	top:0px;
	width:200px;
	padding-right:10px;
}

#header form {
	top:5px;
}

/********************************/
/* HEADER > TOP NAV				*/
/********************************/

#header #topNav {
	margin-left:150px;
}

#header #topNav ul {
	width:618px;
}

#header #topNav ul #tabDyslexia,
#header #topNav ul #tabGetHelp {
	width:16.7%
}

#header #topNav ul li a {
	display:block;
	padding-top:3px;
	padding-bottom:3px;
	font-size:0.8em;
}
/********************************/
/* HEADER > COLOR BAR			*/
/********************************/
#header #colorBar-1,
#header #colorBar-2 {
	top:150px;
	height:20px;
}

#header #colorBar-1 {
	width:150px;
}

#header #colorBar-1 p {
	margin:10px;
	padding: 0 0 0 22px;
}

#header #colorBar-2 #readspeaker_button {
	display:none;
}

#pageHome #header #colorBar_2 #readspeaker_button_iPad,
#header #colorBar-2 #readspeaker_button_iPad {
	display:block;
/*	height:25px;*/
}

#header #colorBar-2 #readspeaker_button_iPad a {
	display:block;
	height:25px;
	min-height:25px;
}

#pageSeminars #header #colorBar-2 #readspeaker_button_iPad a:hover,  /* MUST DO THIS FOR ALL PAGES */
#pageSeminars #header #colorBar-2 #readspeaker_button_iPad a:focus {
	color:#00007d;
	background-color:#f7f9fc;
}

#header #colorBar-2 #readspeaker_button_iPad a span.toListen img {
	top:4px;
	left:5px;
	height:20px;
	width:20px;
}

/************************************************************/
/* DEFAULT LINKS (TOC, MORE INFO, SIDE NAV AND BACK TO TOP)	*/
/************************************************************/
/* 	Styles for Table of Contents, More Info Bar, 
	SideNav, and "Back to" links */

#pageHome #sideNav a,
#pageSearch #content .links a,
#pageSearch #sideNav a,
#pageUtility #content .links a,
#pageUtility #sideNav a {
	background-image:url("../imgs/arrowsSmall/arrowYellowDark.gif");
}

/*
#pageHome #homeContent .links a:hover,	#pageHome #homeContent .links a:focus,
#pageHome #sideNav a:hover,				#pageHome #sideNav a:focus,
#pageSearch #content .links a:hover,	#pageSearch #content .links a:focus,
#pageSearch #sideNav a:hover,			#pageSearch #sideNav a:focus,
#pageUtility #content .links a:hover,	#pageUtility #content .links a:focus,
#pageUtility #sideNav a:hover,			#pageUtility #sideNav a:focus {
}
*/

#pageVideos #content .links a,
#pageVideos #sideNav a {
	background-image:url("../imgs/arrowsSmall/arrowMagentaDark.gif");
}

#pageDyslexia #content .links a,
#pageDyslexia #sideNav a {
	background-image:url("../imgs/arrowsSmall/arrowGreenDark.gif");
}

#pageGetHelp #content .links a,
#pageGetHelp #sideNav a {
	background-image:url("../imgs/arrowsSmall/arrowOrangeDark.gif");
}

#pageSeminars #content .links a,
#pageSeminars #sideNav a {
	background-image:url("../imgs/arrowsSmall/arrowBlueDark.gif");
}

#pageMoreInfo #content .links a,
#pageMoreInfo #sideNav a {
	background-image:url("../imgs/arrowsSmall/arrowPurpleDark.gif");
}

#content .links a:hover,
#content .links a:focus,
#homeContent a:hover,
#homeContent a:focus,
#sideNav a:hover,
#sideNav a:focus {
	background-color:#fffff3;		/* cream */
}

#pageHome #sideNav a:active,
#pageSearch #content .links a:active,
#pageSearch #sideNav a:active,
#pageUtility #content .links a:active,
#pageUtility #sideNav a:active {
	background-image:url("../imgs/arrowsSmall/arrowYellowLight.gif");
}

#pageVideos #content .links a:active,
#pageVideos #sideNav a:active {
	background-image:url("../imgs/arrowsSmall/arrowMagentaLight.gif");
}

#pageDyslexia #content .links a:active,
#pageDyslexia #sideNav a:active {
	background-image:url("../imgs/arrowsSmall/arrowGreenLight.gif");
	color: #009900; 			/* txtGreenLight */
	background-color: #f2fff2; 	/* bkgGreenLight */
	border:1px dotted #009900; 	/* txtGreenLight */
}

#pageGetHelp #content .links a:active,
#pageGetHelp #sideNav a:active {
	background-image:url("../imgs/arrowsSmall/arrowOrangeLight.gif");
}

#pageSeminars #content .links a:active,
#pageSeminars #sideNav a:active {
	background-image:url("../imgs/arrowsSmall/arrowBlueLight.gif");
}

#pageMoreInfo #content .links a:active,
#pageMoreInfo #sideNav a:active {
	background-image:url("../imgs/arrowsSmall/arrowPurpleLight.gif");
}

/*#pageDyslexia #content a:active {
/*}*/

/********************************/
/* SIDENAV						*/
/********************************/
#sideNav {
	position:absolute;
	width:148px;
	top:140px;
	bottom:-200px;				/*  kludge added to prevent scrollbar from appearing on 
									iPad, where the whole screen scrolls */
	padding-top:0px;
	margin-top:1px;
	margin-left:3px;
}

/*#pageHome #sideNav {
	top:150px;
}*/

#pageHome #sideNav a.noArrow,
#pageHome #sideNav p.imgFacebook a {
	background-image:none;
	display:block;
	height:36px;
	width:120px;
	margin:0 auto 20px;
}


#sideNav p.imgFacebook {
	width:140px;
	position:absolute;
	top:29px;
}

#pageHome #sideNav p.imgFacebook {
	top:27px;
}

#sideNav ul,
#pageHome #sideNav ul {
	position:absolute;
	width:140px;
	padding-right:0;
}

#sideNav ul {
	top:72px;
}

#pageHome #sideNav ul {
	top:153px;
}

#sideNav ul li a,
#sideNav p a.learnMore {
	background-position: 2px 7px;
}

#sideNav ul li a {
	padding-left:16px;
}

/********************************/
/* SCROLL - SideNav				*/
/********************************/

#sideNav.scroll-pane,
#sideNav .jspContainer,
#sideNav .jspPane {
	width:143px;
	min-width:143px;
	max-width:143px;
	height:500px;
	min-height:500px;
	overflow:visible;
}

#sideNav .jspVerticalBar,
#sideNav .jspHorizontalBar {
	display:none;
}

#sideNav .jspVerticalBar {
}


/********************************/
/* CONTENT BOX					*/
/********************************/
#content,
#homeContent {
	background-image:url("../imgs/iPadPortraitBackground.jpg");   /* provides vertical line for more info bar */
	margin:0 0 0 150px;
	padding-top:10px;
}

#content {
	min-width:590px;
	width:590px;
}

#homeContent {
	min-width:600px;
	width:600px;
	padding-left:10px;
}


/********************************/
/* CONTENT ELEMENTS				*/
/********************************/
#content h1, 
#content h2, 
#content h3, 
#content h4, 
#content h5, 
#content h6 {
	margin-right:160px;
	border-top:0px solid transparent;	/* controls space between top of viewport and h2 */
/*	background-color:#fdd;				/* pink - delete me */
}

#content h2 {
	margin-top:10px; /*	difference between border-top and margin-top controls distance 
						between h2 line and preceding p */
}

#pageVideos #content h2 .spacer {
	border-top:2px solid #e2e2c4;		/* light brown */
}

#pageVideos.screenVideos #content h2 .spacer {
	border-top:0px solid transparent;		
}

#content h1, 
#content h3, 
#content h4, 
#content h5, 
#content h6 {
	margin-top:3px; /*	difference between border-top and margin-top controls distance 
						between h2 line and preceding p */
}

#content h1 .spacer,
#content h2 .spacer,
#content h3 .spacer,
#content h4 .spacer,
#content h5 .spacer,
#content h6 .spacer {
	margin-top:0px; /* controls where text and line are in relation to preceding and following p's - was 35px*/
	padding-top:20px;	/* controls space between line and heading text */
/*	background-color:#fdd;		/* pink - delete me */
}

#content h1 .spacer,
#content h2 .spacer,
#content h3 .spacer,
#content h4 .spacer,
#content h5 .spacer {
	min-width:430px;
	width:430px;
/*	margin-right:160px;*/
}

#content h4 .spacer {
/*	border-top:1px solid #e2e2c4;		/* light brown */
	font-size:1.2em;
	font-weight:bold;
/*	background-color:#ddf;		/* blue - delete me */
}

#content h6 .spacer {
	padding-left:5px;
}

#content p,
#content ul.content,
#content ol.content {
	padding-left:5px;
	margin-right:160px;
}

#content ul.toc {
	width:400px;
	margin:0 0 0 20px;
}

#content ul.toc li a {
	padding-left:41px;
	background-position:5px 8px;
}

#content ul.column {
	padding-left:15px;
	width: 185px;
	margin-right:0;
}

#content ul.tocColumnFirst, 
#content ul.tocColumnSecond {
	width: 195px;
	margin-left:20px;
	margin-right:0;
}

#content p,
#content div.citation p {
	width:425px;
	min-width:425px;
}

#content p {
	padding-top:10px;
}

#content div.citation p {
	line-height:1.3em;
}

#content div.details p {
	width:375px;
	min-width:375px;
}

#content p.blockquote,
#content h6.blockquote,
#content ul.blockquote,
#content ol.blockquote {
	margin-right:180px;
	padding-bottom:5px;
	font-size:0.95em;
/*	background-color:#fdd;		/* pink - delete me */
}

#content p.blockquote,
#content h6.blockquote {
/*	margin-left:30px;*/
}

#content h6.blockquote {
	margin-top:0;
	border-top:0 solid transparent;
	padding:20px 0 5px 5px;
}

#content ul.blockquote,
#content ol.blockquote {
/*	margin-left:45px;*/
}

/****************************************/
/* CONTENT - INTRO SECTION				*/
/****************************************/
#content #intro {
	min-height:165px;
}

#content #intro h1,
#content #intro h1 .spacer {
	float:left;
	margin-right:0; /*160px;*/
	left:0;
}

#content #intro h1 {
	border-top:220px solid transparent;	/* controls space between top of viewport and h - was 190px */
	margin-top:-210px; 	/* 	difference between border-top and margin-top controls distance between h line 
							and preceding p */
	margin-left:-8px;
	padding-left:0;
	overflow:visible;
}

#content #intro h1 .spacer {
	display:block;
	position:relative;
	margin-top:35px;
	padding-top:0.3em;
	padding-bottom:0.1em;
	padding-left:0;
}

#content #intro h1#anchorTop, 
#content #intro h1#anchorTop .spacer, 
#content #intro p {
	margin-right: 330px;
}

#content #intro h1#anchorTop .spacer {
	min-width: 275px;
	width: 275px;
}


#content #intro img {
	margin-bottom:20px;
/*	margin-right:160px;*/
	top:60px;
	right:165px;
}

#content #intro p  {
	position:relative;
	min-width:300px;
	width:300px;
	margin-right:290px;
	min-height:62px;
}

#content #intro ul.toc {
	margin-left:5px;
	margin-right:10px;
	padding-top:15px;
	width:200px;
}

#content #intro ul.toc li {
	margin-top:3px;
}

#content #intro ul.toc li a {
	background-position:2px 8px;
/*	border:1px solid #000;				/* black - delete me */
}

/************************************************/
/* CONTENT - INTRO - VIDEO AND UTILITY SCREENS	*/
/************************************************/
#pageVideos.screenVideos #content #intro,
#pageSiteMap #content #intro,
#pageUtility #content #intro {
	min-height:0;
}

#pageVideos.screenVideos #content #intro h1#anchorTop,
#pageVideos.screenVideos #content #intro h1#anchorTop .spacer,
#pageSiteMap #content #intro h1#anchorTop,
#pageSiteMap #content #intro h1#anchorTop .spacer,
#pageUtility #content #intro h1#anchorTop,
#pageUtility #content #intro h1#anchorTop .spacer {
	min-width:438px;
	width:438px;
}

#pageVideos.screenVideos #content #intro p,
#pageSiteMap #content #intro p,
#pageUtility #content #intro p {
	min-width:425px;
	width:425px;
}


/********************************/
/* CONTENT MORE INFO BAR		*/
/********************************/
#content .moreInfoDiv,
#content .moreInfoDiv ul.moreInfoBar {
	width:140px;
}

#content .moreInfoDiv ul.moreInfoBar {
	padding-top:5px;
	line-height:1.3em;
/*	background-color:#ddf;		/* blue - delete me */
}

#content .moreInfoDiv ul.moreInfoBar li a {
	padding-left:16px;
	background-position:2px 10px; /* set separately for "#content #intro ul.moreInfoBar li a" */
}

#content #intro .moreInfoDiv {
	position:absolute;
	top:65px;
	right:2px;
}

#content #intro ul.moreInfoBar {
	position:relative;
	padding-top:0px;
}

#content #intro ul.moreInfoBar li a {
/*	padding-left:15px;*/
	background-position:2px 7px;
}

/****************************************/
/* CONTENT - LINK BACK TO's				*/
/****************************************/
#content p.linkBackTo {
	display:block;
	clear:both;
	position:relative;
	width:425px;
	margin-top:3px;
	margin-bottom:0;
	margin-right:160px;
	padding-top:2px;
	padding-bottom:3px;
	padding-left:5px;
	overflow:hidden;
	font-size:0.65em;
/*	background-color:#cdf;			/* blue - delete me */
}

#content p.linkBackTo a { /* IPAD */
	float:right;
	display:inline-block;
	padding:1px 3px 2px 13px;
	margin:-1px 0px 0px 5px;
	background-position:0px 2px;
	min-height:12px;
}


/********************************/
/* HOME > DEFAULT SETTINGS		*/
/********************************/

#homeContent a {
	background-image:url("../imgs/arrowsSmall/arrowYellowDark.gif");
}

/********************************/
/* HOME > WELCOME				*/
/********************************/
#homeContent #welcome h1,
#homeContent #welcome h2 {
	width:590px;
}

#homeContent #welcome h1 .spacer,
#homeContent #welcome h2 .spacer {
	width:590px;
	display:block;
	margin-top:10px; /* controls where text and line are in relation to preceding and following p's */
	right:0;
}

#homeContent #welcome h1 .spacer {
/*	padding:30px 0 0; /* top controls space between line and heading text */
	padding-top:40px;
}

#homeContent #welcome h2 .spacer {
/*	padding:5px 0 50px;*/
	padding-bottom:20px;
}

/********************************/
/* HOME > INTRO BLURBS			*/
/********************************/

#homeContent #introBlurbGroup {
	width:270px;
/*	background-color:#cfc;					/* green - DELETE ME */
}

#homeContent #introBlurbGroup .introBlurb img {
	margin-right:7px;
	margin-bottom:0;
}

#homeContent #introBlurbGroup .introBlurb h2,
#homeContent #introBlurbGroup .introBlurb h2.spacer,
#homeContent #introBlurbGroup .introBlurb ul {
	width:270px;
}

#homeContent #introBlurbGroup .introBlurb ul {
	padding-left:0;
	margin-left:0;
}

#homeContent #introBlurbGroup .introBlurb ul li a {
	padding-top:3px;
	padding-bottom:3px;
	padding-left:15px;
	background-position: 0px 10px;
	font-size:0.90em;
	line-height:1.3em;
}

#homeContent #introBlurbGroup .introBlurb p {
	padding-left:15px;
	width:255px;
/*	background-color:#fcc;					/* pink - DELETE ME */
}

#homeContent #introBlurbGroup .introBlurb p.learnMore {
	position:relative;
	width:255px;
	text-align:right;
}

#homeContent #introBlurbGroup p a.learnMore {
	display:block;
	width:auto;
	float:right;
	margin-right:100px;
/*	position:absolute;
	bottom:0;
	right:0;
	margin:0;
/*	padding:0;*/
/*	text-align:right;*/
/*	background-color:#cdf;					/* blue - DELETE ME */
}

/********************************/
/* CONTENT > INTRO SECTIONS		*/
/********************************/

#homeContent #introSectionGroup,
#homeContent #introSectionGroup .introSection h5,
#homeContent #introSectionGroup .introSection a {
	width:325px;
}

#homeContent #introSectionGroup {
	margin-left:5px;
/*	background-color:#cdf;					/* blue - DELETE ME */
}

#homeContent #introSectionGroup .introSection h5 {
	line-height:1.2em;
/*	background-color:#dfd;					/* green - DELETE ME */
}

#homeContent #introSectionGroup .introSection a {
	line-height:1.2em;
/*	background-color:#fdd;					/* pink - DELETE ME */
}

#homeContent .introSection a:link img,
#homeContent .introSection a:visited img,
#homeContent .introSection a:hover img,
#homeContent .introSection a:focus img {
	margin:4px 7px 9px 4px;
	border-width:1px;
}

#homeContent .introSection a:active img {
	margin:2px 5px 7px 2px;
	border-width:3px;
}


#homeContent #introSectionGroup .introSection .title,
#homeContent #introSectionGroup .introSection .description {
	width:215px;
	margin-left:95px;
	padding-left:15px;
/*	color:#c00;								/* red - delete me */
}

#homeContent #introSectionGroup .introSection .title {
	background-image:url("../imgs/arrowsSmall/arrowYellowDark.gif");			/* move me to tabColors.css */
	background-position: 1px 7px;
/*	background-color:#fff;					/* white - delete me */
}

#homeContent #introSectionGroup .introSection .description {
	margin-top:-12px;
	line-height:1.4em;
/*	background-color:#999;					/* grey - delete me */
}
/********************************/
/* PLEASE SEND ME...			*/
/********************************/

.sg-wrapper {
	min-width:560px;
	width:560px;
	max-width:560px;
}

.sg-question-set,
.sg-button-bar {
/*	display:none;*/
}


.sg-input-essay {
	min-width:540px;
	width:540px;
	max-width:540px;
}

.txtWide {
	width:560px;
}

/********************************/
/* FOOTER						*/
/********************************/
#content #footer,
#homeContent #footer {
/*	position:relative;*/
	min-width:575px;
	width:575px;
/*	height:23px;*/
	margin-left:0px;
}


/********************************/
/* VIDEOS						*/
/********************************/
 
#pageVideos.screenVideos #sideNav p.sideNavInstructions {
	top:80px;
}

#pageVideos.screenVideos #sideNav ul {
	top:120px;
}

#pageVideos.screenVideos #sideNav ul li a {
	background-position:1px 8px;
}

#pageVideos.screenVideos #sideNav ul li a:hover,
#pageVideos.screenVideos #sideNav ul li a:focus {
	background-color:#f3e2e3; 	/* bkgMagentaBase */
}


#pageVideos.screenVideos #content #intro h1 {
	padding-top:0;
}

#pageVideos.screenVideos #content #intro h1 .spacer {
	margin-top:10px;
	padding-top:1.0em;
}

#pageVideos.screenVideos #content {
	min-height:/*700px*/ 500px;
}

#pageVideos.screenVideos #content h3 {
	max-width:425px;
}

#pageVideos.screenVideos #content h3 .spacer {
	margin-left:10px;
	padding:0;
	min-width:325px;
	max-width:325px;
}

#pageVideos.screenVideos #content /*h3*/ a.backPrevious,
#pageVideos.screenVideos #sideNav ul li a.backPrevious {
	display:none;
/*	padding-right:0;
	margin-right:13px;
	max-width:50px;
	background-position: 3px 0px;*/
}

#pageVideos.screenVideos #content h3 a.backPrevious:hover,
#pageVideos.screenVideos #content h3 a.backPrevious:focus {
	background-color: #fffff3;			/* cream */
}

#pageVideos.screenVideos #content .vimeoParagraph {
	padding:0;
	margin:0;
}

#pageVideos.screenVideos #content .vimeoParagraph .vimeoVideo {
	margin:5px 10px 0px;
	width:400px;
	height:300px;
}

#pageVideos.screenVideos #content .links,
#pageVideos.screenVideos #content .links .linkBackTo {
	margin-top:0px;
	margin-bottom:0px;
	padding-top:0px;
	padding-bottom:0px;
}

#pageVideos.screenVideos #content .links .linkBackTo {
	width:400px;
	min-width:400px;
	max-width:400px;
	padding:0;
/*	background-color:#fdd;			/* pink - delete me */
}

#pageVideos.screenVideos #content .links {
	margin-left:10px;
	font-size:1.2em;
}

#pageVideos.screenVideos #content .links a.previousVideo,
#pageVideos.screenVideos #content .links a.nextVideo {
	background-position: -1px 6px;
	margin:0;
/*	background-color:#dfd;			/* green - delete me */
}


/********************************/
/* SITE MAP						*/
/********************************/

#content #siteMap h3 a {
	background-position: 7px 11px;
}

#content #siteMap .links ul.toc {
	width: 195px;
	margin-left:25px;
}

/********************************/
/* MISCELLANEOUS				*/
/********************************/

