/* NAEP 2017 Public Site Design: Page shell ------------------------------------------
	(Content styling is covered in naep2017-content.css, for standard sitewide styles, and naep2017-supp.css,
	for supplemental, special-purpose, and legacy styles.) */

html {
	height:100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0px;
    right: 0px;
    bottom: 0;
    background-color: rgba(0,0,0,0.75);
    z-index: 2;
    cursor: pointer;	
}
#IESHeaderMask {
	background-color:#fff;
	width:100%;
	position:fixed;
	top:0;
	left:0;
	height:56px;
	z-index:999;
}
.header_container.fixed + #naepShell > #IESHeaderMask{
	height:42px;
}
#overlay.show-overlay {
	display:block;
}
*, *:before, *:after {
  box-sizing: inherit;
}
#SkipNavTarget:before {
	content:"";
	display:block;
	height:200px; /* fixed header height*/
	margin-top:-200px; /* negative fixed header height */
	visibility:hidden;
	pointer-events:none;
}
#PageBody #skip-nav { 
	position: absolute; top: 0; left: -999px; 
}
#PageBody #MainContent #ContentArea,
#PageBody #MainContent #ContentArea_base {
	outline:0;
}

#PageBody #skip-nav:focus {
	left:0;
	z-index:10000;
	font-size:16px;
}
#PageBody.naep2016 {
	margin: 0; 
	padding: 0;
}
#PageBody.naep2016 form#aspnetForm {
	padding: 0;
}
#PageBody #naepShell p {
	line-height:1.5em;
	margin:0 0 1.5em;
}
#PageBody.no-scroll{
	overflow-y:hidden;
}
#PageBody #naepShell p:last-child {

}
#PageBody #naepShell, #PageBody #naepShell input,#PageBody #naepShell textarea,#PageBody #naepShell select,#PageBody #naepShell button {
	font-family: "Open Sans", Verdana, sans-serif !important;
	font-size: 14px;
	color: #363636;
	font-weight: normal;
}

#FollowBar_small .FollowBar_group .follow-text {

	text-transform:uppercase;
}

#PageBody #naepShell span.screenreader-only{
	 position: absolute;
	 height: 1px;
	 width: 1px;
	 clip: rect(1px 1px 1px 1px); // IE 6 and 7
	 clip: rect(1px,1px,1px,1px);
	 clip-path: polygon(0px 0px, 0px 0px, 0px 0px);
	 -webkit-clip-path: polygon(0px 0px, 0px 0px, 0px 0px);
	 overflow: hidden !important;	
}						

#PageBody #MainContent.overlay {
	background-color: rgba(0,0,0,.95) !important;
}
#PageBody #aspnetForm {
	padding:0;
}
.footer_container{
	top:0 !important;
}
#PageBody #MainContent .full-width{
	width:100%;
}
#PageBody #MainContent .large-image{
	width:590px;
}
#PageBody #MainContent .centered{
	display:block;
	margin-left:auto;
	margin-right:auto;
}

/* Shell ------------------------------------------------------------------------ */

#naepShell {
	position: relative;
	width: 960px;
	margin: 0 auto;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,.5);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,.5);
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,.5);
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
		
	/* Sharing Bar ------------------------------------------------------------------ */
	
	#naepShell #sharingBar {
		position: fixed;
		background: transparent;
		top: 332px;
		margin-left: -55px;
		width: 53px;
		height: 167px;
		z-index: 500;
	}
	
		/* Sharing Bar Components ------------------------------------------------------- */
		
		#naepShell #sharingBar .sharing-bar-fold {
			position: absolute;
			top: 0;
			left: 0;
		}
		#naepShell #sharingBar a{
			outline:0;
			
		}
		#naepShell #sharingBar a img{
			position:relative;
		}
		#naepShell #sharingBar .sharing-bar-image {
			float:right;
		}
		#naepShell #sharingBar .facebook-button {
			background-color:#3b579d;
		}
		#naepShell #sharingBar .twitter-button {
			background-color:#5ea9dd;		
		}	
		#naepShell #sharingBar .email-button {
			background-color:#ed882f;
		}		
		#naepShell #sharingBar a:focus {
			position:relative;
			outline:3px solid #c69214;
			outline-offset:2px;
			z-index: 1000;
		}
		#naepShell #sharingBar .share-button {
			position:relative;
			display:block;
			top:17px;
			width:50px;
			height:50px;
			cursor: pointer;
			-moz-box-shadow: 4px 0 3px 0 rgba(0,0,0,.2);
			-webkit-box-shadow: 4px 0 3px 0 rgba(0,0,0,.2);
			box-shadow: 4px 0 3px 0 rgba(0,0,0,.2);			
			-webkit-transition: width 0.3s ease-in;
			-moz-transition: width 0.3s ease-in;
			-o-transition: width 0.3s ease;
			transition: width 0.3s ease;			
		}		
		#naepShell #sharingBar .share-button{
			box-shadow: 0px 5px 10px 0 rgba(0,0,0,.3);
		}
		#naepShell #sharingBar .share-button:hover{
			width:75px;

		}
	
	/* NAEP Banner ------------------------------------------------------------------ */
		#naepShell #header-bar {
			width:100%;
		}
		#naepShell #header-shell {
			background: #fff;
		}		
		#banner-bar {
			position:relative;
			background: #fff;
			height:70px;
		}
		
		#NAEP_logo{
			display:block;
			overflow:hidden;
			text-indent:100%;
			white-space:nowrap;
		}
		
/* NAEP Search Banner ---------------------------------------------------------- */
	#header-bar {
		height:70px;
	}
	#banner-bar{
		height:85px;
	}
	#BannerRight{
		position:relative;	
		float:right;	
	}
	#FollowBar{
		display:none;
		width:0;
	}
	#SearchBar{
		display:none;
		height:0;
	}
	#SearchBarBanner {
		position:relative;	
		float:right;
		height:37px;
		width:345px;
		background:#fff;
		margin-top:20px;
		padding-top:5px;

	}
	.SearchForm{
		position:relative;
		width:100%;
		box-shadow:0 3px 6px rgba(54,54,54, .15);	
	}
	.SearchForm > form {
		display:flex;
		flex-flow:row nowrap;
		border-radius:7px;
		border:2px solid #001871;
		margin-left:-1px;
		white-space: nowrap;
	}
	.SearchForm > form:hover {
		
	}	
	#SearchBarBanner .SearchForm input[type="text"] {
		display:inline-block;
		width: calc(100% - 50px);
		border: none;
		line-height:25px;
		padding:0 10px;
		margin-right:0;
		font-size: 1em;
		border-radius:5px 0 0 5px;
		height:35px;
		background-color:#ffffff;		
		border-right:2px solid #001871;
	}
	#SearchBarBanner .SearchForm Button {
		display:inline-block;
		position:relative;
		width:50px;
		font-size:1em;
		border:none;
		color:#001871;
		background:#001871 url(/nationsreportcard/adminonly/design2017/images/search_normal.png) no-repeat center center;
		background-size:25px 25px;
		border-radius:0 5px 5px 0;
		margin-top:0px;
		height:35px;
		-moz-transition: all 300ms;
		-o-transition: all 300ms;
		-webkit-transition: all 300ms;
		transition: all 300ms ease-in;	
	}
	#PageBody #naepShell  .SearchForm Button:hover,
	#PageBody #naepShell  .SearchForm Button:focus{
		background-color:#bbc7d6;
		background-image:url(/nationsreportcard/adminonly/design2017/images/search_hover.png);
		box-shadow: inset 0 3px 6px rgba(54,54,54, .15);
		color:#001871;
		cursor:pointer;
	} 	
	#PageBody #naepShell .nav-bar > .nav-button.hovered  .nav-menu,  
	#PageBody #naepShell .nav-bar > .nav-button  .nav-menu.opened {

	}		
		
		
/* NAEP Banner Objects ---------------------------------------------------------- */
		
	#NavBar .nav-menu ul {
		list-style-type: none;
		padding-left:0;
	}
	#NavBar .nav-menu-body {
		height:670px;
		max-height:670px;
		overflow:auto;
		padding:10px 0;

	}	
	#NavBar .nav-menu-body .columns{
		display:flex;
		flex-flow:row nowrap;		
		overflow:hidden;
	}	
	#NavBar .nav-menu-body .columns .nav-column {
		display:inline-block;
		width:33%;
		margin-right:10px;
		margin-right:0;
	}
	#NavBar .nav-menu-body .columns .nav-column:last-of-type{
		margin-right:0;
	}		
	#NavBar .nav-column li a {
		position:relative;
		color:#363636;
		display:block;
		width:100%;
		padding:0;
		border:1px solid transparent;
		text-decoration:none;
	}
	#NavBar .nav-column li a span{
		height:inherit;
		width:100%;
		display:table-cell;
		vertical-align: middle;
		line-height:1.2em;
		padding-right:25px;
		text-align:left;
	}	
	#NavBar .nav-column li.external a span{
		padding-right:30px;		
	}	
	#NavBar .nav-column .l2 a{
		height:45px;			
		font-size:1.143em;
		padding-left:10px;
	}
	#NavBar .nav-column .l2 li a {
		height:40px;
		font-size:1em;	
		padding-left:20px;
	}
#NavBar .nav-column li a:after {
	content: "";
	background: url("/nationsreportcard/adminonly/design2017/images/MM_Normal_Chevron.png") no-repeat center;
	right: 10px;
	position: absolute;
	display: block;
	width: 10px;
	height: 18px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#NavBar .nav-column li a:hover:after {
	background: url("/nationsreportcard/adminonly/design2017/images/MM_Hover_Chevron.png") no-repeat center;
}

#NavBar .nav-column li.external a:after {
	background: url("/nationsreportcard/adminonly/design2017/images/MM_Normal_EL.png") no-repeat center;
	width: 15px;
}

#NavBar .nav-column li.external a:hover:after {
	background: url("/nationsreportcard/adminonly/design2017/images/MM_Hover_EL.png") no-repeat center;
}


#NavBar .nav-bar .nav-button {
	-moz-transition: all .2s ease-in;
	-o-transition: all .2s ease-in;
	-webkit-transition: all .2s ease-in;
	transition: all .2s ease-in;
}

	/* Mega Menu ----------------------------------------------------------------- */		
		

	
	/* Crumb Trail ------------------------------------------------------------------ */
	#CrumbTrail {
		position:relative;
		margin-left:40px;
		color:#363636;
		min-height:10px;
	}
	#crumbTrail {
		font-size: .875em; 
		line-height: 1.5em; 
		padding-left:0;
	}
	.crumb {
		display: inline; 
		list-style-type: none; 
		margin-left: 0;
	}
	.crumb a:link ,
	.crumb a:visited	{
		color:#0077c8;		
	}
	.crumb:before {
		content: "/"; 
		padding-right: 3px;
		margin-left:3px;
	}
	.crumb:first-child:before {
		content: ""; 
		padding-right: 0;
	}


		/* Main Content ------------------------------------------------------------------ */
		#MainContent {
			position: relative;
			display: flex;

			margin: 0 0px;
			padding: 0 40px;
			font-family: "Open Sans", Verdana, sans-serif;
			-webkit-box-sizing: content-box;
			-moz-box-sizing: content-box;
			box-sizing: content-box;
		}	

/*************************/	
/*  Related Information  */
/*************************/
	#RelatedInformation {
		position:relative;
		display:block;		
		min-width:300px;
		top:0px;
		margin-left:20px;
	}
	#PageBody #MainContent #RelatedInfo {
		border:1px solid #c69214;
		border-radius:5px;
		box-shadow:0px 3px 6px rgba(54,54,54,.15);
	}
#PageBody #MainContent .related-information-title {
	position: relative;
	color: #001871;
	font-size: 1.25em;
	background-color: #dbe2e9;
	font-style: italic;
	text-align: center;
	line-height: 2.5em;
	height: 65px;
	border-bottom: 1px solid #8e9fbc;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}
	
#PageBody #MainContent .related-information-title span{
	position:absolute;
	left:0;
	top: 50%;
	width:100%;
	color:#363636;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#PageBody #RelatedInformation #RelatedInfoBanner .related-info-banner-title span {
	margin: 0 auto;
	display: table;
	position: relative;
	border-bottom: 1px solid transparent;
	transition: border-bottom 200ms;
}

#PageBody #RelatedInformation #RelatedInfoBanner .related-info-banner-title span:hover {
	border-bottom: #001871 solid 1px;
}

#PageBody #RelatedInformation #RelatedInfoBanner .sharing-bar-image {
	transition: all .2s ease-in-out;
}

#PageBody #RelatedInformation #RelatedInfoBanner .sharing-bar-image:hover {
	transform: scale(1.1);
}

#PageBody #MainContent #RelatedInformationBar {
	margin: 0;
	padding-left: 0;
}
	#PageBody #MainContent #RelatedInformationBar li {
		position: relative;
		display: block;
		list-style-type: none;
		margin-left: 0;
		font-size: 1em;
		background-image: linear-gradient(#ededed,#dbe2e9);
		border-top: 1px solid #fff;
		border-bottom: 1px solid #8e9fbc;
		transition: all .2s ease-in;
	}
	#PageBody #MainContent #RelatedInformationBar li:last-child {
		border-radius:0 0 5px 5px;
	} 	
	#PageBody #MainContent #RelatedInformationBar li:after {
		content:"";
		background: url(/nationsreportcard/adminonly/design2017/images/Chevron_Related_Info.png) 0 0 no-repeat;
		background-size: 10px 18px;
		position:absolute;
		display:block;
		float:right;
		right:6px;
		top:50%;
		width:10px;
		height:18px;
		margin-left:10px;
		transform: translateY(-50%);
	}
	#PageBody #MainContent #RelatedInformationBar li.external:after {
		content:"";
		background: url(/nationsreportcard/adminonly/design2017/images/external_link.png) 0 0 no-repeat;
		background-size: 15px 15px;	
		width:15px;
		height:15px;		
	}	
	#PageBody #MainContent #RelatedInformationBar li:hover,
	#PageBody #MainContent #RelatedInformationBar li a:focus{
		background: none #bbc7d6;
		border-top:1px solid #d9c89e;
		border-bottom:1px solid #8e9fbc;
		box-shadow:inset 0px 3px 6px rgba(0,0,0,.35);
	}	
	#PageBody #MainContent #RelatedInformationBar li:hover a,
	#PageBody #MainContent #RelatedInformationBar li a:focus{
		text-decoration:underline;
		cursor:pointer;
	}	
	#PageBody #MainContent #RelatedInformationBar li:hover a {
		background:transparent;
	}

	#PageBody #MainContent #RelatedInformationBar li a{
		display:block;
		color:#001871;
		height:60px;
		width:100%;
		text-decoration:none;
		padding-left:10px;
	}	
	
	#PageBody #MainContent #RelatedInformationBar li a span{
		height:60px;
		display:table-cell;
		max-width:260px;
		vertical-align:middle;
		line-height:1.5em;
	}		
	/* NAEP Footer ------------------------------------------------------------------ */

	#naepFooter {
		position: relative;
		display:flex;
		justify-content: space-between;
		background: #f2ede2;
		color: #001871;
		font-family: "Open Sans", Verdana, sans-serif;
		font-size:14px;
		height:171px;
		padding:30px 60px;
		border-top:3px solid #001871;
	}

		/* NAEP Footer Objects ---------------------------------------------------------- */
		#naepFooter .li-column {
			display: inline-block;
			margin-left: 0;
			padding-left: 0;
			vertical-align: top;
			margin-right:30px;
		}

		#naepFooter .li-column:last-child {
			margin-right:0;
		}	
		#naepFooter #footer-links> ul {
			margin-top:0 !important;
		}	
		#naepFooter ul {
			padding: 0;
			list-style-type: none;
		}
		#naepFooter a:link,
		#naepFooter a:visited {
			color: #001871;
			text-decoration: none;
			line-height:2em;
		}
		
		#naepFooter a:focus,
		#naepFooter a:hover,
		#naepFooter a:active {
			color: #004c97;
			text-decoration: underline;
		}
		#naepFooter a:focus{
			outline:3px solid #c69214;
			outline-offset:2px;
		}
		#naepFooter #footerFollowBox {
			display:inline-block;
			font-size: 14px;
			margin-top:30px;
		}
		#naepFooter .follow-text {
			margin-bottom:5px;
		}
		
		#naepFooter #footerFollowBox a {
			display:inline-block;
			margin-right:10px;
		}
		#naepFooter #footerFollowBox .follow-icon{
			transition: all .3s ease-in-out;
			-moz-transition: all .3s ease-in-out;
			-webkit-transition: all .3s;
		}
		#naepFooter #footerFollowBox .follow-icon:hover {
			opacity:.6;
		}

#FollowBar_small .follow-icon img, #FollowBar .follow-icon {
	transition: all .2s ease-in-out;
}

	#FollowBar_small .follow-icon img:hover, #FollowBar .follow-icon:hover {
		transform: scale(1.1);
	}
	
	
	
	#naepFooter #footerNaepLogo {
		display: inline-block;
		-moz-transition: all .3s ease-in-out;
		-webkit-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
		#naepFooter #footerNaepLogo a img {

			-moz-transition: all .3s ease-in-out;
			-webkit-transition: all .3s ease-in-out;
			transition: all .3s ease-in-out;			
		}
		#naepFooter #footerNaepLogo a img:hover {
			
			opacity:.6;
		}