@charset "utf-8";
/* CSS Document */

body, html {margin: 0; padding: 0; background-position: top center; background-color: #F6FCFF}
div {font-size:14px; font-family: Arial, Helvetica, sans-serif; line-height: 20px; color: #686868;}
h1 {font-size: 24px; line-height: 30px; color: #00AEEF; margin-bottom:25px; margin-top:25px;}
h2 {font-size: 18px; line-height: 20px; color: #00AEEF; margin-bottom:25px; margin-top:25px;}
h3 {font-size: 16px; line-height: 18px; color: #00AEEF; margin-bottom:0px; margin-top:20px;}
h4 {font-size: 14px; line-height: 20px; }
h5 {font-size: 45px;}
b, strong {font-weight: bold;}
hr {border: none; height: 2px; background-color: #cccccc; color: #cccccf }
img {border: none;}
fieldset {border: none;}
input {border: 0px;}

a:link {color: #00AEF0; text-decoration: none;}
a:visited {color: #00AEF0; text-decoration: none;}
a:hover {color: #00AEF0; text-decoration: underline;}
a:active {color: #00AEF0; text-decoration: none;}

.clear {margin: auto; padding: 0; clear: both; min-height: 15px;}
.smalltext {font-size: 12px;}
.hometext {font-size: 16px; text-align:justify; line-height:25px; font-weight:500;}
.secondarytext {font-size: 15px; line-height:25px; font-weight:500;}
.headercolortext { color: #00AEEF; font-size:16px; }
.homelink {font-size: 17px; font-family: "Times New Roman", Times, serif; font-style:italic;}
.homelinklist {font-size: 16px;}
#wrapper {margin: auto; padding: 0; 
	/* x-browser (meaning ie6 of course) min-height hack. Makes the div also stretch to accomadate more content in ie6 */
	min-height: 500px;
	height:auto !important;
	height: 500px;

background-image: url(images/header-bg.jpg); background-repeat:no-repeat; background-position: top center;}

#header {margin: auto; margin-top:0px; padding: 0; height: 285px; width: 950px;}

#menuwrapper {margin: auto; padding: 0; height: 52px; background-image: url(images/menu-bg.png); background-repeat:no-repeat; background-position: top center; }
#menuinner {margin: auto; padding: 0; width: 950px; color: #028FC4; font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:15px; text-align:center;}

/* The classes below are for the drop-down menu on the top navigation bar */ 
ul.topnav {  
	list-style: none;  
    padding: 0 40px;  
    margin: 0;  
    float: left; 
	/*width:820px;*/ 
}  

ul.topnav li {  
 	float: left;  
    margin: 0;  
    padding: 0 15px 0 0;  
    position: relative;
    z-index:100;
}  

ul.topnav li a {
	color: #028FC4; 
	text-decoration: none; 
    padding: 17px 15px 13px 15px; 
	display: block;
	float: left;   
}  

ul.topnav li a:hover {  
    background-color:#FADA3D;  
}  

ul.topnav li ul.subnav {  
    list-style: none;  
    position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/  
    left: 0; top: 50px;  
    background-color: #F6E89A;  
    margin: 0; 
    padding: 0;  
    padding-bottom:10px;
    display: none;  
    float: left;  
    width: 235px;  
    border: 3px solid #FADA3D;
    border-top:0px;
    -moz-border-radius:0 0 20px 20px;
 	-webkit-border-radius:0 0 20px 20px;  
 	-border-radius:0 0 20px 20px;
}  

ul.topnav li ul.subnav li{  
    margin: 0; padding: 0;  
    clear: both;  
    width: 235px;  
}  

html ul.topnav li ul.subnav li a {  
    float: left;  
    width: 210px;    
    padding-left: 10px; 
    padding-top: 10px;
    padding-bottom: 10px; 
    text-align: left;
    font-weight: normal;
}  

html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/  
    background-color: #00ADEF;
    color: #fff;  
} 

/*highlights the background in the header menu when the link is active, or it's the parent link in the sub-navigation.*/
.current {background-color:#FADA3D;}

.colleft {margin: auto; padding: 0; float: left; width: 450px;}
.colright {margin: auto; padding: 0; float: right; width: 450px;}

.collefthome {margin: auto; padding: 25px 0 0 0; float: left; width: 528px;}
.colrighthome {margin: auto; padding: 50px 0 0 0; float: right; width: 418px; text-align:right;}

.colleftcontact {margin: auto; padding: 25px 0 0 0; float: left; width: 528px;}
.colrightcontact {margin: auto; padding: 76px 0 0 0; float: right; width: 418px; text-align:left;}

.twitterbook {float:left; padding-top:30px; width:77px;}
.twittertext {float:right; padding-top:40px; width:449px;}

#contentwrapper {margin: auto; padding: 0; max-width:1407px; background-image: url(images/content-bg.png); background-position: top center; background-repeat:repeat-x; clear: both; 

/* x-browser (meaning ie6 of course) min-height hack. Makes the div also stretch to accomadate more content in ie6 */
	min-height: 600px;
	height:auto !important;
	height: 600px;

background-color:#D0EBF6; border-left:1px solid #CDEBFF; border-right:1px solid #CDEBFF;}
#content {margin: auto; margin-top:0px; padding: 0; width: 950px;}

#footwrapper {margin: auto; padding: 0; background-image: url(images/footer-bg.jpg); height:55px; background-position: top center; background-repeat: no-repeat; clear: both;}
#copy {margin: auto; padding-top:8px; width: 950px; text-align: left;}
#footerleft{margin: auto; padding:0; float: left; width: 615px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color: #fff;}
#footerright{margin: auto; padding-right: 85px; padding-top:5px; float: right; width: 230px; text-align:right;}

#map {  
   position: relative;  
   width: 700px;  
   height: 285px;  
} 

#map ul {  
  list-style: none;
  padding:0;
  margin:0;  
}
 
#map li {  
  position: absolute;  
  z-index: 10;
  text-indent: -1000em;  
  display: none;  
}


#man {  
  background: url(images/p1hover.png) no-repeat;  
  width: 365px;  
  height: 285px;  
  top: 0px;   
  left: 354px;  
}
  
#boy {  
  background: url(images/p2hover.png) no-repeat;  
  width: 365px;  
  height: 285px;  
  top: 0px;  
  left: 459px;  
}  
#girl1 {  
  background: url(images/p3hover.png) no-repeat;  
  width: 365px;  
  height: 285px;  
  top: 0px;  
  left: 611px;  
} 
#girl2 {  
  background: url(images/p4hover.png) no-repeat;  
  width: 305px;  
  height: 285px;  
  top: 0px;  
  left: 742px; 
} 

#transparent_map {  
  position: absolute;  
  z-index: 20;
  width: 875px;  
  height: 285px;  
  border: none;  
}

#logo {position: absolute; width: 250px; height: 150px; float:left; padding-top:20px; z-index:30;}

.formWrapper{
	width:395px;
}

.searchbox2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#fff;
	background-color:transparent; 
	border:none;
	padding-top:2px;
	width:250px;
}

.formWrapperName{
	background-image:url(images/form-name-bg.png);
	background-repeat:no-repeat;
	height:33px;
	width:376px;
	padding:5px 30px 0 8px;
	clear:both;
	margin-bottom:6px;
	color:#fff;
}

.formWrapperEmail{
	background-image:url(images/form-email-bg.png);
	background-repeat:no-repeat;
	height:33px;
	width:376px;
	padding:5px 30px 0 8px;
	clear:both;
	margin-bottom:6px;
	color:#fff;
}

.formWrapperPhone{
	background-image:url(images/form-phone-bg.png);
	background-repeat:no-repeat;
	height:33px;
	width:376px;
	padding:5px 30px 0 8px;
	clear:both;
	margin-bottom:6px;
	color:#fff;
}

.formWrapperSubmit{
	width:376px;
	padding:5px 30px 10 8px;
	clear:both;
	text-align: right;
	margin-bottom:6px;
}

.textbox {
	background-image:url(images/form-comments-bg.png);
	background-repeat:no-repeat;
	width:376px;
	height:100px;
	margin:3px 0 0 0;
	padding:7px 0 0 7px;
	color:#fff;
}

textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#fff;
	background-color:transparent; 
	border:none;
	padding-top:2px;
	width:350px;
	height:60px; 
}



.learnMoreDiv{

/* x-browser (meaning ie6 of course) min-height hack. Makes the div also stretch to accomadate more content in ie6 */
	min-height: 88px;
	height:auto !important;
	height: 88px;

	background-repeat:no-repeat; 
	padding-top:20px; 
	padding-right:30px;
}	

/*image rollover button*/
.learnMore
{
  display: block;
  width: 201px;
  height: 46px;
  background: url("images/learnmore-button.png") no-repeat 0 0;
  margin-left:auto;
}

.learnMore:hover
{ 
  background-position: 0 -46px;
}

.learnMore span
{
  display: none;
}







.blueDivContentTitle {
height:97px;
width:870px;
margin: 0;
border: 0;
padding: 0;
}

.specNeedsContentTitle {
background: url(images/special_needs_title_bg2.png) no-repeat 0 0 transparent;
}

.whoWeAreContentTitle {
background: url(images/who_are_we_title_bg2.png) no-repeat 0 0 transparent;
}

.eventsContentTitle {
	background: url(images/events_title_bg2.png) no-repeat 0 0 transparent;
}

.resourcesContentTitle {
	background: url(images/resources_title_bg2.png) no-repeat 0 0 transparent;
}

.summerSchoolContentTitle {
	background: url(images/summer_school_title_bg2.png) no-repeat 0 0 transparent;
}

.tutoringContentTitle {
	background: url(images/tutoring_title_bg2.png) no-repeat 0 0 transparent;
}

.creditCoursesContentTitle {
	background: url(images/credit_courses_title_bg2.png) no-repeat 0 0 transparent;
}

.adultEducationContentTitle {
	background: url(images/adult_education_title_bg2.png) no-repeat 0 0 transparent;
}

.englishTrainingContentTitle {
	background: url(images/english_training_title_bg2.png) no-repeat 0 0 transparent;
}

.assessmentContentTitle {
	background: url(images/assessment_title_bg2.png) no-repeat 0 0 transparent;
}

.corporateContentTitle {
	background: url(images/corporate_title_bg2.png) no-repeat 0 0 transparent;
}

.blueDivContent {
	background: url(images/div-content-bg3.png) no-repeat 0 0 transparent;

	width:870px;
	margin: 0;
	border: 0;
	padding: 6px;
}

.blueDivContentText {
	padding-right:35px; 
	padding-top:0px; 
	padding-bottom:10px;
	padding-left:25px;

	/* x-browser (meaning ie6 of course) min-height hack. Makes the div also stretch to accomadate more content in ie6 */
	min-height: 250px;
	height:auto !important;
	height: 250px;
}

.eventsDivContent {
	background: url(images/div-content-bg-events.png) no-repeat 0 0 transparent;

	/* x-browser (meaning ie6 of course) min-height hack. Makes the div also stretch to accomadate more content in ie6 */
	min-height: 250px;
	height:auto !important;
	height: 250px;

	width:870px;
	margin: 0;
	border: 0;
	padding: 6px;
}
.blueDivContentExpanded {
	background: url(images/rounded-div-body-bg.png) repeat-y 0 0 transparent;

	/* x-browser (meaning ie6 of course) min-height hack. Makes the div also stretch to accomadate more content in ie6 */
	min-height: 250px;
	height:auto !important;
	height: 250px;

	width:870px;
	margin: 0;
	border: 0;
	padding: 6px;
}

.blueDivContentBottom {
	background: url(images/rounded-div-bottom-bg.png) no-repeat 0 0 transparent;
	height:40px;
	width:870px;
	margin: 0;
	border: 0;
}

.blueBulletList {
	list-style: url(images/bullet.png) disc;	
}

.justified {
	text-align:justify;
}
#tutoringtext ,
#trainingtext ,
#whatweoffertext ,
#howwehelptext 
{
	/* x-browser (meaning ie6 of course) min-height hack. Makes the div also stretch to accomadate more content in ie6 */
	min-height: 250px;
	height:auto !important;
	height: 250px;

}