/* elements */

body {
	margin: 0;
	padding: 0 0 15px 0;
	color: #3b3b2c;
	background: #fff url(graphics/bg.gif);
	font-size: 10pt;	/* small */
	font-family: sans-serif;
	line-height: 140%;
}

a:link, a:visited, a:active, #sidebar_menu span {
	color: #1570bd;
	text-decoration: none;
}

a:hover {
	color: #dc614d;
	text-decoration: none;
}

/* top, header */

#outer_main {
	margin: 0 auto;
	width: 910px;
	background-image: url(graphics/main_bg_border.gif);
}

#main {
	margin: 0 auto;
	width: 900px;
	background-color: #fff;
}

#top_bar {
	margin: 0;
	padding: 0;
	background-color: #9d9d9d;
	color: #fff;
	text-align: center;
	font-size: 10pt;
	font-weight: normal;
}

#header {
	height: 132px;
	background-color: #fff;
/*
	background-image: url(graphics/main_logo.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
*/
}

#header_logo {
	margin-right: 10px;
	float: left;
	border: none;
}

#header_info {
	padding: 5px 15px 0 0;
	width: 220px;
	text-align: right;
	float: right;
	clear: right;
}

#header_info img, #header_info a img {
	line-height: 0;
	border: 0;
}

#header_tel {
	margin: 0 0 0 auto;
	padding: 5px 0 7px 0;
	display: block;
}

#header_info p {
	padding: 0;
	margin: 0;
}

#header_info #header_schoolname {
	padding: 10px 0 0 0;
}

#header_teachers {
	width: 300px;
	float: right;
}

#header_teachers h2 {
	padding: 10px 0 12px 0;
	margin: 0;
	font-size: 100%;
	font-weight: normal;
	text-align: center;
}

.teacher_faces {
	width: 59px;
	display: block;
	text-align: center;
	float: left;
}

.teacher_faces img {
	margin: 0 auto;
	border: none;
	display: block;
	clear: both;
}

#header_teachers p {
	margin: 0;
	padding: 3px 0 0 0;
	text-align: center;
	clear: both;
}

/* menu */

#nav, #nav ul {
	padding: 0;
	margin: 0;
	border-style: solid;
	border-color: #c7c5c2;
	border-width: 1px 0;
	float: left;
	list-style: none;
	background: #fff;
	z-index: 100;	/* for menu to appear above google map */
}

#nav a {
	display: block;
	color: black;
	text-decoration: none;
	padding: 7px 5px;
	padding-left: 10px;
}

#nav a:hover {
	color: #f81616;
}

#menu1, #menu2, #menu3, #menu4, #menu5, #menu6 {
	background: url(graphics/menu_bg.gif);
	background-position: top right;
	background-repeat: no-repeat;
}

#menu7 {
	background: url(graphics/menu_bg.gif);
	background-position: top right;
	background-repeat: no-repeat;
}

#menu1 a, #menu2 a, #menu3 a, #menu4 a, #menu5 a, #menu6 a, #menu7 a {
	background: url(graphics/menu_icons.gif);
	background-repeat: no-repeat;
}

#menu1 a { width: 65px;		background-position: 13px 13px; }	/* subtract link padding 15px from width */
#menu2 a { width: 150px;	background-position: 15px -37px; }
#menu3 a { width: 150px;	background-position: 17px -87px; }
#menu4 a { width: 150px;	background-position: 28px -137px; }
#menu5 a { width: 150px;	background-position: 28px -187px; }
#menu6 a { width: 65px;		background-position: 12px -237px; }
#menu7 a { width: 65px;		background-position: 18px -287px; }

#nav ul {	/* sub menu colors */
	line-height: 1;
	border-color: #8c8b8a;
	border-width: 1px;
	background: #f8f7f6;
}

#nav li:hover, #nav li.sfhover {
	background-position: 0 -35px;
}

#nav li ul li:hover, #nav li ul li.sfhover {
	background-color: #d8d8d8;	/* submenu mouse over */
}

#nav li {
	float: left;
	padding: 0;
}

#nav li a{	/* top menu */
	text-align: center;
}

#nav li ul a {	/* submenu */
	text-align: left;
	background: none;
}

/***** menu2 size settings ****/
#nav #menu2 ul, #nav #menu2 ul li {	/* size of submenu */
	width: 165px;
}

#nav #menu2 ul a {
	width: 150px;	/* for IE6. must be (submenu size) - (a padding) */
}


/***** menu3 size settings ****/
#nav #menu3 ul, #nav #menu3 ul li {	/* size of submenu */
	width: 165px;
}

#nav #menu3 ul a {
	width: 150px;	/* for IE6. must be (submenu size) - (a padding) */
}

#nav #menu3 ul ul {	/* position of second level submenu */
	margin: -28px 0 0 165px;
}

#nav #menu3 ul li a.menu_parent {
	background: url(graphics/menu_arrow.gif) no-repeat;
	background-position: 150px;
}


/***** menu4 size settings ****/
#nav #menu4 ul, #nav #menu4 ul li {	/* size of submenu */
	width: 165px;
}

#nav #menu4 ul a {
	width: 150px;	/* for IE6. must be (submenu size) - (a padding) */
}

/***** menu5 size settings ****/
#nav #menu5 ul, #nav #menu5 ul li {	/* size of submenu */
	width: 165px;
}

#nav #menu5 ul a {
	width: 150px;	/* for IE6. must be (submenu size) - (a padding) */
}


/***** menu6 size settings ****/
#nav #menu6 ul, #nav #menu6 ul li {	/* size of submenu */
	width: 150px;
}

#nav #menu6 ul a {
	width: 135px;	/* for IE6. must be (submenu size) - (a padding) */
}

#nav ul li {
	border: 0; /* inherits size */
}

#nav li ul { /* inherits size */
	margin: 0;
	position: absolute;
	left: -999px;
	height: auto;
}

#nav li ul li {
	border-bottom: 1px dotted gray;
}

#nav li ul li.menu_last {
	border: none;
}

#nav li:hover ul ul, #nav li.sfhover ul ul {
	left: -999px;
}

#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul {
	left: auto;
}


/* include, sidebar */

#menu_shadow {
	width: 900px;
	height: 5px;
	display:block;
}

#contents {
	width: 100%;
	overflow: auto;
	background-image: url(graphics/main_bg.gif);
	background-position: top right;
	background-repeat: repeat-y;
	clear: both;
}

#include {
	width: 650px;
	float: left;
	clear: left;
	background: #fff;
}

#path {
	margin: 0;
	padding: 10px 0 10px 20px;
}

#sidebar {
	width: 250px;
	float: right;
	clear: right;
}

#sidebar_title {
	padding: 2px 0;
	margin: 0;
	text-align: center;
	background-color: #f4e8bc;
	background-image: url(graphics/sidebar_title.gif);
	background-position: bottom left;
	border-bottom: 1px solid #dbcc92;
}

.sidebar_menu {
	margin: 0 auto;
	padding-bottom: 5px;
	display: block;
}

#sidebar_contents {
	padding: 10px;
}

#sidebar_menu {
	padding: 0 0 10px 15px;
	margin: 0;
	list-style-type: none;
}

#sidebar_menu li {
	padding: 0 0 4px 16px;
	margin: 0;
	background: url(graphics/sidebar_menu_arrow.gif) no-repeat;
	background-position: 0 3px;
}

#sidebar_menu li ul {
	padding: 5px 0 0 5px;
	margin: 0;
	list-style-type: none;
}

#sidebar_menu li ul li, #sidebar_menu li ul li.sidebar_last {
	padding: 0 0 4px 16px;
	margin: 0;
	background: url(graphics/sidebar_menu_line.gif) no-repeat;
	background-position: 0 -4px;
}

#sidebar_menu li ul li.sidebar_last {
	background: url(graphics/sidebar_menu_end.gif) no-repeat;
	background-position: 0 -5px;
}

#sidebar_menu span {
	cursor: pointer;
}

.poll_group {
	width: 100%;
	overflow: hidden;
}

.poll_question {
	padding: 0 0 5px 0;
	margin: 0;
	text-align: center;
}

.poll_answer {
	padding: 0 0 0 15px;
	margin: 0;
	width: 145px;
	text-align: left;
	float: left;
	clear: left;
}

.poll_percentage {
	padding: 0 15px 0 0;
	margin: 0;
	width: 55px;
	text-align: right;
	float: right;
	clear: right;
}

.poll_meter {
	margin: 0 0 5px 0;
	padding-left: 17px;	/* 2 extra pixels for the left red curve */
	width: 200px;
	height: 8px;
	background: url(graphics/sidebar_poll_meter_base.gif) no-repeat 15px 0;
	overflow: hidden;
}

.poll_meter img {
	float: left;
	width: 2px;
	height: 8px;
}

.poll_meter_anim {
	width: 0px;
}

.poll_clicks {
	padding: 0 0 0 15px;
	margin: 0 0 10px 0;
}

.poll_thankyou {
	margin: 0;
	padding: 0 0 0 15px;
	font-weight: bold;
	color: #b14747;
}

#sidebar_form_cost {
	padding: 0;
	margin: 0 auto;
	width: 210px;
}

.sidebar_field {
	padding: 2px 0;
}

.sidebar_submit {
	margin: 5px auto 15px auto;
	width: 100px;
	display: block;
	clear: both;
}

#cost_notice {
	margin: 5px auto;
	padding: 3px;
	border: 1px solid #ddc39a;
	background-color: #fae3ae;
	line-height: 115%;
}

#cost_notice2 {
	margin: 5px auto;
	padding: 3px;
	border: 1px solid #ddc39a;
	background-color: #ffffff;
	line-height: 115%;
}

#sidebar_form_moushi {
	padding: 0;
	margin: 0 auto;
	width: 200px;
}

#sidebar_form_moushi p {
	padding: 3px 0 3px 3px;
	margin: 0;
}


/* accordian */

#basic-accordian{
	margin: 20px 20px 15px 20px;
	width: 610px;
	height: 275px;	/* contents height 167px + (bar height 22px * rows) */

	background-image: url(javascript/banner5.jpg);
	background-position: 0 500px;
	background-repeat: no-repeat;
}

.accordion_headings{
	padding: 1px 5px 0 5px;
	height: 20px;
	background: #ddd;
	color: #444;
	border: 1px solid #fff;
	cursor: pointer;
	font-weight: bold;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

.header_highlight, .accordion_headings:hover{
	background: #aaa;
}

.accordion_contents{
	display: none;
	height: 160px;
}

.accordion_contents img{
	border: none;
}


.accordion_header_left {
	float: left;
	margin: 0;
	padding: 0;
	width: 45%;
}

.accordion_header_right {
	float: right;
	margin: 0;
	padding: 0;
	width: 45%;
	text-align: right;
}


/* start area */

.start_notice_yellow {
	margin: 0 0 5px 0;
	padding: 3px 35px 0 30px;
	width: 555px; /* image is 585px */
	height: 33px; /* image is 33px */
	background-image: url(graphics/start_notice_yellow.gif);
	background-repeat: no-repeat;
	background-position: 20px 0;
	display: block;
	color: #3b3b2c;
}

.start_notice_yellow:hover {
	background-position: 20px -37px;
}

/*

	the above ".start_notice_yellow" is used in other places than
	the start page.
	
	the below ".start_notice_long" is only used on start page

*/

.start_notice_long {
	margin: 0 0 5px 0;
	padding: 4px 35px 0 30px;
	width: 585px; /* image is 615px */
	height: 33px; /* image is 33px */
	background-image: url(graphics/start_notice_long.gif);
	background-repeat: no-repeat;
	background-position: 20px 0;
	display: block;
	color: #3b3b2c;
	font-size: 10pt;
}

.start_notice_long:hover {
	background-position: 20px -37px;
}

#start_contents_title1 {
	margin: 0;
	padding: 0 0 10px 0;
	width: 280px;
	text-align: center;
	text-decoration: underline;
	float: left;
	font-size: 100%;
}

#start_contents_title2 {
	margin: 0;
	padding: 0 0 10px 0;
	width: 370px;
	text-align: center;
	text-decoration: underline;
	float: left;
	font-size: 100%;
}

#start_area {
	width: 630px;
	padding-left: 20px;
}

#start_contents {
	padding: 15px 15px 0 15px;	/* IE6 doesnt handle margin very well */
	width: 230px;
	border: 1px #c2baae solid;
	background: url(graphics/start_contents_bg.gif);
	float: left;
	clear: left;
}

.start_contents_title {
	margin: 0 auto;
	display: block;
}

.start_contents_subbox {
	padding: 5px;
	margin: 0 auto 15px auto;
	width: 216px;
	background-color: #f9f7f6;
	border: 1px solid #d5d1cb;
	border-top: none;
	display: block;
}

.start_contents_subbox a img {
	margin: 0 0 0 auto;
	border: none;
	display: block;
	clear: both;
}

#start_contents_diary img {
	padding: 10px 0 0 10px;
	float: left;
}

#start_contents_diary p {
	padding: 3px 2px 3px 0;
	margin: 0;
	text-align: right;
}

#start_contents_diaryimg {
	margin: 0 auto;
	display: block;
}

#start_contents_diarytext {
	padding: 2px 5px 0 5px;
	margin: 0 2px 15px 2px;	/* 226px incl border */
	border: 1px solid #bab9b0;
	border-top: none;
	background-color: #fff;
	background-image: url(graphics/start_diary_shadow.gif);
	background-repeat: repeat-x;
}

#start_contents_diarytext a {
	text-align: right;
	display: block;
	clear: both;
}

#start_courses {
	width: 350px;
	float: right;
}

.start_course {
	padding: 2px 0;
	margin-bottom: 10px;
	width: 332px;	/* image is 335 */
	height: 76px;	/* image is 80 */
	background-image: url(graphics/start_course_bg.gif);
	background-repeat: no-repeat;
	display: block;
}

.start_course:hover {
	background-position: 0 -80px;
}

.start_course img {
	margin: 9px 0 0 12px;
	border: 1px #686762 solid;
	float: left;
	clear: left;
}

.start_course_or {
	padding: 2px 0;
	margin-bottom: 10px;
	width: 332px;	/* image is 335 */
	height: 76px;	/* image is 80 */
	background-image: url(graphics/start_course_or_bg.gif);
	background-repeat: no-repeat;
	display: block;
}

.start_course_or:hover {
	background-position: 0 -80px;
}

.start_course_or img {
	margin: 9px 0 0 12px;
	border: 1px #686762 solid;
	float: left;
	clear: left;
}

.start_course_pur {
	padding: 2px 0;
	margin-bottom: 10px;
	width: 332px;	/* image is 335 */
	height: 76px;	/* image is 80 */
	background-image: url(graphics/start_course_pur_bg.gif);
	background-repeat: no-repeat;
	display: block;
}

.start_course_pur:hover {
	background-position: 0 -80px;
}

.start_course_pur img {
	margin: 9px 0 0 12px;
	border: 1px #686762 solid;
	float: left;
	clear: left;
}

.start_course_yel {
	padding: 2px 0;
	margin-bottom: 10px;
	width: 332px;	/* image is 335 */
	height: 76px;	/* image is 80 */
	background-image: url(graphics/start_course_yel_bg.gif);
	background-repeat: no-repeat;
	display: block;
}

.start_course_yel:hover {
	background-position: 0 -80px;
}

.start_course_yel img {
	margin: 9px 0 0 12px;
	border: 1px #686762 solid;
	float: left;
	clear: left;
}

.start_course_pin {
	padding: 2px 0;
	margin-bottom: 10px;
	width: 332px;	/* image is 335 */
	height: 76px;	/* image is 80 */
	background-image: url(graphics/start_course_pin_bg.gif);
	background-repeat: no-repeat;
	display: block;
}

.start_course_pin:hover {
	background-position: 0 -80px;
}

.start_course_pin img {
	margin: 9px 0 0 12px;
	border: 1px #686762 solid;
	float: left;
	clear: left;
}

.start_course_gre {
	padding: 2px 0;
	margin-bottom: 10px;
	width: 332px;	/* image is 335 */
	height: 76px;	/* image is 80 */
	background-image: url(graphics/start_course_gre_bg.gif);
	background-repeat: no-repeat;
	display: block;
}

.start_course_gre:hover {
	background-position: 0 -80px;
}

.start_course_gre img {
	margin: 9px 0 0 12px;
	border: 1px #686762 solid;
	float: left;
	clear: left;
}

.start_course_blu {
	padding: 2px 0;
	margin-bottom: 10px;
	width: 332px;	/* image is 335 */
	height: 76px;	/* image is 80 */
	background-image: url(graphics/start_course_blu_bg.gif);
	background-repeat: no-repeat;
	display: block;
}

.start_course_blu:hover {
	background-position: 0 -80px;
}

.start_course_blu img {
	margin: 9px 0 0 12px;
	border: 1px #686762 solid;
	float: left;
	clear: left;
}

.start_course_title {
	margin: 0;
	padding: 5px 0 0 10px;
	width: 240px;
	font-weight: bold;
	float: left;
}

.start_course_msg {
	margin: 0;
	padding: 0 0 0 10px;
	color: #52523d;
	width: 240px;
	float: left;
}


/* footer */

#footer {
	padding: 0 10px;
	background-color: #9d9d9d;
	color: #fff;
}

#footer_shadow {
	margin: 0 auto;
	display: block;
}

#footer_text {
	margin: 0 auto;
	padding-bottom: 10px;
	width: 900px;
	text-align: center;
}

#footer_text a {
	color: #52523d;
}

/* help utilities */

.clear {
	clear: both;
}

.clearfix {
	width: 100%;
	overflow: hidden;
}

.bold {
	font-weight: bold;
}

.left {
	float: left;
}

.right {
	float: right;
}

.show {
	display: block;
}

.hide {
	display: none;
}

.removepadding {
	padding: 0;
	margin: 0;
}

.alignright {
	text-align: right;
}

.alignleft {
	text-align: left;
}

.padding_top_5 {
	padding-top: 5px;
}

.padding_top_10 {
	padding-top: 10px;
}

.padding_top_30 {
	padding-top: 30px;
}

.padding_bottom_5 {
	padding-bottom: 5px;
}

.padding_bottom_10 {
	padding-bottom: 10px;
}

.padding_right_10 {
	padding-right: 10px;
}

.padding_right_20 {
	padding-right: 20px;
}

.padding_right_50 {
	padding-right: 50px;
}

.padding_left_10 {
	padding-left: 10px;
}

.padding_left_20 {
	padding-left: 20px;
}

.center {
	margin: 0 auto;
	text-align: center;
	display: block;
}

.centerm {
	margin: 0 auto;
}

.h_choice1 {
	line-height:5%; 
}

.h_choice2 {
	line-height:220%; 
}

.size70 {
	font-size: 70%;
}

.size75 {
	font-size: 75%;
}

.size80 {
	font-size: 80%;
}

.size85 {
	font-size: 85%;
}

.size90 {
	font-size: 90%;
}

.size95 {
	font-size: 95%;
}

.size105 {
	font-size: 105%;
}

.size110 {
	font-size: 110%;
}

.size120 {
	font-size: 120%;
}

.size130 {
	font-size: 130%;
}

.size140 {
	font-size: 140%;
}

.size150 {
	font-size: 150%;
}

.vtop {
	vertical-align: top;
}

.general_form {
	padding: 0;
	margin: 0;
}

.no_ime {
	ime-mode:disabled;
}

.no_border {
	border: none;
}

/* colors */

.red {
	color: #d84430;
}

.orange {
	color: #ef9f40;
}

.yellow {
	color: #ffcf00;
}

.green {
	color: #a5cf42;
}

.blue {
	color: #8cc7ef;
}

.purple {
	color: #a5a6d6;
}

.gray {
	color: #cfcecf;
}

.navy {
	color: #7b92c6;
}

/* dark colors */

.darkred {
	color: #cc1c00;
}

.darkorange {
	color: #e26714;
}

.darkyellow {
	color: #a68e30;
}

.darkgreen {
	color: #007500;
}

.darkblue {
	color: #4d87af;
}

.darkpurple {
	color: #707191;
}

.darknavy {
	color: #6779a2;
}

.pink {
	color: #ff3399;
}

.darkpink {
	color: #cb3462;
}

.darkgray {
	color: #666666;
}