/*<meta http-equiv="content-type" content="text/html; charset=utf-8">*/

/* basic element rules */


html {
      max-width: 1000px;
      margin: 0 auto;
      background: #eee; /* Fills the page */
      height: 800px;
      position: relative; /* Fix for absolute positioning */
}


BODY {
	margin: 0px 0px 50px 0px;
	padding: 0px;
	background-color: #fff;
        height: 800px;
	font-size: 10pt;
	line-height: 1.5em;

}

/* fonts */
BODY, TD, P, INPUT, SELECT, TEXTAREA, OPTION, H1, H3, H4, H5, H6 {
	font-family: Georgia, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

H1  {
	font-size: 10.5pt;
             color: #0000ff;
}

H2  {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
}

TD {
	font-size: 10pt;
	line-height: 1.5em;
}

P {
	margin: 0px 0px 20px 0px;
}

H2 {
	font-size: 16pt;
}

H5 {
	font-size: 10pt;
	padding-top: 10px;
	padding-left: 22px;
	background: url(../images/headermark.gif) no-repeat transparent 0% 90%;
}

H6 {
	font-size: 10pt;
	padding-top: 10px;
	padding-left: 36px;
	background: url(../images/new_a.gif) no-repeat transparent 0% 90%;

}

IMG {
	border: none;
	margin: 0px;
	padding: 0px;
}

FORM {
	margin: 0px;
	padding: 0px;
}
	
/* links */

A:link, A:visited {
	color: #c22;
	font-weight: bold;
	text-decoration: none;
}

A:hover {
	color: #f72;
}

/* layout */


/* ------   general layout   ------ */
/*
     Three-column layout based on oringal from glish.com - http://www.glish.com/css/7.asp
	 
	 banner - school logo and contact/location/language menu
	 menu - navigation menu on the left side of every page
	 main - main content area for most pages
	 special - sidebar area for items of special importance

*/

#menucontent {
	display: block;		/* just in case print css was loaded */
	position: absolute;
	left:10px;
	top:140px;
	width:160px;
}

#maincontent {
	padding: 0px 0px 30px 0px;
	background:#fff;
	margin-bottom: 20px;
  	margin-left: 200px;
  	margin-right:190px;
	voice-family: "\"}\"";	/* this trips up IE 5.0 Windows so it doesn't parse the styles below */
	voice-family: inherit;
  	margin-left: 200px;
  	margin-right:190px;

}

html>body #maincontent {
  		margin-left: 200px;
  		margin-right:211px;
}

#specialcontent {
	display: block;		/* just in case print css was loaded */
	position: absolute;
	right:20px;
	top:140px;
	width:150px;
	background-color:#fff;
	text-align: center;
	margin: auto;
}


/* ------   banner area   ------ */


#bannerwrap {
	margin-bottom: 5px;
}

#bannerpicture_wrap {
	background-color: #592B22;
	height: 75px;
	margin-bottom: 7px;
}

#bannerpicture_wrap IMG, #bannerpicture_wrap A {
	margin: 0px;
	padding: 0px;
}

#bannerlinks {
	display: block;		/* just in case print css was loaded */
	margin-left: 40%;
	color: #777;
	background-color: #fff;
}

/* font settings for banner links - language link *always* displayed using Verdana */
#bannerlinks, #bannerlinks #langlink {
	font-family: "Georgia", "Verdana", "Tahoma", "Arial", "Helvetica", sans-serif;
	font-style: italic;
	font-weight: bold;
	font-size: 9pt;
	letter-spacing: 0.0ex;
}

#bannerlinks A {
	text-decoration: none;
	color: #777;
}

#bannerlinks A:hover {
	color: #f72;
}

.detailitem {
	padding: 0px 15px 0px 15px;
}

#detailwrap {
	padding-bottom: 10px;
	padding: 0px 30px 10px 30px;
	/* border-bottom: 1px solid #ccc; */
	border-bottom: 3px double #ccc;
}


/* ------   navigation menu content area   ------ */

#menu {
	margin-left: 10px;
	margin-bottom: 80px;
	padding: 25px 10px 40px 0px;
	font-family: "Georgia", "Verdana", "Tahoma", serif;
	font-size: 8pt;
	font-weight: bold;
	color: #777;
	border: solid 1px #058;
	border-bottom: solid 5px #058;
	background: url(../images/uzumaki.gif) repeat-x left top #ddd;
}

.topmenulist, .menulist {
	padding: 0px;
	line-height: 1.7em;
}

.topmenulist {
	margin: 0px 0px 0px 10px;
}

.menulist {
	margin: 0px 0px 0px 20px;
}

.topmenulist LI {
	padding-top: 2.0em;
}

.menulist LI {
	padding: 0px;
}

#menu A {
	color: #666;
	text-decoration: none;
}

#menu A:hover {
	color: #f72;
}

#menu A:visited {
	/* color: #f72; */
}

#menu UL {
	list-style:	none;
}

/*
    The line below is deceptively simple - make submenu items gray and italic
    without affecting the top-level menu style.  Start from the right - a
    link (A) within a list (UL) that's contained within a list item (LI)
    only occurs in a submenu, not in a top-level menu item!!!
*/
#menu UL LI UL A {
	color: #999;
	font-style: italic;
}

/* hide submenus by default */
#submenu_fulltime, #submenu_parttime, #submenu_haken,  #submenu_trivia, #submenu_proftest, #submenu_studentlife, #submenu_learning, #submenu_gallery, #submenu_earthquake  {
	display: none;
}

#menucontent IMG {
	vertical-align: top;
}

/* special items in the menu column */
#menu_special {
	margin: auto;
	text-align: center;
}

/* url(../images/headermark.gif) */

#menucontent .currentitem A {
	background: transparent url(../images/highlight_uzumaki.gif) no-repeat 0% 100%;
	padding-left: 5px;
}

#menucontent .currentitem UL LI A {
	background: none;
	padding-left: 0px;
}

/* ------   main content area   ------ */

#maincontent H1, #maincontent H2 {
	color: #7db073;
}

#maincontent IMG {
	padding: 5px 15px 10px 15px;
	vertical-align: top;
}

#maincontent IMG.right {
	float: right;
	padding-right: 0px;
}

#maincontent IMG.left {
	float: left;
	padding-left: 0px;
}

#maincontent IMG.center {
	margin: auto;
	text-align: center;
}

/* ------   sidebar content area   ------ */

.specialitem {
	font-size: 8pt;
	margin: 30px 10px 40px 10px;
	padding: 1.7em 10px 1.0em 10px;
	text-align: center;
	font-style: italic;
	background-color: #fcb;
	border: solid 1px #b99;
	border-top: solid 5px #b99;
	line-height: 1.5em;
}

.specialitem IMG.phone
{
	background-color: #b99;
	padding: 7px;
	margin-bottom: 10px;
}

.specialimage {
	margin: auto;
	text-align: center;
}

.address {
	margin-left: 25px;
}



/* ------   tables   ------ */

TABLE.generaltable {
	margin: auto;
	width: 600px;
}

TABLE.generaljptable {
	margin: auto;
	width: 600px;
}

TABLE.medtable {
	margin: auto;
	width: 500px;
}

TABLE.smalltable {
	margin: auto;
	width: 400px;
}

TABLE.generaltable, TABLE.generaljptable, TABLE.medtable, TABLE.smalltable {
	border: solid 30px #bea;
	background-color: #bea;
	margin-top: 3.0em;
	margin-bottom: 3.0em;
	border-collapse: collapse;
}

TABLE.generaltable TD {
	padding: 8px 20px 8px 20px;
	vertical-align: top;
}

TABLE.generaltable TD.small {
	padding-left: 0px;
	padding-right: 0px;
}

TABLE.generaljptable TD {
	padding: 8px 10px 8px 10px;
	vertical-align: top;
}

TABLE.medtable TD {
	padding: 8px 20px 8px 20px;
	vertical-align: top;
}

TABLE.smalltable TD {
	padding: 5px 20px 5px 20px;
	vertical-align: top;
}

TABLE.generaltable TR.tight TD {
	padding: 0px 20px 0px 20px;
}

TABLE.generaljptable TR.tight TD {
	padding: 0px 10px 0px 10px;
}

TABLE.generaltable TH, TABLE.generaljptable TH, TABLE.medtable TH, TABLE.smalltable TH {
	font-weight: bold;
	color: white;
	background-color: #9c8;
	margin-bottom: 5px;
	padding: 10px;
	line-height: 1.0em;
}


THEAD.left {
	text-align: left;
}

TABLE.generaltable TD.cost, TABLE.generaljptable TD.cost, TABLE.medtable TD.cost, TABLE.smalltable TD.cost
{
	text-align: right;
}
		
TR.spacerow, TR.spacerow TD
{
	font-size: 8px;
	line-height: 1.0em;
}

TR.title TD {
	padding-top: 10px;
}

/* ------   kana chart styles   ------ */

#hiragana, #katakana {
	margin-left: 1%;
	margin-top: 30px;
}

#hiragana IMG, #katakana IMG {
	margin: 0px;
	padding: 0px;
}

#hiragana_clip, #katakana_clip {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 2;
	clip: rect( 0px, 0px, 0px, 0px );
	border: none;
}

#hiragana_anim, #katakana_anim {
	position: relative;
	top: -280px;
	left: 450px;
	padding: 0px;
	visibility: hidden;
	background-color: #fff;
	line-height: 1px;
}

#hiragana_anim IMG, #katakana_anim IMG {
	border: double 3px #999;
}

#remainder
{
	position: relative;
	top: -85px;
}

#remainder IMG
{
	margin: 0px;
	padding: 0px;
}

.kanachart {
	margin: auto;
	text-align: center;
	margin-top: 30px;
	margin-bottom: 30px;
}


/* ------   form styles   ------ */

.normalform {
	width: 550px;
	margin-left: 30px;
}

.formrow {
	clear: both;
	padding-top: 8px;
}

.formrow SPAN.label {
	float: left;
	width: 180px;
	text-align: right;
}

.formrow SPAN.formw {
	float: right;
	width: 360px;
	text-align: left;
} 

.normalform textarea, .normalform INPUT.text {
	width: 270px;
	border: 1px solid #ccc;
	padding: 2px;
}

.normalform input.button {
	margin-top: 10px;
	color: #444;
	font-weight: bold;
	font-size: 9pt;
	padding: 3px 5px 3px 5px;
	border-bottom: 1px solid #999;
	border-right: 1px solid #999;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

.noborder {
	border: none;
}

.formheaderrow {
	margin: 10px 20px 20px 20px;
	padding: 20px 20px 5px 20px;
	border-bottom: solid 1px #aaa;
	font-style: italic;
	text-align: right;
	color: #777;
	clear: both;
}

.formwarning {
	padding-top: 20px;
	clear: both;
	font-style: italic;
	visibility: hidden;
	text-align: center;
}


/* ------   picture gallery styles   ------ */

.picturetable {
	margin: auto;
	text-align: center;
}

.picturetable TD {
	padding: 20px;
	text-align: center;
	margin: auto;
}

.picturetable TD IMG {
	padding: 5px;
	border: none;
}

.picturetable TD .caption {
	font-size: 9pt;
	text-align: center;
}


/* ------   misc styles   ------ */

.title {
	font-weight: bold;
}

#navi {
	margin: auto;
	text-align: center;
	margin-top: 50px;
	margin-bottom: 30px;
	font-style: italic;
}

#copyright {
	margin-top: 40px;
	margin-bottom: 40px;
	border-top: solid 1px #aaa;
	padding-top: 5px;
	text-align: right;
	font-style: italic;
	font-size: 8pt;
}

#copyright P {
	padding-right: 30px;
}

#copyright .validation {
	float: left;
	padding-left: 30px;
	padding-right: 20px; 
}

#copyright A {
	padding-right: 10px;
	font-weight: normal;
}

#copyright IMG {
	padding: 5px 5px 0px;
}


P.info {
	font-style: italic;
}

/* pictures won't hang below */
.clear {
	clear: both;
}

.flow
{
	margin: auto;
	margin-top: 3.0em;
	margin-bottom: 3.0em;
	text-align: center;
	width: 300px;
}

.box 
{
	margin: 10px;
	padding: 20px;
	background-color: #bea;
}

.arrowtext
{
	margin: 20px;
	font-size: 24pt;
	font-weight: bold;
	line-height: 1.0em;
}

.center
{
	margin: auto;
	text-align: center;
}

.note
{
	text-align: center;
}

SPAN.red {
	color: red;
	font-weight: bold;
}

.nowrap {
	white-space: nowrap;
}