/*
NOTES: 2012 Phase 1/2 redesign. Play & Learn Activities

Site: http://fpdev/fp.aspx?st=30&e=playandlearn&ccat=play_and_learn
Start Date: 01 24 12 Barcomb
Last Edit: 
	01 25 12 Barcomb

*/

/* ----- Begin Defaults/Resets ----- */

	#subnav{ display:none; }
		
	/* ---------------------------------------------------- INITIALIZE ---------------------------------------------------- */
	* {	margin: 0;	padding: 0;	border: 0;	outline:none;}html, body {	height: 100%;}html {	font-size: 100%; /* IE hack */}body {	font: 100%/1.5 Arial, Helvetica, Sans-Serif;	color: #000;}table,select,input {	font-size: 100%; /* IE hack */}input,select,th,td,li li,li p,td p,blockquote p {	font-size: 1em;}em, i {	font-style: italic;}strong, b {	font-weight: bold;}
	/* ---------------------------------------------------- DEFAULT STYLES ---------------------------------------------------- */
	a:link, a:visited, a:hover, a:active {	text-decoration: none;}a:hover {	text-decoration: underline;}ul {	list-style: none;	padding: 0;	margin: 0;}li {	list-style: none;	list-style-position: outside;	padding: 0;	margin: 0;}h1 {	font-size:2em;}h2 {	font-size: 1.5em;}h3 {	font-size: 1.3em;}h4 {	font-size: 1em;}.right {	float: right;}.left {	float: left;}.clear {	clear: both;}.image-replacement {	text-indent: -9999px;	overflow: hidden;	display: block;}.afterFix:after {	clear: both;	height: 0;	content: ".";	visibility: hidden;	display: block;}
	/* ---------------------------------------------------- PAGE INIT ---------------------------------------------------- */
	body #globalnav {    font-size: 0.8em;}#container {	font-size: .8em;	width: 100%;}#advertisement {	font-size: .8em;}
	/* ---------------------------------------------------- NAVIGATION ---------------------------------------------------- */
	/* ---------------------------------------------------- BODY ---------------------------------------------------- */
	#content {	width: 100%;}
	/* ---------------------------------------------------- SECONDARY NAV ---------------------------------------------------- */
	/* ---------------------------------------------------- BREADCRUMBS ---------------------------------------------------- */
	/* ---------------------------------------------------- FOOTER ---------------------------------------------------- */

/* ----- End Defaults/Resets ----- */

/* --- Cufony --- */	.cufon-loading *{	visibility:hidden !important;	}
	
a, a:hover{
	text-decoration:none;
}		
#template_content{
	background:#a8c93e;
}
#template_content #content_container{
	width:990px;
	background:#fff;
}
#template_content #container{
	padding-bottom:30px;
	position:relative;
}
	.containerCorners{
		background-image:url(/content/v4/img/playandlearn/playlearn_sprite.png);
		height:20px;
		width:20px;
		position:absolute;
	}
	#containerTL{top:0px;left:0px;background-position:0px -145px;}
	#containerTR{top:0px;right:0px;background-position:-25px -145px;}
	#containerBL{bottom:0px;left:0px;background-position:0px -170px;}
	#containerBR{bottom:0px;right:0px;background-position:-25px -170px;}
h1{
	color:#a8c93e;
	font-size:5em;
	padding:32px 30px 25px;
}
h1 a{
	color:#a8c93e;
}
#header{
	background:url(/content/v4/img/playandlearn/playlearn_header.jpg) no-repeat 0 0;
	margin:0 auto;
	width:873px;
	height:252px;
	position:relative;
	padding:25px;
	color:#fff;
}
	h2{
		font-size:2em;
	}
	#header-copy{
		font-size: 1.1em;
		line-height: 1.35em;
		padding: 9px 3px;
		width: 270px;
	}
	/* jcarousel */
	.jcarousel-container{
		margin-left: -7px;
		margin-top: 6px;
		width:540px;
	}
		.ie7 .jcarousel-container{
			margin-top:3px;
		}
	.jcarousel-clip{
		margin:0 30px;
		width:480px;
	}
	#age-list li a{
		background:url(/content/v4/img/playandlearn/playlearn_sprite.png) no-repeat 0 -72px;
		width:120px;
		text-align:center;
		font-size:1.2em;
		padding:9px 0 8px;
		color:#8a5ecb;
		display:block;
	}
		#age-list li a.selected{
			background:url(/content/v4/img/playandlearn/playlearn_sprite.png) no-repeat 0 -108px;
			color:#fff;
		}
	.jcarousel-prev-horizontal a,
	.jcarousel-next-horizontal a{
		background-image:url(/content/v4/img/playandlearn/playlearn_sprite.png);
		position:absolute;
		top:0;
		height:35px;
		width:30px;
		display:block;
		text-indent:-9999px;
	}
	.jcarousel-prev-horizontal a{
		background-position:top left;
		left:0;
	}
	.jcarousel-next-horizontal a{
		background-position:top right;
		right:0;
	}
	.jcarousel-prev-disabled-horizontal a{
		background-position:left -36px;
	}
	.jcarousel-next-disabled-horizontal a{
		background-position:right -36px;
	}
	
#activities{
	position:relative;
	margin:0 auto;
	width: 923px;
}
.activityGroup{
	background:#8a5ecb url(/content/v4/img/playandlearn/playlearn_shadow.png) repeat-x 0 0;
	display:none;
	margin: -11px 0 0; /* negative in 'margin', not 'top' to remove dead space @bottom of div */
	position: relative;
	padding: 5px 25px 20px;
	width: 873px;
	color: white;
	font-size: 1.2em;
}
		.agCorners{
			background-image:url(/content/v4/img/playandlearn/playlearn_sprite.png);
			height:10px;
			width:10px;
			position:absolute;
		}
		#agBL{bottom:0px;left:0px;background-position:-50px -180px;}
		#agBR{bottom:0px;right:0px;background-position:-65px -180px;}

	.ie7 .activityGroup{
		margin-top:-9px;
	}
	.activityGroup h3{
		font-size: 1.5em;
		padding:4px 0 8px;
	}
	.activityGroup li{
		float:left;
		width:25%;
	}
	.activityGroup a{
		color:#fff;
	}
	
#detail-container{
	width:880px;
	margin:35px auto;
}
	#selectedActivity{
		float:left;
		width:470px;
		font-size:1.2em;
	}
		#selectedActivity h2{
			font-size:2.1em;
			padding:15px 0;
			height:25px;
		}
			.ie7 #selectedActivity h2{
				padding:15px 0 0;
			}
		.act-info h3{
			font-size:1.4em;
			padding:10px 0;
		}
		.act-info{
			margin-bottom:15px;
		}
			.act-info li{
				background:url(/content/v4/img/playandlearn/playlearn_dot.gif) no-repeat 1px 7px;
				text-indent: 11px;
				padding-bottom: 8px;
			}
				.act-info li *{
					text-indent: 0px;
				}
					.act-info li h4{
						margin: 10px 0px 5px;
					}
	#learning-skills{
		float:left;
		background:#A8C93E;
		padding:10px;
		width:150px;
		color:#fff;
		margin-left:10px;
		position:relative;
		font-size:1.2em;
	}
		.lsCorners{
			background-image:url(/content/v4/img/playandlearn/playlearn_sprite.png);
			height:10px;
			width:10px;
			position:absolute;
		}
		#lsTL{top:0px;left:0px;background-position:-50px -145px;}
		#lsTR{top:0px;right:0px;background-position:-65px -145px;}
		#lsBL{bottom:0px;left:0px;background-position:-50px -160px;}
		#lsBR{bottom:0px;right:0px;background-position:-65px -160px;}
	
		#learning-skills h3{
			padding-bottom:5px;
			font-size:1.5em;
		}
	#relatedActivities{
		float:right;
		border:1px solid #ccc;
		width:180px;
		padding:10px 15px;
		position:relative;
	}
		.raCorners{
			background-image:url(/content/v4/img/playandlearn/playlearn_sprite.png);
			height:10px;
			width:10px;
			position:absolute;
		}
		#raTL{top:-1px;left:-1px;background-position:-80px -145px;}
		#raTR{top:-1px;right:-1px;background-position:-95px -145px;}
		#raBL{bottom:-1px;left:-1px;background-position:-80px -160px;}
		#raBR{bottom:-1px;right:-1px;background-position:-95px -160px;}

		#relatedActivities h2{
			padding-bottom:10px;
		}
		#relatedActivities a{
			color:#333;
			line-height:1.7em;
		}
		#more-info-shell{
			float:left;
			width:450px;
		}
			#more-info-img{
				margin-right:10px;
				float:left;
				width:160px;
			}
			#activity-brief{
				min-height:115px;
				margin-bottom:15px;
			}
		#credits{
			clear: both;
			width: 450px;
			margin-left: 55px;
			color:#777;
		}
