/******************* layout & structure *********************/
body {
  color: #000000;
  font-family: Arial, sans-serif;
  font-size: 0.9em;
}


/**************** GENERAL PURPOSED ******************/

.chinese {
  font-family: SimSun, MingLiU, Arial Unicode MS;
}

div.clear {
  clear: both;
}

/*********** HEADER ***********/

div#header {
  width: 100%;
  clear: both;
  margin: 0em;
}

img.logo {
  vertical-align: top;
}

img.logo:hover {
  background-color: #ffff00;
}

img.title {
  font-size: 2em;
  font-weight: bold;
  color: #333399;
  display: inline;
}


/*********** HORIZONTAL NAVIGATION BAR ***********/

div#navmenu {
  background-image: url(./image/image-horiz_menu.png); 
  width: 100%; 
}
div#navmenu ul {
  list-style-type: none; 
  width: 100%; 
  margin: auto; 
}
div#navmenu ul li {
  float:left; 
}
div#navmenu ul li a {
  background-image: url(./image/image-horiz_menu_divider.png);
  background-repeat: no-repeat; 
  background-position: right;
  padding-top:10px; 
  padding-bottom:10px; 
  padding-right: 12px; 
  padding-left: 12px;
  display: block; text-decoration: none;
  color: beige; 
}
div#navmenu ul li a:hover {
  color: purple; background: yellow; 
}



/******************** LEFT MENU ********************/

div#leftmenu {
  padding:5px;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  color: #9999ff;
}
div#leftmenu hr {
  height:3px;
  border: 0;
  width:100%;
  background-color: #9999ff;
}

div#leftmenu ul {
  list-style-type: none; 
  width: 100%; 
  padding: 0em;
  margin: 0em;
}
div#leftmenu ul li {
  padding: 0em;
  text-indent: 0em;
}
div#leftmenu ul li a{
  display: block;
  width: 100%;
  text-align: center;
  padding: 0.5em 0em 0.5em 0em;
  text-decoration: none;
  font-weight: bold;
  color: #9999ff;
}
div#leftmenu ul li a:hover {
  background-color: #ccccdd;
  color: #333366;
}

div.big_button a img:hover{
  background-color: #ffff00;
}

/******************** MAIN BODY ********************/

td#flash_slideshow {
  position: relative;
  margin: 0em;
  padding: 1em;
  background-color: #000000;
}

td#mainbody {
  position: relative;
  margin: 0em;
  padding: 1em;
}

div.general_heading {
  text-align: center;
  margin-bottom: 1em;
}

div.general_large {
  font-size: 1.2em;
  font-weight: bold;
}

div.section_title {
  text-align: center;
  font-weight: bold;
  font-size: 1.7em;
  border-bottom-style: solid;
  border-bottom-width: 3px;
  border-bottom-color: #333366;
  margin-bottom: 1em;
}

div.section_subtitle {
  text-align: center;
  font-weight: bold;
  font-size: 1.2em;
}

div.section_red_flag {
  color: red;
  text-align: center;
  margin-left: 20%;
  margin-right: 20%;
  font-weight: bold;
  font-style: italic;
  font-size: 1.7em;
  border: 5px double red;
  background-color: #ffbbdd;
}

div.section_heading {
  text-align: center;
  margin-left: 15%;
  margin-right: 15%;
  font-size: 1.5em;
  font-weight: bold;
  border-bottom: 0.15em solid #aaaaaa;
  border-right: 0.15em solid #aaaaaa;
  margin-top: 0.3em;
  margin-bottom: 0.5em;
  padding-left: 0.5em;
  background-color: #ffffcc;
}

div.section_subheading {
  font-weight: bold;
  font-size: 1.1em;
}

div.section_body {
  font-size: 1.1em;
}

div.insert_photo_right {
  float: right;
  padding: 1em;
  margin: 1em;
  position: relative;
}

div.centered {
  text-align: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;

}

div.centered_italic_small {
  text-align: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  font-size: 0.8em;
  font-style: italic;
}

div.footnote {
  clear: both;
  padding: 1em;
  text-align: left;
  font-style: italic;
}

div.footnote_centered {
  clear: both;
  padding: 1em;
  text-align: center;
  font-style: italic;
}
div.imagelink {
}

div.imagelink a:hover {
  color: #ffaa00;
}

span.centered_text {
  text-align: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

span.bold_text {
  font-weight: bold;
}

span.larger_text {
  font-size: 1.2em;
}

span.red_text {
  color: #ff0000;
}

span.white_text {
  color: #ffffff;
}

span.highlight_big_italic {
  font-weight: bold;
  font-style: italic;
  font-size: 2.0em;
  color: #ff0000;
}

span.centered_italic {
  font-style: italic;
  text-align: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

span.italic {
  font-style: italic;
}

ul.bold_none {
  float: left;
  padding-top: 2em;
}

ul.bold_none li {
  list-style-type: none;
  font-weight: bold;
  font-size: 1.2em;
  padding: 0.5em 0em 0.5em 0em;
}

ul.bold_bullet {
  list-style-type: disc;
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.8em;
  padding: 0.5em 0em 0.5em 0em;
}

ul.large_text_bullet {
  list-style-type: decimal;
  font-size: 1.2em;
}

ul.nobullet {
  list-style-type: none;
}

div.menubutton a {
  color: #cccccc;
}

div.menubutton a:hover {
  background-color: #ccccdd;
  color: #333366;
}

/****************** RIGHT COLUMN *******************/

.association_memo {
  background-color: beige;
  background-image: url("./image/image-bg_grid.jpg");
  background-repeat: repeat;
  border-left: solid 0.2em #9999aa;
}

.school_memo {
  background-color: beige;
  background-image: url("./image/image-bg_grid.jpg");
  background-repeat: repeat;
  border-left: solid 0.2em #9999aa;
}

div.memo_heading {
  text-align: center;
  margin-left: 5%;
  margin-right: 5%;
  font-size: 1.2em;
  font-weight: bold;
  border-bottom: 0.15em solid #aaaaaa;
  border-right: 0.15em solid #aaaaaa;
  margin-top: 0.3em;
  margin-bottom: 0.5em;
  padding-left: 0.5em;
  background-color: #ffffcc;
}

/********************** INDEX.HTML*************************/

div.news_heading {
  color: khaki;
  font-weight: bold;
  font-size: 1.5em;
  background-color: saddlebrown;
}

div.news_item {
  padding: 0.5em 0em 0.5em 0em;
}

div.timestamp {
  text-align: right;
  color: gray;
  font-style: italic;
}

/****************** ASSOCIATION BYLAWS *********************/

ul.bylaws {
  list-style-type: upper-roman;
}

ul.bylaws li ul {
  list-style-type: none;
}

ul.bylaws li ul.numbered {
  list-style-type: decimal;
}



/****************** SCHOOL INTRO PAGE *********************/

ul.school_intro {
  list-style-type: square; 
  list-style-position: outside; 
}



/****************** SCHOOL CALENDAR *********************/

div.calendar {
  text-align: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

div.calendar table {
  margin: 0 auto;
  text-align: left;
}

div.calendar th {
  padding-right: 1em;
  vertical-align: top;
}

div.calendar td {
  padding-right: 1em;
  vertical-align: top;
}

tr.holiday {
  font-style: italic;
  color: red;
}


/******** SCHOOL TEACHERS ONLINE MATERIALS *********/

td#teachers_mainbody {
  position: relative;
  margin: 0em;
  padding: 0em;
  width:100%;
  height:400px;
}

div.teachers_section_heading {
  text-align: center;
  margin-left: 0%;
  margin-right: 0%;
  font-size: 1.5em;
  font-weight: bold;
  border-bottom: 0.3em solid #aaaaaa;
  border-top: 0.3em solid #aaaaaa;
  margin: 0em;
  padding: 0.3em;
  background-color: #ffffcc;
}

div.teachers_section_body {
  font-size: 1.1em;
}

div.teachers_item_heading {
  color: khaki;
  font-weight: bold;
  font-size: 1.2em;
  background-color: #004040;
}

div.teachers_item {
  padding: 0.5em 0em 0.5em 0em;
}

div.teachers_item ul {
  list-style-type: square; 
  width: 100%; 
  padding: 0em;
  margin: 0em;
  color: black;
  line-height: 1.5em;
  text-indent: 3em;
}
div.teachers_item ul li {
}
div.teachers_item ul li a{
}

div.teachers_timestamp {
  text-align: right;
  color: black;
  font-style: italic;
}

/****************** BOTTOM BAR *********************/

div#bottombar {
  width: 100%; 
  padding: 0.5em;
  background-color: lightgray; 
}



/******************** COPYRIGHT *********************/

#footer_copyright {
  clear: both;
  padding: 1em;
  background-color: #333366;
  font-size: 0.7em;
  color: #bbbbbb;
  text-align: center;
}