body {
  font: 12px verdana;
  color: #666666;
  text-align: center;
  background: #e6e6e6;
}

a {
  font: 12px verdana;
  color: #666666;
  text-decoration: none;
}

a:hover {
  font: 12px verdana;
  color: #000000;
}

ul {
  list-style-type: none;
  padding: 0px 0px 0px 11px;
  margin: 0px;
}

li {
  padding-bottom: 2px;
  margin: 0px;
}

#main {
  margin: 0 auto;
  text-align: left;
  width: 727px;
  height: 659px;
  background: url(../img/background.jpg) no-repeat;
  border: 0px solid #000000;
}

#logo {
  position: relative;
  top: 24px; /* logo height */
  left: 24px;
  width: 218px;
  height: 49px;
  background: url(../img/mudi_logo_web.png) no-repeat left top;
  border: 0px solid #000000;
  cursor: pointer;
}

#chinese {
  font: 12px verdana;
  color: #666666;
  position: relative;
  top: 38px; /* logo height */
  left: 24px;
  width: 50px;
  height: 15px;
  cursor: pointer;
  border: 0px solid #000000;
}

#menus {
  position: relative;
  top: -40px; /* logo height */
  left: 421px;
  width: 230px;
  height: 95px;
  padding: 0px;
  margin: 0px;
  overflow: hidden;
  border: 0px solid #666666;
}

#submenu {
  position: relative;
  top: 0px; /* logo height */
  left: 50px;
  width: 115px;
  height: 95px;
  border-left: 1px solid #666666;
  /*border: 1px solid #666666;*/
  padding: 0px;
  margin: 0px;
}

/* Long submenu */
#submenu2 {
  position: relative;
  top: 0px; /* logo height */
  left: 0px;
  width: 215px;
  height: 95px;
  border-left: 1px solid #666666;
  /*border: 1px solid #666666;*/
  padding: 0px;
  margin: 0px;
}

#submenu_ic {
  position: relative;
  top: -2px;
  left: 0px;
  width: 215px;
  height: 95px;
  padding: 0px;
  margin: 0px;
  /*border: 1px solid #000000;*/
}

#menubar {
  position: relative;
  top: -95px; /* logo height */
  left: 165px;
  width: 115px;
  height: 95px;
  border-left: 1px solid #666666;
  /*border: 1px solid #666666;*/
  padding: 0px;
  margin: 0px;
}

#menubar_ic {
  position: relative;
  top: -2px;
  left: 0px;
  width: 115px;
  height: 95px;
  padding: 0px;
  margin: 0px;
  /*border: 1px solid #000000;*/
}

#body {
  position: relative;
  top: -39px;
  left: 24px;
  width: 677px;
  height: 486px;
  padding: 0px;
  overflow: hidden;
  border-top: 1px solid #666666;
  border-bottom: 1px solid #666666;
  /*border: 0px solid #666666;*/
}

#frame_lbody_0 { position: relative;  top: 11px;  left: 0px;  width: 677px;  height: 462px; }
#frame_lbody_1 { position: relative;  top: 11px;  left: 0px;  width: 448px;  height: 462px; }
#frame_lbody_2 { position: relative;  top: 11px;  left: 0px;  width: 218px;  height: 462px; }
#frame_lbody_3 { position: relative;  top: 11px;  left: 0px;  width: 248px;  height: 462px; }
#frame_rbody_1 { position: relative;  top: -450px;  left: 459px;  width: 219px;  height: 463px; }
#frame_rbody_2 { position: relative;  top: -450px;  left: 230px;  width: 449px;  height: 463px; }
#frame_rbody_3 { position: relative;  top: -450px;  left: 260px;  width: 419px;  height: 463px; }

#address {
  position: relative;
  top: -26px;
  left: 24px;
  width: 677px;
  height: auto;
  font: 10px verdana;
  color: #999999;
  border: 0px solid #666666;
}

/* For the project page */
a.a_climate_design:hover        { color: #bdc323; }
a.a_architecture_design:hover   { color: #f8b116; }
a.a_urban_design:hover          { color: #b52432; }
a.a_landscape_design:hover      { color: #08a1d4; }
a.a_infrastructure_design:hover { color: #124d83; }

.climate_design {
  position: relative;
  top: 0px;
  left: 0px;
  width: 103px;
  height: 83px;
  text-align: center;
  vertical-align: middle;
  margin: 0px;
  overflow: hidden;
  color: #ffffff;
  background: #bdc323;
  border: 0px solid #000000;
  cursor: pointer;
}

.architectural_design {
  position: relative;
  top: -83px;
  left: 115px;
  width: 103px;
  height: 83px;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  color: #ffffff;
  background: #f8b116;
  border: 0px solid #000000;
  cursor: pointer;
}

.urban_design {
  position: relative;
  top: -166px;
  left: 230px;
  width: 103px;
  height: 83px;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  color: #ffffff;
  background: #b52432;
  border: 0px solid #000000;
  cursor: pointer;
}

.landscape_design {
  position: relative;
  top: -249px;
  left: 345px;
  width: 103px;
  height: 83px;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  color: #ffffff;
  background: #08a1d4;
  border: 0px solid #000000;
  cursor: pointer;
}

.infrastructure_design {
  position: relative;
  top: -332px;
  left: 460px;
  width: 103px;
  height: 83px;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  color: #ffffff;
  background: #124d83;
  border: 0px solid #000000;
  cursor: pointer;
}

/* **************************
 * For project detail only
 * **************************/
.image {
  position: relative;
  top: 0px;
  left: 0px;
  width: 330px;
  height: 462px;
}

.content {
  position: relative;
  top: -462px;
  left: 342px;
  width: 335px;
  height: 412px;
  text-align: left;
  border: 0px solid #000000;
}


.title5 {  font: 16px verdana;  font-weight: bold;  color: #bdc323;} /* Climate Design */
.title6 {  font: 16px verdana;  font-weight: bold;  color: #f8b116;} /* Architecture Design */
.title7 {  font: 16px verdana;  font-weight: bold;  color: #b52432;} /* Urban Design */
.title8 {  font: 16px verdana;  font-weight: bold;  color: #08a1d4;} /* Landscape Design */
.title9 {  font: 16px verdana;  font-weight: bold;  color: #124d83;} /* Infrastructure Design */


.ldesc {
  padding: 50px 0px 0px 0px;
  font: 12px verdana;
  text-align: left;
  font-weight: bold;
}

.ldesc_small {
  font: 10px verdana;
  text-align: left;
  font-weight: normal;
}

.thumbnails {
  position: relative;
  top: -462px;
  left: 342px;
  width: 335px;
  height: 50px;
  border: 0px solid #000000;
  text-align: left;
}

.thumbnail1 {}
.thumbnail2 {}
.thumbnail3 {}
.thumbnail4 {}
.thumbnail5 { display: none; }