html,body{margin:0;padding:0;height:100%;}
.box{height:100%;background-image:url("../images/6.jpg");background-position:center center;background-repeat:no-repeat;background-size:100% 100%;position:relative;}
.box>a{height:128px;width:100px;background-image:url(../images/arrows.png);background-repeat:no-repeat;top:50%;margin-top:-64px;z-index:99;display:block;position:absolute;cursor:pointer;}
.box>a:hover{background-color:rgba(0,0,0,0.3);}
#pre{left:50px;background-position:30px center;}
#next{background-position:-64px center;right:50px;}
.box h1{position:absolute;top:40%;left:15%;display:none;}
.bottom{position:absolute;right:10%;bottom:30px;}
#btn{background:rgba(0,0,0,0.2);position:absolute;right:200px;top:100px;border:1px solid #ccc;height:50px;width:150px;border-radius:10px;font:24px/1 "微软雅黑";color:#333;transition:all 0.3s; cursor:pointer;}
.menu{position:absolute;top:0px;width:300px;height:100px;background:rgba(0,0,0,0.5);left:40%; opacity:0;display:none;padding:20px;border-radius:10px;}
#btn:hover{background:#ddd;color:#000;}
.menu li{list-style:none;height:30px;display:block}
.menu li a{background-image:none;height:30px;text-decoration:none;color:#fff;width:100%;text-align:center;display:block;transition:all 0.3s;line-height:30px;}
.menu li a:hover{background-color:#fff;color:#000;}