.camera {display:block; float:left; margin-right:20px;}
ul.top-ul, ul.top-ul ul {padding:0; margin:0; list-style:none; width:100px; font-family:arial, sans-serif; background:#fff;
-o-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-icab-box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
-khtml-box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
-moz-box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
}
ul.top-ul {width:100px; height:30px; border:1px solid #888; position:relative; z-index:100;
-o-border-radius: 5px 5px 0 0;
-icab-border-radius: 5px 5px 0 0;
-khtml-border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
border-radius: 5px 5px 0 0;
}

ul.top-ul li.top-li {width:100px; height:30px; float:left; position:relative;}
ul.top-ul li.top-li a.top-a {display:block; width:100px; height:30px; text-align:center; line-height:30px; color:#000; text-decoration:none; font-size:13px; font-weight:bold;}

ul.top-ul li.top-li div.drop {height:0; overflow:hidden; left:-1px; top:30px; width:520px; position:absolute; z-index:500;
transition: height 1s ease-in-out;
-o-transition: height 1s ease-in-out;
-moz-transition: height 1s ease-in-out;
-webkit-transition: height 1s ease-in-out;
}
ul.top-ul li.top-li div.drop em {display:block; width:510px; height:510px; background:#f8f8f8; opacity:0.8; filter: alpha(opacity=80);
border:1px solid #ddd;
-o-border-radius: 0 5px 5px 5px;
-icab-border-radius: 0 5px 5px 5px;
-khtml-border-radius: 0 5px 5px 5px;
-moz-border-radius: 0 5px 5px 5px;
-webkit-border-radius: 0 5px 5px 5px;
border-radius: 0 5px 5px 5px;
-o-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-icab-box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
-khtml-box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
-moz-box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
box-shadow: 2px 2px 5px  rgba(0, 0, 0, 0.5);
}
ul.top-ul li.top-li div.drop ul.drop-ul {position:absolute; left:0; top:-500px; border:1px solid #888; border-top:0; padding-bottom:10px;
transition: 1s ease-in-out;
-o-transition: 1s ease-in-out;
-moz-transition: 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-o-border-radius: 0 0 5px 5px;
-icab-border-radius: 0 0 5px 5px;
-khtml-border-radius: 0 0 5px 5px;
-moz-border-radius: 0 0 5px 5px;
-webkit-border-radius: 0 0 5px 5px;
border-radius: 0 0 5px 5px;
}
ul.top-ul li.top-li div.drop ul.drop-ul li.drop-li {position:relative; width:100px; height:100px; float:left; z-index:100;}
ul.top-ul li.top-li div.drop ul.drop-ul li.drop-li a.drop-a {display:block; width:100px; float:left; text-decoration:none; line-height:16px;}

ul.top-ul li.top-li div.drop ul.drop-ul li.drop-li a.drop-a img {display:block; border:0; position:absolute; left:5px; top:5px; z-index:-1; opacity:1; filter: alpha(opacity=100);
transition: 0.4s ease-in-out;
-o-transition: 0.4s ease-in-out;
-moz-transition: 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
}
ul.top-ul li.top-li div.drop ul.drop-ul li.drop-li a b {display:block; width:100px; height:60px; padding-top:40px; text-align:center; background:url(trans.gif); cursor:pointer; color:#000; font-size:16px; opacity:0; filter: alpha(opacity=0);
transition: 0.4s ease-in-out;
-o-transition: 0.4s ease-in-out;
-moz-transition: 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
}

ul.top-ul li.top-li:hover div.drop ul.drop-ul li.drop-li:hover > a img {opacity:0.5; filter: alpha(opacity=50);}
ul.top-ul li.top-li:hover div.drop ul.drop-ul li.drop-li:hover > a b {opacity:1; filter: alpha(opacity=100);}

ul.top-ul li.top-li:hover div.drop {height:226px;}

ul.top-ul li.top-li:hover div.drop:hover {height:226px;}

ul.top-ul li.top-li:hover div.drop ul.drop-ul {top:0;}

ul.top-ul li.top-li div.drop ul.drop-ul div.fly {position:absolute; left:100px; top:-1px; width:0; height:113px; overflow:hidden;
transition: width 1s ease-in-out;
-o-transition: width 1s ease-in-out;
-moz-transition: width 1s ease-in-out;
-webkit-transition: width 1s ease-in-out;
}

ul.top-ul li.top-li div.drop ul.drop-ul div.fly ul.fly-ul {position:absolute; left:-500px; top:1px; width:400px; height:100px; border:1px solid #888; border-left:0; padding-right:10px;
transition: 1s ease-in-out;
-o-transition: 1s ease-in-out;
-moz-transition: 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-o-border-radius: 0 5px 5px 0;
-icab-border-radius: 0 5px 5px 0;
-khtml-border-radius: 0 5px 5px 0;
-moz-border-radius: 0 5px 5px 0;
-webkit-border-radius: 0 5px 5px 0;
border-radius: 0 5px 5px 0;
}
ul.top-ul li.top-li div.drop ul.drop-ul div.fly ul.two {width:200px; left:-310px;
transition: 0.6s ease-in-out;
-o-transition: 0.6s ease-in-out;
-moz-transition: 0.6s ease-in-out;
-webkit-transition: all 0.6s ease-in-out;
}
ul.top-ul li.top-li div.drop ul.drop-ul div.fly ul.three {width:300px; left:-410px;
transition: 0.8s ease-in-out;
-o-transition: 0.8s ease-in-out;
-moz-transition: 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
}

ul.top-ul li.top-li div.drop ul.drop-ul div.fly ul.fly-ul li.fly-li {float:left; position:relative; background:#fff; height:100px; z-index:100;}
ul.top-ul li.top-li div.drop ul.drop-ul div.fly ul.fly-ul li.fly-li a.fly-a {display:block; width:100px; height:100px; float:left; text-decoration:none;}
ul.top-ul li.top-li div.drop ul.drop-ul div.fly ul.fly-ul li.fly-li a.fly-a img {display:block; border:0; position:absolute; left:5px; top:5px; z-index:-1; opacity:1; filter: alpha(opacity=100);
transition: 0.4s ease-in-out;
-o-transition: 0.4s ease-in-out;
-moz-transition: 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
}
ul.top-ul li.top-li div.drop ul.drop-ul div.fly ul.fly-ul li.fly-li a.fly-a b {display:block; height:65px; text-align:center; color:#000; font-size:12px; padding-top:35px; opacity:0; filter: alpha(opacity=0);
transition: 0.4s ease-in-out;
-o-transition: 0.4s ease-in-out;
-moz-transition: 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
}

ul.top-ul li.top-li:hover div.drop ul.drop-ul li.drop-li:hover div.fly {width:415px;}
ul.top-ul li.top-li:hover div.drop ul.drop-ul li.drop-li:hover div.fly ul.fly-ul {left:0;}
ul.top-ul li.top-li:hover div.drop ul.drop-ul li.drop-li:hover div.fly ul.fly-ul li:hover > a img {opacity:0.5; filter: alpha(opacity=50);}
ul.top-ul li.top-li:hover div.drop ul.drop-ul li.drop-li:hover div.fly ul.fly-ul li:hover > a b {opacity:1; filter: alpha(opacity=100);}


/* for IE6 */
ul.top-ul li.top-li a:hover {direction:ltr;}
ul.top-ul li.top-li a:hover div.drop {height:522px;}
ul.top-ul li.top-li a:hover div.drop ul.drop-ul {top:0;}
ul.top-ul li.top-li div.drop ul.drop-ul li.drop-li a:hover img {filter: alpha(opacity=50);}
ul.top-ul li.top-li div.drop ul.drop-ul li.drop-li a:hover b {filter: alpha(opacity=100);}

ul.top-ul li.top-li a:hover div.drop ul.drop-ul li.drop-li a:hover div.fly {width:415px;}
ul.top-ul li.top-li a:hover div.drop ul.drop-ul li.drop-li a:hover div.fly ul.fly-ul {left:0;}
ul.top-ul li.top-li a:hover div.drop ul.drop-ul li.drop-li a:hover div.fly ul.fly-ul li a:hover img {filter: alpha(opacity=50);}
ul.top-ul li.top-li a:hover div.drop ul.drop-ul li.drop-li a:hover div.fly ul.fly-ul li a:hover b {filter: alpha(opacity=100);}

ul.top-ul table {border-collapse:collapse; position:absolute; left:0; top:0; width:0; height:0; margin-bottom:-1px;}