.content{padding-right:60px;margin-left:50px;overflow:hidden;min-height:650px;padding-top:60px}.content .top{height:112px;line-height:65px;margin-top:25px;overflow:hidden}.content .atlas-desc{margin-top:-44px;width:1000px}.content .top h1{margin:0;font-weight:400}.content .top .all-num{font-size:18px;margin-left:15px;color:#999}.content .top a{display:-webkit-box;display:-moz-box;display:inline-block;width:100px;height:100px;padding:25px;padding-left:32px;padding-right:20px;line-height:26px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;letter-spacing:10px;color:#333;cursor:pointer;-webkit-box-shadow:0 0 15px 0 rgba(0,0,0,.1);box-shadow:0 0 15px 0 rgba(0,0,0,.1);margin:6px 6px 0 0}.content ul.water-fall-ul{margin-top:30px;margin-bottom:100px}.content ul.water-fall-ul li{width:230px;height:230px;float:left;margin:10px;position:relative}.content ul.water-fall-ul li .add,.content ul.water-fall-ul li .item-choose{position:absolute;right:10px;top:10px;text-shadow:0 1px 2px rgba(0,0,0,.9);text-align:center;color:#fff;z-index:2;opacity:0;width:25px;height:25px}.content ul.water-fall-ul li .item-choose{left:10px;right:auto;border:1px solid #fff;box-shadow:0 0 2px 0 rgba(0,0,0,.3)}.content ul.water-fall-ul li .item-choose i{font-size:18px;vertical-align:middle;display:none}.content ul.water-fall-ul li .item-choose.active i{display:inline-block}.content ul.water-fall-ul li .add i:before{font-size:22px}.content ul.water-fall-ul li .add i.icon-f-heart,.content ul.water-fall-ul li .add i.icon-load{display:none}.content ul.water-fall-ul li .add:hover i.icon-f-heart{display:block}.content ul.water-fall-ul li .add.active i.icon-e-heart,.content ul.water-fall-ul li .add:hover i.icon-e-heart{display:none}.content ul.water-fall-ul li .add.active,.content ul.water-fall-ul li .item-choose.active{opacity:1}.content ul.water-fall-ul li .add.load i.icon-e-heart,.content ul.water-fall-ul li .add.load i.icon-f-heart{display:none}.content ul.water-fall-ul li .add.active i.icon-f-heart{display:block}.content ul.water-fall-ul li .add.active i.icon-f-heart:before{color:#ff7975}.content ul.water-fall-ul li .add.load.active i.icon-f-heart{display:none}.content ul.water-fall-ul li .add.load i.icon-load{display:block;font-weight:700;-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}@keyframes fa-spin{0%{transform:rotate(0);transform:rotate(0)}100%{transform:rotate(359deg);transform:rotate(359deg)}}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.content ul.water-fall-ul li img{width:100%;height:100%}.content ul.water-fall-ul li .mask-wra{width:100%;height:100%;position:absolute;top:0;left:0;background-color:rgba(0,0,0,.2);-webkit-transition:all .4s;-khtml-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;-ms-transition:all .4s;transition:all .4s;opacity:0}.content ul.water-fall-ul li .mask{position:absolute;bottom:0;left:0;height:40px;line-height:40px;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;color:#fff;padding:0 5px;background-color:rgba(255,255,255,.4);-webkit-transition:all .4s;-khtml-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;-ms-transition:all .4s;transition:all .4s;opacity:0;overflow:hidden}.content ul.water-fall-ul li .mask .title{display:-webkit-box;display:-moz-box;display:inline-block;width:45%;margin-left:-100%;-webkit-transition:all .4s ease-in-out;-khtml-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}.content ul.water-fall-ul li .mask .img-id{display:-webkit-box;display:-moz-box;display:inline-block;margin-right:-100%;-webkit-transition:all .4s;-khtml-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;-ms-transition:all .4s;transition:all .4s}.content ul.water-fall-ul li:hover .add,.content ul.water-fall-ul li:hover .item-choose{webkit-opacity:1;-moz-opacity:1;opacity:1}.content ul.water-fall-ul li:hover .mask-wra{opacity:1}.content ul.water-fall-ul li:hover .mask{opacity:1}.content ul.water-fall-ul li:hover .title{margin-left:0}.content ul.water-fall-ul li:hover .img-id{margin-right:0}