@charset "UTF-8";
/* ==UserStyle==
@name Witches Town
@namespace lavender software, akira division
@version ???
==/UserStyle== */
/*https://github.com/wryk/witches-town-theme
!!!compiled version from sass code to css!!!
made by Alda for the late witches.town instance. also featured in eldritch.cafe'*/
@font-face {
font-family: "mastodon-font-sans-serif";
src: local("Roboto Italic"), url("../fonts/roboto/roboto-italic-webfont.woff2") format("woff2"), url("../fonts/roboto/roboto-italic-webfont.woff") format("woff"), url("../fonts/roboto/roboto-italic-webfont.ttf") format("truetype"), url("../fonts/roboto/roboto-italic-webfont.svg#roboto-italic-webfont") format("svg");
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: "mastodon-font-sans-serif";
src: local("Roboto Bold"), url("../fonts/roboto/roboto-bold-webfont.woff2") format("woff2"), url("../fonts/roboto/roboto-bold-webfont.woff") format("woff"), url("../fonts/roboto/roboto-bold-webfont.ttf") format("truetype"), url("../fonts/roboto/roboto-bold-webfont.svg#roboto-bold-webfont") format("svg");
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: "mastodon-font-sans-serif";
src: local("Roboto Medium"), url("../fonts/roboto/roboto-medium-webfont.woff2") format("woff2"), url("../fonts/roboto/roboto-medium-webfont.woff") format("woff"), url("../fonts/roboto/roboto-medium-webfont.ttf") format("truetype"), url("../fonts/roboto/roboto-medium-webfont.svg#roboto-medium-webfont") format("svg");
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: "mastodon-font-sans-serif";
src: local("Roboto"), url("../fonts/roboto/roboto-regular-webfont.woff2") format("woff2"), url("../fonts/roboto/roboto-regular-webfont.woff") format("woff"), url("../fonts/roboto/roboto-regular-webfont.ttf") format("truetype"), url("../fonts/roboto/roboto-regular-webfont.svg#roboto-regular-webfont") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "mastodon-font-monospace";
src: local("Roboto Mono"), url("../fonts/roboto-mono/robotomono-regular-webfont.woff2") format("woff2"), url("../fonts/roboto-mono/robotomono-regular-webfont.woff") format("woff"), url("../fonts/roboto-mono/robotomono-regular-webfont.ttf") format("truetype"), url("../fonts/roboto-mono/robotomono-regular-webfont.svg#roboto_monoregular") format("svg");
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: "mastodon-font-display";
src: local("Montserrat"), url("../fonts/montserrat/Montserrat-Regular.woff2") format("woff2"), url("../fonts/montserrat/Montserrat-Regular.woff") format("woff"), url("../fonts/montserrat/Montserrat-Regular.ttf") format("truetype");
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: "mastodon-font-display";
src: local("Montserrat Medium"), url("../fonts/montserrat/Montserrat-Medium.ttf") format("truetype");
font-weight: 500;
font-style: normal;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: "";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
html {
scrollbar-color: #423a50 rgba(0, 0, 0, 0.1);
}
::-webkit-scrollbar {
width: 12px;
height: 12px;
}
::-webkit-scrollbar-thumb {
background: #423a50;
border: 0px none #fff;
border-radius: 50px;
}
::-webkit-scrollbar-thumb:hover {
background: #473e56;
}
::-webkit-scrollbar-thumb:active {
background: #423a50;
}
::-webkit-scrollbar-track {
border: 0px none #fff;
border-radius: 0;
background: rgba(0, 0, 0, 0.1);
}
::-webkit-scrollbar-track:hover {
background: #383144;
}
::-webkit-scrollbar-track:active {
background: #383144;
}
::-webkit-scrollbar-corner {
background: transparent;
}
body {
font-family: "mastodon-font-sans-serif", sans-serif;
background: #27222f;
font-size: 13px;
line-height: 18px;
font-weight: 400;
color: #fff;
text-rendering: optimizelegibility;
font-feature-settings: "kern";
text-size-adjust: none;
-webkit-tap-highlight-color: transparent;
-webkit-tap-highlight-color: transparent;
}
body.system-font {
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "mastodon-font-sans-serif", sans-serif;
}
body.app-body {
padding: 0;
}
body.app-body.layout-single-column {
height: auto;
min-height: 100vh;
overflow-y: scroll;
}
body.app-body.layout-multiple-columns {
position: absolute;
width: 100%;
height: 100%;
}
body.app-body.with-modals--active {
overflow-y: hidden;
}
body.lighter {
background: #383144;
}
body.with-modals {
overflow-x: hidden;
overflow-y: scroll;
}
body.with-modals--active {
overflow-y: hidden;
}
body.player {
padding: 0;
margin: 0;
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;
}
body.player > div {
height: 100%;
}
body.player .video-player video {
width: 100%;
height: 100%;
max-height: 100vh;
}
body.player .media-gallery {
margin-top: 0;
height: 100% !important;
border-radius: 0;
}
body.player .media-gallery__item {
border-radius: 0;
}
body.embed {
background: #423a50;
margin: 0;
padding-bottom: 0;
}
body.embed .container {
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;
}
body.admin {
background: #2e2838;
padding: 0;
}
body.error {
position: absolute;
text-align: center;
color: #e6e6fa;
background: #383144;
width: 100%;
height: 100%;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
}
body.error .dialog {
vertical-align: middle;
margin: 20px;
}
body.error .dialog__illustration img {
display: block;
max-width: 470px;
width: 100%;
height: auto;
margin-top: -120px;
}
body.error .dialog h1 {
font-size: 20px;
line-height: 28px;
font-weight: 400;
}
button {
font-family: inherit;
cursor: pointer;
}
button:focus {
outline: none;
}
.app-holder,
.app-holder > div,
.app-holder > noscript {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
outline: 0 !important;
}
.app-holder > noscript {
height: 100vh;
}
.layout-single-column .app-holder,
.layout-single-column .app-holder > div {
min-height: 100vh;
}
.layout-multiple-columns .app-holder,
.layout-multiple-columns .app-holder > div {
height: 100%;
}
.error-boundary,
.app-holder noscript {
flex-direction: column;
font-size: 16px;
font-weight: 400;
line-height: 1.7;
color: #e25169;
text-align: center;
}
.error-boundary > div,
.app-holder noscript > div {
max-width: 500px;
}
.error-boundary p,
.app-holder noscript p {
margin-bottom: .85em;
}
.error-boundary p:last-child,
.app-holder noscript p:last-child {
margin-bottom: 0;
}
.error-boundary a,
.app-holder noscript a {
color: #a288bd;
}
.error-boundary a:hover,
.error-boundary a:focus,
.error-boundary a:active,
.app-holder noscript a:hover,
.app-holder noscript a:focus,
.app-holder noscript a:active {
text-decoration: none;
}
.error-boundary__footer,
.app-holder noscript__footer {
color: #d5bdd6;
font-size: 13px;
}
.error-boundary__footer a,
.app-holder noscript__footer a {
color: #d5bdd6;
}
.error-boundary button,
.app-holder noscript button {
display: inline;
border: 0;
background: transparent;
color: #d5bdd6;
font: inherit;
padding: 0;
margin: 0;
line-height: inherit;
cursor: pointer;
outline: 0;
transition: color 300ms linear;
text-decoration: underline;
}
.error-boundary button:hover,
.error-boundary button:focus,
.error-boundary button:active,
.app-holder noscript button:hover,
.app-holder noscript button:focus,
.app-holder noscript button:active {
text-decoration: none;
}
.error-boundary button.copied,
.app-holder noscript button.copied {
color: #79bd9a;
transition: none;
}
.logo-resources {
display: none;
}
body .__ns__pop2top,
div .__ns__pop2top,
article .__ns__pop2top {
z-index: unset !important;
}
.container-alt {
width: 700px;
margin: 0 auto;
margin-top: 40px;
}
@media screen and (max-width: 740px) {
.container-alt {
width: 100%;
margin: 0;
}
}
.logo-container {
margin: 100px auto 50px;
}
@media screen and (max-width: 500px) {
.logo-container {
margin: 40px auto 0;
}
}
.logo-container h1 {
display: flex;
justify-content: center;
align-items: center;
}
.logo-container h1 svg {
fill: #fff;
height: 42px;
margin-right: 10px;
}
.logo-container h1 a {
display: flex;
justify-content: center;
align-items: center;
color: #fff;
text-decoration: none;
outline: 0;
padding: 12px 16px;
line-height: 32px;
font-family: "mastodon-font-display", sans-serif;
font-weight: 500;
font-size: 14px;
}
.compose-standalone .compose-form {
width: 400px;
margin: 0 auto;
padding: 20px 0;
margin-top: 40px;
box-sizing: border-box;
}
@media screen and (max-width: 400px) {
.compose-standalone .compose-form {
width: 100%;
margin-top: 0;
padding: 20px;
}
}
.account-header {
width: 400px;
margin: 0 auto;
display: flex;
font-size: 13px;
line-height: 18px;
box-sizing: border-box;
padding: 20px 0;
padding-bottom: 0;
margin-bottom: -30px;
margin-top: 40px;
}
@media screen and (max-width: 440px) {
.account-header {
width: 100%;
margin: 0;
margin-bottom: 10px;
padding: 20px;
padding-bottom: 0;
}
}
.account-header .avatar {
width: 40px;
height: 40px;
margin-right: 8px;
}
.account-header .avatar img {
width: 100%;
height: 100%;
display: block;
margin: 0;
border-radius: 4px;
}
.account-header .name {
flex: 1 1 auto;
color: #dbd3ff;
width: calc(100% - 88px);
}
.account-header .name .username {
display: block;
font-weight: 500;
text-overflow: ellipsis;
overflow: hidden;
}
.account-header .logout-link {
display: block;
font-size: 32px;
line-height: 40px;
margin-left: 8px;
}
.grid-3 {
display: grid;
grid-gap: 10px;
grid-template-columns: 3fr 1fr;
grid-auto-columns: 25%;
grid-auto-rows: max-content;
}
.grid-3 .column-0 {
grid-column: 1/3;
grid-row: 1;
}
.grid-3 .column-1 {
grid-column: 1;
grid-row: 2;
}
.grid-3 .column-2 {
grid-column: 2;
grid-row: 2;
}
.grid-3 .column-3 {
grid-column: 1/3;
grid-row: 3;
}
@media screen and (max-width: 415px) {
.grid-3 {
grid-gap: 0;
grid-template-columns: minmax(0, 100%);
}
.grid-3 .column-0 {
grid-column: 1;
}
.grid-3 .column-1 {
grid-column: 1;
grid-row: 3;
}
.grid-3 .column-2 {
grid-column: 1;
grid-row: 2;
}
.grid-3 .column-3 {
grid-column: 1;
grid-row: 4;
}
}
.grid-4 {
display: grid;
grid-gap: 10px;
grid-template-columns: repeat(4, minmax(0, 1fr));
grid-auto-columns: 25%;
grid-auto-rows: max-content;
}
.grid-4 .column-0 {
grid-column: 1/5;
grid-row: 1;
}
.grid-4 .column-1 {
grid-column: 1/4;
grid-row: 2;
}
.grid-4 .column-2 {
grid-column: 4;
grid-row: 2;
}
.grid-4 .column-3 {
grid-column: 2/5;
grid-row: 3;
}
.grid-4 .column-4 {
grid-column: 1;
grid-row: 3;
}
.grid-4 .landing-page__call-to-action {
min-height: 100%;
}
.grid-4 .flash-message {
margin-bottom: 10px;
}
@media screen and (max-width: 738px) {
.grid-4 {
grid-template-columns: minmax(0, 50%) minmax(0, 50%);
}
.grid-4 .landing-page__call-to-action {
padding: 20px;
display: flex;
align-items: center;
justify-content: center;
}
.grid-4 .row__information-board {
width: 100%;
justify-content: center;
align-items: center;
}
.grid-4 .row__mascot {
display: none;
}
}
@media screen and (max-width: 415px) {
.grid-4 {
grid-gap: 0;
grid-template-columns: minmax(0, 100%);
}
.grid-4 .column-0 {
grid-column: 1;
}
.grid-4 .column-1 {
grid-column: 1;
grid-row: 3;
}
.grid-4 .column-2 {
grid-column: 1;
grid-row: 2;
}
.grid-4 .column-3 {
grid-column: 1;
grid-row: 5;
}
.grid-4 .column-4 {
grid-column: 1;
grid-row: 4;
}
}
@media screen and (max-width: 415px) {
.public-layout {
padding-top: 48px;
}
}
.public-layout .container {
max-width: 960px;
}
@media screen and (max-width: 415px) {
.public-layout .container {
padding: 0;
}
}
.public-layout .header {
background: #4c425c;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
border-radius: 4px;
height: 48px;
margin: 10px 0;
display: flex;
align-items: stretch;
justify-content: center;
flex-wrap: nowrap;
overflow: hidden;
}
@media screen and (max-width: 415px) {
.public-layout .header {
position: fixed;
width: 100%;
top: 0;
left: 0;
margin: 0;
border-radius: 0;
box-shadow: none;
z-index: 110;
}
}
.public-layout .header > div {
flex: 1 1 33.3%;
min-height: 1px;
}
.public-layout .header .nav-left {
display: flex;
align-items: stretch;
justify-content: flex-start;
flex-wrap: nowrap;
}
.public-layout .header .nav-center {
display: flex;
align-items: stretch;
justify-content: center;
flex-wrap: nowrap;
}
.public-layout .header .nav-right {
display: flex;
align-items: stretch;
justify-content: flex-end;
flex-wrap: nowrap;
}
.public-layout .header .brand {
display: block;
padding: 15px;
}
.public-layout .header .brand svg {
display: block;
height: 18px;
width: auto;
position: relative;
bottom: -2px;
fill: #fff;
}
@media screen and (max-width: 415px) {
.public-layout .header .brand svg {
height: 20px;
}
}
.public-layout .header .brand:hover,
.public-layout .header .brand:focus,
.public-layout .header .brand:active {
background: #554b68;
}
.public-layout .header .nav-link {
display: flex;
align-items: center;
padding: 0 1rem;
font-size: 12px;
font-weight: 500;
text-decoration: none;
color: #e6e6fa;
white-space: nowrap;
text-align: center;
}
.public-layout .header .nav-link:hover,
.public-layout .header .nav-link:focus,
.public-layout .header .nav-link:active {
text-decoration: underline;
color: #fff;
}
@media screen and (max-width: 550px) {
.public-layout .header .nav-link.optional {
display: none;
}
}
.public-layout .header .nav-button {
background: #5f5373;
margin: 8px;
margin-left: 0;
border-radius: 4px;
}
.public-layout .header .nav-button:hover,
.public-layout .header .nav-button:focus,
.public-layout .header .nav-button:active {
text-decoration: none;
background: #695c7f;
}
.public-layout .grid {
display: grid;
grid-gap: 10px;
grid-template-columns: minmax(300px, 3fr) minmax(298px, 1fr);
grid-auto-columns: 25%;
grid-auto-rows: max-content;
}
.public-layout .grid .column-0 {
grid-row: 1;
grid-column: 1;
}
.public-layout .grid .column-1 {
grid-row: 1;
grid-column: 2;
}
@media screen and (max-width: 600px) {
.public-layout .grid {
grid-template-columns: 100%;
grid-gap: 0;
}
.public-layout .grid .column-1 {
display: none;
}
}
.public-layout .directory__card {
border-radius: 4px;
}
@media screen and (max-width: 415px) {
.public-layout .directory__card {
border-radius: 0;
}
}
@media screen and (max-width: 415px) {
.public-layout .page-header {
border-bottom: 0;
}
}
.public-layout .public-account-header {
overflow: hidden;
margin-bottom: 10px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}
.public-layout .public-account-header.inactive {
opacity: .5;
}
.public-layout .public-account-header.inactive .public-account-header__image,
.public-layout .public-account-header.inactive .avatar {
filter: grayscale(100%);
}
.public-layout .public-account-header.inactive .logo-button {
background-color: #dbd3ff;
}
.public-layout .public-account-header .logo-button {
padding: 3px 15px;
}
.public-layout .public-account-header__image {
border-radius: 4px 4px 0 0;
overflow: hidden;
height: 300px;
position: relative;
background: #1b1720;
}
.public-layout .public-account-header__image::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 100%;
box-shadow: inset 0 -1px 1px 1px rgba(0, 0, 0, 0.15);
top: 0;
left: 0;
}
.public-layout .public-account-header__image img {
object-fit: cover;
display: block;
width: 100%;
height: 100%;
margin: 0;
border-radius: 4px 4px 0 0;
}
@media screen and (max-width: 600px) {
.public-layout .public-account-header__image {
height: 200px;
}
}
.public-layout .public-account-header--no-bar {
margin-bottom: 0;
}
.public-layout .public-account-header--no-bar .public-account-header__image,
.public-layout .public-account-header--no-bar .public-account-header__image img {
border-radius: 4px;
}
@media screen and (max-width: 415px) {
.public-layout .public-account-header--no-bar .public-account-header__image,
.public-layout .public-account-header--no-bar .public-account-header__image img {
border-radius: 0;
}
}
@media screen and (max-width: 415px) {
.public-layout .public-account-header {
margin-bottom: 0;
box-shadow: none;
}
.public-layout .public-account-header__image::after {
display: none;
}
.public-layout .public-account-header__image,
.public-layout .public-account-header__image img {
border-radius: 0;
}
}
.public-layout .public-account-header__bar {
position: relative;
margin-top: -80px;
display: flex;
justify-content: flex-start;
}
.public-layout .public-account-header__bar::before {
content: "";
display: block;
background: #423a50;
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 60px;
border-radius: 0 0 4px 4px;
z-index: -1;
}
.public-layout .public-account-header__bar .avatar {
display: block;
width: 120px;
height: 120px;
padding-left: 16px;
flex: 0 0 auto;
}
.public-layout .public-account-header__bar .avatar img {
display: block;
width: 100%;
height: 100%;
margin: 0;
border-radius: 50%;
border: 4px solid #423a50;
background: #24202c;
}
@media screen and (max-width: 600px) {
.public-layout .public-account-header__bar {
margin-top: 0;
background: #423a50;
border-radius: 0 0 4px 4px;
padding: 5px;
}
.public-layout .public-account-header__bar::before {
display: none;
}
.public-layout .public-account-header__bar .avatar {
width: 48px;
height: 48px;
padding: 7px 0;
padding-left: 10px;
}
.public-layout .public-account-header__bar .avatar img {
border: 0;
border-radius: 4px;
}
}
@media screen and (max-width: 600px) and (max-width: 360px) {
.public-layout .public-account-header__bar .avatar {
display: none;
}
}
@media screen and (max-width: 415px) {
.public-layout .public-account-header__bar {
border-radius: 0;
}
}
@media screen and (max-width: 600px) {
.public-layout .public-account-header__bar {
flex-wrap: wrap;
}
}
.public-layout .public-account-header__tabs {
flex: 1 1 auto;
margin-left: 20px;
}
.public-layout .public-account-header__tabs__name {
padding-top: 20px;
padding-bottom: 8px;
}
.public-layout .public-account-header__tabs__name h1 {
font-size: 20px;
line-height: 27px;
color: #fff;
font-weight: 500;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-shadow: 1px 1px 1px #000;
}
.public-layout .public-account-header__tabs__name h1 small {
display: block;
font-size: 14px;
color: #fff;
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
}
@media screen and (max-width: 600px) {
.public-layout .public-account-header__tabs {
margin-left: 15px;
display: flex;
justify-content: space-between;
align-items: center;
}
.public-layout .public-account-header__tabs__name {
padding-top: 0;
padding-bottom: 0;
}
.public-layout .public-account-header__tabs__name h1 {
font-size: 16px;
line-height: 24px;
text-shadow: none;
}
.public-layout .public-account-header__tabs__name h1 small {
color: #e6e6fa;
}
}
.public-layout .public-account-header__tabs__tabs {
display: flex;
justify-content: flex-start;
align-items: stretch;
height: 58px;
}
.public-layout .public-account-header__tabs__tabs .details-counters {
display: flex;
flex-direction: row;
min-width: 300px;
}
@media screen and (max-width: 600px) {
.public-layout .public-account-header__tabs__tabs .details-counters {
display: none;
}
}
.public-layout .public-account-header__tabs__tabs .counter {
min-width: 33.3%;
box-sizing: border-box;
flex: 0 0 auto;
color: #e6e6fa;
padding: 10px;
border-right: 1px solid #423a50;
cursor: default;
text-align: center;
position: relative;
}
.public-layout .public-account-header__tabs__tabs .counter a {
display: block;
}
.public-layout .public-account-header__tabs__tabs .counter:last-child {
border-right: 0;
}
.public-layout .public-account-header__tabs__tabs .counter::after {
display: block;
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
border-bottom: 4px solid #e6e6fa;
opacity: .5;
transition: all 400ms ease;
}
.public-layout .public-account-header__tabs__tabs .counter.active::after {
border-bottom: 4px solid #a288bd;
opacity: 1;
}
.public-layout .public-account-header__tabs__tabs .counter.active.inactive::after {
border-bottom-color: #dbd3ff;
}
.public-layout .public-account-header__tabs__tabs .counter:hover::after {
opacity: 1;
transition-duration: 100ms;
}
.public-layout .public-account-header__tabs__tabs .counter a {
text-decoration: none;
color: inherit;
}
.public-layout .public-account-header__tabs__tabs .counter .counter-label {
font-size: 12px;
display: block;
}
.public-layout .public-account-header__tabs__tabs .counter .counter-number {
font-weight: 500;
font-size: 18px;
margin-bottom: 5px;
color: #fff;
font-family: "mastodon-font-display", sans-serif;
}
.public-layout .public-account-header__tabs__tabs .spacer {
flex: 1 1 auto;
height: 1px;
}
.public-layout .public-account-header__tabs__tabs__buttons {
padding: 7px 8px;
}
.public-layout .public-account-header__extra {
display: none;
margin-top: 4px;
}
.public-layout .public-account-header__extra .public-account-bio {
border-radius: 0;
box-shadow: none;
background: transparent;
margin: 0 -5px;
}
.public-layout .public-account-header__extra .public-account-bio .account__header__fields {
border-top: 1px solid #554b68;
}
.public-layout .public-account-header__extra .public-account-bio .roles {
display: none;
}
.public-layout .public-account-header__extra__links {
margin-top: -15px;
font-size: 14px;
color: #e6e6fa;
}
.public-layout .public-account-header__extra__links a {
display: inline-block;
color: #e6e6fa;
text-decoration: none;
padding: 15px;
font-weight: 500;
}
.public-layout .public-account-header__extra__links a strong {
font-weight: 700;
color: #fff;
}
@media screen and (max-width: 600px) {
.public-layout .public-account-header__extra {
display: block;
flex: 100%;
}
}
.public-layout .account__section-headline {
border-radius: 4px 4px 0 0;
}
@media screen and (max-width: 415px) {
.public-layout .account__section-headline {
border-radius: 0;
}
}
.public-layout .detailed-status__meta {
margin-top: 25px;
}
.public-layout .public-account-bio {
background: #4c425c;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
border-radius: 4px;
overflow: hidden;
margin-bottom: 10px;
}
@media screen and (max-width: 415px) {
.public-layout .public-account-bio {
box-shadow: none;
margin-bottom: 0;
border-radius: 0;
}
}
.public-layout .public-account-bio .account__header__fields {
margin: 0;
border-top: 0;
}
.public-layout .public-account-bio .account__header__fields a {
color: #b7a2cc;
}
.public-layout .public-account-bio .account__header__fields dl:first-child .verified {
border-radius: 0 4px 0 0;
}
.public-layout .public-account-bio .account__header__fields .verified a {
color: #79bd9a;
}
.public-layout .public-account-bio .account__header__content {
padding: 20px;
padding-bottom: 0;
color: #fff;
}
.public-layout .public-account-bio__extra,
.public-layout .public-account-bio .roles {
padding: 20px;
font-size: 14px;
color: #e6e6fa;
}
.public-layout .public-account-bio .roles {
padding-bottom: 0;
}
.public-layout .directory__list {
display: grid;
grid-gap: 10px;
grid-template-columns: minmax(0, 50%) minmax(0, 50%);
}
@media screen and (max-width: 415px) {
.public-layout .directory__list {
display: block;
}
}
.public-layout .directory__list .icon-button {
font-size: 18px;
}
.public-layout .directory__card {
margin-bottom: 0;
}
.public-layout .card-grid {
display: flex;
flex-wrap: wrap;
min-width: 100%;
margin: 0 -5px;
}
.public-layout .card-grid > div {
box-sizing: border-box;
flex: 1 0 auto;
width: 300px;
padding: 0 5px;
margin-bottom: 10px;
max-width: 33.333%;
}
@media screen and (max-width: 900px) {
.public-layout .card-grid > div {
max-width: 50%;
}
}
@media screen and (max-width: 600px) {
.public-layout .card-grid > div {
max-width: 100%;
}
}
@media screen and (max-width: 415px) {
.public-layout .card-grid {
margin: 0;
border-top: 1px solid #4c425c;
}
.public-layout .card-grid > div {
width: 100%;
padding: 0;
margin-bottom: 0;
border-bottom: 1px solid #4c425c;
}
.public-layout .card-grid > div:last-child {
border-bottom: 0;
}
.public-layout .card-grid > div .card__bar {
background: #383144;
}
.public-layout .card-grid > div .card__bar:hover,
.public-layout .card-grid > div .card__bar:active,
.public-layout .card-grid > div .card__bar:focus {
background: #423a50;
}
}
.no-list {
list-style: none;
}
.no-list li {
display: inline-block;
margin: 0 5px;
}
.recovery-codes {
list-style: none;
margin: 0 auto;
}
.recovery-codes li {
font-size: 125%;
line-height: 1.5;
letter-spacing: 1px;
}
.public-layout .footer {
text-align: left;
padding-top: 20px;
padding-bottom: 60px;
font-size: 12px;
color: #8d7fa3;
}
@media screen and (max-width: 415px) {
.public-layout .footer {
padding-left: 20px;
padding-right: 20px;
}
}
.public-layout .footer .grid {
display: grid;
grid-gap: 10px;
grid-template-columns: 1fr 1fr 2fr 1fr 1fr;
}
.public-layout .footer .grid .column-0 {
grid-column: 1;
grid-row: 1;
min-width: 0;
}
.public-layout .footer .grid .column-1 {
grid-column: 2;
grid-row: 1;
min-width: 0;
}
.public-layout .footer .grid .column-2 {
grid-column: 3;
grid-row: 1;
min-width: 0;
text-align: center;
}
.public-layout .footer .grid .column-2 h4 a {
color: #8d7fa3;
}
.public-layout .footer .grid .column-3 {
grid-column: 4;
grid-row: 1;
min-width: 0;
}
.public-layout .footer .grid .column-4 {
grid-column: 5;
grid-row: 1;
min-width: 0;
}
@media screen and (max-width: 690px) {
.public-layout .footer .grid {
grid-template-columns: 1fr 2fr 1fr;
}
.public-layout .footer .grid .column-0,
.public-layout .footer .grid .column-1 {
grid-column: 1;
}
.public-layout .footer .grid .column-1 {
grid-row: 2;
}
.public-layout .footer .grid .column-2 {
grid-column: 2;
}
.public-layout .footer .grid .column-3,
.public-layout .footer .grid .column-4 {
grid-column: 3;
}
.public-layout .footer .grid .column-4 {
grid-row: 2;
}
}
@media screen and (max-width: 600px) {
.public-layout .footer .grid .column-1 {
display: block;
}
}
@media screen and (max-width: 415px) {
.public-layout .footer .grid .column-0,
.public-layout .footer .grid .column-1,
.public-layout .footer .grid .column-3,
.public-layout .footer .grid .column-4 {
display: none;
}
}
.public-layout .footer h4 {
text-transform: uppercase;
font-weight: 700;
margin-bottom: 8px;
color: #e6e6fa;
}
.public-layout .footer h4 a {
color: inherit;
text-decoration: none;
}
.public-layout .footer ul a {
text-decoration: none;
color: #8d7fa3;
}
.public-layout .footer ul a:hover,
.public-layout .footer ul a:active,
.public-layout .footer ul a:focus {
text-decoration: underline;
}
.public-layout .footer .brand svg {
display: block;
height: 36px;
width: auto;
margin: 0 auto;
fill: #8d7fa3;
}
.public-layout .footer .brand:hover svg,
.public-layout .footer .brand:focus svg,
.public-layout .footer .brand:active svg {
fill: #978bac;
}
.compact-header h1 {
font-size: 24px;
line-height: 28px;
color: #e6e6fa;
font-weight: 500;
margin-bottom: 20px;
padding: 0 10px;
word-wrap: break-word;
}
@media screen and (max-width: 740px) {
.compact-header h1 {
text-align: center;
padding: 20px 10px 0;
}
}
.compact-header h1 a {
color: inherit;
text-decoration: none;
}
.compact-header h1 small {
font-weight: 400;
color: #dbd3ff;
}
.compact-header h1 img {
display: inline-block;
margin-bottom: -5px;
margin-right: 15px;
width: 36px;
height: 36px;
}
.hero-widget {
margin-bottom: 10px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}
.hero-widget:last-child {
margin-bottom: 0;
}
.hero-widget__img {
width: 100%;
position: relative;
overflow: hidden;
border-radius: 4px 4px 0 0;
background: #000;
}
.hero-widget__img img {
object-fit: cover;
display: block;
width: 100%;
height: 100%;
margin: 0;
border-radius: 4px 4px 0 0;
}
.hero-widget__text {
background: #383144;
padding: 20px;
border-radius: 0 0 4px 4px;
font-size: 15px;
color: #e6e6fa;
line-height: 20px;
word-wrap: break-word;
font-weight: 400;
}
.hero-widget__text .emojione {
width: 20px;
height: 20px;
margin: -3px 0 0;
}
.hero-widget__text p {
margin-bottom: 20px;
}
.hero-widget__text p:last-child {
margin-bottom: 0;
}
.hero-widget__text em {
display: inline;
margin: 0;
padding: 0;
font-weight: 700;
background: transparent;
font-family: inherit;
font-size: inherit;
line-height: inherit;
color: #fff;
}
.hero-widget__text a {
color: #dbd3ff;
text-decoration: none;
}
.hero-widget__text a:hover {
text-decoration: underline;
}
@media screen and (max-width: 415px) {
.hero-widget {
display: none;
}
}
.endorsements-widget {
margin-bottom: 10px;
padding-bottom: 10px;
}
.endorsements-widget h4 {
padding: 10px;
text-transform: uppercase;
font-weight: 700;
font-size: 13px;
color: #e6e6fa;
}
.endorsements-widget .account {
padding: 10px 0;
}
.endorsements-widget .account:last-child {
border-bottom: 0;
}
.endorsements-widget .account .account__display-name {
display: flex;
align-items: center;
}
.endorsements-widget .trends__item {
padding: 10px;
}
.trends-widget h4 {
color: #e6e6fa;
}
.box-widget {
padding: 20px;
border-radius: 4px;
background: #383144;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}
.placeholder-widget {
padding: 16px;
border-radius: 4px;
border: 2px dashed #d5bdd6;
text-align: center;
color: #e6e6fa;
margin-bottom: 10px;
}
.contact-widget {
min-height: 100%;
font-size: 15px;
color: #e6e6fa;
line-height: 20px;
word-wrap: break-word;
font-weight: 400;
padding: 0;
}
.contact-widget h4 {
padding: 10px;
text-transform: uppercase;
font-weight: 700;
font-size: 13px;
color: #e6e6fa;
}
.contact-widget .account {
border-bottom: 0;
padding: 10px 0;
padding-top: 5px;
}
.contact-widget > a {
display: inline-block;
padding: 10px;
padding-top: 0;
color: #e6e6fa;
text-decoration: none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.contact-widget > a:hover,
.contact-widget > a:focus,
.contact-widget > a:active {
text-decoration: underline;
}
.moved-account-widget {
padding: 15px;
padding-bottom: 20px;
border-radius: 4px;
background: #383144;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
color: #dbd3ff;
font-weight: 400;
margin-bottom: 10px;
}
.moved-account-widget strong,
.moved-account-widget a {
font-weight: 500;
}
.moved-account-widget strong:lang(ja),
.moved-account-widget a:lang(ja) {
font-weight: 700;
}
.moved-account-widget strong:lang(ko),
.moved-account-widget a:lang(ko) {
font-weight: 700;
}
.moved-account-widget strong:lang(zh-CN),
.moved-account-widget a:lang(zh-CN) {
font-weight: 700;
}
.moved-account-widget strong:lang(zh-HK),
.moved-account-widget a:lang(zh-HK) {
font-weight: 700;
}
.moved-account-widget strong:lang(zh-TW),
.moved-account-widget a:lang(zh-TW) {
font-weight: 700;
}
.moved-account-widget a {
color: inherit;
text-decoration: underline;
}
.moved-account-widget a.mention {
text-decoration: none;
}
.moved-account-widget a.mention span {
text-decoration: none;
}
.moved-account-widget a.mention:focus,
.moved-account-widget a.mention:hover,
.moved-account-widget a.mention:active {
text-decoration: none;
}
.moved-account-widget a.mention:focus span,
.moved-account-widget a.mention:hover span,
.moved-account-widget a.mention:active span {
text-decoration: underline;
}
.moved-account-widget__message {
margin-bottom: 15px;
}
.moved-account-widget__message .fa {
margin-right: 5px;
color: #e6e6fa;
}
.moved-account-widget__card .detailed-status__display-avatar {
position: relative;
cursor: pointer;
}
.moved-account-widget__card .detailed-status__display-name {
margin-bottom: 0;
text-decoration: none;
}
.moved-account-widget__card .detailed-status__display-name span {
font-weight: 400;
}
.memoriam-widget {
padding: 20px;
border-radius: 4px;
background: #000;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
font-size: 14px;
color: #e6e6fa;
margin-bottom: 10px;
}
.page-header {
background: #4c425c;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
border-radius: 4px;
padding: 60px 15px;
text-align: center;
margin: 10px 0;
}
.page-header h1 {
color: #fff;
font-size: 36px;
line-height: 1.1;
font-weight: 700;
margin-bottom: 10px;
}
.page-header p {
font-size: 15px;
color: #e6e6fa;
}
@media screen and (max-width: 415px) {
.page-header {
margin-top: 0;
background: #423a50;
}
.page-header h1 {
font-size: 24px;
}
}
.directory {
background: #383144;
border-radius: 4px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}
.directory__tag {
box-sizing: border-box;
margin-bottom: 10px;
}
.directory__tag > a,
.directory__tag > div {
display: flex;
align-items: center;
justify-content: space-between;
background: #383144;
border-radius: 4px;
padding: 15px;
text-decoration: none;
color: inherit;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}
.directory__tag > a:hover,
.directory__tag > a:active,
.directory__tag > a:focus {
background: #4c425c;
}
.directory__tag.active > a {
background: #a288bd;
cursor: default;
}
.directory__tag.disabled > div {
opacity: .5;
cursor: default;
}
.directory__tag h4 {
flex: 1 1 auto;
font-size: 18px;
font-weight: 700;
color: #fff;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.directory__tag h4 .fa {
color: #e6e6fa;
}
.directory__tag h4 small {
display: block;
font-weight: 400;
font-size: 15px;
margin-top: 8px;
color: #e6e6fa;
}
.directory__tag.active h4,
.directory__tag.active h4 .fa,
.directory__tag.active h4 small,
.directory__tag.active h4 .trends__item__current {
color: #fff;
}
.directory__tag .avatar-stack {
flex: 0 0 auto;
width: 120px;
}
.directory__tag.active .avatar-stack .account__avatar {
border-color: #a288bd;
}
.directory__tag .trends__item__current {
padding-right: 0;
}
.avatar-stack {
display: flex;
justify-content: flex-end;
}
.avatar-stack .account__avatar {
flex: 0 0 auto;
width: 36px;
height: 36px;
border-radius: 50%;
position: relative;
margin-left: -10px;
background: #24202c;
border: 2px solid #383144;
}
.avatar-stack .account__avatar:nth-child(1) {
z-index: 1;
}
.avatar-stack .account__avatar:nth-child(2) {
z-index: 2;
}
.avatar-stack .account__avatar:nth-child(3) {
z-index: 3;
}
.accounts-table {
width: 100%;
}
.accounts-table .account {
padding: 0;
border: 0;
}
.accounts-table strong {
font-weight: 700;
}
.accounts-table thead th {
text-align: center;
text-transform: uppercase;
color: #e6e6fa;
font-weight: 700;
padding: 10px;
}
.accounts-table thead th:first-child {
text-align: left;
}
.accounts-table tbody td {
padding: 15px 0;
vertical-align: middle;
border-bottom: 1px solid #4c425c;
}
.accounts-table tbody tr:last-child td {
border-bottom: 0;
}
.accounts-table__count {
width: 120px;
text-align: center;
font-size: 15px;
font-weight: 500;
color: #fff;
}
.accounts-table__count small {
display: block;
color: #e6e6fa;
font-weight: 400;
font-size: 14px;
}
.accounts-table__comment {
width: 50%;
vertical-align: initial !important;
}
.accounts-table__interrelationships {
width: 21px;
}
.accounts-table .fa {
font-size: 16px;
}
.accounts-table .fa.active {
color: #a288bd;
}
.accounts-table .fa.passive {
color: #ca8f04;
}
.accounts-table .fa.active.passive {
color: #79bd9a;
}
@media screen and (max-width: 415px) {
.accounts-table tbody td.optional {
display: none;
}
}
@media screen and (max-width: 415px) {
.moved-account-widget,
.memoriam-widget,
.box-widget,
.contact-widget,
.landing-page__information.contact-widget,
.directory,
.page-header {
margin-bottom: 0;
box-shadow: none;
border-radius: 0;
}
}
.statuses-grid {
min-height: 600px;
}
@media screen and (max-width: 640px) {
.statuses-grid {
width: 100% !important;
}
}
.statuses-grid__item {
width: 313.3333333333px;
}
@media screen and (max-width: 1255px) {
.statuses-grid__item {
width: 306.6666666667px;
}
}
@media screen and (max-width: 640px) {
.statuses-grid__item {
width: 100%;
}
}
@media screen and (max-width: 415px) {
.statuses-grid__item {
width: 100vw;
}
}
.statuses-grid .detailed-status {
border-radius: 4px;
}
@media screen and (max-width: 415px) {
.statuses-grid .detailed-status {
border-top: 1px solid #5f5373;
}
}
.statuses-grid .detailed-status.compact .detailed-status__meta {
margin-top: 15px;
}
.statuses-grid .detailed-status.compact .status__content {
font-size: 15px;
line-height: 20px;
}
.statuses-grid .detailed-status.compact .status__content .emojione {
width: 20px;
height: 20px;
margin: -3px 0 0;
}
.statuses-grid .detailed-status.compact .status__content .status__content__spoiler-link {
line-height: 20px;
margin: 0;
}
.statuses-grid .detailed-status.compact .media-gallery,
.statuses-grid .detailed-status.compact .status-card,
.statuses-grid .detailed-status.compact .video-player {
margin-top: 15px;
}
.notice-widget {
margin-bottom: 10px;
color: #e6e6fa;
}
.notice-widget p {
margin-bottom: 10px;
}
.notice-widget p:last-child {
margin-bottom: 0;
}
.notice-widget a {
font-size: 14px;
line-height: 20px;
}
.notice-widget a,
.placeholder-widget a {
text-decoration: none;
font-weight: 500;
color: #a288bd;
}
.notice-widget a:hover,
.notice-widget a:focus,
.notice-widget a:active,
.placeholder-widget a:hover,
.placeholder-widget a:focus,
.placeholder-widget a:active {
text-decoration: underline;
}
.table-of-contents {
background: #2e2838;
min-height: 100%;
font-size: 14px;
border-radius: 4px;
}
.table-of-contents li a {
display: block;
font-weight: 500;
padding: 15px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-decoration: none;
color: #fff;
border-bottom: 1px solid #423a50;
}
.table-of-contents li a:hover,
.table-of-contents li a:focus,
.table-of-contents li a:active {
text-decoration: underline;
}
.table-of-contents li:last-child a {
border-bottom: 0;
}
.table-of-contents li ul {
padding-left: 20px;
border-bottom: 1px solid #423a50;
}
code {
font-family: "mastodon-font-monospace", monospace;
font-weight: 400;
}
.form-container {
max-width: 400px;
padding: 20px;
margin: 0 auto;
}
.simple_form.hidden {
display: none;
}
.simple_form .input {
margin-bottom: 15px;
overflow: hidden;
}
.simple_form .input.hidden {
margin: 0;
}
.simple_form .input.radio_buttons .radio {
margin-bottom: 15px;
}
.simple_form .input.radio_buttons .radio:last-child {
margin-bottom: 0;
}
.simple_form .input.radio_buttons .radio > label {
position: relative;
padding-left: 28px;
}
.simple_form .input.radio_buttons .radio > label input {
position: absolute;
top: -2px;
left: 0;
}
.simple_form .input.boolean {
position: relative;
margin-bottom: 0;
}
.simple_form .input.boolean .label_input > label {
font-family: inherit;
font-size: 14px;
padding-top: 5px;
color: #fff;
display: block;
width: auto;
}
.simple_form .input.boolean .label_input,
.simple_form .input.boolean .hint {
padding-left: 28px;
}
.simple_form .input.boolean .label_input__wrapper {
position: static;
}
.simple_form .input.boolean label.checkbox {
position: absolute;
top: 2px;
left: 0;
}
.simple_form .input.boolean label a {
color: #a288bd;
text-decoration: underline;
}
.simple_form .input.boolean label a:hover,
.simple_form .input.boolean label a:active,
.simple_form .input.boolean label a:focus {
text-decoration: none;
}
.simple_form .input.boolean .recommended {
position: absolute;
margin: 0 4px;
margin-top: -2px;
}
.simple_form .row {
display: flex;
margin: 0 -5px;
}
.simple_form .row .input {
box-sizing: border-box;
flex: 1 1 auto;
width: 50%;
padding: 0 5px;
}
.simple_form .title {
color: #d9e1e8;
font-size: 20px;
line-height: 28px;
font-weight: 400;
margin-bottom: 30px;
}
.simple_form .hint {
color: #e6e6fa;
}
.simple_form .hint a {
color: #a288bd;
}
.simple_form .hint code {
border-radius: 3px;
padding: .2em .4em;
background: #1b1720;
}
.simple_form .hint li {
list-style: disc;
margin-left: 18px;
}
.simple_form ul.hint {
margin-bottom: 15px;
}
.simple_form span.hint {
display: block;
font-size: 12px;
margin-top: 4px;
}
.simple_form p.hint {
margin-bottom: 15px;
color: #e6e6fa;
}
.simple_form p.hint.subtle-hint {
text-align: center;
font-size: 12px;
line-height: 18px;
margin-top: 15px;
margin-bottom: 0;
}
.simple_form .authentication-hint {
margin-bottom: 25px;
}
.simple_form .card {
margin-bottom: 15px;
}
.simple_form strong {
font-weight: 500;
}
.simple_form strong:lang(ja) {
font-weight: 700;
}
.simple_form strong:lang(ko) {
font-weight: 700;
}
.simple_form strong:lang(zh-CN) {
font-weight: 700;
}
.simple_form strong:lang(zh-HK) {
font-weight: 700;
}
.simple_form strong:lang(zh-TW) {
font-weight: 700;
}
.simple_form .input.with_floating_label .label_input {
display: flex;
}
.simple_form .input.with_floating_label .label_input > label {
font-family: inherit;
font-size: 14px;
color: #fff;
font-weight: 500;
min-width: 150px;
flex: 0 0 auto;
}
.simple_form .input.with_floating_label .label_input input,
.simple_form .input.with_floating_label .label_input select {
flex: 1 1 auto;
}
.simple_form .input.with_floating_label.select .hint {
margin-top: 6px;
margin-left: 150px;
}
.simple_form .input.with_label .label_input > label {
font-family: inherit;
font-size: 14px;
color: #fff;
display: block;
margin-bottom: 8px;
word-wrap: break-word;
font-weight: 500;
}
.simple_form .input.with_label .hint {
margin-top: 6px;
}
.simple_form .input.with_label ul {
flex: 390px;
}
.simple_form .input.with_block_label {
max-width: none;
}
.simple_form .input.with_block_label > label {
font-family: inherit;
font-size: 16px;
color: #fff;
display: block;
font-weight: 500;
padding-top: 5px;
}
.simple_form .input.with_block_label .hint {
margin-bottom: 15px;
}
.simple_form .input.with_block_label ul {
columns: 2;
}
.simple_form .input.datetime .label_input select {
display: inline-block;
width: auto;
flex: 0;
}
.simple_form .required abbr {
text-decoration: none;
color: #e87487;
}
.simple_form .fields-group {
margin-bottom: 25px;
}
.simple_form .fields-group .input:last-child {
margin-bottom: 0;
}
.simple_form .fields-row {
display: flex;
margin: 0 -10px;
padding-top: 5px;
margin-bottom: 25px;
}
.simple_form .fields-row .input {
max-width: none;
}
.simple_form .fields-row__column {
box-sizing: border-box;
padding: 0 10px;
flex: 1 1 auto;
min-height: 1px;
}
.simple_form .fields-row__column-6 {
max-width: 50%;
}
.simple_form .fields-row__column .actions {
margin-top: 27px;
}
.simple_form .fields-row .fields-group:last-child,
.simple_form .fields-row .fields-row__column.fields-group {
margin-bottom: 0;
}
@media screen and (max-width: 600px) {
.simple_form .fields-row {
display: block;
margin-bottom: 0;
}
.simple_form .fields-row__column {
max-width: none;
}
.simple_form .fields-row .fields-group:last-child,
.simple_form .fields-row .fields-row__column.fields-group,
.simple_form .fields-row .fields-row__column {
margin-bottom: 25px;
}
}
.simple_form .fields-row .fields-group.invited-by {
margin-bottom: 30px;
}
.simple_form .fields-row .fields-group.invited-by .hint {
text-align: center;
}
.simple_form .input.radio_buttons .radio label {
margin-bottom: 5px;
font-family: inherit;
font-size: 14px;
color: #fff;
display: block;
width: auto;
}
.simple_form .check_boxes .checkbox label {
font-family: inherit;
font-size: 14px;
color: #fff;
display: inline-block;
width: auto;
position: relative;
padding-top: 5px;
padding-left: 25px;
flex: 1 1 auto;
}
.simple_form .check_boxes .checkbox input[type=checkbox] {
position: absolute;
left: 0;
top: 5px;
margin: 0;
}
.simple_form .input.static .label_input__wrapper {
font-size: 16px;
padding: 10px;
border: 1px solid #d5bdd6;
border-radius: 4px;
}
.simple_form input[type=text],
.simple_form input[type=number],
.simple_form input[type=email],
.simple_form input[type=password],
.simple_form input[type=url],
.simple_form textarea {
box-sizing: border-box;
font-size: 16px;
color: #fff;
display: block;
width: 100%;
outline: 0;
font-family: inherit;
resize: vertical;
background: #201c26;
border: 1px solid #16131b;
border-radius: 4px;
padding: 10px;
}
.simple_form input[type=text]::placeholder,
.simple_form input[type=number]::placeholder,
.simple_form input[type=email]::placeholder,
.simple_form input[type=password]::placeholder,
.simple_form input[type=url]::placeholder,
.simple_form textarea::placeholder {
color: #f7f7fd;
}
.simple_form input[type=text]:invalid,
.simple_form input[type=number]:invalid,
.simple_form input[type=email]:invalid,
.simple_form input[type=password]:invalid,
.simple_form input[type=url]:invalid,
.simple_form textarea:invalid {
box-shadow: none;
}
.simple_form input[type=text]:required:valid,
.simple_form input[type=number]:required:valid,
.simple_form input[type=email]:required:valid,
.simple_form input[type=password]:required:valid,
.simple_form input[type=url]:required:valid,
.simple_form textarea:required:valid {
border-color: #79bd9a;
}
.simple_form input[type=text]:hover,
.simple_form input[type=number]:hover,
.simple_form input[type=email]:hover,
.simple_form input[type=password]:hover,
.simple_form input[type=url]:hover,
.simple_form textarea:hover {
border-color: #070609;
}
.simple_form input[type=text]:active,
.simple_form input[type=text]:focus,
.simple_form input[type=number]:active,
.simple_form input[type=number]:focus,
.simple_form input[type=email]:active,
.simple_form input[type=email]:focus,
.simple_form input[type=password]:active,
.simple_form input[type=password]:focus,
.simple_form input[type=url]:active,
.simple_form input[type=url]:focus,
.simple_form textarea:active,
.simple_form textarea:focus {
border-color: #a288bd;
background: #24202c;
}
.simple_form input[type=text]:focus:invalid:not(:placeholder-shown),
.simple_form input[type=text]:required:invalid:not(:placeholder-shown),
.simple_form input[type=number]:focus:invalid:not(:placeholder-shown),
.simple_form input[type=number]:required:invalid:not(:placeholder-shown),
.simple_form input[type=email]:focus:invalid:not(:placeholder-shown),
.simple_form input[type=email]:required:invalid:not(:placeholder-shown),
.simple_form input[type=password]:focus:invalid:not(:placeholder-shown),
.simple_form input[type=password]:required:invalid:not(:placeholder-shown) {
border-color: #e87487;
}
.simple_form .input.field_with_errors label {
color: #e87487;
}
.simple_form .input.field_with_errors input[type=text],
.simple_form .input.field_with_errors input[type=number],
.simple_form .input.field_with_errors input[type=email],
.simple_form .input.field_with_errors input[type=password],
.simple_form .input.field_with_errors textarea,
.simple_form .input.field_with_errors select {
border-color: #e87487;
}
.simple_form .input.field_with_errors .error {
display: block;
font-weight: 500;
color: #e87487;
margin-top: 4px;
}
.simple_form .input.disabled {
opacity: .5;
}
.simple_form .actions {
margin-top: 30px;
display: flex;
}
.simple_form .actions.actions--top {
margin-top: 0;
margin-bottom: 30px;
}
.simple_form button,
.simple_form .button,
.simple_form .block-button {
display: block;
width: 100%;
border: 0;
border-radius: 4px;
background: #a288bd;
color: #fff;
font-size: 18px;
line-height: inherit;
height: auto;
padding: 10px;
text-transform: uppercase;
text-decoration: none;
text-align: center;
box-sizing: border-box;
cursor: pointer;
font-weight: 500;
outline: 0;
margin-bottom: 10px;
margin-right: 10px;
}
.simple_form button:last-child,
.simple_form .button:last-child,
.simple_form .block-button:last-child {
margin-right: 0;
}
.simple_form button:hover,
.simple_form .button:hover,
.simple_form .block-button:hover {
background-color: #af98c6;
}
.simple_form button:active,
.simple_form button:focus,
.simple_form .button:active,
.simple_form .button:focus,
.simple_form .block-button:active,
.simple_form .block-button:focus {
background-color: #9578b4;
}
.simple_form button:disabled:hover,
.simple_form .button:disabled:hover,
.simple_form .block-button:disabled:hover {
background-color: #e6e6fa;
}
.simple_form button.negative,
.simple_form .button.negative,
.simple_form .block-button.negative {
background: #df405a;
}
.simple_form button.negative:hover,
.simple_form .button.negative:hover,
.simple_form .block-button.negative:hover {
background-color: #e3566d;
}
.simple_form button.negative:active,
.simple_form button.negative:focus,
.simple_form .button.negative:active,
.simple_form .button.negative:focus,
.simple_form .block-button.negative:active,
.simple_form .block-button.negative:focus {
background-color: #db2a47;
}
.simple_form select {
appearance: none;
box-sizing: border-box;
font-size: 16px;
color: #fff;
display: block;
width: 100%;
outline: 0;
font-family: inherit;
resize: vertical;
background: #201c26 url("data:image/svg+xml;utf8,") no-repeat right 8px center/auto 16px;
border: 1px solid #16131b;
border-radius: 4px;
padding-left: 10px;
padding-right: 30px;
height: 41px;
}
.simple_form h4 {
margin-bottom: 15px !important;
}
.simple_form .label_input__wrapper {
position: relative;
}
.simple_form .label_input__append {
position: absolute;
right: 3px;
top: 1px;
padding: 10px;
padding-bottom: 9px;
font-size: 16px;
color: #d5bdd6;
font-family: inherit;
pointer-events: none;
cursor: default;
max-width: 140px;
white-space: nowrap;
overflow: hidden;
}
.simple_form .label_input__append::after {
content: "";
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 1px;
width: 5px;
background-image: linear-gradient(to right, rgba(32, 28, 38, 0), #201c26);
}
.simple_form__overlay-area {
position: relative;
}
.simple_form__overlay-area__blurred form {
filter: blur(2px);
}
.simple_form__overlay-area__overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background: rgba(56, 49, 68, 0.65);
border-radius: 4px;
margin-left: -4px;
margin-top: -4px;
padding: 4px;
}
.simple_form__overlay-area__overlay__content {
text-align: center;
}
.simple_form__overlay-area__overlay__content.rich-formatting,
.simple_form__overlay-area__overlay__content.rich-formatting p {
color: #fff;
}
.block-icon {
display: block;
margin: 0 auto;
margin-bottom: 10px;
font-size: 24px;
}
.flash-message {
background: #4c425c;
color: #e6e6fa;
border-radius: 4px;
padding: 15px 10px;
margin-bottom: 30px;
text-align: center;
}
.flash-message.notice {
border: 1px solid rgba(121, 189, 154, 0.5);
background: rgba(121, 189, 154, 0.25);
color: #79bd9a;
}
.flash-message.warning {
border: 1px solid rgba(202, 143, 4, 0.5);
background: rgba(202, 143, 4, 0.25);
color: #ca8f04;
}
.flash-message.alert {
border: 1px solid rgba(223, 64, 90, 0.5);
background: rgba(223, 64, 90, 0.1);
color: #df405a;
}
.flash-message.hidden {
display: none;
}
.flash-message a {
display: inline-block;
color: #e6e6fa;
text-decoration: none;
}
.flash-message a:hover {
color: #fff;
text-decoration: underline;
}
.flash-message.warning a {
font-weight: 700;
color: inherit;
text-decoration: underline;
}
.flash-message.warning a:hover,
.flash-message.warning a:focus,
.flash-message.warning a:active {
text-decoration: none;
color: inherit;
}
.flash-message p {
margin-bottom: 15px;
}
.flash-message .oauth-code {
outline: 0;
box-sizing: border-box;
display: block;
width: 100%;
border: 0;
padding: 10px;
font-family: "mastodon-font-monospace", monospace;
background: #383144;
color: #fff;
font-size: 14px;
margin: 0;
}
.flash-message .oauth-code::-moz-focus-inner {
border: 0;
}
.flash-message .oauth-code::-moz-focus-inner,
.flash-message .oauth-code:focus,
.flash-message .oauth-code:active {
outline: 0 !important;
}
.flash-message .oauth-code:focus {
background: #423a50;
}
.flash-message strong {
font-weight: 500;
}
.flash-message strong:lang(ja) {
font-weight: 700;
}
.flash-message strong:lang(ko) {
font-weight: 700;
}
.flash-message strong:lang(zh-CN) {
font-weight: 700;
}
.flash-message strong:lang(zh-HK) {
font-weight: 700;
}
.flash-message strong:lang(zh-TW) {
font-weight: 700;
}
@media screen and (max-width: 740px) and (min-width: 441px) {
.flash-message {
margin-top: 40px;
}
}
.flash-message.translation-prompt {
text-align: unset;
color: unset;
}
.flash-message.translation-prompt a {
text-decoration: underline;
}
.flash-message-stack {
margin-bottom: 30px;
}
.flash-message-stack .flash-message {
border-radius: 0;
margin-bottom: 0;
border-top-width: 0;
}
.flash-message-stack .flash-message:first-child {
border-radius: 4px 4px 0 0;
border-top-width: 1px;
}
.flash-message-stack .flash-message:last-child {
border-radius: 0 0 4px 4px;
}
.flash-message-stack .flash-message:last-child:first-child {
border-radius: 4px;
}
.form-footer {
margin-top: 30px;
text-align: center;
}
.form-footer a {
color: #e6e6fa;
text-decoration: none;
}
.form-footer a:hover {
text-decoration: underline;
}
.quick-nav {
list-style: none;
margin-bottom: 25px;
font-size: 14px;
}
.quick-nav li {
display: inline-block;
margin-right: 10px;
}
.quick-nav a {
color: #a288bd;
text-transform: uppercase;
text-decoration: none;
font-weight: 700;
}
.quick-nav a:hover,
.quick-nav a:focus,
.quick-nav a:active {
color: #b7a2cc;
}
.oauth-prompt,
.follow-prompt {
margin-bottom: 30px;
color: #e6e6fa;
}
.oauth-prompt h2,
.follow-prompt h2 {
font-size: 16px;
margin-bottom: 30px;
text-align: center;
}
.oauth-prompt strong,
.follow-prompt strong {
color: #dbd3ff;
font-weight: 500;
}
.oauth-prompt strong:lang(ja),
.follow-prompt strong:lang(ja) {
font-weight: 700;
}
.oauth-prompt strong:lang(ko),
.follow-prompt strong:lang(ko) {
font-weight: 700;
}
.oauth-prompt strong:lang(zh-CN),
.follow-prompt strong:lang(zh-CN) {
font-weight: 700;
}
.oauth-prompt strong:lang(zh-HK),
.follow-prompt strong:lang(zh-HK) {
font-weight: 700;
}
.oauth-prompt strong:lang(zh-TW),
.follow-prompt strong:lang(zh-TW) {
font-weight: 700;
}
@media screen and (max-width: 740px) and (min-width: 441px) {
.oauth-prompt,
.follow-prompt {
margin-top: 40px;
}
}
.qr-wrapper {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.qr-code {
flex: 0 0 auto;
background: #fff;
padding: 4px;
margin: 0 10px 20px 0;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
display: inline-block;
}
.qr-code svg {
display: block;
margin: 0;
}
.qr-alternative {
margin-bottom: 20px;
color: #dbd3ff;
flex: 150px;
}
.qr-alternative samp {
display: block;
font-size: 14px;
}
.table-form p {
margin-bottom: 15px;
}
.table-form p strong {
font-weight: 500;
}
.table-form p strong:lang(ja) {
font-weight: 700;
}
.table-form p strong:lang(ko) {
font-weight: 700;
}
.table-form p strong:lang(zh-CN) {
font-weight: 700;
}
.table-form p strong:lang(zh-HK) {
font-weight: 700;
}
.table-form p strong:lang(zh-TW) {
font-weight: 700;
}
.simple_form .warning,
.table-form .warning {
box-sizing: border-box;
background: rgba(223, 64, 90, 0.5);
color: #fff;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
border-radius: 4px;
padding: 10px;
margin-bottom: 15px;
}
.simple_form .warning a,
.table-form .warning a {
color: #fff;
text-decoration: underline;
}
.simple_form .warning a:hover,
.simple_form .warning a:focus,
.simple_form .warning a:active,
.table-form .warning a:hover,
.table-form .warning a:focus,
.table-form .warning a:active {
text-decoration: none;
}
.simple_form .warning strong,
.table-form .warning strong {
font-weight: 600;
display: block;
margin-bottom: 5px;
}
.simple_form .warning strong:lang(ja),
.table-form .warning strong:lang(ja) {
font-weight: 700;
}
.simple_form .warning strong:lang(ko),
.table-form .warning strong:lang(ko) {
font-weight: 700;
}
.simple_form .warning strong:lang(zh-CN),
.table-form .warning strong:lang(zh-CN) {
font-weight: 700;
}
.simple_form .warning strong:lang(zh-HK),
.table-form .warning strong:lang(zh-HK) {
font-weight: 700;
}
.simple_form .warning strong:lang(zh-TW),
.table-form .warning strong:lang(zh-TW) {
font-weight: 700;
}
.simple_form .warning strong .fa,
.table-form .warning strong .fa {
font-weight: 400;
}
.action-pagination {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.action-pagination .actions,
.action-pagination .pagination {
flex: 1 1 auto;
}
.action-pagination .actions {
padding: 30px 0;
padding-right: 20px;
flex: 0 0 auto;
}
.post-follow-actions {
text-align: center;
color: #e6e6fa;
}
.post-follow-actions div {
margin-bottom: 4px;
}
.alternative-login {
margin-top: 20px;
margin-bottom: 20px;
}
.alternative-login h4 {
font-size: 16px;
color: #fff;
text-align: center;
margin-bottom: 20px;
border: 0;
padding: 0;
}
.alternative-login .button {
display: block;
}
.scope-danger {
color: #ff5050;
}
.form_admin_settings_site_short_description textarea,
.form_admin_settings_site_description textarea,
.form_admin_settings_site_extended_description textarea,
.form_admin_settings_site_terms textarea,
.form_admin_settings_custom_css textarea,
.form_admin_settings_closed_registrations_message textarea {
font-family: "mastodon-font-monospace", monospace;
}
.input-copy {
background: #201c26;
border: 1px solid #16131b;
border-radius: 4px;
display: flex;
align-items: center;
padding-right: 4px;
position: relative;
top: 1px;
transition: border-color 300ms linear;
}
.input-copy__wrapper {
flex: 1 1 auto;
}
.input-copy input[type=text] {
background: transparent;
border: 0;
padding: 10px;
font-size: 14px;
font-family: "mastodon-font-monospace", monospace;
}
.input-copy button {
flex: 0 0 auto;
margin: 4px;
text-transform: none;
font-weight: 400;
font-size: 14px;
padding: 7px 18px;
padding-bottom: 6px;
width: auto;
transition: background 300ms linear;
}
.input-copy.copied {
border-color: #79bd9a;
transition: none;
}
.input-copy.copied button {
background: #79bd9a;
transition: none;
}
.connection-prompt {
margin-bottom: 25px;
}
.connection-prompt .fa-link {
background-color: #2e2838;
border-radius: 100%;
font-size: 24px;
padding: 10px;
}
.connection-prompt__column {
align-items: center;
display: flex;
flex: 1;
flex-direction: column;
flex-shrink: 1;
max-width: 50%;
}
.connection-prompt__column-sep {
align-self: center;
flex-grow: 0;
overflow: visible;
position: relative;
z-index: 1;
}
.connection-prompt__column p {
word-break: break-word;
}
.connection-prompt .account__avatar {
margin-bottom: 20px;
}
.connection-prompt__connection {
background-color: #4c425c;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
border-radius: 4px;
padding: 25px 10px;
position: relative;
text-align: center;
}
.connection-prompt__connection::after {
background-color: #2e2838;
content: "";
display: block;
height: 100%;
left: 50%;
position: absolute;
top: 0;
width: 1px;
}
.connection-prompt__row {
align-items: flex-start;
display: flex;
flex-direction: row;
}
.input.user_confirm_password:not(.field_with_errors),
.input.user_website:not(.field_with_errors) {
display: none;
}
.card > a {
display: block;
text-decoration: none;
color: inherit;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 415px) {
.card > a {
box-shadow: none;
}
}
.card > a:hover .card__bar,
.card > a:active .card__bar,
.card > a:focus .card__bar {
background: #4c425c;
}
.card__img {
height: 130px;
position: relative;
background: #1b1720;
border-radius: 4px 4px 0 0;
}
.card__img img {
display: block;
width: 100%;
height: 100%;
margin: 0;
object-fit: cover;
border-radius: 4px 4px 0 0;
}
@media screen and (max-width: 600px) {
.card__img {
height: 200px;
}
}
@media screen and (max-width: 415px) {
.card__img {
display: none;
}
}
.card__bar {
position: relative;
padding: 15px;
display: flex;
justify-content: flex-start;
align-items: center;
background: #423a50;
border-radius: 0 0 4px 4px;
}
@media screen and (max-width: 415px) {
.card__bar {
border-radius: 0;
}
}
.card__bar .avatar {
flex: 0 0 auto;
width: 48px;
height: 48px;
padding-top: 2px;
}
.card__bar .avatar img {
width: 100%;
height: 100%;
display: block;
margin: 0;
border-radius: 4px;
background: #24202c;
object-fit: cover;
}
.card__bar .display-name {
margin-left: 15px;
text-align: left;
}
.card__bar .display-name i[data-hidden] {
display: none;
}
.card__bar .display-name strong {
font-size: 15px;
color: #fff;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
}
.card__bar .display-name span {
display: block;
font-size: 14px;
color: #e6e6fa;
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
}
.pagination {
padding: 30px 0;
text-align: center;
overflow: hidden;
}
.pagination a,
.pagination .current,
.pagination .newer,
.pagination .older,
.pagination .page,
.pagination .gap {
font-size: 14px;
color: #fff;
font-weight: 500;
display: inline-block;
padding: 6px 10px;
text-decoration: none;
}
.pagination .current {
background: #fff;
border-radius: 100px;
color: #383144;
cursor: default;
margin: 0 10px;
}
.pagination .gap {
cursor: default;
}
.pagination .older,
.pagination .newer {
text-transform: uppercase;
color: #dbd3ff;
}
.pagination .older {
float: left;
padding-left: 0;
}
.pagination .older .fa {
display: inline-block;
margin-right: 5px;
}
.pagination .newer {
float: right;
padding-right: 0;
}
.pagination .newer .fa {
display: inline-block;
margin-left: 5px;
}
.pagination .disabled {
cursor: default;
color: #504662;
}
@media screen and (max-width: 700px) {
.pagination {
padding: 30px 20px;
}
.pagination .page {
display: none;
}
.pagination .newer,
.pagination .older {
display: inline-block;
}
}
.nothing-here {
background: #383144;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
color: #e6e6fa;
font-size: 14px;
font-weight: 500;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
cursor: default;
border-radius: 4px;
padding: 20px;
min-height: 30vh;
}
.nothing-here--under-tabs {
border-radius: 0 0 4px 4px;
}
.nothing-here--flexible {
box-sizing: border-box;
min-height: 100%;
}
.account-role,
.simple_form .recommended {
display: inline-block;
padding: 4px 6px;
cursor: default;
border-radius: 3px;
font-size: 12px;
line-height: 12px;
font-weight: 500;
color: #dbd3ff;
background-color: rgba(219, 211, 255, 0.1);
border: 1px solid rgba(219, 211, 255, 0.5);
}
.account-role.moderator,
.simple_form .recommended.moderator {
color: #79bd9a;
background-color: rgba(121, 189, 154, 0.1);
border-color: rgba(121, 189, 154, 0.5);
}
.account-role.admin,
.simple_form .recommended.admin {
color: #e87487;
background-color: rgba(232, 116, 135, 0.1);
border-color: rgba(232, 116, 135, 0.5);
}
.account__header__fields {
max-width: 100vw;
padding: 0;
margin: 15px -15px -15px;
border: 0 none;
border-top: 1px solid #554b68;
border-bottom: 1px solid #554b68;
font-size: 14px;
line-height: 20px;
}
.account__header__fields dl {
display: flex;
border-bottom: 1px solid #554b68;
}
.account__header__fields dt,
.account__header__fields dd {
box-sizing: border-box;
padding: 14px;
text-align: center;
max-height: 48px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.account__header__fields dt {
font-weight: 500;
width: 120px;
flex: 0 0 auto;
color: #dbd3ff;
background: rgba(36, 32, 44, 0.5);
}
.account__header__fields dd {
flex: 1 1 auto;
color: #e6e6fa;
}
.account__header__fields a {
color: #a288bd;
text-decoration: none;
}
.account__header__fields a:hover,
.account__header__fields a:focus,
.account__header__fields a:active {
text-decoration: underline;
}
.account__header__fields .verified {
border: 1px solid rgba(121, 189, 154, 0.5);
background: rgba(121, 189, 154, 0.25);
}
.account__header__fields .verified a {
color: #79bd9a;
font-weight: 500;
}
.account__header__fields .verified__mark {
color: #79bd9a;
}
.account__header__fields dl:last-child {
border-bottom: 0;
}
.directory__tag .trends__item__current {
width: auto;
}
.pending-account__header {
color: #e6e6fa;
}
.pending-account__header a {
color: #dbd3ff;
text-decoration: none;
}
.pending-account__header a:hover,
.pending-account__header a:active,
.pending-account__header a:focus {
text-decoration: underline;
}
.pending-account__header strong {
color: #fff;
font-weight: 700;
}
.pending-account__body {
margin-top: 10px;
}
.activity-stream {
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
border-radius: 4px;
overflow: hidden;
margin-bottom: 10px;
}
.activity-stream--under-tabs {
border-radius: 0 0 4px 4px;
}
@media screen and (max-width: 415px) {
.activity-stream {
margin-bottom: 0;
border-radius: 0;
box-shadow: none;
}
}
.activity-stream--headless {
border-radius: 0;
margin: 0;
box-shadow: none;
}
.activity-stream--headless .detailed-status,
.activity-stream--headless .status {
border-radius: 0 !important;
}
.activity-stream div[data-component] {
width: 100%;
}
.activity-stream .entry {
background: #383144;
}
.activity-stream .entry .detailed-status,
.activity-stream .entry .status,
.activity-stream .entry .load-more {
animation: none;
}
.activity-stream .entry:last-child .detailed-status,
.activity-stream .entry:last-child .status,
.activity-stream .entry:last-child .load-more {
border-bottom: 0;
border-radius: 0 0 4px 4px;
}
.activity-stream .entry:first-child .detailed-status,
.activity-stream .entry:first-child .status,
.activity-stream .entry:first-child .load-more {
border-radius: 4px 4px 0 0;
}
.activity-stream .entry:first-child:last-child .detailed-status,
.activity-stream .entry:first-child:last-child .status,
.activity-stream .entry:first-child:last-child .load-more {
border-radius: 4px;
}
@media screen and (max-width: 740px) {
.activity-stream .entry .detailed-status,
.activity-stream .entry .status,
.activity-stream .entry .load-more {
border-radius: 0 !important;
}
}
.activity-stream--highlighted .entry {
background: #4c425c;
}
.button.logo-button {
flex: 0 auto;
font-size: 14px;
background: #a288bd;
color: #fff;
text-transform: none;
line-height: 1.2;
height: auto;
min-height: 36px;
min-width: 88px;
white-space: normal;
overflow-wrap: break-word;
hyphens: auto;
padding: 0 15px;
border: 0;
}
.button.logo-button svg {
width: 20px;
height: auto;
vertical-align: middle;
margin-right: 5px;
fill: #fff;
}
.button.logo-button:active,
.button.logo-button:focus,
.button.logo-button:hover {
background: #bca9cf;
}
.button.logo-button:disabled:active,
.button.logo-button:disabled:focus,
.button.logo-button:disabled:hover,
.button.logo-button.disabled:active,
.button.logo-button.disabled:focus,
.button.logo-button.disabled:hover {
background: #e6e6fa;
}
.button.logo-button.button--destructive:active,
.button.logo-button.button--destructive:focus,
.button.logo-button.button--destructive:hover {
background: #df405a;
}
@media screen and (max-width: 415px) {
.button.logo-button svg {
display: none;
}
}
a.button.logo-button {
display: inline-flex;
align-items: center;
justify-content: center;
}
.embed .status__content[data-spoiler=folded] .e-content,
.public-layout .status__content[data-spoiler=folded] .e-content {
display: none;
}
.embed .status__content[data-spoiler=folded] p:first-child,
.public-layout .status__content[data-spoiler=folded] p:first-child {
margin-bottom: 0;
}
.embed .detailed-status,
.public-layout .detailed-status {
padding: 15px;
}
.embed .detailed-status .detailed-status__display-avatar .account__avatar,
.public-layout .detailed-status .detailed-status__display-avatar .account__avatar {
width: 48px;
height: 48px;
}
.embed .status,
.public-layout .status {
padding: 15px 15px 15px 78px;
min-height: 50px;
}
.embed .status__avatar,
.public-layout .status__avatar {
left: 15px;
top: 17px;
}
.embed .status__avatar .account__avatar,
.public-layout .status__avatar .account__avatar {
width: 48px;
height: 48px;
}
.embed .status__content,
.public-layout .status__content {
padding-top: 5px;
}
.embed .status__prepend,
.public-layout .status__prepend {
margin-left: 78px;
padding-top: 15px;
}
.embed .status__prepend-icon-wrapper,
.public-layout .status__prepend-icon-wrapper {
left: -32px;
}
.embed .status .media-gallery,
.embed .status__action-bar,
.embed .status .video-player,
.public-layout .status .media-gallery,
.public-layout .status__action-bar,
.public-layout .status .video-player {
margin-top: 10px;
}
.embed .status__action-bar-button,
.public-layout .status__action-bar-button {
font-size: 18px;
width: 23.1429px;
height: 23.1429px;
line-height: 23.15px;
}
button.icon-button i.fa-retweet {
background-image: url("data:image/svg+xml;utf8,");
}
button.icon-button:hover i.fa-retweet {
background-image: url("data:image/svg+xml;utf8,");
}
button.icon-button.reblogPrivate i.fa-retweet {
background-image: url("data:image/svg+xml;utf8,");
}
button.icon-button.reblogPrivate:hover i.fa-retweet {
background-image: url("data:image/svg+xml;utf8,");
}
button.icon-button.disabled i.fa-retweet,
button.icon-button.disabled:hover i.fa-retweet {
background-image: url("data:image/svg+xml;utf8,");
}
.media-modal__overlay .picture-in-picture__footer button.icon-button i.fa-retweet {
background-image: url("data:image/svg+xml;utf8,");
}
.app-body {
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.animated-number {
display: inline-flex;
flex-direction: column;
align-items: stretch;
overflow: hidden;
position: relative;
}
.inline-alert {
color: #79bd9a;
font-weight: 400;
}
.no-reduce-motion .inline-alert {
transition: opacity 200ms ease;
}
.link-button {
display: block;
font-size: 15px;
line-height: 20px;
color: #a288bd;
border: 0;
background: transparent;
padding: 0;
cursor: pointer;
}
.link-button:hover,
.link-button:active {
text-decoration: underline;
}
.link-button:disabled {
color: #e6e6fa;
cursor: default;
}
.button {
background-color: #a288bd;
border: 10px none;
border-radius: 4px;
box-sizing: border-box;
color: #fff;
cursor: pointer;
display: inline-block;
font-family: inherit;
font-size: 14px;
font-weight: 500;
height: 36px;
letter-spacing: 0;
line-height: 36px;
overflow: hidden;
padding: 0 16px;
position: relative;
text-align: center;
text-transform: uppercase;
text-decoration: none;
text-overflow: ellipsis;
transition: all 100ms ease-in;
white-space: nowrap;
width: auto;
}
.button:active,
.button:focus,
.button:hover {
background-color: #bca9cf;
transition: all 200ms ease-out;
}
.button--destructive {
transition: none;
}
.button--destructive:active,
.button--destructive:focus,
.button--destructive:hover {
background-color: #df405a;
transition: none;
}
.button:disabled,
.button.disabled {
background-color: #e6e6fa;
cursor: default;
}
.button::-moz-focus-inner {
border: 0;
}
.button::-moz-focus-inner,
.button:focus,
.button:active {
outline: 0 !important;
}
.button.button-primary,
.button.button-alternative,
.button.button-secondary,
.button.button-alternative-2 {
font-size: 16px;
line-height: 36px;
height: auto;
text-transform: none;
padding: 4px 16px;
}
.button.button-alternative {
color: #383144;
background: #e6e6fa;
}
.button.button-alternative:active,
.button.button-alternative:focus,
.button.button-alternative:hover {
background-color: #f7f7fd;
}
.button.button-alternative-2 {
background: #d5bdd6;
}
.button.button-alternative-2:active,
.button.button-alternative-2:focus,
.button.button-alternative-2:hover {
background-color: #ddcade;
}
.button.button-secondary {
color: #e6e6fa;
background: transparent;
padding: 3px 15px;
border: 1px solid #e6e6fa;
}
.button.button-secondary:active,
.button.button-secondary:focus,
.button.button-secondary:hover {
border-color: #f7f7fd;
color: #f7f7fd;
}
.button.button-secondary:disabled {
opacity: .5;
}
.button.button--block {
display: block;
width: 100%;
}
.layout-multiple-columns .button.button--with-bell {
font-size: 12px;
padding: 0 8px;
}
.column__wrapper {
display: flex;
flex: 1 1 auto;
position: relative;
}
.icon-button {
display: inline-block;
padding: 0;
color: #d5bdd6;
border: 0;
border-radius: 4px;
background: transparent;
cursor: pointer;
transition: all 100ms ease-in;
transition-property: background-color, color;
text-decoration: none;
}
.icon-button:hover,
.icon-button:active,
.icon-button:focus {
color: #e3d3e4;
background-color: rgba(213, 189, 214, 0.15);
transition: all 200ms ease-out;
transition-property: background-color, color;
}
.icon-button:focus {
background-color: rgba(213, 189, 214, 0.3);
}
.icon-button.disabled {
color: #bb94bd;
background-color: transparent;
cursor: default;
}
.icon-button.active {
color: #a288bd;
}
.icon-button::-moz-focus-inner {
border: 0;
}
.icon-button::-moz-focus-inner,
.icon-button:focus,
.icon-button:active {
outline: 0 !important;
}
.icon-button.inverted {
color: #d5bdd6;
}
.icon-button.inverted:hover,
.icon-button.inverted:active,
.icon-button.inverted:focus {
color: #c7a7c8;
background-color: rgba(213, 189, 214, 0.15);
}
.icon-button.inverted:focus {
background-color: rgba(213, 189, 214, 0.3);
}
.icon-button.inverted.disabled {
color: #e3d3e4;
background-color: transparent;
}
.icon-button.inverted.active {
color: #a288bd;
}
.icon-button.inverted.active.disabled {
color: #c3b3d5;
}
.icon-button.overlayed {
box-sizing: content-box;
background: rgba(0, 0, 0, 0.6);
color: rgba(255, 255, 255, 0.7);
border-radius: 4px;
padding: 2px;
}
.icon-button.overlayed:hover {
background: rgba(0, 0, 0, 0.9);
}
.icon-button--with-counter {
display: inline-flex;
align-items: center;
width: auto !important;
}
.icon-button__counter {
display: inline-block;
width: 14px;
margin-left: 4px;
font-size: 12px;
font-weight: 500;
}
.text-icon-button {
color: #d5bdd6;
border: 0;
border-radius: 4px;
background: transparent;
cursor: pointer;
font-weight: 600;
font-size: 11px;
padding: 0 3px;
line-height: 27px;
outline: 0;
transition: all 100ms ease-in;
transition-property: background-color, color;
}
.text-icon-button:hover,
.text-icon-button:active,
.text-icon-button:focus {
color: #c7a7c8;
background-color: rgba(213, 189, 214, 0.15);
transition: all 200ms ease-out;
transition-property: background-color, color;
}
.text-icon-button:focus {
background-color: rgba(213, 189, 214, 0.3);
}
.text-icon-button.disabled {
color: #fdfcfd;
background-color: transparent;
cursor: default;
}
.text-icon-button.active {
color: #a288bd;
}
.text-icon-button::-moz-focus-inner {
border: 0;
}
.text-icon-button::-moz-focus-inner,
.text-icon-button:focus,
.text-icon-button:active {
outline: 0 !important;
}
.dropdown-menu {
position: absolute;
}
.invisible {
font-size: 0;
line-height: 0;
display: inline-block;
width: 0;
height: 0;
position: absolute;
}
.invisible img,
.invisible svg {
margin: 0 !important;
border: 0 !important;
padding: 0 !important;
width: 0 !important;
height: 0 !important;
}
.ellipsis::after {
content: "…";
}
.compose-form {
padding: 10px;
}
.compose-form__sensitive-button {
padding: 10px;
padding-top: 0;
font-size: 14px;
font-weight: 500;
}
.compose-form__sensitive-button.active {
color: #a288bd;
}
.compose-form__sensitive-button input[type=checkbox] {
display: none;
}
.compose-form__sensitive-button .checkbox {
display: inline-block;
position: relative;
border: 1px solid #e6e6fa;
box-sizing: border-box;
width: 18px;
height: 18px;
flex: 0 0 auto;
margin-right: 10px;
top: -1px;
border-radius: 4px;
vertical-align: middle;
}
.compose-form__sensitive-button .checkbox.active {
border-color: #a288bd;
background: #a288bd;
}
.compose-form .compose-form__warning {
color: #383144;
margin-bottom: 10px;
background: #e6e6fa;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
padding: 8px 10px;
border-radius: 4px;
font-size: 13px;
font-weight: 400;
}
.compose-form .compose-form__warning strong {
color: #383144;
font-weight: 500;
}
.compose-form .compose-form__warning strong:lang(ja) {
font-weight: 700;
}
.compose-form .compose-form__warning strong:lang(ko) {
font-weight: 700;
}
.compose-form .compose-form__warning strong:lang(zh-CN) {
font-weight: 700;
}
.compose-form .compose-form__warning strong:lang(zh-HK) {
font-weight: 700;
}
.compose-form .compose-form__warning strong:lang(zh-TW) {
font-weight: 700;
}
.compose-form .compose-form__warning a {
color: #d5bdd6;
font-weight: 500;
text-decoration: underline;
}
.compose-form .compose-form__warning a:hover,
.compose-form .compose-form__warning a:active,
.compose-form .compose-form__warning a:focus {
text-decoration: none;
}
.compose-form .emoji-picker-dropdown {
position: absolute;
top: 0;
right: 0;
}
.compose-form .compose-form__autosuggest-wrapper {
position: relative;
}
.compose-form .autosuggest-textarea,
.compose-form .autosuggest-input,
.compose-form .spoiler-input {
position: relative;
width: 100%;
}
.compose-form .spoiler-input {
height: 0;
transform-origin: bottom;
opacity: 0;
}
.compose-form .spoiler-input.spoiler-input--visible {
height: 36px;
margin-bottom: 11px;
opacity: 1;
}
.compose-form .autosuggest-textarea__textarea,
.compose-form .spoiler-input__input {
display: block;
box-sizing: border-box;
width: 100%;
margin: 0;
color: #383144;
background: #fff;
padding: 10px;
font-family: inherit;
font-size: 14px;
resize: vertical;
border: 0;
outline: 0;
}
.compose-form .autosuggest-textarea__textarea::placeholder,
.compose-form .spoiler-input__input::placeholder {
color: #d5bdd6;
}
.compose-form .autosuggest-textarea__textarea:focus,
.compose-form .spoiler-input__input:focus {
outline: 0;
}
@media screen and (max-width: 600px) {
.compose-form .autosuggest-textarea__textarea,
.compose-form .spoiler-input__input {
font-size: 16px;
}
}
.compose-form .spoiler-input__input {
border-radius: 4px;
}
.compose-form .autosuggest-textarea__textarea {
min-height: 100px;
border-radius: 4px 4px 0 0;
padding-bottom: 0;
padding-right: 32px;
resize: none;
scrollbar-color: initial;
}
.compose-form .autosuggest-textarea__textarea::-webkit-scrollbar {
all: unset;
}
@media screen and (max-width: 600px) {
.compose-form .autosuggest-textarea__textarea {
height: 100px !important;
resize: vertical;
}
}
.compose-form .autosuggest-textarea__suggestions-wrapper {
position: relative;
height: 0;
}
.compose-form .autosuggest-textarea__suggestions {
box-sizing: border-box;
display: none;
position: absolute;
top: 100%;
width: 100%;
z-index: 99;
box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.4);
background: #dbd3ff;
border-radius: 0 0 4px 4px;
color: #383144;
font-size: 14px;
padding: 6px;
}
.compose-form .autosuggest-textarea__suggestions.autosuggest-textarea__suggestions--visible {
display: block;
}
.compose-form .autosuggest-textarea__suggestions__item {
padding: 10px;
cursor: pointer;
border-radius: 4px;
}
.compose-form .autosuggest-textarea__suggestions__item:hover,
.compose-form .autosuggest-textarea__suggestions__item:focus,
.compose-form .autosuggest-textarea__suggestions__item:active,
.compose-form .autosuggest-textarea__suggestions__item.selected {
background: #b1a0ff;
}
.compose-form .autosuggest-account,
.compose-form .autosuggest-emoji,
.compose-form .autosuggest-hashtag {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
line-height: 18px;
font-size: 14px;
}
.compose-form .autosuggest-hashtag {
justify-content: space-between;
}
.compose-form .autosuggest-hashtag__name {
flex: 1 1 auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.compose-form .autosuggest-hashtag strong {
font-weight: 500;
}
.compose-form .autosuggest-hashtag__uses {
flex: 0 0 auto;
text-align: right;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.compose-form .autosuggest-account-icon,
.compose-form .autosuggest-emoji img {
display: block;
margin-right: 8px;
width: 16px;
height: 16px;
}
.compose-form .autosuggest-account .display-name__account {
color: #d5bdd6;
}
.compose-form .compose-form__modifiers {
color: #383144;
font-family: inherit;
font-size: 14px;
background: #fff;
}
.compose-form .compose-form__modifiers .compose-form__upload-wrapper {
overflow: hidden;
}
.compose-form .compose-form__modifiers .compose-form__uploads-wrapper {
display: flex;
flex-direction: row;
padding: 5px;
flex-wrap: wrap;
}
.compose-form .compose-form__modifiers .compose-form__upload {
flex: 1 1 0;
min-width: 40%;
margin: 5px;
}
.compose-form .compose-form__modifiers .compose-form__upload__actions {
background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0, rgba(0, 0, 0, 0.35) 80%, transparent);
display: flex;
align-items: flex-start;
justify-content: space-between;
opacity: 0;
transition: opacity .1s ease;
}
.compose-form .compose-form__modifiers .compose-form__upload__actions .icon-button {
flex: 0 1 auto;
color: #dbd3ff;
font-size: 14px;
font-weight: 500;
padding: 10px;
font-family: inherit;
}
.compose-form .compose-form__modifiers .compose-form__upload__actions .icon-button:hover,
.compose-form .compose-form__modifiers .compose-form__upload__actions .icon-button:focus,
.compose-form .compose-form__modifiers .compose-form__upload__actions .icon-button:active {
color: #f8f7ff;
}
.compose-form .compose-form__modifiers .compose-form__upload__actions.active {
opacity: 1;
}
.compose-form .compose-form__modifiers .compose-form__upload-description {
position: absolute;
z-index: 2;
bottom: 0;
left: 0;
right: 0;
box-sizing: border-box;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0, rgba(0, 0, 0, 0.35) 80%, transparent);
padding: 10px;
opacity: 0;
transition: opacity .1s ease;
}
.compose-form .compose-form__modifiers .compose-form__upload-description textarea {
background: transparent;
color: #dbd3ff;
border: 0;
padding: 0;
margin: 0;
width: 100%;
font-family: inherit;
font-size: 14px;
font-weight: 500;
}
.compose-form .compose-form__modifiers .compose-form__upload-description textarea:focus {
color: #fff;
}
.compose-form .compose-form__modifiers .compose-form__upload-description textarea::placeholder {
opacity: .75;
color: #dbd3ff;
}
.compose-form .compose-form__modifiers .compose-form__upload-description.active {
opacity: 1;
}
.compose-form .compose-form__modifiers .compose-form__upload-thumbnail {
border-radius: 4px;
background-color: #000;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
height: 140px;
width: 100%;
overflow: hidden;
}
.compose-form .compose-form__buttons-wrapper {
padding: 10px;
background: #ebebeb;
border-radius: 0 0 4px 4px;
display: flex;
justify-content: space-between;
flex: 0 0 auto;
}
.compose-form .compose-form__buttons-wrapper .compose-form__buttons {
display: flex;
}
.compose-form .compose-form__buttons-wrapper .compose-form__buttons .compose-form__upload-button-icon {
line-height: 27px;
}
.compose-form .compose-form__buttons-wrapper .compose-form__buttons .compose-form__sensitive-button {
display: none;
}
.compose-form .compose-form__buttons-wrapper .compose-form__buttons .compose-form__sensitive-button.compose-form__sensitive-button--visible {
display: block;
}
.compose-form .compose-form__buttons-wrapper .compose-form__buttons .compose-form__sensitive-button .compose-form__sensitive-button__icon {
line-height: 27px;
}
.compose-form .compose-form__buttons-wrapper .icon-button,
.compose-form .compose-form__buttons-wrapper .text-icon-button {
box-sizing: content-box;
padding: 0 3px;
}
.compose-form .compose-form__buttons-wrapper .character-counter__wrapper {
align-self: center;
margin-right: 4px;
}
.compose-form .compose-form__publish {
display: flex;
justify-content: flex-end;
min-width: 0;
flex: 0 0 auto;
}
.compose-form .compose-form__publish .compose-form__publish-button-wrapper {
overflow: hidden;
padding-top: 10px;
}
.character-counter {
cursor: default;
font-family: "mastodon-font-sans-serif", sans-serif;
font-size: 14px;
font-weight: 600;
color: #d5bdd6;
}
.character-counter.character-counter--over {
color: #ff5050;
}
.no-reduce-motion .spoiler-input {
transition: height .4s ease, opacity .4s ease;
}
.emojione {
font-size: inherit;
vertical-align: middle;
object-fit: contain;
margin: -0.2ex .15em .2ex;
width: 16px;
height: 16px;
}
.emojione img {
width: auto;
}
.reply-indicator {
border-radius: 4px;
margin-bottom: 10px;
background: #e6e6fa;
padding: 10px;
min-height: 23px;
overflow-y: auto;
flex: 0 2 auto;
}
.reply-indicator__header {
margin-bottom: 5px;
overflow: hidden;
}
.reply-indicator__cancel {
float: right;
line-height: 24px;
}
.reply-indicator__display-name {
color: #383144;
display: block;
max-width: 100%;
line-height: 24px;
overflow: hidden;
padding-right: 25px;
text-decoration: none;
}
.reply-indicator__display-avatar {
float: left;
margin-right: 5px;
}
.status__content--with-action {
cursor: pointer;
}
.status__content {
clear: both;
}
.status__content,
.reply-indicator__content {
position: relative;
font-size: 15px;
line-height: 20px;
word-wrap: break-word;
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
padding-top: 2px;
color: #fff;
}
.status__content:focus,
.reply-indicator__content:focus {
outline: 0;
}
.status__content.status__content--with-spoiler,
.reply-indicator__content.status__content--with-spoiler {
white-space: normal;
}
.status__content.status__content--with-spoiler .status__content__text,
.reply-indicator__content.status__content--with-spoiler .status__content__text {
white-space: pre-wrap;
}
.status__content .emojione,
.reply-indicator__content .emojione {
width: 20px;
height: 20px;
margin: -3px 0 0;
}
.status__content p,
.reply-indicator__content p {
margin-bottom: 20px;
white-space: pre-wrap;
unicode-bidi: plaintext;
}
.status__content p:last-child,
.reply-indicator__content p:last-child {
margin-bottom: 0;
}
.status__content a,
.reply-indicator__content a {
color: #dbd3ff;
text-decoration: none;
unicode-bidi: isolate;
}
.status__content a:hover,
.reply-indicator__content a:hover {
text-decoration: underline;
}
.status__content a:hover .fa,
.reply-indicator__content a:hover .fa {
color: #e3d3e4;
}
.status__content a.mention:hover,
.reply-indicator__content a.mention:hover {
text-decoration: none;
}
.status__content a.mention:hover span,
.reply-indicator__content a.mention:hover span {
text-decoration: underline;
}
.status__content a .fa,
.reply-indicator__content a .fa {
color: #d5bdd6;
}
.status__content a.unhandled-link,
.reply-indicator__content a.unhandled-link {
color: #b7a2cc;
}
.status__content .status__content__spoiler-link,
.reply-indicator__content .status__content__spoiler-link {
background: #d5bdd6;
}
.status__content .status__content__spoiler-link:hover,
.reply-indicator__content .status__content__spoiler-link:hover {
background: #e3d3e4;
text-decoration: none;
}
.status__content .status__content__spoiler-link::-moz-focus-inner,
.reply-indicator__content .status__content__spoiler-link::-moz-focus-inner {
border: 0;
}
.status__content .status__content__spoiler-link::-moz-focus-inner,
.status__content .status__content__spoiler-link:focus,
.status__content .status__content__spoiler-link:active,
.reply-indicator__content .status__content__spoiler-link::-moz-focus-inner,
.reply-indicator__content .status__content__spoiler-link:focus,
.reply-indicator__content .status__content__spoiler-link:active {
outline: 0 !important;
}
.status__content .status__content__text,
.reply-indicator__content .status__content__text {
display: none;
}
.status__content .status__content__text.status__content__text--visible,
.reply-indicator__content .status__content__text.status__content__text--visible {
display: block;
}
.announcements__item__content {
word-wrap: break-word;
overflow-y: auto;
}
.announcements__item__content .emojione {
width: 20px;
height: 20px;
margin: -3px 0 0;
}
.announcements__item__content p {
margin-bottom: 10px;
white-space: pre-wrap;
}
.announcements__item__content p:last-child {
margin-bottom: 0;
}
.announcements__item__content a {
color: #dbd3ff;
text-decoration: none;
}
.announcements__item__content a:hover {
text-decoration: underline;
}
.announcements__item__content a.mention:hover {
text-decoration: none;
}
.announcements__item__content a.mention:hover span {
text-decoration: underline;
}
.announcements__item__content a.unhandled-link {
color: #b7a2cc;
}
.status__content.status__content--collapsed {
max-height: 300px;
}
.status__content__read-more-button {
display: block;
font-size: 15px;
line-height: 20px;
color: #b7a2cc;
border: 0;
background: transparent;
padding: 0;
padding-top: 8px;
text-decoration: none;
}
.status__content__read-more-button:hover,
.status__content__read-more-button:active {
text-decoration: underline;
}
.status__content__spoiler-link {
display: inline-block;
border-radius: 2px;
background: transparent;
border: 0;
color: #383144;
font-weight: 700;
font-size: 11px;
padding: 0 6px;
text-transform: uppercase;
line-height: 20px;
cursor: pointer;
vertical-align: middle;
}
.status__wrapper--filtered {
color: #d5bdd6;
border: 0;
font-size: inherit;
text-align: center;
line-height: inherit;
margin: 0;
padding: 15px;
box-sizing: border-box;
width: 100%;
clear: both;
border-bottom: 1px solid #4c425c;
}
.status__prepend-icon-wrapper {
left: -26px;
position: absolute;
}
.focusable:focus {
outline: 0;
background: #423a50;
}
.focusable:focus .detailed-status,
.focusable:focus .detailed-status__action-bar {
background: #4c425c;
}
.status {
padding: 8px 10px;
padding-left: 68px;
position: relative;
min-height: 54px;
border-bottom: 1px solid #4c425c;
cursor: auto;
opacity: 1;
animation: fade 150ms linear;
}
@supports (-ms-overflow-style: -ms-autohiding-scrollbar) {
.status {
padding-right: 26px;
}
}
@keyframes fade {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.status .video-player,
.status .audio-player {
margin-top: 8px;
}
.status.light .status__relative-time,
.status.light .status__visibility-icon {
color: #e6e6fa;
}
.status.light .status__display-name {
color: #383144;
}
.status.light .display-name {
color: #e6e6fa;
}
.status.light .display-name strong {
color: #383144;
}
.status.light .status__content {
color: #383144;
}
.status.light .status__content a {
color: #a288bd;
}
.status.light .status__content a.status__content__spoiler-link {
color: #fff;
background: #e6e6fa;
}
.status.light .status__content a.status__content__spoiler-link:hover {
background: #fff;
}
.status__relative-time,
.notification__relative_time {
color: #d5bdd6;
float: right;
font-size: 14px;
padding-bottom: 1px;
}
.status__visibility-icon {
padding: 0 4px;
}
.status__display-name {
color: #d5bdd6;
}
.status__info .status__display-name {
display: block;
max-width: 100%;
padding-right: 25px;
}
.status__info {
font-size: 15px;
}
.status-check-box {
border-bottom: 1px solid #dbd3ff;
display: flex;
}
.status-check-box .status-check-box__status {
margin: 10px 0 10px 10px;
flex: 1;
overflow: hidden;
}
.status-check-box .status-check-box__status .media-gallery {
max-width: 250px;
}
.status-check-box .status-check-box__status .status__content {
padding: 0;
white-space: normal;
}
.status-check-box .status-check-box__status .video-player,
.status-check-box .status-check-box__status .audio-player {
margin-top: 8px;
max-width: 250px;
}
.status-check-box .status-check-box__status .media-gallery__item-thumbnail {
cursor: default;
}
.status-check-box-toggle {
align-items: center;
display: flex;
flex: 0 0 auto;
justify-content: center;
padding: 10px;
}
.status__prepend {
margin-left: 68px;
color: #d5bdd6;
padding: 8px 0;
padding-bottom: 2px;
font-size: 14px;
position: relative;
}
.status__prepend .status__display-name strong {
color: #d5bdd6;
}
.status__prepend > span {
display: block;
overflow: hidden;
text-overflow: ellipsis;
}
.status__action-bar {
align-items: center;
display: flex;
margin-top: 8px;
}
.status__action-bar-button {
margin-right: 18px;
}
.status__action-bar-button.icon-button--with-counter {
margin-right: 14px;
}
.status__action-bar-dropdown {
height: 23.15px;
width: 23.15px;
}
.detailed-status__action-bar-dropdown {
flex: 1 1 auto;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.detailed-status {
background: #423a50;
padding: 14px 10px;
}
.detailed-status--flex {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
}
.detailed-status--flex .status__content,
.detailed-status--flex .detailed-status__meta {
flex: 100%;
}
.detailed-status .status__content {
font-size: 19px;
line-height: 24px;
}
.detailed-status .status__content .emojione {
width: 24px;
height: 24px;
margin: -1px 0 0;
}
.detailed-status .status__content .status__content__spoiler-link {
line-height: 24px;
margin: -1px 0 0;
}
.detailed-status .video-player,
.detailed-status .audio-player {
margin-top: 8px;
}
.detailed-status__meta {
margin-top: 15px;
color: #d5bdd6;
font-size: 14px;
line-height: 18px;
}
.detailed-status__action-bar {
background: #423a50;
border-top: 1px solid #4c425c;
border-bottom: 1px solid #4c425c;
display: flex;
flex-direction: row;
padding: 10px 0;
}
.detailed-status__link {
color: inherit;
text-decoration: none;
}
.detailed-status__favorites,
.detailed-status__reblogs {
display: inline-block;
font-weight: 500;
font-size: 12px;
margin-left: 6px;
}
.reply-indicator__content {
color: #383144;
font-size: 14px;
}
.reply-indicator__content a {
color: #d5bdd6;
}
.domain {
padding: 10px;
border-bottom: 1px solid #4c425c;
}
.domain .domain__domain-name {
flex: 1 1 auto;
display: block;
color: #fff;
text-decoration: none;
font-size: 14px;
font-weight: 500;
}
.domain__wrapper {
display: flex;
}
.domain_buttons {
height: 18px;
padding: 10px;
white-space: nowrap;
}
.account {
padding: 10px;
border-bottom: 1px solid #4c425c;
}
.account.compact {
padding: 0;
border-bottom: 0;
}
.account.compact .account__avatar-wrapper {
margin-left: 0;
}
.account .account__display-name {
flex: 1 1 auto;
display: block;
color: #e6e6fa;
overflow: hidden;
text-decoration: none;
font-size: 14px;
}
.account .account__display-name--with-note strong {
display: inline;
}
.account__note {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #dbd3ff;
}
.follow-recommendations-account .icon-button {
color: #e6e6fa;
}
.follow-recommendations-account .icon-button.active {
color: #79bd9a;
}
.account__wrapper {
display: flex;
}
.account__avatar-wrapper {
float: left;
margin-left: 12px;
margin-right: 12px;
}
.account__avatar {
border-radius: 4px;
background: transparent no-repeat;
background-position: 50%;
background-clip: padding-box;
display: block;
position: relative;
width: 36px;
height: 36px;
background-size: 36px 36px;
}
.account__avatar-inline {
display: inline-block;
vertical-align: middle;
margin-right: 5px;
}
.account__avatar-composite {
border-radius: 4px;
background: transparent no-repeat;
background-position: 50%;
background-clip: padding-box;
border-radius: 50%;
overflow: hidden;
position: relative;
}
.account__avatar-composite > div {
float: left;
position: relative;
box-sizing: border-box;
}
.account__avatar-composite__label {
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
text-shadow: 1px 1px 2px #000;
font-weight: 700;
font-size: 15px;
}
a .account__avatar {
cursor: pointer;
}
.account__avatar-overlay {
width: 48px;
height: 48px;
background-size: 48px 48px;
}
.account__avatar-overlay-base {
border-radius: 4px;
background: transparent no-repeat;
background-position: 50%;
background-clip: padding-box;
width: 36px;
height: 36px;
background-size: 36px 36px;
}
.account__avatar-overlay-base img {
border-radius: 4px;
background: transparent no-repeat;
background-position: 50%;
background-clip: padding-box;
width: 100%;
height: 100%;
}
.account__avatar-overlay-overlay {
border-radius: 4px;
background: transparent no-repeat;
background-position: 50%;
background-clip: padding-box;
width: 24px;
height: 24px;
background-size: 24px 24px;
position: absolute;
bottom: 0;
right: 0;
z-index: 1;
}
.account__avatar-overlay-overlay img {
border-radius: 4px;
background: transparent no-repeat;
background-position: 50%;
background-clip: padding-box;
width: 100%;
height: 100%;
}
.account__relationship {
height: 18px;
padding: 10px;
white-space: nowrap;
}
.account__disclaimer {
padding: 10px;
border-top: 1px solid #4c425c;
color: #d5bdd6;
}
.account__disclaimer strong {
font-weight: 500;
}
.account__disclaimer strong:lang(ja) {
font-weight: 700;
}
.account__disclaimer strong:lang(ko) {
font-weight: 700;
}
.account__disclaimer strong:lang(zh-CN) {
font-weight: 700;
}
.account__disclaimer strong:lang(zh-HK) {
font-weight: 700;
}
.account__disclaimer strong:lang(zh-TW) {
font-weight: 700;
}
.account__disclaimer a {
font-weight: 500;
color: inherit;
text-decoration: underline;
}
.account__disclaimer a:hover,
.account__disclaimer a:focus,
.account__disclaimer a:active {
text-decoration: none;
}
.account__action-bar {
border-top: 1px solid #4c425c;
border-bottom: 1px solid #4c425c;
line-height: 36px;
overflow: hidden;
flex: 0 0 auto;
display: flex;
}
.account__action-bar-dropdown {
padding: 10px;
}
.account__action-bar-dropdown .icon-button {
vertical-align: middle;
}
.account__action-bar-dropdown .dropdown--active .dropdown__content.dropdown__right {
left: 6px;
right: initial;
}
.account__action-bar-dropdown .dropdown--active::after {
bottom: initial;
margin-left: 11px;
margin-top: -7px;
right: initial;
}
.account__action-bar-links {
display: flex;
flex: 1 1 auto;
line-height: 18px;
text-align: center;
}
.account__action-bar__tab {
text-decoration: none;
overflow: hidden;
flex: 0 1 100%;
border-right: 1px solid #4c425c;
padding: 10px 0;
border-bottom: 4px solid transparent;
}
.account__action-bar__tab.active {
border-bottom: 4px solid #a288bd;
}
.account__action-bar__tab > span {
display: block;
text-transform: uppercase;
font-size: 11px;
color: #e6e6fa;
}
.account__action-bar__tab strong {
display: block;
font-size: 15px;
font-weight: 500;
color: #fff;
}
.account__action-bar__tab strong:lang(ja) {
font-weight: 700;
}
.account__action-bar__tab strong:lang(ko) {
font-weight: 700;
}
.account__action-bar__tab strong:lang(zh-CN) {
font-weight: 700;
}
.account__action-bar__tab strong:lang(zh-HK) {
font-weight: 700;
}
.account__action-bar__tab strong:lang(zh-TW) {
font-weight: 700;
}
.account-authorize {
padding: 14px 10px;
}
.account-authorize .detailed-status__display-name {
display: block;
margin-bottom: 15px;
overflow: hidden;
}
.account-authorize__avatar {
float: left;
margin-right: 10px;
}
.status__display-name,
.status__relative-time,
.detailed-status__display-name,
.detailed-status__datetime,
.detailed-status__application,
.account__display-name {
text-decoration: none;
}
.status__display-name strong,
.account__display-name strong {
color: #fff;
}
.muted .emojione {
opacity: .5;
}
.status__display-name:hover strong,
.reply-indicator__display-name:hover strong,
.detailed-status__display-name:hover strong,
a.account__display-name:hover strong {
text-decoration: underline;
}
.account__display-name strong {
display: block;
overflow: hidden;
text-overflow: ellipsis;
}
.detailed-status__application,
.detailed-status__datetime {
color: inherit;
}
.detailed-status .button.logo-button {
margin-bottom: 15px;
}
.detailed-status__display-name {
color: #dbd3ff;
display: block;
line-height: 24px;
margin-bottom: 15px;
overflow: hidden;
}
.detailed-status__display-name strong,
.detailed-status__display-name span {
display: block;
text-overflow: ellipsis;
overflow: hidden;
}
.detailed-status__display-name strong {
font-size: 16px;
color: #fff;
}
.detailed-status__display-avatar {
float: left;
margin-right: 10px;
}
.status__avatar {
height: 48px;
left: 10px;
position: absolute;
top: 10px;
width: 48px;
}
.status__expand {
width: 68px;
position: absolute;
left: 0;
top: 0;
height: 100%;
cursor: pointer;
}
.muted .status__content,
.muted .status__content p,
.muted .status__content a {
color: #d5bdd6;
}
.muted .status__display-name strong {
color: #d5bdd6;
}
.muted .status__avatar {
opacity: .5;
}
.muted a.status__content__spoiler-link {
background: #d5bdd6;
color: #383144;
}
.muted a.status__content__spoiler-link:hover {
background: #e3d3e4;
text-decoration: none;
}
.notification__message {
margin: 0 10px 0 68px;
padding: 8px 0 0;
cursor: default;
color: #e6e6fa;
font-size: 15px;
line-height: 22px;
position: relative;
}
.notification__message .fa {
color: #a288bd;
}
.notification__message > span {
display: inline;
overflow: hidden;
text-overflow: ellipsis;
}
.notification__favourite-icon-wrapper {
left: -26px;
position: absolute;
}
.notification__favourite-icon-wrapper .star-icon {
color: #ca8f04;
}
.icon-button.star-icon.active {
color: #ca8f04;
}
.icon-button.bookmark-icon.active {
color: #ff5050;
}
.no-reduce-motion .icon-button.star-icon.activate > .fa-star {
animation: spring-rotate-in 1s linear;
}
.no-reduce-motion .icon-button.star-icon.deactivate > .fa-star {
animation: spring-rotate-out 1s linear;
}
.notification__display-name {
color: inherit;
font-weight: 500;
text-decoration: none;
}
.notification__display-name:hover {
color: #fff;
text-decoration: underline;
}
.notification__relative_time {
float: right;
}
.display-name {
display: block;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.display-name__html {
font-weight: 500;
}
.display-name__account {
font-size: 14px;
}
.status__relative-time:hover,
.detailed-status__datetime:hover {
text-decoration: underline;
}
.image-loader {
position: relative;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
scrollbar-width: none;
-ms-overflow-style: none;
}
.image-loader * {
scrollbar-width: none;
-ms-overflow-style: none;
}
.image-loader::-webkit-scrollbar,
.image-loader *::-webkit-scrollbar {
width: 0;
height: 0;
background: transparent;
}
.image-loader .image-loader__preview-canvas {
max-width: 100%;
max-height: 80%;
background: url("../images/void.png") repeat;
object-fit: contain;
}
.image-loader .loading-bar {
position: relative;
}
.image-loader.image-loader--amorphous .image-loader__preview-canvas {
display: none;
}
.zoomable-image {
position: relative;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.zoomable-image img {
max-width: 100%;
max-height: 80%;
width: auto;
height: auto;
object-fit: contain;
}
.navigation-bar {
padding: 10px;
display: flex;
align-items: center;
flex-shrink: 0;
cursor: default;
color: #e6e6fa;
}
.navigation-bar strong {
color: #dbd3ff;
}
.navigation-bar a {
color: inherit;
}
.navigation-bar .permalink {
text-decoration: none;
}
.navigation-bar .navigation-bar__actions {
position: relative;
}
.navigation-bar .navigation-bar__actions .icon-button.close {
position: absolute;
pointer-events: none;
transform: scale(0, 1) translate(-100%, 0);
opacity: 0;
}
.navigation-bar .navigation-bar__actions .compose__action-bar .icon-button {
pointer-events: auto;
transform: scale(1, 1) translate(0, 0);
opacity: 1;
}
.navigation-bar__profile {
flex: 1 1 auto;
margin-left: 8px;
line-height: 20px;
margin-top: -1px;
overflow: hidden;
}
.navigation-bar__profile-account {
display: block;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
}
.navigation-bar__profile-edit {
color: inherit;
text-decoration: none;
}
.dropdown {
display: inline-block;
}
.dropdown__content {
display: none;
position: absolute;
}
.dropdown-menu__separator {
border-bottom: 1px solid #baaaff;
margin: 5px 7px 6px;
height: 0;
}
.dropdown-menu {
background: #dbd3ff;
padding: 4px 0;
border-radius: 4px;
box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.4);
z-index: 9999;
}
.dropdown-menu ul {
list-style: none;
}
.dropdown-menu.left {
transform-origin: 100% 50%;
}
.dropdown-menu.top {
transform-origin: 50% 100%;
}
.dropdown-menu.bottom {
transform-origin: 50% 0;
}
.dropdown-menu.right {
transform-origin: 0 50%;
}
.dropdown-menu__arrow {
position: absolute;
width: 0;
height: 0;
border: 0 solid transparent;
}
.dropdown-menu__arrow.left {
right: -5px;
margin-top: -5px;
border-width: 5px 0 5px 5px;
border-left-color: #dbd3ff;
}
.dropdown-menu__arrow.top {
bottom: -5px;
margin-left: -7px;
border-width: 5px 7px 0;
border-top-color: #dbd3ff;
}
.dropdown-menu__arrow.bottom {
top: -5px;
margin-left: -7px;
border-width: 0 7px 5px;
border-bottom-color: #dbd3ff;
}
.dropdown-menu__arrow.right {
left: -5px;
margin-top: -5px;
border-width: 5px 5px 5px 0;
border-right-color: #dbd3ff;
}
.dropdown-menu__item a {
font-size: 13px;
line-height: 18px;
display: block;
padding: 4px 14px;
box-sizing: border-box;
text-decoration: none;
background: #dbd3ff;
color: #383144;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.dropdown-menu__item a:focus,
.dropdown-menu__item a:hover,
.dropdown-menu__item a:active {
background: #a288bd;
color: #dbd3ff;
outline: 0;
}
.dropdown--active .dropdown__content {
display: block;
line-height: 18px;
max-width: 311px;
right: 0;
text-align: left;
z-index: 9999;
}
.dropdown--active .dropdown__content > ul {
list-style: none;
background: #dbd3ff;
padding: 4px 0;
border-radius: 4px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
min-width: 140px;
position: relative;
}
.dropdown--active .dropdown__content.dropdown__right {
right: 0;
}
.dropdown--active .dropdown__content.dropdown__left > ul {
left: -98px;
}
.dropdown--active .dropdown__content > ul > li > a {
font-size: 13px;
line-height: 18px;
display: block;
padding: 4px 14px;
box-sizing: border-box;
text-decoration: none;
background: #dbd3ff;
color: #383144;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.dropdown--active .dropdown__content > ul > li > a:focus {
outline: 0;
}
.dropdown--active .dropdown__content > ul > li > a:hover {
background: #a288bd;
color: #dbd3ff;
}
.dropdown__icon {
vertical-align: middle;
}
.columns-area {
display: flex;
flex: 1 1 auto;
flex-direction: row;
justify-content: flex-start;
overflow-x: auto;
position: relative;
}
.columns-area.unscrollable {
overflow-x: hidden;
}
.columns-area__panels {
display: flex;
justify-content: center;
width: 100%;
height: 100%;
min-height: 100vh;
}
.columns-area__panels__pane {
height: 100%;
overflow: hidden;
pointer-events: none;
display: flex;
justify-content: flex-end;
min-width: 285px;
}
.columns-area__panels__pane--start {
justify-content: flex-start;
}
.columns-area__panels__pane__inner {
position: fixed;
width: 285px;
pointer-events: auto;
height: 100%;
}
.columns-area__panels__main {
box-sizing: border-box;
width: 100%;
max-width: 600px;
flex: 0 0 auto;
display: flex;
flex-direction: column;
}
@media screen and (min-width: 415px) {
.columns-area__panels__main {
padding: 0 10px;
}
}
.tabs-bar__wrapper {
background: #24202c;
position: sticky;
top: 0;
z-index: 2;
padding-top: 0;
}
@media screen and (min-width: 415px) {
.tabs-bar__wrapper {
padding-top: 10px;
}
}
.tabs-bar__wrapper .tabs-bar {
margin-bottom: 0;
}
@media screen and (min-width: 415px) {
.tabs-bar__wrapper .tabs-bar {
margin-bottom: 10px;
}
}
.react-swipeable-view-container,
.react-swipeable-view-container .columns-area,
.react-swipeable-view-container .drawer,
.react-swipeable-view-container .column {
height: 100%;
}
.react-swipeable-view-container > * {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.column {
width: 350px;
position: relative;
box-sizing: border-box;
display: flex;
flex-direction: column;
}
.column > .scrollable {
background: #383144;
}
.ui {
flex: 0 0 auto;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
.drawer {
width: 300px;
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow-y: hidden;
}
.drawer__tab {
display: block;
flex: 1 1 auto;
padding: 15px 5px 13px;
color: #e6e6fa;
text-decoration: none;
text-align: center;
font-size: 16px;
border-bottom: 2px solid transparent;
}
.column,
.drawer {
flex: 1 1 100%;
overflow: hidden;
}
@media screen and (min-width: 631px) {
.columns-area {
padding: 0;
}
.column,
.drawer {
flex: 0 0 auto;
padding: 10px;
padding-left: 5px;
padding-right: 5px;
}
.column:first-child,
.drawer:first-child {
padding-left: 10px;
}
.column:last-child,
.drawer:last-child {
padding-right: 10px;
}
.columns-area > div .column,
.columns-area > div .drawer {
padding-left: 5px;
padding-right: 5px;
}
}
.tabs-bar {
box-sizing: border-box;
display: flex;
background: #4c425c;
flex: 0 0 auto;
overflow-y: auto;
}
.tabs-bar__link {
display: block;
flex: 1 1 auto;
padding: 15px 10px;
padding-bottom: 13px;
color: #fff;
text-decoration: none;
text-align: center;
font-size: 14px;
font-weight: 500;
border-bottom: 2px solid #4c425c;
transition: all 50ms linear;
transition-property: border-bottom, background, color;
}
.tabs-bar__link .fa {
font-weight: 400;
font-size: 16px;
}
@media screen and (min-width: 631px) {
.tabs-bar__link:hover,
.tabs-bar__link:focus,
.tabs-bar__link:active {
background: #5a4f6d;
border-bottom-color: #5a4f6d;
}
}
.tabs-bar__link.active {
border-bottom: 2px solid #a288bd;
color: #a288bd;
}
.tabs-bar__link span {
margin-left: 5px;
display: none;
}
@media screen and (min-width: 600px) {
.tabs-bar__link span {
display: inline;
}
}
.columns-area--mobile {
flex-direction: column;
width: 100%;
height: 100%;
margin: 0 auto;
}
.columns-area--mobile .column,
.columns-area--mobile .drawer {
width: 100%;
height: 100%;
padding: 0;
}
.columns-area--mobile .directory__list {
display: grid;
grid-gap: 10px;
grid-template-columns: minmax(0, 50%) minmax(0, 50%);
}
@media screen and (max-width: 415px) {
.columns-area--mobile .directory__list {
display: block;
}
}
.columns-area--mobile .directory__card {
margin-bottom: 0;
}
.columns-area--mobile .filter-form {
display: flex;
}
.columns-area--mobile .autosuggest-textarea__textarea {
font-size: 16px;
}
.columns-area--mobile .search__input {
line-height: 18px;
font-size: 16px;
padding: 15px;
padding-right: 30px;
}
.columns-area--mobile .search__icon .fa {
top: 15px;
}
.columns-area--mobile .scrollable {
overflow: visible;
}
@supports (display: grid) {
.columns-area--mobile .scrollable {
contain: content;
}
}
@media screen and (min-width: 415px) {
.columns-area--mobile {
padding: 10px 0;
padding-top: 0;
}
}
@media screen and (min-width: 630px) {
.columns-area--mobile .detailed-status {
padding: 15px;
}
.columns-area--mobile .detailed-status .media-gallery,
.columns-area--mobile .detailed-status .video-player,
.columns-area--mobile .detailed-status .audio-player {
margin-top: 15px;
}
.columns-area--mobile .account__header__bar {
padding: 5px 10px;
}
.columns-area--mobile .navigation-bar,
.columns-area--mobile .compose-form {
padding: 15px;
}
.columns-area--mobile .compose-form .compose-form__publish .compose-form__publish-button-wrapper {
padding-top: 15px;
}
.columns-area--mobile .status {
padding: 15px 15px 15px 78px;
min-height: 50px;
}
.columns-area--mobile .status__avatar {
left: 15px;
top: 17px;
}
.columns-area--mobile .status__content {
padding-top: 5px;
}
.columns-area--mobile .status__prepend {
margin-left: 78px;
padding-top: 15px;
}
.columns-area--mobile .status__prepend-icon-wrapper {
left: -32px;
}
.columns-area--mobile .status .media-gallery,
.columns-area--mobile .status__action-bar,
.columns-area--mobile .status .video-player,
.columns-area--mobile .status .audio-player {
margin-top: 10px;
}
.columns-area--mobile .account {
padding: 15px 10px;
}
.columns-area--mobile .account__header__bio {
margin: 0 -10px;
}
.columns-area--mobile .notification__message {
margin-left: 78px;
padding-top: 15px;
}
.columns-area--mobile .notification__favourite-icon-wrapper {
left: -32px;
}
.columns-area--mobile .notification .status {
padding-top: 8px;
}
.columns-area--mobile .notification .account {
padding-top: 8px;
}
.columns-area--mobile .notification .account__avatar-wrapper {
margin-left: 17px;
margin-right: 15px;
}
}
.floating-action-button {
position: fixed;
display: flex;
justify-content: center;
align-items: center;
width: 3.9375rem;
height: 3.9375rem;
bottom: 1.3125rem;
right: 1.3125rem;
background: #9a7eb8;
color: #fff;
border-radius: 50%;
font-size: 21px;
line-height: 21px;
text-decoration: none;
box-shadow: 2px 3px 9px rgba(0, 0, 0, 0.4);
}
.floating-action-button:hover,
.floating-action-button:focus,
.floating-action-button:active {
background: #b49fca;
}
@media screen and (min-width: 415px) {
.tabs-bar {
width: 100%;
}
.react-swipeable-view-container .columns-area--mobile {
height: calc(100% - 10px) !important;
}
.getting-started__wrapper,
.search {
margin-bottom: 10px;
}
}
@media screen and (max-width: 895px) {
.columns-area__panels__pane--compositional {
display: none;
}
}
@media screen and (min-width: 895px) {
.floating-action-button,
.tabs-bar__link.optional {
display: none;
}
.search-page .search {
display: none;
}
}
@media screen and (max-width: 1190px) {
.columns-area__panels__pane--navigational {
display: none;
}
}
@media screen and (min-width: 1190px) {
.tabs-bar {
display: none;
}
}
.icon-with-badge {
position: relative;
}
.icon-with-badge__badge {
position: absolute;
left: 9px;
top: -13px;
background: #a288bd;
border: 2px solid #4c425c;
padding: 1px 6px;
border-radius: 6px;
font-size: 10px;
font-weight: 500;
line-height: 14px;
color: #fff;
}
.icon-with-badge__issue-badge {
position: absolute;
left: 11px;
bottom: 1px;
display: block;
background: #df405a;
border-radius: 50%;
width: .625rem;
height: .625rem;
}
.column-link--transparent .icon-with-badge__badge {
border-color: #24202c;
}
.column-title {
text-align: center;
padding: 40px;
}
.column-title .logo {
fill: #fff;
width: 50px;
margin: 0 auto;
margin-bottom: 40px;
}
.column-title h3 {
font-size: 24px;
line-height: 1.5;
font-weight: 700;
margin-bottom: 10px;
}
.column-title p {
font-size: 16px;
line-height: 24px;
font-weight: 400;
color: #e6e6fa;
}
.follow-recommendations-container {
display: flex;
flex-direction: column;
}
.column-actions {
display: flex;
align-items: start;
justify-content: center;
padding: 40px;
padding-top: 40px;
padding-bottom: 200px;
flex-grow: 1;
position: relative;
}
.column-actions__background {
position: absolute;
left: 0;
bottom: 0;
height: 220px;
width: auto;
}
.column-list {
margin: 0 20px;
border: 1px solid #4c425c;
background: #332d3e;
border-radius: 4px;
}
.column-list__empty-message {
padding: 40px;
text-align: center;
font-size: 16px;
line-height: 24px;
font-weight: 400;
color: #e6e6fa;
}
.compose-panel {
width: 285px;
margin-top: 10px;
display: flex;
flex-direction: column;
height: calc(100% - 10px);
overflow-y: hidden;
}
.compose-panel .navigation-bar {
padding-top: 20px;
padding-bottom: 20px;
flex: 0 1 48px;
min-height: 20px;
}
.compose-panel .flex-spacer {
background: transparent;
}
.compose-panel .compose-form {
flex: 1;
overflow-y: hidden;
display: flex;
flex-direction: column;
min-height: 310px;
padding-bottom: 71px;
margin-bottom: -71px;
}
.compose-panel .compose-form__autosuggest-wrapper {
overflow-y: auto;
background-color: #fff;
border-radius: 4px 4px 0 0;
flex: 0 1 auto;
}
.compose-panel .autosuggest-textarea__textarea {
overflow-y: hidden;
}
.compose-panel .compose-form__upload-thumbnail {
height: 80px;
}
.navigation-panel {
margin-top: 10px;
margin-bottom: 10px;
height: calc(100% - 20px);
overflow-y: auto;
display: flex;
flex-direction: column;
}
.navigation-panel > a {
flex: 0 0 auto;
}
.navigation-panel hr {
flex: 0 0 auto;
border: 0;
background: transparent;
border-top: 1px solid #423a50;
margin: 10px 0;
}
.navigation-panel .flex-spacer {
background: transparent;
}
.drawer__pager {
box-sizing: border-box;
padding: 0;
flex-grow: 1;
position: relative;
overflow: hidden;
display: flex;
}
.drawer__inner {
position: absolute;
top: 0;
left: 0;
background: #584d6b;
box-sizing: border-box;
padding: 0;
display: flex;
flex-direction: column;
overflow: hidden;
overflow-y: auto;
width: 100%;
height: 100%;
}
.drawer__inner.darker {
background: #383144;
}
.drawer__inner__mastodon {
background: #584d6b url('data:image/svg+xml;utf8,') no-repeat bottom/100% auto;
flex: 1;
min-height: 47px;
display: none;
}
.drawer__inner__mastodon > img {
display: block;
object-fit: contain;
object-position: bottom left;
width: 85%;
height: 100%;
pointer-events: none;
user-drag: none;
user-select: none;
}
@media screen and (min-height: 640px) {
.drawer__inner__mastodon {
display: block;
}
}
.pseudo-drawer {
background: #584d6b;
font-size: 13px;
text-align: left;
}
.drawer__header {
flex: 0 0 auto;
font-size: 16px;
background: #4c425c;
margin-bottom: 10px;
display: flex;
flex-direction: row;
}
.drawer__header a {
transition: background 100ms ease-in;
}
.drawer__header a:hover {
background: #3f374d;
transition: background 200ms ease-out;
}
.scrollable {
overflow-y: scroll;
overflow-x: hidden;
flex: 1 1 auto;
-webkit-overflow-scrolling: touch;
}
.scrollable.optionally-scrollable {
overflow-y: auto;
}
@supports (display: grid) {
.scrollable {
contain: strict;
}
}
.scrollable--flex {
display: flex;
flex-direction: column;
}
.scrollable__append {
flex: 1 1 auto;
position: relative;
min-height: 120px;
}
@supports (display: grid) {
.scrollable.fullscreen {
contain: none;
}
}
.column-back-button {
box-sizing: border-box;
width: 100%;
background: #423a50;
color: #a288bd;
cursor: pointer;
flex: 0 0 auto;
font-size: 16px;
line-height: inherit;
border: 0;
text-align: unset;
padding: 15px;
margin: 0;
z-index: 3;
outline: 0;
}
.column-back-button:hover {
text-decoration: underline;
}
.column-header__back-button {
background: #423a50;
border: 0;
font-family: inherit;
color: #a288bd;
cursor: pointer;
white-space: nowrap;
font-size: 16px;
padding: 0 5px 0 0;
z-index: 3;
}
.column-header__back-button:hover {
text-decoration: underline;
}
.column-header__back-button:last-child {
padding: 0 15px 0 0;
}
.column-back-button__icon {
display: inline-block;
margin-right: 5px;
}
.column-back-button--slim {
position: relative;
}
.column-back-button--slim-button {
cursor: pointer;
flex: 0 0 auto;
font-size: 16px;
padding: 15px;
position: absolute;
right: 0;
top: -48px;
}
.react-toggle {
display: inline-block;
position: relative;
cursor: pointer;
background-color: transparent;
border: 0;
padding: 0;
user-select: none;
-webkit-tap-highlight-color: transparent;
-webkit-tap-highlight-color: transparent;
}
.react-toggle-screenreader-only {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.react-toggle--disabled {
cursor: not-allowed;
opacity: .5;
transition: opacity .25s;
}
.react-toggle-track {
width: 50px;
height: 24px;
padding: 0;
border-radius: 30px;
background-color: #383144;
transition: background-color .2s ease;
}
.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {
background-color: #201c26;
}
.react-toggle--checked .react-toggle-track {
background-color: #a288bd;
}
.react-toggle--checked:hover:not(.react-toggle--disabled) .react-toggle-track {
background-color: #bca9cf;
}
.react-toggle-track-check {
position: absolute;
width: 14px;
height: 10px;
top: 0;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
line-height: 0;
left: 8px;
opacity: 0;
transition: opacity .25s ease;
}
.react-toggle--checked .react-toggle-track-check {
opacity: 1;
transition: opacity .25s ease;
}
.react-toggle-track-x {
position: absolute;
width: 10px;
height: 10px;
top: 0;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
line-height: 0;
right: 10px;
opacity: 1;
transition: opacity .25s ease;
}
.react-toggle--checked .react-toggle-track-x {
opacity: 0;
}
.react-toggle-thumb {
position: absolute;
top: 1px;
left: 1px;
width: 22px;
height: 22px;
border: 1px solid #383144;
border-radius: 50%;
background-color: #fafafa;
box-sizing: border-box;
transition: all .25s ease;
transition-property: border-color, left;
}
.react-toggle--checked .react-toggle-thumb {
left: 27px;
border-color: #a288bd;
}
.column-link {
background: #4c425c;
color: #fff;
display: block;
font-size: 16px;
padding: 15px;
text-decoration: none;
}
.column-link:hover,
.column-link:focus,
.column-link:active {
background: #534865;
}
.column-link:focus {
outline: 0;
}
.column-link--transparent {
background: transparent;
color: #dbd3ff;
}
.column-link--transparent:hover,
.column-link--transparent:focus,
.column-link--transparent:active {
background: transparent;
color: #fff;
}
.column-link--transparent.active {
color: #a288bd;
}
.column-link__icon {
display: inline-block;
margin-right: 5px;
}
.column-link__badge {
display: inline-block;
border-radius: 4px;
font-size: 12px;
line-height: 19px;
font-weight: 500;
background: #383144;
padding: 4px 8px;
margin: -6px 10px;
}
.column-subheading {
background: #383144;
color: #d5bdd6;
padding: 8px 20px;
font-size: 12px;
font-weight: 500;
text-transform: uppercase;
cursor: default;
}
.getting-started__wrapper,
.getting-started,
.flex-spacer {
background: #383144;
}
.getting-started__wrapper {
flex: 0 0 auto;
}
.flex-spacer {
flex: 1 1 auto;
}
.getting-started {
color: #d5bdd6;
overflow: auto;
}
.getting-started__footer {
flex: 0 0 auto;
padding: 10px;
padding-top: 20px;
z-index: 1;
}
.getting-started__footer ul {
margin-bottom: 10px;
}
.getting-started__footer ul li {
display: inline;
}
.getting-started__footer p {
color: #d5bdd6;
font-size: 13px;
margin-bottom: 20px;
}
.getting-started__footer p a {
color: #d5bdd6;
text-decoration: underline;
}
.getting-started__footer a {
text-decoration: none;
color: #e6e6fa;
}
.getting-started__footer a:hover,
.getting-started__footer a:focus,
.getting-started__footer a:active {
text-decoration: underline;
}
.getting-started__trends {
flex: 0 1 auto;
opacity: 1;
animation: fade 150ms linear;
margin-top: 10px;
}
.getting-started__trends h4 {
font-size: 12px;
text-transform: uppercase;
color: #e6e6fa;
padding: 10px;
font-weight: 500;
border-bottom: 1px solid #4c425c;
}
@media screen and (max-height: 810px) {
.getting-started__trends .trends__item:nth-child(3) {
display: none;
}
}
@media screen and (max-height: 720px) {
.getting-started__trends .trends__item:nth-child(2) {
display: none;
}
}
@media screen and (max-height: 670px) {
.getting-started__trends {
display: none;
}
}
.getting-started__trends .trends__item {
border-bottom: 0;
padding: 10px;
}
.getting-started__trends .trends__item__current {
color: #e6e6fa;
}
.keyboard-shortcuts {
padding: 8px 0 0;
overflow: hidden;
}
.keyboard-shortcuts thead {
position: absolute;
left: -9999px;
}
.keyboard-shortcuts td {
padding: 0 10px 8px;
}
.keyboard-shortcuts kbd {
display: inline-block;
padding: 3px 5px;
background-color: #4c425c;
border: 1px solid #2e2838;
}
.setting-text {
display: block;
box-sizing: border-box;
width: 100%;
margin: 0;
color: #383144;
background: #fff;
padding: 10px;
font-family: inherit;
font-size: 14px;
resize: vertical;
border: 0;
outline: 0;
border-radius: 4px;
}
.setting-text:focus {
outline: 0;
}
@media screen and (max-width: 600px) {
.setting-text {
font-size: 16px;
}
}
button.icon-button i.fa-retweet {
background-position: 0 0;
height: 19px;
transition: background-position 0.9s steps(10);
transition-duration: 0s;
vertical-align: middle;
width: 22px;
}
button.icon-button i.fa-retweet::before {
display: none !important;
}
button.icon-button.active i.fa-retweet {
transition-duration: .9s;
background-position: 0 100%;
}
.reduce-motion button.icon-button i.fa-retweet,
.reduce-motion button.icon-button.active i.fa-retweet {
transition: none;
}
.status-card {
position: relative;
display: flex;
font-size: 14px;
border: 1px solid #4c425c;
border-radius: 4px;
color: #d5bdd6;
margin-top: 14px;
text-decoration: none;
overflow: hidden;
}
.status-card__actions {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
}
.status-card__actions > div {
background: rgba(0, 0, 0, 0.6);
border-radius: 8px;
padding: 12px 9px;
flex: 0 0 auto;
display: flex;
justify-content: center;
align-items: center;
}
.status-card__actions button,
.status-card__actions a {
display: inline;
color: #dbd3ff;
background: transparent;
border: 0;
padding: 0 8px;
text-decoration: none;
font-size: 18px;
line-height: 18px;
}
.status-card__actions button:hover,
.status-card__actions button:active,
.status-card__actions button:focus,
.status-card__actions a:hover,
.status-card__actions a:active,
.status-card__actions a:focus {
color: #fff;
}
.status-card__actions a {
font-size: 19px;
position: relative;
bottom: -1px;
}
a.status-card {
cursor: pointer;
}
a.status-card:hover {
background: #4c425c;
}
.status-card-photo {
cursor: zoom-in;
display: block;
text-decoration: none;
width: 100%;
height: auto;
margin: 0;
}
.status-card-video iframe {
width: 100%;
height: 100%;
}
.status-card__title {
display: block;
font-weight: 500;
margin-bottom: 5px;
color: #e6e6fa;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-decoration: none;
}
.status-card__content {
flex: 1 1 auto;
overflow: hidden;
padding: 14px 14px 14px 8px;
}
.status-card__description {
color: #e6e6fa;
}
.status-card__host {
display: block;
margin-top: 5px;
font-size: 13px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.status-card__image {
flex: 0 0 100px;
background: #4c425c;
position: relative;
}
.status-card__image > .fa {
font-size: 21px;
position: absolute;
transform-origin: 50% 50%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.status-card.horizontal {
display: block;
}
.status-card.horizontal .status-card__image {
width: 100%;
}
.status-card.horizontal .status-card__image-image,
.status-card.horizontal .status-card__image-preview {
border-radius: 4px 4px 0 0;
}
.status-card.horizontal .status-card__title {
white-space: inherit;
}
.status-card.compact {
border-color: #423a50;
}
.status-card.compact.interactive {
border: 0;
}
.status-card.compact .status-card__content {
padding: 8px;
padding-top: 10px;
}
.status-card.compact .status-card__title {
white-space: nowrap;
}
.status-card.compact .status-card__image {
flex: 0 0 60px;
}
a.status-card.compact:hover {
background-color: #423a50;
}
.status-card__image-image {
border-radius: 4px 0 0 4px;
display: block;
margin: 0;
width: 100%;
height: 100%;
object-fit: cover;
background-size: cover;
background-position: center center;
}
.status-card__image-preview {
border-radius: 4px 0 0 4px;
display: block;
margin: 0;
width: 100%;
height: 100%;
object-fit: fill;
position: absolute;
top: 0;
left: 0;
z-index: 0;
background: #000;
}
.status-card__image-preview--hidden {
display: none;
}
.load-more {
display: block;
color: #d5bdd6;
background-color: transparent;
border: 0;
font-size: inherit;
text-align: center;
line-height: inherit;
margin: 0;
padding: 15px;
box-sizing: border-box;
width: 100%;
clear: both;
text-decoration: none;
}
.load-more:hover {
background: #3d354a;
}
.load-gap {
border-bottom: 1px solid #4c425c;
}
.timeline-hint {
text-align: center;
color: #e6e6fa;
padding: 15px;
box-sizing: border-box;
width: 100%;
cursor: default;
}
.timeline-hint strong {
font-weight: 500;
}
.timeline-hint a {
color: #b7a2cc;
text-decoration: none;
}
.timeline-hint a:hover,
.timeline-hint a:focus,
.timeline-hint a:active {
text-decoration: underline;
color: #c1afd3;
}
.regeneration-indicator {
text-align: center;
font-size: 16px;
font-weight: 500;
color: #d5bdd6;
background: #383144;
cursor: default;
display: flex;
flex: 1 1 auto;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 20px;
}
.regeneration-indicator__figure,
.regeneration-indicator__figure img {
display: block;
width: auto;
height: 160px;
margin: 0;
}
.regeneration-indicator--without-header {
padding-top: 68px;
}
.regeneration-indicator__label {
margin-top: 30px;
}
.regeneration-indicator__label strong {
display: block;
margin-bottom: 10px;
color: #d5bdd6;
}
.regeneration-indicator__label span {
font-size: 15px;
font-weight: 400;
}
.column-header__wrapper {
position: relative;
flex: 0 0 auto;
z-index: 1;
}
.column-header__wrapper.active {
box-shadow: 0 1px 0 rgba(162, 136, 189, 0.3);
}
.column-header__wrapper.active::before {
display: block;
content: "";
position: absolute;
bottom: -13px;
left: 0;
right: 0;
margin: 0 auto;
width: 60%;
pointer-events: none;
height: 28px;
z-index: 1;
background: radial-gradient(ellipse, rgba(162, 136, 189, 0.23) 0%, rgba(162, 136, 189, 0) 60%);
}
.column-header__wrapper .announcements {
z-index: 1;
position: relative;
}
.column-header {
display: flex;
font-size: 16px;
background: #423a50;
flex: 0 0 auto;
cursor: pointer;
position: relative;
z-index: 2;
outline: 0;
overflow: hidden;
}
.column-header > button {
margin: 0;
border: 0;
padding: 15px 0 15px 15px;
color: inherit;
background: transparent;
font: inherit;
text-align: left;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
flex: 1;
}
.column-header > .column-header__back-button {
color: #a288bd;
}
.column-header.active .column-header__icon {
color: #a288bd;
text-shadow: 0 0 10px rgba(162, 136, 189, 0.4);
}
.column-header:focus,
.column-header:active {
outline: 0;
}
.column-header__buttons {
height: 48px;
display: flex;
}
.column-header__links {
margin-bottom: 14px;
}
.column-header__links .text-btn {
margin-right: 10px;
}
.column-header__button {
background: #423a50;
border: 0;
color: #e6e6fa;
cursor: pointer;
font-size: 16px;
padding: 0 15px;
}
.column-header__button:hover {
color: #fff;
}
.column-header__button.active {
color: #fff;
background: #4c425c;
}
.column-header__button.active:hover {
color: #fff;
background: #4c425c;
}
.column-header__collapsible {
max-height: 70vh;
overflow: hidden;
overflow-y: auto;
color: #e6e6fa;
transition: max-height 150ms ease-in-out, opacity 300ms linear;
opacity: 1;
z-index: 1;
position: relative;
}
.column-header__collapsible.collapsed {
max-height: 0;
opacity: .5;
}
.column-header__collapsible.animating {
overflow-y: hidden;
}
.column-header__collapsible hr {
height: 0;
background: transparent;
border: 0;
border-top: 1px solid #554b68;
margin: 10px 0;
}
.column-header__collapsible-inner {
background: #4c425c;
padding: 15px;
}
.column-header__setting-btn:hover {
color: #e6e6fa;
text-decoration: underline;
}
.column-header__permission-btn {
display: inline;
font-weight: inherit;
text-decoration: underline;
}
.column-header__setting-arrows {
float: right;
}
.column-header__setting-arrows .column-header__setting-btn {
padding: 0 10px;
}
.column-header__setting-arrows .column-header__setting-btn:last-child {
padding-right: 0;
}
.text-btn {
display: inline-block;
padding: 0;
font-family: inherit;
font-size: inherit;
color: inherit;
border: 0;
background: transparent;
cursor: pointer;
}
.column-header__issue-btn {
color: #ff5050;
}
.column-header__issue-btn:hover {
color: #df405a;
text-decoration: underline;
}
.column-header__icon {
display: inline-block;
margin-right: 5px;
}
.loading-indicator {
color: #d5bdd6;
font-size: 12px;
font-weight: 400;
text-transform: uppercase;
overflow: visible;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.loading-indicator span {
display: block;
float: left;
transform: translateX(-50%);
margin: 82px 0 0 50%;
white-space: nowrap;
}
.loading-indicator__figure {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 42px;
height: 42px;
box-sizing: border-box;
background-color: transparent;
border: 0 solid #776991;
border-width: 6px;
border-radius: 50%;
}
.no-reduce-motion .loading-indicator span {
animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
}
.no-reduce-motion .loading-indicator__figure {
animation: loader-figure 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
}
@keyframes spring-rotate-in {
0% {
transform: rotate(0deg);
}
30% {
transform: rotate(-484.8deg);
}
60% {
transform: rotate(-316.7deg);
}
90% {
transform: rotate(-375deg);
}
100% {
transform: rotate(-360deg);
}
}
@keyframes spring-rotate-out {
0% {
transform: rotate(-360deg);
}
30% {
transform: rotate(124.8deg);
}
60% {
transform: rotate(-43.27deg);
}
90% {
transform: rotate(15deg);
}
100% {
transform: rotate(0deg);
}
}
@keyframes loader-figure {
0% {
width: 0;
height: 0;
background-color: #776991;
}
29% {
background-color: #776991;
}
30% {
width: 42px;
height: 42px;
background-color: transparent;
border-width: 21px;
opacity: 1;
}
100% {
width: 42px;
height: 42px;
border-width: 0;
opacity: 0;
background-color: transparent;
}
}
@keyframes loader-label {
0% {
opacity: .25;
}
30% {
opacity: 1;
}
100% {
opacity: .25;
}
}
.video-error-cover {
align-items: center;
background: #000;
color: #fff;
cursor: pointer;
display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
margin-top: 8px;
position: relative;
text-align: center;
z-index: 100;
}
.media-spoiler {
background: #000;
color: #e6e6fa;
border: 0;
padding: 0;
width: 100%;
height: 100%;
border-radius: 4px;
appearance: none;
}
.media-spoiler:hover,
.media-spoiler:active,
.media-spoiler:focus {
padding: 0;
color: #fff;
}
.media-spoiler__warning {
display: block;
font-size: 14px;
}
.media-spoiler__trigger {
display: block;
font-size: 11px;
font-weight: 700;
}
.spoiler-button {
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
z-index: 100;
}
.spoiler-button--minified {
display: block;
left: 4px;
top: 4px;
width: auto;
height: auto;
}
.spoiler-button--click-thru {
pointer-events: none;
}
.spoiler-button--hidden {
display: none;
}
.spoiler-button__overlay {
display: block;
background: transparent;
width: 100%;
height: 100%;
border: 0;
}
.spoiler-button__overlay__label {
display: inline-block;
background: rgba(0, 0, 0, 0.5);
border-radius: 8px;
padding: 8px 12px;
color: #fff;
font-weight: 500;
font-size: 14px;
}
.spoiler-button__overlay:hover .spoiler-button__overlay__label,
.spoiler-button__overlay:focus .spoiler-button__overlay__label,
.spoiler-button__overlay:active .spoiler-button__overlay__label {
background: rgba(0, 0, 0, 0.8);
}
.spoiler-button__overlay:disabled .spoiler-button__overlay__label {
background: rgba(0, 0, 0, 0.5);
}
.modal-container--preloader {
background: #4c425c;
}
.account--panel {
background: #423a50;
border-top: 1px solid #4c425c;
border-bottom: 1px solid #4c425c;
display: flex;
flex-direction: row;
padding: 10px 0;
}
.account--panel__button,
.detailed-status__button {
flex: 1 1 auto;
text-align: center;
}
.column-settings__outer {
background: #4c425c;
padding: 15px;
}
.column-settings__section {
color: #e6e6fa;
cursor: default;
display: block;
font-weight: 500;
margin-bottom: 10px;
}
.column-settings__row--with-margin {
margin-bottom: 15px;
}
.column-settings__hashtags .column-settings__row {
margin-bottom: 15px;
}
.column-settings__hashtags .column-select__control {
outline: 0;
box-sizing: border-box;
width: 100%;
border: 0;
box-shadow: none;
font-family: inherit;
background: #383144;
color: #e6e6fa;
font-size: 14px;
margin: 0;
}
.column-settings__hashtags .column-select__control::placeholder {
color: #f7f7fd;
}
.column-settings__hashtags .column-select__control::-moz-focus-inner {
border: 0;
}
.column-settings__hashtags .column-select__control::-moz-focus-inner,
.column-settings__hashtags .column-select__control:focus,
.column-settings__hashtags .column-select__control:active {
outline: 0 !important;
}
.column-settings__hashtags .column-select__control:focus {
background: #423a50;
}
@media screen and (max-width: 600px) {
.column-settings__hashtags .column-select__control {
font-size: 16px;
}
}
.column-settings__hashtags .column-select__placeholder {
color: #d5bdd6;
padding-left: 2px;
font-size: 12px;
}
.column-settings__hashtags .column-select__value-container {
padding-left: 6px;
}
.column-settings__hashtags .column-select__multi-value {
background: #4c425c;
}
.column-settings__hashtags .column-select__multi-value__remove {
cursor: pointer;
}
.column-settings__hashtags .column-select__multi-value__remove:hover,
.column-settings__hashtags .column-select__multi-value__remove:active,
.column-settings__hashtags .column-select__multi-value__remove:focus {
background: #554b68;
color: #f7f7fd;
}
.column-settings__hashtags .column-select__multi-value__label,
.column-settings__hashtags .column-select__input {
color: #e6e6fa;
}
.column-settings__hashtags .column-select__clear-indicator,
.column-settings__hashtags .column-select__dropdown-indicator {
cursor: pointer;
transition: none;
color: #d5bdd6;
}
.column-settings__hashtags .column-select__clear-indicator:hover,
.column-settings__hashtags .column-select__clear-indicator:active,
.column-settings__hashtags .column-select__clear-indicator:focus,
.column-settings__hashtags .column-select__dropdown-indicator:hover,
.column-settings__hashtags .column-select__dropdown-indicator:active,
.column-settings__hashtags .column-select__dropdown-indicator:focus {
color: #ddcade;
}
.column-settings__hashtags .column-select__indicator-separator {
background-color: #4c425c;
}
.column-settings__hashtags .column-select__menu {
background: #fff;
border-radius: 4px;
padding: 10px 14px;
padding-bottom: 14px;
margin-top: 10px;
color: #e6e6fa;
box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.4);
padding: 0;
background: #dbd3ff;
}
.column-settings__hashtags .column-select__menu h4 {
text-transform: uppercase;
color: #e6e6fa;
font-size: 13px;
font-weight: 500;
margin-bottom: 10px;
}
.column-settings__hashtags .column-select__menu li {
padding: 4px 0;
}
.column-settings__hashtags .column-select__menu ul {
margin-bottom: 10px;
}
.column-settings__hashtags .column-select__menu em {
font-weight: 500;
color: #383144;
}
.column-settings__hashtags .column-select__menu-list {
padding: 6px;
}
.column-settings__hashtags .column-select__option {
color: #383144;
border-radius: 4px;
font-size: 14px;
}
.column-settings__hashtags .column-select__option--is-focused,
.column-settings__hashtags .column-select__option--is-selected {
background: #b1a0ff;
}
.column-settings__row .text-btn:not(.column-header__permission-btn) {
margin-bottom: 15px;
}
.relationship-tag {
color: #fff;
margin-bottom: 4px;
display: block;
background-color: #000;
text-transform: uppercase;
font-size: 11px;
font-weight: 500;
padding: 4px;
border-radius: 4px;
opacity: .7;
}
.relationship-tag:hover {
opacity: 1;
}
.setting-toggle {
display: block;
line-height: 24px;
}
.setting-toggle__label {
color: #e6e6fa;
display: inline-block;
margin-bottom: 14px;
margin-left: 8px;
vertical-align: middle;
}
.empty-column-indicator,
.error-column,
.follow_requests-unlocked_explanation {
color: #d5bdd6;
background: #383144;
text-align: center;
padding: 20px;
font-size: 15px;
font-weight: 400;
cursor: default;
display: flex;
flex: 1 1 auto;
align-items: center;
justify-content: center;
}
@supports (display: grid) {
.empty-column-indicator,
.error-column,
.follow_requests-unlocked_explanation {
contain: strict;
}
}
.empty-column-indicator > span,
.error-column > span,
.follow_requests-unlocked_explanation > span {
max-width: 400px;
}
.empty-column-indicator a,
.error-column a,
.follow_requests-unlocked_explanation a {
color: #a288bd;
text-decoration: none;
}
.empty-column-indicator a:hover,
.error-column a:hover,
.follow_requests-unlocked_explanation a:hover {
text-decoration: underline;
}
.follow_requests-unlocked_explanation {
background: #2e2838;
contain: initial;
}
.error-column {
flex-direction: column;
}
@keyframes heartbeat {
from {
transform: scale(1);
animation-timing-function: ease-out;
}
10% {
transform: scale(0.91);
animation-timing-function: ease-in;
}
17% {
transform: scale(0.98);
animation-timing-function: ease-out;
}
33% {
transform: scale(0.87);
animation-timing-function: ease-in;
}
45% {
transform: scale(1);
animation-timing-function: ease-out;
}
}
.no-reduce-motion .pulse-loading {
transform-origin: center center;
animation: heartbeat 1.5s ease-in-out infinite both;
}
@keyframes shake-bottom {
0%,
100% {
transform: rotate(0deg);
transform-origin: 50% 100%;
}
10% {
transform: rotate(2deg);
}
20%,
40%,
60% {
transform: rotate(-4deg);
}
30%,
50%,
70% {
transform: rotate(4deg);
}
80% {
transform: rotate(-2deg);
}
90% {
transform: rotate(2deg);
}
}
.no-reduce-motion .shake-bottom {
transform-origin: 50% 100%;
animation: shake-bottom 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) 2s 2 both;
}
.emoji-picker-dropdown__menu {
background: #fff;
position: absolute;
box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.4);
border-radius: 4px;
margin-top: 5px;
z-index: 2;
}
.emoji-picker-dropdown__menu .emoji-mart-scroll {
transition: opacity 200ms ease;
}
.emoji-picker-dropdown__menu.selecting .emoji-mart-scroll {
opacity: .5;
}
.emoji-picker-dropdown__modifiers {
position: absolute;
top: 60px;
right: 11px;
cursor: pointer;
}
.emoji-picker-dropdown__modifiers__menu {
position: absolute;
z-index: 4;
top: -4px;
left: -8px;
background: #fff;
border-radius: 4px;
box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.2);
overflow: hidden;
}
.emoji-picker-dropdown__modifiers__menu button {
display: block;
cursor: pointer;
border: 0;
padding: 4px 8px;
background: transparent;
}
.emoji-picker-dropdown__modifiers__menu button:hover,
.emoji-picker-dropdown__modifiers__menu button:focus,
.emoji-picker-dropdown__modifiers__menu button:active {
background: rgba(219, 211, 255, 0.4);
}
.emoji-picker-dropdown__modifiers__menu .emoji-mart-emoji {
height: 22px;
}
.emoji-mart-emoji span {
background-repeat: no-repeat;
}
.upload-area {
align-items: center;
background: rgba(0, 0, 0, 0.8);
display: flex;
height: 100%;
justify-content: center;
left: 0;
opacity: 0;
position: absolute;
top: 0;
visibility: hidden;
width: 100%;
z-index: 2000;
}
.upload-area * {
pointer-events: none;
}
.upload-area__drop {
width: 320px;
height: 160px;
display: flex;
box-sizing: border-box;
position: relative;
padding: 8px;
}
.upload-area__background {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -1;
border-radius: 4px;
background: #383144;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
.upload-area__content {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
color: #dbd3ff;
font-size: 18px;
font-weight: 500;
border: 2px dashed #d5bdd6;
border-radius: 4px;
}
.upload-progress {
padding: 10px;
color: #d5bdd6;
overflow: hidden;
display: flex;
}
.upload-progress .fa {
font-size: 34px;
margin-right: 10px;
}
.upload-progress span {
font-size: 12px;
text-transform: uppercase;
font-weight: 500;
display: block;
}
.upload-progess__message {
flex: 1 1 auto;
}
.upload-progress__backdrop {
width: 100%;
height: 6px;
border-radius: 6px;
background: #d5bdd6;
position: relative;
margin-top: 5px;
}
.upload-progress__tracker {
position: absolute;
left: 0;
top: 0;
height: 6px;
background: #a288bd;
border-radius: 6px;
}
.emoji-button {
display: block;
padding: 5px 5px 2px 2px;
outline: 0;
cursor: pointer;
}
.emoji-button:active,
.emoji-button:focus {
outline: 0 !important;
}
.emoji-button img {
filter: grayscale(100%);
opacity: .8;
display: block;
margin: 0;
width: 22px;
height: 22px;
}
.emoji-button:hover img,
.emoji-button:active img,
.emoji-button:focus img {
opacity: 1;
filter: none;
}
.dropdown--active .emoji-button img {
opacity: 1;
filter: none;
}
.privacy-dropdown__dropdown {
position: absolute;
background: #fff;
box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.4);
border-radius: 4px;
margin-left: 40px;
overflow: hidden;
z-index: 2;
}
.privacy-dropdown__dropdown.top {
transform-origin: 50% 100%;
}
.privacy-dropdown__dropdown.bottom {
transform-origin: 50% 0;
}
.modal-root__container .privacy-dropdown {
flex-grow: 0;
}
.modal-root__container .privacy-dropdown__dropdown {
pointer-events: auto;
z-index: 9999;
}
.privacy-dropdown__option {
color: #383144;
padding: 10px;
cursor: pointer;
display: flex;
}
.privacy-dropdown__option:hover,
.privacy-dropdown__option.active {
background: #a288bd;
color: #fff;
outline: 0;
}
.privacy-dropdown__option:hover .privacy-dropdown__option__content,
.privacy-dropdown__option.active .privacy-dropdown__option__content {
color: #fff;
}
.privacy-dropdown__option:hover .privacy-dropdown__option__content strong,
.privacy-dropdown__option.active .privacy-dropdown__option__content strong {
color: #fff;
}
.privacy-dropdown__option.active:hover {
background: #ac95c4;
}
.privacy-dropdown__option__icon {
display: flex;
align-items: center;
justify-content: center;
margin-right: 10px;
}
.privacy-dropdown__option__content {
flex: 1 1 auto;
color: #d5bdd6;
}
.privacy-dropdown__option__content strong {
font-weight: 500;
display: block;
color: #383144;
}
.privacy-dropdown__option__content strong:lang(ja) {
font-weight: 700;
}
.privacy-dropdown__option__content strong:lang(ko) {
font-weight: 700;
}
.privacy-dropdown__option__content strong:lang(zh-CN) {
font-weight: 700;
}
.privacy-dropdown__option__content strong:lang(zh-HK) {
font-weight: 700;
}
.privacy-dropdown__option__content strong:lang(zh-TW) {
font-weight: 700;
}
.privacy-dropdown.active .privacy-dropdown__value {
background: #fff;
border-radius: 4px 4px 0 0;
box-shadow: 0 -4px 4px rgba(0, 0, 0, 0.1);
}
.privacy-dropdown.active .privacy-dropdown__value .icon-button {
transition: none;
}
.privacy-dropdown.active .privacy-dropdown__value.active {
background: #a288bd;
}
.privacy-dropdown.active .privacy-dropdown__value.active .icon-button {
color: #fff;
}
.privacy-dropdown.active.top .privacy-dropdown__value {
border-radius: 0 0 4px 4px;
}
.privacy-dropdown.active .privacy-dropdown__dropdown {
display: block;
box-shadow: 2px 4px 6px rgba(0, 0, 0, 0.1);
}
.search {
position: relative;
}
.search__input {
outline: 0;
box-sizing: border-box;
width: 100%;
border: 0;
box-shadow: none;
font-family: inherit;
background: #383144;
color: #e6e6fa;
font-size: 14px;
margin: 0;
display: block;
padding: 15px;
padding-right: 30px;
line-height: 18px;
font-size: 16px;
}
.search__input::placeholder {
color: #f7f7fd;
}
.search__input::-moz-focus-inner {
border: 0;
}
.search__input::-moz-focus-inner,
.search__input:focus,
.search__input:active {
outline: 0 !important;
}
.search__input:focus {
background: #423a50;
}
@media screen and (max-width: 600px) {
.search__input {
font-size: 16px;
}
}
.search__icon::-moz-focus-inner {
border: 0;
}
.search__icon::-moz-focus-inner,
.search__icon:focus {
outline: 0 !important;
}
.search__icon .fa {
position: absolute;
top: 16px;
right: 10px;
z-index: 2;
display: inline-block;
opacity: 0;
transition: all 100ms linear;
transition-property: transform, opacity;
font-size: 18px;
width: 18px;
height: 18px;
color: #dbd3ff;
cursor: default;
pointer-events: none;
}
.search__icon .fa.active {
pointer-events: auto;
opacity: .3;
}
.search__icon .fa-search {
transform: rotate(90deg);
}
.search__icon .fa-search.active {
pointer-events: none;
transform: rotate(0deg);
}
.search__icon .fa-times-circle {
top: 17px;
transform: rotate(0deg);
color: #d5bdd6;
cursor: pointer;
}
.search__icon .fa-times-circle.active {
transform: rotate(90deg);
}
.search__icon .fa-times-circle:hover {
color: #e3d3e4;
}
.search-results__header {
color: #d5bdd6;
background: #3d354a;
padding: 15px;
font-weight: 500;
font-size: 16px;
cursor: default;
}
.search-results__header .fa {
display: inline-block;
margin-right: 5px;
}
.search-results__section {
margin-bottom: 5px;
}
.search-results__section h5 {
background: #2e2838;
border-bottom: 1px solid #4c425c;
cursor: default;
display: flex;
padding: 15px;
font-weight: 500;
font-size: 16px;
color: #d5bdd6;
}
.search-results__section h5 .fa {
display: inline-block;
margin-right: 5px;
}
.search-results__section .account:last-child,
.search-results__section > div:last-child .status {
border-bottom: 0;
}
.search-results__hashtag {
display: block;
padding: 10px;
color: #dbd3ff;
text-decoration: none;
}
.search-results__hashtag:hover,
.search-results__hashtag:active,
.search-results__hashtag:focus {
color: #ece7ff;
text-decoration: underline;
}
.search-results__info {
padding: 20px;
color: #e6e6fa;
text-align: center;
}
.modal-root {
position: relative;
z-index: 9999;
}
.modal-root__overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.7);
transition: background .5s;
}
.modal-root__container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
align-content: space-around;
z-index: 9999;
pointer-events: none;
user-select: none;
}
.modal-root__modal {
pointer-events: auto;
display: flex;
z-index: 9999;
}
.video-modal__container {
max-width: 100vw;
max-height: 100vh;
}
.audio-modal__container {
width: 50vw;
}
.media-modal {
width: 100%;
height: 100%;
position: relative;
}
.media-modal__close,
.media-modal__zoom-button {
color: rgba(255, 255, 255, 0.7);
}
.media-modal__close:hover,
.media-modal__close:focus,
.media-modal__close:active,
.media-modal__zoom-button:hover,
.media-modal__zoom-button:focus,
.media-modal__zoom-button:active {
color: #fff;
background-color: rgba(255, 255, 255, 0.15);
}
.media-modal__close:focus,
.media-modal__zoom-button:focus {
background-color: rgba(255, 255, 255, 0.3);
}
.media-modal__closer {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.media-modal__navigation {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
pointer-events: none;
transition: opacity .3s linear;
will-change: opacity;
}
.media-modal__navigation * {
pointer-events: auto;
}
.media-modal__navigation.media-modal__navigation--hidden {
opacity: 0;
}
.media-modal__navigation.media-modal__navigation--hidden * {
pointer-events: none;
}
.media-modal__nav {
background: transparent;
box-sizing: border-box;
border: 0;
color: rgba(255, 255, 255, 0.7);
cursor: pointer;
display: flex;
align-items: center;
font-size: 24px;
height: 20vmax;
margin: auto 0;
padding: 30px 15px;
position: absolute;
top: 0;
bottom: 0;
}
.media-modal__nav:hover,
.media-modal__nav:focus,
.media-modal__nav:active {
color: #fff;
}
.media-modal__nav--left {
left: 0;
}
.media-modal__nav--right {
right: 0;
}
.media-modal__overlay {
max-width: 600px;
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: 0 auto;
}
.media-modal__overlay .picture-in-picture__footer {
border-radius: 0;
background: transparent;
padding: 20px 0;
}
.media-modal__overlay .picture-in-picture__footer .icon-button {
color: #fff;
}
.media-modal__overlay .picture-in-picture__footer .icon-button:hover,
.media-modal__overlay .picture-in-picture__footer .icon-button:focus,
.media-modal__overlay .picture-in-picture__footer .icon-button:active {
color: #fff;
background-color: rgba(255, 255, 255, 0.15);
}
.media-modal__overlay .picture-in-picture__footer .icon-button:focus {
background-color: rgba(255, 255, 255, 0.3);
}
.media-modal__overlay .picture-in-picture__footer .icon-button.active {
color: #a288bd;
}
.media-modal__overlay .picture-in-picture__footer .icon-button.active:hover,
.media-modal__overlay .picture-in-picture__footer .icon-button.active:focus,
.media-modal__overlay .picture-in-picture__footer .icon-button.active:active {
background: rgba(162, 136, 189, 0.15);
}
.media-modal__overlay .picture-in-picture__footer .icon-button.active:focus {
background: rgba(162, 136, 189, 0.3);
}
.media-modal__overlay .picture-in-picture__footer .icon-button.star-icon.active {
color: #ca8f04;
}
.media-modal__overlay .picture-in-picture__footer .icon-button.star-icon.active:hover,
.media-modal__overlay .picture-in-picture__footer .icon-button.star-icon.active:focus,
.media-modal__overlay .picture-in-picture__footer .icon-button.star-icon.active:active {
background: rgba(202, 143, 4, 0.15);
}
.media-modal__overlay .picture-in-picture__footer .icon-button.star-icon.active:focus {
background: rgba(202, 143, 4, 0.3);
}
.media-modal__pagination {
display: flex;
justify-content: center;
margin-bottom: 20px;
}
.media-modal__page-dot {
flex: 0 0 auto;
background-color: #fff;
opacity: .4;
height: 6px;
width: 6px;
border-radius: 50%;
margin: 0 4px;
padding: 0;
border: 0;
font-size: 0;
transition: opacity .2s ease-in-out;
}
.media-modal__page-dot.active {
opacity: 1;
}
.media-modal__close {
position: absolute;
right: 8px;
top: 8px;
z-index: 100;
}
.media-modal__zoom-button {
position: absolute;
right: 64px;
top: 8px;
z-index: 100;
pointer-events: auto;
transition: opacity .3s linear;
will-change: opacity;
}
.media-modal__zoom-button--hidden {
pointer-events: none;
opacity: 0;
}
.onboarding-modal,
.error-modal,
.embed-modal {
background: #dbd3ff;
color: #383144;
border-radius: 8px;
overflow: hidden;
display: flex;
flex-direction: column;
}
.error-modal__body {
height: 80vh;
width: 80vw;
max-width: 520px;
max-height: 420px;
position: relative;
}
.error-modal__body > div {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 25px;
display: none;
flex-direction: column;
align-items: center;
justify-content: center;
display: flex;
opacity: 0;
user-select: text;
}
.error-modal__body {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
.onboarding-modal__paginator,
.error-modal__footer {
flex: 0 0 auto;
background: #baaaff;
display: flex;
padding: 25px;
}
.onboarding-modal__paginator > div,
.error-modal__footer > div {
min-width: 33px;
}
.onboarding-modal__paginator .onboarding-modal__nav,
.onboarding-modal__paginator .error-modal__nav,
.error-modal__footer .onboarding-modal__nav,
.error-modal__footer .error-modal__nav {
color: #d5bdd6;
border: 0;
font-size: 14px;
font-weight: 500;
padding: 10px 25px;
line-height: inherit;
height: auto;
margin: -10px;
border-radius: 4px;
background-color: transparent;
}
.onboarding-modal__paginator .onboarding-modal__nav:hover,
.onboarding-modal__paginator .onboarding-modal__nav:focus,
.onboarding-modal__paginator .onboarding-modal__nav:active,
.onboarding-modal__paginator .error-modal__nav:hover,
.onboarding-modal__paginator .error-modal__nav:focus,
.onboarding-modal__paginator .error-modal__nav:active,
.error-modal__footer .onboarding-modal__nav:hover,
.error-modal__footer .onboarding-modal__nav:focus,
.error-modal__footer .onboarding-modal__nav:active,
.error-modal__footer .error-modal__nav:hover,
.error-modal__footer .error-modal__nav:focus,
.error-modal__footer .error-modal__nav:active {
color: #cdb0ce;
background-color: #9881ff;
}
.onboarding-modal__paginator .onboarding-modal__nav.onboarding-modal__done,
.onboarding-modal__paginator .onboarding-modal__nav.onboarding-modal__next,
.onboarding-modal__paginator .error-modal__nav.onboarding-modal__done,
.onboarding-modal__paginator .error-modal__nav.onboarding-modal__next,
.error-modal__footer .onboarding-modal__nav.onboarding-modal__done,
.error-modal__footer .onboarding-modal__nav.onboarding-modal__next,
.error-modal__footer .error-modal__nav.onboarding-modal__done,
.error-modal__footer .error-modal__nav.onboarding-modal__next {
color: #383144;
}
.onboarding-modal__paginator .onboarding-modal__nav.onboarding-modal__done:hover,
.onboarding-modal__paginator .onboarding-modal__nav.onboarding-modal__done:focus,
.onboarding-modal__paginator .onboarding-modal__nav.onboarding-modal__done:active,
.onboarding-modal__paginator .onboarding-modal__nav.onboarding-modal__next:hover,
.onboarding-modal__paginator .onboarding-modal__nav.onboarding-modal__next:focus,
.onboarding-modal__paginator .onboarding-modal__nav.onboarding-modal__next:active,
.onboarding-modal__paginator .error-modal__nav.onboarding-modal__done:hover,
.onboarding-modal__paginator .error-modal__nav.onboarding-modal__done:focus,
.onboarding-modal__paginator .error-modal__nav.onboarding-modal__done:active,
.onboarding-modal__paginator .error-modal__nav.onboarding-modal__next:hover,
.onboarding-modal__paginator .error-modal__nav.onboarding-modal__next:focus,
.onboarding-modal__paginator .error-modal__nav.onboarding-modal__next:active,
.error-modal__footer .onboarding-modal__nav.onboarding-modal__done:hover,
.error-modal__footer .onboarding-modal__nav.onboarding-modal__done:focus,
.error-modal__footer .onboarding-modal__nav.onboarding-modal__done:active,
.error-modal__footer .onboarding-modal__nav.onboarding-modal__next:hover,
.error-modal__footer .onboarding-modal__nav.onboarding-modal__next:focus,
.error-modal__footer .onboarding-modal__nav.onboarding-modal__next:active,
.error-modal__footer .error-modal__nav.onboarding-modal__done:hover,
.error-modal__footer .error-modal__nav.onboarding-modal__done:focus,
.error-modal__footer .error-modal__nav.onboarding-modal__done:active,
.error-modal__footer .error-modal__nav.onboarding-modal__next:hover,
.error-modal__footer .error-modal__nav.onboarding-modal__next:focus,
.error-modal__footer .error-modal__nav.onboarding-modal__next:active {
color: #423a50;
}
.error-modal__footer {
justify-content: center;
}
.display-case {
text-align: center;
font-size: 15px;
margin-bottom: 15px;
}
.display-case__label {
font-weight: 500;
color: #383144;
margin-bottom: 5px;
text-transform: uppercase;
font-size: 12px;
}
.display-case__case {
background: #383144;
color: #dbd3ff;
font-weight: 500;
padding: 10px;
border-radius: 4px;
}
.onboard-sliders {
display: inline-block;
max-width: 30px;
max-height: auto;
margin-left: 10px;
}
.boost-modal,
.confirmation-modal,
.report-modal,
.actions-modal,
.mute-modal,
.block-modal {
background: #fcfcff;
color: #383144;
border-radius: 8px;
overflow: hidden;
max-width: 90vw;
width: 480px;
position: relative;
flex-direction: column;
}
.boost-modal .status__display-name,
.confirmation-modal .status__display-name,
.report-modal .status__display-name,
.actions-modal .status__display-name,
.mute-modal .status__display-name,
.block-modal .status__display-name {
display: block;
max-width: 100%;
padding-right: 25px;
}
.boost-modal .status__avatar,
.confirmation-modal .status__avatar,
.report-modal .status__avatar,
.actions-modal .status__avatar,
.mute-modal .status__avatar,
.block-modal .status__avatar {
height: 28px;
left: 10px;
position: absolute;
top: 10px;
width: 48px;
}
.boost-modal .status__content__spoiler-link,
.confirmation-modal .status__content__spoiler-link,
.report-modal .status__content__spoiler-link,
.actions-modal .status__content__spoiler-link,
.mute-modal .status__content__spoiler-link,
.block-modal .status__content__spoiler-link {
color: #fcfcff;
}
.actions-modal .status {
background: #fff;
border-bottom-color: #dbd3ff;
padding-top: 10px;
padding-bottom: 10px;
}
.actions-modal .dropdown-menu__separator {
border-bottom-color: #dbd3ff;
}
.boost-modal__container {
overflow-x: scroll;
padding: 10px;
}
.boost-modal__container .status {
user-select: text;
border-bottom: 0;
}
.boost-modal__action-bar,
.confirmation-modal__action-bar,
.mute-modal__action-bar,
.block-modal__action-bar {
display: flex;
justify-content: space-between;
background: #dbd3ff;
padding: 10px;
line-height: 36px;
}
.boost-modal__action-bar > div,
.confirmation-modal__action-bar > div,
.mute-modal__action-bar > div,
.block-modal__action-bar > div {
flex: 1 1 auto;
text-align: right;
color: #d5bdd6;
padding-right: 10px;
}
.boost-modal__action-bar .button,
.confirmation-modal__action-bar .button,
.mute-modal__action-bar .button,
.block-modal__action-bar .button {
flex: 0 0 auto;
}
.boost-modal__status-header {
font-size: 15px;
}
.boost-modal__status-time {
float: right;
font-size: 14px;
}
.mute-modal,
.block-modal {
line-height: 24px;
}
.mute-modal .react-toggle,
.block-modal .react-toggle {
vertical-align: middle;
}
.report-modal {
width: 90vw;
max-width: 700px;
}
.report-modal__container {
display: flex;
border-top: 1px solid #dbd3ff;
}
@media screen and (max-width: 480px) {
.report-modal__container {
flex-wrap: wrap;
overflow-y: auto;
}
}
.report-modal__statuses,
.report-modal__comment {
box-sizing: border-box;
width: 50%;
}
@media screen and (max-width: 480px) {
.report-modal__statuses,
.report-modal__comment {
width: 100%;
}
}
.report-modal__statuses,
.focal-point-modal__content {
flex: 1 1 auto;
min-height: 20vh;
max-height: 80vh;
overflow-y: auto;
overflow-x: hidden;
}
.report-modal__statuses .status__content a,
.focal-point-modal__content .status__content a {
color: #a288bd;
}
.report-modal__statuses .status__content,
.report-modal__statuses .status__content p,
.focal-point-modal__content .status__content,
.focal-point-modal__content .status__content p {
color: #383144;
}
@media screen and (max-width: 480px) {
.report-modal__statuses,
.focal-point-modal__content {
max-height: 10vh;
}
}
@media screen and (max-width: 480px) {
.focal-point-modal__content {
max-height: 40vh;
}
}
.setting-divider {
background: transparent;
border: 0;
margin: 0;
width: 100%;
height: 1px;
margin-bottom: 29px;
}
.report-modal__comment {
padding: 20px;
border-right: 1px solid #dbd3ff;
max-width: 320px;
}
.report-modal__comment p {
font-size: 14px;
line-height: 20px;
margin-bottom: 20px;
}
.report-modal__comment .setting-text {
display: block;
box-sizing: border-box;
width: 100%;
margin: 0;
color: #383144;
background: #fff;
padding: 10px;
font-family: inherit;
font-size: 14px;
resize: none;
border: 0;
outline: 0;
border-radius: 4px;
border: 1px solid #dbd3ff;
min-height: 100px;
max-height: 50vh;
margin-bottom: 10px;
}
.report-modal__comment .setting-text:focus {
border: 1px solid #baaaff;
}
.report-modal__comment .setting-text__wrapper {
background: #fff;
border: 1px solid #dbd3ff;
margin-bottom: 10px;
border-radius: 4px;
}
.report-modal__comment .setting-text__wrapper .setting-text {
border: 0;
margin-bottom: 0;
border-radius: 0;
}
.report-modal__comment .setting-text__wrapper .setting-text:focus {
border: 0;
}
.report-modal__comment .setting-text__wrapper__modifiers {
color: #383144;
font-family: inherit;
font-size: 14px;
background: #fff;
}
.report-modal__comment .setting-text__toolbar {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}
.report-modal__comment .setting-text-label {
display: block;
color: #383144;
font-size: 14px;
font-weight: 500;
margin-bottom: 10px;
}
.report-modal__comment .setting-toggle {
margin-top: 20px;
margin-bottom: 24px;
}
.report-modal__comment .setting-toggle__label {
color: #383144;
font-size: 14px;
}
@media screen and (max-width: 480px) {
.report-modal__comment {
padding: 10px;
max-width: 100%;
order: 2;
}
.report-modal__comment .setting-toggle {
margin-bottom: 4px;
}
}
.actions-modal {
max-height: 80vh;
max-width: 80vw;
}
.actions-modal .status {
overflow-y: auto;
max-height: 300px;
}
.actions-modal .actions-modal__item-label {
font-weight: 500;
}
.actions-modal ul {
overflow-y: auto;
flex-shrink: 0;
max-height: 80vh;
}
.actions-modal ul.with-status {
max-height: calc(80vh - 75px);
}
.actions-modal ul li:empty {
margin: 0;
}
.actions-modal ul li:not(:empty) a {
color: #383144;
display: flex;
padding: 12px 16px;
font-size: 15px;
align-items: center;
text-decoration: none;
}
.actions-modal ul li:not(:empty) a,
.actions-modal ul li:not(:empty) a button {
transition: none;
}
.actions-modal ul li:not(:empty) a.active,
.actions-modal ul li:not(:empty) a.active button,
.actions-modal ul li:not(:empty) a:hover,
.actions-modal ul li:not(:empty) a:hover button,
.actions-modal ul li:not(:empty) a:active,
.actions-modal ul li:not(:empty) a:active button,
.actions-modal ul li:not(:empty) a:focus,
.actions-modal ul li:not(:empty) a:focus button {
background: #a288bd;
color: #fff;
}
.actions-modal ul li:not(:empty) a button:first-child {
margin-right: 10px;
}
.confirmation-modal__action-bar .confirmation-modal__secondary-button,
.mute-modal__action-bar .confirmation-modal__secondary-button,
.block-modal__action-bar .confirmation-modal__secondary-button {
flex-shrink: 1;
}
.confirmation-modal__secondary-button,
.confirmation-modal__cancel-button,
.mute-modal__cancel-button,
.block-modal__cancel-button {
background-color: transparent;
color: #d5bdd6;
font-size: 14px;
font-weight: 500;
}
.confirmation-modal__secondary-button:hover,
.confirmation-modal__secondary-button:focus,
.confirmation-modal__secondary-button:active,
.confirmation-modal__cancel-button:hover,
.confirmation-modal__cancel-button:focus,
.confirmation-modal__cancel-button:active,
.mute-modal__cancel-button:hover,
.mute-modal__cancel-button:focus,
.mute-modal__cancel-button:active,
.block-modal__cancel-button:hover,
.block-modal__cancel-button:focus,
.block-modal__cancel-button:active {
color: #cdb0ce;
background-color: transparent;
}
.confirmation-modal__container,
.mute-modal__container,
.block-modal__container,
.report-modal__target {
padding: 30px;
font-size: 16px;
}
.confirmation-modal__container strong,
.mute-modal__container strong,
.block-modal__container strong,
.report-modal__target strong {
font-weight: 500;
}
.confirmation-modal__container strong:lang(ja),
.mute-modal__container strong:lang(ja),
.block-modal__container strong:lang(ja),
.report-modal__target strong:lang(ja) {
font-weight: 700;
}
.confirmation-modal__container strong:lang(ko),
.mute-modal__container strong:lang(ko),
.block-modal__container strong:lang(ko),
.report-modal__target strong:lang(ko) {
font-weight: 700;
}
.confirmation-modal__container strong:lang(zh-CN),
.mute-modal__container strong:lang(zh-CN),
.block-modal__container strong:lang(zh-CN),
.report-modal__target strong:lang(zh-CN) {
font-weight: 700;
}
.confirmation-modal__container strong:lang(zh-HK),
.mute-modal__container strong:lang(zh-HK),
.block-modal__container strong:lang(zh-HK),
.report-modal__target strong:lang(zh-HK) {
font-weight: 700;
}
.confirmation-modal__container strong:lang(zh-TW),
.mute-modal__container strong:lang(zh-TW),
.block-modal__container strong:lang(zh-TW),
.report-modal__target strong:lang(zh-TW) {
font-weight: 700;
}
.confirmation-modal__container select,
.mute-modal__container select,
.block-modal__container select,
.report-modal__target select {
appearance: none;
box-sizing: border-box;
font-size: 14px;
color: #383144;
display: inline-block;
width: auto;
outline: 0;
font-family: inherit;
background: #fff url("data:image/svg+xml;utf8,") no-repeat right 8px center/auto 16px;
border: 1px solid #dbdbdb;
border-radius: 4px;
padding: 6px 10px;
padding-right: 30px;
}
.confirmation-modal__container,
.report-modal__target {
text-align: center;
}
.block-modal__explanation,
.mute-modal__explanation {
margin-top: 20px;
}
.block-modal .setting-toggle,
.mute-modal .setting-toggle {
margin-top: 20px;
margin-bottom: 24px;
display: flex;
align-items: center;
}
.block-modal .setting-toggle__label,
.mute-modal .setting-toggle__label {
color: #383144;
margin: 0;
margin-left: 8px;
}
.report-modal__target {
padding: 15px;
}
.report-modal__target .report-modal__close {
position: absolute;
top: 10px;
right: 10px;
}
.loading-bar {
background-color: #a288bd;
height: 3px;
position: absolute;
top: 0;
left: 0;
z-index: 9999;
}
.media-gallery__gifv__label {
display: block;
position: absolute;
color: #fff;
background: rgba(0, 0, 0, 0.5);
bottom: 6px;
left: 6px;
padding: 2px 6px;
border-radius: 2px;
font-size: 11px;
font-weight: 600;
z-index: 1;
pointer-events: none;
opacity: .9;
transition: opacity .1s ease;
line-height: 18px;
}
.media-gallery__gifv:hover .media-gallery__gifv__label {
opacity: 1;
}
.attachment-list {
display: flex;
font-size: 14px;
border: 1px solid #4c425c;
border-radius: 4px;
margin-top: 14px;
overflow: hidden;
}
.attachment-list__icon {
flex: 0 0 auto;
color: #d5bdd6;
padding: 8px 18px;
cursor: default;
border-right: 1px solid #4c425c;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 26px;
}
.attachment-list__icon .fa {
display: block;
}
.attachment-list__list {
list-style: none;
padding: 4px 0;
padding-left: 8px;
display: flex;
flex-direction: column;
justify-content: center;
}
.attachment-list__list li {
display: block;
padding: 4px 0;
}
.attachment-list__list a {
text-decoration: none;
color: #d5bdd6;
font-weight: 500;
}
.attachment-list__list a:hover {
text-decoration: underline;
}
.attachment-list.compact {
border: 0;
margin-top: 4px;
}
.attachment-list.compact .attachment-list__list {
padding: 0;
display: block;
}
.attachment-list.compact .fa {
color: #d5bdd6;
}
.media-gallery {
box-sizing: border-box;
margin-top: 8px;
overflow: hidden;
border-radius: 4px;
position: relative;
width: 100%;
min-height: 64px;
}
.media-gallery__item {
border: 0;
box-sizing: border-box;
display: block;
float: left;
position: relative;
border-radius: 4px;
overflow: hidden;
}
.media-gallery__item.standalone .media-gallery__item-gifv-thumbnail {
transform: none;
top: 0;
}
.media-gallery__item-thumbnail {
cursor: zoom-in;
display: block;
text-decoration: none;
color: #dbd3ff;
position: relative;
z-index: 1;
}
.media-gallery__item-thumbnail,
.media-gallery__item-thumbnail img {
height: 100%;
width: 100%;
}
.media-gallery__item-thumbnail img {
object-fit: cover;
}
.media-gallery__preview {
width: 100%;
height: 100%;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
z-index: 0;
background: #000;
}
.media-gallery__preview--hidden {
display: none;
}
.media-gallery__gifv {
height: 100%;
overflow: hidden;
position: relative;
width: 100%;
}
.media-gallery__item-gifv-thumbnail {
cursor: zoom-in;
height: 100%;
object-fit: cover;
position: relative;
top: 50%;
transform: translateY(-50%);
width: 100%;
z-index: 1;
}
.media-gallery__item-thumbnail-label {
clip: rect(1px 1px 1px 1px);
clip: rect(1px, 1px, 1px, 1px);
overflow: hidden;
position: absolute;
}
.detailed .video-player__volume__current,
.detailed .video-player__volume::before,
.fullscreen .video-player__volume__current,
.fullscreen .video-player__volume::before {
bottom: 27px;
}
.detailed .video-player__volume__handle,
.fullscreen .video-player__volume__handle {
bottom: 23px;
}
.audio-player {
overflow: hidden;
box-sizing: border-box;
position: relative;
background: #24202c;
border-radius: 4px;
padding-bottom: 44px;
direction: ltr;
}
.audio-player.editable {
border-radius: 0;
height: 100%;
}
.audio-player .video-player__volume::before,
.audio-player .video-player__seek::before {
background: currentColor;
opacity: .15;
}
.audio-player .video-player__seek__buffer {
background: currentColor;
opacity: .2;
}
.audio-player .video-player__buttons button {
color: currentColor;
opacity: .75;
}
.audio-player .video-player__buttons button:active,
.audio-player .video-player__buttons button:hover,
.audio-player .video-player__buttons button:focus {
color: currentColor;
opacity: 1;
}
.audio-player .video-player__time-sep,
.audio-player .video-player__time-total,
.audio-player .video-player__time-current {
color: currentColor;
}
.audio-player .video-player__seek::before,
.audio-player .video-player__seek__buffer,
.audio-player .video-player__seek__progress {
top: 0;
}
.audio-player .video-player__seek__handle {
top: -4px;
}
.audio-player .video-player__controls {
padding-top: 10px;
background: transparent;
}
.video-player {
overflow: hidden;
position: relative;
background: #000;
max-width: 100%;
border-radius: 4px;
box-sizing: border-box;
direction: ltr;
color: #fff;
}
.video-player.editable {
border-radius: 0;
height: 100% !important;
}
.video-player:focus {
outline: 0;
}
.video-player video {
display: block;
max-width: 100vw;
max-height: 80vh;
z-index: 1;
}
.video-player.fullscreen {
width: 100% !important;
height: 100% !important;
margin: 0;
}
.video-player.fullscreen video {
max-width: 100% !important;
max-height: 100% !important;
width: 100% !important;
height: 100% !important;
outline: 0;
}
.video-player.inline video {
object-fit: contain;
position: relative;
top: 50%;
transform: translateY(-50%);
}
.video-player__controls {
position: absolute;
z-index: 2;
bottom: 0;
left: 0;
right: 0;
box-sizing: border-box;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.85) 0, rgba(0, 0, 0, 0.45) 60%, transparent);
padding: 0 15px;
opacity: 0;
transition: opacity .1s ease;
}
.video-player__controls.active {
opacity: 1;
}
.video-player.inactive video,
.video-player.inactive .video-player__controls {
visibility: hidden;
}
.video-player__spoiler {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 4;
border: 0;
background: #000;
color: #e6e6fa;
transition: none;
pointer-events: none;
}
.video-player__spoiler.active {
display: block;
pointer-events: auto;
}
.video-player__spoiler.active:hover,
.video-player__spoiler.active:active,
.video-player__spoiler.active:focus {
color: #fff;
}
.video-player__spoiler__title {
display: block;
font-size: 14px;
}
.video-player__spoiler__subtitle {
display: block;
font-size: 11px;
font-weight: 500;
}
.video-player__buttons-bar {
display: flex;
justify-content: space-between;
padding-bottom: 8px;
margin: 0 -5px;
}
.video-player__buttons-bar .video-player__download__icon {
color: inherit;
}
.video-player__buttons {
display: flex;
flex: 0 1 auto;
min-width: 30px;
align-items: center;
font-size: 16px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.video-player__buttons .player-button {
display: inline-block;
outline: 0;
flex: 0 0 auto;
background: transparent;
padding: 5px;
font-size: 16px;
border: 0;
color: rgba(255, 255, 255, 0.75);
}
.video-player__buttons .player-button:active,
.video-player__buttons .player-button:hover,
.video-player__buttons .player-button:focus {
color: #fff;
}
.video-player__time {
display: inline;
flex: 0 1 auto;
overflow: hidden;
text-overflow: ellipsis;
margin: 0 5px;
}
.video-player__time-sep,
.video-player__time-total,
.video-player__time-current {
font-size: 14px;
font-weight: 500;
}
.video-player__time-current {
color: #fff;
}
.video-player__time-sep {
display: inline-block;
margin: 0 6px;
}
.video-player__time-sep,
.video-player__time-total {
color: #fff;
}
.video-player__volume {
flex: 0 0 auto;
display: inline-flex;
cursor: pointer;
height: 24px;
position: relative;
overflow: hidden;
}
.no-reduce-motion .video-player__volume {
transition: all 100ms linear;
}
.video-player__volume.active {
overflow: visible;
width: 50px;
margin-right: 16px;
}
.video-player__volume::before {
content: "";
width: 50px;
background: rgba(255, 255, 255, 0.35);
border-radius: 4px;
display: block;
position: absolute;
height: 4px;
left: 0;
top: 50%;
transform: translate(0, -50%);
}
.video-player__volume__current {
display: block;
position: absolute;
height: 4px;
border-radius: 4px;
left: 0;
top: 50%;
transform: translate(0, -50%);
background: #b7a2cc;
}
.video-player__volume__handle {
position: absolute;
z-index: 3;
border-radius: 50%;
width: 12px;
height: 12px;
top: 50%;
left: 0;
margin-left: -6px;
transform: translate(0, -50%);
background: #b7a2cc;
box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.2);
opacity: 0;
}
.no-reduce-motion .video-player__volume__handle {
transition: opacity 100ms linear;
}
.video-player__volume.active .video-player__volume__handle {
opacity: 1;
}
.video-player__link {
padding: 2px 10px;
}
.video-player__link a {
text-decoration: none;
font-size: 14px;
font-weight: 500;
color: #fff;
}
.video-player__link a:hover,
.video-player__link a:active,
.video-player__link a:focus {
text-decoration: underline;
}
.video-player__seek {
cursor: pointer;
height: 24px;
position: relative;
}
.video-player__seek::before {
content: "";
width: 100%;
background: rgba(255, 255, 255, 0.35);
border-radius: 4px;
display: block;
position: absolute;
height: 4px;
top: 14px;
}
.video-player__seek__progress,
.video-player__seek__buffer {
display: block;
position: absolute;
height: 4px;
border-radius: 4px;
top: 14px;
background: #b7a2cc;
}
.video-player__seek__buffer {
background: rgba(255, 255, 255, 0.2);
}
.video-player__seek__handle {
position: absolute;
z-index: 3;
opacity: 0;
border-radius: 50%;
width: 12px;
height: 12px;
top: 10px;
margin-left: -6px;
background: #b7a2cc;
box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.2);
}
.no-reduce-motion .video-player__seek__handle {
transition: opacity .1s ease;
}
.video-player__seek__handle.active {
opacity: 1;
}
.video-player__seek:hover .video-player__seek__handle {
opacity: 1;
}
.video-player.detailed .video-player__buttons .player-button,
.video-player.fullscreen .video-player__buttons .player-button {
padding-top: 10px;
padding-bottom: 10px;
}
.gifv video {
max-width: 100vw;
max-height: 80vh;
}
.directory__list {
width: 100%;
margin: 10px 0;
transition: opacity 100ms ease-in;
}
.directory__list.loading {
opacity: .7;
}
@media screen and (max-width: 415px) {
.directory__list {
margin: 0;
}
}
.directory__card {
box-sizing: border-box;
margin-bottom: 10px;
}
.directory__card__img {
height: 125px;
position: relative;
background: #1b1720;
overflow: hidden;
}
.directory__card__img img {
display: block;
width: 100%;
height: 100%;
margin: 0;
object-fit: cover;
}
.directory__card__bar {
display: flex;
align-items: center;
background: #423a50;
padding: 10px;
}
.directory__card__bar__name {
flex: 1 1 auto;
display: flex;
align-items: center;
text-decoration: none;
overflow: hidden;
}
.directory__card__bar__relationship {
width: 23px;
min-height: 1px;
flex: 0 0 auto;
}
.directory__card__bar .avatar {
flex: 0 0 auto;
width: 48px;
height: 48px;
padding-top: 2px;
}
.directory__card__bar .avatar img {
width: 100%;
height: 100%;
display: block;
margin: 0;
border-radius: 4px;
background: #24202c;
object-fit: cover;
}
.directory__card__bar .display-name {
margin-left: 15px;
text-align: left;
}
.directory__card__bar .display-name strong {
font-size: 15px;
color: #fff;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
}
.directory__card__bar .display-name span {
display: block;
font-size: 14px;
color: #e6e6fa;
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
}
.directory__card__extra {
background: #383144;
display: flex;
align-items: center;
justify-content: center;
}
.directory__card__extra .accounts-table__count {
width: 33.33%;
flex: 0 0 auto;
padding: 15px 0;
}
.directory__card__extra .account__header__content {
box-sizing: border-box;
padding: 15px 10px;
border-bottom: 1px solid #4c425c;
width: 100%;
min-height: 48px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.directory__card__extra .account__header__content p {
display: none;
}
.directory__card__extra .account__header__content p:first-child {
display: inline;
}
.directory__card__extra .account__header__content br {
display: none;
}
.account-gallery__container {
display: flex;
flex-wrap: wrap;
padding: 4px 2px;
}
.account-gallery__item {
border: 0;
box-sizing: border-box;
display: block;
position: relative;
border-radius: 4px;
overflow: hidden;
margin: 2px;
}
.account-gallery__item__icons {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 24px;
}
.notification__filter-bar,
.account__section-headline {
background: #2e2838;
border-bottom: 1px solid #4c425c;
cursor: default;
display: flex;
flex-shrink: 0;
}
.notification__filter-bar button,
.account__section-headline button {
background: #2e2838;
border: 0;
margin: 0;
}
.notification__filter-bar button,
.notification__filter-bar a,
.account__section-headline button,
.account__section-headline a {
display: block;
flex: 1 1 auto;
color: #e6e6fa;
padding: 15px 0;
font-size: 14px;
font-weight: 500;
text-align: center;
text-decoration: none;
position: relative;
width: 100%;
white-space: nowrap;
}
.notification__filter-bar button.active,
.notification__filter-bar a.active,
.account__section-headline button.active,
.account__section-headline a.active {
color: #dbd3ff;
}
.notification__filter-bar button.active::before,
.notification__filter-bar button.active::after,
.notification__filter-bar a.active::before,
.notification__filter-bar a.active::after,
.account__section-headline button.active::before,
.account__section-headline button.active::after,
.account__section-headline a.active::before,
.account__section-headline a.active::after {
display: block;
content: "";
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 0;
transform: translateX(-50%);
border-style: solid;
border-width: 0 10px 10px;
border-color: transparent transparent #4c425c;
}
.notification__filter-bar button.active::after,
.notification__filter-bar a.active::after,
.account__section-headline button.active::after,
.account__section-headline a.active::after {
bottom: -1px;
border-color: transparent transparent #383144;
}
.notification__filter-bar.directory__section-headline,
.account__section-headline.directory__section-headline {
background: #332d3e;
border-bottom-color: transparent;
}
.notification__filter-bar.directory__section-headline a.active::before,
.notification__filter-bar.directory__section-headline button.active::before,
.account__section-headline.directory__section-headline a.active::before,
.account__section-headline.directory__section-headline button.active::before {
display: none;
}
.notification__filter-bar.directory__section-headline a.active::after,
.notification__filter-bar.directory__section-headline button.active::after,
.account__section-headline.directory__section-headline a.active::after,
.account__section-headline.directory__section-headline button.active::after {
border-color: transparent transparent #27222f;
}
.filter-form {
background: #383144;
}
.filter-form__column {
padding: 10px 15px;
}
.filter-form .radio-button {
display: block;
}
.column-settings__row .radio-button {
display: block;
}
.radio-button {
font-size: 14px;
position: relative;
display: inline-block;
padding: 6px 0;
line-height: 18px;
cursor: default;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
cursor: pointer;
}
.radio-button input[type=radio],
.radio-button input[type=checkbox] {
display: none;
}
.radio-button__input {
display: inline-block;
position: relative;
border: 1px solid #e6e6fa;
box-sizing: border-box;
width: 18px;
height: 18px;
flex: 0 0 auto;
margin-right: 10px;
top: -1px;
border-radius: 50%;
vertical-align: middle;
}
.radio-button__input.checked {
border-color: #b7a2cc;
background: #b7a2cc;
}
::-webkit-scrollbar-thumb {
border-radius: 0;
}
.search-popout {
background: #fff;
border-radius: 4px;
padding: 10px 14px;
padding-bottom: 14px;
margin-top: 10px;
color: #e6e6fa;
box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.4);
}
.search-popout h4 {
text-transform: uppercase;
color: #e6e6fa;
font-size: 13px;
font-weight: 500;
margin-bottom: 10px;
}
.search-popout li {
padding: 4px 0;
}
.search-popout ul {
margin-bottom: 10px;
}
.search-popout em {
font-weight: 500;
color: #383144;
}
noscript {
text-align: center;
}
noscript img {
width: 200px;
opacity: .5;
animation: flicker 4s infinite;
}
noscript div {
font-size: 14px;
margin: 30px auto;
color: #dbd3ff;
max-width: 400px;
}
noscript div a {
color: #a288bd;
text-decoration: underline;
}
noscript div a:hover {
text-decoration: none;
}
@keyframes flicker {
0% {
opacity: 1;
}
30% {
opacity: .75;
}
100% {
opacity: 1;
}
}
@media screen and (max-width: 630px) and (max-height: 400px) {
.tabs-bar,
.search {
will-change: margin-top;
transition: margin-top 400ms 100ms;
}
.navigation-bar {
will-change: padding-bottom;
transition: padding-bottom 400ms 100ms;
}
.navigation-bar > a:first-child {
will-change: margin-top, margin-left, margin-right, width;
transition: margin-top 400ms 100ms, margin-left 400ms 500ms, margin-right 400ms 500ms;
}
.navigation-bar > .navigation-bar__profile-edit {
will-change: margin-top;
transition: margin-top 400ms 100ms;
}
.navigation-bar .navigation-bar__actions > .icon-button.close {
will-change: opacity transform;
transition: opacity 200ms 100ms, transform 400ms 100ms;
}
.navigation-bar .navigation-bar__actions > .compose__action-bar .icon-button {
will-change: opacity transform;
transition: opacity 200ms 300ms, transform 400ms 100ms;
}
.is-composing .tabs-bar,
.is-composing .search {
margin-top: -50px;
}
.is-composing .navigation-bar {
padding-bottom: 0;
}
.is-composing .navigation-bar > a:first-child {
margin: -100px 10px 0 -50px;
}
.is-composing .navigation-bar .navigation-bar__profile {
padding-top: 2px;
}
.is-composing .navigation-bar .navigation-bar__profile-edit {
position: absolute;
margin-top: -60px;
}
.is-composing .navigation-bar .navigation-bar__actions .icon-button.close {
pointer-events: auto;
opacity: 1;
transform: scale(1, 1) translate(0, 0);
bottom: 5px;
}
.is-composing .navigation-bar .navigation-bar__actions .compose__action-bar .icon-button {
pointer-events: none;
opacity: 0;
transform: scale(0, 1) translate(100%, 0);
}
}
.embed-modal {
width: auto;
max-width: 80vw;
max-height: 80vh;
}
.embed-modal h4 {
padding: 30px;
font-weight: 500;
font-size: 16px;
text-align: center;
}
.embed-modal .embed-modal__container {
padding: 10px;
}
.embed-modal .embed-modal__container .hint {
margin-bottom: 15px;
}
.embed-modal .embed-modal__container .embed-modal__html {
outline: 0;
box-sizing: border-box;
display: block;
width: 100%;
border: 0;
padding: 10px;
font-family: "mastodon-font-monospace", monospace;
background: #383144;
color: #fff;
font-size: 14px;
margin: 0;
margin-bottom: 15px;
border-radius: 4px;
}
.embed-modal .embed-modal__container .embed-modal__html::-moz-focus-inner {
border: 0;
}
.embed-modal .embed-modal__container .embed-modal__html::-moz-focus-inner,
.embed-modal .embed-modal__container .embed-modal__html:focus,
.embed-modal .embed-modal__container .embed-modal__html:active {
outline: 0 !important;
}
.embed-modal .embed-modal__container .embed-modal__html:focus {
background: #423a50;
}
@media screen and (max-width: 600px) {
.embed-modal .embed-modal__container .embed-modal__html {
font-size: 16px;
}
}
.embed-modal .embed-modal__container .embed-modal__iframe {
width: 400px;
max-width: 100%;
overflow: hidden;
border: 0;
border-radius: 4px;
}
.account__moved-note {
padding: 14px 10px;
padding-bottom: 16px;
background: #423a50;
border-top: 1px solid #4c425c;
border-bottom: 1px solid #4c425c;
}
.account__moved-note__message {
position: relative;
margin-left: 58px;
color: #d5bdd6;
padding: 8px 0;
padding-top: 0;
padding-bottom: 4px;
font-size: 14px;
}
.account__moved-note__message > span {
display: block;
overflow: hidden;
text-overflow: ellipsis;
}
.account__moved-note__icon-wrapper {
left: -26px;
position: absolute;
}
.account__moved-note .detailed-status__display-avatar {
position: relative;
}
.account__moved-note .detailed-status__display-name {
margin-bottom: 0;
}
.column-inline-form {
padding: 15px;
padding-right: 0;
display: flex;
justify-content: flex-start;
align-items: center;
background: #423a50;
}
.column-inline-form label {
flex: 1 1 auto;
}
.column-inline-form label input {
width: 100%;
}
.column-inline-form label input:focus {
outline: 0;
}
.column-inline-form .icon-button {
flex: 0 0 auto;
margin: 0 10px;
}
.drawer__backdrop {
cursor: pointer;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
}
.list-editor {
background: #383144;
flex-direction: column;
border-radius: 8px;
box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.4);
width: 380px;
overflow: hidden;
}
@media screen and (max-width: 420px) {
.list-editor {
width: 90%;
}
}
.list-editor h4 {
padding: 15px 0;
background: #584d6b;
font-weight: 500;
font-size: 16px;
text-align: center;
border-radius: 8px 8px 0 0;
}
.list-editor .drawer__pager {
height: 50vh;
}
.list-editor .drawer__inner {
border-radius: 0 0 8px 8px;
}
.list-editor .drawer__inner.backdrop {
width: calc(100% - 60px);
box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.4);
border-radius: 0 0 0 8px;
}
.list-editor__accounts {
overflow-y: auto;
}
.list-editor .account__display-name:hover strong {
text-decoration: none;
}
.list-editor .account__avatar {
cursor: default;
}
.list-editor .search {
margin-bottom: 0;
}
.list-adder {
background: #383144;
flex-direction: column;
border-radius: 8px;
box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.4);
width: 380px;
overflow: hidden;
}
@media screen and (max-width: 420px) {
.list-adder {
width: 90%;
}
}
.list-adder__account {
background: #584d6b;
}
.list-adder__lists {
background: #584d6b;
height: 50vh;
border-radius: 0 0 8px 8px;
overflow-y: auto;
}
.list-adder .list {
padding: 10px;
border-bottom: 1px solid #4c425c;
}
.list-adder .list__wrapper {
display: flex;
}
.list-adder .list__display-name {
flex: 1 1 auto;
overflow: hidden;
text-decoration: none;
font-size: 16px;
padding: 10px;
}
.focal-point {
position: relative;
cursor: move;
overflow: hidden;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background: #000;
}
.focal-point img,
.focal-point video,
.focal-point canvas {
display: block;
max-height: 80vh;
width: 100%;
height: auto;
margin: 0;
object-fit: contain;
background: #000;
}
.focal-point__reticle {
position: absolute;
width: 100px;
height: 100px;
transform: translate(-50%, -50%);
background: url("../images/reticle.png") no-repeat 0 0;
border-radius: 50%;
box-shadow: 0 0 0 9999em rgba(0, 0, 0, 0.35);
}
.focal-point__overlay {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.focal-point__preview {
position: absolute;
bottom: 10px;
right: 10px;
z-index: 2;
cursor: move;
transition: opacity .1s ease;
}
.focal-point__preview:hover {
opacity: .5;
}
.focal-point__preview strong {
color: #fff;
font-size: 14px;
font-weight: 500;
display: block;
margin-bottom: 5px;
}
.focal-point__preview div {
border-radius: 4px;
box-shadow: 0 0 14px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 480px) {
.focal-point img,
.focal-point video {
max-height: 100%;
}
.focal-point__preview {
display: none;
}
}
.account__header__content {
color: #e6e6fa;
font-size: 14px;
font-weight: 400;
overflow: hidden;
word-break: normal;
word-wrap: break-word;
}
.account__header__content p {
margin-bottom: 20px;
}
.account__header__content p:last-child {
margin-bottom: 0;
}
.account__header__content a {
color: inherit;
text-decoration: underline;
}
.account__header__content a:hover {
text-decoration: none;
}
.account__header {
overflow: hidden;
}
.account__header.inactive {
opacity: .5;
}
.account__header.inactive .account__header__image,
.account__header.inactive .account__avatar {
filter: grayscale(100%);
}
.account__header__info {
position: absolute;
top: 10px;
left: 10px;
}
.account__header__image {
overflow: hidden;
height: 145px;
position: relative;
background: #2e2838;
}
.account__header__image img {
object-fit: cover;
display: block;
width: 100%;
height: 100%;
margin: 0;
}
.account__header__bar {
position: relative;
background: #423a50;
padding: 5px;
border-bottom: 1px solid #554b68;
}
.account__header__bar .avatar {
display: block;
flex: 0 0 auto;
width: 94px;
margin-left: -2px;
}
.account__header__bar .avatar .account__avatar {
background: #24202c;
border: 2px solid #423a50;
}
.account__header__tabs {
display: flex;
align-items: flex-start;
padding: 7px 10px;
margin-top: -55px;
}
.account__header__tabs__buttons {
display: flex;
align-items: center;
padding-top: 55px;
overflow: hidden;
}
.account__header__tabs__buttons .icon-button {
border: 1px solid #554b68;
border-radius: 4px;
box-sizing: content-box;
padding: 2px;
}
.account__header__tabs__buttons > .icon-button {
margin-right: 8px;
}
.account__header__tabs__buttons .button {
margin: 0 8px;
}
.account__header__tabs__name {
padding: 5px 10px;
}
.account__header__tabs__name .account-role {
vertical-align: top;
}
.account__header__tabs__name .emojione {
width: 22px;
height: 22px;
}
.account__header__tabs__name h1 {
font-size: 16px;
line-height: 24px;
color: #fff;
font-weight: 500;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.account__header__tabs__name h1 small {
display: block;
font-size: 14px;
color: #e6e6fa;
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
}
.account__header__tabs .spacer {
flex: 1 1 auto;
}
.account__header__bio {
overflow: hidden;
margin: 0 -5px;
}
.account__header__bio .account__header__content {
padding: 20px 15px;
padding-bottom: 5px;
color: #fff;
}
.columns-area--mobile .account__header__bio .account__header__content {
padding-left: 20px;
padding-right: 20px;
}
.account__header__bio .account__header__joined {
font-size: 14px;
padding: 5px 15px;
color: #e6e6fa;
}
.columns-area--mobile .account__header__bio .account__header__joined {
padding-left: 20px;
padding-right: 20px;
}
.account__header__bio .account__header__fields {
margin: 0;
border-top: 1px solid #554b68;
}
.account__header__bio .account__header__fields a {
color: #b7a2cc;
}
.account__header__bio .account__header__fields dl:first-child .verified {
border-radius: 0 4px 0 0;
}
.account__header__bio .account__header__fields .verified a {
color: #79bd9a;
}
.account__header__extra {
margin-top: 4px;
}
.account__header__extra__links {
font-size: 14px;
color: #e6e6fa;
padding: 10px 0;
}
.account__header__extra__links a {
display: inline-block;
color: #e6e6fa;
text-decoration: none;
padding: 5px 10px;
font-weight: 500;
}
.account__header__extra__links a strong {
font-weight: 700;
color: #fff;
}
.account__header__account-note {
padding: 15px;
padding-bottom: 10px;
color: #fff;
font-size: 14px;
font-weight: 400;
border-bottom: 1px solid #554b68;
}
.columns-area--mobile .account__header__account-note {
padding-left: 20px;
padding-right: 20px;
}
.account__header__account-note label {
display: block;
font-size: 12px;
font-weight: 500;
color: #e6e6fa;
text-transform: uppercase;
margin-bottom: 5px;
}
.account__header__account-note textarea {
display: block;
box-sizing: border-box;
width: calc(100% + 20px);
color: #dbd3ff;
background: transparent;
padding: 10px;
margin: 0 -10px;
font-family: inherit;
font-size: 14px;
resize: none;
border: 0;
outline: 0;
border-radius: 4px;
}
.account__header__account-note textarea::placeholder {
color: #d5bdd6;
opacity: 1;
}
.account__header__account-note textarea:focus {
background: #383144;
}
.trends__header {
color: #d5bdd6;
background: #3d354a;
border-bottom: 1px solid #2e2838;
font-weight: 500;
padding: 15px;
font-size: 16px;
cursor: default;
}
.trends__header .fa {
display: inline-block;
margin-right: 5px;
}
.trends__item {
display: flex;
align-items: center;
padding: 15px;
border-bottom: 1px solid #4c425c;
}
.trends__item:last-child {
border-bottom: 0;
}
.trends__item__name {
flex: 1 1 auto;
color: #d5bdd6;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.trends__item__name strong {
font-weight: 500;
}
.trends__item__name a {
color: #e6e6fa;
text-decoration: none;
font-size: 14px;
font-weight: 500;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.trends__item__name a:hover span,
.trends__item__name a:focus span,
.trends__item__name a:active span {
text-decoration: underline;
}
.trends__item__current {
flex: 0 0 auto;
font-size: 24px;
line-height: 36px;
font-weight: 500;
text-align: right;
padding-right: 15px;
margin-left: 5px;
color: #dbd3ff;
}
.trends__item__sparkline {
flex: 0 0 auto;
width: 50px;
}
.trends__item__sparkline path:first-child {
fill: rgba(162, 136, 189, 0.25) !important;
fill-opacity: 1 !important;
}
.trends__item__sparkline path:last-child {
stroke: #b19cc8 !important;
fill: none !important;
}
.conversation {
display: flex;
border-bottom: 1px solid #4c425c;
padding: 5px;
padding-bottom: 0;
}
.conversation:focus {
background: #3d354a;
outline: 0;
}
.conversation__avatar {
flex: 0 0 auto;
padding: 10px;
padding-top: 12px;
position: relative;
cursor: pointer;
}
.conversation__unread {
display: inline-block;
background: #a288bd;
border-radius: 50%;
width: .625rem;
height: .625rem;
margin: -0.1ex .15em .1ex;
}
.conversation__content {
flex: 1 1 auto;
padding: 10px 5px;
padding-right: 15px;
overflow: hidden;
}
.conversation__content__info {
overflow: hidden;
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
}
.conversation__content__relative-time {
font-size: 15px;
color: #e6e6fa;
padding-left: 15px;
}
.conversation__content__names {
color: #e6e6fa;
font-size: 15px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 4px;
flex-basis: 90px;
flex-grow: 1;
}
.conversation__content__names a {
color: #fff;
text-decoration: none;
}
.conversation__content__names a:hover,
.conversation__content__names a:focus,
.conversation__content__names a:active {
text-decoration: underline;
}
.conversation__content a {
word-break: break-word;
}
.conversation--unread {
background: #3d354a;
}
.conversation--unread:focus {
background: #423a50;
}
.conversation--unread .conversation__content__info {
font-weight: 700;
}
.conversation--unread .conversation__content__relative-time {
color: #fff;
}
.announcements {
background: #4c425c;
font-size: 13px;
display: flex;
align-items: flex-end;
}
.announcements__mastodon {
width: 124px;
flex: 0 0 auto;
}
@media screen and (max-width: 424px) {
.announcements__mastodon {
display: none;
}
}
.announcements__container {
width: calc(100% - 124px);
flex: 0 0 auto;
position: relative;
}
@media screen and (max-width: 424px) {
.announcements__container {
width: 100%;
}
}
.announcements__item {
box-sizing: border-box;
width: 100%;
padding: 15px;
position: relative;
font-size: 15px;
line-height: 20px;
word-wrap: break-word;
font-weight: 400;
max-height: 50vh;
overflow: hidden;
display: flex;
flex-direction: column;
}
.announcements__item__range {
display: block;
font-weight: 500;
margin-bottom: 10px;
padding-right: 18px;
}
.announcements__item__unread {
position: absolute;
top: 19px;
right: 19px;
display: block;
background: #a288bd;
border-radius: 50%;
width: .625rem;
height: .625rem;
}
.announcements__pagination {
padding: 15px;
color: #e6e6fa;
position: absolute;
bottom: 3px;
right: 0;
}
.layout-multiple-columns .announcements__mastodon {
display: none;
}
.layout-multiple-columns .announcements__container {
width: 100%;
}
.reactions-bar {
display: flex;
flex-wrap: wrap;
align-items: center;
margin-top: 15px;
margin-left: -2px;
width: calc(100% - (90px - 33px));
}
.reactions-bar__item {
flex-shrink: 0;
background: #554b68;
border: 0;
border-radius: 3px;
margin: 2px;
cursor: pointer;
user-select: none;
padding: 0 6px;
display: flex;
align-items: center;
transition: all 100ms ease-in;
transition-property: background-color, color;
}
.reactions-bar__item__emoji {
display: block;
margin: 3px 0;
width: 16px;
height: 16px;
}
.reactions-bar__item__emoji img {
display: block;
margin: 0;
width: 100%;
height: 100%;
min-width: auto;
min-height: auto;
vertical-align: bottom;
object-fit: contain;
}
.reactions-bar__item__count {
display: block;
min-width: 9px;
font-size: 13px;
font-weight: 500;
text-align: center;
margin-left: 6px;
color: #e6e6fa;
}
.reactions-bar__item:hover,
.reactions-bar__item:focus,
.reactions-bar__item:active {
background: #5f5373;
transition: all 200ms ease-out;
transition-property: background-color, color;
}
.reactions-bar__item:hover__count,
.reactions-bar__item:focus__count,
.reactions-bar__item:active__count {
color: #f7f7fd;
}
.reactions-bar__item.active {
transition: all 100ms ease-in;
transition-property: background-color, color;
background-color: #645779;
}
.reactions-bar__item.active .reactions-bar__item__count {
color: #b7a2cc;
}
.reactions-bar .emoji-picker-dropdown {
margin: 2px;
}
.reactions-bar:hover .emoji-button {
opacity: .85;
}
.reactions-bar .emoji-button {
color: #e6e6fa;
margin: 0;
font-size: 16px;
width: auto;
flex-shrink: 0;
padding: 0 6px;
height: 22px;
display: flex;
align-items: center;
opacity: .5;
transition: all 100ms ease-in;
transition-property: background-color, color;
}
.reactions-bar .emoji-button:hover,
.reactions-bar .emoji-button:active,
.reactions-bar .emoji-button:focus {
opacity: 1;
color: #f7f7fd;
transition: all 200ms ease-out;
transition-property: background-color, color;
}
.reactions-bar--empty .emoji-button {
padding: 0;
}
.notification,
.status__wrapper {
position: relative;
}
.notification.unread::before,
.status__wrapper.unread::before {
content: "";
position: absolute;
top: 0;
left: 0;
pointer-events: 0;
width: 100%;
height: 100%;
border-left: 2px solid #a288bd;
pointer-events: none;
}
.picture-in-picture {
position: fixed;
bottom: 20px;
right: 20px;
width: 300px;
}
.picture-in-picture__footer {
border-radius: 0 0 4px 4px;
background: #423a50;
padding: 10px;
padding-top: 12px;
display: flex;
justify-content: space-between;
}
.picture-in-picture__header {
border-radius: 4px 4px 0 0;
background: #423a50;
padding: 10px;
display: flex;
justify-content: space-between;
}
.picture-in-picture__header__account {
display: flex;
text-decoration: none;
}
.picture-in-picture__header .account__avatar {
margin-right: 10px;
}
.picture-in-picture__header .display-name {
color: #fff;
text-decoration: none;
}
.picture-in-picture__header .display-name strong,
.picture-in-picture__header .display-name span {
display: block;
text-overflow: ellipsis;
overflow: hidden;
}
.picture-in-picture__header .display-name span {
color: #e6e6fa;
}
.picture-in-picture .video-player,
.picture-in-picture .audio-player {
border-radius: 0;
}
.picture-in-picture-placeholder {
box-sizing: border-box;
border: 2px dashed #4c425c;
background: #000;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 10px;
font-size: 16px;
font-weight: 500;
cursor: pointer;
color: #e6e6fa;
}
.picture-in-picture-placeholder i {
display: block;
font-size: 24px;
font-weight: 400;
margin-bottom: 10px;
}
.picture-in-picture-placeholder:hover,
.picture-in-picture-placeholder:focus,
.picture-in-picture-placeholder:active {
border-color: #554b68;
}
.notifications-permission-banner {
padding: 30px;
border-bottom: 1px solid #4c425c;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: relative;
}
.notifications-permission-banner__close {
position: absolute;
top: 10px;
right: 10px;
}
.notifications-permission-banner h2 {
font-size: 16px;
font-weight: 500;
margin-bottom: 15px;
text-align: center;
}
.notifications-permission-banner p {
color: #e6e6fa;
margin-bottom: 15px;
text-align: center;
}
.poll {
margin-top: 16px;
font-size: 14px;
}
.poll li {
margin-bottom: 10px;
position: relative;
}
.poll__chart {
border-radius: 4px;
display: block;
background: #d1d1f6;
height: 5px;
min-width: 1%;
}
.poll__chart.leading {
background: #a288bd;
}
.poll progress {
border: 0;
display: block;
width: 100%;
height: 5px;
appearance: none;
background: transparent;
}
.poll progress::-webkit-progress-bar {
background: transparent;
}
.poll progress::-moz-progress-bar {
border-radius: 4px;
background: #d1d1f6;
}
.poll progress::-ms-fill {
border-radius: 4px;
background: #d1d1f6;
}
.poll progress::-webkit-progress-value {
border-radius: 4px;
background: #d1d1f6;
}
.poll__option {
position: relative;
display: flex;
padding: 6px 0;
line-height: 18px;
cursor: default;
overflow: hidden;
}
.poll__option__text {
display: inline-block;
word-wrap: break-word;
overflow-wrap: break-word;
max-width: calc(100% - 45px - 25px);
}
.poll__option input[type=radio],
.poll__option input[type=checkbox] {
display: none;
}
.poll__option .autossugest-input {
flex: 1 1 auto;
}
.poll__option input[type=text] {
display: block;
box-sizing: border-box;
width: 100%;
font-size: 14px;
color: #383144;
outline: 0;
font-family: inherit;
background: #fff;
border: 1px solid #dbdbdb;
border-radius: 4px;
padding: 6px 10px;
}
.poll__option input[type=text]:focus {
border-color: #a288bd;
}
.poll__option.selectable {
cursor: pointer;
}
.poll__option.editable {
display: flex;
align-items: center;
overflow: visible;
}
.poll__input {
display: inline-block;
position: relative;
border: 1px solid #e6e6fa;
box-sizing: border-box;
width: 18px;
height: 18px;
flex: 0 0 auto;
margin-right: 10px;
top: -1px;
border-radius: 50%;
vertical-align: middle;
margin-top: auto;
margin-bottom: auto;
flex: 0 0 18px;
}
.poll__input.checkbox {
border-radius: 4px;
}
.poll__input.active {
border-color: #79bd9a;
background: #79bd9a;
}
.poll__input:active,
.poll__input:focus,
.poll__input:hover {
border-color: #acd6c1;
border-width: 4px;
}
.poll__input::-moz-focus-inner {
outline: 0 !important;
border: 0;
}
.poll__input:focus,
.poll__input:active {
outline: 0 !important;
}
.poll__number {
display: inline-block;
width: 45px;
font-weight: 700;
flex: 0 0 45px;
}
.poll__voted {
padding: 0 5px;
display: inline-block;
}
.poll__voted__mark {
font-size: 18px;
}
.poll__footer {
padding-top: 6px;
padding-bottom: 5px;
color: #d5bdd6;
}
.poll__link {
display: inline;
background: transparent;
padding: 0;
margin: 0;
border: 0;
color: #d5bdd6;
text-decoration: underline;
font-size: inherit;
}
.poll__link:hover {
text-decoration: none;
}
.poll__link:active,
.poll__link:focus {
background-color: rgba(213, 189, 214, 0.1);
}
.poll .button {
height: 36px;
padding: 0 16px;
margin-right: 10px;
font-size: 14px;
}
.compose-form__poll-wrapper {
border-top: 1px solid #ebebeb;
}
.compose-form__poll-wrapper ul {
padding: 10px;
}
.compose-form__poll-wrapper .poll__footer {
border-top: 1px solid #ebebeb;
padding: 10px;
display: flex;
align-items: center;
}
.compose-form__poll-wrapper .poll__footer button,
.compose-form__poll-wrapper .poll__footer select {
flex: 1 1 50%;
}
.compose-form__poll-wrapper .poll__footer button:focus,
.compose-form__poll-wrapper .poll__footer select:focus {
border-color: #a288bd;
}
.compose-form__poll-wrapper .button.button-secondary {
font-size: 14px;
font-weight: 400;
padding: 6px 10px;
height: auto;
line-height: inherit;
color: #d5bdd6;
border-color: #d5bdd6;
margin-right: 5px;
}
.compose-form__poll-wrapper li {
display: flex;
align-items: center;
}
.compose-form__poll-wrapper li .poll__option {
flex: 0 0 auto;
width: calc(100% - (23px + 6px));
margin-right: 6px;
}
.compose-form__poll-wrapper select {
appearance: none;
box-sizing: border-box;
font-size: 14px;
color: #383144;
display: inline-block;
width: auto;
outline: 0;
font-family: inherit;
background: #fff url("data:image/svg+xml;utf8,") no-repeat right 8px center/auto 16px;
border: 1px solid #dbdbdb;
border-radius: 4px;
padding: 6px 10px;
padding-right: 30px;
}
.compose-form__poll-wrapper .icon-button.disabled {
color: #dbdbdb;
}
.muted .poll {
color: #d5bdd6;
}
.muted .poll__chart {
background: rgba(171, 171, 238, 0.2);
}
.muted .poll__chart.leading {
background: rgba(162, 136, 189, 0.2);
}
.introduction {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100vh;
background: #383144;
}
@media screen and (max-width: 920px) {
.introduction {
display: block !important;
}
}
.introduction__pager {
background: #24202c;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
overflow: hidden;
}
.introduction__pager,
.introduction__frame {
border-radius: 10px;
width: 50vw;
min-width: 920px;
}
@media screen and (max-width: 920px) {
.introduction__pager,
.introduction__frame {
min-width: 0;
width: 100%;
border-radius: 0;
box-shadow: none;
}
}
.introduction__frame-wrapper {
opacity: 0;
transition: opacity 500ms linear;
}
.introduction__frame-wrapper.active {
opacity: 1;
transition: opacity 50ms linear;
}
.introduction__frame {
overflow: hidden;
}
.introduction__illustration {
height: 50vh;
}
@media screen and (max-width: 630px) {
.introduction__illustration {
height: auto;
}
}
.introduction__illustration img {
object-fit: cover;
display: block;
margin: 0;
width: 100%;
height: 100%;
}
.introduction__text {
border-top: 2px solid #a288bd;
}
.introduction__text--columnized {
display: flex;
}
.introduction__text--columnized > div {
flex: 1 1 33.33%;
text-align: center;
padding: 25px;
padding-bottom: 30px;
}
@media screen and (max-width: 630px) {
.introduction__text--columnized {
display: block;
padding: 15px 0;
padding-bottom: 20px;
}
.introduction__text--columnized > div {
padding: 10px 25px;
}
}
.introduction__text h3 {
font-size: 24px;
line-height: 1.5;
font-weight: 700;
margin-bottom: 10px;
}
.introduction__text p {
font-size: 16px;
line-height: 24px;
font-weight: 400;
color: #e6e6fa;
}
.introduction__text p code {
display: inline-block;
background: #24202c;
font-size: 15px;
border: 1px solid #4c425c;
border-radius: 2px;
padding: 1px 3px;
}
.introduction__text--centered {
padding: 25px;
padding-bottom: 30px;
text-align: center;
}
.introduction__dots {
display: flex;
align-items: center;
justify-content: center;
padding: 25px;
}
@media screen and (max-width: 630px) {
.introduction__dots {
display: none;
}
}
.introduction__dot {
width: 14px;
height: 14px;
border-radius: 14px;
border: 1px solid #a288bd;
background: transparent;
margin: 0 3px;
cursor: pointer;
}
.introduction__dot:hover {
background: #4c425c;
}
.introduction__dot.active {
cursor: default;
background: #a288bd;
}
.introduction__action {
padding: 25px;
padding-top: 0;
display: flex;
align-items: center;
justify-content: center;
}
.modal-layout {
background: #383144 url('data:image/svg+xml;utf8,') repeat-x bottom fixed;
display: flex;
flex-direction: column;
height: 100vh;
padding: 0;
}
.modal-layout__mastodon {
display: flex;
flex: 1;
flex-direction: column;
justify-content: flex-end;
}
.modal-layout__mastodon > div {
flex: 1;
max-height: 235px;
position: relative;
}
.modal-layout__mastodon > div img {
max-height: 100%;
max-width: 100%;
height: 100%;
position: absolute;
bottom: 0;
left: 0;
}
@media screen and (max-width: 600px) {
.account-header {
margin-top: 0;
}
}
.emoji-mart {
font-size: 13px;
display: inline-block;
color: #383144;
}
.emoji-mart,
.emoji-mart * {
box-sizing: border-box;
line-height: 1.15;
}
.emoji-mart .emoji-mart-emoji {
padding: 6px;
}
.emoji-mart-bar {
border: 0 solid #baaaff;
}
.emoji-mart-bar:first-child {
border-bottom-width: 1px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
background: #dbd3ff;
}
.emoji-mart-bar:last-child {
border-top-width: 1px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
display: none;
}
.emoji-mart-anchors {
display: flex;
justify-content: space-between;
padding: 0 6px;
color: #d5bdd6;
line-height: 0;
}
.emoji-mart-anchor {
position: relative;
flex: 1;
text-align: center;
padding: 12px 4px;
overflow: hidden;
transition: color .1s ease-out;
cursor: pointer;
background: transparent;
border: 0;
}
.emoji-mart-anchor:hover {
color: #cdb0ce;
}
.emoji-mart-anchor-selected {
color: #a288bd;
}
.emoji-mart-anchor-selected:hover {
color: #987bb6;
}
.emoji-mart-anchor-selected .emoji-mart-anchor-bar {
bottom: -1px;
}
.emoji-mart-anchor-bar {
position: absolute;
bottom: -5px;
left: 0;
width: 100%;
height: 4px;
background-color: #a288bd;
}
.emoji-mart-anchors i {
display: inline-block;
width: 100%;
max-width: 22px;
}
.emoji-mart-anchors svg {
fill: currentColor;
max-height: 18px;
}
.emoji-mart-scroll {
overflow-y: scroll;
height: 270px;
max-height: 35vh;
padding: 0 6px 6px;
background: #fff;
will-change: transform;
}
.emoji-mart-scroll::-webkit-scrollbar-track:hover,
.emoji-mart-scroll::-webkit-scrollbar-track:active {
background-color: rgba(0, 0, 0, 0.3);
}
.emoji-mart-search {
padding: 10px;
padding-right: 45px;
background: #fff;
position: relative;
}
.emoji-mart-search input {
font-size: 14px;
font-weight: 400;
padding: 7px 9px;
padding-right: 25px;
font-family: inherit;
display: block;
width: 100%;
background: rgba(219, 211, 255, 0.3);
color: #383144;
border: 1px solid #dbd3ff;
border-radius: 4px;
}
.emoji-mart-search input::-moz-focus-inner {
border: 0;
}
.emoji-mart-search input::-moz-focus-inner,
.emoji-mart-search input:focus,
.emoji-mart-search input:active {
outline: 0 !important;
}
.emoji-mart-search-icon {
position: absolute;
top: 18px;
right: 50px;
z-index: 2;
padding: 2px 5px 1px;
border: 0;
background: none;
transition: all 100ms linear;
transition-property: opacity;
pointer-events: auto;
opacity: .7;
}
.emoji-mart-search-icon:disabled {
cursor: default;
pointer-events: none;
opacity: .3;
}
.emoji-mart-search-icon svg {
fill: #d5bdd6;
}
.emoji-mart-category .emoji-mart-emoji {
cursor: pointer;
}
.emoji-mart-category .emoji-mart-emoji span {
z-index: 1;
position: relative;
text-align: center;
}
.emoji-mart-category .emoji-mart-emoji:hover::before {
z-index: 0;
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(219, 211, 255, 0.7);
border-radius: 100%;
}
.emoji-mart-category-label {
z-index: 2;
position: relative;
position: -webkit-sticky;
position: sticky;
top: 0;
}
.emoji-mart-category-label span {
display: block;
width: 100%;
font-weight: 500;
padding: 5px 6px;
background: #fff;
}
.emoji-mart-sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
.emoji-mart-category-list {
margin: 0;
padding: 0;
}
.emoji-mart-category-list li {
list-style: none;
margin: 0;
padding: 0;
display: inline-block;
}
.emoji-mart-emoji {
position: relative;
display: inline-block;
background: transparent;
border: 0;
padding: 0;
font-size: 0;
}
.emoji-mart-emoji span {
width: 22px;
height: 22px;
}
.emoji-mart-no-results {
font-size: 14px;
color: #e6e6fa;
text-align: center;
padding: 5px 6px;
padding-top: 70px;
}
.emoji-mart-no-results .emoji-mart-no-results-label {
margin-top: .2em;
}
.emoji-mart-no-results .emoji-mart-emoji:hover::before {
cursor: default;
content: none;
}
.emoji-mart-preview {
display: none;
}
.container {
box-sizing: border-box;
max-width: 1235px;
margin: 0 auto;
position: relative;
}
@media screen and (max-width: 1255px) {
.container {
width: 100%;
padding: 0 10px;
}
}
.rich-formatting {
font-family: "mastodon-font-sans-serif", sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 1.7;
word-wrap: break-word;
color: #e6e6fa;
}
.rich-formatting a {
color: #a288bd;
text-decoration: underline;
}
.rich-formatting a:hover,
.rich-formatting a:focus,
.rich-formatting a:active {
text-decoration: none;
}
.rich-formatting p,
.rich-formatting li {
color: #e6e6fa;
}
.rich-formatting p {
margin-top: 0;
margin-bottom: .85em;
}
.rich-formatting p:last-child {
margin-bottom: 0;
}
.rich-formatting strong {
font-weight: 700;
color: #dbd3ff;
}
.rich-formatting em {
font-style: italic;
color: #dbd3ff;
}
.rich-formatting code {
font-size: .85em;
background: #24202c;
border-radius: 4px;
padding: .2em .3em;
}
.rich-formatting h1,
.rich-formatting h2,
.rich-formatting h3,
.rich-formatting h4,
.rich-formatting h5,
.rich-formatting h6 {
font-family: "mastodon-font-display", sans-serif;
margin-top: 1.275em;
margin-bottom: .85em;
font-weight: 500;
color: #dbd3ff;
}
.rich-formatting h1 {
font-size: 2em;
}
.rich-formatting h2 {
font-size: 1.75em;
}
.rich-formatting h3 {
font-size: 1.5em;
}
.rich-formatting h4 {
font-size: 1.25em;
}
.rich-formatting h5,
.rich-formatting h6 {
font-size: 1em;
}
.rich-formatting ul {
list-style: disc;
}
.rich-formatting ol {
list-style: decimal;
}
.rich-formatting ul,
.rich-formatting ol {
margin: 0;
padding: 0;
padding-left: 2em;
margin-bottom: .85em;
}
.rich-formatting ul[type=a],
.rich-formatting ol[type=a] {
list-style-type: lower-alpha;
}
.rich-formatting ul[type=i],
.rich-formatting ol[type=i] {
list-style-type: lower-roman;
}
.rich-formatting hr {
width: 100%;
height: 0;
border: 0;
border-bottom: 1px solid #423a50;
margin: 1.7em 0;
}
.rich-formatting hr.spacer {
height: 1px;
border: 0;
}
.rich-formatting table {
width: 100%;
border-collapse: collapse;
break-inside: auto;
margin-top: 24px;
margin-bottom: 32px;
}
.rich-formatting table thead tr,
.rich-formatting table tbody tr {
border-bottom: 1px solid #423a50;
font-size: 1em;
line-height: 1.625;
font-weight: 400;
text-align: left;
color: #e6e6fa;
}
.rich-formatting table thead tr {
border-bottom-width: 2px;
line-height: 1.5;
font-weight: 500;
color: #d5bdd6;
}
.rich-formatting table th,
.rich-formatting table td {
padding: 8px;
align-self: start;
align-items: start;
word-break: break-all;
}
.rich-formatting table th.nowrap,
.rich-formatting table td.nowrap {
width: 25%;
position: relative;
}
.rich-formatting table th.nowrap::before,
.rich-formatting table td.nowrap::before {
content: " ";
visibility: hidden;
}
.rich-formatting table th.nowrap span,
.rich-formatting table td.nowrap span {
position: absolute;
left: 8px;
right: 8px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.rich-formatting > :first-child {
margin-top: 0;
}
.information-board {
background: #2e2838;
padding: 20px 0;
}
.information-board .container-alt {
position: relative;
padding-right: 295px;
}
.information-board__sections {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.information-board__section {
flex: 1 0 0;
font-family: "mastodon-font-sans-serif", sans-serif;
font-size: 16px;
line-height: 28px;
color: #fff;
text-align: right;
padding: 10px 15px;
}
.information-board__section span,
.information-board__section strong {
display: block;
}
.information-board__section span:last-child {
color: #dbd3ff;
}
.information-board__section strong {
font-family: "mastodon-font-display", sans-serif;
font-weight: 500;
font-size: 32px;
line-height: 48px;
}
@media screen and (max-width: 700px) {
.information-board__section {
text-align: center;
}
}
.information-board .panel {
position: absolute;
width: 280px;
box-sizing: border-box;
background: #24202c;
padding: 20px;
padding-top: 10px;
border-radius: 4px 4px 0 0;
right: 0;
bottom: -40px;
}
.information-board .panel .panel-header {
font-family: "mastodon-font-display", sans-serif;
font-size: 14px;
line-height: 24px;
font-weight: 500;
color: #e6e6fa;
padding-bottom: 5px;
margin-bottom: 15px;
border-bottom: 1px solid #423a50;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.information-board .panel .panel-header a,
.information-board .panel .panel-header span {
font-weight: 400;
color: #bcbcf2;
}
.information-board .panel .panel-header a {
text-decoration: none;
}
.information-board .owner {
text-align: center;
}
.information-board .owner .avatar {
width: 80px;
height: 80px;
margin: 0 auto;
margin-bottom: 15px;
}
.information-board .owner .avatar img {
display: block;
width: 80px;
height: 80px;
border-radius: 48px;
}
.information-board .owner .name {
font-size: 14px;
}
.information-board .owner .name a {
display: block;
color: #fff;
text-decoration: none;
}
.information-board .owner .name a:hover .display_name {
text-decoration: underline;
}
.information-board .owner .name .username {
display: block;
color: #e6e6fa;
}
.landing-page p,
.landing-page li {
font-family: "mastodon-font-sans-serif", sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 30px;
margin-bottom: 12px;
color: #e6e6fa;
}
.landing-page p a,
.landing-page li a {
color: #a288bd;
text-decoration: underline;
}
.landing-page em {
display: inline;
margin: 0;
padding: 0;
font-weight: 700;
background: transparent;
font-family: inherit;
font-size: inherit;
line-height: inherit;
color: #fff;
}
.landing-page h1 {
font-family: "mastodon-font-display", sans-serif;
font-size: 26px;
line-height: 30px;
font-weight: 500;
margin-bottom: 20px;
color: #dbd3ff;
}
.landing-page h1 small {
font-family: "mastodon-font-sans-serif", sans-serif;
display: block;
font-size: 18px;
font-weight: 400;
color: #fff;
}
.landing-page h2 {
font-family: "mastodon-font-display", sans-serif;
font-size: 22px;
line-height: 26px;
font-weight: 500;
margin-bottom: 20px;
color: #dbd3ff;
}
.landing-page h3 {
font-family: "mastodon-font-display", sans-serif;
font-size: 18px;
line-height: 24px;
font-weight: 500;
margin-bottom: 20px;
color: #dbd3ff;
}
.landing-page h4 {
font-family: "mastodon-font-display", sans-serif;
font-size: 16px;
line-height: 24px;
font-weight: 500;
margin-bottom: 20px;
color: #dbd3ff;
}
.landing-page h5 {
font-family: "mastodon-font-display", sans-serif;
font-size: 14px;
line-height: 24px;
font-weight: 500;
margin-bottom: 20px;
color: #dbd3ff;
}
.landing-page h6 {
font-family: "mastodon-font-display", sans-serif;
font-size: 12px;
line-height: 24px;
font-weight: 500;
margin-bottom: 20px;
color: #dbd3ff;
}
.landing-page ul,
.landing-page ol {
margin-left: 20px;
}
.landing-page ul[type=a],
.landing-page ol[type=a] {
list-style-type: lower-alpha;
}
.landing-page ul[type=i],
.landing-page ol[type=i] {
list-style-type: lower-roman;
}
.landing-page ul {
list-style: disc;
}
.landing-page ol {
list-style: decimal;
}
.landing-page li > ol,
.landing-page li > ul {
margin-top: 6px;
}
.landing-page hr {
width: 100%;
height: 0;
border: 0;
border-bottom: 1px solid rgba(213, 189, 214, 0.6);
margin: 20px 0;
}
.landing-page hr.spacer {
height: 1px;
border: 0;
}
.landing-page__information,
.landing-page__forms {
padding: 20px;
}
.landing-page__call-to-action {
background: #383144;
border-radius: 4px;
padding: 25px 40px;
overflow: hidden;
box-sizing: border-box;
}
.landing-page__call-to-action .row {
width: 100%;
display: flex;
flex-direction: row-reverse;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
}
.landing-page__call-to-action .row__information-board {
display: flex;
justify-content: flex-end;
align-items: flex-end;
}
.landing-page__call-to-action .row__information-board .information-board__section {
flex: 1 0 auto;
padding: 0 10px;
}
@media screen and (max-width: 415px) {
.landing-page__call-to-action .row__information-board {
width: 100%;
justify-content: space-between;
}
}
.landing-page__call-to-action .row__mascot {
flex: 1;
margin: 10px -50px 0 0;
}
@media screen and (max-width: 415px) {
.landing-page__call-to-action .row__mascot {
display: none;
}
}
.landing-page__logo {
margin-right: 20px;
}
.landing-page__logo img {
height: 50px;
width: auto;
mix-blend-mode: lighten;
}
.landing-page__information {
padding: 45px 40px;
margin-bottom: 10px;
}
.landing-page__information:last-child {
margin-bottom: 0;
}
.landing-page__information strong {
font-weight: 500;
color: #fff;
}
.landing-page__information .account {
border-bottom: 0;
padding: 0;
}
.landing-page__information .account__display-name {
align-items: center;
display: flex;
margin-right: 5px;
}
.landing-page__information .account div.account__display-name:hover .display-name strong {
text-decoration: none;
}
.landing-page__information .account div.account__display-name .account__avatar {
cursor: default;
}
.landing-page__information .account__avatar-wrapper {
margin-left: 0;
flex: 0 0 auto;
}
.landing-page__information .account .display-name {
font-size: 15px;
}
.landing-page__information .account .display-name__account {
font-size: 14px;
}
@media screen and (max-width: 960px) {
.landing-page__information .contact {
margin-top: 30px;
}
}
@media screen and (max-width: 700px) {
.landing-page__information {
padding: 25px 20px;
}
}
.landing-page__information,
.landing-page__forms,
.landing-page #mastodon-timeline {
box-sizing: border-box;
background: #383144;
border-radius: 4px;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
}
.landing-page__mascot {
height: 104px;
position: relative;
left: -40px;
bottom: 25px;
}
.landing-page__mascot img {
height: 190px;
width: auto;
}
.landing-page__short-description .row {
display: flex;
flex-wrap: wrap;
align-items: center;
margin-bottom: 40px;
}
@media screen and (max-width: 700px) {
.landing-page__short-description .row {
margin-bottom: 20px;
}
}
.landing-page__short-description p a {
color: #dbd3ff;
}
.landing-page__short-description h1 {
font-weight: 500;
color: #fff;
margin-bottom: 0;
}
.landing-page__short-description h1 small {
color: #e6e6fa;
}
.landing-page__short-description h1 small span {
color: #dbd3ff;
}
.landing-page__short-description p:last-child {
margin-bottom: 0;
}
.landing-page__hero {
margin-bottom: 10px;
}
.landing-page__hero img {
display: block;
margin: 0;
max-width: 100%;
height: auto;
border-radius: 4px;
}
@media screen and (max-width: 840px) {
.landing-page .information-board .container-alt {
padding-right: 20px;
}
.landing-page .information-board .panel {
position: static;
margin-top: 20px;
width: 100%;
border-radius: 4px;
}
.landing-page .information-board .panel .panel-header {
text-align: center;
}
}
@media screen and (max-width: 675px) {
.landing-page .header-wrapper {
padding-top: 0;
}
.landing-page .header-wrapper.compact {
padding-bottom: 0;
}
.landing-page .header-wrapper.compact .hero .heading {
text-align: initial;
}
.landing-page .header .container-alt,
.landing-page .features .container-alt {
display: block;
}
}
.landing-page .cta {
margin: 20px;
}
.landing {
margin-bottom: 100px;
}
@media screen and (max-width: 738px) {
.landing {
margin-bottom: 0;
}
}
.landing__brand {
display: flex;
justify-content: center;
align-items: center;
padding: 50px;
}
.landing__brand svg {
fill: #fff;
height: 52px;
}
@media screen and (max-width: 415px) {
.landing__brand {
padding: 0;
margin-bottom: 30px;
}
}
.landing .directory {
margin-top: 30px;
background: transparent;
box-shadow: none;
border-radius: 0;
}
.landing .hero-widget {
margin-top: 30px;
margin-bottom: 0;
}
.landing .hero-widget h4 {
padding: 10px;
text-transform: uppercase;
font-weight: 700;
font-size: 13px;
color: #e6e6fa;
}
.landing .hero-widget__text {
border-radius: 0;
padding-bottom: 0;
}
.landing .hero-widget__footer {
background: #383144;
padding: 10px;
border-radius: 0 0 4px 4px;
display: flex;
}
.landing .hero-widget__footer__column {
flex: 1 1 50%;
overflow-x: hidden;
}
.landing .hero-widget .account {
padding: 10px 0;
border-bottom: 0;
}
.landing .hero-widget .account .account__display-name {
display: flex;
align-items: center;
}
.landing .hero-widget__counters__wrapper {
display: flex;
}
.landing .hero-widget__counter {
padding: 10px;
width: 50%;
}
.landing .hero-widget__counter strong {
font-family: "mastodon-font-display", sans-serif;
font-size: 15px;
font-weight: 700;
display: block;
}
.landing .hero-widget__counter span {
font-size: 14px;
color: #e6e6fa;
}
.landing .simple_form .user_agreement .label_input > label {
font-weight: 400;
color: #e6e6fa;
}
.landing .simple_form p.lead {
color: #e6e6fa;
font-size: 15px;
line-height: 20px;
font-weight: 400;
margin-bottom: 25px;
}
.landing__grid {
max-width: 960px;
margin: 0 auto;
display: grid;
grid-template-columns: minmax(0, 50%) minmax(0, 50%);
grid-gap: 30px;
}
@media screen and (max-width: 738px) {
.landing__grid {
grid-template-columns: minmax(0, 100%);
grid-gap: 10px;
}
.landing__grid__column-login {
grid-row: 1;
display: flex;
flex-direction: column;
}
.landing__grid__column-login .box-widget {
order: 2;
flex: 0 0 auto;
}
.landing__grid__column-login .hero-widget {
margin-top: 0;
margin-bottom: 10px;
order: 1;
flex: 0 0 auto;
}
.landing__grid__column-registration {
grid-row: 2;
}
.landing__grid .directory {
margin-top: 10px;
}
}
@media screen and (max-width: 415px) {
.landing__grid {
grid-gap: 0;
}
.landing__grid .hero-widget {
display: block;
margin-bottom: 0;
box-shadow: none;
}
.landing__grid .hero-widget__img,
.landing__grid .hero-widget__img img,
.landing__grid .hero-widget__footer {
border-radius: 0;
}
.landing__grid .hero-widget,
.landing__grid .box-widget,
.landing__grid .directory__tag {
border-bottom: 1px solid #4c425c;
}
.landing__grid .directory {
margin-top: 0;
}
.landing__grid .directory__tag {
margin-bottom: 0;
}
.landing__grid .directory__tag > a,
.landing__grid .directory__tag > div {
border-radius: 0;
box-shadow: none;
}
.landing__grid .directory__tag:last-child {
border-bottom: 0;
}
}
.brand {
position: relative;
text-decoration: none;
}
.brand__tagline {
display: block;
position: absolute;
bottom: -10px;
left: 50px;
width: 300px;
color: #e6e6fa;
text-decoration: none;
font-size: 14px;
}
@media screen and (max-width: 415px) {
.brand__tagline {
position: static;
width: auto;
margin-top: 20px;
color: #d5bdd6;
}
}
.rules-list {
background: #332d3e;
border: 1px solid #24202c;
border-radius: 4px;
padding: .5em 2.5em !important;
margin-top: 1.85em !important;
}
.rules-list li {
border-bottom: 1px solid #423a50;
color: #d5bdd6;
padding: 1em;
}
.rules-list li:last-child {
border-bottom: 0;
}
.rules-list__text {
color: #fff;
}
.table {
width: 100%;
max-width: 100%;
border-spacing: 0;
border-collapse: collapse;
}
.table th,
.table td {
padding: 8px;
line-height: 18px;
vertical-align: top;
border-top: 1px solid #383144;
text-align: left;
background: #2e2838;
}
.table > thead > tr > th {
vertical-align: bottom;
border-bottom: 2px solid #383144;
border-top: 0;
font-weight: 500;
}
.table > tbody > tr > th {
font-weight: 500;
}
.table > tbody > tr:nth-child(odd) > td,
.table > tbody > tr:nth-child(odd) > th {
background: #383144;
}
.table a {
color: #a288bd;
text-decoration: underline;
}
.table a:hover {
text-decoration: none;
}
.table strong {
font-weight: 500;
}
.table strong:lang(ja) {
font-weight: 700;
}
.table strong:lang(ko) {
font-weight: 700;
}
.table strong:lang(zh-CN) {
font-weight: 700;
}
.table strong:lang(zh-HK) {
font-weight: 700;
}
.table strong:lang(zh-TW) {
font-weight: 700;
}
.table.inline-table > tbody > tr:nth-child(odd) > td,
.table.inline-table > tbody > tr:nth-child(odd) > th {
background: transparent;
}
.table.inline-table > tbody > tr:first-child > td,
.table.inline-table > tbody > tr:first-child > th {
border-top: 0;
}
.table.batch-table > thead > tr > th {
background: #383144;
border-top: 1px solid #24202c;
border-bottom: 1px solid #24202c;
}
.table.batch-table > thead > tr > th:first-child {
border-radius: 4px 0 0;
border-left: 1px solid #24202c;
}
.table.batch-table > thead > tr > th:last-child {
border-radius: 0 4px 0 0;
border-right: 1px solid #24202c;
}
.table--invites tbody td {
vertical-align: middle;
}
.table-wrapper {
overflow: auto;
margin-bottom: 20px;
}
samp {
font-family: "mastodon-font-monospace", monospace;
}
button.table-action-link {
background: transparent;
border: 0;
font: inherit;
}
button.table-action-link,
a.table-action-link {
text-decoration: none;
display: inline-block;
margin-right: 5px;
padding: 0 10px;
color: #e6e6fa;
font-weight: 500;
}
button.table-action-link:hover,
a.table-action-link:hover {
color: #fff;
}
button.table-action-link i.fa,
a.table-action-link i.fa {
font-weight: 400;
margin-right: 5px;
}
button.table-action-link:first-child,
a.table-action-link:first-child {
padding-left: 0;
}
.batch-table__toolbar,
.batch-table__row {
display: flex;
}
.batch-table__toolbar__select,
.batch-table__row__select {
box-sizing: border-box;
padding: 8px 16px;
cursor: pointer;
min-height: 100%;
}
.batch-table__toolbar__select input,
.batch-table__row__select input {
margin-top: 8px;
}
.batch-table__toolbar__select--aligned,
.batch-table__row__select--aligned {
display: flex;
align-items: center;
}
.batch-table__toolbar__select--aligned input,
.batch-table__row__select--aligned input {
margin-top: 0;
}
.batch-table__toolbar__actions,
.batch-table__toolbar__content,
.batch-table__row__actions,
.batch-table__row__content {
padding: 8px 0;
padding-right: 16px;
flex: 1 1 auto;
}
.batch-table__toolbar {
border: 1px solid #24202c;
background: #383144;
border-radius: 4px 0 0;
height: 47px;
align-items: center;
}
.batch-table__toolbar__actions {
text-align: right;
padding-right: 11px;
}
.batch-table__form {
padding: 16px;
border: 1px solid #24202c;
border-top: 0;
background: #383144;
}
.batch-table__form .fields-row {
padding-top: 0;
margin-bottom: 0;
}
.batch-table__row {
border: 1px solid #24202c;
border-top: 0;
background: #2e2838;
}
@media screen and (max-width: 415px) {
.optional .batch-table__row:first-child {
border-top: 1px solid #24202c;
}
}
.batch-table__row:hover {
background: #332d3e;
}
.batch-table__row:nth-child(even) {
background: #383144;
}
.batch-table__row:nth-child(even):hover {
background: #3d354a;
}
.batch-table__row__content {
padding-top: 12px;
padding-bottom: 16px;
}
.batch-table__row__content--unpadded {
padding: 0;
}
.batch-table__row__content--with-image {
display: flex;
align-items: center;
}
.batch-table__row__content__image {
flex: 0 0 auto;
display: flex;
justify-content: center;
align-items: center;
margin-right: 10px;
}
.batch-table__row__content__image .emojione {
width: 32px;
height: 32px;
}
.batch-table__row__content__text {
flex: 1 1 auto;
}
.batch-table__row__content__extra {
flex: 0 0 auto;
text-align: right;
color: #e6e6fa;
font-weight: 500;
}
.batch-table__row .directory__tag {
margin: 0;
width: 100%;
}
.batch-table__row .directory__tag a {
background: transparent;
border-radius: 0;
}
@media screen and (max-width: 415px) {
.batch-table.optional .batch-table__toolbar,
.batch-table.optional .batch-table__row__select {
display: none;
}
}
.batch-table .status__content {
padding-top: 0;
}
.batch-table .status__content summary {
display: list-item;
}
.batch-table .status__content strong {
font-weight: 700;
}
.batch-table .nothing-here {
border: 1px solid #24202c;
border-top: 0;
box-shadow: none;
}
@media screen and (max-width: 415px) {
.batch-table .nothing-here {
border-top: 1px solid #24202c;
}
}
@media screen and (max-width: 870px) {
.batch-table .accounts-table tbody td.optional {
display: none;
}
}
.admin-wrapper {
display: flex;
justify-content: center;
width: 100%;
min-height: 100vh;
}
.admin-wrapper .sidebar-wrapper {
min-height: 100vh;
overflow: hidden;
pointer-events: none;
flex: 1 1 auto;
}
.admin-wrapper .sidebar-wrapper__inner {
display: flex;
justify-content: flex-end;
background: #383144;
height: 100%;
}
.admin-wrapper .sidebar {
width: 240px;
padding: 0;
pointer-events: auto;
}
.admin-wrapper .sidebar__toggle {
display: none;
background: #4c425c;
height: 48px;
}
.admin-wrapper .sidebar__toggle__logo {
flex: 1 1 auto;
}
.admin-wrapper .sidebar__toggle__logo a {
display: inline-block;
padding: 15px;
}
.admin-wrapper .sidebar__toggle__logo svg {
fill: #fff;
height: 20px;
position: relative;
bottom: -2px;
}
.admin-wrapper .sidebar__toggle__icon {
display: block;
color: #e6e6fa;
text-decoration: none;
flex: 0 0 auto;
font-size: 20px;
padding: 15px;
}
.admin-wrapper .sidebar__toggle a:hover,
.admin-wrapper .sidebar__toggle a:focus,
.admin-wrapper .sidebar__toggle a:active {
background: #554b68;
}
.admin-wrapper .sidebar .logo {
display: block;
margin: 40px auto;
width: 100px;
height: 100px;
}
@media screen and (max-width: 600px) {
.admin-wrapper .sidebar > a:first-child {
display: none;
}
}
.admin-wrapper .sidebar ul {
list-style: none;
border-radius: 4px 0 0 4px;
overflow: hidden;
margin-bottom: 20px;
}
@media screen and (max-width: 600px) {
.admin-wrapper .sidebar ul {
margin-bottom: 0;
}
}
.admin-wrapper .sidebar ul a {
display: block;
padding: 15px;
color: #e6e6fa;
text-decoration: none;
transition: all 200ms linear;
transition-property: color, background-color;
border-radius: 4px 0 0 4px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.admin-wrapper .sidebar ul a i.fa {
margin-right: 5px;
}
.admin-wrapper .sidebar ul a:hover {
color: #fff;
background-color: #2c2635;
transition: all 100ms linear;
transition-property: color, background-color;
}
.admin-wrapper .sidebar ul a.selected {
background: #332d3e;
border-radius: 4px 0 0;
}
.admin-wrapper .sidebar ul ul {
background: #2e2838;
border-radius: 0 0 0 4px;
margin: 0;
}
.admin-wrapper .sidebar ul ul a {
border: 0;
padding: 15px 35px;
}
.admin-wrapper .sidebar ul .simple-navigation-active-leaf a {
color: #fff;
background-color: #a288bd;
border-bottom: 0;
border-radius: 0;
}
.admin-wrapper .sidebar ul .simple-navigation-active-leaf a:hover {
background-color: #af98c6;
}
.admin-wrapper .sidebar > ul > .simple-navigation-active-leaf a {
border-radius: 4px 0 0 4px;
}
.admin-wrapper .content-wrapper {
box-sizing: border-box;
width: 100%;
max-width: 840px;
flex: 1 1 auto;
}
@media screen and (max-width: 1080px) {
.admin-wrapper .sidebar-wrapper--empty {
display: none;
}
.admin-wrapper .sidebar-wrapper {
width: 240px;
flex: 0 0 auto;
}
}
@media screen and (max-width: 600px) {
.admin-wrapper .sidebar-wrapper {
width: 100%;
}
}
.admin-wrapper .content {
padding: 55px 15px 20px 25px;
}
@media screen and (max-width: 600px) {
.admin-wrapper .content {
max-width: none;
padding: 15px;
padding-top: 30px;
}
}
.admin-wrapper .content-heading {
display: flex;
padding-bottom: 36px;
border-bottom: 1px solid #4c425c;
margin: -15px -15px 40px 0;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
.admin-wrapper .content-heading > * {
margin-top: 15px;
margin-right: 15px;
}
.admin-wrapper .content-heading-actions {
display: inline-flex;
}
.admin-wrapper .content-heading-actions > :not(:first-child) {
margin-left: 5px;
}
@media screen and (max-width: 600px) {
.admin-wrapper .content-heading {
border-bottom: 0;
padding-bottom: 0;
}
}
.admin-wrapper .content h2 {
color: #dbd3ff;
font-size: 24px;
line-height: 36px;
font-weight: 400;
}
@media screen and (max-width: 600px) {
.admin-wrapper .content h2 {
font-weight: 700;
}
}
.admin-wrapper .content h3 {
color: #dbd3ff;
font-size: 20px;
line-height: 28px;
font-weight: 400;
margin-bottom: 30px;
}
.admin-wrapper .content h4 {
text-transform: uppercase;
font-size: 13px;
font-weight: 700;
color: #e6e6fa;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px solid #4c425c;
}
.admin-wrapper .content h6 {
font-size: 16px;
color: #dbd3ff;
line-height: 28px;
font-weight: 500;
}
.admin-wrapper .content .fields-group h6 {
color: #fff;
font-weight: 500;
}
.admin-wrapper .content .directory__tag > a,
.admin-wrapper .content .directory__tag > div {
box-shadow: none;
}
.admin-wrapper .content .directory__tag .table-action-link .fa {
color: inherit;
}
.admin-wrapper .content .directory__tag h4 {
font-size: 18px;
font-weight: 700;
color: #fff;
text-transform: none;
padding-bottom: 0;
margin-bottom: 0;
border-bottom: 0;
}
.admin-wrapper .content > p {
font-size: 14px;
line-height: 21px;
color: #dbd3ff;
margin-bottom: 20px;
}
.admin-wrapper .content > p strong {
color: #fff;
font-weight: 500;
}
.admin-wrapper .content > p strong:lang(ja) {
font-weight: 700;
}
.admin-wrapper .content > p strong:lang(ko) {
font-weight: 700;
}
.admin-wrapper .content > p strong:lang(zh-CN) {
font-weight: 700;
}
.admin-wrapper .content > p strong:lang(zh-HK) {
font-weight: 700;
}
.admin-wrapper .content > p strong:lang(zh-TW) {
font-weight: 700;
}
.admin-wrapper .content hr {
width: 100%;
height: 0;
border: 0;
border-bottom: 1px solid rgba(213, 189, 214, 0.6);
margin: 20px 0;
}
.admin-wrapper .content hr.spacer {
height: 1px;
border: 0;
}
@media screen and (max-width: 600px) {
.admin-wrapper {
display: block;
}
.admin-wrapper .sidebar-wrapper {
min-height: 0;
}
.admin-wrapper .sidebar {
width: 100%;
padding: 0;
height: auto;
}
.admin-wrapper .sidebar__toggle {
display: flex;
}
.admin-wrapper .sidebar > ul {
display: none;
}
.admin-wrapper .sidebar ul a,
.admin-wrapper .sidebar ul ul a {
border-radius: 0;
border-bottom: 1px solid #423a50;
transition: none;
}
.admin-wrapper .sidebar ul a:hover,
.admin-wrapper .sidebar ul ul a:hover {
transition: none;
}
.admin-wrapper .sidebar ul ul {
border-radius: 0;
}
.admin-wrapper .sidebar ul .simple-navigation-active-leaf a {
border-bottom-color: #a288bd;
}
}
hr.spacer {
width: 100%;
border: 0;
margin: 20px 0;
height: 1px;
}
body .muted-hint,
.admin-wrapper .content .muted-hint {
color: #e6e6fa;
}
body .muted-hint a,
.admin-wrapper .content .muted-hint a {
color: #a288bd;
}
body .positive-hint,
.admin-wrapper .content .positive-hint {
color: #79bd9a;
font-weight: 500;
}
body .negative-hint,
.admin-wrapper .content .negative-hint {
color: #df405a;
font-weight: 500;
}
body .neutral-hint,
.admin-wrapper .content .neutral-hint {
color: #d5bdd6;
font-weight: 500;
}
body .warning-hint,
.admin-wrapper .content .warning-hint {
color: #ca8f04;
font-weight: 500;
}
.filters {
display: flex;
flex-wrap: wrap;
}
.filters .filter-subset {
flex: 0 0 auto;
margin: 0 40px 20px 0;
}
.filters .filter-subset:last-child {
margin-bottom: 30px;
}
.filters .filter-subset ul {
margin-top: 5px;
list-style: none;
}
.filters .filter-subset ul li {
display: inline-block;
margin-right: 5px;
}
.filters .filter-subset strong {
font-weight: 500;
text-transform: uppercase;
font-size: 12px;
}
.filters .filter-subset strong:lang(ja) {
font-weight: 700;
}
.filters .filter-subset strong:lang(ko) {
font-weight: 700;
}
.filters .filter-subset strong:lang(zh-CN) {
font-weight: 700;
}
.filters .filter-subset strong:lang(zh-HK) {
font-weight: 700;
}
.filters .filter-subset strong:lang(zh-TW) {
font-weight: 700;
}
.filters .filter-subset--with-select strong {
display: block;
margin-bottom: 10px;
}
.filters .filter-subset a {
display: inline-block;
color: #e6e6fa;
text-decoration: none;
text-transform: uppercase;
font-size: 12px;
font-weight: 500;
border-bottom: 2px solid #383144;
}
.filters .filter-subset a:hover {
color: #fff;
border-bottom: 2px solid #443c53;
}
.filters .filter-subset a.selected {
color: #a288bd;
border-bottom: 2px solid #a288bd;
}
.report-accounts {
display: flex;
flex-wrap: wrap;
margin-bottom: 20px;
}
.report-accounts__item {
display: flex;
flex: 250px;
flex-direction: column;
margin: 0 5px;
}
.report-accounts__item > strong {
display: block;
margin: 0 0 10px -5px;
font-weight: 500;
font-size: 14px;
line-height: 18px;
color: #dbd3ff;
}
.report-accounts__item > strong:lang(ja) {
font-weight: 700;
}
.report-accounts__item > strong:lang(ko) {
font-weight: 700;
}
.report-accounts__item > strong:lang(zh-CN) {
font-weight: 700;
}
.report-accounts__item > strong:lang(zh-HK) {
font-weight: 700;
}
.report-accounts__item > strong:lang(zh-TW) {
font-weight: 700;
}
.report-accounts__item .account-card {
flex: 1 1 auto;
}
.report-status,
.account-status {
display: flex;
margin-bottom: 10px;
}
.report-status .activity-stream,
.account-status .activity-stream {
flex: 2 0 0;
margin-right: 20px;
max-width: calc(100% - 60px);
}
.report-status .activity-stream .entry,
.account-status .activity-stream .entry {
border-radius: 4px;
}
.report-status__actions,
.account-status__actions {
flex: 0 0 auto;
display: flex;
flex-direction: column;
}
.report-status__actions .icon-button,
.account-status__actions .icon-button {
font-size: 24px;
width: 24px;
text-align: center;
margin-bottom: 10px;
}
.simple_form.new_report_note,
.simple_form.new_account_moderation_note {
max-width: 100%;
}
.simple_form .actions {
margin-top: 15px;
}
.simple_form .button {
font-size: 15px;
}
.batch-form-box {
display: flex;
flex-wrap: wrap;
margin-bottom: 5px;
}
.batch-form-box #form_status_batch_action {
margin: 0 5px 5px 0;
font-size: 14px;
}
.batch-form-box input.button {
margin: 0 5px 5px 0;
}
.batch-form-box .media-spoiler-toggle-buttons {
margin-left: auto;
}
.batch-form-box .media-spoiler-toggle-buttons .button {
overflow: visible;
margin: 0 0 5px 5px;
float: right;
}
.back-link {
margin-bottom: 10px;
font-size: 14px;
}
.back-link a {
color: #a288bd;
text-decoration: none;
}
.back-link a:hover {
text-decoration: underline;
}
.special-action-button,
.back-link {
text-align: right;
flex: 1 1 auto;
}
.action-buttons {
display: flex;
overflow: hidden;
justify-content: space-between;
}
.spacer {
flex: 1 1 auto;
}
.log-entry {
line-height: 20px;
padding: 15px 0;
background: #383144;
border-bottom: 1px solid #423a50;
}
.log-entry:last-child {
border-bottom: 0;
}
.log-entry__header {
display: flex;
justify-content: flex-start;
align-items: center;
color: #e6e6fa;
font-size: 14px;
padding: 0 10px;
}
.log-entry__avatar {
margin-right: 10px;
}
.log-entry__avatar .avatar {
display: block;
margin: 0;
border-radius: 50%;
width: 40px;
height: 40px;
}
.log-entry__content {
max-width: calc(100% - 90px);
}
.log-entry__title {
word-wrap: break-word;
}
.log-entry__timestamp {
color: #d5bdd6;
}
.log-entry a,
.log-entry .username,
.log-entry .target {
color: #dbd3ff;
text-decoration: none;
font-weight: 500;
}
a.name-tag,
.name-tag,
a.inline-name-tag,
.inline-name-tag {
text-decoration: none;
color: #dbd3ff;
}
a.name-tag .username,
.name-tag .username,
a.inline-name-tag .username,
.inline-name-tag .username {
font-weight: 500;
}
a.name-tag.suspended .username,
.name-tag.suspended .username,
a.inline-name-tag.suspended .username,
.inline-name-tag.suspended .username {
text-decoration: line-through;
color: #e87487;
}
a.name-tag.suspended .avatar,
.name-tag.suspended .avatar,
a.inline-name-tag.suspended .avatar,
.inline-name-tag.suspended .avatar {
filter: grayscale(100%);
opacity: .8;
}
a.name-tag,
.name-tag {
display: flex;
align-items: center;
}
a.name-tag .avatar,
.name-tag .avatar {
display: block;
margin: 0;
margin-right: 5px;
border-radius: 50%;
}
a.name-tag.suspended .avatar,
.name-tag.suspended .avatar {
filter: grayscale(100%);
opacity: .8;
}
.speech-bubble {
margin-bottom: 20px;
border-left: 4px solid #a288bd;
}
.speech-bubble.positive {
border-left-color: #79bd9a;
}
.speech-bubble.negative {
border-left-color: #e87487;
}
.speech-bubble.warning {
border-left-color: #ca8f04;
}
.speech-bubble__bubble {
padding: 16px;
padding-left: 14px;
font-size: 15px;
line-height: 20px;
border-radius: 4px 4px 4px 0;
position: relative;
font-weight: 500;
}
.speech-bubble__bubble a {
color: #e6e6fa;
}
.speech-bubble__owner {
padding: 8px;
padding-left: 12px;
}
.speech-bubble time {
color: #d5bdd6;
}
.report-card {
background: #383144;
border-radius: 4px;
margin-bottom: 20px;
}
.report-card__profile {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px;
}
.report-card__profile .account {
padding: 0;
border: 0;
}
.report-card__profile .account__avatar-wrapper {
margin-left: 0;
}
.report-card__profile__stats {
flex: 0 0 auto;
font-weight: 500;
color: #e6e6fa;
text-transform: uppercase;
text-align: right;
}
.report-card__profile__stats a {
color: inherit;
text-decoration: none;
}
.report-card__profile__stats a:focus,
.report-card__profile__stats a:hover,
.report-card__profile__stats a:active {
color: #fff;
}
.report-card__profile__stats .red {
color: #df405a;
}
.report-card__summary__item {
display: flex;
justify-content: flex-start;
border-top: 1px solid #2e2838;
}
.report-card__summary__item:hover {
background: #3d354a;
}
.report-card__summary__item__reported-by,
.report-card__summary__item__assigned {
padding: 15px;
flex: 0 0 auto;
box-sizing: border-box;
width: 150px;
color: #e6e6fa;
}
.report-card__summary__item__reported-by,
.report-card__summary__item__reported-by .username,
.report-card__summary__item__assigned,
.report-card__summary__item__assigned .username {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.report-card__summary__item__content {
flex: 1 1 auto;
max-width: calc(100% - 300px);
}
.report-card__summary__item__content__icon {
color: #d5bdd6;
margin-right: 4px;
font-weight: 500;
}
.report-card__summary__item__content a {
display: block;
box-sizing: border-box;
width: 100%;
padding: 15px;
text-decoration: none;
color: #e6e6fa;
}
.one-line {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.ellipsized-ip {
display: inline-block;
max-width: 120px;
overflow: hidden;
text-overflow: ellipsis;
vertical-align: middle;
}
.admin-account-bio {
display: flex;
flex-wrap: wrap;
margin: 0 -5px;
margin-top: 20px;
}
.admin-account-bio > div {
box-sizing: border-box;
padding: 0 5px;
margin-bottom: 10px;
flex: 1 0 50%;
}
.admin-account-bio .account__header__fields,
.admin-account-bio .account__header__content {
background: #4c425c;
border-radius: 4px;
height: 100%;
}
.admin-account-bio .account__header__fields {
margin: 0;
border: 0;
}
.admin-account-bio .account__header__fields a {
color: #b7a2cc;
}
.admin-account-bio .account__header__fields dl:first-child .verified {
border-radius: 0 4px 0 0;
}
.admin-account-bio .account__header__fields .verified a {
color: #79bd9a;
}
.admin-account-bio .account__header__content {
box-sizing: border-box;
padding: 20px;
color: #fff;
}
.center-text {
text-align: center;
}
.announcements-list {
border: 1px solid #423a50;
border-radius: 4px;
}
.announcements-list__item {
padding: 15px 0;
background: #383144;
border-bottom: 1px solid #423a50;
}
.announcements-list__item__title {
padding: 0 15px;
display: block;
font-weight: 500;
font-size: 18px;
line-height: 1.5;
color: #dbd3ff;
text-decoration: none;
margin-bottom: 10px;
}
.announcements-list__item__title:hover,
.announcements-list__item__title:focus,
.announcements-list__item__title:active {
color: #fff;
}
.announcements-list__item__meta {
padding: 0 15px;
color: #d5bdd6;
}
.announcements-list__item__action-bar {
display: flex;
justify-content: space-between;
align-items: center;
}
.announcements-list__item:last-child {
border-bottom: 0;
}
.account-badges {
margin: -2px 0;
}
.dashboard__counters.admin-account-counters {
margin-top: 10px;
}
.dashboard__counters {
display: flex;
flex-wrap: wrap;
margin: 0 -5px;
margin-bottom: 20px;
}
.dashboard__counters > div {
box-sizing: border-box;
flex: 0 0 33.333%;
padding: 0 5px;
margin-bottom: 10px;
}
.dashboard__counters > div > div,
.dashboard__counters > div > a {
padding: 20px;
background: #423a50;
border-radius: 4px;
box-sizing: border-box;
height: 100%;
}
.dashboard__counters > div > a {
text-decoration: none;
color: inherit;
display: block;
}
.dashboard__counters > div > a:hover,
.dashboard__counters > div > a:focus,
.dashboard__counters > div > a:active {
background: #4c425c;
}
.dashboard__counters__num,
.dashboard__counters__text {
text-align: center;
font-weight: 500;
font-size: 24px;
line-height: 21px;
color: #fff;
font-family: "mastodon-font-display", sans-serif;
margin-bottom: 20px;
line-height: 30px;
}
.dashboard__counters__text {
font-size: 18px;
}
.dashboard__counters__label {
font-size: 14px;
color: #e6e6fa;
text-align: center;
font-weight: 500;
}
.dashboard__widgets {
display: flex;
flex-wrap: wrap;
margin: 0 -5px;
}
.dashboard__widgets > div {
flex: 0 0 33.333%;
margin-bottom: 20px;
}
.dashboard__widgets > div > div {
padding: 0 5px;
}
.dashboard__widgets a:not(.name-tag) {
color: #dbd3ff;
font-weight: 500;
text-decoration: none;
}
body.rtl {
direction: rtl;
}
body.rtl .column-header > button {
text-align: right;
padding-left: 0;
padding-right: 15px;
}
body.rtl .radio-button__input {
margin-right: 0;
margin-left: 10px;
}
body.rtl .directory__card__bar .display-name {
margin-left: 0;
margin-right: 15px;
}
body.rtl .display-name,
body.rtl .announcements__item {
text-align: right;
}
body.rtl .announcements__item__range {
padding-right: 0;
padding-left: 18px;
}
body.rtl .reactions-bar {
margin-left: auto;
margin-right: -2px;
direction: rtl;
}
body.rtl .reactions-bar__item__count {
margin-left: 0;
margin-right: 6px;
}
body.rtl .announcements__pagination {
right: auto;
left: 0;
}
body.rtl .notification__message {
margin-left: 0;
margin-right: 68px;
}
body.rtl .announcements__mastodon,
body.rtl .drawer__inner__mastodon > img {
transform: scaleX(-1);
}
body.rtl .notification__favourite-icon-wrapper {
left: auto;
right: -26px;
}
body.rtl .landing-page__logo {
margin-right: 0;
margin-left: 20px;
}
body.rtl .landing-page .features-list .features-list__row .visual {
margin-left: 0;
margin-right: 15px;
}
body.rtl .column-link__icon,
body.rtl .column-header__icon {
margin-right: 0;
margin-left: 5px;
}
body.rtl .compose-form .compose-form__buttons-wrapper .character-counter__wrapper {
margin-right: 0;
margin-left: 4px;
}
body.rtl .navigation-bar__profile {
margin-left: 0;
margin-right: 8px;
}
body.rtl .search__input {
padding-right: 10px;
padding-left: 30px;
}
body.rtl .search__icon .fa {
right: auto;
left: 10px;
}
body.rtl .columns-area {
direction: rtl;
}
body.rtl .column-header__buttons {
left: 0;
right: auto;
margin-left: 0;
margin-right: -15px;
}
body.rtl .column-inline-form .icon-button {
margin-left: 0;
margin-right: 5px;
}
body.rtl .column-header__links .text-btn {
margin-left: 10px;
margin-right: 0;
}
body.rtl .account__avatar-wrapper {
float: right;
}
body.rtl .column-header__back-button {
padding-left: 5px;
padding-right: 0;
}
body.rtl .column-header__setting-arrows {
float: left;
}
body.rtl .setting-toggle__label {
margin-left: 0;
margin-right: 8px;
}
body.rtl .status__avatar {
left: auto;
right: 10px;
}
body.rtl .status,
body.rtl .activity-stream .status.light {
padding-left: 10px;
padding-right: 68px;
}
body.rtl .status__info .status__display-name,
body.rtl .activity-stream .status.light .status__display-name {
padding-left: 25px;
padding-right: 0;
}
body.rtl .activity-stream .pre-header {
padding-right: 68px;
padding-left: 0;
}
body.rtl .status__prepend {
margin-left: 0;
margin-right: 68px;
}
body.rtl .status__prepend-icon-wrapper {
left: auto;
right: -26px;
}
body.rtl .activity-stream .pre-header .pre-header__icon {
left: auto;
right: 42px;
}
body.rtl .account__header__tabs__buttons > .icon-button {
margin-right: 0;
margin-left: 8px;
}
body.rtl .account__avatar-overlay-overlay {
right: auto;
left: 0;
}
body.rtl .column-back-button--slim-button {
right: auto;
left: 0;
}
body.rtl .status__relative-time,
body.rtl .status__visibility-icon,
body.rtl .activity-stream .status.light .status__header .status__meta {
float: left;
}
body.rtl .status__action-bar__counter {
margin-right: 0;
margin-left: 11px;
}
body.rtl .status__action-bar__counter .status__action-bar-button {
margin-right: 0;
margin-left: 4px;
}
body.rtl .status__action-bar-button {
float: right;
margin-right: 0;
margin-left: 18px;
}
body.rtl .status__action-bar-dropdown {
float: right;
}
body.rtl .privacy-dropdown__dropdown {
margin-left: 0;
margin-right: 40px;
}
body.rtl .privacy-dropdown__option__icon {
margin-left: 10px;
margin-right: 0;
}
body.rtl .picture-in-picture__header__account .display-name,
body.rtl .detailed-status__display-name .display-name {
text-align: right;
}
body.rtl .detailed-status__display-avatar {
margin-right: 0;
margin-left: 10px;
float: right;
}
body.rtl .picture-in-picture__header__account .account__avatar {
margin-right: 0;
margin-left: 10px;
}
body.rtl .icon-button__counter {
margin-left: 0;
margin-right: 4px;
}
body.rtl .notifications-permission-banner__close {
right: auto;
left: 10px;
}
body.rtl .detailed-status__favorites,
body.rtl .detailed-status__reblogs {
margin-left: 0;
margin-right: 6px;
}
body.rtl .fa-ul {
margin-left: 2.14285714em;
}
body.rtl .fa-li {
left: auto;
right: -2.14285714em;
}
body.rtl .admin-wrapper {
direction: rtl;
}
body.rtl .admin-wrapper .sidebar ul a i.fa,
body.rtl a.table-action-link i.fa {
margin-right: 0;
margin-left: 5px;
}
body.rtl .simple_form .check_boxes .checkbox label {
padding-left: 0;
padding-right: 25px;
}
body.rtl .simple_form .input.with_label.boolean label.checkbox {
padding-left: 25px;
padding-right: 0;
}
body.rtl .simple_form .check_boxes .checkbox input[type=checkbox],
body.rtl .simple_form .input.boolean input[type=checkbox] {
left: auto;
right: 0;
}
body.rtl .simple_form .input.radio_buttons .radio {
left: auto;
right: 0;
}
body.rtl .simple_form .input.radio_buttons .radio > label {
padding-right: 28px;
padding-left: 0;
}
body.rtl .simple_form .input-with-append .input input {
padding-left: 142px;
padding-right: 0;
}
body.rtl .simple_form .input.boolean label.checkbox {
left: auto;
right: 0;
}
body.rtl .simple_form .input.boolean .label_input,
body.rtl .simple_form .input.boolean .hint {
padding-left: 0;
padding-right: 28px;
}
body.rtl .simple_form .label_input__append {
right: auto;
left: 3px;
}
body.rtl .simple_form .label_input__append::after {
right: auto;
left: 0;
background-image: linear-gradient(to left, rgba(32, 28, 38, 0), #201c26);
}
body.rtl .simple_form select {
background: #201c26 url("data:image/svg+xml;utf8,") no-repeat left 8px center/auto 16px;
}
body.rtl .table th,
body.rtl .table td {
text-align: right;
}
body.rtl .filters .filter-subset {
margin-right: 0;
margin-left: 45px;
}
body.rtl .landing-page .header-wrapper .mascot {
right: 60px;
left: auto;
}
body.rtl .landing-page__call-to-action .row__information-board {
direction: rtl;
}
body.rtl .landing-page .header .hero .floats .float-1 {
left: -120px;
right: auto;
}
body.rtl .landing-page .header .hero .floats .float-2 {
left: 210px;
right: auto;
}
body.rtl .landing-page .header .hero .floats .float-3 {
left: 110px;
right: auto;
}
body.rtl .landing-page .header .links .brand img {
left: 0;
}
body.rtl .landing-page .fa-external-link {
padding-right: 5px;
padding-left: 0 !important;
}
body.rtl .landing-page .features #mastodon-timeline {
margin-right: 0;
margin-left: 30px;
}
@media screen and (min-width: 631px) {
body.rtl .column,
body.rtl .drawer {
padding-left: 5px;
padding-right: 5px;
}
body.rtl .column:first-child,
body.rtl .drawer:first-child {
padding-left: 5px;
padding-right: 10px;
}
body.rtl .columns-area > div .column,
body.rtl .columns-area > div .drawer {
padding-left: 5px;
padding-right: 5px;
}
}
body.rtl .columns-area--mobile .column,
body.rtl .columns-area--mobile .drawer {
padding-left: 0;
padding-right: 0;
}
body.rtl .public-layout .header .nav-button {
margin-left: 8px;
margin-right: 0;
}
body.rtl .public-layout .public-account-header__tabs {
margin-left: 0;
margin-right: 20px;
}
body.rtl .landing-page__information .account__display-name {
margin-right: 0;
margin-left: 5px;
}
body.rtl .landing-page__information .account__avatar-wrapper {
margin-left: 12px;
margin-right: 0;
}
body.rtl .card__bar .display-name {
margin-left: 0;
margin-right: 15px;
text-align: right;
}
body.rtl .fa-chevron-left::before {
content: "";
}
body.rtl .fa-chevron-right::before {
content: "";
}
body.rtl .column-back-button__icon {
margin-right: 0;
margin-left: 5px;
}
body.rtl .column-header__setting-arrows .column-header__setting-btn:last-child {
padding-left: 0;
padding-right: 10px;
}
body.rtl .simple_form .input.radio_buttons .radio > label input {
left: auto;
right: 0;
}
body.rtl .picture-in-picture {
right: auto;
left: 20px;
}
.emojione[title=":wavy_dash:"],
.emojione[title=":top:"],
.emojione[title=":tm:"],
.emojione[title=":telephone_receiver:"],
.emojione[title=":spider:"],
.emojione[title=":soon:"],
.emojione[title=":registered:"],
.emojione[title=":on:"],
.emojione[title=":heavy_plus_sign:"],
.emojione[title=":heavy_multiplication_x:"],
.emojione[title=":heavy_minus_sign:"],
.emojione[title=":heavy_dollar_sign:"],
.emojione[title=":heavy_division_sign:"],
.emojione[title=":heavy_check_mark:"],
.emojione[title=":end:"],
.emojione[title=":currency_exchange:"],
.emojione[title=":curly_loop:"],
.emojione[title=":copyright:"],
.emojione[title=":back:"] {
filter: invert(1);
}
.column {
flex-grow: 1;
}
@font-face {
font-family: "witchesAwesome";
src: url("../fonts/witchesAwesome/witchesAwesome.eot?c15");
src: url("../fonts/witchesAwesome/witchesAwesome.eot?c15#iefix") format("embedded-opentype"), url("../fonts/witchesAwesome/witchesAwesome.ttf?c15") format("truetype"), url("../fonts/witchesAwesome/witchesAwesome.woff?c15") format("woff"), url("../fonts/witchesAwesome/witchesAwesome.svg?c15#witchesAwesome") format("svg");
font-weight: normal;
font-style: normal;
}
.fa {
font-family: witchesAwesome, FontAwesome;
}
.detailed-status__link .fa-star {
font-size: 11px;
}
.detailed-status__link .fa-retweet {
font-size: 12px;
}
.account__action-bar__tab:nth-child(3) > strong > span,
.counter:nth-child(3) > a > .counter-number {
visibility: hidden;
white-space: nowrap;
}
.account__action-bar__tab:nth-child(3) > strong > span::before,
.counter:nth-child(3) > a > .counter-number::before {
visibility: visible;
content: "⛧666⛧";
}
button.icon-button i.fa-retweet {
background-image: url("data:image/svg+xml;utf8,%3Csvg width='22px' height='209px' version='1.1' viewBox='0 0 22 209' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%238BB82D'%3E%3Cg transform='translate%283 191.19%29'%3E%3Cpath d='m11.202 1.8024c0.053418 0.4381-0.55297 0.8378-1.3543 0.89265-0.80148 0.05463-1.4946-0.25628-1.5479-0.69448-0.02991-0.24647 0.14882-0.48081 0.45348-0.64839 0.029595-0.016136 0.06045-0.03185 0.092459-0.046826 0.22364-0.10483 0.50196-0.17644 0.80873-0.19732 0.80148-0.054841 1.4942 0.25607 1.5476 0.69437m4.0378-0.29825c-1.8351 0.33063-4.0974-2.4486-6.9584-0.95392l-1.0495e-4 1.0546e-4c-0.52978 0.27674-1.0802 0.70017-1.6522 1.3169-1.0516 0.34107-3.4064 0.58553-4.7676 1.4599-1.9651 1.2623 1.362 4.314 2.1613 3.9165 0.52757-0.2625 1.8362-0.81745 2.2249-0.85753l-0.22648-0.31745 0.23361-0.31207c0.35777-0.47743 0.60334-1.0416 0.75604-1.6872l0.13108-0.74289c0.0016792-0.012339 0.0034633-0.024468 0.0048276-0.036807l1.0509 0.12476c-0.11387 0.96679-0.38022 1.8657-0.86424 2.6402 0.49073 0.64122 1.159 1.371 1.9607 1.9757 1.3809 0.96816 2.9499 1.7304 4.3583 1.2366-1.1538-0.5405-2.0283-1.1814-2.6207-1.861-0.6682-0.76693-1.0017-1.6169-0.81912-2.4124 0.13696-0.5965 0.57259-1.0764 1.1973-1.3759 0.20832-0.099769 0.43753-0.1795 0.68373-0.23698 0.93823-0.21884 2.1614-0.17096 3.6984 0.20534 0.14798-0.74658-0.087002-1.4232-0.55223-2.0819'/%3E%3Cpath d='m13.162 4.5324c-0.0018891-7.3825e-4 -0.0036732-0.0012656-0.0055622-0.0017929-0.25744-0.062013-0.48591-0.034276-0.63252-1.0547e-4 -0.15259 0.035647-0.2715 0.11844-0.367 0.18498-0.037151 0.025839-0.071889 0.050201-0.10526 0.069395-0.018681 0.010546-0.02886 0.031428-0.026027 0.052837 0.0028335 0.021304 0.018261 0.038811 0.03904 0.044084l0.20874 0.055263-0.18985 0.68794-0.35808-0.091543c-0.016792-0.0040076-0.035052 0.0011601-0.047961 0.013183-0.012804 0.012234-0.018471 0.030057-0.015427 0.047564 0.03967 0.22116 0.15721 0.46562 0.33982 0.70703 0.0053523 0.0070661 0.012384 0.012656 0.020465 0.016241 2.3313 1.0468 2.2046 3.1414 2.058 5.567-0.018786 0.31006-0.038096 0.63078-0.051634 0.94548-4.198e-4 0.0023202-0.041979 0.23634-0.21115 0.45065-0.13675 0.17328-0.35777 0.25796-0.66232 0.24858l-9.4027-4.219e-4c-0.037256 0-0.073778-0.036807-0.073778-0.074246l-0.056987-5.532c-0.80579-0.14238-2.2168-1.3662-2.6936-2.4784-0.37151 0.52764-0.39786 0.95666-0.39786 1.6508v6.3596c0 1.7855 1.4454 3.2382 3.2222 3.2382h9.3819c1.6916 0 3.6583-1.4301 3.6582-3.2714l0.0072414-0.15472c0.19741-4.2307 0.33993-7.2874-3.6379-8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 133%29'%3E%3Cpath transform='translate%288.5407 5.5337%29 rotate%28180%29 translate%28-8.5407 -5.5337%29' d='m5.8815 8.495c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.0547e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087001 1.4233 0.55234 2.082'/%3E%3Cpath transform='translate%288.7093 11.363%29 rotate%28180%29 translate%28-8.7093 -11.363%29' d='m4.2522 17.424c0.0018891 7.382e-4 0.0036732 0.0012655 0.0055622 0.0017928 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.007066-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2185e-4c0.037256 0 0.073778 0.036807 0.073778 0.074247l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 152%29'%3E%3Cpath transform='translate%288.5407 5.5337%29 rotate%28180%29 translate%28-8.5407 -5.5337%29' d='m5.8815 8.495c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.0547e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087001 1.4233 0.55234 2.082'/%3E%3Cpath transform='translate%288.7093 11.363%29 rotate%28180%29 translate%28-8.7093 -11.363%29' d='m4.2522 17.424c0.0018891 7.382e-4 0.0036732 0.0012655 0.0055622 0.0017928 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.007066-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2185e-4c0.037256 0 0.073778 0.036807 0.073778 0.074247l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 171.6%29'%3E%3Cpath transform='translate%288.5407 5.5337%29 rotate%28180%29 translate%28-8.5407 -5.5337%29' d='m5.8815 8.495c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.0547e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087001 1.4233 0.55234 2.082'/%3E%3Cpath transform='translate%288.7093 11.363%29 rotate%28180%29 translate%28-8.7093 -11.363%29' d='m4.2522 17.424c0.0018891 7.382e-4 0.0036732 0.0012655 0.0055622 0.0017928 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.007066-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2185e-4c0.037256 0 0.073778 0.036807 0.073778 0.074247l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 113.92%29'%3E%3Cpath transform='translate%288.5407 5.5337%29 rotate%28180%29 translate%28-8.5407 -5.5337%29' d='m5.8815 8.495c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.0547e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087001 1.4233 0.55234 2.082'/%3E%3Cpath transform='translate%288.7093 11.363%29 rotate%28180%29 translate%28-8.7093 -11.363%29' d='m4.2522 17.424c0.0018891 7.382e-4 0.0036732 0.0012655 0.0055622 0.0017928 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.007066-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2185e-4c0.037256 0 0.073778 0.036807 0.073778 0.074247l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%281 98.1%29'%3E%3Cpath transform='translate%284.2656 7.449%29 rotate%28180%29 translate%28-4.2656 -7.449%29' d='m6.9773 9.4652c-0.40121 0.049357-0.76727-0.5115-0.81744-1.2526-0.050165-0.74109 0.23466-1.3819 0.63598-1.4314 0.22564-0.027737 0.44025 0.13752 0.59379 0.41932 0.014693 0.027421 0.029175 0.056001 0.042819 0.085531 0.096027 0.20681 0.16151 0.46415 0.18082 0.74795 0.05006 0.74109-0.23456 1.3818-0.63598 1.4311m0.27318 3.7338c-0.30277-1.697 2.2422-3.7891 0.87348-6.4349v-1.0546e-4c-0.25355-0.48998-0.78238-1.9433-1.5057-2.2148-0.65876-0.77832-2.251-2.3071-3.4701-3.1623-1.76-1.2346-3.1705 2.6827-2.5527 3.2255 0.40793 0.35847 1.6273 0.54367 1.7981 0.86174l0.1888-0.30532 0.77388-0.27864c0.43721 0.33073 0.95376 0.5579 1.5451 0.69912l0.68027 0.12118c0.011334 0.0014765 0.022354 0.0031639 0.033583 0.0044295l-0.11408 0.97185c-0.88544-0.10525-1.7085-0.35162-2.4178-0.7992-0.58718 0.45392-1.2555 1.0718-1.8092 1.8133-0.8867 1.277-1.5846 2.7278-1.1325 4.0302 0.49504-1.0668 1.082-1.8757 1.7043-2.4235 0.7022-0.61802 1.4806-0.92629 2.209-0.75755 0.54625 0.12666 0.98577 0.52953 1.26 1.1073 0.091304 0.19268 0.16445 0.40466 0.21703 0.63226 0.20034 0.86765 0.15658 1.999-0.18807 3.4203 0.68363 0.13668 1.3032-0.080574 1.9065-0.51087'/%3E%3Cpath transform='translate%2811.421 6.603%29 rotate%28180%29 translate%28-11.421 -6.603%29' d='m18.57 8.7472l-0.097286 0.24626-0.0010495 0.0042186-0.0011544 0.0044295-0.036522 0.13236-0.78574-0.21894 0.035367-0.12793 0.052789-0.20913 0.016372-0.071294c-0.18901 0.03417-0.45337 0.029108-0.62391 0.30595-0.010914 0.017612-0.15018 0.276-0.15669 0.29572-0.73537 2.2486-3.3947 1.4306-6.0615 1.2467-0.10327-0.007066-3.5133-0.39791-3.5133-0.39791-0.50973-0.10304-0.43837-0.34466-0.43837-0.44042v-6.3596c0-0.098925 0.080495-0.17971 0.17883-0.17971h7.1843c-0.24705-0.62603 0.064333-1.5771 0.18439-1.8982 0.13444-0.35932 0.31757-0.72717 0.54384-1.0547h-7.9125c-1.7217 0-3.1174 1.4026-3.1174 3.1327v6.3596c0 1.7301 1.3957 3.1327 3.1174 3.1327 0 0 3.036 0.32725 4.1752 0.39254 2.8306 0.16189 6.0343 0.7992 7.4377-3.0978 0.054678-0.22907 0.094873-0.59323 0.055832-0.7624-0.046492-0.20144-0.16802-0.31375-0.23666-0.43504'/%3E%3C/g%3E%3Cg transform='translate%281 78.28%29'%3E%3Cpath transform='translate%286.1503 9.7893%29 rotate%28180%29 translate%28-6.1503 -9.7893%29' d='m9.3801 8.4249c-0.24894 0.32008-0.90244 0.18361-1.4593-0.3049-0.55706-0.4883-0.80663-1.1438-0.55759-1.4638 0.1401-0.18013 0.40814-0.21557 0.71501-0.1254 0.0297 0.008859 0.059925 0.018773 0.09036 0.029846h1.0495e-4c0.21336 0.078043 0.44078 0.21356 0.65393 0.40045 0.55696 0.48851 0.80663 1.1438 0.55748 1.4638m2.8205 2.4461c-1.4082-0.98482-1.0807-4.2724-3.9102-5.1708h-1.0495e-4c-0.524-0.16632-1.9206-0.81819-2.6231-0.49621-1.0135-0.082367-3.1013-0.70798-4.565-0.44643-2.1131 0.37756-0.3542 4.1498 0.46471 4.0947 0.54048-0.03649 1.4191-0.095867 1.7636 0.0076988l-0.081334-0.35003 0.35126-0.74689c0.54184-0.076989 1.067-0.28328 1.5844-0.60367l0.5664-0.3977c0.0090255-0.0069606 0.018051-0.013605 0.026972-0.020776l0.60303 0.76841c-0.7001 0.55463-1.4554 0.96542-2.2721 1.1528-0.095712 0.73825-0.13349 1.6501-0.0032534 2.5678 0.2716 1.533 0.79886 3.0549 2.0352 3.6545-0.40079-1.1061-0.55486-2.095-0.50028-2.9247 0.061709-0.93599 0.39523-1.7072 1.0291-2.1054 0.47541-0.29867 1.0695-0.32599 1.67-0.11242 0.20013 0.071294 0.4009 0.16937 0.59841 0.29298 0.75205 0.471 1.517 1.3021 2.2736 2.552 0.57963-0.38916 0.86487-0.98303 0.98861-1.716'/%3E%3Cpath transform='translate%2810.498 6.9503%29 rotate%28180%29 translate%28-10.498 -6.9503%29' d='m17.813 6.0808c-0.12247-0.2008-0.28346-0.34054-0.43028-0.4324-0.17453-0.10926-0.36501-0.11264-0.49892-0.14965l0.063388 0.10705 0.0022039 0.0037967 0.0023089 0.0039022 0.067271 0.11949-0.70966 0.40361-0.065067-0.11559-0.10978-0.1853-0.038621-0.062224c-0.11313 0.16379-0.20528 0.40097-0.24841 0.71852 0.85784 2.2542 0.50616 3.1966-0.80946 3.8269-0.015532-0.0053786-0.02907-0.0090698-0.038516-0.0090698h-9.3819c-0.098441 0-0.17883-0.080891-0.17883-0.17971v-6.3596c0-0.098925 0.08039-0.17971 0.17883-0.17971h3.3528c0.1463 0 0.29133-0.027315 0.42766-0.080363l0.092984-0.16125c-0.63787-0.59102-1.1325-1.8017-1.2086-2.6698-0.0012594-0.014238-0.0012594-0.027632-0.0023088-0.041553h-2.6625c-1.7217 0-3.1174 1.4026-3.1174 3.1327v6.3596c0 1.7301 1.3957 3.1327 3.1174 3.1327h9.1164c0.18765 0 0.37445-0.029424 0.55328-0.087219 1.3051-0.42175 2.4628-1.1709 2.757-2.4129 0.60807-1.1847 0.66936-2.7502-0.2312-4.6819'/%3E%3C/g%3E%3Cg transform='translate%283 58.46%29'%3E%3Cpath d='m5.794 15.428c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.054e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087002 1.4233 0.55234 2.082'/%3E%3Cpath d='m3.8274 12.701c0.001889 7.383e-4 0.0036732 0.0012656 0.0055622 0.0017929 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.0070661-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2186e-4c0.037256 0 0.073778 0.036807 0.073778 0.074246l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 40.64%29'%3E%3Cpath d='m17.377 8.5671c-0.40121 0.049357-0.76727-0.5115-0.81744-1.2526-0.050165-0.74109 0.23466-1.3819 0.63598-1.4314 0.22564-0.027737 0.44025 0.13752 0.59379 0.41932 0.014693 0.027421 0.029175 0.056001 0.042819 0.085531 0.096027 0.20681 0.16151 0.46415 0.18082 0.74795 0.05006 0.74109-0.23456 1.3818-0.63598 1.4311m0.27318 3.7338c-0.30277-1.697 2.2422-3.7891 0.87348-6.4349v-1.0546e-4c-0.25355-0.48998-0.78238-1.9433-1.5057-2.2148-0.65876-0.77832-2.251-2.3071-3.4701-3.1623-1.76-1.2346-3.1705 2.6827-2.5527 3.2255 0.40793 0.35847 1.6273 0.54367 1.7981 0.86174l0.1888-0.30532 0.77388-0.27864c0.43721 0.33073 0.95376 0.5579 1.5451 0.69912l0.68027 0.12118c0.011334 0.0014765 0.022354 0.0031639 0.033583 0.0044295l-0.11408 0.97185c-0.88544-0.10525-1.7085-0.35162-2.4178-0.7992-0.58718 0.45392-1.2555 1.0718-1.8092 1.8133-0.8867 1.277-1.5846 2.7278-1.1325 4.0302 0.49504-1.0668 1.082-1.8757 1.7043-2.4235 0.7022-0.61802 1.4806-0.92629 2.209-0.75755 0.54625 0.12666 0.98577 0.52953 1.26 1.1073 0.091304 0.19268 0.16445 0.40466 0.21703 0.63226 0.20034 0.86765 0.15658 1.999-0.18807 3.4203 0.68363 0.13668 1.3032-0.080574 1.9065-0.51087'/%3E%3Cpath d='m14.66 9.5411l-0.097286 0.24626-0.0010495 0.0042186-0.0011544 0.0044295-0.036522 0.13236-0.78574-0.21894 0.035367-0.12793 0.052789-0.20913 0.016372-0.071294c-0.18901 0.03417-0.45337 0.029108-0.62391 0.30595-0.010914 0.017612-0.15018 0.276-0.15669 0.29572-0.73537 2.2486-3.3947 1.4306-6.0615 1.2467-0.10327-0.0070661-3.5133-0.39791-3.5133-0.39791-0.50973-0.10304-0.43837-0.34466-0.43837-0.44042v-6.3596c0-0.098925 0.080495-0.17971 0.17883-0.17971h7.1843c-0.24705-0.62603 0.064333-1.5771 0.18439-1.8982 0.13444-0.35932 0.31757-0.72717 0.54384-1.0547h-7.9125c-1.7217 0-3.1174 1.4026-3.1174 3.1327v6.3596c0 1.7301 1.3957 3.1327 3.1174 3.1327 0 0 3.036 0.32725 4.1752 0.39254 2.8306 0.16189 6.0343 0.7992 7.4377-3.0978 0.054678-0.22907 0.094873-0.59323 0.055832-0.7624-0.046492-0.20144-0.16802-0.31375-0.23666-0.43504'/%3E%3C/g%3E%3Cg transform='translate%283 20.82%29'%3E%3Cpath d='m15.575 3.8463c-0.24894 0.32008-0.90244 0.18361-1.4593-0.3049-0.55706-0.4883-0.80663-1.1438-0.55759-1.4638 0.1401-0.18013 0.40814-0.21557 0.71501-0.1254 0.0297 0.008859 0.059925 0.018773 0.09036 0.029846h1.049e-4c0.21336 0.078043 0.44078 0.21356 0.65393 0.40045 0.55696 0.48851 0.80663 1.1438 0.55748 1.4638m2.8205 2.4461c-1.4082-0.98482-1.0807-4.2724-3.9102-5.1708h-1.049e-4c-0.524-0.16632-1.9206-0.81819-2.6231-0.49621-1.0135-0.082367-3.1013-0.70798-4.565-0.44643-2.1131 0.37756-0.3542 4.1498 0.46471 4.0947 0.54048-0.03649 1.4191-0.095867 1.7636 0.0076989l-0.081334-0.35003 0.35126-0.74689c0.54184-0.076989 1.067-0.28328 1.5844-0.60367l0.5664-0.3977c0.0090254-0.0069606 0.018051-0.013605 0.026972-0.020776l0.60303 0.76841c-0.7001 0.55463-1.4554 0.96542-2.2721 1.1528-0.095712 0.73825-0.13349 1.6501-0.0032534 2.5678 0.2716 1.533 0.79886 3.0549 2.0352 3.6545-0.40079-1.1061-0.55486-2.095-0.50028-2.9247 0.061709-0.93599 0.39523-1.7072 1.0291-2.1054 0.47541-0.29867 1.0695-0.32599 1.67-0.11242 0.20013 0.071294 0.4009 0.16937 0.59841 0.29298 0.75205 0.471 1.517 1.3021 2.2736 2.552 0.57963-0.38916 0.86487-0.98303 0.98861-1.716'/%3E%3Cpath d='m15.313 7.1802c-0.12247-0.2008-0.28346-0.34054-0.43028-0.4324-0.17453-0.10926-0.36501-0.11264-0.49892-0.14965l0.063388 0.10705 0.0022039 0.0037967 0.0023088 0.0039022 0.067271 0.11949-0.70966 0.40361-0.065067-0.11559-0.10978-0.1853-0.038621-0.062224c-0.11313 0.16379-0.20528 0.40097-0.24841 0.71852 0.85784 2.2542 0.50616 3.1966-0.80946 3.8269-0.015532-0.0053786-0.02907-0.0090699-0.038516-0.0090699h-9.3819c-0.098441 0-0.17883-0.080891-0.17883-0.17971v-6.3596c0-0.098925 0.08039-0.17971 0.17883-0.17971h3.3528c0.1463 0 0.29133-0.027315 0.42766-0.080363l0.092984-0.16125c-0.63787-0.59102-1.1325-1.8017-1.2086-2.6698-0.0012594-0.014238-0.0012594-0.027632-0.0023088-0.041553h-2.6625c-1.7217 0-3.1174 1.4026-3.1174 3.1327v6.3596c0 1.7301 1.3957 3.1327 3.1174 3.1327h9.1164c0.18765 0 0.37445-0.029424 0.55328-0.087218 1.3051-0.42175 2.4628-1.1709 2.757-2.4129 0.60807-1.1847 0.66936-2.7502-0.2312-4.6819'/%3E%3C/g%3E%3C/g%3E%3Cg transform='translate%283 1%29' fill='%23D5BDD6'%3E%3Cpath d='m11.202 1.8024c0.053418 0.4381-0.55297 0.8378-1.3543 0.89265-0.80148 0.05463-1.4946-0.25628-1.5479-0.69448-0.02991-0.24647 0.14882-0.48081 0.45348-0.64839 0.029595-0.016136 0.06045-0.03185 0.092459-0.046826 0.22364-0.10483 0.50196-0.17644 0.80873-0.19732 0.80148-0.054841 1.4942 0.25607 1.5476 0.69437m4.0378-0.29825c-1.8351 0.33063-4.0974-2.4486-6.9584-0.95392l-1.0495e-4 1.0546e-4c-0.52978 0.27674-1.0802 0.70017-1.6522 1.3169-1.0516 0.34107-3.4064 0.58553-4.7676 1.4599-1.9651 1.2623 1.362 4.314 2.1613 3.9165 0.52757-0.2625 1.8362-0.81745 2.2249-0.85753l-0.22648-0.31745 0.23361-0.31207c0.35777-0.47743 0.60334-1.0416 0.75604-1.6872l0.13108-0.74289c0.0016792-0.012339 0.0034633-0.024468 0.0048276-0.036807l1.0509 0.12476c-0.11387 0.96679-0.38022 1.8657-0.86424 2.6402 0.49073 0.64122 1.159 1.371 1.9607 1.9757 1.3809 0.96816 2.9499 1.7304 4.3583 1.2366-1.1538-0.5405-2.0283-1.1814-2.6207-1.861-0.6682-0.76693-1.0017-1.6169-0.81912-2.4124 0.13696-0.5965 0.57259-1.0764 1.1973-1.3759 0.20832-0.099769 0.43753-0.1795 0.68373-0.23698 0.93823-0.21884 2.1614-0.17096 3.6984 0.20534 0.14798-0.74658-0.087002-1.4232-0.55223-2.0819'/%3E%3Cpath d='m13.162 4.5324c-0.0018891-7.3825e-4 -0.0036732-0.0012656-0.0055622-0.0017929-0.25744-0.062013-0.48591-0.034276-0.63252-1.0547e-4 -0.15259 0.035647-0.2715 0.11844-0.367 0.18498-0.037151 0.025839-0.071889 0.050201-0.10526 0.069395-0.018681 0.010546-0.02886 0.031428-0.026027 0.052837 0.0028335 0.021304 0.018261 0.038811 0.03904 0.044084l0.20874 0.055263-0.18985 0.68794-0.35808-0.091543c-0.016792-0.0040076-0.035052 0.0011601-0.047961 0.013183-0.012804 0.012234-0.018471 0.030057-0.015427 0.047564 0.03967 0.22116 0.15721 0.46562 0.33982 0.70703 0.0053523 0.0070661 0.012384 0.012656 0.020465 0.016241 2.3313 1.0468 2.2046 3.1414 2.058 5.567-0.018786 0.31006-0.038096 0.63078-0.051634 0.94548-4.198e-4 0.0023202-0.041979 0.23634-0.21115 0.45065-0.13675 0.17328-0.35777 0.25796-0.66232 0.24858l-9.4027-4.219e-4c-0.037256 0-0.073778-0.036807-0.073778-0.074246l-0.056987-5.532c-0.80579-0.14238-2.2168-1.3662-2.6936-2.4784-0.37151 0.52764-0.39786 0.95666-0.39786 1.6508v6.3596c0 1.7855 1.4454 3.2382 3.2222 3.2382h9.3819c1.6916 0 3.6583-1.4301 3.6582-3.2714l0.0072414-0.15472c0.19741-4.2307 0.33993-7.2874-3.6379-8.7342'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
button.icon-button i.fa-retweet:hover {
background-image: url("data:image/svg+xml;utf8,%3Csvg width='22px' height='209px' version='1.1' viewBox='0 0 22 209' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%238BB82D'%3E%3Cg transform='translate%283 191.19%29'%3E%3Cpath d='m11.202 1.8024c0.053418 0.4381-0.55297 0.8378-1.3543 0.89265-0.80148 0.05463-1.4946-0.25628-1.5479-0.69448-0.02991-0.24647 0.14882-0.48081 0.45348-0.64839 0.029595-0.016136 0.06045-0.03185 0.092459-0.046826 0.22364-0.10483 0.50196-0.17644 0.80873-0.19732 0.80148-0.054841 1.4942 0.25607 1.5476 0.69437m4.0378-0.29825c-1.8351 0.33063-4.0974-2.4486-6.9584-0.95392l-1.0495e-4 1.0546e-4c-0.52978 0.27674-1.0802 0.70017-1.6522 1.3169-1.0516 0.34107-3.4064 0.58553-4.7676 1.4599-1.9651 1.2623 1.362 4.314 2.1613 3.9165 0.52757-0.2625 1.8362-0.81745 2.2249-0.85753l-0.22648-0.31745 0.23361-0.31207c0.35777-0.47743 0.60334-1.0416 0.75604-1.6872l0.13108-0.74289c0.0016792-0.012339 0.0034633-0.024468 0.0048276-0.036807l1.0509 0.12476c-0.11387 0.96679-0.38022 1.8657-0.86424 2.6402 0.49073 0.64122 1.159 1.371 1.9607 1.9757 1.3809 0.96816 2.9499 1.7304 4.3583 1.2366-1.1538-0.5405-2.0283-1.1814-2.6207-1.861-0.6682-0.76693-1.0017-1.6169-0.81912-2.4124 0.13696-0.5965 0.57259-1.0764 1.1973-1.3759 0.20832-0.099769 0.43753-0.1795 0.68373-0.23698 0.93823-0.21884 2.1614-0.17096 3.6984 0.20534 0.14798-0.74658-0.087002-1.4232-0.55223-2.0819'/%3E%3Cpath d='m13.162 4.5324c-0.0018891-7.3825e-4 -0.0036732-0.0012656-0.0055622-0.0017929-0.25744-0.062013-0.48591-0.034276-0.63252-1.0547e-4 -0.15259 0.035647-0.2715 0.11844-0.367 0.18498-0.037151 0.025839-0.071889 0.050201-0.10526 0.069395-0.018681 0.010546-0.02886 0.031428-0.026027 0.052837 0.0028335 0.021304 0.018261 0.038811 0.03904 0.044084l0.20874 0.055263-0.18985 0.68794-0.35808-0.091543c-0.016792-0.0040076-0.035052 0.0011601-0.047961 0.013183-0.012804 0.012234-0.018471 0.030057-0.015427 0.047564 0.03967 0.22116 0.15721 0.46562 0.33982 0.70703 0.0053523 0.0070661 0.012384 0.012656 0.020465 0.016241 2.3313 1.0468 2.2046 3.1414 2.058 5.567-0.018786 0.31006-0.038096 0.63078-0.051634 0.94548-4.198e-4 0.0023202-0.041979 0.23634-0.21115 0.45065-0.13675 0.17328-0.35777 0.25796-0.66232 0.24858l-9.4027-4.219e-4c-0.037256 0-0.073778-0.036807-0.073778-0.074246l-0.056987-5.532c-0.80579-0.14238-2.2168-1.3662-2.6936-2.4784-0.37151 0.52764-0.39786 0.95666-0.39786 1.6508v6.3596c0 1.7855 1.4454 3.2382 3.2222 3.2382h9.3819c1.6916 0 3.6583-1.4301 3.6582-3.2714l0.0072414-0.15472c0.19741-4.2307 0.33993-7.2874-3.6379-8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 133%29'%3E%3Cpath transform='translate%288.5407 5.5337%29 rotate%28180%29 translate%28-8.5407 -5.5337%29' d='m5.8815 8.495c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.0547e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087001 1.4233 0.55234 2.082'/%3E%3Cpath transform='translate%288.7093 11.363%29 rotate%28180%29 translate%28-8.7093 -11.363%29' d='m4.2522 17.424c0.0018891 7.382e-4 0.0036732 0.0012655 0.0055622 0.0017928 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.007066-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2185e-4c0.037256 0 0.073778 0.036807 0.073778 0.074247l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 152%29'%3E%3Cpath transform='translate%288.5407 5.5337%29 rotate%28180%29 translate%28-8.5407 -5.5337%29' d='m5.8815 8.495c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.0547e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087001 1.4233 0.55234 2.082'/%3E%3Cpath transform='translate%288.7093 11.363%29 rotate%28180%29 translate%28-8.7093 -11.363%29' d='m4.2522 17.424c0.0018891 7.382e-4 0.0036732 0.0012655 0.0055622 0.0017928 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.007066-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2185e-4c0.037256 0 0.073778 0.036807 0.073778 0.074247l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 171.6%29'%3E%3Cpath transform='translate%288.5407 5.5337%29 rotate%28180%29 translate%28-8.5407 -5.5337%29' d='m5.8815 8.495c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.0547e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087001 1.4233 0.55234 2.082'/%3E%3Cpath transform='translate%288.7093 11.363%29 rotate%28180%29 translate%28-8.7093 -11.363%29' d='m4.2522 17.424c0.0018891 7.382e-4 0.0036732 0.0012655 0.0055622 0.0017928 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.007066-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2185e-4c0.037256 0 0.073778 0.036807 0.073778 0.074247l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 113.92%29'%3E%3Cpath transform='translate%288.5407 5.5337%29 rotate%28180%29 translate%28-8.5407 -5.5337%29' d='m5.8815 8.495c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.0547e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087001 1.4233 0.55234 2.082'/%3E%3Cpath transform='translate%288.7093 11.363%29 rotate%28180%29 translate%28-8.7093 -11.363%29' d='m4.2522 17.424c0.0018891 7.382e-4 0.0036732 0.0012655 0.0055622 0.0017928 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.007066-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2185e-4c0.037256 0 0.073778 0.036807 0.073778 0.074247l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%281 98.1%29'%3E%3Cpath transform='translate%284.2656 7.449%29 rotate%28180%29 translate%28-4.2656 -7.449%29' d='m6.9773 9.4652c-0.40121 0.049357-0.76727-0.5115-0.81744-1.2526-0.050165-0.74109 0.23466-1.3819 0.63598-1.4314 0.22564-0.027737 0.44025 0.13752 0.59379 0.41932 0.014693 0.027421 0.029175 0.056001 0.042819 0.085531 0.096027 0.20681 0.16151 0.46415 0.18082 0.74795 0.05006 0.74109-0.23456 1.3818-0.63598 1.4311m0.27318 3.7338c-0.30277-1.697 2.2422-3.7891 0.87348-6.4349v-1.0546e-4c-0.25355-0.48998-0.78238-1.9433-1.5057-2.2148-0.65876-0.77832-2.251-2.3071-3.4701-3.1623-1.76-1.2346-3.1705 2.6827-2.5527 3.2255 0.40793 0.35847 1.6273 0.54367 1.7981 0.86174l0.1888-0.30532 0.77388-0.27864c0.43721 0.33073 0.95376 0.5579 1.5451 0.69912l0.68027 0.12118c0.011334 0.0014765 0.022354 0.0031639 0.033583 0.0044295l-0.11408 0.97185c-0.88544-0.10525-1.7085-0.35162-2.4178-0.7992-0.58718 0.45392-1.2555 1.0718-1.8092 1.8133-0.8867 1.277-1.5846 2.7278-1.1325 4.0302 0.49504-1.0668 1.082-1.8757 1.7043-2.4235 0.7022-0.61802 1.4806-0.92629 2.209-0.75755 0.54625 0.12666 0.98577 0.52953 1.26 1.1073 0.091304 0.19268 0.16445 0.40466 0.21703 0.63226 0.20034 0.86765 0.15658 1.999-0.18807 3.4203 0.68363 0.13668 1.3032-0.080574 1.9065-0.51087'/%3E%3Cpath transform='translate%2811.421 6.603%29 rotate%28180%29 translate%28-11.421 -6.603%29' d='m18.57 8.7472l-0.097286 0.24626-0.0010495 0.0042186-0.0011544 0.0044295-0.036522 0.13236-0.78574-0.21894 0.035367-0.12793 0.052789-0.20913 0.016372-0.071294c-0.18901 0.03417-0.45337 0.029108-0.62391 0.30595-0.010914 0.017612-0.15018 0.276-0.15669 0.29572-0.73537 2.2486-3.3947 1.4306-6.0615 1.2467-0.10327-0.007066-3.5133-0.39791-3.5133-0.39791-0.50973-0.10304-0.43837-0.34466-0.43837-0.44042v-6.3596c0-0.098925 0.080495-0.17971 0.17883-0.17971h7.1843c-0.24705-0.62603 0.064333-1.5771 0.18439-1.8982 0.13444-0.35932 0.31757-0.72717 0.54384-1.0547h-7.9125c-1.7217 0-3.1174 1.4026-3.1174 3.1327v6.3596c0 1.7301 1.3957 3.1327 3.1174 3.1327 0 0 3.036 0.32725 4.1752 0.39254 2.8306 0.16189 6.0343 0.7992 7.4377-3.0978 0.054678-0.22907 0.094873-0.59323 0.055832-0.7624-0.046492-0.20144-0.16802-0.31375-0.23666-0.43504'/%3E%3C/g%3E%3Cg transform='translate%281 78.28%29'%3E%3Cpath transform='translate%286.1503 9.7893%29 rotate%28180%29 translate%28-6.1503 -9.7893%29' d='m9.3801 8.4249c-0.24894 0.32008-0.90244 0.18361-1.4593-0.3049-0.55706-0.4883-0.80663-1.1438-0.55759-1.4638 0.1401-0.18013 0.40814-0.21557 0.71501-0.1254 0.0297 0.008859 0.059925 0.018773 0.09036 0.029846h1.0495e-4c0.21336 0.078043 0.44078 0.21356 0.65393 0.40045 0.55696 0.48851 0.80663 1.1438 0.55748 1.4638m2.8205 2.4461c-1.4082-0.98482-1.0807-4.2724-3.9102-5.1708h-1.0495e-4c-0.524-0.16632-1.9206-0.81819-2.6231-0.49621-1.0135-0.082367-3.1013-0.70798-4.565-0.44643-2.1131 0.37756-0.3542 4.1498 0.46471 4.0947 0.54048-0.03649 1.4191-0.095867 1.7636 0.0076988l-0.081334-0.35003 0.35126-0.74689c0.54184-0.076989 1.067-0.28328 1.5844-0.60367l0.5664-0.3977c0.0090255-0.0069606 0.018051-0.013605 0.026972-0.020776l0.60303 0.76841c-0.7001 0.55463-1.4554 0.96542-2.2721 1.1528-0.095712 0.73825-0.13349 1.6501-0.0032534 2.5678 0.2716 1.533 0.79886 3.0549 2.0352 3.6545-0.40079-1.1061-0.55486-2.095-0.50028-2.9247 0.061709-0.93599 0.39523-1.7072 1.0291-2.1054 0.47541-0.29867 1.0695-0.32599 1.67-0.11242 0.20013 0.071294 0.4009 0.16937 0.59841 0.29298 0.75205 0.471 1.517 1.3021 2.2736 2.552 0.57963-0.38916 0.86487-0.98303 0.98861-1.716'/%3E%3Cpath transform='translate%2810.498 6.9503%29 rotate%28180%29 translate%28-10.498 -6.9503%29' d='m17.813 6.0808c-0.12247-0.2008-0.28346-0.34054-0.43028-0.4324-0.17453-0.10926-0.36501-0.11264-0.49892-0.14965l0.063388 0.10705 0.0022039 0.0037967 0.0023089 0.0039022 0.067271 0.11949-0.70966 0.40361-0.065067-0.11559-0.10978-0.1853-0.038621-0.062224c-0.11313 0.16379-0.20528 0.40097-0.24841 0.71852 0.85784 2.2542 0.50616 3.1966-0.80946 3.8269-0.015532-0.0053786-0.02907-0.0090698-0.038516-0.0090698h-9.3819c-0.098441 0-0.17883-0.080891-0.17883-0.17971v-6.3596c0-0.098925 0.08039-0.17971 0.17883-0.17971h3.3528c0.1463 0 0.29133-0.027315 0.42766-0.080363l0.092984-0.16125c-0.63787-0.59102-1.1325-1.8017-1.2086-2.6698-0.0012594-0.014238-0.0012594-0.027632-0.0023088-0.041553h-2.6625c-1.7217 0-3.1174 1.4026-3.1174 3.1327v6.3596c0 1.7301 1.3957 3.1327 3.1174 3.1327h9.1164c0.18765 0 0.37445-0.029424 0.55328-0.087219 1.3051-0.42175 2.4628-1.1709 2.757-2.4129 0.60807-1.1847 0.66936-2.7502-0.2312-4.6819'/%3E%3C/g%3E%3Cg transform='translate%283 58.46%29'%3E%3Cpath d='m5.794 15.428c-0.053418-0.4382 0.55297-0.83791 1.3543-0.89275 0.80148-0.05463 1.4946 0.25628 1.5479 0.69448 0.02991 0.24647-0.14882 0.48081-0.45348 0.64839-0.029595 0.016241-0.06045 0.03185-0.092459 0.046826-0.22364 0.10483-0.50196 0.17644-0.80873 0.19732-0.80138 0.054841-1.4942-0.25607-1.5476-0.69427m-4.0376 0.29825c1.8351-0.33073 4.0974 2.4484 6.9583 0.95381l1.0495e-4 -1.054e-4c0.52978-0.27674 1.0802-0.70017 1.6522-1.3169 1.0516-0.34107 3.4064-0.58553 4.7676-1.4599 1.9651-1.2623-1.362-4.314-2.1613-3.9165-0.52757 0.2625-1.8362 0.81745-2.2249 0.85753l0.22648 0.31745-0.23361 0.31207c-0.35777 0.47743-0.60334 1.0416-0.75604 1.6872l-0.13108 0.74289c-0.0016792 0.012445-0.0034633 0.024468-0.0048276 0.036807l-1.0509-0.12476c0.11387-0.96668 0.38022-1.8655 0.86424-2.6402-0.49073-0.64122-1.159-1.371-1.9607-1.9757-1.3809-0.96816-2.9499-1.7304-4.3583-1.2366 1.1538 0.5405 2.0284 1.1814 2.6207 1.8611 0.6682 0.76683 1.0017 1.6168 0.81912 2.4123-0.13696 0.5965-0.57249 1.0764-1.1973 1.3759-0.20832 0.099769-0.43742 0.1796-0.68373 0.23708-0.93823 0.21873-2.1614 0.17085-3.6984-0.20544-0.14798 0.74658 0.087002 1.4233 0.55234 2.082'/%3E%3Cpath d='m3.8274 12.701c0.001889 7.383e-4 0.0036732 0.0012656 0.0055622 0.0017929 0.25744 0.062013 0.48591 0.034276 0.63252 1.055e-4 0.15259-0.035647 0.2715-0.11844 0.367-0.18498 0.037151-0.025839 0.071889-0.050201 0.10526-0.069395 0.018681-0.010546 0.028861-0.031428 0.026027-0.052837-0.0028336-0.021304-0.018261-0.038811-0.03904-0.044084l-0.20874-0.055263 0.18985-0.68794 0.35808 0.091543c0.016792 0.0040076 0.035052-0.0011601 0.047961-0.013183 0.012804-0.012234 0.018471-0.030057 0.015427-0.047564-0.03967-0.22116-0.15721-0.46562-0.33982-0.70703-0.0053523-0.0070661-0.012384-0.012656-0.020465-0.016241-2.3313-1.0468-2.2046-3.1414-2.058-5.567 0.018786-0.31006 0.038096-0.63078 0.051634-0.94548 4.1979e-4 -0.0023202 0.041979-0.23634 0.21115-0.45065 0.13675-0.17328 0.35777-0.25796 0.66232-0.24858l9.4027 4.2186e-4c0.037256 0 0.073778 0.036807 0.073778 0.074246l0.056986 5.532c0.80579 0.14238 2.2168 1.3662 2.6936 2.4784 0.37151-0.52764 0.39786-0.95666 0.39786-1.6508v-6.3596c0-1.7855-1.4454-3.2382-3.2222-3.2382h-9.3819c-1.6916 0-3.6583 1.4301-3.6582 3.2714l-0.0072414 0.15472c-0.19741 4.2307-0.33993 7.2874 3.6379 8.7342'/%3E%3C/g%3E%3Cg transform='translate%283 40.64%29'%3E%3Cpath d='m17.377 8.5671c-0.40121 0.049357-0.76727-0.5115-0.81744-1.2526-0.050165-0.74109 0.23466-1.3819 0.63598-1.4314 0.22564-0.027737 0.44025 0.13752 0.59379 0.41932 0.014693 0.027421 0.029175 0.056001 0.042819 0.085531 0.096027 0.20681 0.16151 0.46415 0.18082 0.74795 0.05006 0.74109-0.23456 1.3818-0.63598 1.4311m0.27318 3.7338c-0.30277-1.697 2.2422-3.7891 0.87348-6.4349v-1.0546e-4c-0.25355-0.48998-0.78238-1.9433-1.5057-2.2148-0.65876-0.77832-2.251-2.3071-3.4701-3.1623-1.76-1.2346-3.1705 2.6827-2.5527 3.2255 0.40793 0.35847 1.6273 0.54367 1.7981 0.86174l0.1888-0.30532 0.77388-0.27864c0.43721 0.33073 0.95376 0.5579 1.5451 0.69912l0.68027 0.12118c0.011334 0.0014765 0.022354 0.0031639 0.033583 0.0044295l-0.11408 0.97185c-0.88544-0.10525-1.7085-0.35162-2.4178-0.7992-0.58718 0.45392-1.2555 1.0718-1.8092 1.8133-0.8867 1.277-1.5846 2.7278-1.1325 4.0302 0.49504-1.0668 1.082-1.8757 1.7043-2.4235 0.7022-0.61802 1.4806-0.92629 2.209-0.75755 0.54625 0.12666 0.98577 0.52953 1.26 1.1073 0.091304 0.19268 0.16445 0.40466 0.21703 0.63226 0.20034 0.86765 0.15658 1.999-0.18807 3.4203 0.68363 0.13668 1.3032-0.080574 1.9065-0.51087'/%3E%3Cpath d='m14.66 9.5411l-0.097286 0.24626-0.0010495 0.0042186-0.0011544 0.0044295-0.036522 0.13236-0.78574-0.21894 0.035367-0.12793 0.052789-0.20913 0.016372-0.071294c-0.18901 0.03417-0.45337 0.029108-0.62391 0.30595-0.010914 0.017612-0.15018 0.276-0.15669 0.29572-0.73537 2.2486-3.3947 1.4306-6.0615 1.2467-0.10327-0.0070661-3.5133-0.39791-3.5133-0.39791-0.50973-0.10304-0.43837-0.34466-0.43837-0.44042v-6.3596c0-0.098925 0.080495-0.17971 0.17883-0.17971h7.1843c-0.24705-0.62603 0.064333-1.5771 0.18439-1.8982 0.13444-0.35932 0.31757-0.72717 0.54384-1.0547h-7.9125c-1.7217 0-3.1174 1.4026-3.1174 3.1327v6.3596c0 1.7301 1.3957 3.1327 3.1174 3.1327 0 0 3.036 0.32725 4.1752 0.39254 2.8306 0.16189 6.0343 0.7992 7.4377-3.0978 0.054678-0.22907 0.094873-0.59323 0.055832-0.7624-0.046492-0.20144-0.16802-0.31375-0.23666-0.43504'/%3E%3C/g%3E%3Cg transform='translate%283 20.82%29'%3E%3Cpath d='m15.575 3.8463c-0.24894 0.32008-0.90244 0.18361-1.4593-0.3049-0.55706-0.4883-0.80663-1.1438-0.55759-1.4638 0.1401-0.18013 0.40814-0.21557 0.71501-0.1254 0.0297 0.008859 0.059925 0.018773 0.09036 0.029846h1.049e-4c0.21336 0.078043 0.44078 0.21356 0.65393 0.40045 0.55696 0.48851 0.80663 1.1438 0.55748 1.4638m2.8205 2.4461c-1.4082-0.98482-1.0807-4.2724-3.9102-5.1708h-1.049e-4c-0.524-0.16632-1.9206-0.81819-2.6231-0.49621-1.0135-0.082367-3.1013-0.70798-4.565-0.44643-2.1131 0.37756-0.3542 4.1498 0.46471 4.0947 0.54048-0.03649 1.4191-0.095867 1.7636 0.0076989l-0.081334-0.35003 0.35126-0.74689c0.54184-0.076989 1.067-0.28328 1.5844-0.60367l0.5664-0.3977c0.0090254-0.0069606 0.018051-0.013605 0.026972-0.020776l0.60303 0.76841c-0.7001 0.55463-1.4554 0.96542-2.2721 1.1528-0.095712 0.73825-0.13349 1.6501-0.0032534 2.5678 0.2716 1.533 0.79886 3.0549 2.0352 3.6545-0.40079-1.1061-0.55486-2.095-0.50028-2.9247 0.061709-0.93599 0.39523-1.7072 1.0291-2.1054 0.47541-0.29867 1.0695-0.32599 1.67-0.11242 0.20013 0.071294 0.4009 0.16937 0.59841 0.29298 0.75205 0.471 1.517 1.3021 2.2736 2.552 0.57963-0.38916 0.86487-0.98303 0.98861-1.716'/%3E%3Cpath d='m15.313 7.1802c-0.12247-0.2008-0.28346-0.34054-0.43028-0.4324-0.17453-0.10926-0.36501-0.11264-0.49892-0.14965l0.063388 0.10705 0.0022039 0.0037967 0.0023088 0.0039022 0.067271 0.11949-0.70966 0.40361-0.065067-0.11559-0.10978-0.1853-0.038621-0.062224c-0.11313 0.16379-0.20528 0.40097-0.24841 0.71852 0.85784 2.2542 0.50616 3.1966-0.80946 3.8269-0.015532-0.0053786-0.02907-0.0090699-0.038516-0.0090699h-9.3819c-0.098441 0-0.17883-0.080891-0.17883-0.17971v-6.3596c0-0.098925 0.08039-0.17971 0.17883-0.17971h3.3528c0.1463 0 0.29133-0.027315 0.42766-0.080363l0.092984-0.16125c-0.63787-0.59102-1.1325-1.8017-1.2086-2.6698-0.0012594-0.014238-0.0012594-0.027632-0.0023088-0.041553h-2.6625c-1.7217 0-3.1174 1.4026-3.1174 3.1327v6.3596c0 1.7301 1.3957 3.1327 3.1174 3.1327h9.1164c0.18765 0 0.37445-0.029424 0.55328-0.087218 1.3051-0.42175 2.4628-1.1709 2.757-2.4129 0.60807-1.1847 0.66936-2.7502-0.2312-4.6819'/%3E%3C/g%3E%3C/g%3E%3Cg transform='translate%283 1%29' fill='%238A7CA1'%3E%3Cpath d='m11.202 1.8024c0.053418 0.4381-0.55297 0.8378-1.3543 0.89265-0.80148 0.05463-1.4946-0.25628-1.5479-0.69448-0.02991-0.24647 0.14882-0.48081 0.45348-0.64839 0.029595-0.016136 0.06045-0.03185 0.092459-0.046826 0.22364-0.10483 0.50196-0.17644 0.80873-0.19732 0.80148-0.054841 1.4942 0.25607 1.5476 0.69437m4.0378-0.29825c-1.8351 0.33063-4.0974-2.4486-6.9584-0.95392l-1.0495e-4 1.0546e-4c-0.52978 0.27674-1.0802 0.70017-1.6522 1.3169-1.0516 0.34107-3.4064 0.58553-4.7676 1.4599-1.9651 1.2623 1.362 4.314 2.1613 3.9165 0.52757-0.2625 1.8362-0.81745 2.2249-0.85753l-0.22648-0.31745 0.23361-0.31207c0.35777-0.47743 0.60334-1.0416 0.75604-1.6872l0.13108-0.74289c0.0016792-0.012339 0.0034633-0.024468 0.0048276-0.036807l1.0509 0.12476c-0.11387 0.96679-0.38022 1.8657-0.86424 2.6402 0.49073 0.64122 1.159 1.371 1.9607 1.9757 1.3809 0.96816 2.9499 1.7304 4.3583 1.2366-1.1538-0.5405-2.0283-1.1814-2.6207-1.861-0.6682-0.76693-1.0017-1.6169-0.81912-2.4124 0.13696-0.5965 0.57259-1.0764 1.1973-1.3759 0.20832-0.099769 0.43753-0.1795 0.68373-0.23698 0.93823-0.21884 2.1614-0.17096 3.6984 0.20534 0.14798-0.74658-0.087002-1.4232-0.55223-2.0819'/%3E%3Cpath d='m13.162 4.5324c-0.0018891-7.3825e-4 -0.0036732-0.0012656-0.0055622-0.0017929-0.25744-0.062013-0.48591-0.034276-0.63252-1.0547e-4 -0.15259 0.035647-0.2715 0.11844-0.367 0.18498-0.037151 0.025839-0.071889 0.050201-0.10526 0.069395-0.018681 0.010546-0.02886 0.031428-0.026027 0.052837 0.0028335 0.021304 0.018261 0.038811 0.03904 0.044084l0.20874 0.055263-0.18985 0.68794-0.35808-0.091543c-0.016792-0.0040076-0.035052 0.0011601-0.047961 0.013183-0.012804 0.012234-0.018471 0.030057-0.015427 0.047564 0.03967 0.22116 0.15721 0.46562 0.33982 0.70703 0.0053523 0.0070661 0.012384 0.012656 0.020465 0.016241 2.3313 1.0468 2.2046 3.1414 2.058 5.567-0.018786 0.31006-0.038096 0.63078-0.051634 0.94548-4.198e-4 0.0023202-0.041979 0.23634-0.21115 0.45065-0.13675 0.17328-0.35777 0.25796-0.66232 0.24858l-9.4027-4.219e-4c-0.037256 0-0.073778-0.036807-0.073778-0.074246l-0.056987-5.532c-0.80579-0.14238-2.2168-1.3662-2.6936-2.4784-0.37151 0.52764-0.39786 0.95666-0.39786 1.6508v6.3596c0 1.7855 1.4454 3.2382 3.2222 3.2382h9.3819c1.6916 0 3.6583-1.4301 3.6582-3.2714l0.0072414-0.15472c0.19741-4.2307 0.33993-7.2874-3.6379-8.7342'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
button.icon-button.disabled i.fa-retweet {
background-image: url("data:image/svg+xml;utf8,");
}