@charset "utf-8";
/* CSS Document */
*{ margin:0; padding:0; list-style:none; text-decoration:none; outline:none; }
a img{ border:none; }
body{ background:url(../images/bg.jpg) repeat-x 0 0 #ffe689; font:normal 14px/20px 'Calibri-Regular', Trebuchet MS, Arial, Helvetica, sans-serif; color:#666; }
.clear{ font-size:0; line-height:0; clear:both; }
.mainDiv{ width:976px; margin:0 auto; }
.bannerPnl{ float:left; width:100%; position:relative; }
.bannerPnl img{ float:left; width:100%; height:auto; }
.bannerPnl a.logo{ position:absolute; left:0; top:0; width:50%; height:50%; text-indent:-9999px; display:block }
.middilePnl{ float:left; width:100%; }
.leftPnl{ float:left; width:247px; }
.leftPnl img{ opacity:0.6; transition: 1s ease;}
.leftPnl img:hover{ opacity:1; transition: 1s ease; }
.menuPnl{ float:left; width:205px; padding:20px 20px 20px; background:#EE8709; border:1px solid #D67B0B; border-radius:6px; position:relative; }
.menuPnl img.mnuIcon{ float:left; display:none;  padding: 0;}
.menuPnl ul{ float:left; width:100%; padding-bottom:30px; }
.menuPnl ul li{ list-style:none; background:url(../images/menuBdr.jpg) repeat-x left bottom;  }
.menuPnl ul li a{ font:18px/25px 'Calibri-Bold'; color:#fff; padding:7px 8px; display:block; }
.menuPnl ul li a:hover, .menuPnl ul li a.active{ color:#ffe785; }
.menuPnl h3{ color:#7E5A36; font:20px/28px 'Calibri-Bold'; padding:10px 0 10px 8px; margin:0 0 0 0; }
.menuPnl p{ color:#fff; font:16px/22px 'Calibri-Regular'; padding:5px 8px; }
.menuPnl p a{ color:#ffe785; }
.funFor{ float:left; width:90%; font:40px/25px 'Calibri-Bold'; color:#fff; padding:0 5%; margin:-100px 0 0; position:relative; }
.funFor span{ color:#fff; font:30px/25px 'Calibri-Regular'; }
.funFor img{ float:right; width:65%; height:auto }
.leftPnlBtm{ float:left; width:247px; position:relative; padding:5px 0 5px 5px; text-align: center; }
.leftPnlBtm img{ float:left; margin:6px 13px; text-align: center; opacity:1; }
.leftPnlBtm img.bbbLogo{ float:none; margin:10px auto 0; display:block; }
.bodyContent{ float:right; width:640px; background:url(../images/bodyContentBg.jpg) repeat-x 0 0 #fff; border:1px solid #fff; padding:20px 30px; border-radius:6px; font:16px/22px 'Calibri-Regular'; color:#333; }
.bodyContent h1{ text-align: left; font: bold 24px/30px Verdana, Geneva, sans-serif; color: #333; padding: 0 0 5px; margin: 0 0 5px; border-bottom: 2px dotted #ee8609;}
.bodyContent h2{ color:#ee8609; font:bold 20px/22px Verdana, Geneva, sans-serif; padding:15px 0; }
.bodyContent h3{ color:#5FB846; font:18px/22px 'Calibri-Bold'; padding:15px 0; }
.bodyContent p{ font:16px/22px 'Calibri-Regular'; color:#333; padding:5px 0; }
.bodyContent img{ background:transparent; padding:4px; border:4px solid #fde585; margin:15px; }
.bodyContent ul{ padding:0 0 10px; margin:0 }
.bodyContent ul li{ font:16px/22px 'Calibri-Regular'; color:#333; list-style:none; padding:0 0 5px 15px; background:url(../images/bullet.png) no-repeat left 8px; display:block }
.bodyContent ol{padding:0 0 10px;margin:0 0 0 25px}
.bodyContent ol li{font:normal 16px/24px 'Calibri-Regular';color:#545454;padding:3px 0 3px 10px;list-style:decimal}
.bodyContent a{ color:#0499c1; }
.bodyContent a:hover{ color:#000; }
.videoPnlOne{ float:left; width:100%; height:350px; position:relative; margin:15px 0; }
.videoPnlOne iframe{ position:absolute; left:0; top:0; width:100%; height:100%; }
.footerPnl{ float:left; width:90%; padding:20px 5%; font:16px/22px 'Calibri-Regular'; color:#333; text-align:center; }
.footerPnl a{ color:#2da6d3; text-decoration:none }
.footerPnl a:hover{ color:#000; text-decoration:none }
div.classroomTxt{ float:left; width:50%; }
div.classroomTxt img{ float:left !important; margin-right:15px !important }
table.classroom{ margin:0 0 20px; width:40%; background:#ee8609; float:right; }
table.classroom td{ padding:5px; background:#fff; color:#333; font:15px/22px 'Calibri-Bold'; text-align:center }
/* Summer Camp */
table.summerCampTbl { width: 100%; border-collapse: collapse; margin:10px 0 }
table.summerCampTbl tr:nth-of-type(odd) {   background: #fff4cb;}
table.summerCampTbl th { background: #3d5462; color: white; font-weight: bold; font:18px/22px 'Calibri-Bold'; }
table.summerCampTbl td{ font:16px/22px 'Calibri-Regular'; color:#333; }
table.summerCampTbl td, table.summerCampTbl th { padding: 6px; border: 1px solid #ccc; text-align: left; }
div.button { background:#ee8609; padding:10px; width: 35%; border:none; cursor:pointer; font:20px/30px 'Calibri-Bold'; color:#fff; border-radius:3px; text-align:center; margin: 0 auto; }
div.button a { color:#fff;   }
div.button a:hover { color:#fff;   }
div.button:hover{ background:#5FB846; color:#fff; }
.programSection .imageWrap img.kidImg{margin:0 auto; border: none; padding: 0; width: 100%;}
.programSection .imageWrap{position: relative;width: 100%;height: auto;margin: 0 auto;}
.programSection .imageWrap:before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(255,255,255,0.7);visibility:hidden; opacity:0;transition:all .3s ease;-o-transition:all .3s ease;-moz-transition:all .3s ease;-webkit-transition:all .3s ease}
.programSection .imageWrap:hover:before{visibility:visible; opacity:1;}
.programSection .imageWrap:hover .clickMore{bottom: 60px;visibility:visible; opacity:1;transition:all .3s ease;-o-transition:all .3s ease;-moz-transition:all .3s ease;-webkit-transition:all .3s ease}
.programSection .clickMore{position: absolute;bottom:0;left: 0;width: 100%;text-align: center;visibility:hidden; opacity:0;}
.programSection .clickMore h1{font: 26px 'Calibri-Bold';color: #EE8709;margin-bottom: 9px; text-align: center;border-bottom: none; text-shadow: 1px 1px 0px #fff;}
.programSection .clickMore p{font: 21px/25px 'Calibri-Bold';color: #EE8709;margin: 0;padding: 0;; text-decoration: underline; text-shadow: 1px 1px 0px #fff;}
.bodyContent .programSection h3{ color:#5FB846; font:18px/22px 'Calibri-Bold'; padding:2px 0 25px; }
@media 
only screen and (max-width: 640px),
(min-device-width: 640px) and (max-device-width: 640px)  {
table.summerCampTbl table, table.summerCampTbl thead, table.summerCampTbl tbody, table.summerCampTbl th, table.summerCampTbl td, table.summerCampTbl tr { display: block;}
table.summerCampTbl thead tr { position: absolute; top:-9999px; left:-9999px; }
table.summerCampTbl tr { border: 1px solid #ccc; }
table.summerCampTbl td { border: none;	border-bottom: 1px solid #eee; 	position: relative;	padding-left: 50%; }
table.summerCampTbl td:before { position: absolute;	top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; }
table.summerCampTbl td:nth-of-type(1):before { content: "Week #"; font:18px/22px 'Calibri-Bold'; }
table.summerCampTbl td:nth-of-type(2):before { content: "Dates"; font:18px/22px 'Calibri-Bold'; }
table.summerCampTbl td:nth-of-type(3):before { content: "Theme"; font:18px/22px 'Calibri-Bold'; }
table.summerCampTbl td:nth-of-type(4):before { content: "Topics"; font:18px/22px 'Calibri-Bold'; }
}
/* Summer Camp */
ul.contactFrm{ float:left; width:100%; padding:15px 0; }
ul.contactFrm li{ float:left; width:100%; padding:0 0 10px; margin:0; background:none }
ul.contactFrm li span{ float:left; width:30%; padding:0 2.5% 0 0; font:16px/30px 'Calibri-Bold'; color:#333; text-align:right; }
ul.contactFrm li input[type="text"]{ width:280px; height:22px; padding:3px 5px; border:1px solid #ccc; background:#fff; font:16px/22px 'Calibri-Regular'; color:#333; border-radius:3px }
ul.contactFrm li select{ width:292px; height:auto; padding:5px; border:1px solid #ccc; background:#fff; font:16px 'Calibri-Regular'; color:#333; border-radius:3px }
ul.contactFrm li textarea{ width:285px; height:100px; padding:5px 5px; border:1px solid #ccc; background:#fff; font:16px/20px 'Calibri-Regular'; color:#333; border-radius:3px }
ul.contactFrm li input[type="submit"]{ background:#ee8609; width: 80%; padding:10px; border:none; cursor:pointer; font:16px 'Calibri-Bold'; color:#fff; border-radius:3px }
ul.contactFrm li input[type="submit"]:hover{ background:#5FB846;  }
.sidebarContent2{ display:none; }
@media all {
body, .menuPnl ul li a, .footerPnl a
	{transition:all 0.4s linear;-o-transition:all 0.4s linear;-moz-transition:all 0.4s linear;-webkit-transition:all 0.4s linear;}
}
@media screen and (max-width: 975px) {
.mainDiv{ width:100%; margin:0; float:left; padding:0; }
.bodyContent{ float:right; width:95%; background:url(../images/bodyContentBg.jpg) repeat-x 0 0 #fff; border:none; padding:20px 2.5%; border-radius:6px; }
.menuPnl{ float:none; width:32px; height:32px; padding:5px 5px 5px 20px; background:#3d5462; border:1px solid #1b2f3a; border-radius:6px; position:absolute; left:-15px; top:100px; display:block; z-index:9999; box-shadow:#999 2px 2px 5px; }
.menuPnl img.mnuIcon{ float:left; display:block; cursor:pointer; }
.menuPnl ul{ display:none; position:absolute; width:200px; padding:10px; background:#3d5462; left:10px; top:43px; border-radius:0 6px 6px 0; box-shadow:#999 2px 2px 5px; }
.menuPnl ul li{ list-style:none; background:none;  }
.menuPnl ul li a{ font:16px/22px 'Calibri-Bold'; color:#fff; padding:7px 8px; display:block; }
.menuPnl ul li a:hover, .menuPnl ul li a.active{ color:#ffe785; }
.leftPnl{ float:none; width:247px; margin:0 auto }
.leftPnl img{ opacity:1; padding-top: 10px;}
.funFor{ float:left; width:90%; font:40px/25px 'Calibri-Bold'; color:#fff; padding:0 5%; margin:25px 0 0; position:relative; display:none }
table.classroom{ margin:0 30% 20px 0; width:70%; background:#ee8609; float:left; }
div.classroomTxt{ float:left; width:100%; }
.sidebarContent{ display:none; }
.sidebarContent2{ display:block; float:left; text-align:center; width:100% }
.sidebarContent2 h3{ color:#7E5A36; font:24px/36px 'Calibri-Bold'; padding:10px 0 0; margin:0 0 0 0; }
.sidebarContent2 p{ color:#333; font:16px/22px 'Calibri-Regular'; padding:5px 0; }
.sidebarContent2 p a{ color:#0499c1; }
.programSection{padding: 20px 0 0;}
.programSection .clickMore h1{font: 22px/30px 'Calibri-Bold'; color: #fff; background-color: #EE8709; margin: 5px 0 0 0; text-shadow: none;}
.programSection .clickMore p{font: 20px/28px 'Calibri-Regular'; color: #fff; background-color: #EE8709; padding: 0 0 5px 0; text-shadow: none;}
.programSection .imageWrap:hover .clickMore{bottom: 28px;}
.programSection .imageWrap:before{visibility: visible; opacity: .2;}
.programSection .clickMore{visibility: visible; opacity: .9; bottom: 28px;}	
}	
@media screen and (max-width: 640px) {
.bodyContent{ font:14px/20px 'Calibri-Regular'; color:#333; }
.bodyContent h1{ text-align:center; font:bold 20px/26px Verdana, Geneva, sans-serif; color:#333; padding:0 0 5px; margin:0 0 5px; border-bottom:2px dotted #ee8609; }
.bodyContent h2{ color:#ee8609; font:bold 16px/22px Verdana, Geneva, sans-serif; padding:10px 0 0; }
.bodyContent p{ font:16px/20px 'Calibri-Regular'; color:#333; padding:5px 0; }
.bodyContent img{ background:transparent; padding:4px; border:4px solid #fde585; margin:15px; width:auto; height:auto; max-width:250px; }
.videoPnlOne{ float:left; width:100%; height:300px; position:relative; margin:15px 0 0; }
ul.contactFrm li span{ float:left; width:100%; padding:0 0 0 0; font:16px/30px 'Calibri-Bold'; color:#333; text-align:left; }
.bodyContent .programSection .imageWrap img.kidImg{width: 100%; height: auto;}
.bodyContent .programSection .clickMore h1{font: 16px 'Calibri-Bold';}
.bodyContent .programSection .clickMore p{font: 14px/16px 'Calibri-Bold';}
.programSection .imageWrap:hover .clickMore{bottom: 24px;}
.programSection .clickMore{visibility: visible; opacity: 1; bottom: 24px;}	
}
@media screen and (max-width: 470px) {
.bodyContent img{ background:transparent; padding:4px; border:4px solid #fde585; margin:10px auto; width:auto; height:auto; max-width:250px; float:none !important; display:block; }
.bodyContent .programSection .clickMore h1{font: 16px 'Calibri-Bold';}
.bodyContent .programSection .clickMore p{font: 14px/16px 'Calibri-Bold';}
.programSection .imageWrap:hover .clickMore{bottom: 10px;}
.programSection .clickMore{visibility: visible; opacity: 1; bottom: 10px;}	
}