.colla-tabs .colla-tab {
 display:inline-block;
 margin-right:15px;
 color:#888
}
.colla-tabs .colla-tab.active {
 border-bottom:2px solid #4386f5;
 color:#333;
 padding-bottom:10px
}
.colla-context-con .loading-view2 {
 display:block;
 margin:0 auto;
 width:30px;
 font-size:20px;
 margin-top:70px;
 position:relative
}
.colla-follow-more {
 position:absolute;
 bottom:0;
 left:25%;
 line-height:20px;
 display:block;
 text-align:center;
 font-size:12px;
 color:#333;
 border:1px solid #ddd;
 width:50%
}
.colla-context-con {
 min-height:100px;
 max-height:170px;
 overflow:auto
}
#role_list::-webkit-scrollbar {
 width:5px;
 height:5px
}
#role_list::-webkit-scrollbar-thumb {
 border-width:0;
 border-color:#fff;
 border-radius:6px;
 background-color:#c6c6c6
}
.colla-tab-content {
 position:relative;
 display:none
}
.colla-tab-content:first-child {
 display:block
}
.colla-tab-content:after {
 content:'';
 display:block;
 height:1px;
 clear:both
}
.colla-context-con .colla-users-none {
 text-align:center;
 margin-top:40px;
 color:#999;
 font-size:14px
}
.colla-context-con .colla-users-none .icons {
 font-size:50px;
 color:#888;
 margin-bottom:10px;
 display:block
}
.colla-context-con .colla-users-none img {
 width:78px
}
.colla-context-con .colla-team {
 margin:0;
 padding:3px 5px;
 position:relative;
 cursor:default
}
.colla-context-con .colla-team:first-child {
 margin:8px 0 0 0
}
.colla-context-con .colla-team-user .colla-user {
 float:none;
 margin:0;
 margin-bottom:2px;
 padding:2px
}
.colla-context-con .colla-team-user>div {
 margin-bottom:2px;
 cursor:pointer;
 padding:5px 0;
 padding-left:42px
}
.colla-context-con .colla-team-user>div:hover {
 background:#f3f4f5
}
.colla-context-con .colla-team-user span:first-child {
 width:28px;
 display:inline-block
}
.colla-context-con .colla-team-user span img {
 width:28px;
 vertical-align:-6px;
 border-radius:3px 0 0 3px
}
.colla-context-con .colla-team {
 height:30px;
 line-height:30px;
 border-radius:3px
}
.colla-context-con .colla-team:hover {
 background:#eee
}
.colla-context-con .colla-team>span:first-child {
 display:inline-block;
 min-width:36px
}
.colla-context-con .colla-team>span img {
 border-radius:3px 0 0 3px;
 width:28px;
 vertical-align:-9px
}
.colla-context-con .colla-team .icons {
 vertical-align:-1px;
 margin-left:5px;
 position:absolute;
 top:4px
}
.colla-context-con .colla-team .icons.teamlogo {
 font-size:28px;
 top:4px;
 margin-left:0;
 color:#777
}
.colla-context-con .colla-team .title {
 font-size:13px
}
#colla_users {
 width:100%;
 position:relative
}
#colla_users:after {
 content:'';
 display:block;
 clear:both
}
.colla-context-con .colla-user {
 -webkit-box-sizing:border-box;
 -moz-box-sizing:border-box;
 box-sizing:border-box;
 width:33%;
 padding:2px 10px;
 margin:10px 0;
 display:inline-block;
 vertical-align:middle;
 cursor:pointer;
 float:left;
 white-space:nowrap;
 overflow:hidden
}
.colla-context-con .colla-user>span {
 display:inline-block;
 vertical-align:middle
}
.colla-context-con .colla-user>span:last-child {
 padding-left:12px;
 border-left:0;
 font-size:12px;
 color:#333;
 border-radius:0 3px 3px 0;
 min-width:50px;
 vertical-align:middle;
 max-width:100px;
 white-space:nowrap;
 text-overflow:ellipsis;
 overflow:hidden
}
.colla-context-con .colla-user>span:last-child:hover {
 color:#333
}
.colla-context-con .colla-user>span img {
 display:block;
 border-radius:50%;
 width:30px;
 height:30px
}
.colla-item[tit=contacter] {
 height:200px;
 border:1px solid #ddd;
 border-radius:3px;
 padding:2px 5px
}
.colla-user-item {
 font-family:arial,寰蒋闆呴粦;
 background:#e0e0e0;
 font-size:13px;
 text-align:center;
 margin:8px 0 0 4px;
 color:#444;
 border-radius:0 3px 3px 0;
 display:inline-block;
 height:30px;
 padding-right:8px
}
.colla-user-item img {
 width:30px;
 border-radius:3px 0 0 3px;
 vertical-align:-10px
}
.colla_role_list {
 width:480px;
 border:1px solid #d9d9d9;
 overflow-x:hidden;
 overflow-y:auto;
 max-height:110px
}
.colla_role_list .role_item {
 height:25px;
 padding:2px 0;
 overflow:hidden;
 line-height:25px;
 position:relative
}
.colla_role_list .role_item .user_photo {
 width:25px;
 float:left;
 margin-left:5px
}
.colla_role_list .role_item .user_username {
 text-align:left;
 float:left;
 margin-left:7px;
 line-height:25px;
 width:400px
}
.colla_role_list .role_item .user_given_role {
 line-height:25px;
 float:right;
 margin-right:10px
}
.colla_role_list .role_item .user_inviting_ {
 float:right;
 margin-right:50px;
 text-align:right
}
.tab_title label {
 cursor:pointer;
 display:inline-block;
 text-align:center;
 background-color:#fff;
 border:1px solid #bbbdc0;
 font-size:12px;
 width:25%;
 padding:5px 0;
 border-top-left-radius:5px;
 border-top-right-radius:5px
}
.tab_title .active {
 background-color:#50c28b;
 color:#fff
}
#colla_add {
 max-height:calc(100% - 66px);
 overflow:hidden;
 overflow-y:auto
}
#colla_add .dialog-title {
 padding:0 24px
}
#colla_add .tab_content {
 height:200px;
 border:1px solid #d9d9d9
}
#colla_add .tab_content div {
 display:none
}
#role_list {
 margin:-8px 0 10px;
 max-height:180px;
 overflow-y:auto;
 min-height:100px
}
#role_list .role-item {
 position:relative;
 padding:8px 3px
}
#role_list .role-item>span {
 vertical-align:middle;
 display:inline-block
}
#role_list .item-portrait {
 display:inline-block;
 width:10%
}
#role_list .item-portrait>img {
 width:30px;
 border-radius:50%;
 vertical-align:-10px
}
#role_list .item-user-fullname {
 display:inline-block;
 width:25%;
 font-size:12px;
 color:#333;
 white-space:nowrap;
 overflow-x:hidden;
 text-overflow:ellipsis
}
#role_list .role-item .closeme {
 position:absolute;
 top:12px;
 right:0;
 display:none;
 cursor:pointer;
 margin-left:10px;
 padding:2px;
 width:20px;
 height:20px
}
#role_list .role-item:hover .closeme {
 display:inline-block
}
#role_list .role-item .item-role-status {
 display:inline-block;
 width:40%;
 text-align:left;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap
}
#role_list .role-sel-con {
 display:inline-block;
 width:15%;
 font-size:12px;
 text-align:center
}
#role_list .role-sel-con>select {
 height:24px;
 border-radius:3px;
 padding:0;
 background-color:transparent;
 border:1px solid #dbdbdb
}
#role_list .role-sel-con>select:hover {
 border-color:#adadad
}
.colla-link .switch-container {
 position:static;
 margin-left:16px;
 vertical-align:middle
}
.colla-link {
 margin:0 24px;
 border-bottom:1px solid #eee;
 padding-bottom:20px
}
.colla-link .link-tip {
 font-size:12px;
 color:#999
}
.colla-link .link-code-con,
.colla-link .link-ope,
.colla-link .link-set {
 margin-top:16px;
 display:flex;
 display:-webkit-flex;
 justify-content:space-between;
 align-items:center
}
#link_input {
 width:100%;
 padding:0 8px;
 height:30px;
 color:#999;
 box-sizing:border-box;
 -moz-box-sizing:border-box;
 -webkit-box-sizing:border-box;
 background:rgba(238,238,238,1);
 border:0;
 border-radius:0
}
.colla-link .link-code-icons {
 font-size:17px;
 position:absolute;
 right:8px;
 top:8px
}
.colla-link .link-code-icons:hover #link_code {
 display:block
}
#link_code {
 display:none;
 position:absolute;
 top:31px;
 left:50%;
 margin-left:-50px
}
#link_expire,
#link_role {
 height:30px;
 padding:0;
 margin-left:16px;
 width:80px;
 vertical-align:middle;
 margin-top:-2px
}
.colla-link .link-copy {
 color:#fff;
 cursor:pointer;
 padding:0 18px;
 height:30px;
 line-height:30px;
 text-align:center;
 background:rgba(67,134,245,1)
}
.switch-container {
 border:0;
 display:inline-block;
 position:absolute;
 top:9px;
 right:12px
}
.switch-security {
 position:relative;
 top:3px;
 left:-25px
}
.switch-container .switch-check {
 position:absolute;
 left:-9999px
}
.switch-container .colla-switch {
 position:relative;
 display:block;
 width:3em;
 height:1.3em;
 cursor:pointer;
 border-radius:1.5em;
 transition:350ms;
 background:#eee
}
.switch-container .colla-switch::after {
 position:absolute;
 content:'';
 width:1.5em;
 height:1.5em;
 top:-.1em;
 left:-.1em;
 border-radius:50%;
 transition:width .2s ease-out,height .3s 50ms ease-in,top .3s 50ms ease-in,left 250ms 50ms ease-in,background .3s ease-in,box-shadow .3s ease-in;
 border:1px solid #eee;
 box-sizing:border-box;
 background:#fff
}
.switch-container input:checked+.colla-switch {
 background-color:#4386f5;
 border-color:#4386f5
}
.switch-container input:checked+.colla-switch::after {
 position:absolute;
 content:'';
 width:1.5em;
 height:1.5em;
 top:-.1em;
 border-radius:50%;
 left:1.5em;
 background-color:#fff;
 box-shadow:0 1px 3px rgba(0,0,0,.4)
}