/*--------------中间内容-----------------*/
.container{
  background: #f5f5f5;
}
/*--------------banner-------------------*/
.banner{
  margin-top: 10px;
  height: 98px;
  background: url(../images/activity-banner.jpg);
}
/*-----------------活动列表页------------------*/
/*-----------------左侧------------------*/
.content .left{
  float:left;
  width:240px;
  overflow: hidden;
  clear: left;
}
/*-----------------右侧------------------*/
.content .right{
  float: left;
  margin-left: 30px;
  width: 920px;
  background: #fff;
  padding-bottom: 10px;
  margin-bottom: 30px;
}
.right .tab-menu .tab .title{
  height: 60px;
  padding: 0;
  width: 100px;
}
.tab-menu .tab.last .title{
  width: 112px;
}
.right .tab-menu .tab .title .date{
  padding-top: 13px;
}
.right .tab-menu .tab .title .date,
.right .tab-menu .tab .title .week{
  line-height: 1;
  font-size: 16px;
}
/*-----------------列表------------------*/
.right .activities-list{
  padding:0 20px;
}
.right .activities-list .day{
  font-size: 16px;
  border-bottom: 1px solid #eceff0;
  line-height: 1;
  padding: 40px 0 20px;
}
.right .activities-list .list{
  padding: 0 10px;
  height: 60px;
  border-bottom: 1px solid #eceff0;
}
.right .activities-list .list .time,
.right .activities-list .list .title,
.right .activities-list .list .creator,
.right .activities-list .list .address,
.right .activities-list .list .apply-number{
  font-size: 14px;
  float: left;
  line-height: 1;
  height: 60px;
  line-height: 60px;
  color: #333;
  overflow: hidden;
  word-break: break-all;
}
.right .activities-list .list .time{
  font-size: 16px;
  font-weight: bold;
  width:80px;
  color: #48a5dd;
}
.right .activities-list .list .title{
  width:260px;
}
.right .activities-list .list .creator{
  width: 102px;
  margin-left: 40px;
  /*text-align: center;*/
}
.right .activities-list .list .address{
  width:200px;
}
.right .activities-list .list .apply-number{
  width:100px;
  overflow: visible;
  position: relative;
  text-align: center;
}
.right .activities-list .list .btn-span{
  padding-top: 20px;
  overflow: hidden;
  float: left;
  font-size: 14px;
}
.right .activities-list .list .btn-xs{
  padding: 8px;
  font-size: 14px;
  margin-top: -5px;
}
.icon-down-arrow{
  cursor: pointer;
}
.right .activities-list .list .apply-people{
  width:360px;
  position: absolute;
  top: 45px;
  z-index: 1000;
  left: -200px;
  background: #fff;
  border-radius: 5px;
  -webkit-box-shadow:  1px 1px 20px rgba(0,0,0,.2);
  -moz-box-shadow: 1px 1px 20px rgba(0,0,0,.2);
  box-shadow:  1px 1px 20px rgba(0,0,0,.2);
  padding: 20px 10px 10px;
  display: none;
}
.right .activities-list .list .head-img-24{
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}
.page{
  float: right;
  margin: 24px 20px; 
}
/*-----------------活动详情页------------------*/
.content .info,
.content .intro-content,
.content .comment-content{
  background: #fff;
  position: relative;
  padding: 30px 40px;
}
.cancelApply{
  cursor: pointer;font-size: 20px;color: #F00;
  position: absolute;
  right: 10px;
  z-index: 1;
  top: 10px;
}
.cancelAttention{
  cursor: pointer; 
  font-size: 14px;
  color: #F00;   
}
.content .comment-content{
  overflow: hidden;
}
.content .details-div{
  width: 760px;
  min-height: 270px;
}
.content .details-div>.title{
  font-size: 18px;
  color: #4d4d4d;
  font-weight: bold;
  margin-bottom: 30px;
  margin-left: -12px;
  line-height: 1;
}
.content .details-div>.title .type{
  font-size: 18px;
  font-weight: bold;
  line-height: 1;
}
.content .details-div .details{
  overflow: hidden;
  margin-bottom: 20px;
}
.content .details-div>.details>.title{
  font-size: 14px;
  color: #8c8c8c;
  float: left;
  line-height: 1;
}
.content .details-div .details .value{
  font-size: 14px;
  color: #333;
  float: left;
  line-height: 1;
}
.content .angle{
  position: absolute;
  top: -10px;
  left: 794px;
  width:6px;
  height: 10px;
  background: url(../images/div-boxshadow.jpg);
}
.content .apply-div{
  position: absolute;
  width:350px;
  top: -10px;
  left: 800px;
  background: #f5f5f5;
  border: 1px solid #e9e9e9;
  padding: 30px 20px 0 30px;
}
.content .apply-div .apply{
  margin-bottom: 20px;
  overflow: hidden;
}
.escape-clause{
  margin-bottom: 5px;
}
.escape-clause-label{
  font-size: 12px;
  float: none;
}
.form-group{
  margin-bottom: 15px;
}
.content .apply-div .apply .title,
.content .apply-div .apply .value,
.modal-body .form-group .title,
.modal-body .form-group .value{
  float: left;
  font-size: 14px;
  line-height: 1;
}
.content .apply-div .apply .number-div{
  margin-top: 5px;
}
.content .apply-div .apply.apply-number{
  margin-bottom: 10px;
}
.content .apply-div .apply.add{
  margin-left: 80px;
}
.content .apply-div .apply.add .input{
  width: 50px;
  height: 25px;
  vertical-align: middle;
  text-align: center;
  float: none;
}
.content .apply-div .apply.add .clear{
  float: left;
  clear: both;
  width: 100%;
  height: 1px;
  margin-bottom: 10px;
}
.content .apply-div .apply .left-span,
.modal-body .msg{
  float: left;
  color: #fb584c;
}
.content .apply-div .apply .right-span{
  float: right;
}
.content .apply-div .btn-lg{
  padding: 11px 0;
  margin-bottom: 10px;
}
.content .apply-div .btn-width.btn-confirm{
  margin-right: 10px;
}
.content .apply-div .btn-width{
  width: 140px;
}
.content .apply-div .price-title,
.modal-body .form-group .price-title{
  margin-top: 15px;
}
.modal-body .form-group .name-title{
  margin-top: 5px;
}
.content .apply-div .activity-price,
.modal-body .form-group .activity-price{
  float: left;
  border: 2px solid #ccc;
  border-radius: 5px;
  margin-right: 10px;
  text-align: center;
  padding: 5px;
  cursor: pointer;
}
.content .apply-div .already.title{
  font-size: 24px;
  color: #ffac00;
}
.content .apply-div .apply.already{
  margin-bottom: 35px;
}
.content .apply-div .cancel-apply.title{
  float: right;
  color: #48a5dd;
  margin-top: 5px;
}
.content .apply-people{
  margin-bottom: 10px;
}
.content .intro .map .title,
.content .intro .description .title,
.content .apply-people > .title{
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #4c4c4c;
}
.content .waiting-people > .title{
  font-size: 14px;
  margin-bottom: 20px;
  color: #4c4c4c;
}
.content .apply-people .persons {
  overflow: hidden;
}
.content .apply-people .persons .people{
  float: left;
  width: 158px;
  margin-bottom: 20px;
}
.content .apply-people .persons .people .people-span{
  display: inline-block;
  vertical-align: middle;
  position: relative;
}

.content .apply-people .persons .people .people-span .name{
 color: #333;
 position: relative;
 font-size: 14px; 
 white-space: nowrap;
 text-overflow: ellipsis;
 overflow: hidden;
 width: 110px;
 height: 20px;
 line-height: 1;
}
.content .waiting-people .head-img{
  margin-right: 5px;
}
.content .waiting-people .name{
  margin-right: 20px;
}
.content .intro{
  margin-top: 30px;
  background: #fff;
  margin-bottom: 80px;
}
.content .intro .navigation-menu{
  background: #fcfcfc;
}
.content .intro .navigation-menu .navigationlist .title{
  padding:0 30px;
}
.content .intro .intro-content .map{
  overflow: hidden;
  margin-bottom: 20px;
}
.content .intro .intro-content .map-div{
  width:520px;
  height: 240px;
  float: left;
  background: #FFD771;
}
.content .intro .intro-content .address{
  float: left;
  margin-left: 50px;
}
.content .intro .intro-content .address .name{
  margin-top: 50px;
}
.content .intro .intro-content .address .title-address,
.content .intro .intro-content .address .title-tel{
  font-weight: normal;
  margin-bottom: 0;
}
.content .intro .intro-content .address .btn-div{
  margin-top: 20px;
}
.content .intro .intro-content .description-content{
  font-size: 14px;
  color: #4c4c4c;
}
.content .comment-content {
  display: none;
}
.content .comment-content .input-margin{
  margin-bottom: 10px;
  height: 80px;
}
.content .comment-content .btn-comment{
  float: right;
}
.comment-content .comments .comment *{
  font-size: 14px;
  line-height: 1;
  color: #333;
}
.comment-content .comments .comment{
  overflow: hidden;
  padding:20px 0 10px;
  border-bottom: 1px solid #d9d9d9;
}
.comment-content .comments .comment .head-img{
  float: left;
}
.comment-content .comments .comment .comment-info{
  margin-left: 55px;
}
.comment-content .comments .comment .name-div{
  overflow: hidden;
  margin-bottom: 10px;
}
.comment-content .comments .comment .name-div .name{
  float: left;
}
.comment-content .comments .comment .datetime{
  float: right;
  font-size: 12px;
  color: #808080;
}
.comment-content .comments .comment .reply{
  margin-top: 12px;
  background: #f5f5f5;
  position: relative;
  padding: 10px;
  border-radius: 5px;
}
.comment-content .comments .comment .reply .name{
  margin-bottom:  10px;
}
.comment-content .comments .comment .reply .triangle{
 width: 0;
 height: 0;
 border-left: 6px solid transparent;
 border-right: 6px solid transparent;
 border-bottom: 10px solid #f5f5f5;
 position: absolute;
 top: -10px;
 left: 20px;
}
.comment-content .comments .comment .reply-btn{
  float: right;
  margin-top: 10px;
}
.comment-content .comments .comment .reply-btn a{
  font-size: 12px;
}
#editJoin{
  z-index:2;
}
.btn-lg-forApply{
  padding:11px 0;
}
/*------------------ card-flipped -----------------------*/
#editJoin{
  z-index:2;
}
#join{
  z-index: 3;
  /*height: 322px;*/
}
.card{
  -webkit-perspective: 500;
  perspective: 500;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.card-flipped.front { 
  -webkit-backface-visibility: hidden;
  -moz-transform:rotate3d(0,1,0,180deg); 
  -webkit-transform:rotate3d(0,1,0,180deg);
  transform:rotate3d(0,1,0,180deg);
} 
.card-flipped.back { 
  -webkit-backface-visibility: hidden;
  -moz-transform:rotate3d(0,1,0,0deg);
  -webkit-transform:rotate3d(0,1,0,0deg);
  transform:rotate3d(0,1,0,0deg); 
} 
.copy-activity{
  color: #48a5dd; 
  font-size: 16px;
  font-weight: bold;
}