/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://opensource.org/licenses/mit-license.php	*/
	
	/*---------Resets---------*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}


/*---------Fonts---------*/

@font-face {
    font-family: 'TeXGyreAdventorRegular';
    src: url('/earlylearning/fonts/adventor/texgyreadventor-regular-webfont.eot');
    src: url('/earlylearning/fonts/adventor/texgyreadventor-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/earlylearning/fonts/adventor/texgyreadventor-regular-webfont.woff') format('woff'),
         url('/earlylearning/fonts/adventor/texgyreadventor-regular-webfont.ttf') format('truetype'),
         url('/earlylearning/fonts/adventor/texgyreadventor-regular-webfont.svg#TeXGyreAdventorRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TeXGyreAdventorItalic';
    src: url('/earlylearning/fonts/adventor/texgyreadventor-italic-webfont.eot');
    src: url('/earlylearning/fonts/adventor/texgyreadventor-italic-webfont.eot?#iefix') format('embedded-opentype'),
url('/earlylearning/fonts/adventor/texgyreadventor-italic-webfont.woff') format('woff'),
url('/earlylearning/fonts/adventor/texgyreadventor-italic-webfont.ttf') format('truetype'),
url('/earlylearning/fonts/adventor/texgyreadventor-italic-webfont.svg#TeXGyreAdventorItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TeXGyreAdventorBold';
    src: url('/earlylearning/fonts/adventor/texgyreadventor-bold-webfont.eot');
    src: url('/earlylearning/fonts/adventor/texgyreadventor-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/earlylearning/fonts/adventor/texgyreadventor-bold-webfont.woff') format('woff'),
         url('/earlylearning/fonts/adventor/texgyreadventor-bold-webfont.ttf') format('truetype'),
         url('/earlylearning/fonts/adventor/texgyreadventor-bold-webfont.svg#TeXGyreAdventorBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TeXGyreAdventorBoldItalic';
    src: url('/earlylearning/fonts/adventor/texgyreadventor-bolditalic-webfont.eot');
    src: url('/earlylearning/fonts/adventor/texgyreadventor-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
url('/earlylearning/fonts/adventor/texgyreadventor-bolditalic-webfont.woff') format('woff'),
url('/earlylearning/fonts/adventor/texgyreadventor-bolditalic-webfont.ttf') format('truetype'),
url('/earlylearning/fonts/adventor/texgyreadventor-bolditalic-webfont.svg#TeXGyreAdventorBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'LunchBox';
    src: url('/earlylearning/fonts/LunchBox/LunchBox.eot'); /* IE9 Compat Modes */
    src: url('/earlylearning/fonts/LunchBox/LunchBox.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('/earlylearning/fonts/LunchBox/LunchBox.woff') format('woff'), /* Modern Browsers */
         url('/earlylearning/fonts/LunchBox/LunchBox.ttf') format('truetype'), /* Safari, Android, iOS */
         url('/earlylearning/fonts/LunchBox/LunchBox.svg#LunchBox') format('svg'); /* Legacy iOS */
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

@font-face {
    font-family: 'LunchBoxBold';
    src: url('/earlylearning/fonts/LunchBox/LunchBox-Bold.eot'); /* IE9 Compat Modes */
    src: url('/earlylearning/fonts/LunchBox/LunchBox-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('/earlylearning/fonts/LunchBox/LunchBox-Bold.woff') format('woff'), /* Modern Browsers */
         url('/earlylearning/fonts/LunchBox/LunchBox-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
         url('/earlylearning/fonts/LunchBox/LunchBox-Bold.svg#LunchBox-Bold') format('svg'); /* Legacy iOS */
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

@font-face {
    font-family: 'LunchBoxLight';
    src: url('/earlylearning/fonts/LunchBox/LunchBox-Light.eot'); /* IE9 Compat Modes */
    src: url('/earlylearning/fonts/LunchBox/LunchBox-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('/earlylearning/fonts/LunchBox/LunchBox-Light.woff') format('woff'), /* Modern Browsers */
         url('/earlylearning/fonts/LunchBox/LunchBox-Light.ttf') format('truetype'), /* Safari, Android, iOS */
         url('/earlylearning/fonts/LunchBox/LunchBox-Light.svg#LunchBox-Light') format('svg'); /* Legacy iOS */
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}


/*---------Independent of Layout---------*/

body {
	
	margin: 0;
	font-family: 'TeXGyreAdventorRegular', sans-serif;
	font-size: 18px;
	-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
	background-color: #8D8D8D;
	/*background-color: #fff;*/
}

.img-max {
	max-width: 100%;	
}

.img_left { /* Image sticks to the left */
	width:auto;
	float:left;
	margin:5px 15px 5px 5px;
}

.img_right { /* Image sticks to the right */
	width:auto;
	float:right;
	margin:5px 5px 5px 15px;
}

.img_middle {
	width: auto;
	vertical-align: middle;
	margin:5px 5px 5px 5px;
}

.img_bottom {
	width: auto;
	vertical-align: bottom;
	margin:5px 5px 5px 5px;
}

.clear {
	clear: both;
}

.float_right {
	float: right;
}

.float_left {
	float: left;
}

/* general hypertext links */
a:link {
	text-decoration: none; 
	color: #6E4A9A;}	


a:hover {
	text-decoration: none;
	color: #FB5F7C;
	/*font-weight: bold;*/
}	

.noDisplay {
	display: inline;	
}

.center {
	text-align: center;	
}

.paddingLeft {
	padding-left: 10px;
}

.topMargin {
	margin-top: 15px;
}

.paddingRight {
	padding-right: 10px;
}

hr {
	border-top: 1px solid #8c8b8b;
	padding-top: 5px;
	padding-bottom: 5px;
}




/*	Default Layout
	92px columns, 24 px gutters, 72 px margins, 1234px total (extra space for scrollbars)
	-------------------------------------------------------------------------------
cols    1    2     3     4     5     6     7     8     9     10     11     12     13
px      68   160   252   344   436   528   620   712   804   896	988    1050   1142 */




.mobile {
	display: none !important; /* This is for the mobile menu, this keeps it hidden in the bigger versions */
}

#header {
	width: 100%;
	background-color: #fff;
	/*padding-left:  20%;*/
	text-align: center;
	margin-bottom: 0;
	margin-top: 0;
	height: 240px;
	padding-top: 20px;
	
}

/*.header-wrapper {
	width: 1172px;
}*/

#header img {
	margin-right: auto;
	margin-left: auto;
	margin-top: 0;
		max-width: 100%;
	
}



.main {
	background-color: #A0DBD8;
	margin-top: 0;
	
}

.content {
	width: 1172px;
	padding-top: 20px;
	margin-left: auto;
	margin-right: auto;
}

.content-text {
	background-color: #fff;
	padding: 30px 50px 30px 50px;
	-webkit-border-radius: 15px 15px 15px 15px;
border-radius: 15px 15px 15px 15px;
	margin-top: 15px;
	
}

.content-text img {
	max-width: 100%;
}

.nav {
	text-align: center;
	color: #FB5F7C;
	
}

.nav a {
	text-decoration: none;
	font-size: 18px;
	/*font-weight: bold;*/
	-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
	background: #7B51A9;
color: #fff;
/*box-shadow: 0 6px #6E4A9A;*/
	border: #6E4A9A solid thick;
-webkit-transition: none;
-moz-transition: none;
transition: none;
/*border: none;*/
padding: 5px 30px;
display: inline-block;
margin: 15px 20px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 700;
outline: none;
	
}



.nav a:hover {
	color: #6E4A9A;
	background-color: #A0DBD8;
	text-decoration: none;
	
}

.episodes {
	
	padding-top: 20px;
	
}

.video-box {
	width: 350px;
	padding: 10px;
	float: left;
	text-align: center;
	font-size: 30px;
	font-family: 'LunchBoxBold', sans-serif; 
	
}

.video-box img {
	width: 350px;
	border: #6E4A9A thick solid;
}

.video-box a:link {
	text-decoration: none; 
	color: #6E4A9A;}	


.video-box a:hover {
	text-decoration: none;
	color: #6E4A9A;
	
}

.feedback {
	width: 350px;
	padding: 10px;
	float: left;
	text-align: center;
	font-size: 30px;
	font-family: 'LunchBoxBold', sans-serif; 
	
}

.feedback img {
	width: 350px;
	/*border: #6E4A9A thick solid;*/
    border-radius: 30px;
    padding-top: 8px;
}

.feedback a:link {
	text-decoration: none; 
	color: #6E4A9A;}	


.feedback a:hover {
	text-decoration: none;
	color: #6E4A9A;
	
}

h1 {
	font-size: 70px;
	font-family: 'LunchBoxBold', sans-serif; 
	color: #FC5574;
	text-align: center;
}

h2 {
	font-size: 50px;
	font-family: 'LunchBoxBold', sans-serif; 
	color: #6E4A9A;
	
}

.footnote {
	font-size: 10px;
	vertical-align: super;
}

.characters{
	width: 90%;
	/*margin-left: 50px;
	margin-right: 50px;*/
	font-size: 20px;
}

.characters img {
	padding-left: 30px;
	padding-right: 30px;
}

.characters h2 {
	font-size: 70px;
}

.question {
	background-image:url(../images/contact_question.png);
	background-repeat: no-repeat;
	background-position: right;
	background-size: contain;
	width: 90%;
}

.activity-img {
	float: left;
	padding-right: 20px;
	padding-left: 20px;
}


/* footer container */

.prefooter {
	background-color: #A0DBD8;
	background-image: url(../images/buildings2.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	height: 400px;
	margin-bottom: 0;
}



.footer-wrapper {
	width: 100%;
	background-color: #4D4D4D;
 	margin: 0;
    padding: 20px;
}

#footer {
	width: 1170px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	color: #fff;
	text-align: center;
}

#footer a {
    text-decoration: underline;
    color: #CDBEE0;
}


#footer a:hover {
	color: #E1F9D7;
}

#footer img {
	height: 50px;
	/*border: #6E4A9A medium solid;*/
	border: #A7A7C8 medium solid;
	
}





/*		10 Column Layout: 992px. 
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

@media only screen and (min-width: 992px) and (max-width: 1221px) {
	
	.content {
	width: 990px;
}
	
	.video-box {
	width: 300px;
	padding: 10px;
	font-size: 30px;
	
	
}
	.video-box img {
	width: 300px;
}
    
    .nav a {
	text-decoration: none;
	font-size: 16px;
	/*font-weight: bold;*/
	-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
padding: 5px 20px;
margin: 15px 10px;
    }
    
    .feedback {
	width: 300px;
	padding: 10px;
	font-size: 30px;
	
	
}
	.feedback img {
	width: 300px;
}
	
	.characters{
	width: 100%;
	font-size: 20px;
}
	
	.characters img {
	padding-left: 15px;
	padding-right: 15px;
}
	
	#footer {
	width: 990px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	color: #fff;
	text-align: center;
}
	
}

/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	
	#header {
	height: auto;
	
}

	.content {
	width: 750px;
}
	
	.nav a {
	text-decoration: none;
	font-size: 15px;
	/*font-weight: bold;*/
	-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
padding: 5px 20px;
margin: 15px 5px;

	
}
	
	.video-box {
	width: 230px;
	padding: 10px;
	font-size: 30px;
	
	
}
	.video-box img {
	width: 230px;
}
    
    .feedback {
	width: 230px;
	padding: 10px;
	font-size: 30px;
	
	
}
	.feedback img {
	width: 230px;
}
	
	.characters{
	width: 100%;
	font-size: 20px;
}
	
	.characters img {
	padding-left: 15px;
	padding-right: 15px;
}
	
	.question {
	background-image:url(../images/contact_question_sm.png);
	background-repeat: no-repeat;
	background-position: right;
	background-size: auto;
	width: 90%;
}
	
	#footer {
	width: 750px;
}

}

/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436  */ 

@media only screen and (min-width: 480px) and (max-width: 767px) {

.mobile {
	display: block !important;
}

.menu-hidden {
	display: none !important;
}

.menu-unhidden {
	display: block !important;	
}

#header {
	height: auto;
	
}

	.content {
	width: 460px;
}
	
	.nav a {
	text-decoration: none;
	font-size: 12px;
	/*font-weight: bold;*/
	-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
padding: 5px 15px;
margin: 5px 5px;

	
}
	
	.video-box {
	width: 200px;
	padding: 10px;
	font-size: 30px;
	
	
}
	.video-box img {
	width: 200px;
}
    
    .feedback {
	width: 200px;
	padding: 10px;
	font-size: 30px;
	
	
}
	.feedback img {
	width: 200px;
}
	
	.characters{
	width: 100%;
	font-size: 20px;
}
	
	.characters img {
	padding-left: 15px;
	padding-right: 15px;
}
	
	.question {
	background-image:none;
	
}
	
	.activity-img {
	float: none;
	align-content: center;
	padding-right: 30px;
	padding-left: 30px;
}
	
	#footer {
	width: 460px;
}



}

/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252 */   

@media only screen and (max-width: 479px) {

.mobile {
	display: block !important;
}

.menu-hidden {
	display: none !important;
}

.menu-unhidden {
	display: block !important;	
}

#header {
	height: auto;
	
}

	.content {
	width: 310px;
}
	
	.content-text {
	padding: 20px 20px 20px 20px;

	
}
	
	.nav a {
	text-decoration: none;
	font-size: 12px;
	/*font-weight: bold;*/
	-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
padding: 5px 5px;
margin: 5px 2px;

	
}

	h1{
		font-size: 50px;
	}
	
	h2 {
		text-align: center;
		font-size: 40px;
	}
	
	.video-box {
	width:300px;
	padding: 10px;
	font-size: 30px;
	
	
}
	.video-box img {
	width: 300px;
}
    
    .feedback {
	width:300px;
	padding: 10px;
	font-size: 30px;
	
	
}
	.feedback img {
	width: 300px;
}
    
	
	.characters{
	width: 100%;
	font-size: 20px;
}
	
	.characters img {
	padding-left: 15px;
	padding-right: 15px;
}
	
	.question {
	background-image:none;
	
}
	
		.activity-img {
	float: none;
			align-content: center;
	padding-right: 10px;
	padding-left: 10px;
}
	
	#footer {
	width: 310px;
}

}