div.banner
{
width: 750px;
align: left;
}
div.main
{
align: left;
}
div.menu
{
float: left;
padding: 30px 0px 0px 0px;
width: 150px;
align: left;
}
div.page
{
position: relative;
width: 600px;
margin-left: 160px;
padding: 30px 0px 0px 20px;
align: center;
}
div.contact
{
position: relative;
top: 100px;
align: center;
margin-left: 10%;
margin-right: 10%;
}
table.menu
{
width: 150px;
}
table.main_center
{
width: 600px;
align: center;
border-style: none;
}
table.main_noborder
{ 
width: 600px;
align: left;
border-style: none;
}
table.main_border_center
{
width: 600px;
align: center;
border-style: double;
border-collapse: collapse;
}
table.indent_border_center
{ 
width: 500px;
align: center;
border-style: double;
border-collapse: collapse;
margin-left: 60px;
}
table.main_noborder_center
{ 
width: 600px;
align: center;
border-style: none;
}
table.auto_border_center
{ 
width: auto;
align: center;
border-style: double;
border-collapse: collapse; 
}
td.border
{
border: 1px solid;
padding: 4px;
}
td.border_center
{
border: 1px solid;
padding: 4px;
text-align: center;
}
td.noborder
{
border-style: none;
padding-left: 30px;
}
td.noborder_center
{
border-style: none;
text-align: center;
padding: 4px;
}
td.image
{ 
border-bottom: 1px solid;
padding: 4px;
text-align: center;
width: 10%;
}
td.contact
{ 
border-bottom: 1px solid;
padding: 4px;
text-align: left;
width: 35%;
}
td.research
{
border: 1px solid;
padding: 4px;
text-align: left;
width: 55%;
}
td.staff_contact
{
border-bottom: 1px solid;
padding: 4px;
text-align: left;
width: 90%; 
}
table.contact
{ 
align: center;
}
td.seminar_date
{ 
  border: 1px solid;
  padding: 4px;
  width: 20%
}
td.seminar_speaker
{ 
  border: 1px solid;
  padding: 4px;
  width: 30%
}
td.seminar_title
{ 
  border: 1px solid;
  padding: 4px;
  width: 50%
}
font.heading
{ 
  font-size: 2.25em;
  font-variant: normal;
  font-style: normal;
  font-weight: normal;
  color: #396892;
}
font.subheading
{ 
font-size: 1.5em;
font-variant: normal;
font-style: normal;
font-weight: normal;
color: #396892
}
font.text
{ 
font-family: Times New Roman, Times, serif;
font-size:normal;
font-variant:normal;
font-style:normal;
font-weight:normal;
}
a:link
{ 
  color: #336699;
}
a:visited
{ 
  color: #6E6E6E;
}
a:hover
{ 
  color: #6E6E6E;
  background-color: #FFFFFF;
  text-decoration: none;
}
a:active
{ 
  color: #336699;
}

/* The following is CSS code for the left-hand vertical menu elements*/

#menu {
  width: 150px;
  display: block;
  float: left;      
}

#menu ul {
  margin: 0;
  padding: 0;
  border: 0;
  list-style-type: none;
}

#menu li {
  margin: 0px 0px 0px 0px;
  padding: 5px 0px 5px 5px;
  background-color: #CAE1FF;
  border: 1px solid #369;
  display: block;
  text-align: left;
  position: relative;
  width: 100%;
}

#menu a{ 
display: block;
padding: 0;
margin: 0;
border: 0;
}

/* Fix the position for the second-level submenus */
#menu li ul {
  top: 0;
  left: 0;
}

/* Place the submenus where they will be shown (on hover) */
#menu li:hover ul {
  left: 100%;
}

/* Hide all the submenus at first */
#menu li ul {
  display: none;
  position: absolute;
  width: 20ex;
  left: 20ex;
  z-index: 10;
}

/* Display the submenus on hover */
#menu li:hover>ul {
  display: block;
}


/* Menu style (customizeable) */

#menu, #menu ul{ 
  background-color: #fff;
  color: #369; 
}

#menu ul li a{
  color: #369;
  text-decoration: none;
}

/* Highlight links on hover, active links */

#menu li:hover, #menu ul li a:hover, #menu ul li a:active, #menu li:active{
  background-color: #fff;
  color: #369;
  text-decoration: none;
}

/* This forces floated li elements inside their container ul elements. */
#menuList:after {
  content: ".";
  height: 0;
  display: block;
  visibility: hidden;
  overflow: hidden;
  clear: both;
}