a,
blockquote,
body,
dd,
div,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
html,
img,
input,
label,
li,
ol,
p,
pre,
td,
th,
ul {
  margin: 0;
  padding: 0;
  outline: 0;
}
body {
  font: 14px -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    "Helvetica Neue",
    Arial,
    Helvetica,
    Geneva,
    sans-serif;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: none;
}
.background-grey {
  background-color: #eee;
}
.background-black {
  background-color: #000;
}
a {
  color: #09f;
  text-decoration: none;
}
#container {
  position: relative;
  overflow: hidden;
  margin: 0 auto;
  clear: both;
}
.page {
  width: 972px;
  padding-top: 24px;
  margin: 0 0 32px 224px;
}
.main-wrap {
  float: left;
  width: 640px;
}
input[type=email],
input[type=password],
input[type=text],
input[type=url],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  border: 1px solid #ddd;
  font: 14px -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    "Helvetica Neue",
    Arial,
    Helvetica,
    Geneva,
    sans-serif;
}
input[type=email], input[type=password], input[type=text], input[type=url] {
  line-height: 20px;
  height: 20px;
  padding: 9px;
  border-radius: 2px;
  display: block;
  margin: 6px 0;
  width: 440px;
}
input[type=email].error,
input[type=password].error,
input[type=text].error,
input[type=url].error,
textarea.error {
  color: #B94A48;
}
textarea {
  outline: 0;
  border-radius: 2px;
  line-height: 20px;
  padding: 9px;
  resize: none;
  margin: 6px 0;
  display: block;
}
select {
  display: block;
  box-sizing: border-box;
  line-height: 20px;
  height: 40px;
  padding: 5px 0;
  font: 14px -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    "Helvetica Neue",
    Arial,
    Helvetica,
    Geneva,
    sans-serif;
  border: 1px solid #999;
  font-weight: bold;
  outline: 0;
  margin: 6px 0;
}
.field {
  margin: 20px 0;
  position: relative;
}
.field label {
  display: block;
  font-weight: bold;
}
.field p.tips {
  color: #999;
  font-size: 12px;
}
.field p.error-message {
  font-size: 12px;
  color: red;
  margin-top: 10px;
}
.field.checkbox {
  margin: 10px 0;
}
.field.checkbox label {
  font-weight: 400;
  position: relative;
  padding: 4px 0 4px 20px;
}
.field.checkbox label input[type=checkbox] {
  position: absolute;
  left: 0;
  top: 6px;
}
.field.checkbox label input[type=radio] {
  position: absolute;
  left: 0;
  top: 5px;
}
.file-field {
  background-color: #f4f4f4;
  height: 20px;
  padding: 9px;
  border: 1px solid #ddd;
  border-radius: 2px;
  margin: 6px 0;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .1) inset;
}
.date-picker {
  overflow: hidden;
  width: 420px;
}
.date-picker input.day, .date-picker input.month, .date-picker input.year {
  float: left;
  text-align: center;
}
.date-picker input.year {
  width: 37%;
}
.date-picker input.day, .date-picker input.month {
  width: 20%;
  margin-left: 2%;
}
.field.captcha h3 {
  margin: 20px 0 5px;
  font-size: 14px;
}
.field.avatar label {
  margin-bottom: 6px;
}
.field.avatar .avatar-container {
  float: left;
  border-radius: 2px;
  overflow: hidden;
}
.field.avatar .avatar-container img {
  display: block;
  width: 80px;
  height: 80px;
}
.field.avatar .control {
  float: left;
  margin: 20px 0 20px 20px;
  height: 40px;
}
.field.avatar input[type=file] {
  margin-bottom: 6px;
}
.btn-container {
  padding: 10px 0;
  margin-top: 20px;
  overflow: hidden;
}
a.btn, input[type=submit] {
  color: #fff;
  background-color: #09f;
  padding: 8px 16px;
  height: 20px;
  border: none;
  border-radius: 2px;
  font: 14px / 20px -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    "Helvetica Neue",
    Arial,
    Helvetica,
    Geneva,
    sans-serif;
  font-weight: bold;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  text-align: center;
  -webkit-appearance: none;
  box-sizing: content-box;
}
a.btn:hover, input[type=submit]:hover {
  background-color: #33adff;
  color: #fff;
}
a.btn:active, input[type=submit]:active {
  background-color: #007acc;
  color: #fff;
}
a.btn.size-30 {
  font-size: 12px;
  padding: 4px 15px;
}
a.btn.red {
  background-color: #FE2232;
  border-color: #FE2232;
}
a.btn.red:hover {
  background-color: #fe5561;
  border-color: #fe5561;
}
a.btn.red:active {
  background-color: #DB0111;
  border-color: #DB0111;
}
a.btn.grey {
  background-color: #f4f4f4;
  color: #999;
}
a.btn.grey:hover {
  background-color: #eee;
}
a.btn.grey:active {
  background-color: #e9e9e9;
}
a.btn.disabled {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}
a.line-btn {
  height: 32px;
  line-height: 18px;
  padding: 6px 16px;
  border: 2px solid #000;
  color: #000;
  box-sizing: border-box;
  display: inline-block;
  font-weight: bold;
  border-radius: 16px;
}
a.line-btn.solid {
  height: 32px;
  line-height: 16px;
  padding: 6px 16px;
  border: 2px solid #000;
  background-color: #000;
  color: #fff;
  box-sizing: border-box;
  display: inline-block;
  font-weight: bold;
  border-radius: 16px;
}
a.line-btn.solid:hover {
  background-color: #444;
}
a.line-btn.solid:active {
  background-color: #222;
}
a.line-btn.solid.selected {
  background-color: rgba(0,0,0,0.06);
  border-color: transparent;
  color: #000;
}
a.line-btn.solid.selected:hover {
  background-color: rgba(0,0,0,0.1);
}
a.line-btn.solid.selected:active {
  background-color: rgba(0,0,0,0.12);
}
a.line-btn {
  height: 32px;
  line-height: 18px;
  padding: 6px 16px;
  border: 2px solid #000;
  color: #000;
  box-sizing: border-box;
  display: inline-block;
  font-weight: bold;
  border-radius: 16px;
}
a.line-btn.solid {
  height: 32px;
  line-height: 16px;
  padding: 6px 16px;
  border: 2px solid #000;
  background-color: #000;
  color: #fff;
  box-sizing: border-box;
  display: inline-block;
  font-weight: bold;
  border-radius: 16px;
}
a.line-btn.solid:hover {
  background-color: #444;
}
a.line-btn.solid:active {
  background-color: #222;
}
a.line-btn.solid.selected {
  background-color: rgba(0,0,0,0.06);
  border-color: transparent;
  color: #000;
}
a.line-btn.solid.selected:hover {
  background-color: rgba(0,0,0,0.1);
}
a.line-btn.solid.selected:active {
  background-color: rgba(0,0,0,0.12);
}
a.btn.btn-block {
  display: block;
  height: 36px;
  line-height: 36px;
  font-size: 20px;
}
a.thick {
  line-height: 20px;
  padding: 10px 15px;
  display: block;
}
input[type=submit].disabled {
  background-color: #f4f4f4;
  cursor: default;
  color: #aaa;
}
.popup-menu {
  position: absolute;
  left: 50%;
  margin-left: -60px;
  z-index: 13;
  min-width: 160px;
}
.popup-menu .arrow-wrap {
  position: absolute;
  border-bottom: 7px solid #ccc;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  top: 0;
  left: 50%;
  margin-left: -6px;
  display: none;
}
.popup-menu .arrow-wrap .arrow {
  border-bottom: 6px solid #fff;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  top: 2px;
  left: -5px;
  position: absolute;
}
.popup-menu ul {
  list-style-type: none;
  overflow: hidden;
  padding: 8px 0;
  background-color: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .2), 0 0 0 1px rgba(0, 0, 0, .2);
}
.popup-menu a {
  display: block;
  color: #000;
  background-color: #fff;
  line-height: 34px;
  padding: 0 16px;
  font-size: 14px;
}
.popup-menu a:hover {
  background-color: #f4f4f4;
  color: #000;
}
.popup-menu a.selected {
  color: #000;
}
.popup-menu.funny {
  margin-left: -190px;
  top: 35px;
}
.popup-menu.funny .arrow-wrap {
  margin-left: -45px;
}
.popup-menu.user {
  margin-left: auto;
  left: auto;
  right: 10px;
  top: 48px;
  z-index: 13;
  min-width: 10px;
  width: 160px;
}
.popup-menu.user .arrow-wrap {
  margin-left: 30px;
}
.popup-menu.download {
  right: 0;
  left: auto;
  top: 35px;
  width: 200px;
  margin-left: auto;
}
.popup-menu.upload {
  right: 10px;
  left: auto;
  top: 48px;
  width: 160px;
}
.popup-menu.more-share {
  left: 288px;
  top: 24px;
}
.popup-menu.listview-share {
  left: 222px;
  top: 24px;
}
.popup-menu.postpage-share {
  left: 400px;
  top: 34px;
}
.popup-menu.section-list {
  left: 331px;
}
.popup-menu.search {
  top: 48px;
  right: 10px;
  left: auto;
  margin-left: 0;
  z-index: 13;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
}
.popup-menu.profile-more {
  left: auto;
  right: 0;
  top: 0;
}
.headbar-search {
  border: 1px solid #ccc;
  background-color: #fff;
  padding: 8px 12px;
  width: 200px;
}
.headbar-search input[type=text] {
  margin: 0;
  width: 100%;
  border: 0;
  border-radius: 0;
  height: auto;
  line-height: normal;
  padding: 0;
}
.headbar-search-suggest ul {
  border-top: 0;
}
.headbar-search-suggest ul a {
  padding: 0 12px;
  display: flex;
}
.headbar-search-suggest ul a strong {
  color: #000;
}
.headbar-search-suggest ul span.suggested {
  flex: 1;
  white-space: nowrap;
}
.headbar-search-suggest ul span.count {
  margin-left: 10px;
  text-align: right;
}
.toast {
  position: absolute;
  width: 100%;
  top: 100px;
  left: 0;
  z-index: 13;
  color: #000;
  text-align: center;
  height: 0;
}
.toast p {
  display: inline-block;
  background-color: #ffe168;
  padding: 5px 10px;
  line-height: 20px;
  border-radius: 2px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
  position: relative;
}
.toast p.close {
  padding-right: 35px;
}
.toast.toast-color-green p {
  background-color: #690;
}
.toast.toast-color-yellow p {
  background-color: #ffe168;
}
.toast.toast-color-red p {
  background-color: #c00;
}
.toast a.btn-close {
  color: #000;
  position: absolute;
  top: 5px;
  right: 10px;
}
section.announcement-banner {
  background-color: #222;
  height: 40px;
  box-shadow: 0 -1px 0 rgba(0, 0, 0, .1) inset;
  color: #fff;
  overflow: hidden;
  width: 100%;
  text-align: center;
  min-width: 940px;
  position: relative;
}
section.announcement-banner.yellow {
  background-color: #ffe168;
  color: #000;
}
section.announcement-banner.blue {
  background-color: #c6ebff;
  color: #000;
}
section.announcement-banner p {
  line-height: 40px;
  height: 40px;
}
section.announcement-banner p a {
  font-weight: bold;
}
section.announcement-banner a.btn-close {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 40px;
  height: 40px;
  background: url(../img/icon-close.png) center no-repeat;
  background-size: 30%;
  text-indent: -999px;
  overflow: hidden;
}
#top-nav {
  background-color: #000;
  width: 100%;
  z-index: 13;
  position: fixed;
}
.nav-wrap {
  max-width: 1196px;
  padding: 0 16px;
  margin: 0 auto;
  position: relative;
}
.nav-wrap:before,
.nav-wrap:after {
  content: " ";
  display: table;
}
.nav-wrap:after {
  clear: both;
}
#top-nav a {
  text-decoration: none;
}
#top-nav a.logo {
  display: block;
  width: 72px;
  height: 48px;
  background: url(../img/sprite-logo.png) center center no-repeat;
  background-size: 72px 48px;
  text-indent: -9999px;
  overflow: hidden;
  float: left;
  margin-left: -12px;
}
#top-nav a.logo:hover {
  opacity: 0.8;
}
#top-nav a.logo:active {
  opacity: 0.6;
}
header#top-nav .funoff {
  background: url(../img/funoff-animated.gif) 0 0 no-repeat;
  width: 120px;
  height: 48px;
  overflow: hidden;
  text-indent: -999px;
}
.nav-menu {
  margin-right: 256px;
}
.nav-menu ul {
  list-style-type: none;
  overflow: hidden;
  height: 48px;
}
.nav-menu ul:after, .nav-menu ul:before {
  content: ' ';
  display: table;
}
.nav-menu ul:after {
  clear: both;
}
.nav-menu .secondary li {
  display: block;
  float: left;
}
.nav-menu .secondary a {
  display: block;
  color: rgba(255,255,255,0.6);
  position: relative;
  line-height: 48px;
  font-size: 14px;
  padding: 0 12px;
  text-align: center;
  box-sizing: border-box;
}
.nav-menu .secondary a:hover {
  color: #fff;
}
.nav-menu .secondary a:active {
  color: rgba(255,255,255,0.8);
}
.nav-menu .new:after {
  content: ' ';
  display: block;
  position: absolute;
  top: 12px;
  right: 6px;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background-color: #4CD964;
}
.function-wrap {
  position: absolute;
  right: 16px;
  top: 0;
}
.user-function, .visitor-function {
  float: left;
  padding: 9px 0 9px 10px;
}
.user-function .upload, .visitor-function .upload {
  float: right;
}
.user-function .btn-primary, .visitor-function .btn-primary {
  color: #fff;
  display: inline-block;
  line-height: 30px;
  height: 30px;
  padding: 0 16px;
  border-radius: 2px;
  font-size: 14px;
  font-weight: bold;
  margin-left: 10px;
  background-color: #09f;
}
.user-function .btn-primary:hover, .visitor-function .btn-primary:hover {
  background-color: #33adff;
}
.user-function .btn-primary:active, .visitor-function .btn-primary:active {
  background-color: #007acc;
}
.upload .btn-primary {
  padding-left: 34px;
  position: relative;
}
.upload .btn-primary:after {
  content: ' ';
  display: block;
  width: 30px;
  height: 30px;
  background: url('../img/sprite.png') -330px -30px no-repeat;
  background-size: 510px 120px;
  top: 0;
  left: 0;
  position: absolute;
}
.user-function .btn-mute, .visitor-function .btn-mute {
  display: inline-block;
  color: #bbb;
  line-height: 30px;
  height: 30px;
  padding: 0 12px;
}
.user-function .notification {
  float: left;
  margin-right: 10px;
}
.notification .bell {
  display: block;
  width: 30px;
  height: 30px;
  position: relative;
  background: url(../img/sprite.png) -30px 0 no-repeat;
  background-size: 510px 120px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  line-height: 29px;
}
.notification .bell:hover {
  background: url(../img/sprite.png) -30px -30px no-repeat;
  background-size: 510px 120px;
}
.notification .bell.new {
  background-color: #F25;
  background-image: none;
  border-radius: 15px;
}
.user-function a.btn, .visitor-function a.btn {
  display: block;
  padding: 4px 10px;
  font-size: 12px;
  line-height: 20px;
  margin-left: 15px;
}
.user-function .avatar {
  float: left;
  position: relative;
}
.user-function .avatar-container {
  display: block;
  height: 30px;
  width: 30px;
  background-color: rgba(255, 255, 255, .2);
  border-radius: 50%;
  overflow: hidden;
  position: relative;
}
.user-function .avatar-container img {
  width: 30px;
  height: 30px;
  display: block;
  border: 0;
}
.visitor-function {
  float: right;
}
.visitor-function a.btn {
  float: left;
}
.visitor-function a.btn.blue {
  background-color: #09f;
  border-color: #09f;
  color: #fff;
}
.visitor-function a.link {
  display: block;
  padding: 0 10px;
  line-height: 47px;
  float: left;
  font-size: 14px;
  color: #999;
}
.visitor-function a.link:hover {
  color: #000;
}
.general-function {
  float: left;
  padding: 9px 0;
}
.general-function .search {
  display: block;
  width: 30px;
  height: 30px;
  text-indent: -999px;
  overflow: hidden;
  background: url(../img/sprite.png) 0 0 no-repeat;
  background-size: 510px 120px;
}
.general-function .search.selected, .general-function .search:hover {
  background: url(../img/sprite.png) 0 -30px no-repeat;
  background-size: 510px 120px;
}
a.btn-link {
  color: #999;
  line-height: 30px;
  display: block;
  margin: 9px 0;
}
a.btn-link:hover {
  color: #2D72D9;
}
a.btn-grey {
  background-color: #f4f4f4;
  color: #999;
}
.notification-menu {
  position: absolute;
  top: 48px;
  right: 10px;
  background-color: #fff;
  width: 320px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
  border: 1px solid #ccc;
  z-index: 12;
}
.notification-menu .title {
  height: 30px;
  border-bottom: 1px solid #ddd;
}
.notification-menu .title h3 {
  font-size: 12px;
  color: #000;
  margin: 0 10px;
  line-height: 30px;
}
.notification-menu .bumper {
  width: 320px;
  height: 30px;
  background-color: #fff;
  border-radius: 0 0 3px 3px;
  box-shadow: 0 -2px 2px rgba(0, 0, 0, .03);
  border-top: 1px solid #ddd;
}
.notification-menu .bumper a.see-all {
  display: block;
  height: 30px;
  line-height: 30px;
  text-align: center;
  color: #999;
  font-size: 12px;
}
.notification-menu li.empty {
  position: relative;
  height: 400px;
  padding: 0;
  cursor: default;
}
.notification-menu li.empty:hover {
  background-color: #fff;
}
.notification-menu .empty-message {
  position: relative;
  top: 50%;
  left: 50%;
  height: 20px;
  line-height: 20px;
  width: 300px;
  text-align: center;
  margin-left: -150px;
  margin-top: -10px;
  color: #999;
  font-weight: bold;
  font-size: 15px;
}
.notification-menu .empty-container {
  height: 400px;
  overflow: hidden;
}
.notification-menu .empty-container p {
  color: #999;
  font-weight: bold;
  text-align: center;
  margin-top: 208px;
  font-size: 15px;
}
.notification-menu .empty-container .btn-container {
  margin: 20px 20px 0;
  padding: 0;
}
.notification-menu .empty-container a.btn {
  margin: 0;
  padding: 9px 20px;
  font-size: 14px;
}
.notification-menu .bumper a.see-all:hover {
  color: #000;
}
.notification-list {
  height: 400px;
}
.notification-list ul {
  list-style-type: none;
  padding-bottom: 20px;
}
.notification-list li a.item {
  display: block;
  overflow: hidden;
  position: relative;
  color: #000;
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
  background-color: #fff;
}
.notification-list li a.item.new {
  background-color: #f4f4f4;
  border-bottom-color: #eee;
}
.notification-list a.item:hover {
  background-color: #eee;
}
.notification-list a.item:active {
  background-color: #eaeaea;
}
.notification-list li a.item.new:hover {
  background-color: #eee;
}
.notification-list li a.item.new:active {
  background-color: #eaeaea;
}
.notification-list li:last-child a.item {
  border-bottom: 0;
}
.notification-list .avatar-container {
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: #f4f4f4;
  overflow: hidden;
  width: 40px;
  height: 40px;
  padding: 0;
}
.notification-list .avatar-container a,
.notification-list .avatar-container img {
  display: block;
  width: 40px;
  height: 40px;
  border: 0;
}
.notification-list .content {
  margin: 10px 10px 0 60px;
}
.notification-list li.with-thumb .content {
  min-height: 40px;
  margin-right: 60px;
}
.notification-list p.message {
  line-height: 1.3em;
}
.notification-list p.message a, .notification-list p.message span.actor {
  font-weight: bold;
}
.notification-list p.timestamp {
  font-size: 11px;
  color: #999;
  line-height: 16px;
  margin-top: 5px;
  vertical-align: top;
}
.notification-list p.timestamp span.icon {
  width: 16px;
  height: 16px;
  display: none;
  overflow: hidden;
  text-indent: -999px;
  border-radius: 2px;
  margin-right: 3px;
}
.notification-list p.timestamp span.icon.upvote {
  background: #00a356
    url(../img/notification-action-icon-sprite.png)
    0
    no-repeat;
}
.notification-list p.timestamp span.icon.friend {
  background: #feca12
    url(../img/notification-action-icon-sprite.png) -16px
    0
    no-repeat;
}
.notification-list p.timestamp span.icon.comment {
  background: #13aaff
    url(../img/notification-action-icon-sprite.png) -32px
    0
    no-repeat;
}
.notification-list .post-container {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  overflow: hidden;
}
.notification-list .post-container a {
  display: block;
  width: 50px;
  height: 50px;
  border: 0;
  overflow: hidden;
}
.notification-list .post-container img {
  height: 40px;
  width: 40px;
  border: 0;
}
.notification-detail .section-title {
  margin-bottom: 20px;
}
.notification-detail .section-title h3 {
  font-size: 22px;
}
.notification-text-list {
  position: relative;
}
.notification-text-list ul {
  list-style-type: none;
}
.notification-text-list li {
  position: relative;
  overflow: hidden;
}
.notification-text-list .label {
  border-bottom: 1px solid #ddd;
  margin-top: 20px;
}
.notification-text-list li.message {
  border-bottom: 1px solid #eee;
}
.notification-text-list li:last-child {
  border-bottom: 0;
}
.notification-text-list .label:first-child {
  margin-top: 0;
}
.notification-text-list .label h3 {
  font-size: 15px;
  padding: 10px 0;
}
.notification-text-list p {
  padding: 10px 0 10px 24px;
  line-height: 1.3em;
}
.notification-text-list a {
  color: #000;
  font-weight: bold;
}
.notification-text-list a:hover {
  text-decoration: underline;
}
.notification-text-list span.time {
  display: inline-block;
  color: #999;
  font-size: 11px;
}
.notification-text-list span.icon {
  display: block;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 2px;
  top: 11px;
  text-indent: -999px;
  overflow: hidden;
  border-radius: 2px;
}
.notification-text-list span.icon.upvote {
  background: #00a356 url(../img/notification-action-icon-sprite.png) no-repeat;
}
.notification-text-list span.icon.comment {
  background: #13aaff
    url(../img/notification-action-icon-sprite.png) -32px
    0
    no-repeat;
}
.notification-text-list span.icon.friend {
  background: #feca12
    url(../img/notification-action-icon-sprite.png) -16px
    0
    no-repeat;
}
.notification-text-list .empty-message {
  height: 20px;
  line-height: 20px;
  width: 300px;
  color: #999;
  font-weight: bold;
  font-size: 15px;
}
.notification-text-list .empty-message p {
  padding: 0;
}
.notification-menu .viewport {
  width: 320px;
  height: 400px;
  overflow: hidden;
  position: relative;
}
.notification-menu .overview {
  list-style: none;
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  margin: 0;
  width: 320px;
}
.notification-menu .scrollbar {
  float: right;
  width: 6px;
  position: absolute;
  right: 2px;
  z-index: 11;
  cursor: pointer;
}
.notification-menu .track {
  height: 100%;
  width: 6px;
  position: relative;
}
.notification-menu .thumb {
  background: rgba(0, 0, 0, .4);
  height: 20px;
  width: 6px;
  overflow: hidden;
  position: absolute;
  top: 0;
  border-radius: 4px;
  opacity: 0;
  -webkit-transition: opacity .5s .8s ease;
}
.notification-menu:hover .thumb {
  opacity: 1;
  -webkit-transition: opacity .1s 0 ease;
}
.notification-menu .disable {
  display: none;
}
.topBannerAd-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-bottom: 24px;
}
.topBannerAd img {
  display: block;
}
.topBannerAd-close {
  display: block;
  width: 36px;
  height: 36px;
  position: absolute;
  top: 16px;
  right: 16px;
  background: url(../img/icon-close-white.png) center center no-repeat rgba(0,0,0,0.4);
  border-radius: 20px;
  text-indent: -999px;
  overflow: hidden;
}
.profile-header {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}
.profile-header .img-container {
  width: 80px;
  height: 80px;
  background-color: rgba(0,0,0,0.1);
  overflow: hidden;
  border-radius: 2px;
  margin-right: 16px;
  flex-shrink: 0;
}
.profile-header .img-container.round {
  border-radius: 50%;
}
.profile-header .img-container img {
  display: block;
  width: 100%;
}
.profile-header header h1 {
  font-size: 32px;
  line-height:40px;
}
.profile-header header h2 {
  font-size: 24px;
  line-height: 28px;
}
.profile-header header .badge.pro {
  display: inline-block;
  background-color: #FF9500;
  color: #fff;
  padding: 0.2em 0.6em;
  border-radius: 1em;
  font-size: 14px;
  line-height: 1;
  text-transform: uppercase;
  vertical-align: middle;
  margin-top: -2px;
  margin-left: 8px;
}
.profile-header header p {
  color: #999;
}
.profile-header .btn-container {
  margin: 0;
  padding: 0;
  margin-left: auto;
  flex-shrink: 0;
}
.profile-header .btn-container .line-btn {
  margin-right: 4px;
}
.profile-header .btn-container .line-btn:last-child {
  margin-right: 0;
}
.profile .tab-bar {
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  position: relative;
  width: 100%;
  margin-bottom: 12px;
  display: flex;
}
.profile .tab-bar:before,
.profile .tab-bar:after {
  display: table;
  content: ' ' ;
}
.profile .tab-bar:after {
  clear: both;
}
.profile .tab-bar > ul.menu {
  list-style-type: none;
  display: flex;
}
.profile .tab-bar ul.menu a {
  color: #999;
  font-weight: bold;
  display: block;
  box-sizing: border-box;
  line-height: 20px;
  height: 40px;
  padding: 10px 16px;
}
.profile .tab-bar ul.menu a:hover {
  color: #000;
}
.profile .tab-bar ul.menu a.selected {
  color: #000;
  font-weight: bold;
  border-bottom: 2px solid #000;
}
.profile .tab-bar .option {
  margin-left: auto;
}
.profile .tab-bar a.more {
  display: block;
  float: right;
  width: 40px;
  height: 40px;
  position: relative;
  text-indent: -999px;
  overflow: hidden;
}
.profile .tab-bar a.more:after {
  position: absolute;
  content: ' ';
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -300px -0px no-repeat;
  background-size: 510px 120px;
  left: 50%;
  top: 50%;
  margin-top: -15px;
  margin-left: -15px;
}
.profile .tab-bar .option:hover a.more:after {
  position: absolute;
  content: ' ';
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -300px -60px no-repeat;
  background-size: 510px 120px;
  left: 50%;
  top: 50%;
  margin-top: -15px;
  margin-left: -15px;
}
#sidebar {
  float: right;
  padding: 0 0 0 32px;
  width: 300px;
  position: relative;
}
#sidebar-content {
  padding-bottom: 24px;
}
.block-ad {
  margin: 0 0 20px;
  width: 300px;
}
.block-ad .img-container {
  width: 300px;
  height: 250px;
  overflow: hidden;
  background-color: #f4f4f4;
}
.block-feature-cover .block-ad .img-container {
  height: 250px;
}
.block-ad img {
  border: 0;
  display: block;
}
.block-ad .subtext {
  text-align: right;
  font-size: 11px;
  text-transform: uppercase;
  margin-top: 5px;
}
.block-ad .subtext a {
  color: #999;
}
.block-ad.height-250 {
  height: 250px;
}
.block-ad.height-600 {
  height: 600px;
}
h2.sidebar-title {
  font-size: 12px;
  line-height: 16px;
  margin-bottom: 8px;
  text-transform: uppercase;
  color: #999;
  font-weight: bold;
}
.get-the-app {
  margin-bottom: 24px;
}
.get-the-app ul {
  list-style-type: none;
  overflow: hidden;
}
.get-the-app li {
  float: left;
  margin-right: 10px;
}
.get-the-app li:last-child {
  margin-right: 0;
}
.get-the-app a {
  display: block;
  width: 143px;
  height: 42px;
  overflow: hidden;
  text-indent: -999px;
  border-radius: 2px;
  border: 1px solid #000;
}
.get-the-app a.app-store {
  background: #000 url(../img/appstore-icon-alt-145.png) -1px -1px no-repeat;
}
.get-the-app a.google-play {
  background: #000 url(../img/appstore-icon-alt-145.png) -155px -1px no-repeat;
}
section.block-social-love {
  margin-bottom: 32px;
}
section.block-social-love .social-love:after,
section.block-social-love .social-love:before {
  display: table;
  content: ' ';
}
section.block-social-love .social-love:after {
  clear: both;
}
section.block-social-love .social-love {
  list-style-type: none;
}
section.block-social-love .social-love li {
  float: left;
  margin: 0 8px 8px 0;
}
section.block-social-love .social-love a.instagram-follow {
  height: 20px;
  line-height: 18px;
  font-size: 10px;
  padding: 0 0 0 23px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  background: url(../img/instagram-follow.png) no-repeat -1px -1px;
  color: #555;
  font-weight: bold;
  display: block;
  margin-top: -1px;
  border-radius: 2px;
  width: 132px;
}
section.block-feature-cover {
  margin-top: 20px;
}
section.block-feature-cover ul {
  list-style-type: none;
}
section.block-feature-cover li {
  margin-bottom: 8px;
}
section.block-feature-cover .img-container {
  display: block;
  overflow: hidden;
  width: 300px;
  height: 105px;
  margin-bottom: 4px;
  background-color: #f4f4f4;
  border-radius: 2px;
  position: relative;
}
section.block-feature-cover .img-container a {
  display: block;
}
section.block-feature-cover .img-container img {
  display: block;
  border: 0;
  width: 100%;
  margin-top: -26px;
}
section.block-feature-cover .info-container h3 {
  font-size: 14px;
  line-height: 20px;
  font-weight: normal;
  word-wrap: break-word;
}
section.block-feature-cover a {
  display: block;
  color: #000;
}
section.block-feature-cover li a:hover {
  color: #09f;
}
.post-read-more {
  display: block;
  font-weight: bold;
  bottom: 0;
  width: 500px;
  height: 44px;
  text-align: left;
  padding: 0 20px 0 16px;
  line-height: 44px;
  font-size: 14px;
  background-color: #09f;
  color: #fff;
  border-top: none;
  box-sizing: border-box;
  position: absolute;
}
.post-read-more:after {
  content: ' ';
  position: absolute;
  width: 30px;
  height: 30px;
  top: 7px;
  right: 7px;
  background: url('../img/sprite.png') -210px -30px no-repeat;
  background-size: 510px 120px;
}
section .post-footer {
  position: relative;
  padding: 10px 30px;
}
section .post-footer p {
  line-height: 20px;
}
.video-post,
.youtube-post {
  overflow: hidden;
  position: relative;
}
.video-post {
  cursor: pointer;
}

.youtube-post .youtube-thumb {
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  background-position-y: 50%;
  background-size: cover;
}
.video-post iframe,
.youtube-post iframe {
  display: block;
}
.video-post span.play,
.youtube-post span.play {
  position: absolute;
  top: 50%;
  margin-top: -36px;
  left: 50%;
  margin-left: -36px;
  height: 72px;
  width: 72px;
  text-indent: -999px;
  overflow: hidden;
  border-radius: 35px;
  background-color: rgba(0, 0, 0, 0.8);
}
.video-post span.play:after, .youtube-post span.play:after {
  content: '';
  width: 60px;
  height: 60px;
  background: url(../img/icon-video-play-3.png) center center no-repeat;
  background-size: 60px 60px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -30px;
  margin-top: -30px;
}
.video-post p.length, .youtube-post p.length {
  text-align: right;
  position: absolute;
  bottom: 16px;
  right: 16px;
  height: 24px;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.8);
  border-radius: 12px;
  padding: 0 8px;
  line-height: 24px;
}
.video-post .sound-toggle, .youtube-post .sound-toggle {
  width: 36px;
  height: 36px;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.8);
  bottom: 16px;
  left: 16px;
  border-radius: 50%;
  cursor: pointer;
}
.sound-toggle::after {
  content: ' ';
  display: block;
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -240px -30px no-repeat;
  background-size: 510px 120px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -15px;
  margin-top: -15px;
}
.sound-toggle.on::after {
  content: ' ';
  display: block;
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -270px -30px no-repeat;
  background-size: 510px 120px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -15px;
  margin-top: -15px;
}
.gif-post {
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

@keyframes spinner {
  to {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes spinner {
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-moz-keyframes spinner {
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-o-keyframes spinner {
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-ms-keyframes spinner {
  to {
    -webkit-transform: rotate(360deg);
  }
}
.simple-spinner {
  min-width: 24px;
  min-height: 24px;
}
.simple-spinner:before {
  content: 'Loading\2026';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  margin-top: -10px;
  margin-left: -10px;
}
.simple-spinner:not(:required):before {
  content: '';
  border-radius: 50%;
  border-top: 2px solid #999;
  border-right: 2px solid transparent;
  animation: spinner .6s linear infinite;
  -webkit-animation: spinner .6s linear infinite;
}
.gif-post img.gif-post-thumb {
  margin: -49px 0;
}
.gif-post span.play {
  position: absolute;
  top: 50%;
  margin-top: -36px;
  left: 50%;
  margin-left: -36px;
  height: 72px;
  width: 72px;
  text-align: center;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.8);
  line-height: 72px;
  font-size: 20px;
  text-transform: uppercase;
  color: #fff;
  font-weight: bold;
  border-radius: 50%;
}
.loading span.play {
  /*background-image: url(../img/load-stripe-1.gif);*/
  width: 100%;
  height: 5px;
  border: 0;
  border-radius: 0;
  top: 0;
  left: 0;
  margin: 0;
  text-indent: -999px;
  opacity: 1;
  z-index: 12;
}
.nsfw-post {
  background: #000
    url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAFklEQVQIW2NgQAJKSkr/kfnUECQLAAA/pgWVNrZk1QAAAABJRU5ErkJggg==')
    repeat;
  border-radius: 2px;
  text-align: center;
  height: 306px;
  overflow: hidden;
}
.nsfw-post h3 {
  font-size: 36px;
  color: #fff;
  margin-top: 120px;
  margin-bottom: 10px;
}
.nsfw-post p {
  color: #999;
  font-size: 18px;
  margin: 0 20px 10px;
}
.ad-post {
  overflow: hidden;
  position: relative;
  text-align: center;
}
form#listview-search {
  margin-bottom: 12px;
  position: relative;
}
form#listview-search .field {
  margin: 0;
}
form#listview-search label {
  position: absolute;
  font-size: 12px;
  text-transform: uppercase;
  line-height: 20px;
  font-weight: bold;
  color: #aaa;
  display: block;
  left: 18px;
  top: 50%;
  margin-top: -8px;
}
form#listview-search input#search-hero {
  line-height: 20px;
  height: 44px;
  padding: 12px 12px 12px 50px;
  width: 100%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  font-size: 15px;
  margin: 0;
  border-radius: 0;
  background: url(../img/post-function.png) 0 -520px no-repeat;
}
p.search-result {
  line-height: 20px;
  border-bottom: 1px solid #ddd;
  color: #999;
  font-size: 12px;
}
.featured-tag {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.featured-tag a {
  display: block;
  height: 32px;
  line-height: 32px;
  margin-right: 8px;
  margin-bottom: 8px;
  background-color: rgba(0,0,0,0.06);
  color: #000;
  text-decoration: none;
  padding: 0 8px;
  border-radius: 2px;
  text-align: center;
}
.featured-tag a:hover {
  background-color: rgba(0,0,0,0.10);
}
.featured-tag a:active {
  background-color: rgba(0,0,0,0.12);
}
section#list-view-2 .post-text-container {
  margin: 8px 0 0;
}
section#list-view-2 .list-stream {
  margin-bottom: 24px;
}
section#list-view-2 article {
  margin-bottom: 24px;
  border-top: 1px solid rgba(0,0,0,0.1);
  padding: 20px 0 0;
  box-sizing: border-box;
}
section#list-view-2 article .article-more {
  color: #09f;
  text-decoration: none;
}
section#list-view-2 .list-stream:first-child article:first-child {
  border: 0;
  padding: 0;
}
section#list-view-2 header {
  margin-bottom: 8px;
  position: relative;
}
section#list-view-2 header a {
  cursor: pointer;
  color: #000;
}
section#list-view-2 header a:hover h1 {
  color: #09f;
}
section#list-view-2 .activity-text {
  font-size: 14px;
  color: #000;
  margin-bottom: 5px;
}
section#list-view-2 .activity-text a {
  color: #000;
}
section#list-view-2 .activity-text a.username {
  font-weight: bold;
}
section#list-view-2 .activity-text a:hover {
  text-decoration: underline;
}
section#list-view-2 h1 {
  word-wrap: break-word;
}
section#list-view-2 h1 {
  font-size: 20px;
  color: #000;
}
.post-text-container {
  font-size: 16px;
  margin: 16px 0;
  line-height: 24px;
}
article.post-page .post-text-container {
  width: 600px;
  margin: 16px auto;
}
article.post-page .post-container .post-text-container a {
  display: inline;
  cursor: pointer;
}
.post-text-container a:hover {
  text-decoration: underline;
}
.post-text-container blockquote,
.post-text-container h2,
.post-text-container h3,
.post-text-container h4,
.post-text-container ol,
.post-text-container ul,
.post-text-container p {
  margin-bottom: 16px;
}
.post-text-container h3 {
  font-size: 20px;
  line-height: 24px;
}
.post-text-container ol,
.post-text-container ul {
  padding-left: 24px;
}
.post-text-container blockquote {
  border-left: 4px solid #000;
  padding-left: 20px;
}
.post-text-container hr {
  height: 1px;
  border: 0;
  background-color: #ddd;
}
.post-text-container figure {
  margin: 0 0 16px;
  width: 100%;
}
.post-text-container figure figcaption {
  color: #999;
  font-size: 12px;
  line-height: 16px;
  margin-top: 4px;
  text-align: center;
}
.post-text-container figure .media {
  position: relative;
}
.post-text-container figure .media .length {
  margin: 0;
}
.post-text-container figure figcaption a {
  color: inherit;
}
.post-text-container figure figcaption a:hover {
  text-decoration: underline;
  color: #000;
}
.post-text-container figure img,
.post-text-container figure video {
  display: block;
  max-width: 600px;
}
.post-text-container figure video {
  max-height: 728px;
}
section#list-view-2 .post-tag {
  width: 500px;
  line-height: 24px;
  margin-bottom: 4px;
}
section#list-view-2 .post-tag a {
  color: #09f;
  font-weight: bold;
  margin: 0 4px 0 0;
}
section#list-view-2 .post-tag a:hover {
  color: #33adff;
}
section#list-view-2 p.post-meta {
  color: #999;
  margin: 0 0 12px;
}
section#list-view-2 p.post-meta a {
  color: #999;
}
section#list-view-2 p.post-meta a:hover {
  color: #666;
}
section#list-view-2 .post-container {
  width: 500px;
  position: relative;
  margin-bottom: 8px;
}
section#list-view-2 .post-container a {
  display: block;
}
section#list-view-2 .post-container .long-post-container {
  max-height: 500px;
  overflow: hidden;
}
section#list-view-2 .post-container.with-button {
  padding-bottom: 44px;
}
section#list-view-2 .post-container a img {
  display: block;
  width: 500px;
  border: 0;
}
.sticky-action {
  position: absolute;
  right: -64px;
  width: 44px;
  top: 0;
}
.btn-vote {
  overflow: hidden;
}
.btn-vote li {
  margin: 0 8px 0 0;
  float: left;
  list-style: none;
}
.btn-vote a {
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: 2px;
  width: 44px;
  height: 34px;
  display: block;
  text-indent: -999px;
  position: relative;
}
.btn-vote .up:after {
  position: absolute;
  content: ' ';
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -120px 0 no-repeat;
  background-size: 510px 120px;
  left: 50%;
  top: 50%;
  margin-top: -15px;
  margin-left: -15px;
}
.btn-vote .down:after {
  position: absolute;
  content: ' ';
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -150px 0 no-repeat;
  background-size: 510px 120px;
  left: 50%;
  top: 50%;
  margin-top: -15px;
  margin-left: -15px;
}
.btn-vote .comment:after {
  position: absolute;
  content: ' ';
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -180px 0 no-repeat;
  background-size: 510px 120px;
  left: 50%;
  top: 50%;
  margin-top: -15px;
  margin-left: -15px;
}
.btn-vote .more:after {
  position: absolute;
  content: ' ';
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -300px 0px no-repeat;
  background-size: 510px 120px;
  left: 50%;
  top: 50%;
  margin-top: -15px;
  margin-left: -15px;
}
.btn-vote .more:hover {
  border: 1px solid #999;
}
.btn-vote .more:active {
  background-color: #f4f4f4;
}
.btn-vote .up.active:after {
  position: absolute;
  content: ' ';
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -120px -90px no-repeat;
  background-size: 510px 120px;
  left: 50%;
  top: 50%;
  margin-top: -15px;
  margin-left: -15px;
}
.btn-vote .down.active:after {
  position: absolute;
  content: ' ';
  width: 30px;
  height: 30px;
  background: url(../img/sprite.png) -150px -90px no-repeat;
  background-size: 510px 120px;
  left: 50%;
  top: 50%;
  margin-top: -15px;
  margin-left: -15px;
}
.btn-vote a:hover {
  border-color: #999;
}
.btn-vote a:active {
  background-color: rgba(0, 0, 0, 0.04);
}
.fixed-wrap-post-bar {
  height: 54px;
  z-index: 12;
}
.post-afterbar-a {
  position: relative;
}
.post-afterbar-a.in-list-view {
  width: 500px;
}
.post-afterbar-a.in-post-top {
  padding: 10px 0;
  height: 34px;
  margin: 0;
  border: 0;
  background-color: #fff;
  width: 640px;
}
.post-afterbar-a .share {
  float: left;
}
.post-afterbar-a .share ul {
  overflow: hidden;
  list-style-type: none;
}
.post-afterbar-a .share li {
  float: left;
  margin-right: 8px;
}
.post-afterbar-a .share.right li {
  margin: 0 0 0 8px;
}
.post-afterbar-a .btn-share {
  display: block;
  color: #fff;
  font-weight: bold;
  height: 34px;
  background-color: #f4f4f4;
  line-height: 34px;
  padding: 0 15px 0 34px;
  border-radius: 2px;
  text-align: center;
  position: relative;
}
.post-afterbar-a .btn-share.facebook {
  background-color: #3b5998;
}
.post-afterbar-a .btn-share.twitter {
  background: #00aced;
}
.post-afterbar-a .btn-share.pinterest {
  background: #bd081c;
}
.post-afterbar-a .btn-share.facebook:after {
  content: ' ';
  width: 32px;
  height: 32px;
  position: absolute;
  top: 50%;
  margin-top: -16px;
  left: 2px;
  background: url(../img/sprite.png) -90px -30px no-repeat;
  background-size: 510px 120px;
}
.post-afterbar-a .btn-share.twitter:after {
  content: ' ';
  width: 32px;
  height: 32px;
  position: absolute;
  top: 50%;
  margin-top: -15px;
  left: 2px;
  background: url(../img/sprite.png) -360px -30px no-repeat;
  background-size: 510px 120px;
}
.post-afterbar-a .btn-share.pinterest {
  background: #bd081c;
}
.post-afterbar-a .btn-share.pinterest:after {
  content: ' ';
  width: 32px;
  height: 32px;
  position: absolute;
  top: 50%;
  margin-top: -15px;
  left: 2px;
  background: url(../img/sprite.png) -390px -30px no-repeat;
  background-size: 510px 120px;
}
.post-afterbar-a .btn-share.facebook:hover,
.post-afterbar-a.in-post-bot .btn-share.facebook:hover {
  background-color: #4c70ba;
}
.post-afterbar-a .btn-share.facebook:active,
.post-afterbar-a.in-post-bot .btn-share.facebook:active {
  background-color: #36528c;
}
.post-afterbar-a .btn-share.twitter:hover,
.post-afterbar-a.in-post-bot .btn-share.twitter:hover {
  background-color: #21c2ff;
}
.post-afterbar-a .btn-share.twitter:active,
.post-afterbar-a.in-post-bot .btn-share.twitter:active {
  background-color: #00a0dc;
}
.post-afterbar-a .btn-share.fb-messenger:hover,
.post-afterbar-a.in-post-bot .btn-share.fb-messenger:hover {
  background-color: #389bfc;
}
.post-afterbar-a .btn-share.fb-messenger:active,
.post-afterbar-a.in-post-bot .btn-share.fb-messenger:active {
  background-color: #0d71da;
}
.post-afterbar-a .btn-share.pinterest:hover,
.post-afterbar-a.in-post-bot .btn-share.pinterest:hover {
  background-color: #ee0a23;
}
.post-afterbar-a .btn-share.pinterest:active,
.post-afterbar-a.in-post-bot .btn-share.pinterest:active {
  background-color: #ad071a;
}
.post-afterbar-a.in-post-bot .share {
  float: none;
}
.post-afterbar-a.in-post-bot .btn-share {
  height: 44px;
  line-height: 43px;
  font-size: 15px;
  padding: 0 16px 0 40px;
}
.post-afterbar-a.in-post-bot .btn-share.facebook {
  background: #3B5998;
}
.post-afterbar-a.in-post-bot .btn-share.twitter {
  background: #00aced;
}
.post-afterbar-a.in-post-bot .btn-share.fb-messenger {
  background: #0083ff;
}
.post-afterbar-a.in-post-bot.full-width .share ul {
  text-align: left;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  margin: 0 -5px;
}
.post-afterbar-a.in-post-bot.full-width .share li {
  margin: 0 5px;
  -ms-flex: 1 1 auto;
  -webkit-flex: 1 1 auto;
  flex: 1 1 auto;
}
.post-afterbar-a.in-post-bot.full-width .btn-share {
}
.post-afterbar-a .post-nav {
  float: right;
}
.post-afterbar-a .post-nav a.next {
  display: block;
  padding-right: 12px;
  position: relative;
}
.post-afterbar-a .post-nav a.next span.label {
  padding: 0 8px 0 12px;
  font-weight: bold;
  height: 34px;
  line-height: 34px;
  display: block;
  background-color: #ff3c1f;
  color: #fff;
  border-radius: 3px 0 0 3px;
}
.post-afterbar-a .post-nav a.next span.arrow {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 0;
  height: 0;
  border-top: 17px dashed transparent;
  border-bottom: 17px dashed transparent;
  border-left: 12px solid #ff3c1f;
}
.post-afterbar-a .post-nav a.next:hover span.label {
  background-color: #ff6852;
}
.post-afterbar-a .post-nav a.next:hover span.arrow {
  border-left-color: #ff6852;
}
.post-afterbar-a .post-nav a.next:active span.label {
  background-color: #ff5a41;
}
.post-afterbar-a .post-nav a.next:active span.arrow {
  border-left-color: #ff5a41;
}
.post-afterbar-a .post-nav a.next.disabled {
  opacity: .2;
  cursor: default;
}
.post-afterbar-a .post-nav a.next.disabled:active span.label,
.post-afterbar-a .post-nav a.next.disabled:hover span.label {
  background-color: #ff3c1f;
}
.post-afterbar-a .post-nav a.next.disabled:active span.arrow,
.post-afterbar-a .post-nav a.next.disabled:hover span.arrow {
  border-left-color: #ff3c1f;
}
.post-afterbar-meta {
  color: #999;
  border-top: 1px solid #eee;
  padding: 5px 0;
}
.post-afterbar-meta p {
  line-height: 20px;
  font-size: 11px;
  text-transform: uppercase;
  text-align: right;
}
.post-afterbar-meta a {
  color: #999;
}
.post-afterbar-meta a:hover {
  text-decoration: underline;
  color: #000;
  cursor: pointer !important;
}
.loading {
  text-align: center;
  margin-bottom: 20px;
}
.loading a.btn {
  display: block;
  line-height: 65px;
  height: 62px;
  font-size: 18px;
  background-color: #fff;
  color: #000;
  box-shadow: none;
  padding: 0;
  margin: 0;
  border: 1px solid #ddd;
}
.loading a.btn:hover {
  border-color: #aaa;
}
.loading a.btn:active {
  background-color: #fafafa;
}
.loading a.btn.spin {
  text-indent: -999px;
  overflow: hidden;
  border-color: #fff;
  cursor: default;
  position: relative;
}
.loading a.btn.spin .spinner-here {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -18px;
}
.loading a.btn.end {
  background-color: #f4f4f4;
  color: #999;
  border-color: #d4d4d4;
  cursor: default;
}
.loading a.btn.blue {
  background-color: #09f;
  border-color: #09f;
  color: #fff;
}
.loading a.btn.blue:hover {
  background-color: #1a97ff;
  border-color: #1a97ff;
}
.loading a.btn.blue:active {
  background-color: #0062b3;
  border-color: #0062b3;
}
section#individual-post header {
  margin-bottom: 6px;
  position: relative;
}
section#individual-post header h1 {
  font-size: 24px;
  line-height: 28px;
  margin-bottom: 8px;
  word-wrap: break-word;
}
section#individual-post header .description {
  font-size: 16px;
  color: #000;
  line-height: 24px;
  margin-top: 4px;
  margin-bottom: 8px;
}
section#individual-post header ol.description,
section#individual-post header ul.description {
  padding-left: 24px;
}
section#individual-post header .description a:hover {
  text-decoration: underline;
}
section#individual-post header p.post-tag {
  line-height: 24px;
  margin-bottom: 4px;
}
section#individual-post header p.post-tag a {
  color: #09f;
  font-weight: bold;
  margin: 0 4px 0 0;
}
section#individual-post header p.post-tag a:hover {
  color: #33adff;
}
section#individual-post header p.post-meta,
section#individual-post header p.post-meta a {
  color: #999;
}
section#individual-post header p.post-meta a:hover {
  color: #666;
}
article.post-page .post-container {
  position: relative;
  margin: 0 auto;
}
article.post-page .post-container .image-post,
article.post-page .post-container .gif-post,
article.post-page .post-container .video-post,
article.post-page .post-container .nsfw-post {
  margin: 0 auto;
  width: 600px;
}
article.post-page .post-container figure .image-post,
article.post-page .post-container figure .gif-post,
article.post-page .post-container figure .video-post,
article.post-page .post-container figure .nsfw-post,
article.post-page .post-container figure .youtube-post {
  width: 100%;
}
article.post-page .post-container a {
  display: block;
  cursor: default;
}
article.post-page .post-container a.zoomable {
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
}
article.post-page .post-container img,
article.post-page .post-container video {
  display: block;
  margin: 0 auto;
  width: 600px;
}
article.post-page .post-container video {
  max-height: 728px;
  width: 600px;
}
article.post-page .post-container a img {
  border: 0;
}
article.post-page .post-container .post-read-more {
  width: 100%;
}
article.post-page .post-meta .fb-like {
  float: left;
  height: 20px;
  margin: 10px 0;
}
article.post-page .post-meta p.info {
  line-height: 20px;
  margin: 10px 0;
  color: #999;
  float: right;
  font-size: 11px;
}
article.post-page .post-meta p.right a {
  font-weight: bold;
}
article.post-page .post-meta p a:hover {
  text-decoration: underline;
}
article.post-page .post-footer {
  position: relative;
  padding: 5px 20px;
}
.spinner-here {
  height: 36px;
  width: 36px;
  background: url(../img/spinner-999.png) center no-repeat;
}
section.post-comment {
  padding-bottom: 30px;
  margin-top: 20px;
}
#comment, #comments {
  margin-top: -30px;
  height: 30px;
}
article.post-page .post-footer .more-share-menu {
  left: 20px;
}
.post-page .naughty-box {
  padding: 10px 0 0;
}
.post-page .naughty-box .img-container {
  background-color: #f4f4f4;
  width: 728px;
  height: 90px;
  overflow: hidden;
}

section.section-header .section-nav:after,
section.section-header .section-nav:before {
  content: ' ';
  display: table;
}
section.section-header .section-nav:after {
  clear: both;
}
section.section-header .section-nav {
  border-bottom: 0;
  background-color: transparent;
  height: 50px;
}
section.section-header .section-nav ul {
  height: 50px;
}
section.section-header .section-nav li {
  margin: 0;
}

section.notification-detail {
  width: 600px;
  margin-top: 20px;
}
section.notification-detail .notification-list {
  overflow: visible;
  max-height: none;
}
section.notification-detail .avatar-container {
  left: 0;
}
section.notification-detail .post-container {
  right: 0;
}
section.notification-detail .content {
  margin-left: 60px;
  margin-right: 60px;
}
.overlay-scroll-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 13;
  overflow: scroll;
  background-color: rgba(0, 0, 0, .8);
}
.overlay-scroll-container.opacity-50 {
  background-color: rgba(0, 0, 0, .5);
}
.overlay-scroll-container.opacity-60 {
  background-color: rgba(0, 0, 0, .6);
}
.overlay-scroll-container a.close-button {
  color: #fff;
  width: 50px;
  line-height: 40px;
  text-align: center;
  display: block;
  overflow: hidden;
  text-indent: -999px;
  background: url(../img/icon-close-white.png) center center no-repeat;
  opacity: .8;
  position: fixed;
  top: 0;
  right: 0;
}
.overlay-scroll-container a.close-button:hover {
  opacity: 1;
}
section.modal {
  width: 540px;
  position: absolute;
  top: 60px;
  left: 50%;
  margin-left: -270px;
  background-color: #fff;
  box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
  border-radius: 2px;
  padding-bottom: 32px;
}
section.modal header h3 {
  margin: 32px 32px 8px;
  font-size: 24px;
}
section.modal header p {
  margin: 0 32px;
  font-size: 14px;
  line-height: 20px;
}
section.modal header p a {
  color: #999;
  text-decoration: underline;
}
section.modal header {
  padding-bottom: 16px;
}
section.modal a.btn-close {
  position: absolute;
  top: 16px;
  right: 16px;
  color: #ddd;
  text-decoration: none;
  display: block;
  width: 24px;
  height: 24px;
  text-indent: -999px;
  overflow: hidden;
  background: url(../img/icon-close.png) center no-repeat;
}
section.modal a.btn-close:hover {
  opacity: 0.6;
}
section.modal a.btn-close:active {
  opacity: 0.8;
}
section.modal .spacer {
  padding: 0 32px 0;
}
section.modal.feedback form.popup-feedback,
section.modal.report form.popup-report {
  margin: 30px 40px;
}
section.modal.feedback textarea, section.modal.report textarea {
  width: 440px;
  height: 80px;
}
section.modal.language ul.language-list {
  list-style-type: none;
  font-size: 14px;
  width: 230px;
  float: left;
}
section.modal.language ul.language-list a {
  display: block;
  line-height: 18px;
  padding: 4px 0;
}
section.modal.language ul.language-list a.selected {
  color: #000;
  font-weight: bold;
}
section.modal.upload .field {
  margin: 0;
  border: 1px solid #ddd;
  border-bottom: none;
}
section.modal.upload .field.last {
  border-bottom: 1px solid #ddd;
  border-radius: 0 0 2px 2px;
}
section.modal.upload .field.post-info {
  position: relative;
  height: 128px;
  padding: 16px;
  box-sizing: border-box;
  border-radius: 2px 2px 0 0;
}
section.modal.upload .field.post-info .preview {
  width: 96px;
  height: 96px;
  position: absolute;
  left: 16px;
  top: 16px;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
  overflow: hidden;
}
section.modal.upload .field.post-info .preview img {
  width: 100%;
  display: block;
  border: none;
}
section.modal.upload .field.post-info .preview video {
  width: 96px;
  height: 96px;
}
section.modal.upload .field.post-info textarea {
  height: 58px;
  border: none;
  border-radius: 0;
  position: absolute;
  top: 16px;
  left: 128px;
  right: 16px;
  width: 320px;
  margin-top: 0;
  font-size: 16px;
}
section.modal.upload .field.post-info .count {
  position: absolute;
  bottom: 16px;
  right: 16px;
  color: #999;
  font-size: 12px;
}
section.modal.upload .field.post-info .count.warn {
  color: #c00;
}
section.modal.upload .field.tag {
  margin: 0;
}
section.modal.upload .field.tag label {
  line-height: 20px;
  height: 20px;
  padding: 14px;
  font-weight: normal;
  position: absolute;
}
section.modal.upload .field.tag .scroll-container {
  margin-left: 52px;
  display: flex;
  overflow-x: auto;
}
section.modal.upload .field.tag .tag-list {
  margin: 10px 0;
  display: flex;
}
section.modal.upload .field.tag span.tag {
  display: block;
  background-color: rgba(0, 153, 255, 0.2);
  float: left;
  line-height: 20px;
  padding: 4px 20px 4px 8px;
  color: #09f;
  font-weight: bold;
  border-radius: 2px;
  cursor: pointer;
  white-space: nowrap;
  margin-right: 4px;
  position: relative;
}
section.modal.upload .field.tag span.tag .remove {
  font-size: 20px;
  line-height: 18px;
  text-align: center;
  font-weight: normal;
  position: absolute;
  width: 20px;
  height: 20px;
}
section.modal.upload .field.tag input[type='text'] {
  margin: 0;
  padding: 14px 0 14px 4px;
  border: none;
  border-radius: 0;
  min-width: 160px;
  width: 100%;
}
section.modal.upload .field.checkbox {
  margin: 0;
  height: 48px;
}
section.modal.upload .field.checkbox label {
  display: block;
  height: 20px;
  position: static;
  padding: 14px;
  font-size: 14px;
}
section.modal.upload .field.checkbox p {
  line-height: 20px;
  height: 20px;
  margin-right: 48px;
}
section.modal.upload .field.checkbox input[type=checkbox] {
  right: 16px;
  left: auto;
  top: 40%;
}
section.modal.upload .field.textbox input[type=url] {
  border: none;
  margin: 0;
  line-height: 20px;
  font-size: 14px;
  padding: 14px 16px;
  background-color: transparent;
  width: 100%;
  height: 48px;
  box-sizing: border-box;
}
section.modal.upload .btn-container {
  padding: 0 32px;
  margin: 16px 0 0;
}
section.modal.upload .btn-container .btn-block {
  float: none;
  margin: 0;
}
section.modal.upload .btn-container .btn {
  margin-left: 16px;
}
section.modal.upload .source {
  border-radius: 2px;
  margin: 0 4px;
  height: 120px;
  box-sizing: border-box;
  border: 1px solid #ddd;
  text-align: center;
  font-size: 14px;
  color: #000;
  display: block;
  position: relative;
}
section.modal.upload .source:hover {
  background-color: #f9f9f9;
}
section.modal.upload .source:active {
  background-color: #f4f4f4;
}
section.modal.upload .source.disabled {
  background-color: #ccc;
  border-color: #999;
  opacity: 0.3;
  cursor: default;
}
section.modal.upload .source.file {
  height: 240px;
  font-size: 16px;
  margin: 0 0 16px;
}
section.modal.upload .source.file span.btn {
  font-weight: bold;
  font-size: 14px;
  color: #fff;
  line-height: 36px;
  height: 36px;
  padding: 0 16px;
  background-color: #09f;
  display: inline-block;
  border-radius: 2px;
  margin-top: 20px;
}
section.modal.upload .source.file.highlight {
  border-color: #09f;
}
section.modal.upload .source p {
  margin-top: 88px;
}
section.modal.upload .source.file p {
  margin-top: 140px;
}
section.modal.upload .source.file:after {
  content: '';
  background: url('../img/sprite-upload.png') no-repeat;
  background-size: 224px 82px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  width: 76px;
  height: 82px;
  top: 45px;
  margin-left: -38px;
}
section.modal.upload .source.pic-url:after {
  content: '';
  background: url('../img/sprite-upload.png') -76px 0 no-repeat;
  background-size: 224px 82px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  top: 28px;
  width: 48px;
  height: 48px;
  margin-left: -24px;
}
section.modal.upload .source.pic-url:after {
  content: '';
  background: url('../img/sprite-upload.png') -76px 0 no-repeat;
  background-size: 224px 82px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  top: 28px;
  width: 48px;
  height: 48px;
  margin-left: -24px;
}
section.modal.upload .source.vid-url:after {
  content: '';
  background: url('../img/sprite-upload.png') -124px 0 no-repeat;
  background-size: 224px 82px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  top: 28px;
  width: 48px;
  height: 48px;
  margin-left: -24px;
}
section.modal.upload .wrapper .tooltip {
  position: absolute;
  display: inline-block;
  text-align: center;
  background-color: #000;
  color: #fff;
  width: 80%;
  left: 5%;
  border-radius: 2px;
  padding: 8px 8px;
  font-size: 14px;
  top: 132px;
  display: none;
}
section.modal.upload .wrapper .tooltip:before {
  content: '';
  border-bottom: 7px solid #000;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  position: absolute;
  top: -7px;
  left: 50%;
  margin-left: -6px;
}
section.modal.upload .wrapper:hover .tooltip {
  display: block;
}
section.modal.upload .source.meme:after {
  content: '';
  background: url('../img/sprite-upload.png') -172px 0 no-repeat;
  background-size: 224px 82px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  top: 32px;
  width: 52px;
  height: 42px;
  margin-left: -29px;
}
section.modal.upload .other-source {
  width: 100%;
}
section.modal.upload .other-source:before,
section.modal.upload .other-source:after {
  content: " ";
  display: table;
}
section.modal.upload .other-source:after {
  clear: both;
}
section.modal.upload .other-source .wrapper {
  width: 33.33%;
  float: left;
  position: relative;
}
section.modal.upload .wrapper:first-child .source {
  margin: 0 4px 0 0;
}
section.modal.upload .wrapper:last-child .source {
  margin: 0 0 0 4px;
}
section.modal.upload .message {
  background-color: #FFEBEE;
  color: #B71C1C;
  padding: 16px;
  border-radius: 4px;
  margin-bottom: 24px;
  line-height: 20px;
}
ul.section-picker, ul.reason-picker {
  list-style-type: none;
  box-sizing: border-box;
  border: 1px solid #ccc;
  overflow: hidden;
  overflow-y: scroll;
  max-height: 416px;
  border-radius: 2px;
}
ul.section-picker li a, ul.reason-picker li a {
  display: block;
  position: relative;
  color: #000;
  height: 48px;
  padding: 16px;
}
ul.section-picker li a:hover, ul.reason-picker li a:hover {
  background-color: #f4f4f4;
}
ul.section-picker li a:active, ul.reason-picker li a:active {
  background-color: #eee;
}
ul.section-picker .icon {
  width: 48px;
  height: 48px;
  background-color: #eee;
  border-radius: 2px;
  overflow: hidden;
  position: absolute;
  top: 16px;
  left: 16px;
}
ul.section-picker .icon img {
  display: block;
  border: none;
  width: 100%;
}
ul.section-picker .text {
  margin: 4px 48px 0 64px;
}
ul.section-picker .text h3, ul.reason-picker .text h3 {
  font-size: 16px;
  margin-bottom: 2px;
}
ul.section-picker .text p {
  color: #999;
  font-size: 12px;
}
ul.section-picker .selector, ul.reason-picker .selector {
  width: 24px;
  height: 24px;
  border-radius: 12px;
  background-color: #eee;
  position: absolute;
  right: 16px;
  top: 50%;
  margin-top: -12px;
}
ul.section-picker a:hover .selector, ul.reason-picker a:hover .selector {
  background-color: #ddd;
}
ul.section-picker .selector.selected, ul.reason-picker .selector.selected {
  background-image: url('../img/custom-checkbox.png');
  background-size: 100%;
  background-color: #09f;
}
ul.section-picker a:hover .selector.selected,
ul.reason-picker a:hover .selector.selected {
  background-color: #09f;
}
ul.section-picker.disabled, ul.reason-picker.disabled {
  opacity: 0.5;
  overflow: hidden;
  pointer-events: none;
}
ul.reason-picker li a {
  padding: 0 16px;
  line-height: 48px;
}
.reason-explain {
  box-sizing: border-box;
  border: 1px solid #ccc;
  overflow: hidden;
  overflow-y: scroll;
  max-height: 416px;
  border-radius: 2px;
  padding: 16px;
}
.reason-explain p, .reason-explain ul, .reason-explain ol {
  margin: 8px 0;
  line-height: 20px;
}
.reason-explain ul, .reason-explain ol {
  padding-left: 24px;
}
.drag-and-drop h1 {
  color: #fff;
  text-align: center;
  font-size: 56px;
  line-height: 56px;
  position: absolute;
  top: 50%;
  margin-top: -28px;
  width: 100%;
}
a.upload-selected {
  color: #000;
  cursor: default;
}
.zoom-container {
  text-align: center;
  height: 100%;
  width: 100%;
  min-width: 700px;
  cursor: -webkit-zoom-out;
  cursor: -moz-zoom-out;
  cursor: zoom-out;
}
.zoom-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.zoom-container img {
  display: inline-block;
  vertical-align: middle;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .8);
  width: 780px;
}
section#settings {
  position: relative;
  margin: 40px auto 0;
}
section#settings h2 {
  font-size: 36px;
  line-height: normal;
}
ul.form-nav {
  list-style-type: none;
  position: absolute;
  top: 0;
  left: 0;
}
ul.form-nav li a {
  display: block;
  text-decoration: none;
  color: #999;
  line-height: 19px;
  font-weight: bold;
  padding: 10px;
  width: 240px;
  border-radius: 2px;
}
ul.form-nav li a.selected {
  background-color: #2D72D9;
  color: #fff;
  border-color: #08a;
}
form#setting {
  overflow: hidden;
  margin-left: 300px;
}
form#setting textarea {
  width: 438px;
  height: 80px;
}
.setting-social-connect {
  width: 460px;
}
.setting-social-connect label {
  margin-bottom: 6px;
  display: block;
  font-weight: bold;
}
.setting-social-connect .connection {
  margin-bottom: 20px;
  background-color: #f4f4f4;
  border-radius: 2px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .1);
}
.setting-social-connect .connection .field {
  margin: 0;
  padding: 10px;
}
.setting-social-connect .connection p.label {
  line-height: 20px;
  padding: 10px;
  float: left;
  color: #999;
  font-weight: bold;
}
.setting-social-connect .connection a.btn,
.setting-social-connect .connection a.thick {
  float: right;
}
.setting-social-connect .connection .checklist {
  border-top: 1px solid #ddd;
  padding: 10px 0;
  margin: 0 20px;
}
.setting-social-connect .connection .field.checkbox {
  padding: 10px 0;
}
.blank-state {
  background-color: #f4f4f4;
  margin: 20px 0;
  height: 300px;
  overflow: hidden;
  border-radius: 2px;
}
.blank-state h3 {
  font-size: 16px;
  text-align: center;
  font-weight: 400;
  margin-top: 140px;
  color: #999;
}
.blank-state .btn-container {
  text-align: center;
  margin-top: 10px;
}
.blank-state .btn-container a.btn {
  display: inline-block;
}
.blank-state.comment h3,
.blank-state.overview h3,
.blank-state.upload h3,
.blank-state.upvote h3 {
  margin-top: 120px;
}
section#static {
  position: relative;
  width: 610px;
  margin: 20px auto;
}
section#static.advertise {
  width: 940px;
}
section#static h2 {
  font-size: 28px;
  margin-top: 20px;
}
ul.static-nav {
  list-style-type: none;
  position: absolute;
  top: 0;
  left: 0;
}
ul.static-nav li a {
  display: block;
  text-decoration: none;
  color: #999;
  line-height: 19px;
  font-weight: bold;
  padding: 10px;
  width: 260px;
  border-bottom: 1px solid #eee;
}
ul.static-nav li a.selected {
  background-color: #2D72D9;
  color: #fff;
  border-color: #08a;
}
section#signup {
  width: 460px;
  margin: 40px auto;
  font-size: 14px;
}
.modal section#signup {
  margin: 40px auto 0;
}
section#signup h2 {
  font-size: 36px;
  margin-bottom: 10px;
}
section#signup p.lead {
  margin-bottom: 20px;
  line-height: 1.6em;
  color: #999;
}
section#signup .social-signup {
  padding-bottom: 20px;
  border-bottom: 1px solid #eee;
  overflow: hidden;
  margin-bottom: 20px;
}
a.btn-connect-option {
  display: block;
  font-size: 20px;
  font-weight: bold;
  background-color: #2D72D9;
  color: #fff;
  width: 145px;
  height: 30px;
  line-height: 28px;
  text-align: center;
  padding: 15px 15px 15px 60px;
  border-radius: 2px;
  float: left;
}
a.btn-connect-option.facebook {
  background: #3b5998 url(../img/btn-connect-option.png) no-repeat;
  margin-right: 20px;
}
a.btn-connect-option.google-plus {
  background: #DC4D28 url(../img/btn-connect-option.png) no-repeat 0 -60px;
}
a.btn-connect-option.twitter {
  background-color: #00aced;
}
section#signup p.alternative {
  color: #999;
  margin-bottom: 10px;
}
section#signup p.alternative a {
  font-weight: bold;
}
section#signup #login-email p.lead {
  margin-bottom: 10px;
}
section#signup #login-email a.forgot-password {
  display: inline-block;
  color: #999;
  float: right;
  font-size: 14px;
  line-height: 40px;
}
section.modal.download {
  background-color: transparent;
  color: #999;
  text-align: center;
  box-shadow: none;
  top: 100px;
}
section.modal.download h2 {
  font-size: 36px;
  color: #fff;
  margin-bottom: 10px;
}
section.modal.download .btn-download {
  display: block;
  max-width: 160px;
  margin: 0 auto 20px;
  line-height: 22px;
  height: 24px;
  padding: 18px 0 18px 60px;
  border: 0;
  font-size: 20px;
}
section.modal.download .btn-download.ios {
  background: #2AA9DE url(../img/btn-icon-download.png) no-repeat;
}
section.modal.download .btn-download.ios:hover {
  background-color: #47B5E3;
}
section.modal.download .btn-download.ios:active {
  background-color: #1D8BB8;
}
section.modal.download .btn-download.android {
  background: #44DB5E url(../img/btn-icon-download.png) 0 -60px no-repeat;
}
section.modal.download .btn-download.android:hover {
  background-color: #60E077;
}
section.modal.download .btn-download.android:active {
  background-color: #26C642;
}
section.modal.download a.link {
  color: #999;
}
section.modal.download a.link:hover {
  color: #fff;
}
section.modal.download a.link:active {
  color: #777;
}
section#delete-account {
  width: 460px;
  margin: 100px auto;
  font-size: 14px;
}
section#delete-account h2 {
  font-size: 36px;
  line-height: normal;
  margin-bottom: 5px;
}
section#delete-account p.lead {
  margin-bottom: 20px;
  line-height: 1.6em;
  color: #999;
}
section#delete-account .btn-container a.btn,
section#delete-account .btn-container a.thick {
  text-align: center;
  display: block;
  width: 220px;
}
section#delete-account .btn-container a.thick {
  font-size: 12px;
  color: #999;
  display: inline-block;
  width: auto;
  padding: 10px 0;
}
form#delete-account {
  padding-top: 40px;
  margin-top: 40px;
  border-top: 1px solid #eee;
}
form#delete-account .field {
  margin-top: 0;
}
form#delete-account .btn-container {
  padding: 0;
}
section#social-transfer {
  width: 600px;
  margin: 100px auto;
  font-size: 14px;
}
section#social-transfer h2 {
  font-size: 26px;
  margin-bottom: 5px;
}
section#social-transfer p.lead {
  margin-bottom: 20px;
  line-height: 1.6em;
  color: #999;
}
section#social-transfer .btn-container .btn,
section#social-transfer .btn-container a.thick {
  text-align: center;
  display: block;
  width: 220px;
}
section#social-transfer .btn-container a.thick {
  font-size: 12px;
  color: #999;
  display: inline-block;
  width: auto;
  padding: 10px 0;
}
a.back-to-top {
  width: 30px;
  height: 30px;
  text-indent: -999px;
  overflow: hidden;
  text-align: center;
  border: 1px solid #ddd;
  background: #fff url(../img/sprite.png) -60px 0 no-repeat;
  background-size: 510px 120px;
  color: #999;
  border-radius: 2px;
  position: fixed;
  right: 20px;
  bottom: -100px;
  -webkit-transition: opacity .3s ease-in-out 0, bottom .3s ease-in-out .5s;
}
a.back-to-top.show {
  bottom: 20px;
}
@media only screen and (max-width: 1080px) {
  a.back-to-top {
    opacity: 0;
    bottom: -100px;
  }
}
a.back-to-top:hover {
  border-color: #aaa;
}
a.back-to-top:active {
  background-color: #fafafa;
}
footer {
  padding: 30px 0 60px;
  color: #999;
}
footer .width-limit {
  width: 940px;
  margin: 0 auto;
}
footer .primary, footer .secondary {
  margin-bottom: 10px;
}
footer .primary ul, footer .secondary ul {
  list-style-type: none;
  text-align: center;
}
footer .primary li {
  display: inline-block;
  margin: 0 15px;
}
footer .secondary li {
  display: inline-block;
  margin: 0 5px;
  color: #999;
}
footer .primary a {
  color: #999;
}
footer .secondary a {
  color: #999;
  font-size: 12px;
}
footer .naughty-box {
  width: 940px;
  height: 130px;
  background-color: #f4f4f4;
  margin: 0 auto 20px;
  overflow: hidden;
}
footer .naughty-box .image-container {
  width: 728px;
  height: 90px;
  margin: 20px auto 0;
  background-color: #d4d4d4;
}
footer .naughty-box img {
  display: block;
}
footer .naughty-box p.advertise-here {
  width: 728px;
  margin: 0 auto;
  text-align: right;
  line-height: 20px;
  font-size: 12px;
}
.outbound {
  background-color: #fff;
  width: 400px;
  font-size: 15px;
  padding: 30px;
  margin: 60px auto;
}
.outbound h3 {
  font-size: 28px;
  margin-bottom: 20px;
}
.outbound p {
  margin: 0 0 10px;
  line-height: 1.6em;
}
.outbound p.url {
  background-color: #f5f5f5;
  line-height: 20px;
  padding: 10px;
  width: 380px;
  text-overflow: ellipsis;
  overflow: hidden;
  text-align: center;
  font-weight: bold;
}
.outbound .button-container {
  margin-top: 30px;
}
.outbound .button-container a.btn {
  margin-right: 20px;
}
a.userbadge, span.userbadge {
  display: inline-block;
  height: 12px;
  width: 25px;
  background-repeat: no-repeat;
  background-size: cover;
  text-indent: -999px;
  overflow: hidden;
}
a.userbadge.size-24, span.userbadge.size-24 {
  height: 24px;
  width: 50px;
}
a.userbadge.pro, span.userbadge.pro {
  background-image: url(../img/pro-badge-24.png);
}
.clearfix {
  clear: both;
}
.no-scroll {
  overflow: hidden;
  height: 100%;
}
.absolute {
  position: absolute !important;
}
.fixed {
  position: fixed !important;
}
.hide {
  display: none !important;
}
.left {
  float: left !important;
}
.right {
  float: right !important;
}
.cursor-pointer {
  cursor: pointer !important;
}
.post-afterbar-a.in-post-bot.full-width .three-btn .btn-share {
  width: 236px;
  min-width: 230px;
  border: 0;
}
.post-afterbar-a.in-post-bot.full-width .share.three-btn li {
  margin: 0 10px 0 0;
}
.post-afterbar-a.in-post-bot.full-width .share.three-btn li:last-child {
  margin: 0;
}
.badge-sticky-button {
  background-color: rgba(0, 0, 0, .9);
  right: 70px;
  bottom: 0;
  height: 2em;
  line-height: 2em;
  position: fixed;
  padding: 0 10px;
  z-index: 150;
}
.section-sidebar {
  width: 192px;
  height: calc(100% - 48px);
  position: fixed;
  z-index: 1;
  overflow: hidden;
  overscroll-behavior: contain;
}
.section-sidebar .stealthy-scroll-container {
  padding-top: 24px;
}
.section-sidebar section {
  padding: 0 0 12px;
}
.section-sidebar header h3 {
  line-height: 16px;
  height: 16px;
  margin-bottom: 8px;
  color: #999;
  font-size: 12px;
  text-transform: uppercase;
}
.section-sidebar section .nav {
  list-style: none;
}
.section-sidebar section .nav li {
  position: relative;
}
.section-sidebar .nav .label {
  color: #000;
  font-size: 14px;
  height: 36px;
  line-height: 20px;
  padding: 8px 0 8px 36px;
  box-sizing: border-box;
  display: block;
  position: relative;
  border-radius: 2px;
  transition: background-color 0.15s;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 8px;
}
.section-sidebar .nav li:hover .label {
  background-color: rgba(0,0,0,0.03);
}
.section-sidebar .nav li:active .label {
  background-color: rgba(0,0,0,0.075);
}
.section-sidebar .nav .label.selected {
  background-color: rgba(0,0,0,0.05);
  font-weight: bold;
}
.section-sidebar .icon,
.section-sidebar .nav .thumbnail {
  position: absolute;
  width: 24px;
  height: 24px;
  background-size: 264px 48px;
  background-image: url(../img/post-action-sprite.png);
  left: 4px;
  top: 50%;
  margin-top: -12px;
}
.section-sidebar .icon.hot {
  background-position: -168px 0;
}
.section-sidebar .icon.trending {
  background-position: -192px 0;
}
.section-sidebar .icon.fresh {
  background-position: -216px 0;
}
.section-sidebar .icon.star {
  background-position: -240px 0;
}
.section-sidebar .nav .thumbnail {
  background-color: rgba(0,0,0,0.05);
  background-image: none;
  border-radius: 2px;
  overflow: hidden;
}
.section-sidebar .nav .thumbnail img {
  display: block;
  width: 100%;
  height: 100%;
}
.section-sidebar .nav .button {
  position: absolute;
  width: 36px;
  height: 36px;
  display: block;
  right: 0;
  top: 0;
  opacity: 0;
  transition: opacity 0.15s;
}
.section-sidebar .nav li:hover .button {
  opacity: 1;
}
.section-sidebar .nav .button .icon {
  opacity: 0.4;
  left: 6px;
}
.section-sidebar .shortcut .nav .button {
  opacity: 1;
}
.section-sidebar .shortcut .nav .button .icon {
  background-position-y: -24px;
  opacity: 1;
}
.section-sidebar .footer {
  padding-bottom: 24px;
}
.section-sidebar .footer p.static {
  font-size: 12px;
  line-height: 18px;
  color: #999;
  margin-bottom: 8px;
}
.section-sidebar .footer a {
  color: #999;
  margin-right: 4px;
}
.section-sidebar .footer p.static a:hover {
  color: #666;
}
#container {
  width: 1196px;
  padding: 48px 16px 32px;
  position: relative;
}
.stealthy-scroll-container {
  padding-right: 20px;
  width: 100%;
  height: 100%;
  overflow-y: scroll;
}
.stealthy-scroll-container::-webkit-scrollbar {
  width: 0px;
  opacity: 0;
}
@media only screen and (max-width: 1228px) {
  .section-sidebar {
    position: absolute;
    overscroll-behavior: auto;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* IE10+ CSS styles go here */
  body {
    font-family: "Segoe UI",
      "Helvetica Neue",
      Arial,
      Helvetica,
      Geneva,
      sans-serif;
  }
}
/* BEGIN developer CSS */

#vue-container {
    height: 50vh;
}

.topBannerAd {
    width: 970px;
    height: 250px;
    background-color: #f4f4f4;
}
.section-sidebar .stealthy-scroll-container {
    will-change: transform;
}
a.back-to-top {
    will-change: transform;
}
.badge-sticky-button {
    will-change: transform;
}
#top-nav {
    will-change: transform;
}

/* END developer CSS */