:root {
  --font-family: 'Arial', 'Helvetica', 'sans-serif' !important;
  --mud-typography-default-family: var(--font-family) !important;
  --mud-typography-h1-family: var(--font-family) !important;
  --mud-typography-h2-family: var(--font-family) !important;
  --mud-typography-h3-family: var(--font-family) !important;
  --mud-typography-h4-family: var(--font-family) !important;
  --mud-typography-h5-family: var(--font-family) !important;
  --mud-typography-h6-family: var(--font-family) !important;
  --mud-typography-subtitle1-family: var(--font-family) !important;
  --mud-typography-subtitle2-family: var(--font-family) !important;
  --mud-typography-body1-family: var(--font-family) !important;
  --mud-typography-body2-family: var(--font-family) !important;
  --mud-typography-button-family: var(--font-family) !important;
  --mud-typography-caption-family: var(--font-family) !important;
  --mud-typography-overline-family: var(--font-family) !important;
  --mud-palette-text-primary: white !important;
  --mud-typography-default-lineheight: 1.45em !important;
}

/* header menu */
header button:hover span {
  text-decoration: underline;
}
/* header menu end */

.btn_link {
  text-transform: none;
  font-size: .9em;
  min-width: auto;
  color: var(--mud-palette-action-disabled);
  text-decoration: underline;
}

.comment:hover .btn_link:hover,
.btn_link:hover {
  color: var(--mud-palette-secondary);
  background-color: transparent;
  transition: .2s;
}

.mud-input.mud-input-filled,
.mud-input.mud-input-filled:hover {
  background-color: var(--mud-palette-action-disabled-background);
  border-radius: 0;
}


.comment:hover .btn_link {
  color: var(--icon-dark);
  transition: .2s;
}

.comment_reply .comment_form {
  margin-left: 24px;
}

.mud-input > textarea.mud-input-root.mud-input-root-filled {
  margin: 0.8em;
  font-size: .9em;
}

.mud-input-control > .mud-input-control-input-container > .mud-input-label-inputcontrol {
  margin-top: -8px;
  font-size: 1em;
}

.mud-grid-spacing-xs-1 > .mud-grid-item {
  padding: 3px;
}

#blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}

#blazor-error-ui .dismiss {
  cursor: pointer;
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
}

.blazor-error-boundary {
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
  padding: 1rem 1rem 1rem 3.7rem;
  color: white;
}

.blazor-error-boundary::after {
  content: "An error has occurred."
}

/* DigitClubTheme start */

body {
  position: relative;
}

body::before {
  content: '';
  background-image: url('https://lensman.sitko.ru/digitclub/assets/pics/bg.png');
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
  opacity: .2;
}

/* buttons */
.mud-button-label {
  line-height: 1em;
}

.mud-button {
  min-width: 30px;
}

.mud-button-outlined {
  color: var(--mud-palette-text-primary);
  border: 1px solid var(--mud-palette-lines-default);
  padding: 5px 15px;
}

.mud-appbar-dense ~ .mud-main-content {
  padding-top: calc(var(--mud-appbar-height) - var(--mud-appbar-height) / 1.4);
}

.mud-appbar.mud-appbar-dense .mud-toolbar-appbar {
  height: calc(var(--mud-appbar-height) - var(--mud-appbar-height) / 1.4);
}

img {
  max-width: 100%;
}

a:hover,
a.mud-typography:hover,
a:hover .mud-typography {
  color: var(--mud-palette-secondary) !important;
}

.theme-checker {
  color: black;
  display: flex;
  gap: 0.3em;
  align-items: center;
  text-transform: uppercase;
}

/* postcard */

.postcard {
  display: flex;
  flex-direction: column;
  padding: 6px;
  gap: 6px;
}

.postcard > * {
  padding: 0;
}
.postcard.viewed {
  opacity: .7;
}

.postcard .mud-card-content > a {
  display: block;
  line-height: 0;
}

.postcard a .title {
  text-decoration: var(--link-decotation);
}

.mud-paper-outlined:hover {
  border-color: rgba(255, 255, 255, .3);
  transition: .2s;
}

.postcard_rating {
  font-size: .8em;
  border-radius: var(--mud-default-borderradius);
  background-color: var(--mud-palette-action-disabled-background);
  display: flex;
  align-items: center;
}

.postcard_rating.voted_up {
  background-color: var(--mud-palette-secondary);
  color: var(--black);
}

.postcard_rating.voted_down {
  opacity: .3;
}

.postcard_rating:hover {
  background-color: var(--mud-palette-action-disabled) !important;
  transition: .2s;
}


.postcard_rating:hover button .mud-icon-root.mud-svg-icon {
  fill: var(--white);
}

.postcard_rating button:hover .mud-icon-root.mud-svg-icon {
  fill: var(--mud-palette-secondary);
}

.postcard_rating .mud-icon-button-size-small {
  padding: 1px;
}

.postcard_views {
  display: flex;
  align-items: center;
  flex-direction: inherit;
  gap: 0.2em;
  font-size: .8em;
}

.postcard_views .mud-icon-size-small {
  font-size: 1.2em;
  fill: var(--icon-dark);
}

/* userinfomini */

.mud-card-header-avatar {
  display: flex;
}

.userinfomini {
  display: inline-flex;
  align-items: center;
}

td .userinfomini {
  display: flex; /* table alignment fix */
}

.userinfomini a {
  display: flex;
  align-items: center;
  color: var(--mud-palette-secondary);
}

.userinfomini .mud-avatar.mud-avatar-small {
  width: 20px;
  height: 20px;
}

.userinfomini a:hover span {
  text-decoration: var(--link-decotation);
}

.mud-input-helper-text {
  color: var(--mud-palette-text-disabled);
}

.mud-main-content {
  min-height: calc(100vh - (var(--mud-appbar-height) - var(--mud-appbar-height) / 1.5) - 1px);
}

/* DigitClubTheme end */

/* Chips Digit style start */
.mud-chip.mud-chip-size-small {
  font-size: 11px;
  height: 20px;
  padding: 0 8px;
  margin: 0;
}

.post-chips {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
}

.mud-card-header-content {
  display: flex;
}

.mud-card-header .mud-card-header-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 0.8em;
  margin: 0;
  padding: 0;
}

.mud-card-header-actions .mud-button-icon-size-small {
  margin: 0;
  padding: 0;
  margin-inline-end: 0 !important;
}

.mud-card-header-actions .mud-button {
  min-width: auto;
  padding: 1px 5px;
}

.mud-icon-size-small {
  font-size: 1rem;
}

.post-chips .mud-chip.mud-chip-size-medium {
  margin: 0;
}

.mud-chip.mud-chip-size-medium {
  font-size: .8rem;
  padding: 0 14px;
  height: 29px;
}


.mud-chip-color-transparent {
  background-color: var(--mud-palette-transparent);
}

/* Chips Digit style end*/

/* blockly-form start */
.blockly-form .mud-card-content {
  padding: 0;
}

.blockly-form svg.mud-icon-root.mud-svg-icon.mud-inherit-text.mud-icon-size-medium.plus-icon.plus-icon_default {
  margin-bottom: 0;
}

/* blockly-form end */

/* masonry sizing start */
@media screen and (min-width: 1920px) {
  .grid-sizer {
    width: 20%;
  }
}

@media screen and (min-width: 1440px) and (max-width: 1919px) {
  .grid-sizer {
    width: 20%;
  }
}

@media screen and (min-width: 1024px) and (max-width: 1439px) {
  .grid-sizer {
    width: 25%;
  }
}

@media screen and (min-width: 800px) and (max-width: 1023px) {
  .grid-sizer {
    width: 33.3333%;
  }
}

@media screen and (min-width: 550px) and (max-width: 799px) {
  .grid-sizer {
    width: 50%;
  }
}

@media screen and (max-width: 549px) {
  .grid-sizer {
    width: 100%;
  }
}

/* masonry sizing end */

/* blockly hover offset fix */
.add-block-panel .plus-icon.plus-icon_default {
  height: 30px !important;
  width: 30px !important;
  padding: 4px !important;
}


/* blockly styles */
.blockly.blockly-textblock {
  margin-bottom: 1em;
}

.blockly ol {
  list-style: decimal-leading-zero;
  margin-left: 24px;
}

.blockly ul {
  list-style: disc;
  margin-left: 16px;
}

.blockly ul ::marker,
.blockly ol ::marker {
  color: var(--mud-palette-secondary);
}