/*图片墙设置*/
body{
    margin:0px;
    padding:0px;
}
body>div{
    position:relative;
    width:100%;
    height:100%;
    overflow: hidden;
    padding:0px;
    margin:0 auto;
}
body>div:nth-of-type(1){
    background: url(https://acg.ccoyun.cn/man/api.php) no-repeat;
    position:absolute;
}
img{
    background:rgba(255,255,255,0.7);
    padding:10px;
}
div>img:nth-of-type(1){
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    transform: rotate(-20deg);
    position:absolute;
    left:-80px;
    z-index:5;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(2){
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
    position:absolute;
    left:50px;
    top:150px;
    z-index:4;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(3){
    -webkit-transform: rotate(-50deg);
    -moz-transform: rotate(-50deg);
    -ms-transform: rotate(-50deg);
    -o-transform: rotate(-50deg);
    transform: rotate(-50deg);
    position:absolute;
    left:-140px;
    top:300px;
    z-index:2;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(4){
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    transform: rotate(-20deg);
    position:absolute;
    left:-30px;
    top:400px;
    z-index:3;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(5){
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    transform: rotate(6deg);
    position:absolute;
    left:-30px;
    top:600px;
    z-index:2;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(6){
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    transform: rotate(6deg);
    position:absolute;
    left:260px;
    z-index:2;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(7){
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    transform: rotate(6deg);
    position:absolute;
    left:330px;
    top:160px;
    z-index:4;
    border-radius:40px;
    opacity:0.9;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(8){
    -webkit-transform: rotate(-12deg);
    -moz-transform: rotate(-12deg);
    -ms-transform: rotate(-12deg);
    -o-transform: rotate(-12deg);
    transform: rotate(-12deg);
    position:absolute;
    left:500px;
    top:-150px;
    z-index:2;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(9){
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    transform: rotate(40deg);
    position:absolute;
    left:850px;
    top:-60px;
    z-index:4;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(10){
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    transform: rotate(40deg);
    position:absolute;
    left:1200px;
    top:700px;
    z-index:4;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(11){
    -webkit-transform: rotate(-40deg);
    -moz-transform: rotate(-40deg);
    -ms-transform: rotate(-40deg);
    -o-transform: rotate(-40deg);
    transform: rotate(-40deg);
    position:absolute;
    left:800px;
    top:450px;
    z-index:4;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:nth-of-type(12){
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    position:absolute;
    left:400px;
    top:600px;
    z-index:1;
    border-radius:40px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
div>img:hover{
    -webkit-transform:rotate(0) scale(1.1);
    -moz-transform:rotate(0) scale(1.1);
    -ms-transform:rotate(0) scale(1.1);
    -o-transform:rotate(0) scale(1.1);
    transform:rotate(0) scale(1.1);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(1):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(80px);
    -moz-transform:rotate(0) scale(1.1) translate(80px);
    -ms-transform:rotate(0) scale(1.1) translate(80px);
    -o-transform:rotate(0) scale(1.1) translate(80px);
    transform:rotate(0) scale(1.1) translate(80px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(3):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(140px);
    -moz-transform:rotate(0) scale(1.1) translate(140px);
    -ms-transform:rotate(0) scale(1.1) translate(140px);
    -o-transform:rotate(0) scale(1.1) translate(140px);
    transform:rotate(0) scale(1.1) translate(140px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(4):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(30px);
    -moz-transform:rotate(0) scale(1.1) translate(30px);
    -ms-transform:rotate(0) scale(1.1) translate(30px);
    -o-transform:rotate(0) scale(1.1) translate(30px);
    transform:rotate(0) scale(1.1) translate(30px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(5):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(30px,-100px);
    -moz-transform:rotate(0) scale(1.1) translate(30px,-100px);
    -ms-transform:rotate(0) scale(1.1) translate(30px,-100px);
    -o-transform:rotate(0) scale(1.1) translate(30px,-100px);
    transform:rotate(0) scale(1.1) translate(30px,-100px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(8):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(0px,150px);
    -moz-transform:rotate(0) scale(1.1) translate(0px,150px);
    -ms-transform:rotate(0) scale(1.1) translate(0px,150px);
    -o-transform:rotate(0) scale(1.1) translate(0px,150px);
    transform:rotate(0) scale(1.1) translate(0px,150px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(9):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(-180px,60px);
    -moz-transform:rotate(0) scale(1.1) translate(-180px,60px);
    -ms-transform:rotate(0) scale(1.1) translate(-180px,60px);
    -o-transform:rotate(0) scale(1.1) translate(-180px,60px);
    transform:rotate(0) scale(1.1) translate(-180px,60px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(10):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(-220px,-150px);
    -moz-transform:rotate(0) scale(1.1) translate(-220px,-150px);
    -ms-transform:rotate(0) scale(1.1) translate(-220px,-150px);
    -o-transform:rotate(0) scale(1.1) translate(-220px,150px);
    transform:rotate(0) scale(1.1) translate(-220px,-150px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(11):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(-55px,0px);
    -moz-transform:rotate(0) scale(1.1) translate(-55px,0px);
    -ms-transform:rotate(0) scale(1.1) translate(-55px,0px);
    -o-transform:rotate(0) scale(1.1) translate(-55px,0px);
    transform:rotate(0) scale(1.1) translate(-55px,0px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}
div>img:nth-of-type(12):hover{
    -webkit-transform:rotate(0) scale(1.1) translate(0px,-130px);
    -moz-transform:rotate(0) scale(1.1) translate(0px,-130px);
    -ms-transform:rotate(0) scale(1.1) translate(0px,-130px);
    -o-transform:rotate(0) scale(1.1) translate(0px,-130px);
    transform:rotate(0) scale(1.1) translate(0px,-130px);
    z-index:10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    opacity:1;
    filter:alpha(opacity=1);
}

