/* CSS Document */
body {
  background:#EEEEE7;
  margin:10px 0;
  padding:0px 5px 15px 10px;
  font:small/1.6em Verdana, Arial, Helvetica, sans-serif;
  text-align:center;
  color:#333;
  }


h3  {
	
	color: #f059a0;
	font-size: small;
	font-weight: bolder;
	font-style: normal;
}

h4  {
	
	color: #f059a0;
	font-size: small;
	font-weight: bold;
	font-style: normal;
}

h5  {
	
	color: #f059a0;
	font-size:smaller;
	font-weight: bold;
	font-style: normal;
	padding:0;
	margin: 2px;
	text-align:center;
}
.tiny {
	font-size:9px ;
}	
/*stop WinIE6 from calculating width of
italicized text twice, thereby wrecking layout
----------------------------------------------- */

* html em {
  font-style: normal;
  font-weight: bold;
  }


/* Page
----------------------------------------------- */
#page {
  background:#fff url("images/pg_topright.gif") no-repeat right top;
  margin:0 auto;
  padding-top:15px;
  width:755px;
  text-align:left;
  }
#pagea {
  background:url("images/pg_right.gif") repeat-y right top;
  width:755px;
  }
#pageb {
  background:url("images/pg_bot.gif") no-repeat right bottom;
  padding:0 20px 20px 15px;
  width:720px;
  }
  
/* Header
----------------------------------------------- */  
  #header {
  float:left;
  width:720px;
  padding-bottom:5px;
  border: 0;
  }
  
  #header a {
  border-width:0;
  }

a img {
  border-width:0;

}
h1 a, h2 a, h3 a, h4 a {
  border-width:0;
  }


/* Nav
----------------------------------------------- */
/* Nav Images
----------------------------------------------- */


#nav {
  background:#f059a0 url("images/bottomcorners.gif") no-repeat left bottom;
  float:left;
  width:720px;
  margin-bottom:10px;
  color:#fff;
  }
html>body #nav {
  background-image:url("images/botcorners.gif");
  }
#nav ul {
  /*background:url("images/shadow.gif") repeat-x;*/
  height:36px;
  margin:0;
  padding:0 0;
  list-style:none;
  }
#nav li {
  float:left;
  margin:0;
  padding:0;
  background-image:none;
  line-height:normal;
  text-indent:0;
  }
#nav li a, #nav li strong {
 background-repeat:no-repeat;
  background-position:0 0;
  display:block;
  float:left;
  height:36px;
  /* Get the text strings off the screen */
  text-indent:-10000px;
  }
/* nav buttons are 3 images stacked upon each other - each 36px high  - navigator just slides them up and donw - very slick!*/
#nav li strong {
  background-position:0 -36px;
  }
#nav li a:hover {
  background-position:0 -72px;
  }
  
  
#nav ul {
/*  padding:0 71px;  took out 71 for cpac*/
  padding:0;
  
  }
  
/* change the widths to match the width of the button grapageheadic */  
#nav1 a, #nav1 strong {
  background:url("images/btnMission.gif");
  width:80px;
  }
#nav2 a, #nav2 strong {
  background:url("images/btnAbout.gif");
  width:80px;
  }
#nav3 a, #nav3 strong {
  background:url("images/btnImportance.gif");
  width:80px;
  }
#nav4 a, #nav4 strong {
  background:url("images/btnDirectors.gif");
  width:80px;
  }
#nav5 a, #nav5 strong {
  background:url("images/btnTeachers.gif");
  width:80px;
  }
#nav6 a, #nav6 strong {
  background:url("images/btnClass.gif");
  width:80px;
  }
#nav7 a, #nav7 strong {
  background:url("images/btnCalendar.gif");
  width:80px;
  }  

#nav8 a, #nav7 strong {
  background:url("images/btnAnnounce.gif");
  width:80px;
  }  
#nav9 a, #nav7 strong {
  background:url("images/btnContact.gif");
  width:80px;
  }  
  



.qte { font-style: italic;
}

.bld { font-weight:bold;
}



#SubPicBox {
	float: left;
	width:520px;
	height:100px;
	margin-top:3px;
} 

#SubSpacer {
	float:right;
	height:100px;
	width: 200px;
	
}

#SubSpacer a {
	text-decoration:none;
	color:#f059a0;	
}	
#SubSpacer h4 {
	text-align:center;
	}
	
#SubSidebar {
	float:right;
	width:200px;
	height:350px;
	clear: both;
	background:url(images/balletshoespic.gif) no-repeat left top;
	/*background: #cde5ef url(images/sbarcorners.gif) no-repeat left bottom; */
}

#CampSidebar {
	float:right;
	width:200px;
	height:350px;
	clear: both;
	padding-left: 20px;
	padding-top: 15px;
	
}

#SBTop p{
	background: #cde5ef url(images/sbarcornerstop.gif) no-repeat left top;
}

#SubSidebar p {
	color: #6a6afe;
	text-align: left;
	padding-left: 10px;
}


#SubContent {
	float: left;
	width:480px;
	margin-left:10px;
	margin-top: 0px;
	padding-top: 10px;
	padding-right: 10px;
}  

#SubContent h4 {
	text-align:center;
}	
/*#SubContent2 {
	float: left;
	width:510px;
	margin-top: 0px;
	padding-top: 10px;
	padding-right: 10px;
}  */

/* Footer
----------------------------------------------- */
#footer {
  background:#f059a0 url("images/bottomcorners.gif") no-repeat left bottom;
  clear:both;
  width:720px;
  border-top:10px solid #fff;
  font-size:85%;
  line-height:3.2em;
  color:#dee;
  text-align:center;
  }


#photobox {
	border:thin solid #999999;
	float:left;
	width:136px;
	height:163px;
	margin: 5px;
	padding: 5px;
}
#emptybox {
	
	float:left;
	width:136px;
	height:163px;
	margin: 5px;
	padding: 5px;
}
#photobox a {
	color:#f059a0;
	text-decoration: none;
	
} 
#bigphotobox {
	
	/*border:thin solid #999999;*/
	float:left;
	width:250px;
	height:313px;
	padding: 0px;
	margin: 5px 60px;
}

#widephotobox {
	
	/*border:thin solid #999999;*/
	float:left;
	width:600px;
	height:400px;
	
}
#julietbox {
	
	border:thin solid #999999;
	float:left;
	width:307px;
	height:443px;
	padding: 0px;
	margin: 5px 50px;
}

#ballerina {

	background: #fff url("images/ballerina.jpg") no-repeat top left;
	float:left;
	width:285px; 
	height: 175px;
	margin:5px 100px;
	padding:5px;
}

.opal  {
	
	color: #800080;
	font-size: small;
	font-weight: bolder;
	font-style: italic;
	text-align:left;
}

.sapphire  {
	
	color: #000080;
	font-size: small;
	font-weight: bolder;
	font-style:italic;
    text-align:left;
	
}

.ruby  {
	
	color: #800000;
	font-size: small;
	font-weight: bolder;
	font-style:italic;
	text-align:left;

}

.emerald  {
	
	color: #008000;
	font-size: small;
	font-weight: bolder;
	font-style:italic;
    text-align:left;
	
}

.amethyst  {
	
	color: #9900FF;
	font-size: small;
	font-weight: bolder;
	font-style:italic;
    text-align:left;
	
}
.black  {
	
	color: #000000;
	font-size: small;
	font-weight: bolder;
	font-style:italic;
    text-align:left;
	
}
 .giant {
	color: #000000;
	font-size: 48px;
	font-weight: bolder;
	font-style:italic;
    text-align:left;

}