/* @media screen and (min-width: 55em) */
.site-header__white_box {
    width: 30em;
}

.from-sciety a.site-header__logo_link {
    pointer-events: none;
}

.site-header__logo_link__labs {
    font-size: 1.5em;
    font-weight: bold;
    display: inline-block;
    position: relative;
    top: -0.3em;
}

.list-card__avatar {
    border-radius: 6px;
    border: 3px rgb(207, 216, 220) solid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    margin-left: 0.5rem;
    float: right;
}

.page-header--list {
    display: flex;
}

.list-card__list-image, .user-list-card__list-image {
    border-radius: 6px;
    border: 3px rgb(207, 216, 220) solid;
    width: 52px;
    height: 52px;
    margin-right: 0.5rem;
    float: left;
}

.page-header__list-image {
    float: left;
    border-radius: 6px;
    border: 3px rgb(207, 216, 220) solid;
    width: 128px;
    height: 128px;
    margin-right: 1rem;
}

.page-header__links ul {
    list-style: none;
    padding-left: 0;
}

.page-header__links li {
    display: inline;
}

.page-header__links ul > :nth-child(n+2)::before {
    content: "•";
    margin-right: 0.25rem;
}

.article-author-list li:after {
    content: ',\00a0';
}

.article-card footer a {
    position: relative;
}

.page-header__description ol {
    display: inline;
}


/* copied from logged-out-call-to-action */
.article-recommendations-button {
  font-family: Ubuntu, sans-serif;
  font-size: 1rem;
  font-weight: bold;
  line-height: 1;
  border-radius: 6px;
  border: 1px solid rgb(206, 72, 26);
  padding: 0.5rem 0.6875rem;
  display: inline-block;
  border-color: rgb(49, 73, 82);
}
.article-recommendations-button:link, .article-recommendations-button:visited {
  background-color: rgb(206, 72, 26);
  color: rgb(255, 255, 255);
}
.article-recommendations-button:link:active, .article-recommendations-button:link:hover, .article-recommendations-button:visited:active, .article-recommendations-button:visited:hover {
  border-color: rgb(155, 54, 19);
  color: rgb(255, 255, 255);
  text-decoration: none;
}
.article-recommendations-button:link:active, .article-recommendations-button:visited:active {
  background-color: rgb(206, 72, 26);
}
.article-recommendations-button:link:hover, .article-recommendations-button:visited:hover {
  background-color: rgb(155, 54, 19);
}
.article-recommendations-button:link:focus, .article-recommendations-button:visited:focus {
  text-decoration: none;
}
.article-recommendations-button:link:focus-visible {
  outline-style: none;
  box-shadow: 0 0 0 3px rgb(245, 218, 209);
}
.article-recommendations-button:link:focus {
  outline-style: none;
  box-shadow: 0 0 0 3px rgb(245, 218, 209);
}
.article-recommendations-button:link:focus:not(:focus-visible) {
  box-shadow: none;
}
.article-recommendations-button:link, .article-recommendations-button:visited {
  background-color: rgb(49, 73, 82);
  color: rgb(255, 255, 255);
}
.article-recommendations-button:link:active, .article-recommendations-button:link:hover, .article-recommendations-button:visited:active, .article-recommendations-button:visited:hover {
  border-color: rgb(49, 73, 82);
  background-color: rgb(33, 33, 33);
  color: rgb(255, 255, 255);
  text-decoration: none;
}

/* copied from .primary-action-button */
.primary-action-button {
  font-family: Ubuntu, sans-serif;
  font-size: 1rem;
  font-weight: bold;
  line-height: 1;
  border-radius: 6px;
  border: 1px solid rgb(206, 72, 26);
  padding: 0.5rem 0.6875rem;
  display: inline-block;
  margin-bottom: 1rem;
}
.primary-action-button:link, .primary-action-button:visited {
  background-color: rgb(206, 72, 26);
  color: rgb(255, 255, 255);
}
.primary-action-button:link:active, .primary-action-button:link:hover, .primary-action-button:visited:active, .primary-action-button:visited:hover {
  border-color: rgb(155, 54, 19);
  color: rgb(255, 255, 255);
  text-decoration: none;
}
.primary-action-button:link:active, .primary-action-button:visited:active {
  background-color: rgb(206, 72, 26);
}
.primary-action-button:link:hover, .primary-action-button:visited:hover {
  background-color: rgb(155, 54, 19);
}
.primary-action-button:link:focus, .primary-action-button:visited:focus {
  text-decoration: none;
}
.primary-action-button:link:focus-visible {
  outline-style: none;
  box-shadow: 0 0 0 3px rgb(245, 218, 209);
}
.primary-action-button:link:focus {
  outline-style: none;
  box-shadow: 0 0 0 3px rgb(245, 218, 209);
}
.primary-action-button:link:focus:not(:focus-visible) {
  box-shadow: none;
}

/* copied from logged-out-call-to-action */
.secondary-action-button {
  font-family: Ubuntu, sans-serif;
  font-size: 1rem;
  font-weight: bold;
  line-height: 1;
  border-radius: 6px;
  border: 1px solid rgb(206, 72, 26);
  padding: 0.5rem 0.6875rem;
  display: inline-block;
  border-color: rgb(49, 73, 82);
  background-color: rgb(49, 73, 82);
  color: rgb(255, 255, 255);
}
.secondary-action-button:link, .secondary-action-button:visited {
  background-color: rgb(206, 72, 26);
  color: rgb(255, 255, 255);
}
.secondary-action-button:link:active, .secondary-action-button:link:hover, .secondary-action-button:visited:active, .secondary-action-button:visited:hover {
  border-color: rgb(155, 54, 19);
  color: rgb(255, 255, 255);
  text-decoration: none;
}
.secondary-action-button:link:active, .secondary-action-button:visited:active {
  background-color: rgb(206, 72, 26);
}
.secondary-action-button:link:hover, .secondary-action-button:visited:hover {
  background-color: rgb(155, 54, 19);
}
.secondary-action-button:link:focus, .secondary-action-button:visited:focus {
  text-decoration: none;
}
.secondary-action-button:link:focus-visible {
  outline-style: none;
  box-shadow: 0 0 0 3px rgb(245, 218, 209);
}
.secondary-action-button:link:focus {
  outline-style: none;
  box-shadow: 0 0 0 3px rgb(245, 218, 209);
}
.secondary-action-button:link:focus:not(:focus-visible) {
  box-shadow: none;
}
.secondary-action-button:link, .secondary-action-button:visited {
  background-color: rgb(49, 73, 82);
  color: rgb(255, 255, 255);
}
.secondary-action-button:link:active, .secondary-action-button:link:hover, .secondary-action-button:visited:active, .secondary-action-button:visited:hover {
  border-color: rgb(49, 73, 82);
  background-color: rgb(33, 33, 33);
  color: rgb(255, 255, 255);
  text-decoration: none;
}


.article-actions__external-links {
    margin-top: 1em;
}

.article__striking_image {
    float: right;
    border-radius: 6px;
    border: 3px rgb(207, 216, 220) solid;
    width: 128px;
    height: 128px;
    margin-left: 0.5rem;
}

.article-card__striking_image {
    float: right;
    border-radius: 6px;
    border: 3px rgb(207, 216, 220) solid;
    width: 64px;
    height: 64px;
    margin-left: 0.5rem;
}

.search-form__section {
    margin-bottom: 1em;
}

.search-form__submit {
    display: inline-block;
}

.search-form__text {
    padding-right: 0.75em;
}

.search-browse-categories-link-container {
    float: right;
}

.error-message {
    font-weight: bold;
    font-size: 1.2em;
    color: #c44;
}

.technical-error-message {
    display: none;
}

section.article-stats {
    margin-top: 0.5em;
}

/* htmx-request */
.htmx-request {
  position: absolute;
  visibility: hidden;
}

.htmx-request:before {
  content: 'Thinking...';
  visibility: visible;
  animation: loading-text-animation 2s, blink .5s step-end infinite alternate;
  padding-right: 1px;
  border-right: 1px solid rgb(36, 42, 51);
}

@keyframes loading-text-animation {
  0% { content: "T"; }
  10% { content: "Th"; }
  20% { content: "Thi"; }
  30% { content: "Thin"; }
  40% { content: "Think"; }
  50% { content: "Thinki"; }
  60% { content: "Thinkin"; }
  70% { content: "Thinking"; }
  80% { content: "Thinking."; }
  90% { content: "Thinking.."; }
  100% { content: "Thinking..."; }
}

@keyframes blink {
  0%, 100% {}
  50% { border-color: transparent; }
}