.photo {
  width: 1200px;
  margin: 0 auto;
  border: 1px #e3e3e3 solid;
  overflow: hidden;
}
.photo .content-top {
  height: 39px;
  line-height: 38px;
  padding: 0 20px;
  font-size: 16px;
  border-bottom: 1px #e3e3e3 solid;
  background: #f9f9f9;
  overflow: hidden;
}
.photo .manage-btn, .photo .recycle-btn {
  float: right;
  padding-left: 18px;
  font-size: 14px;
  background: url(../../img/space/diary/batch.png) 0 center no-repeat;
}
.photo .manage-btn:hover, .photo .recycle-btn:hover {
  color: #D71F26;
  background: url(../../img/space/diary/batchHover.png) 0 center no-repeat;
}
.photo .recycle-btn {
  margin-left: 1.2em;
  background: url(../../img/space/diary/recycle.png) 0 center no-repeat;
}
.photo .recycle-btn:hover {
  background: url(../../img/space/diary/recycleHover.png) 0 center no-repeat;
}
.photo .content-operate {
  line-height: 40px;
  margin: 25px 0;
  padding: 0 20px;
}
.photo .up-picture, .photo .new-photo {
  display: inline-block;
  width: 130px;
  padding-left: 46px;
  color: #fff;
  font-size: 16px;
  background: #D71F26 url(../../img/space/album/upPic.png) 16px center no-repeat;
  border-radius: 3px;
}
.photo .up-picture:hover, .photo .new-photo:hover {
  background: #c81017 url(../../img/space/album/upPic.png) 16px center no-repeat;
}
.photo .new-photo {
  background: #D71F26 url(../../img/space/album/add.png) 16px center no-repeat;
}
.photo .new-photo:hover {
  background: #c81017 url(../../img/space/album/add.png) 16px center no-repeat;
}
.photo .photo-list {
  padding: 0 0 15px 15px;
}
.photo .photo-list li {
  position: relative;
  float: left;
  width: 172px;
  height: 200px;
  margin: 0 27px 20px 0;
  box-shadow: 1px 1px 5px #ccc;
  border-radius: 3px;
}
.photo .photo-list li input {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
}
.photo .photo-list li:nth-child(6n) {
  margin-right: 0;
}
.photo .picture-number {
  position: absolute;
  top: 136px;
  left: 0;
  height: 24px;
  width: 172px;
  padding-right: 12px;
  line-height: 24px;
  text-align: right;
  color: #fff;
  background: rgba(0, 0, 0, 0.3);
}
.photo .photo-face {
  display: block;
  height: 160px;
}
.photo .photo-face img {
  width: 172px;
  height: 160px;
}
.photo .photo-name {
  display: block;
  padding: 0 6px;
  line-height: 40px;
  height: 40px;
  overflow: hidden;
}
.photo .photo-name img {
  float: right;
  margin-top: 10px;
}
.photo .picture-menu {
  display: none;
  position: absolute;
  top: 8px;
  right: 12px;
  height: 20px;
  width: 30px;
  background: #e3e3e3 url(../../img/space/album/list.png) center center no-repeat;
  cursor: pointer;
}
.photo .picture-menu p {
  display: none;
  position: absolute;
  top: 19px;
  left: -72px;
  width: 102px;
  padding-top: 3px;
  background: #e3e3e3;
  border-top: none;
}
.photo .picture-menu p a {
  display: block;
  height: 20px;
  line-height: 20px;
  padding-left: 1em;
  margin-bottom: 3px;
}
.photo .picture-menu p a:hover {
  background: #cbcbcb;
}
.photo .photo-info {
  width: 100%;
  padding: 25px 20px;
  overflow: hidden;
}
.photo .photo-info img {
  float: left;
  width: 130px;
  height: 130px;
  border: 1px #e3e3e3 solid;
}
.photo .photo-info-content {
  margin-left: 150px;
}
.photo .photo-info-content p {
  margin: 20px 0 0 0;
  color: #999;
  line-height: 30px;
}
.photo .photo-info-content p strong {
  font-size: 16px;
  margin-right: 20px;
  color: #262626;
}
.photo .edit-photo-btn {
  margin-left: 20px;
}
.photo .edit-photo-btn:hover {
  color: #D71F26;
}
.photo .picture-zan {
  background: url(../../img/space/album/zan.png) no-repeat 10px center;
  padding: 0 10px 0 28px;
}
.photo .picture-cmt {
  background: url(../../img/space/album/reply.png) no-repeat 10px center;
  padding: 0 10px 0 26px;
}
.photo .text-center {
  text-align: center;
}
.photo .back-list-btn {
  float: right;
  font-size: 12px;
  color: #D71F26;
}
.photo .up-photo-top {
  height: 26px;
  padding: 0 20px;
  margin: 20px 0;
  line-height: 26px;
}
.photo .up-photo-top select {
  width: 140px;
  height: 26px;
  border: 1px #e3e3e3 solid;
}
.photo .up-photo-box {
  width: 94%;
  margin: 20px auto;
}
.photo .check-num {
  color: #D71F26;
}
.photo .operate-done, .photo .batch-delete {
  display: inline-block;
  height: 24px;
  padding: 0 15px;
  margin: -3px 0 0 2em;
  line-height: 24px;
  text-align: center;
  font-weight: normal;
  font-size: 14px;
  vertical-align: 2px;
  color: #fff;
  background: #D71F26;
  border-radius: 3px;
}
.photo .operate-done:hover, .photo .batch-delete:hover {
  background: #c81017;
}
.photo .operate-done {
  float: right;
  margin-top: 6px;
}
.photo .photo-title {
  padding: 20px;
}
.photo .batch-operate {
  display: none;
}
.photo input[type='checkbox'] {
  width: 16px;
  height: 16px;
  background: #fff;
  border: 1px solid #e3e3e3;
  -webkit-appearance: none;
}
.photo input[type='checkbox']:checked:before {
  content: url(../../img/space/album/checked.png);
}
.photo .check-all {
  vertical-align: -2px;
}

.add-photo-shadow {
  display: none;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
}

.add-photo-box {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 450px;
  margin: -135px 0 0 -225px;
  background: #fff;
  border: 1px #e3e3e3 solid;
  border-radius: 3px;
}
.add-photo-box h3 {
  line-height: 30px;
  padding-left: 15px;
  border-bottom: 1px #e3e3e3 solid;
  background: #ededed;
}

.add-photo-ul {
  padding: 15px 0 15px 48px;
  background: #fff;
}
.add-photo-ul li {
  width: 100%;
  margin-bottom: 20px;
  overflow: hidden;
}
.add-photo-ul li span {
  float: left;
  width: 80px;
}
.add-photo-ul li input[type="text"] {
  width: 238px;
  height: 24px;
  padding-left: 5px;
  border: 1px #e3e3e3 solid;
}
.add-photo-ul li textarea {
  float: left;
  width: 238px;
  margin-right: 6px;
  padding: 5px;
  line-height: 20px;
  border: 1px #e3e3e3 solid;
  resize: none;
}
.add-photo-ul li select {
  border: 1px #e3e3e3 solid;
  height: 24px;
}

.add-photo-bottom {
  padding: 10px 20px;
  text-align: right;
  border-top: 1px #e3e3e3 solid;
  background: #ededed;
}
.add-photo-bottom input {
  width: 60px;
  height: 26px;
  margin-left: 16px;
  background: #D71F26;
  border: none;
  color: #fff;
  border-radius: 3px;
  cursor: pointer;
}
.add-photo-bottom input:hover {
  background: #c81017;
}
.add-photo-bottom .quit-btn {
  background: #626262;
}
.add-photo-bottom .quit-btn:hover {
  background: #555;
}

.picture-show-box {
  display: none;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99;
}
.picture-show-box .picture-shadow-ayer {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.8);
}
.picture-show-box .picture-box-close {
  position: absolute;
  top: 1%;
  right: -5px;
  background: #fff;
  width: 30px;
  height: 30px;
  background: #fff url(../../img/space/album/close.png) center center no-repeat;
  border-radius: 50%;
  z-index: 9;
}
.picture-show-box .show-wrapper {
  position: relative;
  margin: 0 auto;
  background: #000;
}
.picture-show-box .show-left {
  position: absolute;
  height: 100%;
}
.picture-show-box .show-right {
  position: absolute;
  top: 2%;
  right: 0;
  width: 300px;
  height: 96%;
  background: #f9f9f9;
  z-index: 1;
  overflow-y: auto;
  overflow-x: hidden;
}
.picture-show-box .show-right::-webkit-scrollbar {
  width: 5px;
}
.picture-show-box .show-right::-webkit-scrollbar-track-piece {
  background-color: transparent;
}
.picture-show-box .show-right::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 3px;
}
.picture-show-box .big-picture-box {
  position: relative;
  width: 100%;
  text-align: center;
  overflow: hidden;
}
.picture-show-box .big-picture-box img {
  max-width: 100%;
  max-height: 100%;
}
.picture-show-box .prev-big-img {
  display: none;
  position: absolute;
  left: 15px;
  top: 50%;
  width: 24px;
  height: 60px;
  margin-top: -30px;
  background: url(../../img/space/album/arr.png) -24px 0 no-repeat;
}
.picture-show-box .prev-big-img:hover {
  background: url(../../img/space/album/arr.png) 0 0 no-repeat;
}
.picture-show-box .next-big-img {
  display: none;
  position: absolute;
  right: 15px;
  top: 50%;
  width: 24px;
  height: 60px;
  margin-top: -30px;
  background: url(../../img/space/album/arr.png) -24px -60px no-repeat;
}
.picture-show-box .next-big-img:hover {
  background: url(../../img/space/album/arr.png) 0 -60px no-repeat;
}
.picture-show-box .photo-info-row {
  position: absolute;
  left: 0;
  bottom: 20px;
  width: 100%;
  height: 20px;
  padding: 0 15px;
  line-height: 20px;
  text-align: left;
  color: #fff;
}
.picture-show-box .photo-info-row strong {
  margin-right: 2em;
}
.picture-show-box .picture-nav-box {
  height: 50px;
  padding: 0 15px;
  margin-top: 3px;
  overflow: hidden;
}
.picture-show-box .picture-small-view {
  float: left;
  height: 50px;
  margin-left: 5px;
  overflow: hidden;
}
.picture-show-box .picture-small-view li {
  float: left;
  width: 50px;
  height: 50px;
  margin-right: 5px;
  cursor: pointer;
  overflow: hidden;
}
.picture-show-box .picture-small-view li img {
  width: 50px;
  height: 50px;
}
.picture-show-box .picture-small-view .picture-nav-li img {
  border: 4px #73b4e0 solid;
}
.picture-show-box .prev-row, .picture-show-box .next-row {
  float: left;
  width: 25px;
  height: 40px;
  margin-top: 5px;
  background: #0f0f0f url(../../img/space/album/prev.png) center center no-repeat;
  border-radius: 5px;
  cursor: pointer;
}
.picture-show-box .next-row {
  float: right;
  background: #0f0f0f url(../../img/space/album/next.png) center center no-repeat;
}
.picture-show-box .main-msg-content {
  margin: 0;
  border: none;
}
.picture-show-box .picture-info {
  margin-bottom: 10px;
}
.picture-show-box .picture-info p {
  margin-left: 52px;
  line-height: 20px;
}
.picture-show-box .picture-info a:hover {
  color: #D71F26;
}
.picture-show-box .user-name {
  float: left;
}
.picture-show-box .user-name img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px #e3e3e3 solid;
}
.picture-show-box .picture-time {
  color: #999;
}
.picture-show-box .edit-info-box {
  display: none;
  padding: 15px;
}
.picture-show-box .edit-info-box input {
  width: 100%;
  height: 22px;
  padding: 0 5px;
  border: 1px #e3e3e3 solid;
}
.picture-show-box .edit-info-box textarea {
  width: 100%;
  height: 60px;
  margin-top: 5px;
  padding: 5px;
  border: 1px #e3e3e3 solid;
  resize: none;
}
.picture-show-box .edit-info-box p {
  text-align: right;
}
.picture-show-box .edit-info-box p a {
  display: inline-block;
  padding: 0 14px;
  border: 1px #e3e3e3 solid;
  border-radius: 3px;
}
.picture-show-box .edit-info-box p a:first-child {
  color: #fff;
  background: #D71F26;
}
.picture-show-box .edit-info-box p a:first-child:hover {
  background: #c81017;
}
.picture-show-box *[data-edit] {
  cursor: pointer;
}

#picShowWrapper .btn {
  width: 60px;
  line-height: 22px;
}

.edit-photo-name input {
  width: 130px;
  height: 24px;
  border: 1px #e3e3e3 solid;
}

.dialog-input {
  width: 100px;
  height: 24px;
  padding: 0 5px;
  border: 1px #e3e3e3 solid;
}