input, textarea#comment {
  border: none;
  border-radius: 3px;
  font-size: 1.5em;
  line-height: 1.5;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  outline: none;
  padding-left: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

button, input#submit {
  font-size: 0.9em;
  padding: 5px 14px;
  border: 1px solid #fff;
  background-color: transparent;
  border-radius: 3px;
  color: #fff;
  cursor: pointer;
  pointer-events: all;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition: all 150ms ease;
  margin: 14px 0 7px 0;
  display: table;
  outline: none; }
  @media (hover: hover) {
    button a, input#submit a {
      text-decoration: none; }
    button:hover, input#submit:hover {
      background-color: #fff;
      color: #007ceb; }
    button:hover a, input#submit:hover a {
      color: #007ceb !important;
      text-decoration: none !important; } }

.mini-button {
  font-size: 0.9em;
  padding: 1px 7px;
  border: 1px solid rgba(0, 124, 235, 0.74);
  border-radius: 3px;
  color: #007ceb;
  cursor: pointer;
  pointer-events: all;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition: all 250ms ease;
  margin: 14px 0 7px 0;
  white-space: nowrap; }
  .mini-button a, .mini-button a:visited {
    color: #007ceb;
    text-decoration: none; }
  @media (hover: hover) {
    .mini-button a {
      text-decoration: none; }
    .mini-button:hover {
      background-color: #007ceb;
      border-color: #007ceb;
      color: #fff; }
    .mini-button:hover a {
      color: #fff !important;
      text-decoration: none !important; } }

@supports (mix-blend-mode: screen) {
  button:hover, input#submit:hover {
    color: #000 !important;
    mix-blend-mode: screen; } }

#avatar-selector, .user-info {
  margin: 0 auto;
  max-width: 700px;
  padding-left: 14px;
  padding-right: 14px;
  word-wrap: break-word; }

input, textarea#comment, .mini-button, .comment-interaction-row, .comment .tooltip-text, #comments, #loading-spinner, .comment, .comment-top-row, .badge, .member-account p, .member-account ul, .user-info p, .user-info ul, .higgscom-admin p, .higgscom-admin ul, .payment-page p, .payment-page ul, .user-info, .user-info .verified .tooltip-text {
  font-family: 'Nonserif Light';
  font-feature-settings: 'ss01'; }

button, input#submit, .comments-title, .author-name, #reply-title, .member-account h1, .member-account h2, .member-account h3, .member-account h4, .member-account h5, .member-account h6, .user-info h1, .user-info h2, .user-info h3, .user-info h4, .user-info h5, .user-info h6, .higgscom-admin h1, .higgscom-admin h2, .higgscom-admin h3, .higgscom-admin h4, .higgscom-admin h5, .higgscom-admin h6, .payment-page h1, .payment-page h2, .payment-page h3, .payment-page h4, .payment-page h5, .payment-page h6, .user-list .list-group, .user-info .username {
  font-family: 'Nonserif Bold';
  font-feature-settings: 'ss01'; }

/* Animatinos */
@keyframes spin {
  100% {
    transform: rotate(360deg); } }
@keyframes appear {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes blink {
  0% {
    opacity: 0; }
  21% {
    opacity: 1; }
  79% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes blink-background {
  0% {
    background-color: inherit;
    color: #dd2258; }
  50% {
    background-color: #dd2258;
    color: #fff; }
  100% {
    background-color: inherit;
    color: #dd2258; } }
@keyframes appear-zoom {
  0% {
    opacity: 0;
    transform: scale(0.8); }
  30% {
    transform: scale(1); }
  100% {
    opacity: 1; } }
@keyframes pulse {
  0% {
    transform: scale(1); }
  50% {
    transform: scale(1.05); }
  100% {
    transform: scale(1); } }
@keyframes bump-side {
  0% {
    transform: translateX(0); }
  30% {
    transform: translateX(-2vw); }
  80% {
    transform: translateX(0); } }
@keyframes barberpole {
  100% {
    background-position: 100% 100%; } }
@keyframes slide-in {
  0% {
    opacity: 0;
    background-color: transparent;
    transform: translateY(100%); }
  30% {
    background-color: #00bf58;
    opacity: 1;
    transform: translateY(0); }
  100% {
    background-color: transparent; } }
.comment-link, .author-name, .badge-button, .comment-button, .badge {
  color: #000;
  border-radius: 3px;
  padding: 3px 7px;
  line-height: 16px;
  transition: background-color 50ms ease-in-out; }
  .comment-link:hover, .author-name:hover, .badge-button:hover, .comment-button:hover, .badge:hover {
    cursor: default;
    background-color: rgba(0, 0, 0, 0.07); }

.comment-link:hover, .author-name:hover, .badge-button:hover, .comment-button:hover {
  background-color: #007ceb;
  color: #fff;
  cursor: pointer; }
  .comment-link:hover .gg-icon, .author-name:hover .gg-icon, .badge-button:hover .gg-icon, .comment-button:hover .gg-icon {
    fill: #fff;
    stroke: #fff; }

.comment-interaction-group {
  margin-top: 14px;
  display: inline-block; }

.comment .tooltip-text {
  padding: 3px 7px !important;
  white-space: nowrap; }

#comments {
  margin: 0 auto;
  max-width: 700px;
  border-radius: 3px;
  font-size: 1.2em;
  color: #000;
  pointer-events: all;
  animation: appear 500ms ease-in; }

#loading-spinner {
  margin: auto;
  max-width: 700px;
  color: #000; }
  #loading-spinner .gg-icon {
    width: 16px;
    height: 16px;
    fill: #000;
    margin-right: 7px;
    animation: spin 1s infinite ease-in-out; }

.comments-title {
  font-size: 2em;
  margin-bottom: 14px;
  color: #000;
  cursor: pointer; }
  .comments-title .gg-icon {
    float: right;
    margin-top: 8px;
    width: 32px;
    fill: #007ceb;
    transition: transform 300ms ease-in-out;
    padding: 7px;
    border-radius: 3px; }
  .comments-title .comments-arrow-rotated {
    transform: rotate(180deg); }

.comment .gg-icon {
  width: 18px;
  height: 18px;
  fill: #000;
  stroke: #000;
  margin-right: 7px;
  vertical-align: middle; }

.comment {
  font-size: 1em;
  background: linear-gradient(to right, rgba(0, 128, 255, 0.03), transparent 7%);
  border-top: 0.5px solid rgba(0, 0, 0, 0.2);
  padding: 21px 0 0 21px;
  max-height: 20000px;
  opacity: 1;
  overflow: visible;
  position: relative; }

.comment img {
  max-width: 100%;
  max-height: 200px;
  border-radius: 3px;
  display: block; }

.comment-link {
  display: inline-block;
  padding: 1px 7px;
  font-size: 0.8em;
  background-color: #ececec; }
  .comment-link a {
    text-decoration: none !important; }
  .comment-link:hover a, .comment-link:hover a:visited {
    color: #fff; }

.comment-collapsed {
  display: none; }

.comment p {
  padding-right: 14px; }

.comment-deep {
  background-color: transparent;
  background: none; }

.comment-top-row {
  display: block;
  font-size: 0.7em; }
  .comment-top-row .avatar {
    width: 42px;
    height: 42px;
    margin-right: 7px;
    margin-top: -3px;
    float: left; }

.author-name {
  padding: 0 7px;
  margin-left: -7px;
  font-size: 1.2em; }
  .author-name a, .author-name a:visited {
    text-decoration: none;
    color: inherit; }
  .author-name.no-highlight:hover {
    cursor: default;
    background: none;
    color: #000; }

.badge {
  display: inline-block; }
  .badge .gg-icon {
    margin-right: 0;
    height: 12px; }

.badge-button {
  position: relative; }
  .badge-button a {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; }

.comment-date {
  display: block;
  margin-top: 4px; }

.comment-content {
  margin-top: 21px;
  padding-right: 7px;
  padding-bottom: 21px;
  overflow: visible;
  white-space: pre-line;
  font-size: 0.9em;
  line-height: 1.3; }

.comment-content a, .comment-content a:visited {
  word-break: break-all;
  color: #000; }

.comment-button {
  border: 1px solid transparent;
  font-size: 0.7em;
  position: relative;
  padding: 7px;
  height: 15px; }
  .comment-button a {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; }

.comment-share-icons {
  display: none;
  vertical-align: middle; }
  .comment-share-icons a {
    position: relative; }
  .comment-share-icons .gg-icon {
    stroke: none !important; }
  .comment-share-icons .gg-icon:hover {
    fill: #007ceb; }

.flipper .flipper-front {
  display: inherit; }
.flipper .flipper-back {
  display: none !important; }
.flipper.flipped {
  background-color: transparent;
  padding: 0; }
  .flipper.flipped .flipper-back {
    display: inherit !important; }
  .flipper.flipped .flipper-front {
    display: none; }
  .flipper.flipped:hover {
    background-color: transparent; }
    .flipper.flipped:hover .gg-icon {
      fill: #000; }
  .flipper.flipped .gg-icon {
    fill: #000;
    padding: 7px; }
    .flipper.flipped .gg-icon:hover {
      fill: #fff;
      background: #007ceb;
      border-radius: 3px; }
  .flipper.flipped .comment-share-icons {
    display: inline-block; }
.flipper .blink {
  border-color: #dd2258;
  animation: blink-background 2s infinite; }
  .flipper .blink:hover {
    animation: none;
    background-color: #dd2258; }

.comment-button.clicked {
  cursor: default;
  background-color: rgba(0, 128, 255, 0.03); }
  .comment-button.clicked .value {
    color: #007ceb; }
  .comment-button.clicked .gg-icon {
    fill: #007ceb;
    stroke: #007ceb;
    animation: spin 500ms 1 ease-in-out; }
  .comment-button.clicked:hover {
    background-color: transparent; }

#respond {
  padding: 7px 14px 14px 14px;
  background-color: #007ceb;
  background: linear-gradient(#21b3ff, #007ceb);
  color: #fff;
  max-height: 5000px;
  border-radius: 3px;
  opacity: 1;
  transition: max-height 300ms ease-out, padding-top 300ms ease-out, padding-bottom 300ms ease-out, opacity 300ms ease-out;
  position: relative;
  a: hover;
    a-text-decoration: underline; }
  #respond a {
    text-decoration: none;
    color: rgba(255, 255, 255, 0.75); }
  #respond a#cancel-comment-reply-link {
    display: block;
    font-size: 0.7em;
    padding: 7px 0 21px 0; }
  #respond .logged-in-as {
    margin-top: 7px;
    margin-bottom: 14px; }
  #respond .button {
    display: inline-block;
    margin-right: 14px; }

.respond-to-specific-comment::before {
  content: '';
  position: absolute;
  top: 0;
  left: 3px;
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-bottom-color: #21b3ff;
  border-top: 0;
  margin-top: -8px; }

.comment-active > .comment-bar {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 19px;
  animation: appear 1s reverse ease-out forwards;
  background: linear-gradient(to right, #007ceb, transparent); }

#reply-title {
  font-size: 1.5em;
  color: #fff;
  margin-top: 7px; }

input {
  color: #fff;
  font-size: 1em; }

.tile-login input {
  width: 100%; }

input#submit {
  padding: 7px 14px;
  -webkit-appearance: none;
  width: auto; }

textarea#comment {
  min-height: 30px;
  width: 100%;
  margin: 14px 0;
  font-size: 1em;
  box-sizing: border-box;
  transition: min-height 300ms ease-in-out; }
  textarea#comment::placeholder {
    visibility: hidden;
    color: rgba(255, 255, 255, 0.5); }
  textarea#comment::-ms-input-placeholder {
    visibility: hidden;
    color: rgba(255, 255, 255, 0.5); }
  textarea#comment::-moz-selection {
    background: #fff;
    color: #3e9fff; }
  textarea#comment::selection {
    background: #fff;
    color: #3e9fff; }

.comment-form-visible textarea#comment {
  min-height: 85px; }
  .comment-form-visible textarea#comment::placeholder {
    visibility: visible; }

.comment-form-author, .comment-form-email, .form-submit {
  margin-bottom: 0;
  opacity: 0;
  max-height: 0;
  transition: all 500ms ease-out;
  overflow: hidden; }

.comment-rules {
  opacity: 0;
  max-height: 0; }

.comment-form-visible {
  opacity: 1;
  margin-bottom: 7px;
  max-height: 100px; }

.comment-form label {
  display: block; }

.login-form-container {
  background-color: #007ceb;
  background: linear-gradient(#21b3ff, #007ceb); }

.member-account .gg-icon, .user-info .gg-icon, .higgscom-admin .gg-icon, .payment-page .gg-icon {
  width: 18px;
  height: 18px; }
.member-account .label-byline, .user-info .label-byline, .higgscom-admin .label-byline, .payment-page .label-byline {
  color: rgba(0, 0, 0, 0.5);
  visibility: hidden;
  margin-left: 7px; }
.member-account .flipper-back:hover ~ .label-byline, .user-info .flipper-back:hover ~ .label-byline, .higgscom-admin .flipper-back:hover ~ .label-byline, .payment-page .flipper-back:hover ~ .label-byline {
  visibility: visible;
  max-height: 1000px; }

#avatar-selector .avatar {
  width: 64px;
  height: 64px;
  padding: 5px 0 2px 0; }
#avatar-selector .flipper {
  display: inline-block; }
  #avatar-selector .flipper .flipper-back .mini-button {
    display: inline-block;
    margin: 0 6px 6px 0; }

.user-list .list-group {
  padding: 14px; }
.user-list .avatar {
  width: 32px;
  height: 32px;
  margin-right: 14px;
  float: left; }
.user-list a {
  text-decoration: none; }
.user-list .amount {
  float: right; }
.user-list.animate-first-row .list-group:first-of-type {
  animation: slide-in 1.5s ease-in-out; }

.user-info {
  margin-top: 96px;
  margin-bottom: 28px;
  pointer-events: all;
  font-size: 1.2em;
  box-sizing: border-box;
  top: 75.8px; }
  .user-info h2 {
    font-size: 2em; }
  .user-info ul {
    margin-top: 14px;
    list-style-type: square;
    list-style-position: outside;
    padding-left: 21px; }
  .user-info li {
    line-height: 1.5em; }
  .user-info .user-avatar .avatar {
    height: 4.5em;
    width: 4.5em;
    fill: #007ceb;
    margin-bottom: 14px;
    vertical-align: text-bottom; }
  .user-info .username {
    font-size: 3em;
    padding-bottom: 14px; }
    .user-info .username a, .user-info .username a:visited {
      color: #007ceb;
      text-decoration: none; }
  .user-info .verified {
    color: #007ceb;
    font-size: 0.7em;
    margin-left: 14px;
    border-color: transparent !important;
    background-color: transparent !important; }
    .user-info .verified .tooltip-text {
      font-size: 1rem; }
  .user-info .user-number {
    display: block;
    padding: 14px 0; }
  .user-info .badge-row {
    margin: 28px 0;
    line-height: 2; }
  .user-info .badge {
    display: inline;
    margin-right: 7px;
    background-color: rgba(0, 0, 0, 0.07);
    border-radius: 3px;
    padding: 3px 7px;
    max-height: 17px; }
    .user-info .badge .gg-icon {
      height: 20px;
      width: 20px;
      vertical-align: middle; }
  .user-info .badge-button {
    border-color: #007ceb;
    background-color: transparent;
    color: #007ceb; }
    .user-info .badge-button:hover {
      background-color: #007ceb;
      color: #fff; }
  .user-info .user-description {
    padding: 28px 0; }
  .user-info .user-stats {
    padding: 28px 0; }

.mini-button.no-hover:hover {
  cursor: default; }
.mini-button.pure-text {
  border-color: transparent; }
.mini-button.pure-text:hover {
  background-color: transparent;
  color: #007ceb; }

.mini-button.okay {
  color: #fff;
  background-color: #00bf58;
  border-color: #00bf58;
  visibility: visible; }

.mini-button.not-okay {
  color: #fff;
  background-color: #dd2258;
  border-color: #dd2258;
  visibility: visible; }

.okay {
  color: #00bf58; }

.not-okay {
  color: #dd2258; }

.mini-button.next-line {
  display: inline-block;
  visibility: hidden;
  cursor: default; }

.form-yin {
  margin-top: 14px; }
  .form-yin label {
    color: #000; }
  .form-yin label.fixed-width {
    width: 120px;
    display: inline-block; }
  .form-yin .label-byline {
    color: rgba(0, 0, 0, 0.5);
    margin-left: 0;
    display: block;
    visibility: hidden;
    max-height: 0; }
  .form-yin input {
    color: #000;
    min-width: 140px;
    box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, 0.2);
    margin-right: 7px;
    margin-bottom: 4px; }
  .form-yin input:focus {
    border-color: rgba(0, 124, 235, 0.74); }
  .form-yin input:focus + .mini-button {
    visibility: hidden; }
  .form-yin input:focus ~ .label-byline {
    visibility: visible;
    max-height: 1000px; }
  .form-yin .form-row {
    margin-top: 0;
    margin-bottom: 7px; }

.anchor-list a, .anchor-list a:visited {
  font-size: 0.7em;
  display: inline-block;
  margin-right: 14px;
  color: rgba(0, 0, 0, 0.2);
  text-decoration: none; }
  .anchor-list a:hover, .anchor-list a:visited:hover {
    color: #007ceb; }

.danger-zone {
  border: 1px solid #dd2258;
  max-width: 728px;
  margin: 56px auto 14px auto;
  padding: 0 14px 14px 14px;
  border-radius: 7px; }
  .danger-zone:hover {
    background: repeating-linear-gradient(145deg, #fff, #fff 30px, rgba(221, 24, 88, 0.05) 30px, rgba(221, 24, 88, 0.05) 60px); }
  .danger-zone .label-byline {
    margin-left: 7px;
    color: #dd2258; }
  .danger-zone .mini-button {
    color: #dd2258;
    border-color: #dd2258; }
    .danger-zone .mini-button a {
      color: #dd2258; }
    .danger-zone .mini-button:hover {
      border-color: #dd2258;
      color: #fff;
      background-color: #dd2258; }

.list-group {
  border: 1px solid rgba(0, 0, 0, 0.2);
  max-width: 700px;
  margin: 14px auto;
  padding: 0 14px 14px 14px;
  border-radius: 3px; }
  .list-group .mini-button {
    margin-right: 7px;
    display: inline-block; }
    .list-group .mini-button a {
      color: inherit; }
  .list-group .mini-button.okay {
    background: transparent;
    color: #00bf58; }
    .list-group .mini-button.okay:hover {
      color: #fff;
      background-color: #00bf58; }
  .list-group .mini-button.not-okay {
    background: transparent;
    color: #dd2258; }
    .list-group .mini-button.not-okay:hover {
      color: #fff;
      background-color: #dd2258; }
  .list-group:hover {
    background-color: rgba(0, 0, 0, 0.07); }

@media screen and (max-width: 1500px) {
  .comment-top-row .avatar {
    width: 38px;
    height: 38px;
    margin-top: 0; } }
@media screen and (max-width: 1000px) {
  .comment-top-row .avatar {
    width: 36px;
    height: 36px; } }
@media screen and (max-width: 700px) {
  #comments {
    border-radius: 0;
    margin: 0;
    width: 100%;
    border-right: none; }

  .comments-title {
    padding: 0 14px; }

  .user-info .username {
    font-size: 2em; }

  .comment {
    padding-left: 14px; }

  #respond {
    border-radius: 0; }

  .respond-to-specific-comment::before {
    left: 0; }

  .danger-zone {
    border-radius: 0;
    max-width: 700px;
    padding-left: 0;
    padding-right: 0;
    border-left: 0;
    border-right: 0; }

  .form-yin input {
    min-width: 50px;
    max-width: 170px; }
  .form-yin label.fixed-width {
    width: 85px; }

  .list-group {
    border-radius: 0;
    border-left: none;
    border-right: none;
    border-bottom: none; } }

/*# sourceMappingURL=higgscom.css.map */