@import 'reset.css';

/* Generel
------------------------------------ */
HTML,BODY{
    background: #FFF;
    font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
    color: #333;
    margin: 0;
    padding: 0;
    height: 100%;
}
A{
  color: #73216d;
    text-decoration: underline;
    cursor: pointer;
}
A:hover{
    text-decoration: none;
    cursor: pointer;
}
STRONG{
    font-weight: bold;
}
EM{
    font-style: italic;
}
.clear{
    clear: both;
}
INPUT{
    vertical-align: middle;
}
#wrapper{
  width: 900px;
  margin: 0 auto;
  padding: 10px 0 0 0;
  position: relative;
}


/* Home
------------------------------------ */

#home-header{
  position: relative;
  height: auto;
  z-index: 2;
}
#home-header H1 A{
    outline: none;
    text-indent: -999999px;
    display: block;
    width: 235px;
    height: 42px;
    position: absolute;
    top:10px;
    left:0;
    background: url(home-images/logo.png) no-repeat;
}
#home-main{
  width: 610px;
  height: 660px;
  background: url(home-images/home-bg.png) no-repeat left 140px;
  z-index: 1;
  position: relative;
  float: left;
}
#home-main-students{
  background: url(home-images/home-bg-students.png) no-repeat left 140px;
}
#home-main-staff{
  background: url(home-images/home-bg-staff.png) no-repeat left 140px;
}
#home-main-alumni{
  background: url(home-images/home-bg-alumni.png) no-repeat left 140px;
}

.home-main {
  width: 610px;
  height: 660px;
  z-index: 1;
  position: relative;
  float: left;
}

#home #wrapper{
  padding: 0;
}
#b-1{
  width: 140px;
  height: 40px;
  background: #EAEAEA;
  float: left;
  margin: 0 0 10px 0;
}
#b-2{
  width: 140px;
  height: 35px;
  background: #FFE3CB;
  float: right;
  margin: 0 0 10px 0;
  text-align: center;
  padding: 5px 0 0 0;
}
#text-2{
    outline: none;
    text-indent: -999999px;
    display: block;
    width: 588px;
    height: 62px;
    position: absolute;
    top:55px;
    left:13px;
    background: url(home-images/text-2.png) no-repeat;
}
#door-img{
  position: absolute;
  width: 196px;
  height: 424px;
  top:215px;
  left:389px;
  z-index: 0;
}
#home-right{
  width: 290px;
  float: right;
  position: relative;

}
.block-5{
  margin: 5px 0 10px 0;
}
.block-5 IMG{
  margin: 0 0 10px 0;
  width: 140px;
  height: 140px;
  display: block;
  float: left;
}
.block-5 IMG.last{
  margin: 0 0 10px 0;
  float: right;
}
#home-top-nav{
  z-index: 1000;
  position: absolute;
  top: 120px;
}
#nav LI{
  float: left;
  z-index: 1001;
  position: relative;
  display: inline-block;
  border-left: 1px solid #873D80;
  height: 25px;
}
#nav LI:first-child{
  border-left: none;
}
#nav LI A{
  display: inline-block;
  color:#873D80;
  font-size: 14px;
  padding: 0;
  height: 16px;
  line-height: 16px;
  text-decoration: none;
}
#nav LI A:hover{
  color:#FF6600;
}
#nav UL{
  display: none;
  position: absolute;
  top:16px;
  left:8px;
  border: 1px solid #FF7D26;
  border-bottom: none;
  width: 130px
}
#nav LI:hover LI UL{
  display: none;
}
#nav LI:hover UL, .nav-2 LI LI:hover UL{
  display: block;
}
#nav UL LI:hover UL{
  top:-1px;
  left:130px;
  display: block !important;
}
#nav UL LI{
  margin: 0;
  background: none;
  position: relative;
  height: auto;
  margin: 0;
  padding: 0;
  text-align: left;
  width: auto;
  float: left;
  border: none;
}
#nav LI LI A{
  display: inline-block;
  padding: 3px 5px 2px 5px;
  width: 120px;
  text-align: right;
  text-align: left;
  border-bottom: 1px solid #FF7D26;
  font-size: 12px;
}
#nav .level-1 LI:hover A{
  background: #FF7D26;
  color:#FFF;
}
#nav .level-1 LI A{
  background: url(home-images/transparent.png);
  color: #73216d;
}
#nav .level-2 LI A{
  background: url(home-images/transparent.png) !important;
  color: #73216d !important;
}
#nav .level-2 LI:hover A{
  background: #FF7D26 !important;
  color:#FFF !important;
}
#outer-menu {
  position: absolute;
  top: 330px;
  height: 303px;
}
#menu-2{
	width: 360px;
}
.nav-2-div{
	width: 180px;
	float: left;
	padding-left: 60px;
}

.left-div {
    position: relative;
    z-index: 10;
}

.nav-2 {
	/*z-index:10;*/
}

.nav-2 ul {
	z-index: 20;
	position: relative;
}

.nav-2 LI{
	position: relative;
	/*height: 16px;*/
	text-align: right;
	/*width: 160px;*/
	/*margin: 0 0 10px 0;*/
	_margin: 0 0 0 0;	
	padding: 5px 5px 0 0;
	_padding: 0px 5px 0 0;		
}
.nav-2 LI A{
  display: inline-block;
  color:#873D80;
  font-size: 14px;
  padding: 0 9px 0 8px;
  /*height: 16px;*/
  line-height: 16px;
  text-decoration: none;
  /*background: url(home-images/arrow2-2.gif) no-repeat right 50%;*/
}

.pattern2 li a {
	color:#336699;
    /*background: url(home-images/arrow2-3.gif) no-repeat right 50%;*/
}
.pattern3 li a, .pattern4 li a {
	color:#996600;
    /*background: url(home-images/arrow2-4.gif) no-repeat right 50%;*/
}

.nav-2 LI A:hover{
  color: #FF6600;
  /*background: url(home-images/arrow2-on.gif) no-repeat right 50%;*/
}
.nav-2 UL{
  display: none;
  position: absolute;
  /*top:4px;*/
  top:10px;
  /*left:162px;*/
  left:210px;
  border: 1px solid #FF7D26;
  border-bottom: none;
}

.pattern3 ul {
	top: -90px;
}

.pattern4 ul {
	top: -10px;
}


ul.level-1, ul.level-2 {
	border: 1px solid #FF7D26;
	border-bottom: none;	
}

.nav-2 LI:hover LI UL{
  display: none;
}
.nav-2 LI:hover UL, .nav-2 LI LI:hover UL {
  display: block;
  
}
.nav-2 UL UL{
  top:-1px;
  left:130px;  
}
.pattern3 ul  ul{
	top: -106px;
}
.nav-2 UL LI{
  margin: 0;
  background: none;
  position: relative;
  /*height: auto;*/
  /*height: 21px;*/
  margin: 0;
  padding: 0;
  text-align: left;
  /*width: 130px;*/
  /*_width: 130px;*/
  width: 205px;
  _width: 205px;
  _float: left;
  _display:block;
  border-bottom: 1px solid #FF7D26;
}
.nav-2 LI LI A{
  /*display: block;*/
  /*padding: 3px 5px 2px 5px;*/
  padding: 0;  
  /*width: 120px;*/
  text-align: right;
  text-align: left;
  /*border-bottom: 1px solid #FF7D26;*/
  font-size: 12px;
}
.nav-2 .level-1 LI:hover A {
  /*background: #FF7D26;*/
  color:#FFF;
}
.nav-2 .level-1 LI A{
  /*background: url(home-images/transparent.png);*/
  color: #73216d;
}
.nav-2 .level-2 LI A{
  /*background: url(home-images/transparent.png) !important;*/
  color: #73216d !important;
}
.nav-2 .level-2 LI:hover A{
  /*background: #FF7D26 !important;*/
  color:#FFF !important;
}

#menu-2 .hr{
  background: url(home-images/hr-1.gif) no-repeat; 
  width: 105px;
  height: 8px;
  clear: both;
  margin: 10px auto 10px auto;
  text-align:center;
}

#home-footer{
  position: absolute;
  font-size:11px;
  top:645px;
  color:#666;
}
#home-footer a {
    color: #73216D;
    text-decoration: none;
}
#home-footer a#footer-cuhk-link, #home-footer a#footer-cuhk-link:hover {
    color: #666666;
    text-decoration: none;
}