#menu {
 width:795px;
 height:445px;
 padding:px;
 margin:auto;
 list-style:none;
 border:#808080 1px solid;
 position:relative;
 z-index:100;
 background:#ddd;
 overflow:hidden;
 }
 
#menu li {
 float:left;
 height:400px;
 }
 
#menu ul {
 text-align:justify;
 padding:0;
 margin:0;
 list-style:none;
 position:absolute;
 z-index:100;
 top:0;
 left:0;
 }
 
#menu ul ul {
 position:absolute;
 left:0;
 top:auto;
 bottom:900px;
 width:200px;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
transition-delay: 50ms;
-o-transition-delay: 50ms;
-moz-transition-delay: 50ms;
-ms-transition-delay: 50ms;
-webkit-transition-delay: 50ms;
}

#menu ul li.p2 ul {left:200px;}
#menu ul li.p3 ul {left:400px;}
#menu ul li.p4 ul {left:600px;}

#menu ul li.p2-ob ul {left:265px;}
#menu ul li.p3-ob ul {left:530px;}

#menu img {
 max-width:100%;
 width:px;
 height:px;
 position:absolute;
 display:block;
 opacity:1;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}

#menu ul li {float:left;}
#menu ul img {width:0; height:0; top:200px; z-index:-1;}

#menu img.leftPic1 {left:0; top:0; width:200px; height:400px; max-width: 100%;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu img.midPic1 {left:200px; top:0; width:200px; height:400px; max-width: 100%;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu img.rightPic1 {left:400px; top:0; width:200px; height:400px; max-width: 100%;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu img.fourPic1 {left:600px; top:0; width:200px; height:400px; max-width: 100%;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.set1a {top:150px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu ul img.set1b {top:150px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu ul img.set1c {top:150px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.set1d {top:150px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.set2a {top:250px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu ul img.set2b {top:250px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu ul img.set2c {top:250px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu ul img.set2d {top:250px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.set3a {top:350px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu ul img.set3b {top:350px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu ul img.set3c {top:350px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}
#menu ul img.set3d {top:350px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.set4a {top:150px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.set4b {top:150px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.set4c {top:150px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.set4d {top:150px;
transition-delay: 1s;
-o-transition-delay: 1s;
-moz-transition-delay: 1s;
-ms-transition-delay: 1s;
-webkit-transition-delay: 1s;
}

#menu ul img.leftPic {left:100px;}
#menu ul img.midPic {left:300px;}
#menu ul img.rightPic {left:500px;}
#menu ul img.fourPic {left:700px;}

#menu .menuInner {
 width:800px;
 height:400px;
 }

#menu .menuInner-ob {
 width:795px;
 height:400px;
 }

#menu .menuInner li a {
 display:block;
 width:200px;
 height:45px;
 max-width:100%;
 padding-left:0px;
 background:#2479DB;
 margin-top:400px;
 font:bold 16px/50px arial, sans-serif;
 color:#FDFDFC;
 text-decoration:none;
 text-align:center;
}

#menu .menuInner-ob li a {
 display:block;
 width:265px;
 height:45px;
 max-width:100%;
 padding-left:0px;
 background:#2479DB;
 margin-top:400px;
 font:bold 16px/50px arial, sans-serif;
 color:#FDFDFC;
 text-decoration:none;
 text-align:center;
}

#menu li:hover img.leftPic1 {left:100px; top:50px; height:0; width:0;}
#menu li:hover img.midPic1 {left:300px; top:50px; height:0; width:0}
#menu li:hover img.rightPic1 {left:500px; top:50px; height:0; width:0;}
#menu li:hover img.fourPic1 {left:700px; top:50px; height:0; width:0;}

#menu ul li:hover img.leftPic {left:0; top:0; height:400px; width:200px;}
#menu ul li:hover img.midPic {left:200px; top:0; height:400px; width:200px}
#menu ul li:hover img.rightPic {left:400px; top:0; height:400px; width:200px;}
#menu ul li:hover img.fourPic {left:600px; top:0; height:400px; width:200px;}

#menu ul li:hover {
 zoom:1;
 }

#menu ul li:hover > a {
 background:#2479DB;
 color:#FDFDFC;
 }

#menu ul ul li {
 height:25px;
 float:left;
 }

#menu .menuInner ul li a {
 height:25px;
 line-height:25px;
 font-weight:bold;
 font-size: 90%;
 color:#000000;
 text-align:left;
 padding-left:5px;
 background-color:rgba(35, 121, 219, 0.5);
 }

 #menu .menuInner-ob ul li a {
 height:25px;
 line-height:25px;
 font-weight:bold;
 font-size: 90%;
 color:#000000;
 text-align:left;
 padding-left:5px;
 margin-left:0px;
 background-color:rgba(35, 121, 219, 0.5);
 }

#menu ul li:hover ul {
 top:auto;
 bottom:400px;
 }
