.header-user-avatar,
img {
    vertical-align: middle
}

a,
img {
    border: 0;
    outline: 0
}

*,
.header-wrapper,
body,
input,
select,
textarea {
    font-family: Roboto, 'Segoe UI', Tahoma, Segoe UI, Arial, sans-serif
}

.commentTable {
    word-wrap: break-word;
    table-layout: fixed
}

@import url(https://fonts.googleapis.com/css?family=Roboto:100,200,300,400,500,700&subset=latin,latin-ext);
body {
    background: #e9e9e9;
    color: #4e5665;
    font-size: 13px;
    margin: 0;
    padding: 0
}

a {
    color: #4991c4;
    text-decoration: none;
    cursor: pointer
}

.announcement-wrapper a:hover,
.chat-wrapper a:hover,
.comment-wrapper .name:hover,
.footer-wrapper a:hover,
.short-profile-wrapper a:hover,
.story-wrapper .publisher-wrapper .name:hover,
.story-wrapper .text-wrapper a:hover,
.story-wrapper .via-name:hover,
.timeline-sidebar .sidebar-header-wrapper a:hover,
.view-more-wrapper:hover,
.window-list-wrapper .name:hover,
a.hover-line:hover {
    text-decoration: underline
}

input,
select,
textarea {
    background: #fff;
    background: linear-gradient(#d7d9da 1%, #fff 2%);
    color: #5e6776;
    text-overflow: ellipsis;
    font-size: 13px;
    border-radius: 3px;
    outline: 0
}

input[type=password],
input[type=text],
textarea {
    padding: 5px;
    border: 1px solid #e9eae9;
    color: #5e6776
}

textarea {
    background: #fff;
    background: linear-gradient(#f2f4f5 1%, #fff 2%);
    resize: none
}

select {
    color: #5e6776;
    padding: 4px;
    border: 1px solid #e6e7ea;
    border-radius: 3px
}

button,
input[type=button],
input[type=submit] {
    background: #f2f2f2;
    background: linear-gradient(#f5f6f7 1%, #fff 2%, #fff 70%, #f5f6f7 100%);
    color: #5e6776;
    text-align: center;
    font-size: 13px;
    font-weight: 500;
    padding: 4px 8px;
    border: 1px solid #d3d6db;
    border-radius: 3px;
    cursor: pointer
}

button.active,
input[type=button].active,
input[type=submit].active {
    background: #3c7fb4;
    background: linear-gradient(#4a8ac2, #2e74a6);
    color: #fff;
    border-color: #2e74a6
}

button:disabled,
input[type=submit]:disabled {
    background: #eaebec;
    background: linear-gradient(#ebeced, #e7e8e9);
    color: #7a7b7c;
    border: 1px solid #b6b7b8
}

input:disabled,
select:disabled,
textarea:disabled {
    cursor: default
}

#livepreview_dialog {
    padding: 0;
    height: 200px;
    width: 300px;
    background-color: #fff;
    background-image: url(/images/icon_loading.gif);
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    border: 5px solid #999;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px
}

#livepreview_dialog.left:after,
#livepreview_dialog.left:before,
#livepreview_dialog.right:before {
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none
}

#livepreview_dialog.right:before {
    left: 0;
    margin-left: -45px;
    border-right-color: #999;
    border-width: 20px;
    top: 50%;
    margin-top: -20px
}

#livepreview_dialog.left:after {
    right: 0;
    margin-right: -45px;
    border-left-color: #999;
    border-width: 20px;
    top: 50%;
    margin-top: -20px
}

#livepreview_iframe {
    box-shadow: inset 5px 5px 10px #666;
    -moz-box-shadow: inset 5 5px 10px #666;
    -webkit-box-shadow: inset 5 5px 10px #666
}


.header-wrapper {
    position: fixed;
    z-index: 500;
    top: 0;
    right: 0;
    left: 0;
    height: 44px;
    background: #3c7fb4;
    background: linear-gradient(#4a8ac2, #2e74a6);
    color: #fff;
    border-bottom: 1px solid #2e74a6
}

.header-wrapper a {
    color: #fff
}

.header-content {
    max-width: 920px;
    line-height: 45px;
    margin: 0 auto;
    padding: 0
}

.header-site-logo {
    height: 44px
}

.header-site-logo img {
    height: 20px;
    margin: 0 5px 2px 0
}

.header-live-search {
    display: inline-block;
    margin-left: 15px
}

.header-live-search input {
    width: 225px;
    height: 25px;
    background: rgba(0, 0, 0, .15);
    color: #fff;
    padding: 0 5px;
    border-width: 0 0 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, .1)
}

.header-user-info {
    background: #2e74a6;
    padding: 0 10px;
    margin-left: 2px
}

.header-user-info .dropdown-overlay-wrap {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 449
}

.header-user-info .header-user-link {
    position: relative;
    z-index: 450
}

.header-user-name {
    font-size: 13px;
    font-weight: 700
}

.header-user-avatar {
    display: inline-block;
    background: #fff;
    margin-bottom: 3px;
    padding: 2px;
    border-radius: 3px
}

.header-user-info .dropdown-icon {
    margin-left: 2px
}

.header-nav {
    position: relative;
    font-size: 15px;
    font-weight: 500;
    margin: 0;
    padding: 0 6px;
    cursor: pointer;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .25)
}

.header-nav i {
    color: rgba(255, 255, 255, .95);
    font-size: 21px
}

.header-nav-active i,
.header-nav:hover i {
    color: #fff
}

.header-nav-active:after {
    content: "";
    position: absolute;
    width: 13px;
    height: 13px;
    background: #fff;
    border: 1px solid #1e8995;
    transform: rotate(45deg);
    top: 38px;
    left: 8px
}

.header-nav .new-update-alert {
    position: absolute;
    top: 9px;
    right: 0;
    line-height: 15px;
    background: #c6b418;
    background: linear-gradient(#dece24, #b39f0f);
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .4);
    font-size: 11px;
    font-weight: 700;
    padding: 1px 3px;
    border-radius: 2px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .7)
}

.dropdown-more-content,
.dropdown-notification-content,
.dropdown-search-content {
    width: 100%;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .25)
}

.header-join-wrapper {
    display: block;
    font-size: 14px;
    padding: 0 15px
}

.notification-list .name,
.search-list .name {
    font-size: 13px;
    text-shadow: 0 0 0 #fff;
    font-weight: 500
}

.header-join-wrapper:hover {
    background: #4991c4
}

.dropdown-search-container {
    position: fixed;
    z-index: 4909;
    top: 43px;
    right: 0;
    left: 0;
    display: none
}

.dropdown-search-wrapper {
    max-width: 920px;
    margin: 0 auto
}

.dropdown-search-content {
    max-width: 450px;
    background: #fff;
    border: 0 solid rgba(0, 0, 0, .25);
    border-radius: 3px
}

.dropdown-search-content .search-header {
    position: relative;
    background: #fff;
    color: #4e5665;
    font-weight: 500;
    padding: 8px 10px;
    border-bottom: 1px solid #e8e9ea
}

.dropdown-search-content .search-header .close-btn {
    position: absolute;
    top: 7px;
    right: 7px
}

.dropdown-search-content .search-list {
    display: block;
    background: #fff;
    color: #898f9c;
    padding: 8px 10px;
    cursor: pointer
}

.dropdown-search-content .search-list:hover {
    background: #4991c4;
    color: #fff
}

.search-list .avatar {
    border-radius: 3px
}

.search-list .name {
    color: #4e5665;
    word-break: break-all
}

.search-list:hover .name {
    color: #fff
}

.dropdown-search-content .page-link {
    display: block;
    background: #fff;
    color: #898f9c;
    padding: 8px 10px;
    border-top: 1px solid #e7e8e7;
    border-radius: 0 0 3px 3px;
    cursor: pointer
}

.dropdown-search-content .page-link:hover {
    background: #4991c4;
    color: #fff
}

.dropdown-notification-container {
    position: fixed;
    z-index: 4909;
    top: 43px;
    right: 0;
    left: 0;
    display: none
}

.dropdown-notification-wrapper {
    max-width: 920px;
    margin: 0 auto
}

.dropdown-notification-content {
    max-width: 430px;
    background: #fff;
    border: 0 solid rgba(0, 0, 0, .25);
    border-radius: 3px
}

.dropdown-notification-content .notification-header {
    background: #fff;
    color: #4e5665;
    font-weight: 500;
    padding: 8px 10px;
    border-bottom: 1px solid #e8e9ea
}

.dropdown-notification-content .notification-list-wrapper {
    max-height: 400px;
    overflow-y: auto
}

.dropdown-notification-content .notification-list {
    display: block;
    background: #fff;
    color: #4e5665;
    padding: 8px 10px;
    border-bottom: 1px solid #e7e8e9;
    cursor: pointer
}

.dropdown-notification-content .notification-list:hover {
    background: #4991c4;
    color: #fff
}

.dropdown-notification-content .unread {
    background: #f7f8f9
}

.notification-list .avatar {
    border-radius: 3px
}

.notification-list .name {
    color: #4e5665
}

.notification-list:hover .name {
    color: #fff
}

.notification-list .time {
    color: #898f9c;
    font-size: 12px
}

.notification-list:hover .time {
    color: #fff
}

.dropdown-notification-content .page-link {
    display: block;
    background: #fff;
    color: #898f9c;
    padding: 8px 10px;
    border-radius: 0 0 3px 3px;
    cursor: pointer
}

.dropdown-notification-content .page-link:hover {
    background: #3c7fb4;
    color: #fff
}

.dropdown-more-container {
    position: fixed;
    z-index: 4909;
    top: 43px;
    right: 0;
    left: 0;
    display: none
}

.chat-wrapper,
.online-wrapper {
    position: fixed;
    z-index: 500;
    bottom: 0
}

.dropdown-more-wrapper {
    max-width: 920px;
    margin: 0 auto
}

.dropdown-more-content {
    max-width: 250px;
    background: #fff;
    border: 0 solid rgba(0, 0, 0, .25);
    border-radius: 3px
}

.dropdown-more-content .more-header {
    background: #fff;
    color: #4e5665;
    font-weight: 500;
    padding: 10px;
    border-bottom: 1px solid #e8e9ea
}

.dropdown-more-content .more-list {
    display: block;
    background: #fff;
    color: #898f9c;
    font-weight: 500;
    padding: 10px;
    border-bottom: 1px solid #e7e8e9;
    cursor: pointer
}

.dropdown-more-content .more-list:hover {
    background: #4991c4;
    color: #fff;
    border-color: #4991c4
}

.dropdown-more-content .more-list i {
    font-size: 14px;
    margin-right: 8px
}

.page-wrapper {
    max-width: 920px;
    color: #4e5665;
    margin: 45px auto 0
}

.page-margin {
    padding-top: 20px
}

.online-wrapper {
    right: 30px;
    width: 220px
}

.online-header {
    background: #f2f2f2;
    background: linear-gradient(#f5f6f7 1%, #fff 2%, #fff 70%, #f5f6f7 100%);
    color: #4e5665;
    font-weight: 500;
    padding: 5px 10px;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(212, 213, 214, .75) rgba(212, 213, 214, .75) #e9eaea;
    border-radius: 3px 3px 0 0;
    cursor: pointer
}

.online-header .chat-icon {
    color: #499e14;
    font-size: 9px;
    margin-right: 3px
}

.online-content-toggler {
    display: none
}

.online-list {
    max-height: 300px;
    overflow: auto;
    background: #fff;
    border-width: 0 1px 1px;
    border-style: solid;
    border-color: rgba(212, 213, 214, .75) rgba(212, 213, 214, .75) #e9eaeb
}

.online-list .column {
    background: #fff;
    padding: 5px 7px;
    border-bottom: 1px solid #e9eaeb
}

.online-list .column a.block {
    display: block;
    color: #4e5665
}

.online-list .column:hover {
    background: #f2f2f2
}

.online-list .online-icon {
    color: #adaeaf;
    font-size: 8px;
    margin-left: 3px
}

.online-list .active {
    color: #499e14
}

.online-list .user-avatar {
    margin-right: 5px;
    border-radius: 3px
}

.online-search {
    background: #fff;
    padding: 0 5px;
    border-width: 0 1px 1px;
    border-style: solid;
    border-color: rgba(212, 213, 214, .75)
}

.online-search input[type=text] {
    width: 100%;
    background: #fff;
    padding: 2px 0;
    border: 0;
    border-radius: 0
}

.chat-wrapper {
    right: 245px;
    width: 300px;
    margin-right: 20px
}

.chat-wrapper a {
    color: #343434
}

.chat-header {
    background: #3c7fb4;
    background: linear-gradient(#4a8ac2, #2e74a6);
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .25);
    font-size: 13px;
    font-weight: 500;
    padding: 6px 8px;
    border: 1px solid #2e74a6;
    border-radius: 2px 2px 0 0;
    cursor: pointer
}

.chat-header .online-icon {
    color: #e5e7e9;
    font-size: 9px;
    margin-right: 3px
}

.chat-header .close-icon {
    color: #e5e7e9
}

.chat-header .close-icon:hover {
    color: #fdfeff
}

.chat-header .active {
    color: #63d81b
}

.chat-messages {
    height: 275px;
    overflow: auto;
    background: #f2f3f4;
    padding: 0 10px 5px 8px;
    border-width: 0 1px 1px;
    border-style: solid;
    border-color: rgba(212, 213, 214, .75)
}

.chat-text {
    position: relative;
    display: block;
    color: #aaa;
    font-size: 12px;
    padding: 5px 0
}

.chat-text .user-avatar {
    border-radius: 3px
}

.text-wrapper .marker-out {
    position: absolute;
    top: 4px;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent
}

.align-left .marker-out {
    left: -8px;
    border-right: 8px solid rgba(212, 213, 214, .75)
}

.align-right .marker-out {
    right: -8px;
    border-left: 8px solid rgba(212, 213, 214, .75)
}

.text-wrapper .marker-in {
    position: absolute;
    top: -6px;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent
}

.align-left .marker-in {
    left: 2px;
    border-right: 7px solid #fff
}

.align-right .marker-in {
    right: 2px;
    border-left: 7px solid #fff
}

.chat-text .text-wrapper {
    position: relative;
    vertical-align: top;
    min-height: 15px;
    background: #fff;
    background: linear-gradient(to bottom, #fff 0, #fff 75%, #f5f6f7 100%);
    color: #4e5665;
    text-align: left;
    padding: 4px 5px 5px;
    border: 1px solid #cecfd0;
    border-radius: 4px;
    word-wrap: break-word;
    text-overflow: ellipsis
}

.align-left .text-wrapper {
    max-width: 170px;
    margin-left: 10px
}

.align-right .text-wrapper {
    max-width: 220px
}

.chat-text .photo-wrapper {
    margin: 3px 0 -4px
}

.chat-textarea {
    position: relative;
    background: #fff;
    margin-bottom: -5px;
    padding: 0 5px;
    border-width: 0 1px 1px;
    border-style: solid;
    border-color: rgba(212, 213, 214, .75)
}

.chat-textarea textarea {
    width: 92%;
    height: 23px;
    background: #fff;
    padding: 5px 0 0;
    border: 0;
    border-radius: 0;
    overflow: hidden
}

.chat-textarea .advanced-options {
    position: absolute;
    top: 3px;
    right: 5px;
    font-size: 15px
}

.chat-emoticons-wrapper {
    display: none;
    position: absolute;
    top: -130px;
    right: -5px;
    width: 170px;
    background: #fff;
    padding: 0;
    border-width: 1px 1px 0;
    border-style: solid;
    border-color: #d7d8d9;
    border-radius: 3px
}

.window-background,
.window-wrapper {
    position: fixed;
    top: 0;
    overflow: hidden
}

.chat-emoticons-wrapper img {
    display: inline-block;
    padding: 7px 9px;
    cursor: pointer
}

.window-background {
    z-index: 1000;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .8;
    background: #0b0b0b
}

.window-wrapper {
    z-index: 1010;
    left: 8px;
    right: 8px;
    max-width: 520px;
    background: #fff;
    margin: 15px auto 0;
    border-radius: 3px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .3)
}

.window-header-wrapper {
    position: relative;
    background: #f9faf9;
    padding: 10px;
    border-bottom: 1px solid #e5e6e7;
    border-radius: 3px 3px 0 0
}

.window-content-wrapper {
    max-height: 392px;
    overflow: auto;
    border-radius: 0 0 3px 3px
}

.button-content-wrapper {
    padding: 8px
}

.window-list-wrapper {
    padding: 8px;
    border-bottom: 1px solid #e9eaeb
}

.window-list-wrapper .avatar {
    border-radius: 3px;
    vertical-align: middle
}

.window-list-wrapper .name {
    color: #4e5665;
    font-weight: 500
}

.window-list-wrapper .name:hover {
    color: #4991c4
}

.window-btn a {
    display: inline-block;
    background: #f9faf9;
    background: linear-gradient(#f5f6f7 1%, #fff 2%, #fff 70%, #f5f6f7 100%);
    color: #4e5665;
    text-align: center;
    font-weight: 500;
    margin: 0;
    padding: 3px 10px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px;
    cursor: pointer
}

.short-profile-wrapper,
.short-profile-wrapper .short-cover img {
    border-radius: 3px 3px 0 0
}

.window-btn a i {
    margin-right: 3px
}

.window-btn a.active {
    background: #3c7fb4;
    background: linear-gradient(#4a8ac2, #2e74a6);
    color: #fff;
    border-color: #2e74a6
}

.no-content-wrapper {
    color: #898f9c;
    padding: 10px
}

span.window-close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #898f9c;
    cursor: pointer
}

.short-profile-wrapper a,
.window-close-btn:hover {
    color: #4e5665
}

.short-profile-wrapper {
    background: #fff;
    margin-bottom: 15px;
    border-bottom: 1px solid rgba(212, 213, 214, .75);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .07)
}

.short-profile-wrapper .short-cover {
    position: relative;
    margin-bottom: -3px;
    border-radius: 3px 3px 0 0
}

.short-profile-wrapper .short-avatar {
    position: absolute;
    left: 10px;
    bottom: -45px;
    background: #fff;
    padding: 2px 3px;
    border-radius: 3px
}

.short-profile-wrapper .short-avatar img {
    border-radius: 3px;
    margin-bottom: -3px
}

.short-profile-wrapper .short-info {
    font-size: 15px;
    padding: 7px 8px 10px 94px;
    margin: 0 -1px;
    border-width: 0 1px;
    border-style: solid;
    border-color: rgba(212, 213, 214, .75)
}

.story-filters-wrapper,
.story-publisher-box {
    margin-bottom: 15px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .07)
}

.short-name {
    word-wrap: break-word
}

.story-filters-wrapper {
    background: #fff;
    color: #4e5665;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px
}

.story-filters-wrapper .filter-header-wrapper {
    background: #fafafa;
    color: #444;
    font-weight: 500;
    padding: 10px;
    border-bottom: 3px solid #4a8ac2;
    border-radius: 3px 3px 0 0
}

.story-filters-wrapper .filter {
    background: #fff;
    color: #4e5665;
    padding: 10px;
    border-bottom: 1px solid #e9eaeb;
    cursor: pointer
}

.story-filters-wrapper .filter:hover {
    background: #f2f2f2;
    color: #4e5665
}

.story-filters-wrapper .filter-active {
    font-weight: 500
}

.story-filters-wrapper .filter i {
    width: 22px;
    display: inline-block;
    font-size: 15px
}

.story-publisher-box {
    width: 100%;
    background: #f2f2f2;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px
}

.story-publisher-box .box-header-wrapper {
    background: #fafafa;
    color: #444;
    font-weight: 500;
    padding: 10px;
    border-bottom: 3px solid #4a8ac2;
    border-radius: 3px 3px 0 0
}

.story-publisher-box .box-header-wrapper i {
    margin-right: 3px
}

.story-publisher-box .inputs-container {
    background: #fff;
    padding: 0;
    border-width: 1px 0;
    border-style: solid;
    border-color: #e9eaeb;
    border-radius: 0
}

.story-publisher-box textarea {
    border: 0 !important;
    height: 60px !important;
}

.story-publisher-box .input-wrapper {
    position: relative;
    width: 99.3%;
    display: none;
    background: #fff;
    color: #4e5665;
    border-top: 1px solid #e9eaeb;
    overflow: hidden
}

.story-publisher-box .input-wrapper i {
    width: 27px;
    display: inline-block;
    text-align: center
}

.story-publisher-box .input-wrapper i.icon {
    border-right: 1px solid #d3d4d5
}

.story-publisher-box .input-wrapper input {
    width: 80%;
    display: inline-block;
    background: #fff;
    color: #4e5665;
    padding: 5px;
    border: 0
}

.story-publisher-box .input-wrapper .input-result-wrapper {
    max-height: 300px;
    display: none;
    background: #fff;
    color: #4e5665;
    border-top: 1px solid #e9eaeb;
    overflow: auto
}

.input-result-wrapper .loading-wrapper {
    color: #838483;
    padding: 7px
}

.story-publisher-box .input-wrapper .remove-btn {
    position: absolute;
    top: 5px;
    right: 4px;
    color: #898f9c;
    font-size: 12px;
    cursor: pointer
}

.story-publisher-box .photo-wrapper .photos-container {
    display: block;
    color: #898f9c;
    padding: 5px 10px
}

.story-publisher-box .album-option {
    margin-right: 5px
}

.story-publisher-box .result-container {
    display: inline-block
}

.story-publisher-box .result-container .title {
    display: inline-block;
    color: #4e5665;
    font-size: 12px;
    font-weight: 500;
    padding: 7px 5px
}

.story-publisher-box .result-container .icon-ok {
    color: #94ce8c
}

.story-publisher-box .api-data-wrapper {
    padding: 5px;
    border-bottom: 1px solid #e9eaeb;
    cursor: pointer
}

.story-publisher-box .api-data-wrapper img.thumbnail {
    border-radius: 3px
}

.story-publisher-box .api-data-wrapper .name {
    font-weight: 500
}

.story-publisher-box .api-data-wrapper .info {
    color: #898f9c
}

.story-publisher-box .soundcloud-api-data img.thumbnail {
    background: url(../images/music-32-icon.png)
}

.story-publisher-box .more-wrapper {
    color: #4e5665;
    padding: 7px;
    border-radius: 0 0 3px 3px
}

.story-publisher-box .more-wrapper .option {
    display: inline-block;
    font-size: 15px;
    cursor: pointer
}

.story-publisher-box .more-wrapper .pre-loader {
    display: none;
    vertical-align: middle;
    margin-right: 5px
}

.story-wrapper {
    position: relative;
    background: #fff;
    color: #4e5665;
    margin-bottom: 10px;
    padding: 0;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .07)
}

.story-wrapper .publisher-wrapper {
    color: #898f9c;
    margin: 10px 25px 0 10px
}

.story-wrapper .publisher-wrapper .avatar {
    border-radius: 3px
}

.story-wrapper .publisher-wrapper .name {
    color: #4e5665;
    font-weight: 500;
    word-break: break-all
}

.story-wrapper .publisher-wrapper .name:hover {
    color: #4991c4
}

.story-wrapper .publisher-wrapper .recipient-indicator-icon {
    font-size: 10px;
    margin: 0 3px
}

.story-wrapper .other-data {
    color: #898f9c;
    margin-top: 0
}

.story-wrapper .location-wrapper i {
    margin-right: 2px
}

.story-wrapper .setting-buttons {
    position: absolute;
    top: 8px;
    right: 12px;
    color: #898f9c
}

.story-wrapper .setting-buttons span:hover {
    color: #4e5665
}

.story-wrapper .options-wrapper {
    color: #898f9c;
    margin: 10px 10px 0
}

.story-wrapper .opt {
    cursor: pointer
}

.story-wrapper .opt:hover {
    color: #4991c4
}

.story-wrapper .opt-active {
    color: #4991c4;
    cursor: pointer
}

.story-wrapper .text-wrapper {
    margin: 10px;
    word-wrap: break-word
}

.story-wrapper .photos-wrapper {
    margin: 10px 2px 1px
}

.story-wrapper .photos-wrapper img {
    margin: 0 -2px 1px 0;
    cursor: pointer
}

.story-wrapper .photos-wrapper img.width-3 {
    width: 33.225%
}

.story-wrapper .photos-wrapper img.width-2 {
    width: 49.94%
}

.story-wrapper .photos-wrapper img.width-1 {
    max-width: 100%
}

.story-wrapper .soundcloud-wrapper,
.story-wrapper .youtube-wrapper {
    margin: 10px 1px -2px
}

.story-wrapper .google-map-viewer-wrapper {
    margin: 10px 0 -3px
}

.story-wrapper .google-map-viewer-wrapper img {
    border-width: 1px 0;
    border-style: solid;
    border-color: rgba(212, 213, 214, .75)
}

.activity-wrapper,
.comments-container {
    background: #f2f2f2;
    border-top: 1px solid #e7e8e9
}

.activity-wrapper {
    color: #898f9c;
    font-weight: 500;
    padding: 10px;
    border-radius: 0 0 3px 3px
}

.activity-btn {
    cursor: pointer
}

.activity-btn:hover {
    color: #4991c4
}

.activity-wrapper .activity-btn i {
    margin-left: 2px
}

.story-wrapper .via-name {
    color: #898f9c
}

.story-wrapper .via-name:hover {
    color: #4991c4
}

.comments-container {
    position: relative
}

.view-more-wrapper {
    font-weight: 500;
    padding: 8px 10px;
    cursor: pointer
}

.comments-container .comments-wrapper {
    padding-top: 10px
}

.comment-wrapper {
    color: #4e5665;
    padding: 0 10px 12px
}

.comment-wrapper .avatar {
    border-radius: 3px
}

.comment-wrapper .comment-content {
    position: relative;
    padding-right: 25px;
    word-wrap: break-word;
    word-break: break-all
}

.comment-wrapper .name {
    color: #4e5665;
    font-weight: 500;
    word-break: break-all
}

.comment-wrapper .name:hover {
    color: #4991c4
}

.comment-wrapper .comment-text {
    margin-left: 1px;
    word-wrap: break-word
}

.comment-wrapper .setting-buttons {
    position: absolute;
    top: 0;
    right: 0;
    color: #898f9c
}

.comment-wrapper .setting-buttons span:hover {
    color: #4e5665
}

.comment-wrapper .other-data {
    color: #898f9c
}

.comment-wrapper .time {
    margin-right: 2px
}

.comment-wrapper .opt,
.comment-wrapper .opt-active {
    cursor: pointer
}

.comment-wrapper .opt-active,
.comment-wrapper .opt:hover {
    color: #4991c4
}

.comment-wrapper .comment-textarea {
    position: relative;
    background: #fff;
    padding: 6px 6px 0;
    border: 1px solid #d3d4d5;
    border-radius: 3px;
    box-shadow: 0 2px 3px 1px #f2f4f6 inset
}

.comment-wrapper .comment-textarea textarea {
    width: 100%;
    height: 24px;
    background: #fff;
    color: #4e5665;
    font-size: 12px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    overflow: hidden
}

.comment-wrapper .comment-textarea .progress-icon {
    position: absolute;
    top: 8px;
    right: 5px
}

.stories-container .load-btn {
    display: inline-block;
    background: #fff;
    background: linear-gradient(#f5f6f7 1%, #fff 2%, #fff 70%, #f5f6f7 100%);
    text-align: center;
    font-weight: 500;
    margin-bottom: 24px;
    padding: 7px 10px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px;
    cursor: pointer
}

.stories-container .load-btn i {
    margin-right: 2px
}

.pre-loader {
    text-align: center;
    font-size: 20px;
    font-weight: 500;
    margin: 50px 0
}

.message-container {
    background: #fff;
    color: #4e5665;
    margin-bottom: 10px;
    padding-bottom: 2px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px
}

.message-container .container-header {
    background: #fafafa;
    color: #444;
    font-weight: 500;
    padding: 10px;
    border-bottom: 3px solid #4a8ac2;
    border-radius: 3px 3px 0 0
}

.message-container .text-messages-container {
    height: 630px;
    overflow-x: hidden;
    overflow-y: auto;
    word-break: break-all;
    background: inherit;
    border-width: 0 0 1px;
    border-style: solid;
    border-color: #e9eaeb
}

.message-container .view-more-wrapper {
    color: #4e5665;
    margin: 0 6px;
    padding: 8px 0 6px;
    border-bottom: 1px solid #ecedee
}

.message-container .text-message-wrapper {
    display: block;
    margin: 0 6px;
    padding: 8px 0 6px;
    border-bottom: 1px solid #ecedee
}

.message-container .no-wrapper {
    color: #898f9c;
    margin-top: 12px
}

.text-message-wrapper img.avatar {
    border-radius: 3px
}

.text-message-wrapper .message-content {
    margin: 0 0 0 6px
}

.text-message-wrapper .publisher-name {
    display: block;
    color: #4e5665;
    font-weight: 500;
    word-break: break-all
}

.text-message-wrapper .message-text {
    color: #696f7c
}

.text-message-wrapper .photo-wrapper {
    margin-top: 3px
}

.text-message-wrapper .photo-wrapper img {
    width: 100%;
    height: auto;
    border-radius: 3px
}

.text-message-wrapper .time {
    color: #898f9c;
    font-size: 12px
}

.message-container .textarea-container {
    background: #f7f7f7;
    position: relative;
    margin: 0 0 -5px;
    padding: 10px
}

.textarea-container .options-wrapper {
    position: absolute;
    top: 27.5%;
    right: 7px;
    color: #898f9c;
    font-size: 14px
}

.cover-container,
.cover-wrapper {
    position: relative
}

.textarea-container .options-wrapper .opt {
    margin-left: 4px
}

.message-container .textarea-container textarea {
    width: 100%;
    height: 22px;
    background: #fff;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden
}

.message-recipient-wrapper {
    background: #fff;
    color: #4e5665;
    margin-bottom: 10px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px
}

.message-recipient-wrapper .wrapper-header {
    background: #fafafa;
    color: #4e5665;
    font-weight: 500;
    padding: 10px;
    border-bottom: 3px solid #4a8ac2;
    border-radius: 3px 3px 0 0
}

.message-recipient-wrapper .wrapper-header input[type=text] {
    width: 90%;
    background: inherit;
    color: #fff;
    margin: 0;
    padding: 0;
    border: 0
}

.message-recipient-wrapper .recipient-list-wrapper {
    max-height: 700px;
    overflow-y: scroll;
    padding: 0 2px
}

.message-recipient-wrapper .recipient-list {
    background: #fff;
    padding: 5px 7px;
    border-bottom: 1px solid #e9eaeb
}

.message-recipient-wrapper .recipient-list a.block {
    display: block;
    color: #4e5665
}

.message-recipient-wrapper .recipient-list:hover {
    background: #f2f2f2
}

.message-recipient-wrapper .recipient-avatar {
    margin-right: 5px;
    border-radius: 3px
}

.message-recipient-wrapper .online-icon {
    color: #adaeaf;
    font-size: 8px;
    margin-left: 3px
}

.message-recipient-wrapper .active {
    color: #499e14
}

.message-recipient-wrapper .update-alert {
    background: #1a8e12;
    background: linear-gradient(#30d825, #1a8e12);
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .4);
    font-size: 11px;
    font-weight: 500;
    margin-left: 4px;
    padding: 1px 3px;
    border-radius: 2px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .3)
}

.timeline-header-wrapper {
    background: #fff;
    margin: 0 auto 15px;
    padding: 0
}

.cover-wrapper {
    width: 100%
}

.cover-wrapper:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url(../images/cover-shadow.png) left 0 bottom -1px repeat-x;
    content: ''
}

.cover-wrapper img {
    width: 100%;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .3)
}

.cover-resize-wrapper {
    position: relative;
    width: 100%;
    height: 276px;
    overflow: hidden;
    display: none
}

.cover-resize-wrapper img {
    position: absolute;
    width: 100%;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .3)
}

.cover-resize-wrapper .drag-div {
    position: absolute;
    top: 0;
    width: 100%;
    background: rgba(0, 0, 0, .15);
    color: #fff;
    font-weight: 500;
    padding: 7px;
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 3px
}

.cover-progress {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    background: rgba(0, 0, 0, .6);
    color: #fff;
    text-align: center
}

.timeline-header-wrapper .avatar-wrapper {
    position: absolute;
    left: 15px;
    bottom: -27px;
    display: inline;
    border-radius: 3px
}

.timeline-header-wrapper .avatar-wrapper img {
    width: 155px;
    height: auto;
    background: #fff;
    padding: 4px;
    border-radius: 3px
}

.timeline-header-wrapper .avatar-change-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    visibility: hidden;
    opacity: 0;
    color: #fff;
    text-align: center;
    font-size: 23px;
    padding-top: 65px;
    border-radius: 3px;
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    -o-transition: all .25s
}

.timeline-header-wrapper .avatar-change-wrapper i {
    color: #fff;
    cursor: pointer;
    text-shadow: 0 0 2px rgba(0, 0, 0, .5);
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    -o-transition: all .25s
}

.timeline-header-wrapper .avatar-wrapper:hover .avatar-change-wrapper {
    visibility: visible;
    opacity: 1
}

.timeline-header-wrapper .avatar-progress-wrapper {
    position: absolute;
    top: 5px;
    right: 5px;
    bottom: 3px;
    left: 5px;
    display: none;
    background: rgba(0, 0, 0, .45);
    color: #fff;
    text-align: center;
    padding: 50px 0 0;
    border-radius: 3px
}

.timeline-header-wrapper .timeline-name-wrapper {
    position: absolute;
    left: 190px;
    bottom: 7px;
    display: inline-block;
    color: rgba(255, 255, 255, .5);
    text-shadow: 0 0 3px rgba(0, 0, 0, .9);
    font-size: 19px;
    font-weight: 500
}

.group-header-wrapper .timeline-name-wrapper {
    left: 12px
}

.timeline-header-wrapper .timeline-name-wrapper a {
    color: #fff;
    word-break: break-all
}

.timeline-header-wrapper .timeline-name-wrapper .verified-badge {
    display: inline-block;
    vertical-align: middle;
    background: #5890ff;
    color: #fff;
    text-shadow: 0 0 0 #fff;
    font-size: 10px;
    margin-bottom: 5px;
    padding: 1px 1px 1px 3px;
    border-radius: 100%;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .3)
}

.timeline-buttons a,
.timeline-statistics-wrapper .statistic a {
    display: block;
    color: #4e5665
}

.timeline-statistics-wrapper {
    padding-left: 182px;
    border-width: 0 1px 1px;
    border-style: solid;
    border-color: #d4d5d4
}

.group-header-wrapper .timeline-statistics-wrapper {
    padding-left: 0
}

.timeline-statistics-wrapper .statistic {
    background: #fff;
    font-weight: 500;
    padding: 10px 15px;
    border-right: 1px solid #e5e6e7
}

.timeline-statistics-wrapper .statistic small {
    font-weight: 400
}

.timeline-statistics-wrapper .statistic:hover {
    background: #f5f6f7
}

.timeline-buttons {
    margin-bottom: 5px
}

.timeline-buttons a {
    width: 96%;
    background: #f2f2f2;
    background: linear-gradient(#f5f6f7 1%, #fff 2%, #fff 70%, #f5f6f7 100%);
    text-align: center;
    font-weight: 500;
    margin: 0 0 5px;
    padding: 7px 0;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px;
    cursor: pointer
}

.timeline-buttons a i {
    margin-right: 3px
}

.timeline-buttons .active {
    background: #4a8ac2;
    background: linear-gradient(#4a8ac2, #4991c4);
    color: #fff;
    border-color: #4991c4
}

.cover-resize-buttons {
    display: none
}

.timeline-sidebar {
    background: #fff;
    color: #4e5665;
    margin-bottom: 10px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px
}

.timeline-sidebar .sidebar-header-wrapper {
    background: #fafafa;
    color: #444;
    font-weight: 500;
    padding: 10px;
    border-bottom: 3px solid #4a8ac2;
    border-radius: 3px 3px 0 0
}

.list-wrapper,
.list-wrapper a,
.timeline-sidebar .sidebar-div a,
.timeline-sidebar .sidebar-header-wrapper a {
    color: #4e5665
}

.timeline-sidebar .sidebar-div {
    color: #4e5665;
    margin: 0 10px;
    padding: 10px 0;
    border-bottom: 1px solid #e9eaeb
}

.timeline-370 {
    min-height: 370px
}

.list-wrapper {
    background: #fff;
    margin-bottom: 15px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .07)
}

.list-wrapper a.active {
    color: #4991c4
}

.list-wrapper .list-header {
    background: #fafafa;
    color: #444;
    font-weight: 500;
    padding: 10px;
    border-bottom: 3px solid #4a8ac2;
    border-radius: 3px 3px 0 0
}

.list-header a {
    color: #4a8ac2
}

.list-wrapper .list-header input[type=text] {
    width: 93%;
    background: inherit;
    color: #898f9c;
    margin: 0;
    padding: 0;
    border: 0
}

.list-wrapper .list-popup-alert {
    background: #eff7b5;
    color: #4e5665;
    text-align: center;
    font-weight: 500;
    padding: 8px;
    border-bottom: 1px solid #dfeb8a;
    border-radius: 3px 3px 0 0
}

.list-wrapper .list-column {
    display: block;
    background: #fff;
    color: #4e5665;
    padding: 10px;
    border-bottom: 1px solid #e9eaeb
}

.list-wrapper .column-hover:hover,
.list-wrapper .new-column {
    background: #f2f2f2
}

.list-column .info {
    color: #898f9c;
    font-size: 12px
}

.list-column .column-btn {
    font-size: 12px;
    font-weight: 500
}

.list-column .column-btn a {
    background: #f2f2f2;
    background: linear-gradient(#f5f6f7 1%, #fff 2%, #fff 70%, #f5f6f7 100%);
    color: #4e5665;
    text-align: center;
    font-weight: 500;
    margin: 0 0 5px 5px;
    padding: 4px 8px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px;
    cursor: pointer
}

.list-column .column-btn a i {
    margin-right: 3px
}

.list-column .column-btn .active {
    background: #3c7fb4;
    background: linear-gradient(#4a8ac2, #2e74a6);
    color: #fff;
    border-color: #2e74a6
}

.form-container {
    background: #fff;
    color: #4e5665;
    margin-bottom: 10px;
    padding-bottom: 2px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px
}

.form-container .form-header {
    background: #fafafa;
    color: #444;
    font-weight: 500;
    padding: 10px;
    border-bottom: 3px solid #4a8ac2;
    border-radius: 3px 3px 0 0
}

.form-container .success-message {
    background: #eff7b5;
    color: #4e5665;
    font-weight: 500;
    padding: 8px;
    border-bottom: 1px solid #dfeb8a;
    border-radius: 3px 3px 0 0
}

.form-container .form-input-wrapper {
    display: block;
    padding: 10px;
    border-bottom: 1px solid #e7e8e9
}

.form-input-wrapper label {
    margin: 5px 5px 5px 0
}

.form-input-wrapper label i {
    color: #aaa;
    font-size: 13px
}

.form-input-wrapper small {
    color: #898f9c;
    font-size: 13px;
    margin: 1px 0 0 24px
}

.form-container input {
    margin: 0
}

.form-container input,
.form-container select,
.form-container textarea {
    width: 96%
}

.form-container input[type=checkbox],
.form-container input[type=radio] {
    width: auto
}

.footer-wrapper {
    margin: 15px 0
}

.footer-content {
    max-width: 920px;
    margin: 0 auto;
    padding: 0;
    border-top: 1px solid rgba(212, 213, 214, .75)
}

.footer-line {
    margin: 10px 0
}

.empty-wrapper {
    background: #fff;
    color: #6b6b6b;
    margin: 0 0 10px;
    padding: 10px;
    border: 1px solid rgba(212, 213, 214, .75);
    border-radius: 3px
}

.no-wrapper {
    color: #898f9c;
    padding: 10px
}

.hidden {
    display: none
}

.cursor-hand {
    cursor: pointer
}

.float-left {
    float: left
}

.float-right {
    float: right
}

.float-clear {
    clear: both
}

.span5 {
    width: 5%
}

.span10 {
    width: 10%
}

.span15 {
    width: 15%
}

.span20 {
    width: 20%
}

.span25 {
    width: 25%
}

.span30 {
    width: 30%
}

.span35 {
    width: 35%
}

.span36 {
    width: 36%
}

.span40,
.span45 {
    width: 40%
}

.span50 {
    width: 50%
}

.span55 {
    width: 55%
}

.span60 {
    width: 60%
}

.span65 {
    width: 65%
}

.span70 {
    width: 70%
}

.span75 {
    width: 75%
}

.span80 {
    width: 80%
}

.span85 {
    width: 85%
}

.span95 {
    width: 95%
}

.span100 {
    width: 100%
}

.span49 {
    width: 49%
}

.span59 {
    width: 59%
}

.span63 {
    width: 63%
}

.span69 {
    width: 69%
}

.span74 {
    width: 74%
}

.space1 {
    margin: 0 1px
}

.space2 {
    margin: 0 2px
}

.space3 {
    margin: 0 3px
}

.space4 {
    margin: 0 4px
}

.space5 {
    margin: 0 5px
}

.space6 {
    margin: 0 6px
}

.bold-500 {
    font-weight: 500
}

.radius3 {
    border-radius: 3px
}

.radius100 {
    border-radius: 3px
}

.update-alert {
    background: #c6b418;
    background: linear-gradient(#dece24, #b39f0f);
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .4);
    font-size: 11px;
    font-weight: 500;
    margin-left: 4px;
    padding: 1px 3px;
    border-radius: 2px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .3)
}

img.emoticon {
    width: 16px;
    vertical-align: top
}

.dropdown-search-content .hashtag-result {
    display: block;
    background: #fff;
    color: #898f9c;
    padding: 8px 10px;
    cursor: pointer
}

.dropdown-search-content .hashtag-result:hover {
    background: #4991c4;
    color: #fff
}

.story-publisher-box .emoticons-wrapper {
    padding: 0
}

.story-publisher-box .emoticons-wrapper img {
    display: inline-block;
    padding: 7px 6px;
    cursor: pointer
}

.message-container .text-message-wrapper {
    position: relative
}

.text-message-wrapper .remove-btn {
    position: absolute;
    top: 7px;
    right: 3px;
    color: #babbbc;
    cursor: pointer
}

.text-message-wrapper .remove-btn:hover {
    color: #898f9c
}

.album-name-header,
.e-album-upload-container {
    font-size: 15px;
    color: #6e7887;
    font-weight: 500
}

.album-label,
.album-name-header,
.lb-story-pubname,
.s-album-header {
    font-weight: 500
}

.s-album-container {
    background: #fff;
    border: 1px solid #d4d5d6;
    border-radius: 4px
}

.s-album-header {
    background: #f2f2f2;
    padding: 10px;
    border-bottom: 1px solid #e9eaeb;
    border-radius: 3px 3px 0 0
}

.album-field-wrap {
    padding: 8px 10px 15px
}

.album-label {
    margin-bottom: 6px
}

.s-album-container input[type=file],
.s-album-container input[type=text],
.s-album-container textarea {
    width: 90%
}

.s-album-container textarea {
    resize: vertical;
    height: 50px
}

.e-album-upload-container {
    background: #fff;
    border: 1px solid #dadbdc;
    border-radius: 3px;
    cursor: pointer
}

.left-side {
    float: left;
    width: 50%;
    padding: 12px 0
}

.right-side {
    float: right;
    width: 49.6%;
    padding: 12px 0;
    border-left: 1px solid #eaebec
}

.full-width {
    display: block;
    padding: 12px 0
}

.full-width:hover,
.left-side:hover,
.right-side:hover {
    background: #f2f2f2
}

.e-album-upload-container a {
    color: #6e7887
}

.e-album-photos-container {
    background: #fff;
    margin-top: 25px;
    border: 1px solid #dadbdc;
    border-radius: 3px
}

.lb-comment-pubavatar,
.lb-story-pubavatar {
    border-radius: 3px
}

.album-name-header {
    padding: 10px 0 0
}

.album-descr-para {
    color: #6e7887;
    font-size: 12px;
    padding: 0 0 10px;
    border-bottom: 1px solid #eaebec
}

.album-photos {
    margin-top: -9px
}

.album-photos .e-photo {
    position: relative;
    float: left;
    width: 141px;
    margin: 0 0 3px 3px;
    cursor: pointer;
    transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out
}

.album-photos .e-photo:hover {
    opacity: .85
}

.e-photo .remove-btn {
    position: absolute;
    top: 0;
    right: 0;
    background: rgba(0, 0, 0, .6);
    color: #fff;
    padding: 1px 3px 1px 5px;
    transition: all 250ms ease-in-out;
    -webkit-transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    -ms-transition: all 250ms ease-in-out
}

.sc-lightbox,
.sc-lightbox-bg {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0
}

.e-photo .remove-btn:hover {
    background: red
}

.sc-lightbox-bg {
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .875);
    z-index: 998
}

.sc-lightbox {
    z-index: 1000
}

.lb-container {
    margin: 0 auto;
    padding: 0;
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, .6)
}

.lb-container .img-float {
    float: left;
    margin: 0;
    padding: 0
}

.lb-container .comment-flow {
    position: relative;
    width: 350px;
    float: right;
    background: #e7e7e7;
    overflow: auto
}

.lb-story-meta {
    background: #fff
}

.lb-story-pubwrap {
    padding: 10px
}

.lb-story-time {
    color: #aaa
}

.lb-story-options {
    color: #898f9c;
    margin: 4px 13px 12px
}

.lb-story-options .opt {
    cursor: pointer
}

.lb-story-options .opt:hover {
    color: #4991c4
}

.lb-story-options .opt-active {
    color: #4991c4;
    cursor: pointer
}

.lb-story-text {
    padding: 0 12px 12px
}

.lb-container .comment-wrapper {
    padding: 7px;
    border-top: 1px solid rgba(0, 0, 0, .05);
    border-bottom: 0
}

.lb-new-comment-meta {
    padding: 5px 4px;
    border-width: 1px 0 0;
    border-style: solid;
    border-color: rgba(0, 0, 0, .05)
}

.lb-new-comment-textarea {
    width: 93.5%;
    height: 24px;
    margin: 0;
    padding: 6px 7px 0;
    border: 1px solid #d6d6d6
}

.lb-close-btn {
    position: absolute;
    top: 11px;
    right: 7px;
    color: #aaa;
    cursor: pointer
}

.lb-close-btn:hover {
    color: #666
}

.announcement-container {
    background: #fcf8e3;
    color: #8a6d3b;
    margin-bottom: 10px;
    padding: 0 10px;
    border: 1px solid #ecdfc5;
    border-radius: 4px
}

.announcement-header {
    font-size: 13px;
    font-weight: 700;
    padding: 10px 0
}

.announcement-wrapper {
    padding: 10px 0;
    border-top: 1px solid #ecdfc5
}

.page-loading-bar {
    position: fixed;
    z-index: 501;
    top: 45px;
    left: -6px;
    width: 0;
    height: 3px;
    background: #00abeb;
    background: linear-gradient(to right, #9dd53a 0, #9dd53a 100%);
    border-radius: 1px;
    transition: width .5s ease-out, opacity .4s linear;
    -webkit-transition: width .5s ease-out, opacity .4s linear;
    -moz-transition: width .5s ease-out, opacity .4s linear;
    -ms-transition: width .5s ease-out, opacity .4s linear;
    -o-transition: width .5s ease-out, opacity .4s linear
}

.page-loading-bar dd,
.page-loading-bar dt {
    position: absolute;
    width: 180px;
    right: -80px;
    opacity: .6;
    box-shadow: #000 1px 0 6px 1px;
    clip: rect(-6px, 90px, 14px, -6px)
}

.pre_load_wrap {
    position: fixed;
    z-index: 500;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .875);
    margin: 0 auto;
    overflow: hidden
}

.bubblingG {
    width: 70px;
    height: 44px;
    text-align: center;
    vertical-align: middle;
    margin: 20% auto
}

.bubblingG span {
    width: 9px;
    height: 9px;
    display: inline-block;
    background: #096F7D;
    vertical-align: middle;
    margin: 22px auto;
    border-radius: 44px;
    animation: bubblingG 1.2s infinite alternate;
    -webkit-animation: bubblingG 1.2s infinite alternate;
    -moz-animation: bubblingG 1.2s infinite alternate;
    -ms-animation: bubblingG 1.2s infinite alternate;
    -o-animation: bubblingG 1.2s infinite alternate
}

#bubblingG_1 {
    -moz-animation-delay: 0s;
    -webkit-animation-delay: 0s;
    -ms-animation-delay: 0s;
    -o-animation-delay: 0s;
    animation-delay: 0s
}

#bubblingG_2 {
    -moz-animation-delay: .36s;
    -webkit-animation-delay: .36s;
    -ms-animation-delay: .36s;
    -o-animation-delay: .36s;
    animation-delay: .36s
}

#bubblingG_3 {
    -moz-animation-delay: .72s;
    -webkit-animation-delay: .72s;
    -ms-animation-delay: .72s;
    -o-animation-delay: .72s;
    animation-delay: .72s
}

@-moz-keyframes bubblingG {
    0% {
        width: 9px;
        height: 9px;
        background-color: #096F7D;
        -moz-transform: translateY(0)
    }
    100% {
        width: 21px;
        height: 21px;
        background-color: #FFF;
        -moz-transform: translateY(-18px)
    }
}

@-webkit-keyframes bubblingG {
    0% {
        width: 9px;
        height: 9px;
        background-color: #096F7D;
        -webkit-transform: translateY(0)
    }
    100% {
        width: 21px;
        height: 21px;
        background-color: #FFF;
        -webkit-transform: translateY(-18px)
    }
}

@-ms-keyframes bubblingG {
    0% {
        width: 9px;
        height: 9px;
        background-color: #096F7D;
        -ms-transform: translateY(0)
    }
    100% {
        width: 21px;
        height: 21px;
        background-color: #FFF;
        -ms-transform: translateY(-18px)
    }
}

@-o-keyframes bubblingG {
    0% {
        width: 9px;
        height: 9px;
        background-color: #096F7D;
        -o-transform: translateY(0)
    }
    100% {
        width: 21px;
        height: 21px;
        background-color: #FFF;
        -o-transform: translateY(-18px)
    }
}

@keyframes bubblingG {
    0% {
        width: 9px;
        height: 9px;
        background-color: #096F7D;
        transform: translateY(0)
    }
    100% {
        width: 21px;
        height: 21px;
        background-color: #FFF;
        transform: translateY(-18px)
    }
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #b4b4b4;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .4)
}

::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(231, 231, 231, .4)
}

button i {
    margin-right: 3px
}

@media only screen and (max-device-width:960px),
only screen and (max-width:960px) {
    .header-content,
    body {
        padding: 0 8px
    }
    .chat-container,
    .desktop-only,
    .timeline-header-wrapper .avatar-change-wrapper {
        display: none
    }
    [class*=" span"],
    [class^=span] {
        width: 100%
    }
    .window-wrapper {
        position: absolute
    }
    .window-content-wrapper {
        height: auto;
        max-height: auto
    }
    .message-container .text-messages-container {
        height: auto
    }
    .message-recipient-wrapper .recipient-list-wrapper {
        max-height: 3840px;
        padding: 0
    }
    .timeline-header-wrapper .avatar-wrapper {
        left: 12px;
        bottom: -20px
    }
    .timeline-header-wrapper .avatar-wrapper img {
        width: 80px;
        padding: 2px
    }
    .timeline-header-wrapper .avatar-progress-wrapper {
        top: 2px;
        right: 2px;
        bottom: 2px;
        left: 2px;
        padding: 20px 0 0
    }
    .timeline-header-wrapper .timeline-name-wrapper {
        left: 110px;
        font-size: 15px;
        font-weight: 500
    }
    .group-header-wrapper .timeline-name-wrapper {
        left: 10px
    }
    .timeline-statistics-wrapper {
        padding-left: 100px
    }
    .timeline-statistics-wrapper .statistic {
        padding: 10px
    }
    .timeline-370 {
        min-height: 0
    }
}

@media only screen and (max-device-width:500px),
only screen and (max-width:500px) {
    .timeline-statistics-wrapper {
        padding-left: 0
    }
    .timeline-statistics-wrapper .statistic {
        padding: 25px 10px 10px
    }
    .group-header-wrapper .timeline-statistics-wrapper .statistic {
        padding: 10px
    }
}

@media only screen and (max-device-width:358px),
only screen and (max-width:358px) {
    .timeline-statistics-wrapper .statistic {
        word-break: break-all
    }
}

@media only screen and (max-device-width:675px),
only screen and (max-width:675px) {
    .header-live-search input {
        width: 95px
    }
}

@media only screen and (max-device-width:545px),
only screen and (max-width:545px) {
    .header-user-link {
        display: none
    }
}

@media only screen and (max-device-width:479px),
only screen and (max-width:479px) {
    .header-site-logo {
        display: none
    }
    .header-live-search {
        margin: 0
    }
}

@media only screen and (max-device-width:400px),
only screen and (max-width:400px) {
    .header-user-avatar {
        display: none
    }
}

@media only screen and (max-device-width:345px),
only screen and (max-width:345px) {
    .header-live-search input {
        width: 60px
    }
    .header-user-info {
        padding: 0 7px
    }
}